Up Property TS

src/style_manager/model/Property.ts

@@ -4,6 +4,7 @@ import Component from '../../dom_components/model/Component';
 import EditorModel from '../../editor/model/Editor';
 import { capitalize, camelCase, hasWin } from '../../utils/mixins';
 import Sector from './Sector';
+import PropertyComposite from './PropertyComposite';
 
 /** @private */
 export interface PropertyProps {
@@ -146,7 +147,7 @@ export default class Property<T extends Record<string, any> = PropertyProps> ext
     Property.callInit(this, props, opts);
   }
 
-  __getParentProp() {
+  __getParentProp<T = PropertyComposite>(): T {
     // @ts-ignore
     return this.collection?.opts?.parentProp;
   }
@@ -328,7 +329,7 @@ export default class Property<T extends Record<string, any> = PropertyProps> ext
    * Indicates if the current value comes directly from the selected target and so can be cleared.
    * @returns {Boolean}
    */
-  canClear() {
+  canClear(): boolean {
     const parent = this.getParent();
     return parent ? parent.__canClearProp(this) : this.hasValue({ noParent: true });
   }
@@ -338,7 +339,7 @@ export default class Property<T extends Record<string, any> = PropertyProps> ext
    * @returns {[Property]|null}
    */
   getParent() {
-    return this.__getParentProp() || null;
+    return this.__getParentProp();
   }
 
   /**
@@ -369,7 +370,6 @@ export default class Property<T extends Record<string, any> = PropertyProps> ext
     const avoidStore = !complete;
     // @ts-ignore
     !avoidStore && this.set({ value: undefined }, { avoidStore, silent: true });
-    // @ts-ignore
     this.set(parsed, { avoidStore, ...opts });
   }
 
@@ -428,7 +428,6 @@ export default class Property<T extends Record<string, any> = PropertyProps> ext
 
     if (opts.numeric) {
       const num = parseFloat(result.value);
-      // @ts-ignore
       result.unit = result.value.replace(num, '');
       result.value = num;
     }
@@ -488,7 +487,7 @@ export default class Property<T extends Record<string, any> = PropertyProps> ext
   getFullValue(val?: string, opts: any = {}) {
     const fn = this.get('functionName');
     const def = this.getDefaultValue();
-    let value = isUndefined(val) ? this.get('value') : val;
+    let value = isUndefined(val) ? (this.get('value') as string) : val;
     const hasValue = !isUndefined(value) && value !== '';
 
     if (value && def && value === def) {
@@ -496,7 +495,6 @@ export default class Property<T extends Record<string, any> = PropertyProps> ext
     }
 
     if (fn && hasValue) {
-      // @ts-ignore
       const fnParameter = fn === 'url' ? `'${value.replace(/'|"/g, '')}'` : value;
       value = `${fn}(${fnParameter})`;
     }
@@ -601,8 +599,3 @@ Property.callParentInit = function (property, ctx, props, opts = {}) {
 Property.callInit = function (context, props, opts: any = {}) {
   !opts.skipInit && context.init(props, opts);
 };
-
-// @ts-ignore
-// Property.getDefaults = function () {
-//   return result(this.prototype, 'defaults');
-// };

src/style_manager/model/PropertyComposite.ts

@@ -240,11 +240,11 @@ export default class PropertyComposite<T extends Record<string, any> = PropertyC
     return new RegExp(`${this.get('separator')}(?![^\\(]*\\))`);
   }
 
-  __upProperties(p: PropertyComposite, opts: any = {}) {
+  __upProperties(p: PropertyComposite, opts: any = {}): void {
     if (opts.__up || opts.__clearIn) return;
 
     const parentProp = this.__getParentProp();
-    if (parentProp) return parentProp.__upProperties(this, opts);
+    if (parentProp) return parentProp.__upProperties(this as any, opts);
 
     this.__upTargetsStyleProps(opts, p);
   }

src/style_manager/model/PropertyFactory.ts

@@ -1,8 +1,8 @@
 import { isFunction, isString } from 'underscore';
 import { PropertyProps } from './Property';
 import { PropertyCompositeProps } from './PropertyComposite';
-import { PropertyNumberProps } from './PropertyNumber';
-import { PropertySelectProps } from './PropertySelect';
+import PropertyNumber, { PropertyNumberProps } from './PropertyNumber';
+import PropertySelect, { PropertySelectProps } from './PropertySelect';
 import { PropertyStackProps } from './PropertyStack';
 
 type Option = {
@@ -374,7 +374,6 @@ export default class PropertyFactory {
         'box-shadow',
         {
           preview: true,
-          // @ts-ignore
           layerLabel: (l, { values }) => {
             const x = values['box-shadow-h'];
             const y = values['box-shadow-v'];
@@ -397,7 +396,6 @@ export default class PropertyFactory {
         'text-shadow',
         {
           default: 'none',
-          // @ts-ignore
           layerLabel: (l, { values }) => {
             const x = values['text-shadow-h'];
             const y = values['text-shadow-v'];
@@ -412,7 +410,6 @@ export default class PropertyFactory {
         'background',
         {
           detached: true,
-          // @ts-ignore
           layerLabel: (l, { values }) => {
             const repeat = values['background-repeat-sub'] || '';
             const pos = values['background-position-sub'] || '';
@@ -440,7 +437,6 @@ export default class PropertyFactory {
           layerSeparator: ' ',
           fromStyle(style, { property, name }) {
             const filter = style[name] || '';
-            // @ts-ignore
             const sep = property.getLayerSeparator();
             return filter
               ? filter.split(sep).map(input => {
@@ -489,10 +485,9 @@ export default class PropertyFactory {
               ],
               onChange({ property, to }) {
                 if (to.value) {
-                  // @ts-ignore
-                  const option = property.getOption();
+                  const option = (property as PropertySelect).getOption();
                   const props = { ...(option.propValue || {}) };
-                  const propToUp = property.getParent().getProperty('transform-value');
+                  const propToUp = property.getParent().getProperty('transform-value') as PropertyNumber;
                   const unit = propToUp.getUnit();
                   if (!unit || props?.units.indexOf(unit) < 0) {
                     props.unit = props?.units[0] || '';

src/style_manager/model/PropertySelect.ts

@@ -55,7 +55,7 @@ export default class PropertySelect extends Property<PropertySelectProps> {
    * @param {String} [id] Option id.
    * @returns {Object | null}
    */
-  getOption(id: string): SelectOption {
+  getOption(id?: string): SelectOption {
     const idSel = isDef(id) ? id : this.getValue();
     return this.getOptions().filter(o => this.getOptionId(o) === idSel)[0] || null;
   }