@builder.io/sdk-svelte 1.0.3 → 1.0.6

package/lib/node/index-helpers/blocks-exports.d.ts

@@ -1,11 +1,10 @@
-export { default as Button } from '../blocks/button/button.svelte';
-export { default as Columns } from '../blocks/columns/columns.svelte';
-export { default as Fragment } from '../blocks/fragment/fragment.svelte';
-export { default as Image } from '../blocks/image/image.svelte';
-export { default as Section } from '../blocks/section/section.svelte';
-export { default as Symbol } from '../blocks/symbol/symbol.svelte';
-export { default as Text } from '../blocks/text/text.svelte';
-export { default as Video } from '../blocks/video/video.svelte';
-import { default as Blocks } from '../components/blocks/blocks.svelte';
-import { default as Content } from '../components/content-variants/content-variants.svelte';
-export { Blocks, Content };
+export { default as Button } from '../blocks/button/index.js';
+export { default as Columns } from '../blocks/columns/index.js';
+export { default as Fragment } from '../blocks/fragment/index.js';
+export { default as Image } from '../blocks/image/index.js';
+export { default as Section } from '../blocks/section/index.js';
+export { default as Symbol } from '../blocks/symbol/index.js';
+export { default as Text } from '../blocks/text/index.js';
+export { default as Video } from '../blocks/video/index.js';
+export { default as Blocks } from '../components/blocks/index.js';
+export { default as Content } from '../components/content-variants/index.js';

package/lib/node/index-helpers/blocks-exports.js

@@ -1,11 +1,10 @@
-export { default as Button } from '../blocks/button/button.svelte';
-export { default as Columns } from '../blocks/columns/columns.svelte';
-export { default as Fragment } from '../blocks/fragment/fragment.svelte';
-export { default as Image } from '../blocks/image/image.svelte';
-export { default as Section } from '../blocks/section/section.svelte';
-export { default as Symbol } from '../blocks/symbol/symbol.svelte';
-export { default as Text } from '../blocks/text/text.svelte';
-export { default as Video } from '../blocks/video/video.svelte';
-import { default as Blocks } from '../components/blocks/blocks.svelte';
-import { default as Content } from '../components/content-variants/content-variants.svelte';
-export { Blocks, Content };
+export { default as Button } from '../blocks/button/index.js';
+export { default as Columns } from '../blocks/columns/index.js';
+export { default as Fragment } from '../blocks/fragment/index.js';
+export { default as Image } from '../blocks/image/index.js';
+export { default as Section } from '../blocks/section/index.js';
+export { default as Symbol } from '../blocks/symbol/index.js';
+export { default as Text } from '../blocks/text/index.js';
+export { default as Video } from '../blocks/video/index.js';
+export { default as Blocks } from '../components/blocks/index.js';
+export { default as Content } from '../components/content-variants/index.js';

package/lib/node/index.d.ts

@@ -1,7 +1,10 @@
 export * from './index-helpers/top-of-file.js';
+/**
+ * In the React SDK, this file is marked with `use client`.
+ */
 export * from './index-helpers/blocks-exports.js';
 /**
- * We have a separate entry point to the SDKs that guarantees no components are being imported. This is useful
- * for React SDK, which would break in the NextJS App directory because the component imports have `use client` in them.
+ * In the React SDK, this file is not marked with `use client`, to allow
+ * NextJS App Directory to use the SDK helper functions without issues.
  */
 export * from './server-index.js';

package/lib/node/index.js

@@ -1,10 +1,13 @@
 // ignore prettier formatting for this file because the order of exports is meaningful
 // prettier-ignore
 export * from './index-helpers/top-of-file.js';
+/**
+ * In the React SDK, this file is marked with `use client`.
+ */
 // prettier-ignore
 export * from './index-helpers/blocks-exports.js';
 /**
- * We have a separate entry point to the SDKs that guarantees no components are being imported. This is useful
- * for React SDK, which would break in the NextJS App directory because the component imports have `use client` in them.
+ * In the React SDK, this file is not marked with `use client`, to allow
+ * NextJS App Directory to use the SDK helper functions without issues.
  */
 export * from './server-index.js';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@builder.io/sdk-svelte",
   "description": "Builder.io SDK for Svelte",
-  "version": "1.0.3",
+  "version": "1.0.6",
   "type": "module",
   "files": [
     "lib",
@@ -31,9 +31,9 @@
       "electron": "./lib/node/index.js",
       "default": "./lib/browser/index.js"
     },
-    "./edge": "./lib/edge/index.js",
-    "./node": "./lib/node/index.js",
-    "./browser": "./lib/browser/index.js"
+    "./bundle/edge": "./lib/edge/index.js",
+    "./bundle/node": "./lib/node/index.js",
+    "./bundle/browser": "./lib/browser/index.js"
   },
   "types": "./lib/browser/index.d.ts",
   "scripts": {

package/src/blocks/button/index.ts

@@ -0,0 +1 @@
+export { default } from './button.svelte'

package/src/blocks/columns/index.ts

@@ -0,0 +1 @@
+export { default } from './columns.svelte'

package/src/blocks/custom-code/index.ts

@@ -0,0 +1 @@
+export { default } from './custom-code.svelte'

package/src/blocks/embed/index.ts

@@ -0,0 +1 @@
+export { default } from './embed.svelte'

package/src/blocks/form/form/index.ts

@@ -0,0 +1 @@
+export { default } from './form.svelte'

package/src/blocks/form/input/index.ts

@@ -0,0 +1 @@
+export { default } from './input.svelte'

package/src/blocks/form/select/index.ts

@@ -0,0 +1 @@
+export { default } from './select.svelte'

package/src/blocks/form/submit-button/index.ts

@@ -0,0 +1 @@
+export { default } from './submit-button.svelte'

package/src/blocks/fragment/index.ts

@@ -0,0 +1 @@
+export { default } from './fragment.svelte'

package/src/blocks/image/index.ts

@@ -0,0 +1 @@
+export { default } from './image.svelte'

package/src/blocks/img/index.ts

@@ -0,0 +1 @@
+export { default } from './img.svelte'

package/src/blocks/raw-text/index.ts

@@ -0,0 +1 @@
+export { default } from './raw-text.svelte'

package/src/blocks/section/index.ts

@@ -0,0 +1 @@
+export { default } from './section.svelte'

package/src/blocks/slot/index.ts

@@ -0,0 +1 @@
+export { default } from './slot.svelte'

package/src/blocks/symbol/index.ts

@@ -0,0 +1 @@
+export { default } from './symbol.svelte'

package/src/blocks/symbol/symbol.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
   import { onMount } from "svelte";
 
-  import ContentVariants from "../../components/content-variants/content-variants.svelte";
+  import ContentVariants from "../../components/content-variants/index.js";
   import type { BuilderContent } from "../../types/builder-content.js";
   import { filterAttrs } from "../helpers.js";
   import { getClassPropName } from "../../functions/get-class-prop-name.js";
@@ -77,5 +77,7 @@
     model={symbol?.model}
     content={contentToUse}
     linkComponent={builderLinkComponent}
+    blocksWrapper={"div"}
+    contentWrapper={"div"}
   />
 </div>

package/src/blocks/text/index.ts

@@ -0,0 +1 @@
+export { default } from './text.svelte'

package/src/blocks/textarea/index.ts

@@ -0,0 +1 @@
+export { default } from './textarea.svelte'

package/src/blocks/video/index.ts

@@ -0,0 +1 @@
+export { default } from './video.svelte'

package/src/components/blocks/index.ts

@@ -0,0 +1 @@
+export { default } from './blocks.svelte'

package/src/components/content-variants/index.ts

@@ -0,0 +1 @@
+export { default } from './content-variants.svelte'

package/src/components/error-boundary.svelte

@@ -0,0 +1,10 @@
+<script context="module" lang="ts">
+  export interface ErrorBoundaryProps {
+    children: any;
+  }
+</script>
+
+<script lang="ts">
+</script>
+
+<slot />

package/src/constants/builder-registered-components.ts

@@ -1,19 +1,19 @@
-import { default as Button } from '../blocks/button/button.svelte';
 import { componentInfo as buttonComponentInfo } from '../blocks/button/component-info.js';
-import { default as Columns } from '../blocks/columns/columns.svelte';
+import { default as Button } from '../blocks/button/index.js';
 import { componentInfo as columnsComponentInfo } from '../blocks/columns/component-info.js';
+import { default as Columns } from '../blocks/columns/index.js';
 import { componentInfo as fragmentComponentInfo } from '../blocks/fragment/component-info.js';
-import { default as Fragment } from '../blocks/fragment/fragment.svelte';
+import { default as Fragment } from '../blocks/fragment/index.js';
 import { componentInfo as imageComponentInfo } from '../blocks/image/component-info.js';
-import { default as Image } from '../blocks/image/image.svelte';
+import { default as Image } from '../blocks/image/index.js';
 import { componentInfo as sectionComponentInfo } from '../blocks/section/component-info.js';
-import { default as Section } from '../blocks/section/section.svelte';
+import { default as Section } from '../blocks/section/index.js';
 import { componentInfo as slotComponentInfo } from '../blocks/slot/component-info.js';
-import { default as Slot } from '../blocks/slot/slot.svelte';
+import { default as Slot } from '../blocks/slot/index.js';
 import { componentInfo as symbolComponentInfo } from '../blocks/symbol/component-info.js';
-import { default as Symbol } from '../blocks/symbol/symbol.svelte';
+import { default as Symbol } from '../blocks/symbol/index.js';
 import { componentInfo as textComponentInfo } from '../blocks/text/component-info.js';
-import { default as Text } from '../blocks/text/text.svelte';
+import { default as Text } from '../blocks/text/index.js';
 import type { RegisteredComponent } from '../context/types.js';
 import { getExtraComponents } from './extra-components.js';
 

package/src/constants/extra-components.ts

@@ -5,21 +5,21 @@
  */
 
 import { componentInfo as customCodeInfo } from '../blocks/custom-code/component-info.js';
-import { default as customCode } from '../blocks/custom-code/custom-code.svelte';
+import { default as customCode } from '../blocks/custom-code/index.js';
 import { componentInfo as embedComponentInfo } from '../blocks/embed/component-info.js';
-import { default as embed } from '../blocks/embed/embed.svelte';
+import { default as embed } from '../blocks/embed/index.js';
 import { componentInfo as formComponentInfo } from '../blocks/form/form/component-info.js';
-import { default as Form } from '../blocks/form/form/form.svelte';
+import { default as Form } from '../blocks/form/form/index.js';
 import { componentInfo as formInputComponentInfo } from '../blocks/form/input/component-info.js';
-import { default as FormInput } from '../blocks/form/input/input.svelte';
+import { default as FormInput } from '../blocks/form/input/index.js';
 import { componentInfo as formSelectComponentInfo } from '../blocks/form/select/component-info.js';
-import { default as FormSelect } from '../blocks/form/select/select.svelte';
+import { default as FormSelect } from '../blocks/form/select/index.js';
 import { componentInfo as formSubmitButtonComponentInfo } from '../blocks/form/submit-button/component-info.js';
-import { default as FormSubmitButton } from '../blocks/form/submit-button/submit-button.svelte';
+import { default as FormSubmitButton } from '../blocks/form/submit-button/index.js';
 import { componentInfo as imgComponentInfo } from '../blocks/img/component-info.js';
-import { default as Img } from '../blocks/img/img.svelte';
+import { default as Img } from '../blocks/img/index.js';
 import { componentInfo as videoComponentInfo } from '../blocks/video/component-info.js';
-import { default as Video } from '../blocks/video/video.svelte';
+import { default as Video } from '../blocks/video/index.js';
 import type { RegisteredComponent } from '../context/types.js';
 import { TARGET } from './target.js';
 export const getExtraComponents: () => RegisteredComponent[] = () => [{

package/src/constants/sdk-version.ts

@@ -1 +1 @@
-export const SDK_VERSION = "1.0.3"
+export const SDK_VERSION = "1.0.6"

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

@@ -1,14 +1,8 @@
+import type { QueryObject } from '../../helpers/search/search.js';
+import { normalizeSearchParams } from '../../helpers/search/search.js';
 import { isBrowser } from '../is-browser.js';
 const BUILDER_SEARCHPARAMS_PREFIX = 'builder.';
 const BUILDER_OPTIONS_PREFIX = 'options.';
-type QueryObject = Record<string, string | string[]>;
-export const convertSearchParamsToQueryObject = (searchParams: URLSearchParams): QueryObject => {
-  const options: Record<string, string> = {};
-  searchParams.forEach((value, key) => {
-    options[key] = value;
-  });
-  return options;
-};
 
 /**
  * Receives a `URLSearchParams` object or a regular query object, and returns the subset of query params that are
@@ -36,5 +30,4 @@ export const getBuilderSearchParamsFromWindow = () => {
   }
   const searchParams = new URLSearchParams(window.location.search);
   return getBuilderSearchParams(searchParams);
-};
-export const normalizeSearchParams = (searchParams: QueryObject | URLSearchParams): QueryObject => searchParams instanceof URLSearchParams ? convertSearchParamsToQueryObject(searchParams) : searchParams
+}

package/src/functions/get-content/generate-content-url.ts

@@ -1,6 +1,7 @@
 import { flatten } from '../../helpers/flatten.js';
+import { normalizeSearchParams } from '../../helpers/search/search.js';
 import { DEFAULT_API_VERSION } from '../../types/api-version.js';
-import { getBuilderSearchParamsFromWindow, normalizeSearchParams } from '../get-builder-search-params/index.js';
+import { getBuilderSearchParamsFromWindow } from '../get-builder-search-params/index.js';
 import type { GetContentOptions } from './types.js';
 const isPositiveNumber = (thing: unknown) => typeof thing === 'number' && !isNaN(thing) && thing >= 0;
 export const generateContentUrl = (options: GetContentOptions): URL => {

package/src/functions/is-editing.ts

@@ -1,5 +1,6 @@
 import { TARGET } from '../constants/target.js';
+import { getSearchString, type Search } from '../helpers/search/search.js';
 import { isIframe } from './is-iframe.js';
-export function isEditing(): boolean {
-  return isIframe() && (TARGET === 'reactNative' || window.location.search.indexOf('builder.frameEditing=') !== -1);
+export function isEditing(search?: Search) {
+  return isIframe() && (TARGET === 'reactNative' || getSearchString(search || window.location.search).indexOf('builder.frameEditing=') !== -1);
 }

package/src/functions/is-previewing.ts

@@ -1,11 +1,14 @@
+import type { Search } from '../helpers/search/search.js';
+import { getSearchString } from '../helpers/search/search.js';
 import { isBrowser } from './is-browser.js';
 import { isEditing } from './is-editing.js';
-export function isPreviewing() {
+export function isPreviewing(search?: Search) {
   if (!isBrowser()) {
     return false;
   }
-  if (isEditing()) {
+  const normalizedSearch = getSearchString(search || window.location.search);
+  if (isEditing(normalizedSearch)) {
     return false;
   }
-  return Boolean(location.search.indexOf('builder.preview=') !== -1);
+  return Boolean(normalizedSearch.indexOf('builder.preview=') !== -1);
 }

package/src/helpers/search/search.ts

@@ -0,0 +1,18 @@
+export type QueryObject = Record<string, string | string[]>;
+export const convertSearchParamsToQueryObject = (searchParams: URLSearchParams): QueryObject => {
+  const options: Record<string, string> = {};
+  searchParams.forEach((value, key) => {
+    options[key] = value;
+  });
+  return options;
+};
+export const normalizeSearchParams = (searchParams: QueryObject | URLSearchParams): QueryObject => searchParams instanceof URLSearchParams ? convertSearchParamsToQueryObject(searchParams) : searchParams;
+export type Search = URLSearchParams | string | QueryObject;
+export const getSearchString = (search: Search): string => {
+  if (typeof search === 'string') {
+    return search;
+  } else if (search instanceof URLSearchParams) {
+    return search.toString();
+  }
+  return new URLSearchParams((search as any)).toString();
+}

package/src/index-helpers/blocks-exports.ts

@@ -1,11 +1,10 @@
-export { default as Button } from '../blocks/button/button.svelte';
-export { default as Columns } from '../blocks/columns/columns.svelte';
-export { default as Fragment } from '../blocks/fragment/fragment.svelte';
-export { default as Image } from '../blocks/image/image.svelte';
-export { default as Section } from '../blocks/section/section.svelte';
-export { default as Symbol } from '../blocks/symbol/symbol.svelte';
-export { default as Text } from '../blocks/text/text.svelte';
-export { default as Video } from '../blocks/video/video.svelte';
-import { default as Blocks } from '../components/blocks/blocks.svelte';
-import { default as Content } from '../components/content-variants/content-variants.svelte';
-export { Blocks, Content }
+export { default as Button } from '../blocks/button/index.js';
+export { default as Columns } from '../blocks/columns/index.js';
+export { default as Fragment } from '../blocks/fragment/index.js';
+export { default as Image } from '../blocks/image/index.js';
+export { default as Section } from '../blocks/section/index.js';
+export { default as Symbol } from '../blocks/symbol/index.js';
+export { default as Text } from '../blocks/text/index.js';
+export { default as Video } from '../blocks/video/index.js';
+export { default as Blocks } from '../components/blocks/index.js';
+export { default as Content } from '../components/content-variants/index.js'

package/src/index.ts

@@ -1,11 +1,15 @@
 // ignore prettier formatting for this file because the order of exports is meaningful
 // prettier-ignore
 export * from './index-helpers/top-of-file.js';
+
+/**
+ * In the React SDK, this file is marked with `use client`.
+ */
 // prettier-ignore
 export * from './index-helpers/blocks-exports.js';
 
 /**
- * We have a separate entry point to the SDKs that guarantees no components are being imported. This is useful
- * for React SDK, which would break in the NextJS App directory because the component imports have `use client` in them.
+ * In the React SDK, this file is not marked with `use client`, to allow
+ * NextJS App Directory to use the SDK helper functions without issues.
  */
 export * from './server-index.js'