@mixd-id/web-scaffold 0.1.230406137 → 0.1.230406139

package/package.json

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

package/src/components/Carousel.vue

@@ -127,6 +127,7 @@ export default{
   methods:{
 
 		setPosition(noAnimation) {
+			if(!this.$refs.inner) return
 
 			const index = this.index
 			let left = 0

package/src/components/Image.vue

@@ -66,7 +66,9 @@ export default{
   computed:{
 
 		actualSrc(){
-			return this.mediaSrc[this.$screenPrefix]
+			if(typeof window !== 'undefined'){
+				return this.mediaSrc[this.$screenPrefix]
+			}
 		},
 
 		compClass(){

package/src/index.js

@@ -1,5 +1,5 @@
-import {defineAsyncComponent, reactive, ref} from "vue"
-import {accessNestedObject, observeInit} from './utils/helpers.mjs'
+import {defineAsyncComponent, reactive} from "vue"
+import {observeInit} from './utils/helpers.mjs'
 import throttle from "lodash/throttle"
 
 let _UNIQID = 0
@@ -252,7 +252,7 @@ const util = {
     let prefix = ''
     for(let breakpoint in mediaBreakpoints){
       if(width > breakpoint){
-        prefix = mediaBreakpoints[breakpoint]
+        prefix = mediaBreakpoints[breakpoint] ?? prefix
       }
     }
 
@@ -273,11 +273,11 @@ export default{
         app.config.globalProperties.$observe = observeInit()
       }
 
-      app.config.globalProperties.$screenPrefix = reactive(util.calculateMediaPrefix(window.innerWidth))
+      app.config.globalProperties.$screenPrefix = util.calculateMediaPrefix(window.innerWidth)
       const onWindowResize = throttle(() => {
         app.config.globalProperties.$screenPrefix = util.calculateMediaPrefix(window.innerWidth)
         resizeEvents.forEach((fn) => fn())
-      }, 500, { leading:true })
+      }, 1000, { leading:true })
 
       window.addEventListener('resize', onWindowResize)
     }
@@ -347,7 +347,6 @@ export default{
     app.component('Countdown', defineAsyncComponent(() => import("./components/Countdown.vue")))
     app.component('Datepicker', defineAsyncComponent(() => import("./components/Datepicker.vue")))
     app.component('Dropdown', defineAsyncComponent(() => import("./components/Dropdown.vue")))
-    app.component('DynamicTemplate', defineAsyncComponent(() => import("./components/DynamicTemplate.vue")))
     app.component('ErrorText', defineAsyncComponent(() => import("./components/ErrorText.vue")))
     app.component('Feed', defineAsyncComponent(() => import("./components/Feed.vue")))
     app.component('Gmaps', defineAsyncComponent(() => import("./components/Gmaps.vue")))

package/src/widgets/Review.vue

@@ -113,6 +113,7 @@ export default{
 
 .review{
 	@apply relative flex flex-col gap-4;
+	@apply w-full mx-auto max-w-screen-xl;
 	background-image: v-bind(bgImages[0]);
 }
 

package/src/widgets/WebPageBuilder.vue

@@ -33,8 +33,12 @@
 
 					<div class="flex flex-row gap-4" v-if="!page.isSystem">
 						<div class="flex flex-col gap-1">
-							<label class="text-text-400 w-[40px]">{{ $t('Active')}}</label>
-							<Switch v-model="page.isActive" @change="save"/>
+							<label class="text-text-400 w-[40px]">{{ $t('Status') }}</label>
+							<Dropdown v-model="page.status" @change="save">
+								<option :value="-1">{{ $t('Disabled') }}</option>
+								<option :value="0">{{ $t('Draft') }}</option>
+								<option :value="1">{{ $t('Active') }}</option>
+							</Dropdown>
 						</div>
 
 						<div class="flex-1">
@@ -1045,8 +1049,7 @@ export default{
 			components: [
 
 				{ type:'Carousel', name:'Carousel', group:'Widgets', items:[], props:{
-					name: 'Carousel',
-					ratio:[ '2/1', '4/1' ]
+					name: 'Carousel'
 				}},
 
 				{ type:'ContactForm', name:'Contact Form', group:'Widgets', props:{

package/src/components/DynamicTemplate.vue

@@ -1,44 +0,0 @@
-<template>
-	<div :class="$style.comp">
-		<component :is="components"></component>
-	</div>
-</template>
-
-<script>
-
-import * as Vue from "vue/dist/vue.esm-bundler";
-
-export default{
-
-	props: [ 'template' ],
-
-	data(){
-		return {
-			components: null
-		}
-	},
-
-	watch: {
-
-		template: {
-			immediate: true,
-			handler(to){
-				this.components = Vue.compile(to)
-			}
-		}
-
-	}
-
-
-
-}
-
-</script>
-
-<style module>
-
-.comp{
-
-}
-
-</style>