updates

hlxsites · Sep 27, 2024 · 59fe2fa · 59fe2fa
1 parent acaf728
commit 59fe2fa
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 26 deletions.
diff --git a/blocks/grid/grid.js b/blocks/grid/grid.js
@@ -8,11 +8,6 @@ export default class Grid extends ComponentBase {
   attributesValues = {
     all: {
       grid: {
-        // set props directly as css variables instead of data-attributes
-        template: {
-          columns: '1fr 1fr 1fr',
-          rows: '1fr',
-        },
         gap: '20px',
       },
     },
@@ -30,16 +25,15 @@ export default class Grid extends ComponentBase {
 
   // for backwards compatibility
   applyData(data) {
-    if (data.columns) {
-      // data.columns is deprecated, use grid-template-columns
-      if (data.template) {
-        if (!data.template.columns) {
-          data.template.columns = data.columns;
+    ['columns', 'rows'].forEach((key) => {
+      if (data[key]) {
+        if (data.template) {
+          data.template[key] = data[key];
+        } else {
+          data.template = { [key]: data[key] };
         }
-      } else {
-        data.template = { columns: data.columns };
       }
-    }
+    });
     this.applyGrid(data);
   }
 

diff --git a/scripts/component-base.js b/scripts/component-base.js
@@ -179,27 +179,28 @@ export default class ComponentBase extends HTMLElement {
     inicial.unshift(); // remove the component name
     this.initialAttributesValues = classToFlat(inicial.splice(1));
     const initialAttributesValues = this.initialAttributesValues || { all: { data: {} } };
-    if (!this.dataAttributesKeys.length) {
+    if (this.dataAttributesKeys && !this.dataAttributesKeys.length) {
       this.setDataAttributesKeys();
+    } else {
+      this.dataAttributesKeys = this.dataAttributesKeys || [];
     }
-    // this.dataAttributesKeys.forEach(({ noData, noDataCamelCase }) => {
-    //   const value = this.dataset[noDataCamelCase];
+    this.dataAttributesKeys.forEach(({ noData, noDataCamelCase }) => {
+      const value = this.dataset[noDataCamelCase];
 
-    //   if (typeof value === 'undefined') return {};
-    //   const initialValue = unFlat({ [noData]: value });
-    //   if (initialAttributesValues.all && initialAttributesValues.all.data) {
-    //     initialAttributesValues.all.data = deepMerge({}, initialAttributesValues.all.data, initialValue);
-    //   }
-    //   return initialAttributesValues;
-    // });
+      if (typeof value === 'undefined') return {};
+      const initialValue = unFlat({ [noData]: value });
+      if (initialAttributesValues.all && initialAttributesValues.all.data) {
+        initialAttributesValues.all.data = deepMerge({}, initialAttributesValues.all.data, initialValue);
+      }
+      return initialAttributesValues;
+    });
 
     this.attributesValues = deepMerge(
       {},
       this.attributesValues,
       this.initOptions?.attributesValues || {},
       initialAttributesValues,
     );
-    console.log(this.attributesValues);
   }
 
   async connectComponent() {
@@ -287,8 +288,6 @@ export default class ComponentBase extends HTMLElement {
     // for anything else set them flatten as they come from from external config
     const configs = unFlat(await externalConfig.getConfig(this.componentName, values.config));
 
-    console.log('external', configs);
-
     if (this.overrideExternalConfig) {
       // Used for preview functionality
       values = deepMerge({}, configs, this.attributesValues, values);