Update style changes with DataSources

packages/core/src/css_composer/index.ts

@@ -254,7 +254,7 @@ export default class CssComposer extends ItemManagerModule<CssComposerConfig & {
 
       if (updateStyle) {
         const styleUpdate = opts.extend ? { ...model.get('style'), ...style } : style;
-        model.set('style', styleUpdate, opts);
+        model.setStyle(styleUpdate, opts);
       }
 
       result.push(model);

packages/core/src/data_sources/model/DataVariable.ts

@@ -37,7 +37,7 @@ export default class DataVariable extends Model {
 
   getDataValue() {
     const { path, defaultValue } = this.attributes;
-    const val = this.em?.DataSources?.getValue?.(path, defaultValue);
+    const val = this.em?.DataSources.getValue(path, defaultValue);
 
     return val;
   }

packages/core/src/domain_abstract/model/StyleableModel.ts

@@ -151,22 +151,11 @@ export default class StyleableModel<T extends ObjectHash = any> extends Model<T>
         model: this,
         em: this.em!,
         dataVariable: dataVar,
-        updateValueFromDataVariable: (newValue: string) => this.updateStyleProp(styleProp, newValue),
+        updateValueFromDataVariable: () => this.updateView(),
       });
     }
   }
 
-  /**
-   * Update a specific style property
-   */
-  updateStyleProp(prop: string, value: string) {
-    const style = this.getStyle();
-    style[prop] = value;
-    this.setStyle(style, { noEvent: true });
-    this.trigger(`change:style:${prop}`);
-    this.updateView();
-  }
-
   getView(frame?: Frame) {
     let { views, em } = this;
     const frm = frame || em?.getCurrentFrameModel();