@builder.io/sdk-svelte 0.4.5 → 0.5.0
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/package/--package.json +40 -29
- package/package/CHANGELOG.md +4 -0
- package/package/blocks/BaseText.svelte +1 -1
- package/package/blocks/button/button.svelte +18 -33
- package/package/blocks/button/button.svelte.d.ts +3 -1
- package/package/blocks/button/component-info.d.ts +1 -1
- package/package/blocks/button/component-info.js +9 -13
- package/package/blocks/columns/columns.svelte +12 -18
- package/package/blocks/columns/columns.svelte.d.ts +11 -7
- package/package/blocks/columns/component-info.d.ts +1 -1
- package/package/blocks/columns/component-info.js +62 -83
- package/package/blocks/custom-code/component-info.d.ts +1 -1
- package/package/blocks/custom-code/component-info.js +7 -11
- package/package/blocks/embed/component-info.d.ts +1 -1
- package/package/blocks/embed/component-info.js +8 -15
- package/package/blocks/embed/helpers.js +1 -5
- package/package/blocks/form/component-info.d.ts +1 -1
- package/package/blocks/form/component-info.js +94 -129
- package/package/blocks/form/form.svelte +2 -289
- package/package/blocks/form/form.svelte.d.ts +1 -57
- package/package/blocks/fragment/component-info.d.ts +1 -1
- package/package/blocks/fragment/component-info.js +1 -1
- package/package/blocks/helpers.d.ts +13 -0
- package/package/blocks/helpers.js +40 -0
- package/package/blocks/image/component-info.d.ts +1 -1
- package/package/blocks/image/component-info.js +33 -63
- package/package/blocks/image/image.helpers.js +2 -11
- package/package/blocks/image/image.svelte.d.ts +0 -1
- package/package/blocks/img/component-info.d.ts +1 -1
- package/package/blocks/img/component-info.js +4 -6
- package/package/blocks/img/img.svelte +4 -29
- package/package/blocks/img/img.svelte.d.ts +3 -1
- package/package/blocks/input/component-info.d.ts +1 -1
- package/package/blocks/input/component-info.js +15 -40
- package/package/blocks/input/input.svelte +4 -29
- package/package/blocks/input/input.svelte.d.ts +3 -1
- package/package/blocks/raw-text/component-info.d.ts +1 -1
- package/package/blocks/raw-text/component-info.js +3 -5
- package/package/blocks/raw-text/raw-text.svelte +3 -5
- package/package/blocks/raw-text/raw-text.svelte.d.ts +1 -1
- package/package/blocks/section/component-info.d.ts +1 -1
- package/package/blocks/section/component-info.js +13 -18
- package/package/blocks/section/section.svelte +4 -29
- package/package/blocks/section/section.svelte.d.ts +3 -1
- package/package/blocks/select/component-info.d.ts +1 -1
- package/package/blocks/select/component-info.js +22 -34
- package/package/blocks/select/select.svelte +4 -29
- package/package/blocks/select/select.svelte.d.ts +3 -1
- package/package/blocks/submit-button/component-info.d.ts +1 -1
- package/package/blocks/submit-button/component-info.js +5 -7
- package/package/blocks/submit-button/submit-button.svelte +4 -29
- package/package/blocks/submit-button/submit-button.svelte.d.ts +3 -1
- package/package/blocks/symbol/component-info.d.ts +1 -1
- package/package/blocks/symbol/component-info.js +12 -17
- package/package/blocks/symbol/symbol.helpers.d.ts +14 -0
- package/package/blocks/symbol/symbol.helpers.js +31 -0
- package/package/blocks/symbol/symbol.svelte +37 -87
- package/package/blocks/symbol/symbol.svelte.d.ts +13 -7
- package/package/blocks/text/component-info.d.ts +1 -1
- package/package/blocks/text/component-info.js +6 -7
- package/package/blocks/text/text.svelte +1 -1
- package/package/blocks/textarea/component-info.d.ts +1 -1
- package/package/blocks/textarea/component-info.js +13 -19
- package/package/blocks/textarea/textarea.svelte +4 -29
- package/package/blocks/textarea/textarea.svelte.d.ts +3 -1
- package/package/blocks/video/component-info.d.ts +1 -1
- package/package/blocks/video/component-info.js +35 -55
- package/package/blocks/video/video.svelte +4 -30
- package/package/blocks/video/video.svelte.d.ts +2 -0
- package/package/components/block/block.helpers.d.ts +13 -0
- package/package/components/{render-block/render-block.helpers.js → block/block.helpers.js} +12 -29
- package/package/components/block/block.svelte +135 -0
- package/package/components/block/block.svelte.d.ts +26 -0
- package/package/components/{render-block → block/components}/block-styles.svelte +20 -22
- package/package/components/{render-block → block/components}/block-styles.svelte.d.ts +2 -2
- package/package/components/block/components/block-wrapper.svelte +53 -0
- package/package/components/block/components/block-wrapper.svelte.d.ts +33 -0
- package/package/components/block/components/component-ref/component-ref.helpers.d.ts +36 -0
- package/package/components/block/components/component-ref/component-ref.helpers.js +22 -0
- package/package/components/block/components/component-ref/component-ref.svelte +37 -0
- package/package/components/block/components/component-ref/component-ref.svelte.d.ts +24 -0
- package/package/components/block/components/interactive-element.svelte +29 -0
- package/package/components/block/components/interactive-element.svelte.d.ts +31 -0
- package/package/components/{render-block/render-repeated-block.svelte → block/components/repeated-block.svelte} +4 -3
- package/package/components/block/components/repeated-block.svelte.d.ts +25 -0
- package/package/components/{render-blocks.svelte → blocks/blocks-wrapper.svelte} +3 -20
- package/package/components/blocks/blocks-wrapper.svelte.d.ts +29 -0
- package/package/components/blocks/blocks.svelte +26 -0
- package/package/components/blocks/blocks.svelte.d.ts +28 -0
- package/package/components/{render-content/render-content.svelte → content/components/enable-editor.svelte} +47 -166
- package/package/components/content/components/enable-editor.svelte.d.ts +36 -0
- package/package/components/{render-content/components/render-styles.helpers.d.ts → content/components/styles.helpers.d.ts} +1 -1
- package/package/components/{render-content/components/render-styles.helpers.js → content/components/styles.helpers.js} +3 -4
- package/package/components/{render-content/components/render-styles.svelte → content/components/styles.svelte} +2 -2
- package/package/components/{render-content/components/render-styles.svelte.d.ts → content/components/styles.svelte.d.ts} +5 -5
- package/package/components/content/content.helpers.d.ts +7 -0
- package/package/components/content/content.helpers.js +30 -0
- package/package/components/content/content.svelte +113 -0
- package/package/components/content/content.svelte.d.ts +30 -0
- package/package/components/{render-content/render-content.types.d.ts → content/content.types.d.ts} +4 -4
- package/package/components/content/index.d.ts +1 -0
- package/package/components/content/index.js +1 -0
- package/package/components/{render-content-variants/render-content-variants.svelte → content-variants/content-variants.svelte} +20 -19
- package/package/components/{render-content-variants/render-content-variants.svelte.d.ts → content-variants/content-variants.svelte.d.ts} +6 -6
- package/package/components/{render-content-variants/render-content-variants.types.d.ts → content-variants/content-variants.types.d.ts} +5 -5
- package/package/components/{render-content-variants → content-variants}/helpers.d.ts +7 -7
- package/package/components/{render-content-variants → content-variants}/helpers.js +13 -22
- package/package/constants/builder-registered-components.js +34 -13
- package/package/constants/device-sizes.js +9 -8
- package/package/constants/sdk-version.d.ts +1 -1
- package/package/constants/sdk-version.js +1 -1
- package/package/constants/target.d.ts +1 -1
- package/package/context/builder.context.d.ts +1 -1
- package/package/context/builder.context.js +1 -1
- package/package/context/types.d.ts +1 -1
- package/package/functions/apply-patch-with-mutation.d.ts +10 -0
- package/package/functions/apply-patch-with-mutation.js +54 -0
- package/package/functions/evaluate/acorn.d.ts +0 -0
- package/package/functions/evaluate/acorn.js +2433 -0
- package/package/functions/{evaluate.d.ts → evaluate/evaluate.d.ts} +5 -2
- package/package/functions/{evaluate.js → evaluate/evaluate.js} +34 -13
- package/package/functions/evaluate/index.d.ts +1 -0
- package/package/functions/evaluate/index.js +1 -0
- package/package/functions/evaluate/interpreter.d.ts +2 -0
- package/package/functions/evaluate/interpreter.js +3853 -0
- package/package/functions/evaluate/non-node-runtime.d.ts +2 -0
- package/package/functions/evaluate/non-node-runtime.js +84 -0
- package/package/functions/evaluate/types.d.ts +10 -0
- package/package/functions/extract-text-styles.js +2 -14
- package/package/functions/get-block-actions-handler.js +3 -3
- package/package/functions/get-block-actions.d.ts +1 -0
- package/package/functions/get-block-actions.js +14 -1
- package/package/functions/get-block-component-options.js +1 -1
- package/package/functions/get-block-properties.d.ts +5 -1
- package/package/functions/get-block-properties.js +15 -9
- package/package/functions/get-builder-search-params/index.js +3 -7
- package/package/functions/get-content/generate-content-url.js +7 -5
- package/package/functions/get-content/index.d.ts +2 -6
- package/package/functions/get-content/index.js +26 -6
- package/package/functions/get-processed-block.d.ts +1 -1
- package/package/functions/get-processed-block.js +11 -7
- package/package/functions/get-react-native-block-styles.d.ts +1 -1
- package/package/functions/get-react-native-block-styles.js +2 -2
- package/package/functions/if-target.d.ts +1 -1
- package/package/functions/if-target.js +1 -1
- package/package/functions/is-editing.js +1 -3
- package/package/functions/is-non-node-server.d.ts +4 -0
- package/package/functions/is-non-node-server.js +8 -0
- package/package/functions/on-change.js +1 -1
- package/package/functions/register-component.d.ts +2 -1
- package/package/functions/register-component.js +20 -8
- package/package/functions/register.js +2 -2
- package/package/functions/sanitize-react-native-block-styles.js +13 -5
- package/package/functions/set-editor-settings.js +1 -1
- package/package/functions/set.js +2 -9
- package/package/functions/track/helpers.js +6 -11
- package/package/functions/track/index.js +26 -14
- package/package/functions/track/interaction.js +15 -16
- package/package/helpers/ab-tests.d.ts +2 -2
- package/package/helpers/ab-tests.js +42 -30
- package/package/helpers/canTrack.js +1 -1
- package/package/helpers/cookie.d.ts +2 -2
- package/package/helpers/cookie.js +13 -26
- package/package/helpers/css.d.ts +1 -1
- package/package/helpers/css.js +1 -1
- package/package/helpers/flatten.js +8 -8
- package/package/helpers/localStorage.d.ts +2 -2
- package/package/helpers/localStorage.js +2 -2
- package/package/helpers/logger.js +1 -1
- package/package/helpers/preview-lru-cache/get.d.ts +1 -0
- package/package/helpers/preview-lru-cache/get.js +7 -0
- package/package/helpers/preview-lru-cache/helpers.d.ts +1 -0
- package/package/helpers/preview-lru-cache/helpers.js +9 -0
- package/package/helpers/preview-lru-cache/init.d.ts +6 -0
- package/package/helpers/preview-lru-cache/init.js +15 -0
- package/package/helpers/preview-lru-cache/set.d.ts +7 -0
- package/package/helpers/preview-lru-cache/set.js +9 -0
- package/package/helpers/preview-lru-cache/types.d.ts +12 -0
- package/package/helpers/preview-lru-cache/types.js +6 -0
- package/package/helpers/sessionId.d.ts +2 -2
- package/package/helpers/sessionId.js +11 -4
- package/package/helpers/uuid.js +1 -1
- package/package/helpers/visitorId.d.ts +1 -1
- package/package/helpers/visitorId.js +7 -4
- package/package/index-helpers/blocks-exports.d.ts +2 -2
- package/package/index-helpers/blocks-exports.js +2 -2
- package/package/index.d.ts +2 -2
- package/package/index.js +1 -1
- package/package/scripts/init-editing.js +65 -57
- package/package/types/builder-props.d.ts +10 -0
- package/package/types/components.d.ts +8 -2
- package/package/types/enforced-partials.d.ts +1 -1
- package/package/types/targets.d.ts +1 -3
- package/package/types/typescript.d.ts +3 -0
- package/package.json +2 -2
- package/src/blocks/BaseText.svelte +1 -1
- package/src/blocks/button/button.svelte +21 -34
- package/src/blocks/button/component-info.ts +20 -27
- package/src/blocks/columns/columns.svelte +26 -30
- package/src/blocks/columns/component-info.ts +205 -240
- package/src/blocks/custom-code/component-info.ts +20 -27
- package/src/blocks/embed/component-info.ts +34 -51
- package/src/blocks/embed/helpers.ts +2 -8
- package/src/blocks/form/component-info.ts +204 -253
- package/src/blocks/form/form.svelte +1 -368
- package/src/blocks/fragment/component-info.ts +3 -5
- package/src/blocks/helpers.ts +43 -0
- package/src/blocks/image/component-info.ts +113 -161
- package/src/blocks/image/image.helpers.ts +5 -33
- package/src/blocks/img/component-info.ts +11 -16
- package/src/blocks/img/img.svelte +7 -31
- package/src/blocks/input/component-info.ts +35 -66
- package/src/blocks/input/input.svelte +7 -31
- package/src/blocks/raw-text/component-info.ts +8 -12
- package/src/blocks/raw-text/raw-text.svelte +2 -5
- package/src/blocks/section/component-info.ts +28 -37
- package/src/blocks/section/section.svelte +7 -30
- package/src/blocks/select/component-info.ts +38 -55
- package/src/blocks/select/select.svelte +7 -31
- package/src/blocks/submit-button/component-info.ts +10 -15
- package/src/blocks/submit-button/submit-button.svelte +7 -30
- package/src/blocks/symbol/component-info.ts +31 -39
- package/src/blocks/symbol/symbol.helpers.ts +47 -0
- package/src/blocks/symbol/symbol.svelte +50 -97
- package/src/blocks/text/component-info.ts +14 -18
- package/src/blocks/text/text.svelte +1 -1
- package/src/blocks/textarea/component-info.ts +26 -36
- package/src/blocks/textarea/textarea.svelte +7 -30
- package/src/blocks/video/component-info.ts +77 -103
- package/src/blocks/video/video.svelte +4 -31
- package/src/components/{render-block/render-block.helpers.ts → block/block.helpers.ts} +22 -49
- package/src/components/block/block.svelte +158 -0
- package/src/components/{render-block → block/components}/block-styles.svelte +23 -24
- package/src/components/block/components/block-wrapper.svelte +70 -0
- package/src/components/block/components/component-ref/component-ref.helpers.ts +53 -0
- package/src/components/block/components/component-ref/component-ref.svelte +41 -0
- package/src/components/block/components/interactive-element.svelte +42 -0
- package/src/components/block/components/repeated-block.svelte +30 -0
- package/src/components/{render-block → block}/types.ts +1 -2
- package/src/components/{render-blocks.svelte → blocks/blocks-wrapper.svelte} +14 -32
- package/src/components/blocks/blocks.svelte +39 -0
- package/src/components/{render-content/render-content.svelte → content/components/enable-editor.svelte} +71 -199
- package/src/components/{render-content/components/render-styles.helpers.ts → content/components/styles.helpers.ts} +9 -11
- package/src/components/{render-content/components/render-styles.svelte → content/components/styles.svelte} +3 -3
- package/src/components/content/content.helpers.ts +42 -0
- package/src/components/content/content.svelte +138 -0
- package/src/components/{render-content/render-content.types.ts → content/content.types.ts} +5 -9
- package/src/components/content/index.ts +1 -0
- package/src/components/{render-content → content}/wrap-component-ref.ts +1 -1
- package/src/components/{render-content-variants/render-content-variants.svelte → content-variants/content-variants.svelte} +26 -24
- package/src/components/{render-content-variants/render-content-variants.types.ts → content-variants/content-variants.types.ts} +9 -11
- package/src/components/{render-content-variants → content-variants}/helpers.ts +27 -73
- package/src/constants/builder-registered-components.ts +34 -14
- package/src/constants/device-sizes.ts +16 -22
- package/src/constants/sdk-version.ts +1 -1
- package/src/constants/target.ts +3 -1
- package/src/context/builder.context.ts +1 -1
- package/src/context/types.ts +2 -7
- package/src/functions/apply-patch-with-mutation.ts +61 -0
- package/src/functions/camel-to-kebab-case.ts +1 -2
- package/src/functions/evaluate/acorn.ts +2501 -0
- package/src/functions/evaluate/evaluate.ts +90 -0
- package/src/functions/evaluate/index.ts +1 -0
- package/src/functions/evaluate/interpreter.ts +3887 -0
- package/src/functions/evaluate/non-node-runtime.ts +94 -0
- package/src/functions/evaluate/types.ts +10 -0
- package/src/functions/extract-text-styles.ts +3 -18
- package/src/functions/fast-clone.ts +1 -2
- package/src/functions/get-block-actions-handler.ts +11 -20
- package/src/functions/get-block-actions.ts +22 -14
- package/src/functions/get-block-component-options.ts +2 -3
- package/src/functions/get-block-properties.ts +24 -17
- package/src/functions/get-builder-search-params/index.ts +5 -21
- package/src/functions/get-content/generate-content-url.ts +10 -25
- package/src/functions/get-content/index.ts +34 -37
- package/src/functions/get-content/types.ts +4 -2
- package/src/functions/get-fetch.ts +3 -10
- package/src/functions/get-global-this.ts +1 -2
- package/src/functions/get-processed-block.ts +14 -21
- package/src/functions/get-react-native-block-styles.ts +6 -12
- package/src/functions/if-target.ts +2 -3
- package/src/functions/is-browser.ts +1 -1
- package/src/functions/is-editing.ts +2 -7
- package/src/functions/is-iframe.ts +1 -2
- package/src/functions/is-non-node-server.ts +9 -0
- package/src/functions/is-previewing.ts +1 -4
- package/src/functions/on-change.ts +2 -2
- package/src/functions/register-component.ts +24 -26
- package/src/functions/register.ts +6 -8
- package/src/functions/sanitize-react-native-block-styles.ts +17 -24
- package/src/functions/set-editor-settings.ts +5 -6
- package/src/functions/set.ts +3 -15
- package/src/functions/track/helpers.ts +8 -24
- package/src/functions/track/index.ts +37 -42
- package/src/functions/track/interaction.ts +21 -38
- package/src/functions/transform-block-properties.ts +1 -1
- package/src/functions/transform-block.ts +1 -1
- package/src/helpers/ab-tests.ts +64 -79
- package/src/helpers/canTrack.ts +2 -4
- package/src/helpers/cookie.ts +15 -46
- package/src/helpers/css.ts +4 -13
- package/src/helpers/flatten.ts +11 -16
- package/src/helpers/localStorage.ts +4 -8
- package/src/helpers/logger.ts +2 -2
- package/src/helpers/nullable.ts +1 -3
- package/src/helpers/preview-lru-cache/get.ts +8 -0
- package/src/helpers/preview-lru-cache/helpers.ts +9 -0
- package/src/helpers/preview-lru-cache/init.ts +17 -0
- package/src/helpers/preview-lru-cache/set.ts +18 -0
- package/src/helpers/preview-lru-cache/types.ts +12 -0
- package/src/helpers/sessionId.ts +12 -13
- package/src/helpers/time.ts +1 -3
- package/src/helpers/url.ts +1 -2
- package/src/helpers/uuid.ts +3 -3
- package/src/helpers/visitorId.ts +14 -17
- package/src/index-helpers/blocks-exports.ts +2 -2
- package/src/index-helpers/top-of-file.ts +1 -1
- package/src/index.ts +2 -13
- package/src/scripts/init-editing.ts +85 -98
- package/src/types/api-version.ts +1 -1
- package/src/types/builder-block.ts +1 -3
- package/src/types/builder-content.ts +7 -4
- package/src/types/builder-props.ts +10 -0
- package/src/types/can-track.ts +1 -1
- package/src/types/components.ts +17 -13
- package/src/types/deep-partial.ts +1 -7
- package/src/types/element.ts +1 -3
- package/src/types/enforced-partials.ts +6 -20
- package/src/types/input.ts +6 -9
- package/src/types/targets.ts +1 -6
- package/src/types/typescript.ts +9 -9
- package/package/blocks/util.d.ts +0 -4
- package/package/blocks/util.js +0 -13
- package/package/components/render-block/render-block.helpers.d.ts +0 -12
- package/package/components/render-block/render-block.svelte +0 -152
- package/package/components/render-block/render-block.svelte.d.ts +0 -24
- package/package/components/render-block/render-component.svelte +0 -21
- package/package/components/render-block/render-component.svelte.d.ts +0 -34
- package/package/components/render-block/render-repeated-block.svelte.d.ts +0 -23
- package/package/components/render-blocks.svelte.d.ts +0 -26
- package/package/components/render-content/builder-editing.svelte +0 -4
- package/package/components/render-content/builder-editing.svelte.d.ts +0 -14
- package/package/components/render-content/index.d.ts +0 -1
- package/package/components/render-content/index.js +0 -1
- package/package/components/render-content/render-content.helpers.d.ts +0 -7
- package/package/components/render-content/render-content.helpers.js +0 -30
- package/package/components/render-content/render-content.svelte.d.ts +0 -30
- package/package/functions/evaluate.test.js +0 -17
- package/package/functions/get-builder-search-params/fn.test.js +0 -13
- package/package/functions/get-content/generate-content-url.test.d.ts +0 -1
- package/package/functions/get-content/generate-content-url.test.js +0 -97
- package/package/functions/get-processed-block.test.d.ts +0 -1
- package/package/functions/get-processed-block.test.js +0 -33
- package/package/functions/on-change.test.d.ts +0 -1
- package/package/functions/on-change.test.js +0 -20
- package/package/functions/set.test.d.ts +0 -1
- package/package/functions/set.test.js +0 -16
- package/package/helpers/url.test.d.ts +0 -1
- package/package/helpers/url.test.js +0 -21
- package/src/blocks/util.ts +0 -18
- package/src/components/render-block/render-block.svelte +0 -173
- package/src/components/render-block/render-component.svelte +0 -40
- package/src/components/render-block/render-repeated-block.svelte +0 -25
- package/src/components/render-content/builder-editing.svelte +0 -4
- package/src/components/render-content/index.ts +0 -1
- package/src/components/render-content/render-content.helpers.ts +0 -48
- package/src/functions/evaluate.test.ts +0 -21
- package/src/functions/evaluate.ts +0 -99
- package/src/functions/get-builder-search-params/fn.test.ts +0 -19
- package/src/functions/get-content/generate-content-url.test.ts +0 -112
- package/src/functions/get-processed-block.test.ts +0 -35
- package/src/functions/on-change.test.ts +0 -23
- package/src/functions/set.test.ts +0 -19
- package/src/helpers/url.test.ts +0 -23
- /package/package/components/{render-block → block}/types.d.ts +0 -0
- /package/package/components/{render-block → block}/types.js +0 -0
- /package/package/components/{render-content/render-content.types.js → content/content.types.js} +0 -0
- /package/package/components/{render-content → content}/wrap-component-ref.d.ts +0 -0
- /package/package/components/{render-content → content}/wrap-component-ref.js +0 -0
- /package/package/components/{render-content-variants/render-content-variants.types.js → content-variants/content-variants.types.js} +0 -0
- /package/package/functions/{evaluate.test.d.ts → evaluate/types.js} +0 -0
- /package/package/{functions/get-builder-search-params/fn.test.d.ts → types/builder-props.js} +0 -0
|
@@ -1,69 +1,33 @@
|
|
|
1
|
+
<script context="module"></script>
|
|
2
|
+
|
|
1
3
|
<script>import { onDestroy, onMount, setContext } from "svelte";
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import
|
|
9
|
-
import {
|
|
10
|
-
import {
|
|
11
|
-
import {
|
|
12
|
-
import
|
|
13
|
-
import
|
|
14
|
-
import
|
|
15
|
-
import
|
|
16
|
-
import { checkIsDefined } from "../../helpers/nullable.js";
|
|
17
|
-
import { getInteractionPropertiesForEvent } from "../../functions/track/interaction.js";
|
|
18
|
-
import { getContentInitialValue, getContextStateInitialValue, } from "./render-content.helpers.js";
|
|
19
|
-
import { TARGET } from "../../constants/target.js";
|
|
20
|
-
import { logger } from "../../helpers/logger.js";
|
|
21
|
-
import { getRenderContentScriptString } from "../render-content-variants/helpers.js";
|
|
22
|
-
import { wrapComponentRef } from "./wrap-component-ref.js";
|
|
23
|
-
import InlinedScript from "../inlined-script.svelte";
|
|
24
|
-
const isEvent = (attr) => attr.startsWith("on:");
|
|
25
|
-
const isNonEvent = (attr) => !attr.startsWith("on:");
|
|
26
|
-
const filterAttrs = (attrs = {}, filter) => {
|
|
27
|
-
const validAttr = {};
|
|
28
|
-
Object.keys(attrs).forEach((attr) => {
|
|
29
|
-
if (filter(attr)) {
|
|
30
|
-
validAttr[attr] = attrs[attr];
|
|
31
|
-
}
|
|
32
|
-
});
|
|
33
|
-
return validAttr;
|
|
34
|
-
};
|
|
35
|
-
const setAttrs = (node, attrs = {}) => {
|
|
36
|
-
const attrKeys = Object.keys(attrs);
|
|
37
|
-
const setup = (attr) => node.addEventListener(attr.substr(3), attrs[attr]);
|
|
38
|
-
const teardown = (attr) => node.removeEventListener(attr.substr(3), attrs[attr]);
|
|
39
|
-
attrKeys.map(setup);
|
|
40
|
-
return {
|
|
41
|
-
update(attrs = {}) {
|
|
42
|
-
const attrKeys = Object.keys(attrs);
|
|
43
|
-
attrKeys.map(teardown);
|
|
44
|
-
attrKeys.map(setup);
|
|
45
|
-
},
|
|
46
|
-
destroy() {
|
|
47
|
-
attrKeys.map(teardown);
|
|
48
|
-
},
|
|
49
|
-
};
|
|
50
|
-
};
|
|
4
|
+
import { evaluate } from "../../../functions/evaluate";
|
|
5
|
+
import { fetch } from "../../../functions/get-fetch.js";
|
|
6
|
+
import { isBrowser } from "../../../functions/is-browser.js";
|
|
7
|
+
import { isEditing } from "../../../functions/is-editing.js";
|
|
8
|
+
import { createRegisterComponentMessage } from "../../../functions/register-component.js";
|
|
9
|
+
import { _track } from "../../../functions/track/index.js";
|
|
10
|
+
import builderContext from "../../../context/builder.context";
|
|
11
|
+
import { registerInsertMenu, setupBrowserForEditing, } from "../../../scripts/init-editing.js";
|
|
12
|
+
import { checkIsDefined } from "../../../helpers/nullable.js";
|
|
13
|
+
import { getInteractionPropertiesForEvent } from "../../../functions/track/interaction.js";
|
|
14
|
+
import { logger } from "../../../helpers/logger.js";
|
|
15
|
+
import { getContent } from "../../../functions/get-content/index.js";
|
|
16
|
+
import { isPreviewing } from "../../../functions/is-previewing.js";
|
|
17
|
+
import "../../../helpers/preview-lru-cache/set.js";
|
|
51
18
|
export let canTrack;
|
|
19
|
+
export let builderContextSignal;
|
|
52
20
|
export let model;
|
|
53
21
|
export let context;
|
|
54
22
|
export let apiKey;
|
|
55
|
-
export let content;
|
|
56
|
-
export let data;
|
|
57
|
-
export let locale;
|
|
58
|
-
export let apiVersion;
|
|
59
|
-
export let customComponents;
|
|
60
23
|
export let showContent;
|
|
61
24
|
export let classNameProp;
|
|
62
|
-
export let
|
|
25
|
+
export let content;
|
|
26
|
+
export let locale;
|
|
63
27
|
export let includeRefs;
|
|
64
28
|
export let enrich;
|
|
65
29
|
function mergeNewContent(newContent) {
|
|
66
|
-
|
|
30
|
+
const newContentValue = {
|
|
67
31
|
...$builderContextSignal.content,
|
|
68
32
|
...newContent,
|
|
69
33
|
data: {
|
|
@@ -77,18 +41,7 @@ function mergeNewContent(newContent) {
|
|
|
77
41
|
$builderContextSignal.content?.meta?.breakpoints,
|
|
78
42
|
},
|
|
79
43
|
};
|
|
80
|
-
|
|
81
|
-
function setBreakpoints(breakpoints) {
|
|
82
|
-
$builderContextSignal.content = {
|
|
83
|
-
...$builderContextSignal.content,
|
|
84
|
-
meta: {
|
|
85
|
-
...$builderContextSignal.content?.meta,
|
|
86
|
-
breakpoints,
|
|
87
|
-
},
|
|
88
|
-
};
|
|
89
|
-
}
|
|
90
|
-
function contentSetState(newRootState) {
|
|
91
|
-
$builderContextSignal.rootState = newRootState;
|
|
44
|
+
$builderContextSignal.content = newContentValue;
|
|
92
45
|
}
|
|
93
46
|
function processMessage(event) {
|
|
94
47
|
const { data } = event;
|
|
@@ -101,7 +54,11 @@ function processMessage(event) {
|
|
|
101
54
|
return;
|
|
102
55
|
}
|
|
103
56
|
if (breakpoints) {
|
|
104
|
-
|
|
57
|
+
mergeNewContent({
|
|
58
|
+
meta: {
|
|
59
|
+
breakpoints,
|
|
60
|
+
},
|
|
61
|
+
});
|
|
105
62
|
}
|
|
106
63
|
forceReRenderCount = forceReRenderCount + 1; // This is a hack to force Qwik to re-render.
|
|
107
64
|
break;
|
|
@@ -119,10 +76,6 @@ function processMessage(event) {
|
|
|
119
76
|
}
|
|
120
77
|
break;
|
|
121
78
|
}
|
|
122
|
-
case "builder.patchUpdates": {
|
|
123
|
-
// TODO
|
|
124
|
-
break;
|
|
125
|
-
}
|
|
126
79
|
}
|
|
127
80
|
}
|
|
128
81
|
}
|
|
@@ -135,7 +88,7 @@ function evaluateJsCode() {
|
|
|
135
88
|
context: context || {},
|
|
136
89
|
localState: undefined,
|
|
137
90
|
rootState: $builderContextSignal.rootState,
|
|
138
|
-
rootSetState:
|
|
91
|
+
rootSetState: $builderContextSignal.rootSetState,
|
|
139
92
|
});
|
|
140
93
|
}
|
|
141
94
|
}
|
|
@@ -163,7 +116,7 @@ function evalExpression(expression) {
|
|
|
163
116
|
context: context || {},
|
|
164
117
|
localState: undefined,
|
|
165
118
|
rootState: $builderContextSignal.rootState,
|
|
166
|
-
rootSetState:
|
|
119
|
+
rootSetState: $builderContextSignal.rootSetState,
|
|
167
120
|
}));
|
|
168
121
|
}
|
|
169
122
|
function handleRequest({ url, key }) {
|
|
@@ -174,7 +127,8 @@ function handleRequest({ url, key }) {
|
|
|
174
127
|
...$builderContextSignal.rootState,
|
|
175
128
|
[key]: json,
|
|
176
129
|
};
|
|
177
|
-
|
|
130
|
+
$builderContextSignal.rootSetState?.(newState);
|
|
131
|
+
httpReqsData[key] = true;
|
|
178
132
|
})
|
|
179
133
|
.catch((err) => {
|
|
180
134
|
console.error("error fetching dynamic data", url, err);
|
|
@@ -205,51 +159,12 @@ function emitStateUpdate() {
|
|
|
205
159
|
}
|
|
206
160
|
}
|
|
207
161
|
let elementRef;
|
|
208
|
-
let forceReRenderCount = 0;
|
|
209
|
-
let overrideContent = null;
|
|
210
|
-
let update = 0;
|
|
211
162
|
let canTrackToUse = checkIsDefined(canTrack) ? canTrack : true;
|
|
163
|
+
let forceReRenderCount = 0;
|
|
164
|
+
let lastUpdated = 0;
|
|
165
|
+
let shouldSendResetCookie = false;
|
|
212
166
|
let httpReqsData = {};
|
|
213
167
|
let clicked = false;
|
|
214
|
-
let scriptStr = getRenderContentScriptString({
|
|
215
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
|
|
216
|
-
variationId: content?.testVariationId,
|
|
217
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
|
|
218
|
-
contentId: content?.id,
|
|
219
|
-
});
|
|
220
|
-
let builderContextSignal = writable({
|
|
221
|
-
content: getContentInitialValue({
|
|
222
|
-
content: content,
|
|
223
|
-
data: data,
|
|
224
|
-
}),
|
|
225
|
-
localState: undefined,
|
|
226
|
-
rootState: getContextStateInitialValue({
|
|
227
|
-
content: content,
|
|
228
|
-
data: data,
|
|
229
|
-
locale: locale,
|
|
230
|
-
}),
|
|
231
|
-
rootSetState: contentSetState,
|
|
232
|
-
context: context || {},
|
|
233
|
-
apiKey: apiKey,
|
|
234
|
-
apiVersion: apiVersion,
|
|
235
|
-
registeredComponents: [
|
|
236
|
-
...getDefaultRegisteredComponents(),
|
|
237
|
-
// While this `components` object is deprecated, we must maintain support for it.
|
|
238
|
-
// Since users are able to override our default components, we need to make sure that we do not break such
|
|
239
|
-
// existing usage.
|
|
240
|
-
// This is why we spread `components` after the default Builder.io components, but before the `props.customComponents`,
|
|
241
|
-
// which is the new standard way of providing custom components, and must therefore take precedence.
|
|
242
|
-
...components,
|
|
243
|
-
...(customComponents || []),
|
|
244
|
-
].reduce((acc, { component, ...curr }) => ({
|
|
245
|
-
...acc,
|
|
246
|
-
[curr.name]: {
|
|
247
|
-
component: TARGET === "vue3" ? wrapComponentRef(component) : component,
|
|
248
|
-
...curr,
|
|
249
|
-
},
|
|
250
|
-
}), {}),
|
|
251
|
-
inheritedStyles: {},
|
|
252
|
-
});
|
|
253
168
|
onMount(() => {
|
|
254
169
|
if (!apiKey) {
|
|
255
170
|
logger.error("No API key provided to `RenderContent` component. This can cause issues. Please provide an API key using the `apiKey` prop.");
|
|
@@ -257,6 +172,7 @@ onMount(() => {
|
|
|
257
172
|
if (isBrowser()) {
|
|
258
173
|
if (isEditing()) {
|
|
259
174
|
forceReRenderCount = forceReRenderCount + 1;
|
|
175
|
+
window.addEventListener("message", processMessage);
|
|
260
176
|
registerInsertMenu();
|
|
261
177
|
setupBrowserForEditing({
|
|
262
178
|
...(locale
|
|
@@ -275,11 +191,10 @@ onMount(() => {
|
|
|
275
191
|
}
|
|
276
192
|
: {}),
|
|
277
193
|
});
|
|
278
|
-
Object.values($builderContextSignal.
|
|
194
|
+
Object.values($builderContextSignal.componentInfos).forEach((registeredComponent) => {
|
|
279
195
|
const message = createRegisterComponentMessage(registeredComponent);
|
|
280
196
|
window.parent?.postMessage(message, "*");
|
|
281
197
|
});
|
|
282
|
-
window.addEventListener("message", processMessage);
|
|
283
198
|
window.addEventListener("builder:component:stateChangeListenerActivated", emitStateUpdate);
|
|
284
199
|
}
|
|
285
200
|
if ($builderContextSignal.content) {
|
|
@@ -314,7 +229,7 @@ onMount(() => {
|
|
|
314
229
|
getContent({
|
|
315
230
|
model: model,
|
|
316
231
|
apiKey: apiKey,
|
|
317
|
-
apiVersion: apiVersion,
|
|
232
|
+
apiVersion: $builderContextSignal.apiVersion,
|
|
318
233
|
}).then((content) => {
|
|
319
234
|
if (content) {
|
|
320
235
|
mergeNewContent(content);
|
|
@@ -333,21 +248,23 @@ function onUpdateFn_0(..._args) {
|
|
|
333
248
|
}
|
|
334
249
|
}
|
|
335
250
|
$: onUpdateFn_0(...[content]);
|
|
336
|
-
function onUpdateFn_1(..._args) {
|
|
251
|
+
function onUpdateFn_1(..._args) { }
|
|
252
|
+
$: onUpdateFn_1(...[shouldSendResetCookie]);
|
|
253
|
+
function onUpdateFn_2(..._args) {
|
|
337
254
|
evaluateJsCode();
|
|
338
255
|
}
|
|
339
|
-
$:
|
|
256
|
+
$: onUpdateFn_2(...[
|
|
340
257
|
$builderContextSignal.content?.data?.jsCode,
|
|
341
258
|
$builderContextSignal.rootState,
|
|
342
259
|
]);
|
|
343
|
-
function
|
|
260
|
+
function onUpdateFn_3(..._args) {
|
|
344
261
|
runHttpRequests();
|
|
345
262
|
}
|
|
346
|
-
$:
|
|
347
|
-
function
|
|
263
|
+
$: onUpdateFn_3(...[$builderContextSignal.content?.data?.httpRequests]);
|
|
264
|
+
function onUpdateFn_4(..._args) {
|
|
348
265
|
emitStateUpdate();
|
|
349
266
|
}
|
|
350
|
-
$:
|
|
267
|
+
$: onUpdateFn_4(...[$builderContextSignal.rootState]);
|
|
351
268
|
setContext(builderContext.key, builderContextSignal);
|
|
352
269
|
onDestroy(() => {
|
|
353
270
|
if (isBrowser()) {
|
|
@@ -359,24 +276,14 @@ onDestroy(() => {
|
|
|
359
276
|
|
|
360
277
|
{#if $builderContextSignal.content}
|
|
361
278
|
<div
|
|
279
|
+
key={forceReRenderCount}
|
|
362
280
|
bind:this={elementRef}
|
|
363
281
|
on:click={(event) => {
|
|
364
282
|
onClick(event);
|
|
365
283
|
}}
|
|
366
284
|
builder-content-id={$builderContextSignal.content?.id}
|
|
367
285
|
builder-model={model}
|
|
368
|
-
{...
|
|
369
|
-
TARGET === "reactNative"
|
|
370
|
-
? {
|
|
371
|
-
dataSet: {
|
|
372
|
-
// currently, we can't set the actual ID here.
|
|
373
|
-
// we don't need it right now, we just need to identify content divs for testing.
|
|
374
|
-
"builder-content-id": "",
|
|
375
|
-
},
|
|
376
|
-
}
|
|
377
|
-
: {},
|
|
378
|
-
isNonEvent
|
|
379
|
-
)}
|
|
286
|
+
{...{}}
|
|
380
287
|
{...showContent
|
|
381
288
|
? {}
|
|
382
289
|
: {
|
|
@@ -384,33 +291,7 @@ onDestroy(() => {
|
|
|
384
291
|
"aria-hidden": true,
|
|
385
292
|
}}
|
|
386
293
|
class={classNameProp}
|
|
387
|
-
use:setAttrs={filterAttrs(
|
|
388
|
-
TARGET === "reactNative"
|
|
389
|
-
? {
|
|
390
|
-
dataSet: {
|
|
391
|
-
// currently, we can't set the actual ID here.
|
|
392
|
-
// we don't need it right now, we just need to identify content divs for testing.
|
|
393
|
-
"builder-content-id": "",
|
|
394
|
-
},
|
|
395
|
-
}
|
|
396
|
-
: {},
|
|
397
|
-
isEvent
|
|
398
|
-
)}
|
|
399
294
|
>
|
|
400
|
-
|
|
401
|
-
<InlinedScript {scriptStr} />
|
|
402
|
-
{/if}
|
|
403
|
-
|
|
404
|
-
{#if TARGET !== "reactNative"}
|
|
405
|
-
<RenderContentStyles
|
|
406
|
-
contentId={$builderContextSignal.content?.id}
|
|
407
|
-
cssCode={$builderContextSignal.content?.data?.cssCode}
|
|
408
|
-
customFonts={$builderContextSignal.content?.data?.customFonts}
|
|
409
|
-
/>
|
|
410
|
-
{/if}
|
|
411
|
-
<RenderBlocks
|
|
412
|
-
blocks={$builderContextSignal.content?.data?.blocks}
|
|
413
|
-
key={forceReRenderCount}
|
|
414
|
-
/>
|
|
295
|
+
<slot />
|
|
415
296
|
</div>
|
|
416
297
|
{/if}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import { SvelteComponentTyped } from "svelte";
|
|
2
|
+
type BuilderEditorProps = Omit<ContentProps, "customComponents" | "data" | "apiVersion" | "isSsrAbTest"> & {
|
|
3
|
+
builderContextSignal: Writable<BuilderContextInterface>;
|
|
4
|
+
setBuilderContextSignal?: (signal: any) => any;
|
|
5
|
+
children?: any;
|
|
6
|
+
};
|
|
7
|
+
import type { BuilderContextInterface } from "../../../context/types.js";
|
|
8
|
+
import type { ContentProps } from "../content.types.js";
|
|
9
|
+
import type { Writable } from "svelte/store";
|
|
10
|
+
declare const __propDef: {
|
|
11
|
+
props: {
|
|
12
|
+
canTrack: BuilderEditorProps["canTrack"];
|
|
13
|
+
builderContextSignal: BuilderEditorProps["builderContextSignal"];
|
|
14
|
+
model: BuilderEditorProps["model"];
|
|
15
|
+
context: BuilderEditorProps["context"];
|
|
16
|
+
apiKey: BuilderEditorProps["apiKey"];
|
|
17
|
+
showContent: BuilderEditorProps["showContent"];
|
|
18
|
+
classNameProp: BuilderEditorProps["classNameProp"];
|
|
19
|
+
content: BuilderEditorProps["content"];
|
|
20
|
+
locale: BuilderEditorProps["locale"];
|
|
21
|
+
includeRefs: BuilderEditorProps["includeRefs"];
|
|
22
|
+
enrich: BuilderEditorProps["enrich"];
|
|
23
|
+
};
|
|
24
|
+
events: {
|
|
25
|
+
[evt: string]: CustomEvent<any>;
|
|
26
|
+
};
|
|
27
|
+
slots: {
|
|
28
|
+
default: {};
|
|
29
|
+
};
|
|
30
|
+
};
|
|
31
|
+
export type EnableEditorProps = typeof __propDef.props;
|
|
32
|
+
export type EnableEditorEvents = typeof __propDef.events;
|
|
33
|
+
export type EnableEditorSlots = typeof __propDef.slots;
|
|
34
|
+
export default class EnableEditor extends SvelteComponentTyped<EnableEditorProps, EnableEditorEvents, EnableEditorSlots> {
|
|
35
|
+
}
|
|
36
|
+
export {};
|
|
@@ -9,7 +9,7 @@ export interface CustomFont {
|
|
|
9
9
|
export declare const getFontCss: ({ customFonts }: {
|
|
10
10
|
customFonts?: CustomFont[] | undefined;
|
|
11
11
|
}) => string;
|
|
12
|
-
export declare const getCss: ({ cssCode, contentId
|
|
12
|
+
export declare const getCss: ({ cssCode, contentId }: {
|
|
13
13
|
cssCode?: string | undefined;
|
|
14
14
|
contentId?: string | undefined;
|
|
15
15
|
}) => string;
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
const getCssFromFont = (font) => {
|
|
2
2
|
// TODO: compute what font sizes are used and only load those.......
|
|
3
|
-
const family = font.family +
|
|
4
|
-
(font.kind && !font.kind.includes('#') ? ', ' + font.kind : '');
|
|
3
|
+
const family = font.family + (font.kind && !font.kind.includes('#') ? ', ' + font.kind : '');
|
|
5
4
|
const name = family.split(',')[0];
|
|
6
5
|
const url = font.fileUrl ?? font?.files?.regular;
|
|
7
6
|
let str = '';
|
|
@@ -43,9 +42,9 @@ export const getFontCss = ({ customFonts }) => {
|
|
|
43
42
|
// return '';
|
|
44
43
|
// }
|
|
45
44
|
// TODO: separate internal data from external
|
|
46
|
-
return customFonts?.map(
|
|
45
|
+
return customFonts?.map(font => getCssFromFont(font))?.join(' ') || '';
|
|
47
46
|
};
|
|
48
|
-
export const getCss = ({ cssCode, contentId
|
|
47
|
+
export const getCss = ({ cssCode, contentId }) => {
|
|
49
48
|
if (!cssCode) {
|
|
50
49
|
return '';
|
|
51
50
|
}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
<script context="module"></script>
|
|
2
2
|
|
|
3
3
|
<script>import InlinedStyles from "../../inlined-styles.svelte";
|
|
4
|
-
import { getCss } from "./
|
|
5
|
-
import { getFontCss } from "./
|
|
4
|
+
import { getCss } from "./styles.helpers.js";
|
|
5
|
+
import { getFontCss } from "./styles.helpers.js";
|
|
6
6
|
export let cssCode;
|
|
7
7
|
export let contentId;
|
|
8
8
|
export let customFonts;
|
|
@@ -4,7 +4,7 @@ interface Props {
|
|
|
4
4
|
customFonts?: CustomFont[];
|
|
5
5
|
contentId?: string;
|
|
6
6
|
}
|
|
7
|
-
import type { CustomFont } from "./
|
|
7
|
+
import type { CustomFont } from "./styles.helpers.js";
|
|
8
8
|
declare const __propDef: {
|
|
9
9
|
props: {
|
|
10
10
|
cssCode: Props["cssCode"];
|
|
@@ -16,9 +16,9 @@ declare const __propDef: {
|
|
|
16
16
|
};
|
|
17
17
|
slots: {};
|
|
18
18
|
};
|
|
19
|
-
export type
|
|
20
|
-
export type
|
|
21
|
-
export type
|
|
22
|
-
export default class
|
|
19
|
+
export type StylesProps = typeof __propDef.props;
|
|
20
|
+
export type StylesEvents = typeof __propDef.events;
|
|
21
|
+
export type StylesSlots = typeof __propDef.slots;
|
|
22
|
+
export default class Styles extends SvelteComponentTyped<StylesProps, StylesEvents, StylesSlots> {
|
|
23
23
|
}
|
|
24
24
|
export {};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { BuilderContent } from '../../types/builder-content.js';
|
|
2
|
+
import type { Nullable } from '../../types/typescript.js';
|
|
3
|
+
import type { ContentProps } from './content.types.js';
|
|
4
|
+
export declare const getContextStateInitialValue: ({ content, data, locale }: Pick<ContentProps, 'content' | 'data' | 'locale'>) => {
|
|
5
|
+
[x: string]: unknown;
|
|
6
|
+
};
|
|
7
|
+
export declare const getContentInitialValue: ({ content, data }: Pick<ContentProps, 'content' | 'data'>) => Nullable<BuilderContent>;
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
export const getContextStateInitialValue = ({ content, data, locale }) => {
|
|
2
|
+
const defaultValues = {};
|
|
3
|
+
// set default values for content state inputs
|
|
4
|
+
content?.data?.inputs?.forEach(input => {
|
|
5
|
+
if (input.name && input.defaultValue !== undefined && content?.data?.state && content.data.state[input.name] === undefined) {
|
|
6
|
+
defaultValues[input.name] = input.defaultValue;
|
|
7
|
+
}
|
|
8
|
+
});
|
|
9
|
+
const stateToUse = {
|
|
10
|
+
...content?.data?.state,
|
|
11
|
+
...data,
|
|
12
|
+
...(locale ? {
|
|
13
|
+
locale
|
|
14
|
+
} : {})
|
|
15
|
+
};
|
|
16
|
+
return {
|
|
17
|
+
...defaultValues,
|
|
18
|
+
...stateToUse
|
|
19
|
+
};
|
|
20
|
+
};
|
|
21
|
+
export const getContentInitialValue = ({ content, data }) => {
|
|
22
|
+
return !content ? undefined : {
|
|
23
|
+
...content,
|
|
24
|
+
data: {
|
|
25
|
+
...content?.data,
|
|
26
|
+
...data
|
|
27
|
+
},
|
|
28
|
+
meta: content?.meta
|
|
29
|
+
};
|
|
30
|
+
};
|
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
<script>import { writable } from "svelte/store";
|
|
2
|
+
import { getDefaultRegisteredComponents } from "../../constants/builder-registered-components.js";
|
|
3
|
+
import { components, serializeComponentInfo, } from "../../functions/register-component.js";
|
|
4
|
+
import Blocks from "../blocks/blocks.svelte";
|
|
5
|
+
import ContentStyles from "./components/styles.svelte";
|
|
6
|
+
import { getContentInitialValue, getContextStateInitialValue, } from "./content.helpers.js";
|
|
7
|
+
import { TARGET } from "../../constants/target.js";
|
|
8
|
+
import { getRenderContentScriptString } from "../content-variants/helpers.js";
|
|
9
|
+
import EnableEditor from "./components/enable-editor.svelte";
|
|
10
|
+
import InlinedScript from "../inlined-script.svelte";
|
|
11
|
+
import "./wrap-component-ref.js";
|
|
12
|
+
export let content;
|
|
13
|
+
export let customComponents;
|
|
14
|
+
export let data;
|
|
15
|
+
export let locale;
|
|
16
|
+
export let context;
|
|
17
|
+
export let apiKey;
|
|
18
|
+
export let apiVersion;
|
|
19
|
+
export let model;
|
|
20
|
+
export let canTrack;
|
|
21
|
+
export let includeRefs;
|
|
22
|
+
export let enrich;
|
|
23
|
+
export let classNameProp;
|
|
24
|
+
export let showContent;
|
|
25
|
+
export let isSsrAbTest;
|
|
26
|
+
function contentSetState(newRootState) {
|
|
27
|
+
$builderContextSignal.rootState = newRootState;
|
|
28
|
+
}
|
|
29
|
+
let scriptStr = getRenderContentScriptString({
|
|
30
|
+
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
|
|
31
|
+
variationId: content?.testVariationId,
|
|
32
|
+
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
|
|
33
|
+
contentId: content?.id,
|
|
34
|
+
});
|
|
35
|
+
let registeredComponents = [
|
|
36
|
+
...getDefaultRegisteredComponents(),
|
|
37
|
+
// While this `components` object is deprecated, we must maintain support for it.
|
|
38
|
+
// Since users are able to override our default components, we need to make sure that we do not break such
|
|
39
|
+
// existing usage.
|
|
40
|
+
// This is why we spread `components` after the default Builder.io components, but before the `props.customComponents`,
|
|
41
|
+
// which is the new standard way of providing custom components, and must therefore take precedence.
|
|
42
|
+
...components,
|
|
43
|
+
...(customComponents || []),
|
|
44
|
+
].reduce((acc, { component, ...info }) => ({
|
|
45
|
+
...acc,
|
|
46
|
+
[info.name]: {
|
|
47
|
+
component: component,
|
|
48
|
+
...serializeComponentInfo(info),
|
|
49
|
+
},
|
|
50
|
+
}), {});
|
|
51
|
+
let builderContextSignal = writable({
|
|
52
|
+
content: getContentInitialValue({
|
|
53
|
+
content: content,
|
|
54
|
+
data: data,
|
|
55
|
+
}),
|
|
56
|
+
localState: undefined,
|
|
57
|
+
rootState: getContextStateInitialValue({
|
|
58
|
+
content: content,
|
|
59
|
+
data: data,
|
|
60
|
+
locale: locale,
|
|
61
|
+
}),
|
|
62
|
+
rootSetState: contentSetState,
|
|
63
|
+
context: context || {},
|
|
64
|
+
apiKey: apiKey,
|
|
65
|
+
apiVersion: apiVersion,
|
|
66
|
+
componentInfos: [
|
|
67
|
+
...getDefaultRegisteredComponents(),
|
|
68
|
+
// While this `components` object is deprecated, we must maintain support for it.
|
|
69
|
+
// Since users are able to override our default components, we need to make sure that we do not break such
|
|
70
|
+
// existing usage.
|
|
71
|
+
// This is why we spread `components` after the default Builder.io components, but before the `props.customComponents`,
|
|
72
|
+
// which is the new standard way of providing custom components, and must therefore take precedence.
|
|
73
|
+
...components,
|
|
74
|
+
...(customComponents || []),
|
|
75
|
+
].reduce((acc, { component: _, ...info }) => ({
|
|
76
|
+
...acc,
|
|
77
|
+
[info.name]: serializeComponentInfo(info),
|
|
78
|
+
}), {}),
|
|
79
|
+
inheritedStyles: {},
|
|
80
|
+
});
|
|
81
|
+
</script>
|
|
82
|
+
|
|
83
|
+
<EnableEditor
|
|
84
|
+
{content}
|
|
85
|
+
{model}
|
|
86
|
+
{context}
|
|
87
|
+
{apiKey}
|
|
88
|
+
{canTrack}
|
|
89
|
+
{locale}
|
|
90
|
+
{includeRefs}
|
|
91
|
+
{enrich}
|
|
92
|
+
{classNameProp}
|
|
93
|
+
{showContent}
|
|
94
|
+
{builderContextSignal}
|
|
95
|
+
{...{}}
|
|
96
|
+
>
|
|
97
|
+
{#if isSsrAbTest}
|
|
98
|
+
<InlinedScript {scriptStr} />
|
|
99
|
+
{/if}
|
|
100
|
+
|
|
101
|
+
{#if TARGET !== "reactNative"}
|
|
102
|
+
<ContentStyles
|
|
103
|
+
contentId={$builderContextSignal.content?.id}
|
|
104
|
+
cssCode={$builderContextSignal.content?.data?.cssCode}
|
|
105
|
+
customFonts={$builderContextSignal.content?.data?.customFonts}
|
|
106
|
+
/>
|
|
107
|
+
{/if}
|
|
108
|
+
<Blocks
|
|
109
|
+
blocks={$builderContextSignal.content?.data?.blocks}
|
|
110
|
+
context={builderContextSignal}
|
|
111
|
+
{registeredComponents}
|
|
112
|
+
/>
|
|
113
|
+
</EnableEditor>
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { SvelteComponentTyped } from "svelte";
|
|
2
|
+
import type { ContentProps } from "./content.types.js";
|
|
3
|
+
declare const __propDef: {
|
|
4
|
+
props: {
|
|
5
|
+
content: ContentProps["content"];
|
|
6
|
+
customComponents: ContentProps["customComponents"];
|
|
7
|
+
data: ContentProps["data"];
|
|
8
|
+
locale: ContentProps["locale"];
|
|
9
|
+
context: ContentProps["context"];
|
|
10
|
+
apiKey: ContentProps["apiKey"];
|
|
11
|
+
apiVersion: ContentProps["apiVersion"];
|
|
12
|
+
model: ContentProps["model"];
|
|
13
|
+
canTrack: ContentProps["canTrack"];
|
|
14
|
+
includeRefs: ContentProps["includeRefs"];
|
|
15
|
+
enrich: ContentProps["enrich"];
|
|
16
|
+
classNameProp: ContentProps["classNameProp"];
|
|
17
|
+
showContent: ContentProps["showContent"];
|
|
18
|
+
isSsrAbTest: ContentProps["isSsrAbTest"];
|
|
19
|
+
};
|
|
20
|
+
events: {
|
|
21
|
+
[evt: string]: CustomEvent<any>;
|
|
22
|
+
};
|
|
23
|
+
slots: {};
|
|
24
|
+
};
|
|
25
|
+
export type ContentProps = typeof __propDef.props;
|
|
26
|
+
export type ContentEvents = typeof __propDef.events;
|
|
27
|
+
export type ContentSlots = typeof __propDef.slots;
|
|
28
|
+
export default class Content extends SvelteComponentTyped<ContentProps, ContentEvents, ContentSlots> {
|
|
29
|
+
}
|
|
30
|
+
export {};
|
package/package/components/{render-content/render-content.types.d.ts → content/content.types.d.ts}
RENAMED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import type { BuilderRenderState } from '../../context/types';
|
|
2
|
-
import type { EnforcePartials } from '../../types/enforced-partials';
|
|
3
|
-
import type {
|
|
1
|
+
import type { BuilderRenderState } from '../../context/types.js';
|
|
2
|
+
import type { EnforcePartials } from '../../types/enforced-partials.js';
|
|
3
|
+
import type { ContentVariantsProps } from '../content-variants/content-variants.types.js';
|
|
4
4
|
interface InternalRenderProps {
|
|
5
5
|
/**
|
|
6
6
|
* TO-DO: improve qwik generator to not remap this name for non-HTML tags, then name it `className`
|
|
@@ -9,7 +9,7 @@ interface InternalRenderProps {
|
|
|
9
9
|
showContent: boolean;
|
|
10
10
|
isSsrAbTest: boolean;
|
|
11
11
|
}
|
|
12
|
-
export type
|
|
12
|
+
export type ContentProps = InternalRenderProps & EnforcePartials<ContentVariantsProps>;
|
|
13
13
|
export interface BuilderComponentStateChange {
|
|
14
14
|
state: BuilderRenderState;
|
|
15
15
|
ref: {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './content.svelte';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './content.svelte';
|