@builder.io/sdk-vue 0.0.1-53 → 0.0.1-54

package/CHANGELOG.md

@@ -1,3 +1,8 @@
+### 0.0.1-52
+
+🧨 Breaking change: the format of the `customComponents` prop has changed from `[{ component, info }]` to `[{ component, ...info }]`.
+See [builder-registered-components.ts](/packages/sdks/src/constants/builder-registered-components.ts) for examples of how to do so, or see the example provided for this SDK.
+
 ### 0.0.1-51
 
 ⚠️ Deprecation notice: Registering components via `registerComponent(component, info)` is now deprecated. 

package/nuxt2/src/blocks/columns/columns.vue

@@ -1,7 +1,7 @@
 <template>
-  <div class="builder-columns div-4wbls88y960" :style="columnsCssVars">
+  <div class="builder-columns div-16nol0lwi20" :style="columnsCssVars">
     <div
-      class="builder-column div-4wbls88y960-2"
+      class="builder-column div-16nol0lwi20-2"
       v-for="(column, index) in columns"
       :style="{
         width: getColumnCssWidth(index),
@@ -74,32 +74,32 @@ export default {
 };
 </script>
 <style scoped>
-.div-4wbls88y960 {
+.div-16nol0lwi20 {
   display: flex;
   align-items: stretch;
   line-height: normal;
 }
 @media (max-width: 999px) {
-  .div-4wbls88y960 {
+  .div-16nol0lwi20 {
     flex-direction: var(--flex-dir-tablet);
   }
 }
 @media (max-width: 639px) {
-  .div-4wbls88y960 {
+  .div-16nol0lwi20 {
     flex-direction: var(--flex-dir);
   }
 }
-.div-4wbls88y960-2 {
+.div-16nol0lwi20-2 {
   flex-grow: 1;
 }
 @media (max-width: 999px) {
-  .div-4wbls88y960-2 {
+  .div-16nol0lwi20-2 {
     width: var(--column-width-tablet) !important;
     margin-left: var(--column-margin-left-tablet) !important;
   }
 }
 @media (max-width: 639px) {
-  .div-4wbls88y960-2 {
+  .div-16nol0lwi20-2 {
     width: var(--column-width) !important;
     margin-left: var(--column-margin-left) !important;
   }

package/nuxt2/src/blocks/form/form.vue

@@ -27,7 +27,7 @@
     ></builder-blocks>
 
     <pre
-      class="builder-form-error-text pre-1pl23ac79ld"
+      class="builder-form-error-text pre-4wbls88y960"
       v-if="submissionState === 'error' && responseData"
     >
         {{ JSON.stringify(responseData, null, 2) }}
@@ -302,7 +302,7 @@ export default {
 };
 </script>
 <style scoped>
-.pre-1pl23ac79ld {
+.pre-4wbls88y960 {
   padding: 10px;
   color: red;
   text-align: center;

package/nuxt2/src/blocks/image/image.vue

@@ -1,9 +1,9 @@
 <template>
-  <div class="div-t43jfuqn6g">
+  <div class="div-20351ewpue7">
     <picture>
       <img
         loading="lazy"
-        class="img-t43jfuqn6g"
+        class="img-20351ewpue7"
         :alt="altText"
         :role="altText ? 'presentation' : undefined"
         :style="{
@@ -16,14 +16,14 @@
           )
         "
         :src="image"
-        :srcset="srcset"
+        :srcSet="srcset"
         :sizes="sizes"
       />
       <source :srcSet="srcset" />
     </picture>
 
     <div
-      class="builder-image-sizer div-t43jfuqn6g-2"
+      class="builder-image-sizer div-20351ewpue7-2"
       v-if="aspectRatio && !(fitContent && ((builderBlock && builderBlock.children) && (builderBlock && builderBlock.children).length))"
       :style="{
         paddingTop: aspectRatio * 100 + '%',
@@ -34,7 +34,7 @@
 
     <slot></slot>
 
-    <div class="div-t43jfuqn6g-3" v-if="!fitContent">
+    <div class="div-20351ewpue7-3" v-if="!fitContent">
       <slot></slot>
     </div>
   </div>
@@ -71,10 +71,10 @@ export default {
 };
 </script>
 <style scoped>
-.div-t43jfuqn6g {
+.div-20351ewpue7 {
   position: relative;
 }
-.img-t43jfuqn6g {
+.img-20351ewpue7 {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
   position: absolute;
@@ -83,12 +83,12 @@ export default {
   top: 0px;
   left: 0px;
 }
-.div-t43jfuqn6g-2 {
+.div-20351ewpue7-2 {
   width: 100%;
   pointer-events: none;
   font-size: 0;
 }
-.div-t43jfuqn6g-3 {
+.div-20351ewpue7-3 {
   display: flex;
   flex-direction: column;
   align-items: stretch;

package/nuxt2/src/blocks/symbol/component-info.js

@@ -12,6 +12,7 @@ const componentInfo = {
   name: "Symbol",
   noWrap: true,
   static: true,
+  builtIn: true,
   inputs: [
     {
       name: "symbol",

package/nuxt2/src/components/render-block/render-block.vue

@@ -95,7 +95,12 @@ export default {
       }
     },
     componentInfo() {
-      return this.component?.info;
+      if (this.component) {
+        const { component: _, ...info } = this.component;
+        return info;
+      } else {
+        return undefined;
+      }
     },
     componentRef() {
       return this.component?.component;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@builder.io/sdk-vue",
   "description": "Builder.io SDK for Vue",
-  "version": "0.0.1-53",
+  "version": "0.0.1-54",
   "dependencies": {
     "node-fetch": "^2.6.1"
   },

package/vue2/src/blocks/symbol/component-info.js

@@ -12,6 +12,7 @@ const componentInfo = {
   name: "Symbol",
   noWrap: true,
   static: true,
+  builtIn: true,
   inputs: [
     {
       name: "symbol",

package/vue3/src/blocks/symbol/component-info.js

@@ -12,6 +12,7 @@ const componentInfo = {
   name: "Symbol",
   noWrap: true,
   static: true,
+  builtIn: true,
   inputs: [
     {
       name: "symbol",

package/nuxt2/src/functions/macro-eval.js

@@ -1,12 +0,0 @@
-var __defProp = Object.defineProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  __markAsModule(target);
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-__export(exports, {
-  macroEval: () => macroEval
-});
-function macroEval(items, string) {
-}

package/vue2/src/functions/macro-eval.js

@@ -1,12 +0,0 @@
-var __defProp = Object.defineProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  __markAsModule(target);
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-__export(exports, {
-  macroEval: () => macroEval
-});
-function macroEval(items, string) {
-}

package/vue3/src/functions/macro-eval.js

@@ -1,12 +0,0 @@
-var __defProp = Object.defineProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  __markAsModule(target);
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-__export(exports, {
-  macroEval: () => macroEval
-});
-function macroEval(items, string) {
-}