@builder.io/sdk-vue 0.0.1-44 → 0.0.1-48

package/README.md

@@ -1,9 +1,17 @@
-# Builder.io Vue SDK
+# Builder.io Vue 2.0 SDK (BETA)
+
+This is the 2.0 Vue SDK. It is currently in beta.
+
+NOTE: If you are looking for the stable 1.0 Vue SDK, you can find it [here](https://github.com/BuilderIO/builder/tree/main/packages/vue)
+
+## Feature Support
+
+To check the status of the SDK, look at [these tables](../../README.md#feature-implementation).
 
 ## Getting Started
 
 ```
-npm install @builder.io/sdk-vue
+npm install @builder.io/sdk-vue@dev
 ```
 
 ## Usage with Nuxt
@@ -18,18 +26,7 @@ buildModules: ['@builder.io/sdk-vue/nuxt'];
 
 Then register built in and custom components as seen [here](/examples/vue-nuxt/scripts/register-builder-components.js)
 
-You can see a full example of using Builder.io + Nuxt [here](/examples/vue-nuxt)
-
-## Status
-
-This SDK is currently in beta
-
-Left to implement:
+You can see examples of using Builder.io:
 
-- SSR (Nuxt currently can't find the custom components on the server, looking into)
-- Stacking columns on breakpoints
-- "View current draft" logic
-- "+ add block" button when starting a page (for now just drag your first block to the "layers" tab)
-- Symbols
-- Server side a/b testing
-- "animations" tab and "data" tab
+- with Nuxt [here](/examples/vue-nuxt)
+- with Vue Storefront [here](/examples/vue/vue-storefront/)

package/nuxt2/src/blocks/columns.vue

@@ -1,11 +1,12 @@
 <template>
-  <div class="builder-columns div-1083i9ahz0v">
+  <div class="builder-columns div-23e8fqt91nf" :style="columnsCssVars">
     <div
-      class="builder-column div-1083i9ahz0v-2"
+      class="builder-column div-23e8fqt91nf-2"
       v-for="(column, index) in columns"
       :style="{
         width: getColumnCssWidth(index),
         marginLeft: `${index === 0 ? 0 : getGutterSize()}px`,
+        ...columnCssVars,
       }"
       :key="index"
     >
@@ -22,7 +23,32 @@ export default registerComponent(
   {
     name: 'builder-columns',
     components: { 'render-blocks': async () => RenderBlocks },
-    props: ['space', 'columns'],
+    props: ['space', 'columns', 'stackColumnsAt', 'reverseColumnsWhenStacked'],
+
+    computed: {
+      columnsCssVars() {
+        const flexDir =
+          this.stackColumnsAt === 'never'
+            ? 'inherit'
+            : this.reverseColumnsWhenStacked
+            ? 'column-reverse'
+            : 'column';
+        return {
+          '--flex-dir': flexDir,
+          '--flex-dir-tablet': this.maybeApplyForTablet(flexDir),
+        };
+      },
+      columnCssVars() {
+        const width = '100%';
+        const marginLeft = '0';
+        return {
+          '--column-width': width,
+          '--column-margin-left': marginLeft,
+          '--column-width-tablet': this.maybeApplyForTablet(width),
+          '--column-margin-left-tablet': this.maybeApplyForTablet(marginLeft),
+        };
+      },
+    },
 
     methods: {
       getGutterSize() {
@@ -33,7 +59,7 @@ export default registerComponent(
       },
       getWidth(index) {
         const columns = this.getColumns();
-        return (columns[index] && columns[index].width) || 100 / columns.length;
+        return columns[index]?.width || 100 / columns.length;
       },
       getColumnCssWidth(index) {
         const columns = this.getColumns();
@@ -42,6 +68,10 @@ export default registerComponent(
           (gutterSize * (columns.length - 1)) / columns.length;
         return `calc(${this.getWidth(index)}% - ${subtractWidth}px)`;
       },
+      maybeApplyForTablet(prop) {
+        const stackColumnsAt = this.stackColumnsAt || 'tablet';
+        return stackColumnsAt === 'tablet' ? prop : 'inherit';
+      },
     },
   },
   {
@@ -262,12 +292,34 @@ export default registerComponent(
 );
 </script>
 <style scoped>
-.div-1083i9ahz0v {
+.div-23e8fqt91nf {
   display: flex;
   align-items: stretch;
   line-height: normal;
 }
-.div-1083i9ahz0v-2 {
+@media (max-width: 999px) {
+  .div-23e8fqt91nf {
+    flex-direction: var(--flex-dir-tablet);
+  }
+}
+@media (max-width: 639px) {
+  .div-23e8fqt91nf {
+    flex-direction: var(--flex-dir);
+  }
+}
+.div-23e8fqt91nf-2 {
   flex-grow: 1;
 }
+@media (max-width: 999px) {
+  .div-23e8fqt91nf-2 {
+    width: var(--column-width-tablet) !important;
+    margin-left: var(--column-margin-left-tablet) !important;
+  }
+}
+@media (max-width: 639px) {
+  .div-23e8fqt91nf-2 {
+    width: var(--column-width) !important;
+    margin-left: var(--column-margin-left) !important;
+  }
+}
 </style>

package/nuxt2/src/blocks/form.vue

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

package/nuxt2/src/blocks/image.vue

@@ -1,9 +1,9 @@
 <template>
-  <div class="div-2m37ml0pmfw">
+  <div class="div-4wbls88y960">
     <picture>
       <img
         loading="lazy"
-        class="img-2m37ml0pmfw"
+        class="img-4wbls88y960"
         :alt="altText"
         :aria-role="altText ? 'presentation' : undefined"
         :style="{
@@ -23,7 +23,7 @@
     </picture>
 
     <div
-      class="builder-image-sizer div-2m37ml0pmfw-2"
+      class="builder-image-sizer div-4wbls88y960-2"
       v-if="
         aspectRatio &&
         !(
@@ -42,7 +42,7 @@
 
     <slot></slot>
 
-    <div class="div-2m37ml0pmfw-3" v-if="!fitContent">
+    <div class="div-4wbls88y960-3" v-if="!fitContent">
       <slot></slot>
     </div>
   </div>
@@ -167,10 +167,10 @@ export default registerComponent(
 );
 </script>
 <style scoped>
-.div-2m37ml0pmfw {
+.div-4wbls88y960 {
   position: relative;
 }
-.img-2m37ml0pmfw {
+.img-4wbls88y960 {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
   position: absolute;
@@ -179,12 +179,12 @@ export default registerComponent(
   top: 0px;
   left: 0px;
 }
-.div-2m37ml0pmfw-2 {
+.div-4wbls88y960-2 {
   width: 100%;
   pointer-events: none;
   font-size: 0;
 }
-.div-2m37ml0pmfw-3 {
+.div-4wbls88y960-3 {
   display: flex;
   flex-direction: column;
   align-items: stretch;

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

@@ -13,28 +13,33 @@
       :builderBlock="useBlock"
       :is="componentRef"
     >
-      <render-blocks
-        path="children"
-        v-if="useBlock.children"
-        :blocks="useBlock.children"
-      ></render-blocks>
+      <render-block
+        v-for="(child, index) in children"
+        :block="child"
+        :key="index"
+      ></render-block>
     </component>
 
     <render-block
-      v-for="(child, index) in useBlock.children"
+      v-for="(child, index) in noCompRefChildren"
       :block="child"
       :key="index"
     ></render-block>
   </component>
   <component
-    v-bind="componentInfo && componentInfo.options"
+    v-bind="componentOptions"
     v-else=""
     :attributes="propertiesAndActions"
     :builderBlock="useBlock"
     :style="css"
-    :children="useBlock.children"
     :is="componentRef"
-  ></component>
+  >
+    <render-block
+      v-for="(child, index) in children"
+      :block="child"
+      :key="index"
+    ></render-block>
+  </component>
 </template>
 <script>
 import { getBlockComponentOptions } from '../functions/get-block-component-options';
@@ -46,14 +51,10 @@ import BuilderContext from '../context/builder.context';
 import { getBlockActions } from '../functions/get-block-actions';
 import { getProcessedBlock } from '../functions/get-processed-block';
 import BlockStyles from './block-styles';
-import RenderBlocks from './render-blocks';
 
 export default {
   name: 'render-block',
-  components: {
-    'block-styles': async () => BlockStyles,
-    'render-blocks': async () => RenderBlocks,
-  },
+  components: { 'block-styles': async () => BlockStyles },
   props: ['block'],
 
   inject: {
@@ -114,6 +115,16 @@ export default {
     componentOptions() {
       return getBlockComponentOptions(this.useBlock);
     },
+    children() {
+      // TO-DO: When should `canHaveChildren` dictate rendering?
+      // This is currently commented out because some Builder components (e.g. Box) do not have `canHaveChildren: true`,
+      // but still receive and need to render children.
+      // return this.componentInfo?.canHaveChildren ? this.useBlock.children : [];
+      return this.useBlock.children ?? [];
+    },
+    noCompRefChildren() {
+      return this.componentRef ? [] : this.children;
+    },
   },
 };
 </script>

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

@@ -1,6 +1,6 @@
 <template>
   <div
-    class="div-rs25iidh4"
+    class="div-2flfunvabst"
     :builder-path="path"
     :builder-parent-id="parent"
     @click="onClick"
@@ -72,7 +72,7 @@ export default {
 };
 </script>
 <style scoped>
-.div-rs25iidh4 {
+.div-2flfunvabst {
   display: flex;
   flex-direction: column;
   align-items: stretch;

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

@@ -16,9 +16,6 @@
           useContent.data &&
           (useContent && useContent.data).cssCode) ||
           (useContent &&
-            useContent.data &&
-            (useContent && useContent.data).customFonts &&
-            useContent &&
             useContent.data &&
             (useContent && useContent.data).customFonts &&
             (
@@ -142,9 +139,7 @@ export default {
         font.family +
         (font.kind && !font.kind.includes('#') ? ', ' + font.kind : '');
       const name = family.split(',')[0];
-      const url = font.fileUrl
-        ? font.fileUrl
-        : font.files && font.files.regular;
+      const url = font.fileUrl ?? font?.files?.regular;
       let str = '';
 
       if (url && family && name) {
@@ -190,12 +185,9 @@ export default {
       // }
       // TODO: separate internal data from external
       return (
-        (data?.customFonts &&
-          data.customFonts.length &&
-          data.customFonts
-            .map((font) => this.getCssFromFont(font, data))
-            .join(' ')) ||
-        ''
+        data?.customFonts
+          ?.map((font) => this.getCssFromFont(font, data))
+          ?.join(' ') || ''
       );
     },
     processMessage(event) {

package/nuxt2/src/functions/get-block-actions.js

@@ -44,6 +44,7 @@ __export(exports, {
   getBlockActions: () => getBlockActions,
 });
 var import_evaluate = __toModule(require('./evaluate'));
+var import_event_handler_name = __toModule(require('./event-handler-name'));
 function getBlockActions(options) {
   const obj = {};
   if (options.block.actions) {
@@ -52,7 +53,7 @@ function getBlockActions(options) {
         continue;
       }
       const value = options.block.actions[key];
-      obj['v-on:' + key.toLowerCase()] = (event) =>
+      obj[(0, import_event_handler_name.getEventHandlerName)(key)] = (event) =>
         (0, import_evaluate.evaluate)({
           code: value,
           context: options.context,

package/nuxt2/src/functions/get-content.js

@@ -121,16 +121,18 @@ function getContent(options) {
 function getAllContent(options) {
   return __async(this, null, function* () {
     const { model, apiKey } = options;
-    const { limit, testGroups, userAttributes, query } = __spreadValues(
-      {
-        limit: 1,
-        userAttributes: null,
-        testGroups: null,
-      },
-      options
-    );
+    const { limit, testGroups, userAttributes, query, noTraverse } =
+      __spreadValues(
+        {
+          limit: 1,
+          userAttributes: null,
+          testGroups: null,
+          noTraverse: false,
+        },
+        options
+      );
     const url = new URL(
-      `https://cdn.builder.io/api/v2/content/${model}?apiKey=${apiKey}&limit=${limit}`
+      `https://cdn.builder.io/api/v2/content/${model}?apiKey=${apiKey}&limit=${limit}&noTraverse=${noTraverse}`
     );
     if (options.options) {
       const flattened = flatten(options.options);

package/nuxt2/src/functions/get-processed-block.js

@@ -68,8 +68,10 @@ __export(exports, {
 });
 var import_evaluate = __toModule(require('./evaluate'));
 var import_set = __toModule(require('./set'));
+var import_transform_block = __toModule(require('./transform-block'));
 function getProcessedBlock(options) {
-  const { block, state, context } = options;
+  const { state, context } = options;
+  const block = (0, import_transform_block.transformBlock)(options.block);
   if (!block.bindings) {
     return block;
   }

package/nuxt2/src/functions/is-browser.js

@@ -1,9 +1,4 @@
-var __create = Object.create;
 var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __markAsModule = (target) =>
   __defProp(target, '__esModule', { value: true });
 var __export = (target, all) => {
@@ -11,43 +6,9 @@ var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
 };
-var __reExport = (target, module2, desc) => {
-  if (
-    (module2 && typeof module2 === 'object') ||
-    typeof module2 === 'function'
-  ) {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && key !== 'default')
-        __defProp(target, key, {
-          get: () => module2[key],
-          enumerable:
-            !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable,
-        });
-  }
-  return target;
-};
-var __toModule = (module2) => {
-  return __reExport(
-    __markAsModule(
-      __defProp(
-        module2 != null ? __create(__getProtoOf(module2)) : {},
-        'default',
-        module2 && module2.__esModule && 'default' in module2
-          ? { get: () => module2.default, enumerable: true }
-          : { value: module2, enumerable: true }
-      )
-    ),
-    module2
-  );
-};
 __export(exports, {
   isBrowser: () => isBrowser,
 });
-var import_is_react_native = __toModule(require('./is-react-native'));
 function isBrowser() {
-  return (
-    typeof window !== 'undefined' &&
-    typeof document !== 'undefined' &&
-    !(0, import_is_react_native.isReactNative)()
-  );
+  return typeof window !== 'undefined' && typeof document !== 'undefined';
 }

package/nuxt2/src/functions/is-react-native.js

@@ -10,5 +10,5 @@ __export(exports, {
   isReactNative: () => isReactNative,
 });
 function isReactNative() {
-  return typeof navigator === 'object' && navigator.product === 'ReactNative';
+  return false;
 }

package/nuxt2/src/functions/track.js

@@ -47,8 +47,10 @@ var import_is_browser = __toModule(require('./is-browser'));
 var import_is_react_native = __toModule(require('./is-react-native'));
 function track(event, properties) {
   if (
-    !(0, import_is_browser.isBrowser)() ||
-    (0, import_is_react_native.isReactNative)()
+    !(
+      (0, import_is_browser.isBrowser)() ||
+      (0, import_is_react_native.isReactNative)()
+    )
   ) {
     return;
   }

package/nuxt2/src/functions/{name-event-handlers.js → transform-block.js}

@@ -7,9 +7,8 @@ var __export = (target, all) => {
     __defProp(target, name, { get: all[name], enumerable: true });
 };
 __export(exports, {
-  getEventHandlerName: () => getEventHandlerName,
+  transformBlock: () => transformBlock,
 });
-function capitalizeFirstLetter(string) {
-  return string.charAt(0).toUpperCase() + string.slice(1);
+function transformBlock(block) {
+  return block;
 }
-const getEventHandlerName = (key) => `on${capitalizeFirstLetter(key)}`;

package/package.json

@@ -1,15 +1,16 @@
 {
   "name": "@builder.io/sdk-vue",
   "description": "Builder.io SDK for Vue",
-  "version": "0.0.1-44",
+  "version": "0.0.1-48",
   "dependencies": {
     "node-fetch": "^2.6.1"
   },
   "main": "./nuxt2/src/index.js",
   "exports": {
-    "vue2": "./vue2/src/index.js",
-    "nuxt2": "./nuxt2/src/index.js",
-    "vue3": "./vue3/src/index.js"
+    "./nuxt": "./nuxt.js",
+    "./vue2": "./vue2/src/index.js",
+    "./nuxt2": "./nuxt2/src/index.js",
+    "./vue3": "./vue3/src/index.js"
   },
   "scripts": {
     "release:dev": "npm version prerelease --no-git-tag-version && npm publish --tag dev --access public"

package/vue2/src/functions/get-block-actions.js

@@ -44,6 +44,7 @@ __export(exports, {
   getBlockActions: () => getBlockActions,
 });
 var import_evaluate = __toModule(require('./evaluate'));
+var import_event_handler_name = __toModule(require('./event-handler-name'));
 function getBlockActions(options) {
   const obj = {};
   if (options.block.actions) {
@@ -52,7 +53,7 @@ function getBlockActions(options) {
         continue;
       }
       const value = options.block.actions[key];
-      obj['v-on:' + key.toLowerCase()] = (event) =>
+      obj[(0, import_event_handler_name.getEventHandlerName)(key)] = (event) =>
         (0, import_evaluate.evaluate)({
           code: value,
           context: options.context,

package/vue2/src/functions/get-content.js

@@ -121,16 +121,18 @@ function getContent(options) {
 function getAllContent(options) {
   return __async(this, null, function* () {
     const { model, apiKey } = options;
-    const { limit, testGroups, userAttributes, query } = __spreadValues(
-      {
-        limit: 1,
-        userAttributes: null,
-        testGroups: null,
-      },
-      options
-    );
+    const { limit, testGroups, userAttributes, query, noTraverse } =
+      __spreadValues(
+        {
+          limit: 1,
+          userAttributes: null,
+          testGroups: null,
+          noTraverse: false,
+        },
+        options
+      );
     const url = new URL(
-      `https://cdn.builder.io/api/v2/content/${model}?apiKey=${apiKey}&limit=${limit}`
+      `https://cdn.builder.io/api/v2/content/${model}?apiKey=${apiKey}&limit=${limit}&noTraverse=${noTraverse}`
     );
     if (options.options) {
       const flattened = flatten(options.options);

package/vue2/src/functions/get-processed-block.js

@@ -68,8 +68,10 @@ __export(exports, {
 });
 var import_evaluate = __toModule(require('./evaluate'));
 var import_set = __toModule(require('./set'));
+var import_transform_block = __toModule(require('./transform-block'));
 function getProcessedBlock(options) {
-  const { block, state, context } = options;
+  const { state, context } = options;
+  const block = (0, import_transform_block.transformBlock)(options.block);
   if (!block.bindings) {
     return block;
   }

package/vue2/src/functions/is-browser.js

@@ -1,9 +1,4 @@
-var __create = Object.create;
 var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __markAsModule = (target) =>
   __defProp(target, '__esModule', { value: true });
 var __export = (target, all) => {
@@ -11,43 +6,9 @@ var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
 };
-var __reExport = (target, module2, desc) => {
-  if (
-    (module2 && typeof module2 === 'object') ||
-    typeof module2 === 'function'
-  ) {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && key !== 'default')
-        __defProp(target, key, {
-          get: () => module2[key],
-          enumerable:
-            !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable,
-        });
-  }
-  return target;
-};
-var __toModule = (module2) => {
-  return __reExport(
-    __markAsModule(
-      __defProp(
-        module2 != null ? __create(__getProtoOf(module2)) : {},
-        'default',
-        module2 && module2.__esModule && 'default' in module2
-          ? { get: () => module2.default, enumerable: true }
-          : { value: module2, enumerable: true }
-      )
-    ),
-    module2
-  );
-};
 __export(exports, {
   isBrowser: () => isBrowser,
 });
-var import_is_react_native = __toModule(require('./is-react-native'));
 function isBrowser() {
-  return (
-    typeof window !== 'undefined' &&
-    typeof document !== 'undefined' &&
-    !(0, import_is_react_native.isReactNative)()
-  );
+  return typeof window !== 'undefined' && typeof document !== 'undefined';
 }

package/vue2/src/functions/is-react-native.js

@@ -10,5 +10,5 @@ __export(exports, {
   isReactNative: () => isReactNative,
 });
 function isReactNative() {
-  return typeof navigator === 'object' && navigator.product === 'ReactNative';
+  return false;
 }

package/vue2/src/functions/track.js

@@ -47,8 +47,10 @@ var import_is_browser = __toModule(require('./is-browser'));
 var import_is_react_native = __toModule(require('./is-react-native'));
 function track(event, properties) {
   if (
-    !(0, import_is_browser.isBrowser)() ||
-    (0, import_is_react_native.isReactNative)()
+    !(
+      (0, import_is_browser.isBrowser)() ||
+      (0, import_is_react_native.isReactNative)()
+    )
   ) {
     return;
   }

package/vue2/src/functions/{name-event-handlers.js → transform-block.js}

@@ -7,9 +7,8 @@ var __export = (target, all) => {
     __defProp(target, name, { get: all[name], enumerable: true });
 };
 __export(exports, {
-  getEventHandlerName: () => getEventHandlerName,
+  transformBlock: () => transformBlock,
 });
-function capitalizeFirstLetter(string) {
-  return string.charAt(0).toUpperCase() + string.slice(1);
+function transformBlock(block) {
+  return block;
 }
-const getEventHandlerName = (key) => `on${capitalizeFirstLetter(key)}`;

package/vue3/src/functions/get-block-actions.js

@@ -44,6 +44,7 @@ __export(exports, {
   getBlockActions: () => getBlockActions,
 });
 var import_evaluate = __toModule(require('./evaluate'));
+var import_event_handler_name = __toModule(require('./event-handler-name'));
 function getBlockActions(options) {
   const obj = {};
   if (options.block.actions) {
@@ -52,7 +53,7 @@ function getBlockActions(options) {
         continue;
       }
       const value = options.block.actions[key];
-      obj['v-on:' + key.toLowerCase()] = (event) =>
+      obj[(0, import_event_handler_name.getEventHandlerName)(key)] = (event) =>
         (0, import_evaluate.evaluate)({
           code: value,
           context: options.context,

package/vue3/src/functions/get-content.js

@@ -121,16 +121,18 @@ function getContent(options) {
 function getAllContent(options) {
   return __async(this, null, function* () {
     const { model, apiKey } = options;
-    const { limit, testGroups, userAttributes, query } = __spreadValues(
-      {
-        limit: 1,
-        userAttributes: null,
-        testGroups: null,
-      },
-      options
-    );
+    const { limit, testGroups, userAttributes, query, noTraverse } =
+      __spreadValues(
+        {
+          limit: 1,
+          userAttributes: null,
+          testGroups: null,
+          noTraverse: false,
+        },
+        options
+      );
     const url = new URL(
-      `https://cdn.builder.io/api/v2/content/${model}?apiKey=${apiKey}&limit=${limit}`
+      `https://cdn.builder.io/api/v2/content/${model}?apiKey=${apiKey}&limit=${limit}&noTraverse=${noTraverse}`
     );
     if (options.options) {
       const flattened = flatten(options.options);

package/vue3/src/functions/get-processed-block.js

@@ -68,8 +68,10 @@ __export(exports, {
 });
 var import_evaluate = __toModule(require('./evaluate'));
 var import_set = __toModule(require('./set'));
+var import_transform_block = __toModule(require('./transform-block'));
 function getProcessedBlock(options) {
-  const { block, state, context } = options;
+  const { state, context } = options;
+  const block = (0, import_transform_block.transformBlock)(options.block);
   if (!block.bindings) {
     return block;
   }

package/vue3/src/functions/is-browser.js

@@ -1,9 +1,4 @@
-var __create = Object.create;
 var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __markAsModule = (target) =>
   __defProp(target, '__esModule', { value: true });
 var __export = (target, all) => {
@@ -11,43 +6,9 @@ var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
 };
-var __reExport = (target, module2, desc) => {
-  if (
-    (module2 && typeof module2 === 'object') ||
-    typeof module2 === 'function'
-  ) {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && key !== 'default')
-        __defProp(target, key, {
-          get: () => module2[key],
-          enumerable:
-            !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable,
-        });
-  }
-  return target;
-};
-var __toModule = (module2) => {
-  return __reExport(
-    __markAsModule(
-      __defProp(
-        module2 != null ? __create(__getProtoOf(module2)) : {},
-        'default',
-        module2 && module2.__esModule && 'default' in module2
-          ? { get: () => module2.default, enumerable: true }
-          : { value: module2, enumerable: true }
-      )
-    ),
-    module2
-  );
-};
 __export(exports, {
   isBrowser: () => isBrowser,
 });
-var import_is_react_native = __toModule(require('./is-react-native'));
 function isBrowser() {
-  return (
-    typeof window !== 'undefined' &&
-    typeof document !== 'undefined' &&
-    !(0, import_is_react_native.isReactNative)()
-  );
+  return typeof window !== 'undefined' && typeof document !== 'undefined';
 }

package/vue3/src/functions/is-react-native.js

@@ -10,5 +10,5 @@ __export(exports, {
   isReactNative: () => isReactNative,
 });
 function isReactNative() {
-  return typeof navigator === 'object' && navigator.product === 'ReactNative';
+  return false;
 }

package/vue3/src/functions/track.js

@@ -47,8 +47,10 @@ var import_is_browser = __toModule(require('./is-browser'));
 var import_is_react_native = __toModule(require('./is-react-native'));
 function track(event, properties) {
   if (
-    !(0, import_is_browser.isBrowser)() ||
-    (0, import_is_react_native.isReactNative)()
+    !(
+      (0, import_is_browser.isBrowser)() ||
+      (0, import_is_react_native.isReactNative)()
+    )
   ) {
     return;
   }

package/vue3/src/functions/{name-event-handlers.js → transform-block.js}

@@ -7,9 +7,8 @@ var __export = (target, all) => {
     __defProp(target, name, { get: all[name], enumerable: true });
 };
 __export(exports, {
-  getEventHandlerName: () => getEventHandlerName,
+  transformBlock: () => transformBlock,
 });
-function capitalizeFirstLetter(string) {
-  return string.charAt(0).toUpperCase() + string.slice(1);
+function transformBlock(block) {
+  return block;
 }
-const getEventHandlerName = (key) => `on${capitalizeFirstLetter(key)}`;