From d5b2b48fa57221bcdb800c7d36a56189ae946c7d Mon Sep 17 00:00:00 2001 From: Artur Arseniev Date: Thu, 26 Jan 2023 11:53:40 +0400 Subject: [PATCH] Refactor for TS bundle --- src/abstract/Module.ts | 3 +- src/abstract/ModuleCollection.ts | 4 +- src/abstract/ModuleDomainViews.ts | 4 +- src/abstract/ModuleModel.ts | 10 +- src/abstract/ModuleView.ts | 7 +- src/block_manager/index.ts | 1 - src/block_manager/view/BlocksView.ts | 3 +- src/block_manager/view/CategoryView.ts | 2 +- src/canvas/model/Frame.ts | 3 +- src/canvas/view/FrameView.ts | 4 +- src/common/Collection.ts | 1 - src/common/Model.ts | 1 - src/common/View.ts | 1 - src/common/index.ts | 16 ++- src/css_composer/index.ts | 2 +- src/css_composer/model/CssRules.ts | 2 +- src/dom_components/model/Component.ts | 136 +------------------- src/dom_components/model/ComponentMap.ts | 2 +- src/dom_components/model/Components.ts | 9 +- src/dom_components/view/ComponentView.ts | 13 +- src/dom_components/view/ComponentsView.ts | 3 +- src/domain_abstract/model/StyleableModel.ts | 3 +- src/editor/index.ts | 103 +++++++++------ src/editor/model/Editor.ts | 9 +- src/keymaps/index.ts | 2 +- src/modal_dialog/index.ts | 2 +- src/navigator/view/ItemView.ts | 2 +- src/pages/index.ts | 3 +- src/pages/model/Page.ts | 8 +- src/selector_manager/index.ts | 9 +- src/storage_manager/index.ts | 2 +- src/style_manager/index.ts | 6 +- src/style_manager/model/Property.ts | 2 +- src/style_manager/model/Sectors.ts | 2 +- src/trait_manager/model/Traits.ts | 2 +- src/trait_manager/view/TraitView.ts | 2 +- src/utils/Sorter.ts | 2 +- src/utils/cash-dom.ts | 2 +- src/utils/extender.ts | 31 ----- 39 files changed, 144 insertions(+), 275 deletions(-) delete mode 100644 src/common/Collection.ts delete mode 100644 src/common/Model.ts delete mode 100644 src/common/View.ts diff --git a/src/abstract/Module.ts b/src/abstract/Module.ts index 2153cc23c..292e63605 100644 --- a/src/abstract/Module.ts +++ b/src/abstract/Module.ts @@ -130,8 +130,7 @@ export abstract class ItemManagerModule< abstract storageKey: string; abstract destroy(): void; postLoad(key: any): void {} - // @ts-ignore - render() {} + render(opts?: any) {} getProjectData(data?: any) { const obj: any = {}; diff --git a/src/abstract/ModuleCollection.ts b/src/abstract/ModuleCollection.ts index d0f1f2c3e..dcb562a6d 100644 --- a/src/abstract/ModuleCollection.ts +++ b/src/abstract/ModuleCollection.ts @@ -1,11 +1,11 @@ -import Backbone, { AddOptions } from 'backbone'; import { isArray, isUndefined } from 'underscore'; +import { AddOptions, Collection } from '../common'; import ModuleModel from './ModuleModel'; type ModuleExt = TModel extends ModuleModel ? M : unknown; type ModelConstructor = { new (mod: ModuleExt, attr: any): TModel }; -export default class ModuleCollection extends Backbone.Collection { +export default class ModuleCollection extends Collection { module!: ModuleExt; private newModel!: ModelConstructor; diff --git a/src/abstract/ModuleDomainViews.ts b/src/abstract/ModuleDomainViews.ts index 2711ca281..a23cde8c2 100644 --- a/src/abstract/ModuleDomainViews.ts +++ b/src/abstract/ModuleDomainViews.ts @@ -1,7 +1,7 @@ -import Backbone from 'backbone'; import ModuleView from './ModuleView'; import ModuleCollection from './ModuleCollection'; import ModuleModel from './ModuleModel'; +import { View } from '../common'; export default abstract class ModuleDomainViews< TCollection extends ModuleCollection, @@ -84,7 +84,7 @@ export default abstract class ModuleDomainViews< const { viewCollection } = this; this.onRemoveBefore(viewCollection, opts); this.clearItems(); - Backbone.View.prototype.remove.apply(this, opts); + View.prototype.remove.apply(this, opts); this.onRemove(viewCollection, opts); return this; } diff --git a/src/abstract/ModuleModel.ts b/src/abstract/ModuleModel.ts index c409e0740..530a1cea4 100644 --- a/src/abstract/ModuleModel.ts +++ b/src/abstract/ModuleModel.ts @@ -1,12 +1,14 @@ import Backbone from 'backbone'; +import { Model, ObjectHash, SetOptions } from '../common'; +import EditorModel from '../editor/model/Editor'; import Module, { IBaseModule } from './Module'; export default class ModuleModel< TModule extends IBaseModule = Module, - T extends Backbone.ObjectHash = any, - S = Backbone.ModelSetOptions, + T extends ObjectHash = any, + S = SetOptions, E = any -> extends Backbone.Model { +> extends Model { private _module: TModule; constructor(module: TModule, attributes?: T, options?: Backbone.CombinedModelConstructorOptions) { @@ -22,7 +24,7 @@ export default class ModuleModel< return this._module.config; } - public get em() { + public get em(): EditorModel { return this._module.em; } } diff --git a/src/abstract/ModuleView.ts b/src/abstract/ModuleView.ts index 4a6d1ad03..4eeab28b8 100644 --- a/src/abstract/ModuleView.ts +++ b/src/abstract/ModuleView.ts @@ -1,7 +1,8 @@ -import Backbone from 'backbone'; import ModuleCollection from './ModuleCollection'; import ModuleModel from './ModuleModel'; import { IBaseModule } from './Module'; +import { View } from '../common'; +import EditorModel from '../editor/model/Editor'; type ModuleFromModel = TModel extends ModuleModel ? M : unknown; type ModuleModelExt = TItem extends ModuleCollection @@ -15,7 +16,7 @@ type ModuleModelExt = TItem extend export default class ModuleView< TModel extends ModuleModel | ModuleCollection = ModuleModel, TElement extends Element = HTMLElement -> extends Backbone.View { +> extends View { protected get pfx() { return this.ppfx + (this.config as any).stylePrefix || ''; } @@ -30,7 +31,7 @@ export default class ModuleView< return (this.model as any)?.module ?? this.collection.module; } - protected get em() { + protected get em(): EditorModel { return this.module.em; } diff --git a/src/block_manager/index.ts b/src/block_manager/index.ts index 26bdb36d6..d9c319fff 100644 --- a/src/block_manager/index.ts +++ b/src/block_manager/index.ts @@ -332,7 +332,6 @@ export default class BlockManager extends ItemManagerModule { `; } - // @ts-ignore + /** @ts-ignore */ attributes() { return this.model.get('attributes') || {}; } diff --git a/src/canvas/model/Frame.ts b/src/canvas/model/Frame.ts index aa21abc6f..2fdd7c111 100644 --- a/src/canvas/model/Frame.ts +++ b/src/canvas/model/Frame.ts @@ -5,6 +5,7 @@ import ComponentWrapper from '../../dom_components/model/ComponentWrapper'; import { isComponent, isObject } from '../../utils/mixins'; import FrameView from '../view/FrameView'; import Frames from './Frames'; +import Page from '../../pages/model/Page'; const keyAutoW = '__aw'; const keyAutoH = '__ah'; @@ -173,7 +174,7 @@ export default class Frame extends ModuleModel { this.removeHeadByAttr('src', src, 'script'); } - getPage() { + getPage(): Page | undefined { return (this.collection as unknown as Frames)?.page; } diff --git a/src/canvas/view/FrameView.ts b/src/canvas/view/FrameView.ts index 1548226d2..d7b2a3abf 100644 --- a/src/canvas/view/FrameView.ts +++ b/src/canvas/view/FrameView.ts @@ -9,11 +9,11 @@ import Canvas from '../model/Canvas'; import FrameWrapView from './FrameWrapView'; export default class FrameView extends ModuleView { - //@ts-ignore + /** @ts-ignore */ get tagName() { return 'iframe'; } - //@ts-ignore + /** @ts-ignore */ get attributes() { return { allowfullscreen: 'allowfullscreen' }; } diff --git a/src/common/Collection.ts b/src/common/Collection.ts deleted file mode 100644 index c719ed4c9..000000000 --- a/src/common/Collection.ts +++ /dev/null @@ -1 +0,0 @@ -export { Collection as default } from 'backbone'; diff --git a/src/common/Model.ts b/src/common/Model.ts deleted file mode 100644 index cac98d1f3..000000000 --- a/src/common/Model.ts +++ /dev/null @@ -1 +0,0 @@ -export { Model as default } from 'backbone'; diff --git a/src/common/View.ts b/src/common/View.ts deleted file mode 100644 index b57cacd01..000000000 --- a/src/common/View.ts +++ /dev/null @@ -1 +0,0 @@ -export { View as default } from 'backbone'; diff --git a/src/common/index.ts b/src/common/index.ts index b101d3e5b..57467b2de 100644 --- a/src/common/index.ts +++ b/src/common/index.ts @@ -1,6 +1,6 @@ -export { default as Model } from './Model'; -export { default as Collection } from './Collection'; -export { default as View } from './View'; +import Backbone from 'backbone'; + +export type Debounced = Function & { cancel(): void }; export type SetOptions = Backbone.ModelSetOptions & { avoidStore?: boolean }; @@ -8,6 +8,10 @@ export type AddOptions = Backbone.AddOptions & { temporary?: boolean }; export type RemoveOptions = Backbone.Silenceable; +export type EventHandler = Backbone.EventHandler; + +export type ObjectHash = Backbone.ObjectHash; + export type ObjectAny = Record; export type ObjectStrings = Record; @@ -16,3 +20,9 @@ export type Position = { x: number; y: number; }; + +export class Model extends Backbone.Model {} + +export class Collection extends Backbone.Collection {} + +export class View extends Backbone.View {} diff --git a/src/css_composer/index.ts b/src/css_composer/index.ts index ad16e1f90..06d40aa7e 100644 --- a/src/css_composer/index.ts +++ b/src/css_composer/index.ts @@ -178,7 +178,7 @@ export default class CssComposer extends ItemManagerModule rule.compare(slc, state, width, ruleProps)) || null; } - getAll(): CssRules { + getAll() { return this.rules; } diff --git a/src/css_composer/model/CssRules.ts b/src/css_composer/model/CssRules.ts index 21c33fe10..36d24c7df 100644 --- a/src/css_composer/model/CssRules.ts +++ b/src/css_composer/model/CssRules.ts @@ -32,7 +32,7 @@ export default class CssRules extends Collection { em.UndoManager.remove(removed); } - // @ts-ignore + /** @ts-ignore */ add(models: any, opt: any = {}) { if (typeof models === 'string') { models = this.editor.get('Parser').parseCss(models); diff --git a/src/dom_components/model/Component.ts b/src/dom_components/model/Component.ts index 6fca8bf24..2e6ac5f17 100644 --- a/src/dom_components/model/Component.ts +++ b/src/dom_components/model/Component.ts @@ -112,7 +112,7 @@ export const keyUpdateInside = `${keyUpdate}-inside`; * @module docsjs.Component */ export default class Component extends StyleableModel { - // @ts-ignore + /** @ts-ignore */ get defaults(): ComponentDefinitionDefined { return { tagName: 'div', @@ -195,7 +195,7 @@ export default class Component extends StyleableModel { prevColl?: Components; __hasUm?: boolean; __symbReady?: boolean; - // @ts-ignore + /** @ts-ignore */ collection!: Components; initialize(props = {}, opt: ComponentOptions = {}) { @@ -2055,135 +2055,3 @@ export default class Component extends StyleableModel { }); } } - -// Component.getDefaults = function () { -// return result(this.prototype, 'defaults'); -// }; - -/** - * Detect if the passed element is a valid component. - * In case the element is valid an object abstracted - * from the element will be returned - * @param {HTMLElement} - * @return {Object} - * @private - */ -// Component.isComponent = el => { -// return { tagName: toLowerCase(el.tagName) }; -// }; - -// Component.ensureInList = model => { -// const list = Component.getList(model); -// const id = model.getId(); -// const current = list[id]; - -// if (!current) { -// // Insert in list -// list[id] = model; -// } else if (current !== model) { -// // Create new ID -// const nextId = Component.getIncrementId(id, list); -// model.setId(nextId); -// list[nextId] = model; -// } - -// model.components().forEach(i => Component.ensureInList(i)); -// }; - -/** - * Relying simply on the number of components becomes a problem when you - * store and load them back, you might hit collisions with new components - * @param {Model} model - * @return {string} - * @private - */ -// Component.createId = (model, opts = {}) => { -// const list = Component.getList(model); -// const { idMap = {} } = opts; -// let { id } = model.get('attributes'); -// let nextId; - -// if (id) { -// nextId = Component.getIncrementId(id, list, opts); -// model.setId(nextId); -// if (id !== nextId) idMap[id] = nextId; -// } else { -// nextId = Component.getNewId(list); -// } - -// list[nextId] = model; -// return nextId; -// }; - -// Component.getNewId = list => { -// const count = Object.keys(list).length; -// // Testing 1000000 components with `+ 2` returns 0 collisions -// const ilen = count.toString().length + 2; -// const uid = (Math.random() + 1.1).toString(36).slice(-ilen); -// let newId = `i${uid}`; - -// while (list[newId]) { -// newId = Component.getNewId(list); -// } - -// return newId; -// }; - -// Component.getIncrementId = (id, list, opts = {}) => { -// const { keepIds = [] } = opts; -// let counter = 1; -// let newId = id; - -// if (keepIds.indexOf(id) < 0) { -// while (list[newId]) { -// counter++; -// newId = `${id}-${counter}`; -// } -// } - -// return newId; -// }; - -/** - * The list of components is taken from the Components module. - * Initially, the list, was set statically on the Component object but it was - * not ok, as it was shared between multiple editor instances - * @private - */ -// Component.getList = model => { -// const { opt = {} } = model; -// const { domc, em } = opt; -// const dm = domc || (em && em.get('DomComponents')); -// return dm ? dm.componentsById : {}; -// }; - -/** - * This method checks, for each parsed component and style object - * (are not Components/CSSRules yet), for duplicated id and fixes them - * This method is used in Components.js just after the parsing - * @private - */ -// Component.checkId = (components, styles = [], list = {}, opts = {}) => { -// const comps = isArray(components) ? components : [components]; -// const { keepIds = [] } = opts; -// comps.forEach(comp => { -// const { attributes = {}, components } = comp; -// const { id } = attributes; - -// // Check if we have collisions with current components -// if (id && list[id] && keepIds.indexOf(id) < 0) { -// const newId = Component.getIncrementId(id, list); -// attributes.id = newId; -// // Update passed styles -// isArray(styles) && -// styles.forEach(style => { -// const { selectors } = style; -// selectors.forEach((sel, idx) => { -// if (sel === `#${id}`) selectors[idx] = `#${newId}`; -// }); -// }); -// } - -// components && Component.checkId(components, styles, list, opts); -// }); -// }; diff --git a/src/dom_components/model/ComponentMap.ts b/src/dom_components/model/ComponentMap.ts index 75ae79f01..32cb908c4 100644 --- a/src/dom_components/model/ComponentMap.ts +++ b/src/dom_components/model/ComponentMap.ts @@ -2,7 +2,7 @@ import ComponentImage from './ComponentImage'; import { toLowerCase } from '../../utils/mixins'; export default class ComponentMap extends ComponentImage { - // @ts-ignore + /** @ts-ignore */ get defaults() { // @ts-ignore const defs = super.defaults; diff --git a/src/dom_components/model/Components.ts b/src/dom_components/model/Components.ts index db37b89f0..1fd1fd8a4 100644 --- a/src/dom_components/model/Components.ts +++ b/src/dom_components/model/Components.ts @@ -5,7 +5,6 @@ import { AddOptions, Collection, ObjectAny } from '../../common'; import { DomComponentsConfig } from '../config/config'; import EditorModel from '../../editor/model/Editor'; import ComponentManager from '..'; -import CssRules from '../../css_composer/model/CssRules'; import CssRule from '../../css_composer/model/CssRule'; import { ComponentAdd, ComponentDefinitionDefined, ComponentProperties } from './types'; @@ -69,8 +68,8 @@ export interface ComponentsOptions { domc?: ComponentManager; } -// @ts-ignore -export default class Components extends Collection { +export default class Components extends Collection { opt!: ComponentsOptions; config?: DomComponentsConfig; em!: EditorModel; @@ -186,7 +185,7 @@ export default class Components extends Collection { removed.__postRemove(); } - // @ts-ignore + /** @ts-ignore */ model(attrs: Partial, options: any) { const { opt } = options.collection; const em = opt.em as EditorModel; @@ -237,7 +236,7 @@ export default class Components extends Collection { return parsed.html; } - // @ts-ignore + /** @ts-ignore */ add(models: ComponentAdd, opt: AddOptions & { previousModels?: Component[]; keepIds?: string[] } = {}) { opt.keepIds = [...(opt.keepIds || []), ...getComponentIds(opt.previousModels)]; diff --git a/src/dom_components/view/ComponentView.ts b/src/dom_components/view/ComponentView.ts index a585cedc0..9e1def933 100644 --- a/src/dom_components/view/ComponentView.ts +++ b/src/dom_components/view/ComponentView.ts @@ -9,6 +9,7 @@ import { ObjectAny, View } from '../../common'; import { ComponentOptions } from '../model/types'; import EditorModel from '../../editor/model/Editor'; import { DomComponentsConfig } from '../config/config'; +import Editor from '../../editor'; type ClbObj = ReturnType; @@ -19,17 +20,17 @@ interface Rect { right?: number; } -// @ts-ignore -export default class ComponentView extends View { - // @ts-ignore +export default class ComponentView extends View { + /** @ts-ignore */ model!: Component; - // @ts-ignore + /** @ts-ignore */ className() { return this.getClasses(); } - // @ts-ignore + /** @ts-ignore */ tagName() { return this.model.get('tagName')!; } @@ -93,7 +94,7 @@ export default class ComponentView extends View { _clbObj() { const { em, model, el } = this; return { - editor: em && em.getEditor(), + editor: em?.getEditor() as Editor, model, el, }; diff --git a/src/dom_components/view/ComponentsView.ts b/src/dom_components/view/ComponentsView.ts index 4d0a4d170..8ed6359f6 100644 --- a/src/dom_components/view/ComponentsView.ts +++ b/src/dom_components/view/ComponentsView.ts @@ -142,8 +142,7 @@ export default class ComponentsView extends View { models.each(model => this.addToCollection(model)); } - // @ts-ignore - render(parent: HTMLElement) { + render(parent?: HTMLElement) { const el = this.el; const frag = document.createDocumentFragment(); this.parentEl = parent || this.el; diff --git a/src/domain_abstract/model/StyleableModel.ts b/src/domain_abstract/model/StyleableModel.ts index dbcbdb058..89a5cf7ef 100644 --- a/src/domain_abstract/model/StyleableModel.ts +++ b/src/domain_abstract/model/StyleableModel.ts @@ -1,8 +1,7 @@ import { isString, isArray, keys } from 'underscore'; import { shallowDiff } from '../../utils/mixins'; import ParserHtml from '../../parser/model/ParserHtml'; -import { Model, ObjectAny } from '../../common'; -import { ObjectHash } from 'backbone'; +import { Model, ObjectAny, ObjectHash } from '../../common'; import Selectors from '../../selector_manager/model/Selectors'; const parserHtml = ParserHtml(); diff --git a/src/editor/index.ts b/src/editor/index.ts index 3dccd2f9d..8cae89941 100644 --- a/src/editor/index.ts +++ b/src/editor/index.ts @@ -54,12 +54,37 @@ * ## Methods * @module docsjs.Editor */ -import { EventHandler } from 'backbone'; import { IBaseModule } from '../abstract/Module'; +import AssetManager from '../asset_manager'; +import BlockManager from '../block_manager'; +import CanvasModule from '../canvas'; +import CodeManagerModule from '../code_manager'; +import CommandsModule from '../commands'; +import { EventHandler } from '../common'; +import CssComposer from '../css_composer'; +import CssRule from '../css_composer/model/CssRule'; +import CssRules from '../css_composer/model/CssRules'; +import DeviceManager from '../device_manager'; +import ComponentManager from '../dom_components'; import Component from '../dom_components/model/Component'; +import Components from '../dom_components/model/Components'; +import ComponentWrapper from '../dom_components/model/ComponentWrapper'; +import I18nModule from '../i18n'; +import KeymapsModule from '../keymaps'; +import ModalModule from '../modal_dialog'; +import LayerManager from '../navigator'; +import PageManager from '../pages'; +import PanelManager from '../panels'; +import ParserModule from '../parser'; import { CustomParserCss } from '../parser/config/config'; +import RichTextEditorModule from '../rich_text_editor'; +import SelectorManager from '../selector_manager'; +import StorageManager from '../storage_manager'; import { ProjectData } from '../storage_manager/model/IStorage'; -import cash from '../utils/cash-dom'; +import StyleManager from '../style_manager'; +import TraitManager from '../trait_manager'; +import UndoManagerModule from '../undo_manager'; +import UtilsModule from '../utils'; import html from '../utils/html'; import defaults, { EditorConfig, EditorConfigKeys } from './config/config'; import EditorModel from './model/Editor'; @@ -79,7 +104,7 @@ type EditorModelParam = Parameter export default class Editor implements IBaseModule { editorView?: EditorView; editor: EditorModel; - $: typeof cash; + $: any; em: EditorModel; config: EditorConfigType; @@ -100,100 +125,100 @@ export default class Editor implements IBaseModule { get Config() { return this.em.config; } - get I18n() { + get I18n(): I18nModule { return this.em.I18n; } - get Utils() { + get Utils(): UtilsModule { return this.em.Utils; } - get Commands() { + get Commands(): CommandsModule { return this.em.Commands; } - get Keymaps() { + get Keymaps(): KeymapsModule { return this.em.Keymaps; } - get Modal() { + get Modal(): ModalModule { return this.em.Modal; } - get Panels() { + get Panels(): PanelManager { return this.em.Panels; } - get Canvas() { + get Canvas(): CanvasModule { return this.em.Canvas; } - get Parser() { + get Parser(): ParserModule { return this.em.Parser; } - get CodeManager() { + get CodeManager(): CodeManagerModule { return this.em.CodeManager; } - get UndoManager() { + get UndoManager(): UndoManagerModule { return this.em.UndoManager; } - get RichTextEditor() { + get RichTextEditor(): RichTextEditorModule { return this.em.RichTextEditor; } - get Pages() { + get Pages(): PageManager { return this.em.Pages; } - get Components() { + get Components(): ComponentManager { return this.em.Components; } - get DomComponents() { + get DomComponents(): ComponentManager { return this.em.Components; } - get Layers() { + get Layers(): LayerManager { return this.em.Layers; } - get LayerManager() { + get LayerManager(): LayerManager { return this.em.Layers; } - get Css() { + get Css(): CssComposer { return this.em.Css; } - get CssComposer() { + get CssComposer(): CssComposer { return this.em.Css; } - get Storage() { + get Storage(): StorageManager { return this.em.Storage; } - get StorageManager() { + get StorageManager(): StorageManager { return this.em.Storage; } - get Assets() { + get Assets(): AssetManager { return this.em.Assets; } - get AssetManager() { + get AssetManager(): AssetManager { return this.em.Assets; } - get Blocks() { + get Blocks(): BlockManager { return this.em.Blocks; } - get BlockManager() { + get BlockManager(): BlockManager { return this.em.Blocks; } - get Traits() { + get Traits(): TraitManager { return this.em.Traits; } - get TraitManager() { + get TraitManager(): TraitManager { return this.em.Traits; } - get Selectors() { + get Selectors(): SelectorManager { return this.em.Selectors; } - get SelectorManager() { + get SelectorManager(): SelectorManager { return this.em.Selectors; } - get Styles() { + get Styles(): StyleManager { return this.em.Styles; } - get StyleManager() { + get StyleManager(): StyleManager { return this.em.Styles; } - get Devices() { + get Devices(): DeviceManager { return this.em.Devices; } - get DeviceManager() { + get DeviceManager(): DeviceManager { return this.em.Devices; } @@ -251,7 +276,7 @@ export default class Editor implements IBaseModule { * Return the complete tree of components. Use `getWrapper` to include also the wrapper * @return {Components} */ - getComponents() { + getComponents(): Components { return this.Components.getComponents(); } @@ -259,7 +284,7 @@ export default class Editor implements IBaseModule { * Return the wrapper and its all components * @return {Component} */ - getWrapper() { + getWrapper(): ComponentWrapper | undefined { return this.Components.getWrapper(); } @@ -307,7 +332,7 @@ export default class Editor implements IBaseModule { * Returns style in JSON format object * @return {Object} */ - getStyle() { + getStyle(): CssRules { return this.em.Css.getAll(); } @@ -335,7 +360,7 @@ export default class Editor implements IBaseModule { * @example * editor.addStyle('.cls{color: red}'); */ - addStyle(style: any, opts = {}) { + addStyle(style: any, opts = {}): CssRule[] { return this.em.addStyle(style, opts); } diff --git a/src/editor/model/Editor.ts b/src/editor/model/Editor.ts index 09a7d045b..4c12e9f07 100644 --- a/src/editor/model/Editor.ts +++ b/src/editor/model/Editor.ts @@ -38,8 +38,9 @@ import { HTMLGeneratorBuildOptions } from '../../code_manager/model/HtmlGenerato import { CssGeneratorBuildOptions } from '../../code_manager/model/CssGenerator'; import ComponentView from '../../dom_components/view/ComponentView'; import { ProjectData } from '../../storage_manager/model/IStorage'; +import CssRules from '../../css_composer/model/CssRules'; +import Frame from '../../canvas/model/Frame'; -//@ts-ignore Backbone.$ = $; const deps = [ @@ -70,8 +71,6 @@ const deps = [ const ts_deps: any[] = []; Extender({ - //@ts-ignore - Backbone: Backbone, $: Backbone.$, }); @@ -740,7 +739,7 @@ export default class EditorModel extends Model { * @return {Rules} * @private */ - getStyle() { + getStyle(): CssRules { return this.Css.getAll(); } @@ -945,7 +944,7 @@ export default class EditorModel extends Model { return this.get('currentFrame'); } - getCurrentFrameModel() { + getCurrentFrameModel(): Frame { return (this.getCurrentFrame() || {}).model; } diff --git a/src/keymaps/index.ts b/src/keymaps/index.ts index 3daedf02b..fe4325c73 100644 --- a/src/keymaps/index.ts +++ b/src/keymaps/index.ts @@ -53,7 +53,7 @@ import defaults, { Keymap, KeymapOptions, KeymapsConfig } from './config'; hasWin() && keymaster.init(window); export default class KeymapsModule extends Module { - keymaster = keymaster; + keymaster: any = keymaster; keymaps: Record; constructor(em: EditorModel) { diff --git a/src/modal_dialog/index.ts b/src/modal_dialog/index.ts index a9afdf01f..c9228e6af 100644 --- a/src/modal_dialog/index.ts +++ b/src/modal_dialog/index.ts @@ -33,7 +33,6 @@ * @module Modal */ -import { EventHandler } from 'backbone'; import { debounce, isFunction, isString } from 'underscore'; import { Module } from '../abstract'; import EditorView from '../editor/view/EditorView'; @@ -42,6 +41,7 @@ import { createText } from '../utils/dom'; import defaults, { ModalConfig } from './config/config'; import ModalM from './model/Modal'; import ModalView from './view/ModalView'; +import { EventHandler } from '../common'; export default class ModalModule extends Module { modal?: ModalView; diff --git a/src/navigator/view/ItemView.ts b/src/navigator/view/ItemView.ts index 286acdaf5..a90fb0fe6 100644 --- a/src/navigator/view/ItemView.ts +++ b/src/navigator/view/ItemView.ts @@ -91,7 +91,7 @@ export default class ItemView extends View { module: any; config: any; sorter: any; - // @ts-ignore + /** @ts-ignore */ model!: Component; parentView: ItemView; items?: ItemsView; diff --git a/src/pages/index.ts b/src/pages/index.ts index 7c4ca56b8..e2ab0afd7 100644 --- a/src/pages/index.ts +++ b/src/pages/index.ts @@ -51,6 +51,7 @@ import { ItemManagerModule, ModuleConfig } from '../abstract/Module'; import Pages from './model/Pages'; import Page from './model/Page'; import EditorModel from '../editor/model/Editor'; +import ComponentWrapper from '../dom_components/model/ComponentWrapper'; export const evAll = 'page'; export const evPfx = `${evAll}:`; @@ -226,7 +227,7 @@ export default class PageManager extends ItemManagerModule wrp.findType('image')).flat(); */ - getAllWrappers() { + getAllWrappers(): ComponentWrapper[] { const pages = this.getAll(); return unique(flatten(pages.map(page => page.getAllFrames().map(frame => frame.getComponent())))); } diff --git a/src/pages/model/Page.ts b/src/pages/model/Page.ts index 2ecbbd525..4efcc7a41 100644 --- a/src/pages/model/Page.ts +++ b/src/pages/model/Page.ts @@ -4,6 +4,7 @@ import Frames from '../../canvas/model/Frames'; import Frame from '../../canvas/model/Frame'; import EditorModel from '../../editor/model/Editor'; import { PageManagerConfig } from '..'; +import ComponentWrapper from '../../dom_components/model/ComponentWrapper'; export default class Page extends Model { defaults() { @@ -73,8 +74,7 @@ export default class Page extends Model { * @example * const arrayOfFrames = page.getAllFrames(); */ - getAllFrames(): Frame[] { - //@ts-ignore + getAllFrames() { return this.getFrames().models || []; } @@ -84,7 +84,7 @@ export default class Page extends Model { * @example * const mainFrame = page.getMainFrame(); */ - getMainFrame(): Frame { + getMainFrame() { return this.getFrames().at(0); } @@ -95,7 +95,7 @@ export default class Page extends Model { * const rootComponent = page.getMainComponent(); * console.log(rootComponent.toHTML()); */ - getMainComponent() { + getMainComponent(): ComponentWrapper { const frame = this.getMainFrame(); return frame?.getComponent(); } diff --git a/src/selector_manager/index.ts b/src/selector_manager/index.ts index f47374a08..e34348637 100644 --- a/src/selector_manager/index.ts +++ b/src/selector_manager/index.ts @@ -74,7 +74,7 @@ import { isString, debounce, isObject, isArray, bindAll } from 'underscore'; import { isComponent, isRule } from '../utils/mixins'; -import { Model, Collection, RemoveOptions } from '../common'; +import { Model, Collection, RemoveOptions, Debounced } from '../common'; import defaults, { SelectorManagerConfig } from './config/config'; import Selector from './model/Selector'; import Selectors from './model/Selectors'; @@ -84,6 +84,7 @@ import EditorModel from '../editor/model/Editor'; import Component from '../dom_components/model/Component'; import { ItemManagerModule } from '../abstract/Module'; import { StyleModuleParam } from '../style_manager'; +import StyleableModel from '../domain_abstract/model/StyleableModel'; const isId = (str: string) => isString(str) && str[0] == '#'; const isClass = (str: string) => isString(str) && str[0] == '.'; @@ -120,7 +121,7 @@ export default class SelectorManager extends ItemManagerModule; + __update: Debounced; /** * Get configuration object @@ -161,7 +162,6 @@ export default class SelectorManager extends ItemManagerModule(opts: T = {} as T) { return (this.all ? (opts.array ? [...this.all.models] : this.all) : []) as T['array'] extends true ? Selector[] @@ -428,7 +428,7 @@ export default class SelectorManager extends ItemManagerModule target.getSelectorsString())) */ - getSelectedTargets() { + getSelectedTargets(): StyleableModel[] { return this.em.Styles.getSelectedAll(); } @@ -475,7 +475,6 @@ export default class SelectorManager extends ItemManagerModule { builtIn: PropertyFactory; - upAll: ReturnType; + upAll: Debounced; properties: typeof Properties; sectors: Sectors; SectView!: SectorsView; diff --git a/src/style_manager/model/Property.ts b/src/style_manager/model/Property.ts index 00c4a95dd..f53d095b1 100644 --- a/src/style_manager/model/Property.ts +++ b/src/style_manager/model/Property.ts @@ -106,7 +106,7 @@ export default class Property = PropertyProps> ext return result(this.prototype, 'defaults'); } - // @ts-ignore + /** @ts-ignore */ defaults() { return { name: '', diff --git a/src/style_manager/model/Sectors.ts b/src/style_manager/model/Sectors.ts index bd8d904f4..10c521757 100644 --- a/src/style_manager/model/Sectors.ts +++ b/src/style_manager/model/Sectors.ts @@ -13,7 +13,7 @@ export default class Sectors extends Collection { this.listenTo(this, 'reset', this.onReset); } - // @ts-ignore + /** @ts-ignore */ model(props, opts = {}) { // @ts-ignore const { em } = opts.collection; diff --git a/src/trait_manager/model/Traits.ts b/src/trait_manager/model/Traits.ts index 58a4ef99a..94f543fa3 100644 --- a/src/trait_manager/model/Traits.ts +++ b/src/trait_manager/model/Traits.ts @@ -33,7 +33,7 @@ export default class Traits extends Collection { this.target = target; } - // @ts-ignore + /** @ts-ignore */ add(models: string | Trait | TraitProperties | (string | Trait | TraitProperties)[], opt?: AddOptions) { const em = this.em; diff --git a/src/trait_manager/view/TraitView.ts b/src/trait_manager/view/TraitView.ts index da593a817..c5528c827 100644 --- a/src/trait_manager/view/TraitView.ts +++ b/src/trait_manager/view/TraitView.ts @@ -27,7 +27,7 @@ export default class TraitView extends View { appendInput = true; - // @ts-ignore + /** @ts-ignore */ attributes() { return this.model.get('attributes') || {}; } diff --git a/src/utils/Sorter.ts b/src/utils/Sorter.ts index 011388887..f772db91b 100644 --- a/src/utils/Sorter.ts +++ b/src/utils/Sorter.ts @@ -111,7 +111,7 @@ export default class Sorter extends View { $plh?: any; toMove?: Model | Model[]; - // @ts-ignore todo move to simple class + /** @ts-ignore */ initialize(opt: SorterOptions = {}) { this.opt = opt || {}; bindAll(this, 'startSort', 'onMove', 'endMove', 'rollback', 'updateOffset', 'moveDragHelper'); diff --git a/src/utils/cash-dom.ts b/src/utils/cash-dom.ts index 1946c97dd..1aa644ed7 100644 --- a/src/utils/cash-dom.ts +++ b/src/utils/cash-dom.ts @@ -1386,4 +1386,4 @@ fn.siblings = function () { // @optional offset/index.js // @optional traversal/index.js // @require core/index.js -export default cash; +export default cash as any; diff --git a/src/utils/extender.ts b/src/utils/extender.ts index 1d3f10656..750c338e1 100644 --- a/src/utils/extender.ts +++ b/src/utils/extender.ts @@ -20,37 +20,6 @@ export default ({ $ }: { $: any }) => { return this; }; - // For SVGs in IE - // (fn.removeClass = function(c) { - // if (!arguments.length) { - // return this.attr('class', ''); - // } - // const classes = isString(c) && c.match(/\S+/g); - // return classes - // ? this.each(function(el) { - // each(classes, function(c) { - // if (el.classList) { - // el.classList.remove(c); - // } else { - // const val = el.className; - // const bval = el.className.baseVal; - - // if (!isUndefined(bval)) { - // val.baseVal = bval.replace(c, ''); - // } else { - // el.className = val.replace(c, ''); - // } - // } - // }); - // }) - // : this; - // }), - // (fn.remove = function() { - // return this.each(node => { - // return node.parentNode && node.parentNode.removeChild(node); - // }); - // }), - // For spectrum compatibility fn.bind = function (ev: any, h: any) {