@builder.io/sdk-svelte 0.0.7 → 0.0.8

package/src/components/render-content/render-content.svelte

@@ -46,7 +46,6 @@
 
   import { getDefaultRegisteredComponents } from "../../constants/builder-registered-components.js";
   import { TARGET } from "../../constants/target.js";
-  import BuilderContext from "../../context/builder.context.js";
   import { evaluate } from "../../functions/evaluate.js";
   import { getContent } from "../../functions/get-content/index.js";
   import { getFetch } from "../../functions/get-fetch.js";
@@ -60,6 +59,7 @@
   import { _track } from "../../functions/track.js";
   import RenderBlocks from "../render-blocks.svelte";
   import RenderContentStyles from "./components/render-styles.svelte";
+  import BuilderContext from "../../context/builder.context.js";
   import {
     registerInsertMenu,
     setupBrowserForEditing,
@@ -258,6 +258,11 @@
   let overrideState = {};
 
   onMount(() => {
+    if (!apiKey) {
+      console.error(
+        "[Builder.io]: No API key provided to `RenderContent` component. This can cause issues. Please provide an API key using the `apiKey` prop."
+      );
+    }
     if (isBrowser()) {
       if (isEditing()) {
         forceReRenderCount = forceReRenderCount + 1;
@@ -314,7 +319,7 @@
   function onUpdateFn_0() {
     evaluateJsCode();
   }
-  $: onUpdateFn_0(...[useContent?.()?.data?.jsCode]);
+  $: onUpdateFn_0(...[useContent?.()?.data?.jsCode, contentState()]);
   function onUpdateFn_1() {
     runHttpRequests();
   }

package/src/functions/evaluate.ts

@@ -7,9 +7,11 @@ export function evaluate({
   context,
   state,
   event,
+  isExpression = true,
 }: {
   code: string;
   event?: Event;
+  isExpression?: boolean;
 } & Pick<BuilderContextInterface, 'state' | 'context'>): any {
   if (code === '') {
     console.warn('Skipping evaluation of empty code block.');
@@ -24,11 +26,14 @@ export function evaluate({
 
   // Be able to handle simple expressions like "state.foo" or "1 + 1"
   // as well as full blocks like "var foo = "bar"; return foo"
-  const useReturn = !(
-    code.includes(';') ||
-    code.includes(' return ') ||
-    code.trim().startsWith('return ')
-  );
+  const useReturn =
+    // we disable this for cases where we definitely don't want a return
+    isExpression &&
+    !(
+      code.includes(';') ||
+      code.includes(' return ') ||
+      code.trim().startsWith('return ')
+    );
 
   const useCode = useReturn ? `return (${code});` : code;
 
@@ -46,7 +51,7 @@ export function evaluate({
       'Builder custom code error: \n While Evaluating: \n ',
       useCode,
       '\n',
-      (e as any).message || e
+      e
     );
   }
 }

package/src/functions/event-handler-name.ts

@@ -1,6 +1 @@
-function capitalizeFirstLetter(string: string) {
-  return string.charAt(0).toUpperCase() + string.slice(1);
-}
-
-export const getEventHandlerName = (key: string) =>
-  `on${capitalizeFirstLetter(key)}`;
+export const getEventHandlerName = (key: string) => `on:${key.toLowerCase()}`;

package/src/functions/get-block-actions-handler.ts

@@ -2,18 +2,19 @@ import type { BuilderContextInterface } from '../context/types.js';
 import type { BuilderBlock } from '../types/builder-block.js';
 import { evaluate } from './evaluate.js';
 
-export function crateEventHandler(
-  value: string,
-  options: { block: BuilderBlock } & Pick<
-    BuilderContextInterface,
-    'state' | 'context'
-  >
-): (event: Event) => any {
-  return (event: Event) =>
+type Options = {
+  block: BuilderBlock;
+} & Pick<BuilderContextInterface, 'state' | 'context'>;
+
+type EventHandler = (event: Event) => any;
+
+export const createEventHandler =
+  (value: string, options: Options): EventHandler =>
+  (event) =>
     evaluate({
       code: value,
       context: options.context,
       state: options.state,
       event,
+      isExpression: false,
     });
-}

package/src/functions/get-block-actions.ts

@@ -1,7 +1,7 @@
 import type { BuilderContextInterface } from '../context/types.js';
 import type { BuilderBlock } from '../types/builder-block.js';
 import { getEventHandlerName } from './event-handler-name.js';
-import { crateEventHandler } from './get-block-actions-handler.js';
+import { createEventHandler } from './get-block-actions-handler.js';
 
 type Actions = { [index: string]: (event: Event) => any };
 
@@ -19,7 +19,7 @@ export function getBlockActions(
       continue;
     }
     const value = optionActions[key];
-    obj[getEventHandlerName(key)] = crateEventHandler(value, options);
+    obj[getEventHandlerName(key)] = createEventHandler(value, options);
   }
   return obj;
 }

package/src/functions/get-builder-search-params/index.ts

@@ -2,7 +2,7 @@ import { isBrowser } from '../is-browser.js';
 
 const BUILDER_SEARCHPARAMS_PREFIX = 'builder.';
 
-type QueryObject = Record<string, string>;
+type QueryObject = Record<string, string | string[]>;
 
 export const convertSearchParamsToQueryObject = (
   searchParams: URLSearchParams

package/src/functions/track.ts

@@ -6,7 +6,12 @@ import { isBrowser } from './is-browser.js';
 import { isEditing } from './is-editing.js';
 
 interface Event {
-  type: 'click' | 'impression';
+  /**
+   * The type of your event.
+   *
+   * Examples: `click`, `conversion`, `pageview`, `impression`
+   */
+  type: string;
   data: {
     /**
      * (Optional) The content's ID. Useful if this event pertains to a specific piece of content.
@@ -95,6 +100,13 @@ const createEvent = async ({
 });
 
 export async function _track(eventProps: EventProps) {
+  if (!eventProps.apiKey) {
+    console.error(
+      '[Builder.io]: Missing API key for track call. Please provide your API key.'
+    );
+    return;
+  }
+
   if (!eventProps.canTrack) {
     return;
   }

package/package/functions/mark-mutable.d.ts

@@ -1,2 +0,0 @@
-export declare function markMutable<T = any>(value: T): T;
-export declare function markPropsMutable<T = any>(props: T): T;

package/package/functions/mark-mutable.js

@@ -1,6 +0,0 @@
-export function markMutable(value) {
-    return value;
-}
-export function markPropsMutable(props) {
-    return props;
-}

package/src/functions/mark-mutable.ts

@@ -1,7 +0,0 @@
-export function markMutable<T = any>(value: T): T {
-  return value;
-}
-
-export function markPropsMutable<T = any>(props: T): T {
-  return props;
-}