@mixd-id/web-scaffold 0.1.230406114 → 0.1.230406115

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mixd-id/web-scaffold",
   "private": false,
-  "version": "0.1.230406114",
+  "version": "0.1.230406115",
   "scripts": {
     "dev": "vite serve",
     "build": "vite build",

package/src/components/Button.vue

@@ -99,6 +99,8 @@ export default{
 		},
 
 		onClick(){
+			if('edit-mode' in this.$route.query) return
+
 			if(this.target){
 				switch(this.targetType){
 

package/src/utils/helpers.js

@@ -295,6 +295,75 @@ const hexToRgb = (hex) => {
   } : null;
 }
 
+const compClasses = [
+  'aspectRatio',
+  'bdSize', 'bdColor', 'bdRadius', 'bdStyle',
+  'bgColors', 'bgSize', 'bgPosition', 'bgRepeat',
+  'gap',
+  'padding', 'margin',
+  'direction', 'columns', 'display',
+  'width', 'minWidth', 'maxWidth',
+  'height', 'minHeight', 'maxHeight',
+  'fontFamily', 'fontSize', 'fontWeight', 'textColor', 'lineHeight', 'overflow',
+  'boxShadow', 'opacity',
+  'colSpan'
+]
+
+const containerClasses = [
+  'containerVariant', 'containerGridColumn', 'containerGap'
+]
+
+const itemClasses = [
+  'itemMinWidth', 'itemRatio', 'itemVariant'
+]
+
+const createComponentInstance = function(component){
+
+  if(!component.instance)
+    component.instance = {}
+
+  const compUid = '_' + component.uid.substring(0, 4) + ' '
+
+  Object.assign(component.instance, {
+    type: component.type,
+    uid: component.uid,
+
+    class: compUid + compClasses.map(key => {
+      return Array.isArray(component.props[key]) ? component.props[key].join(' ') : ''
+    })
+        .filter(_ => _)
+        .join(' '),
+
+    containerClass: containerClasses.map(key => {
+      return Array.isArray(component.props[key]) ? component.props[key].join(' ') : ''
+    })
+        .filter(_ => _)
+        .join(' '),
+
+    itemClass: itemClasses.map(key => {
+      return Array.isArray(component.props[key]) ? component.props[key].join(' ') : ''
+    })
+        .filter(_ => _)
+        .join(' ')
+  })
+
+  for(let key in component.props){
+    if(!compClasses.includes(key) && ![ 'enabled' ].includes(key)){
+      component.instance[key] = component.props[key]
+    }
+  }
+
+  if(Array.isArray(component.items)){
+    component.instance.items = component.items.map((_) => createComponentInstance(_))
+  }
+
+  if(component.props && Array.isArray(component.props.items)){
+    component.instance.items = component.props.items
+  }
+
+  return component
+}
+
 
 module.exports = {
   ceil,
@@ -316,5 +385,6 @@ module.exports = {
   unflatten,
   accessNestedObject,
   generateStylesheet,
-  hexToRgb
+  hexToRgb,
+  createComponentInstance,
 }

package/src/utils/helpers.mjs

@@ -245,7 +245,7 @@ export {
   mediaPrefixes,
   _applyClass,
   copyToClipboard,
-  getComponentUids
+  getComponentUids,
 }
 
 function observeInit(){