@builder.io/sdk-svelte 2.0.3 → 2.0.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/browser/blocks/image/image.svelte +3 -1
- package/lib/browser/blocks/image/image.types.d.ts +2 -0
- package/lib/browser/blocks/symbol/symbol.types.d.ts +1 -0
- package/lib/browser/blocks/text/component-info.js +2 -1
- package/lib/browser/blocks/text/text.svelte +16 -2
- package/lib/browser/blocks/text/text.svelte.d.ts +1 -0
- package/lib/browser/components/block/animator.js +4 -0
- package/lib/browser/components/block/block.svelte +2 -1
- package/lib/browser/components/content-variants/content-variants.svelte +1 -0
- package/lib/browser/components/content-variants/content-variants.types.d.ts +2 -1
- package/lib/browser/components/content-variants/extra-framework-props-types.d.ts +2 -0
- package/lib/browser/components/content-variants/extra-framework-props-types.js +1 -0
- package/lib/browser/constants/sdk-version.d.ts +1 -1
- package/lib/browser/constants/sdk-version.js +1 -1
- package/lib/browser/context/extra-context-types.d.ts +6 -0
- package/lib/browser/context/extra-context-types.js +1 -0
- package/lib/browser/context/types.d.ts +2 -1
- package/lib/edge/blocks/image/image.svelte +3 -1
- package/lib/edge/blocks/image/image.types.d.ts +2 -0
- package/lib/edge/blocks/symbol/symbol.types.d.ts +1 -0
- package/lib/edge/blocks/text/component-info.js +2 -1
- package/lib/edge/blocks/text/text.svelte +16 -2
- package/lib/edge/blocks/text/text.svelte.d.ts +1 -0
- package/lib/edge/components/block/animator.js +4 -0
- package/lib/edge/components/block/block.svelte +2 -1
- package/lib/edge/components/content-variants/content-variants.svelte +1 -0
- package/lib/edge/components/content-variants/content-variants.types.d.ts +2 -1
- package/lib/edge/components/content-variants/extra-framework-props-types.d.ts +2 -0
- package/lib/edge/components/content-variants/extra-framework-props-types.js +1 -0
- package/lib/edge/constants/sdk-version.d.ts +1 -1
- package/lib/edge/constants/sdk-version.js +1 -1
- package/lib/edge/context/extra-context-types.d.ts +6 -0
- package/lib/edge/context/extra-context-types.js +1 -0
- package/lib/edge/context/types.d.ts +2 -1
- package/lib/node/blocks/image/image.svelte +3 -1
- package/lib/node/blocks/image/image.types.d.ts +2 -0
- package/lib/node/blocks/symbol/symbol.types.d.ts +1 -0
- package/lib/node/blocks/text/component-info.js +2 -1
- package/lib/node/blocks/text/text.svelte +16 -2
- package/lib/node/blocks/text/text.svelte.d.ts +1 -0
- package/lib/node/components/block/animator.js +4 -0
- package/lib/node/components/block/block.svelte +2 -1
- package/lib/node/components/content-variants/content-variants.svelte +1 -0
- package/lib/node/components/content-variants/content-variants.types.d.ts +2 -1
- package/lib/node/components/content-variants/extra-framework-props-types.d.ts +2 -0
- package/lib/node/components/content-variants/extra-framework-props-types.js +1 -0
- package/lib/node/constants/sdk-version.d.ts +1 -1
- package/lib/node/constants/sdk-version.js +1 -1
- package/lib/node/context/extra-context-types.d.ts +6 -0
- package/lib/node/context/extra-context-types.js +1 -0
- package/lib/node/context/types.d.ts +2 -1
- package/package.json +1 -1
- package/src/blocks/image/image.svelte +4 -0
- package/src/blocks/image/image.types.ts +2 -0
- package/src/blocks/symbol/symbol.types.ts +1 -0
- package/src/blocks/text/component-info.ts +2 -1
- package/src/blocks/text/text.svelte +25 -1
- package/src/components/block/animator.ts +4 -0
- package/src/components/block/block.svelte +2 -1
- package/src/components/content-variants/content-variants.svelte +1 -0
- package/src/components/content-variants/content-variants.types.ts +2 -1
- package/src/components/content-variants/extra-framework-props-types.ts +1 -0
- package/src/constants/sdk-version.ts +1 -1
- package/src/context/extra-context-types.ts +5 -0
- package/src/context/types.ts +2 -1
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
<script>import {
|
|
1
|
+
<script>import { onMount } from "svelte";
|
|
2
|
+
import { getSrcSet } from "./image.helpers";
|
|
2
3
|
export let image;
|
|
3
4
|
export let src = undefined;
|
|
4
5
|
export let srcset = undefined;
|
|
@@ -64,6 +65,7 @@ $: aspectRatioCss = () => {
|
|
|
64
65
|
const out = aspectRatio ? aspectRatioStyles : undefined;
|
|
65
66
|
return out;
|
|
66
67
|
};
|
|
68
|
+
onMount(() => { });
|
|
67
69
|
</script>
|
|
68
70
|
|
|
69
71
|
<picture>
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import type { BuilderBlock } from '../../types/builder-block';
|
|
2
2
|
export interface ImageProps {
|
|
3
|
+
attributes?: string;
|
|
3
4
|
highPriority?: boolean;
|
|
4
5
|
className?: string;
|
|
5
6
|
image: string;
|
|
@@ -12,6 +13,7 @@ export interface ImageProps {
|
|
|
12
13
|
backgroundPosition?: string;
|
|
13
14
|
srcset?: string;
|
|
14
15
|
aspectRatio?: number;
|
|
16
|
+
lockAspectRatio?: boolean;
|
|
15
17
|
children?: any;
|
|
16
18
|
fitContent?: boolean;
|
|
17
19
|
builderBlock?: BuilderBlock;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { TARGET } from '../../constants/target';
|
|
2
2
|
export const componentInfo = {
|
|
3
3
|
shouldReceiveBuilderProps: {
|
|
4
|
-
builderBlock: TARGET === 'reactNative' ? true : false
|
|
4
|
+
builderBlock: TARGET === 'reactNative' ? true : false,
|
|
5
|
+
builderContext: true
|
|
5
6
|
},
|
|
6
7
|
name: 'Text',
|
|
7
8
|
static: true,
|
|
@@ -1,4 +1,6 @@
|
|
|
1
|
-
<script>
|
|
1
|
+
<script>import { evaluate } from "../../functions/evaluate/index";
|
|
2
|
+
export let builderContext;
|
|
3
|
+
export let text = undefined;
|
|
2
4
|
function stringifyStyles(stylesObj) {
|
|
3
5
|
let styles = "";
|
|
4
6
|
for (let key in stylesObj) {
|
|
@@ -9,6 +11,18 @@ function stringifyStyles(stylesObj) {
|
|
|
9
11
|
}
|
|
10
12
|
return styles;
|
|
11
13
|
}
|
|
14
|
+
$: processedText = () => {
|
|
15
|
+
const context = $builderContext;
|
|
16
|
+
const { context: contextContext, localState, rootState, rootSetState, } = context;
|
|
17
|
+
return String(text?.toString() || "").replace(/{{([^}]+)}}/g, (match, group) => evaluate({
|
|
18
|
+
code: group,
|
|
19
|
+
context: contextContext,
|
|
20
|
+
localState,
|
|
21
|
+
rootState,
|
|
22
|
+
rootSetState,
|
|
23
|
+
enableCache: false,
|
|
24
|
+
}));
|
|
25
|
+
};
|
|
12
26
|
</script>
|
|
13
27
|
|
|
14
28
|
<div
|
|
@@ -17,5 +31,5 @@ function stringifyStyles(stylesObj) {
|
|
|
17
31
|
})}
|
|
18
32
|
class="builder-text"
|
|
19
33
|
>
|
|
20
|
-
{@html
|
|
34
|
+
{@html processedText()}
|
|
21
35
|
</div>
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { TARGET } from '../../constants/target';
|
|
1
2
|
import { camelToKebabCase } from '../../functions/camel-to-kebab-case';
|
|
2
3
|
// eslint-disable-next-line @typescript-eslint/ban-types
|
|
3
4
|
function throttle(func, wait, options = {}) {
|
|
@@ -56,6 +57,9 @@ function assign(target, ..._args) {
|
|
|
56
57
|
return to;
|
|
57
58
|
}
|
|
58
59
|
export function bindAnimations(animations) {
|
|
60
|
+
if (TARGET === 'reactNative') {
|
|
61
|
+
return;
|
|
62
|
+
}
|
|
59
63
|
for (const animation of animations) {
|
|
60
64
|
switch (animation.trigger) {
|
|
61
65
|
case 'pageLoad':
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
<script context="module"></script>
|
|
2
2
|
|
|
3
3
|
<script>import { onMount } from "svelte";
|
|
4
|
+
import { TARGET } from "../../constants/target";
|
|
4
5
|
import { getBlockComponentOptions } from "../../functions/get-block-component-options";
|
|
5
6
|
import { getProcessedBlock } from "../../functions/get-processed-block";
|
|
6
7
|
import "../dynamic-div.svelte";
|
|
@@ -86,7 +87,7 @@ $: componentRefProps = () => {
|
|
|
86
87
|
registeredComponents: registeredComponents,
|
|
87
88
|
builderBlock: processedBlock(),
|
|
88
89
|
includeBlockProps: blockComponent?.()?.noWrap === true,
|
|
89
|
-
isInteractive: !blockComponent?.()?.isRSC,
|
|
90
|
+
isInteractive: !(blockComponent?.()?.isRSC && TARGET === "rsc"),
|
|
90
91
|
};
|
|
91
92
|
};
|
|
92
93
|
onMount(() => {
|
|
@@ -2,7 +2,8 @@ import type { BuilderRenderContext, RegisteredComponent } from '../../context/ty
|
|
|
2
2
|
import type { ApiVersion } from '../../types/api-version';
|
|
3
3
|
import type { BuilderContent } from '../../types/builder-content';
|
|
4
4
|
import type { Nullable } from '../../types/typescript';
|
|
5
|
-
|
|
5
|
+
import type { ExtraFrameworkProps } from './extra-framework-props-types';
|
|
6
|
+
export interface ContentVariantsPrps extends ExtraFrameworkProps {
|
|
6
7
|
/**
|
|
7
8
|
* The Builder content JSON to render (required).
|
|
8
9
|
*/
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const SDK_VERSION = "2.0.
|
|
1
|
+
export declare const SDK_VERSION = "2.0.8";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export const SDK_VERSION = "2.0.
|
|
1
|
+
export const SDK_VERSION = "2.0.8";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -3,13 +3,14 @@ import type { ApiVersion } from '../types/api-version';
|
|
|
3
3
|
import type { BuilderContent } from '../types/builder-content';
|
|
4
4
|
import type { ComponentInfo } from '../types/components';
|
|
5
5
|
import type { Dictionary, Nullable } from '../types/typescript';
|
|
6
|
+
import type { ExtraContextTypes } from './extra-context-types';
|
|
6
7
|
export type RegisteredComponent = ComponentInfo & {
|
|
7
8
|
component: any;
|
|
8
9
|
};
|
|
9
10
|
export type RegisteredComponents = Dictionary<RegisteredComponent>;
|
|
10
11
|
export type BuilderRenderState = Record<string, unknown>;
|
|
11
12
|
export type BuilderRenderContext = Record<string, unknown>;
|
|
12
|
-
export interface BuilderContextInterface extends Pick<BlocksWrapperProps, 'BlocksWrapper' | 'BlocksWrapperProps'
|
|
13
|
+
export interface BuilderContextInterface extends Pick<BlocksWrapperProps, 'BlocksWrapper' | 'BlocksWrapperProps'>, ExtraContextTypes {
|
|
13
14
|
content: Nullable<BuilderContent>;
|
|
14
15
|
context: BuilderRenderContext;
|
|
15
16
|
/**
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
<script>import {
|
|
1
|
+
<script>import { onMount } from "svelte";
|
|
2
|
+
import { getSrcSet } from "./image.helpers";
|
|
2
3
|
export let image;
|
|
3
4
|
export let src = undefined;
|
|
4
5
|
export let srcset = undefined;
|
|
@@ -64,6 +65,7 @@ $: aspectRatioCss = () => {
|
|
|
64
65
|
const out = aspectRatio ? aspectRatioStyles : undefined;
|
|
65
66
|
return out;
|
|
66
67
|
};
|
|
68
|
+
onMount(() => { });
|
|
67
69
|
</script>
|
|
68
70
|
|
|
69
71
|
<picture>
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import type { BuilderBlock } from '../../types/builder-block';
|
|
2
2
|
export interface ImageProps {
|
|
3
|
+
attributes?: string;
|
|
3
4
|
highPriority?: boolean;
|
|
4
5
|
className?: string;
|
|
5
6
|
image: string;
|
|
@@ -12,6 +13,7 @@ export interface ImageProps {
|
|
|
12
13
|
backgroundPosition?: string;
|
|
13
14
|
srcset?: string;
|
|
14
15
|
aspectRatio?: number;
|
|
16
|
+
lockAspectRatio?: boolean;
|
|
15
17
|
children?: any;
|
|
16
18
|
fitContent?: boolean;
|
|
17
19
|
builderBlock?: BuilderBlock;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { TARGET } from '../../constants/target';
|
|
2
2
|
export const componentInfo = {
|
|
3
3
|
shouldReceiveBuilderProps: {
|
|
4
|
-
builderBlock: TARGET === 'reactNative' ? true : false
|
|
4
|
+
builderBlock: TARGET === 'reactNative' ? true : false,
|
|
5
|
+
builderContext: true
|
|
5
6
|
},
|
|
6
7
|
name: 'Text',
|
|
7
8
|
static: true,
|
|
@@ -1,4 +1,6 @@
|
|
|
1
|
-
<script>
|
|
1
|
+
<script>import { evaluate } from "../../functions/evaluate/index";
|
|
2
|
+
export let builderContext;
|
|
3
|
+
export let text = undefined;
|
|
2
4
|
function stringifyStyles(stylesObj) {
|
|
3
5
|
let styles = "";
|
|
4
6
|
for (let key in stylesObj) {
|
|
@@ -9,6 +11,18 @@ function stringifyStyles(stylesObj) {
|
|
|
9
11
|
}
|
|
10
12
|
return styles;
|
|
11
13
|
}
|
|
14
|
+
$: processedText = () => {
|
|
15
|
+
const context = $builderContext;
|
|
16
|
+
const { context: contextContext, localState, rootState, rootSetState, } = context;
|
|
17
|
+
return String(text?.toString() || "").replace(/{{([^}]+)}}/g, (match, group) => evaluate({
|
|
18
|
+
code: group,
|
|
19
|
+
context: contextContext,
|
|
20
|
+
localState,
|
|
21
|
+
rootState,
|
|
22
|
+
rootSetState,
|
|
23
|
+
enableCache: false,
|
|
24
|
+
}));
|
|
25
|
+
};
|
|
12
26
|
</script>
|
|
13
27
|
|
|
14
28
|
<div
|
|
@@ -17,5 +31,5 @@ function stringifyStyles(stylesObj) {
|
|
|
17
31
|
})}
|
|
18
32
|
class="builder-text"
|
|
19
33
|
>
|
|
20
|
-
{@html
|
|
34
|
+
{@html processedText()}
|
|
21
35
|
</div>
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { TARGET } from '../../constants/target';
|
|
1
2
|
import { camelToKebabCase } from '../../functions/camel-to-kebab-case';
|
|
2
3
|
// eslint-disable-next-line @typescript-eslint/ban-types
|
|
3
4
|
function throttle(func, wait, options = {}) {
|
|
@@ -56,6 +57,9 @@ function assign(target, ..._args) {
|
|
|
56
57
|
return to;
|
|
57
58
|
}
|
|
58
59
|
export function bindAnimations(animations) {
|
|
60
|
+
if (TARGET === 'reactNative') {
|
|
61
|
+
return;
|
|
62
|
+
}
|
|
59
63
|
for (const animation of animations) {
|
|
60
64
|
switch (animation.trigger) {
|
|
61
65
|
case 'pageLoad':
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
<script context="module"></script>
|
|
2
2
|
|
|
3
3
|
<script>import { onMount } from "svelte";
|
|
4
|
+
import { TARGET } from "../../constants/target";
|
|
4
5
|
import { getBlockComponentOptions } from "../../functions/get-block-component-options";
|
|
5
6
|
import { getProcessedBlock } from "../../functions/get-processed-block";
|
|
6
7
|
import "../dynamic-div.svelte";
|
|
@@ -86,7 +87,7 @@ $: componentRefProps = () => {
|
|
|
86
87
|
registeredComponents: registeredComponents,
|
|
87
88
|
builderBlock: processedBlock(),
|
|
88
89
|
includeBlockProps: blockComponent?.()?.noWrap === true,
|
|
89
|
-
isInteractive: !blockComponent?.()?.isRSC,
|
|
90
|
+
isInteractive: !(blockComponent?.()?.isRSC && TARGET === "rsc"),
|
|
90
91
|
};
|
|
91
92
|
};
|
|
92
93
|
onMount(() => {
|
|
@@ -2,7 +2,8 @@ import type { BuilderRenderContext, RegisteredComponent } from '../../context/ty
|
|
|
2
2
|
import type { ApiVersion } from '../../types/api-version';
|
|
3
3
|
import type { BuilderContent } from '../../types/builder-content';
|
|
4
4
|
import type { Nullable } from '../../types/typescript';
|
|
5
|
-
|
|
5
|
+
import type { ExtraFrameworkProps } from './extra-framework-props-types';
|
|
6
|
+
export interface ContentVariantsPrps extends ExtraFrameworkProps {
|
|
6
7
|
/**
|
|
7
8
|
* The Builder content JSON to render (required).
|
|
8
9
|
*/
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const SDK_VERSION = "2.0.
|
|
1
|
+
export declare const SDK_VERSION = "2.0.8";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export const SDK_VERSION = "2.0.
|
|
1
|
+
export const SDK_VERSION = "2.0.8";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -3,13 +3,14 @@ import type { ApiVersion } from '../types/api-version';
|
|
|
3
3
|
import type { BuilderContent } from '../types/builder-content';
|
|
4
4
|
import type { ComponentInfo } from '../types/components';
|
|
5
5
|
import type { Dictionary, Nullable } from '../types/typescript';
|
|
6
|
+
import type { ExtraContextTypes } from './extra-context-types';
|
|
6
7
|
export type RegisteredComponent = ComponentInfo & {
|
|
7
8
|
component: any;
|
|
8
9
|
};
|
|
9
10
|
export type RegisteredComponents = Dictionary<RegisteredComponent>;
|
|
10
11
|
export type BuilderRenderState = Record<string, unknown>;
|
|
11
12
|
export type BuilderRenderContext = Record<string, unknown>;
|
|
12
|
-
export interface BuilderContextInterface extends Pick<BlocksWrapperProps, 'BlocksWrapper' | 'BlocksWrapperProps'
|
|
13
|
+
export interface BuilderContextInterface extends Pick<BlocksWrapperProps, 'BlocksWrapper' | 'BlocksWrapperProps'>, ExtraContextTypes {
|
|
13
14
|
content: Nullable<BuilderContent>;
|
|
14
15
|
context: BuilderRenderContext;
|
|
15
16
|
/**
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
<script>import {
|
|
1
|
+
<script>import { onMount } from "svelte";
|
|
2
|
+
import { getSrcSet } from "./image.helpers";
|
|
2
3
|
export let image;
|
|
3
4
|
export let src = undefined;
|
|
4
5
|
export let srcset = undefined;
|
|
@@ -64,6 +65,7 @@ $: aspectRatioCss = () => {
|
|
|
64
65
|
const out = aspectRatio ? aspectRatioStyles : undefined;
|
|
65
66
|
return out;
|
|
66
67
|
};
|
|
68
|
+
onMount(() => { });
|
|
67
69
|
</script>
|
|
68
70
|
|
|
69
71
|
<picture>
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import type { BuilderBlock } from '../../types/builder-block';
|
|
2
2
|
export interface ImageProps {
|
|
3
|
+
attributes?: string;
|
|
3
4
|
highPriority?: boolean;
|
|
4
5
|
className?: string;
|
|
5
6
|
image: string;
|
|
@@ -12,6 +13,7 @@ export interface ImageProps {
|
|
|
12
13
|
backgroundPosition?: string;
|
|
13
14
|
srcset?: string;
|
|
14
15
|
aspectRatio?: number;
|
|
16
|
+
lockAspectRatio?: boolean;
|
|
15
17
|
children?: any;
|
|
16
18
|
fitContent?: boolean;
|
|
17
19
|
builderBlock?: BuilderBlock;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { TARGET } from '../../constants/target';
|
|
2
2
|
export const componentInfo = {
|
|
3
3
|
shouldReceiveBuilderProps: {
|
|
4
|
-
builderBlock: TARGET === 'reactNative' ? true : false
|
|
4
|
+
builderBlock: TARGET === 'reactNative' ? true : false,
|
|
5
|
+
builderContext: true
|
|
5
6
|
},
|
|
6
7
|
name: 'Text',
|
|
7
8
|
static: true,
|
|
@@ -1,4 +1,6 @@
|
|
|
1
|
-
<script>
|
|
1
|
+
<script>import { evaluate } from "../../functions/evaluate/index";
|
|
2
|
+
export let builderContext;
|
|
3
|
+
export let text = undefined;
|
|
2
4
|
function stringifyStyles(stylesObj) {
|
|
3
5
|
let styles = "";
|
|
4
6
|
for (let key in stylesObj) {
|
|
@@ -9,6 +11,18 @@ function stringifyStyles(stylesObj) {
|
|
|
9
11
|
}
|
|
10
12
|
return styles;
|
|
11
13
|
}
|
|
14
|
+
$: processedText = () => {
|
|
15
|
+
const context = $builderContext;
|
|
16
|
+
const { context: contextContext, localState, rootState, rootSetState, } = context;
|
|
17
|
+
return String(text?.toString() || "").replace(/{{([^}]+)}}/g, (match, group) => evaluate({
|
|
18
|
+
code: group,
|
|
19
|
+
context: contextContext,
|
|
20
|
+
localState,
|
|
21
|
+
rootState,
|
|
22
|
+
rootSetState,
|
|
23
|
+
enableCache: false,
|
|
24
|
+
}));
|
|
25
|
+
};
|
|
12
26
|
</script>
|
|
13
27
|
|
|
14
28
|
<div
|
|
@@ -17,5 +31,5 @@ function stringifyStyles(stylesObj) {
|
|
|
17
31
|
})}
|
|
18
32
|
class="builder-text"
|
|
19
33
|
>
|
|
20
|
-
{@html
|
|
34
|
+
{@html processedText()}
|
|
21
35
|
</div>
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { TARGET } from '../../constants/target';
|
|
1
2
|
import { camelToKebabCase } from '../../functions/camel-to-kebab-case';
|
|
2
3
|
// eslint-disable-next-line @typescript-eslint/ban-types
|
|
3
4
|
function throttle(func, wait, options = {}) {
|
|
@@ -56,6 +57,9 @@ function assign(target, ..._args) {
|
|
|
56
57
|
return to;
|
|
57
58
|
}
|
|
58
59
|
export function bindAnimations(animations) {
|
|
60
|
+
if (TARGET === 'reactNative') {
|
|
61
|
+
return;
|
|
62
|
+
}
|
|
59
63
|
for (const animation of animations) {
|
|
60
64
|
switch (animation.trigger) {
|
|
61
65
|
case 'pageLoad':
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
<script context="module"></script>
|
|
2
2
|
|
|
3
3
|
<script>import { onMount } from "svelte";
|
|
4
|
+
import { TARGET } from "../../constants/target";
|
|
4
5
|
import { getBlockComponentOptions } from "../../functions/get-block-component-options";
|
|
5
6
|
import { getProcessedBlock } from "../../functions/get-processed-block";
|
|
6
7
|
import "../dynamic-div.svelte";
|
|
@@ -86,7 +87,7 @@ $: componentRefProps = () => {
|
|
|
86
87
|
registeredComponents: registeredComponents,
|
|
87
88
|
builderBlock: processedBlock(),
|
|
88
89
|
includeBlockProps: blockComponent?.()?.noWrap === true,
|
|
89
|
-
isInteractive: !blockComponent?.()?.isRSC,
|
|
90
|
+
isInteractive: !(blockComponent?.()?.isRSC && TARGET === "rsc"),
|
|
90
91
|
};
|
|
91
92
|
};
|
|
92
93
|
onMount(() => {
|
|
@@ -2,7 +2,8 @@ import type { BuilderRenderContext, RegisteredComponent } from '../../context/ty
|
|
|
2
2
|
import type { ApiVersion } from '../../types/api-version';
|
|
3
3
|
import type { BuilderContent } from '../../types/builder-content';
|
|
4
4
|
import type { Nullable } from '../../types/typescript';
|
|
5
|
-
|
|
5
|
+
import type { ExtraFrameworkProps } from './extra-framework-props-types';
|
|
6
|
+
export interface ContentVariantsPrps extends ExtraFrameworkProps {
|
|
6
7
|
/**
|
|
7
8
|
* The Builder content JSON to render (required).
|
|
8
9
|
*/
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const SDK_VERSION = "2.0.
|
|
1
|
+
export declare const SDK_VERSION = "2.0.8";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export const SDK_VERSION = "2.0.
|
|
1
|
+
export const SDK_VERSION = "2.0.8";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -3,13 +3,14 @@ import type { ApiVersion } from '../types/api-version';
|
|
|
3
3
|
import type { BuilderContent } from '../types/builder-content';
|
|
4
4
|
import type { ComponentInfo } from '../types/components';
|
|
5
5
|
import type { Dictionary, Nullable } from '../types/typescript';
|
|
6
|
+
import type { ExtraContextTypes } from './extra-context-types';
|
|
6
7
|
export type RegisteredComponent = ComponentInfo & {
|
|
7
8
|
component: any;
|
|
8
9
|
};
|
|
9
10
|
export type RegisteredComponents = Dictionary<RegisteredComponent>;
|
|
10
11
|
export type BuilderRenderState = Record<string, unknown>;
|
|
11
12
|
export type BuilderRenderContext = Record<string, unknown>;
|
|
12
|
-
export interface BuilderContextInterface extends Pick<BlocksWrapperProps, 'BlocksWrapper' | 'BlocksWrapperProps'
|
|
13
|
+
export interface BuilderContextInterface extends Pick<BlocksWrapperProps, 'BlocksWrapper' | 'BlocksWrapperProps'>, ExtraContextTypes {
|
|
13
14
|
content: Nullable<BuilderContent>;
|
|
14
15
|
context: BuilderRenderContext;
|
|
15
16
|
/**
|
package/package.json
CHANGED
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
<script lang="ts">
|
|
2
|
+
import { onMount } from "svelte";
|
|
3
|
+
|
|
2
4
|
import { getSrcSet } from "./image.helpers";
|
|
3
5
|
import type { ImageProps } from "./image.types";
|
|
4
6
|
|
|
@@ -69,6 +71,8 @@
|
|
|
69
71
|
const out = aspectRatio ? aspectRatioStyles : undefined;
|
|
70
72
|
return out;
|
|
71
73
|
};
|
|
74
|
+
|
|
75
|
+
onMount(() => {});
|
|
72
76
|
</script>
|
|
73
77
|
|
|
74
78
|
<picture>
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import type { BuilderBlock } from '../../types/builder-block';
|
|
2
2
|
export interface ImageProps {
|
|
3
|
+
attributes?: string;
|
|
3
4
|
highPriority?: boolean;
|
|
4
5
|
className?: string;
|
|
5
6
|
image: string;
|
|
@@ -12,6 +13,7 @@ export interface ImageProps {
|
|
|
12
13
|
backgroundPosition?: string;
|
|
13
14
|
srcset?: string;
|
|
14
15
|
aspectRatio?: number;
|
|
16
|
+
lockAspectRatio?: boolean;
|
|
15
17
|
children?: any;
|
|
16
18
|
fitContent?: boolean;
|
|
17
19
|
builderBlock?: BuilderBlock;
|
|
@@ -2,7 +2,8 @@ import { TARGET } from '../../constants/target';
|
|
|
2
2
|
import type { ComponentInfo } from '../../types/components';
|
|
3
3
|
export const componentInfo: ComponentInfo = {
|
|
4
4
|
shouldReceiveBuilderProps: {
|
|
5
|
-
builderBlock: TARGET === 'reactNative' ? true : false
|
|
5
|
+
builderBlock: TARGET === 'reactNative' ? true : false,
|
|
6
|
+
builderContext: true
|
|
6
7
|
},
|
|
7
8
|
name: 'Text',
|
|
8
9
|
static: true,
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
<script lang="ts">
|
|
2
|
+
import { evaluate } from "../../functions/evaluate/index";
|
|
2
3
|
import type { TextProps } from "./text.types";
|
|
3
4
|
|
|
5
|
+
export let builderContext: TextProps["builderContext"];
|
|
4
6
|
export let text: TextProps["text"] = undefined;
|
|
5
7
|
function stringifyStyles(stylesObj) {
|
|
6
8
|
let styles = "";
|
|
@@ -12,6 +14,28 @@
|
|
|
12
14
|
}
|
|
13
15
|
return styles;
|
|
14
16
|
}
|
|
17
|
+
|
|
18
|
+
$: processedText = () => {
|
|
19
|
+
const context = $builderContext;
|
|
20
|
+
const {
|
|
21
|
+
context: contextContext,
|
|
22
|
+
localState,
|
|
23
|
+
rootState,
|
|
24
|
+
rootSetState,
|
|
25
|
+
} = context;
|
|
26
|
+
return String(text?.toString() || "").replace(
|
|
27
|
+
/{{([^}]+)}}/g,
|
|
28
|
+
(match, group) =>
|
|
29
|
+
evaluate({
|
|
30
|
+
code: group,
|
|
31
|
+
context: contextContext,
|
|
32
|
+
localState,
|
|
33
|
+
rootState,
|
|
34
|
+
rootSetState,
|
|
35
|
+
enableCache: false,
|
|
36
|
+
}) as string
|
|
37
|
+
);
|
|
38
|
+
};
|
|
15
39
|
</script>
|
|
16
40
|
|
|
17
41
|
<div
|
|
@@ -20,5 +44,5 @@
|
|
|
20
44
|
})}
|
|
21
45
|
class="builder-text"
|
|
22
46
|
>
|
|
23
|
-
{@html
|
|
47
|
+
{@html processedText()}
|
|
24
48
|
</div>
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { TARGET } from '../../constants/target';
|
|
1
2
|
import { camelToKebabCase } from '../../functions/camel-to-kebab-case';
|
|
2
3
|
import type { BuilderAnimation } from '../../types/builder-block';
|
|
3
4
|
|
|
@@ -54,6 +55,9 @@ function assign(target: object, ..._args: any[]) {
|
|
|
54
55
|
return to;
|
|
55
56
|
}
|
|
56
57
|
export function bindAnimations(animations: BuilderAnimation[]) {
|
|
58
|
+
if (TARGET === 'reactNative') {
|
|
59
|
+
return;
|
|
60
|
+
}
|
|
57
61
|
for (const animation of animations) {
|
|
58
62
|
switch (animation.trigger) {
|
|
59
63
|
case 'pageLoad':
|
|
@@ -10,6 +10,7 @@
|
|
|
10
10
|
<script lang="ts">
|
|
11
11
|
import { onMount } from "svelte";
|
|
12
12
|
|
|
13
|
+
import { TARGET } from "../../constants/target";
|
|
13
14
|
import type {
|
|
14
15
|
BuilderContextInterface,
|
|
15
16
|
RegisteredComponents,
|
|
@@ -115,7 +116,7 @@
|
|
|
115
116
|
registeredComponents: registeredComponents,
|
|
116
117
|
builderBlock: processedBlock(),
|
|
117
118
|
includeBlockProps: blockComponent?.()?.noWrap === true,
|
|
118
|
-
isInteractive: !blockComponent?.()?.isRSC,
|
|
119
|
+
isInteractive: !(blockComponent?.()?.isRSC && TARGET === "rsc"),
|
|
119
120
|
};
|
|
120
121
|
};
|
|
121
122
|
|
|
@@ -2,7 +2,8 @@ import type { BuilderRenderContext, RegisteredComponent } from '../../context/ty
|
|
|
2
2
|
import type { ApiVersion } from '../../types/api-version';
|
|
3
3
|
import type { BuilderContent } from '../../types/builder-content';
|
|
4
4
|
import type { Nullable } from '../../types/typescript';
|
|
5
|
-
|
|
5
|
+
import type { ExtraFrameworkProps } from './extra-framework-props-types';
|
|
6
|
+
export interface ContentVariantsPrps extends ExtraFrameworkProps {
|
|
6
7
|
/**
|
|
7
8
|
* The Builder content JSON to render (required).
|
|
8
9
|
*/
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export interface ExtraFrameworkProps {}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export const SDK_VERSION = "2.0.
|
|
1
|
+
export const SDK_VERSION = "2.0.8"
|
package/src/context/types.ts
CHANGED
|
@@ -3,13 +3,14 @@ import type { ApiVersion } from '../types/api-version';
|
|
|
3
3
|
import type { BuilderContent } from '../types/builder-content';
|
|
4
4
|
import type { ComponentInfo } from '../types/components';
|
|
5
5
|
import type { Dictionary, Nullable } from '../types/typescript';
|
|
6
|
+
import type { ExtraContextTypes } from './extra-context-types';
|
|
6
7
|
export type RegisteredComponent = ComponentInfo & {
|
|
7
8
|
component: any;
|
|
8
9
|
};
|
|
9
10
|
export type RegisteredComponents = Dictionary<RegisteredComponent>;
|
|
10
11
|
export type BuilderRenderState = Record<string, unknown>;
|
|
11
12
|
export type BuilderRenderContext = Record<string, unknown>;
|
|
12
|
-
export interface BuilderContextInterface extends Pick<BlocksWrapperProps, 'BlocksWrapper' | 'BlocksWrapperProps'
|
|
13
|
+
export interface BuilderContextInterface extends Pick<BlocksWrapperProps, 'BlocksWrapper' | 'BlocksWrapperProps'>, ExtraContextTypes {
|
|
13
14
|
content: Nullable<BuilderContent>;
|
|
14
15
|
context: BuilderRenderContext;
|
|
15
16
|
/**
|