@builder.io/sdk-solid 0.12.7 → 0.12.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/dist/index.d.ts CHANGED
@@ -718,6 +718,86 @@ type Settings = {
718
718
  };
719
719
  declare function setEditorSettings(newSettings: Settings): void;
720
720
 
721
+ type QueryObject = Record<string, string | string[]>;
722
+ /**
723
+ * Receives a `URLSearchParams` object or a regular query object, and returns the subset of query params that are
724
+ * relevant to the Builder SDK.
725
+ *
726
+ * @returns
727
+ */
728
+ declare const getBuilderSearchParams: (_options: QueryObject | URLSearchParams | undefined) => QueryObject;
729
+
730
+ interface Event {
731
+ /**
732
+ * The type of your event.
733
+ *
734
+ * Examples: `click`, `conversion`, `pageview`, `impression`
735
+ */
736
+ type: string;
737
+ data: {
738
+ /**
739
+ * (Optional) The content's ID. Useful if this event pertains to a specific piece of content.
740
+ */
741
+ contentId?: string;
742
+ /**
743
+ * This is the ID of the space that the content belongs to.
744
+ */
745
+ ownerId: string;
746
+ /**
747
+ * (Optional) metadata that you want to provide with your event.
748
+ */
749
+ metadata?: Dictionary<any>;
750
+ /**
751
+ * Session ID of the user. This is provided by the SDK by checking session storage.
752
+ */
753
+ sessionId: string | undefined;
754
+ /**
755
+ * Visitor ID of the user. This is provided by the SDK by checking cookies.
756
+ */
757
+ visitorId: string | undefined;
758
+ /**
759
+ * (Optional) If running an A/B test, the ID of the variation that the user is in.
760
+ */
761
+ variationId?: string;
762
+ [index: string]: any;
763
+ };
764
+ }
765
+ type EventProperties = Pick<Event, 'type'> & Pick<Event['data'], 'contentId' | 'variationId' | 'metadata'> & {
766
+ /**
767
+ * Your organization's API key.
768
+ */
769
+ apiKey: Event['data']['ownerId'];
770
+ /**
771
+ * (Optional) Any additional (non-metadata) properties to add to the event.
772
+ */
773
+ [index: string]: any;
774
+ };
775
+ declare const track: (args: EventProperties) => Promise<void | Response>;
776
+
777
+ type SubscribeToEditor = (
778
+ /**
779
+ * The Builder `model` to subscribe to
780
+ */
781
+ model: string,
782
+ /**
783
+ * The callback function to call when the content is updated.
784
+ */
785
+ callback: (updatedContent: BuilderContent) => void,
786
+ /**
787
+ * Extra options for the listener.
788
+ */
789
+ options?: {
790
+ /**
791
+ * List of hosts to allow editing content from.
792
+ */
793
+ trustedHosts?: string[] | undefined;
794
+ }) => () => void;
795
+ /**
796
+ * Subscribes to the Builder editor and listens to `content` updates of a certain `model`.
797
+ * Sends the updated `content` to the `callback` function.
798
+ */
799
+ declare const subscribeToEditor: SubscribeToEditor;
800
+
721
801
  interface GetContentOptions {
722
802
  /** The model to get content for (required) */
723
803
  model: string;
@@ -861,88 +941,6 @@ interface GetContentOptions {
861
941
  includeUnpublished?: boolean;
862
942
  }
863
943
 
864
- /**
865
- * Returns the first content entry that matches the given options.
866
- */
867
- declare function fetchOneEntry(options: GetContentOptions): Promise<BuilderContent | null>;
868
- /**
869
- * @deprecated `getContent` was renamed to `fetchOneEntry`. This is a temporary alias to avoid breaking changes.
870
- *
871
- * NOTE: consider using `fetchBuilderProps` instead for easier setup.
872
- */
873
- declare const getContent: typeof fetchOneEntry;
874
- type ContentResults = {
875
- results: BuilderContent[];
876
- };
877
- /**
878
- * @internal Exported only for testing purposes. Do not use.
879
- */
880
- declare const _processContentResult: (options: GetContentOptions, content: ContentResults, url?: URL) => Promise<BuilderContent[]>;
881
- /**
882
- * Returns a paginated array of entries that match the given options.
883
- */
884
- declare function fetchEntries(options: GetContentOptions): Promise<BuilderContent[]>;
885
- /**
886
- * @deprecated `getAllContent` was renamed to `fetchEntries`. This is a temporary alias to avoid breaking changes.
887
- */
888
- declare const getAllContent: typeof fetchEntries;
889
-
890
- type QueryObject = Record<string, string | string[]>;
891
- /**
892
- * Receives a `URLSearchParams` object or a regular query object, and returns the subset of query params that are
893
- * relevant to the Builder SDK.
894
- *
895
- * @returns
896
- */
897
- declare const getBuilderSearchParams: (_options: QueryObject | URLSearchParams | undefined) => QueryObject;
898
-
899
- interface Event {
900
- /**
901
- * The type of your event.
902
- *
903
- * Examples: `click`, `conversion`, `pageview`, `impression`
904
- */
905
- type: string;
906
- data: {
907
- /**
908
- * (Optional) The content's ID. Useful if this event pertains to a specific piece of content.
909
- */
910
- contentId?: string;
911
- /**
912
- * This is the ID of the space that the content belongs to.
913
- */
914
- ownerId: string;
915
- /**
916
- * (Optional) metadata that you want to provide with your event.
917
- */
918
- metadata?: Dictionary<any>;
919
- /**
920
- * Session ID of the user. This is provided by the SDK by checking session storage.
921
- */
922
- sessionId: string | undefined;
923
- /**
924
- * Visitor ID of the user. This is provided by the SDK by checking cookies.
925
- */
926
- visitorId: string | undefined;
927
- /**
928
- * (Optional) If running an A/B test, the ID of the variation that the user is in.
929
- */
930
- variationId?: string;
931
- [index: string]: any;
932
- };
933
- }
934
- type EventProperties = Pick<Event, 'type'> & Pick<Event['data'], 'contentId' | 'variationId' | 'metadata'> & {
935
- /**
936
- * Your organization's API key.
937
- */
938
- apiKey: Event['data']['ownerId'];
939
- /**
940
- * (Optional) Any additional (non-metadata) properties to add to the event.
941
- */
942
- [index: string]: any;
943
- };
944
- declare const track: (args: EventProperties) => Promise<void | Response>;
945
-
946
944
  type GetBuilderPropsOptions = (Omit<GetContentOptions, 'model'> & {
947
945
  model?: string;
948
946
  }) & ({
@@ -993,4 +991,30 @@ type GetBuilderPropsOptions = (Omit<GetContentOptions, 'model'> & {
993
991
  */
994
992
  declare const fetchBuilderProps: (_args: GetBuilderPropsOptions) => Promise<ContentVariantsPrps>;
995
993
 
996
- export { Blocks, BlocksProps, Button, ButtonProps, ColumnProps, Columns, ComponentInfo, ContentVariants as Content, ContentVariantsPrps as ContentProps, FragmentComponent as Fragment, FragmentProps, Image, ImageProps, InsertMenuConfig, InsertMenuItem, RegisteredComponent, RenderBlocks, RenderContent, SectionComponent as Section, SectionProps, Settings, Symbol, SymbolProps, Text, TextProps, Video, VideoProps, _processContentResult, createRegisterComponentMessage, fetchBuilderProps, fetchEntries, fetchOneEntry, getAllContent, getBuilderSearchParams, getContent, isEditing, isPreviewing, register, setEditorSettings, track };
994
+ /**
995
+ * Returns the first content entry that matches the given options.
996
+ */
997
+ declare function fetchOneEntry(options: GetContentOptions): Promise<BuilderContent | null>;
998
+ /**
999
+ * @deprecated `getContent` was renamed to `fetchOneEntry`. This is a temporary alias to avoid breaking changes.
1000
+ *
1001
+ * NOTE: consider using `fetchBuilderProps` instead for easier setup.
1002
+ */
1003
+ declare const getContent: typeof fetchOneEntry;
1004
+ type ContentResults = {
1005
+ results: BuilderContent[];
1006
+ };
1007
+ /**
1008
+ * @internal Exported only for testing purposes. Do not use.
1009
+ */
1010
+ declare const _processContentResult: (options: GetContentOptions, content: ContentResults, url?: URL) => Promise<BuilderContent[]>;
1011
+ /**
1012
+ * Returns a paginated array of entries that match the given options.
1013
+ */
1014
+ declare function fetchEntries(options: GetContentOptions): Promise<BuilderContent[]>;
1015
+ /**
1016
+ * @deprecated `getAllContent` was renamed to `fetchEntries`. This is a temporary alias to avoid breaking changes.
1017
+ */
1018
+ declare const getAllContent: typeof fetchEntries;
1019
+
1020
+ export { Blocks, BlocksProps, BuilderBlock, BuilderContent, Button, ButtonProps, ColumnProps, Columns, ComponentInfo, ContentVariants as Content, ContentVariantsPrps as ContentProps, FragmentComponent as Fragment, FragmentProps, Image, ImageProps, InsertMenuConfig, InsertMenuItem, RegisteredComponent, RenderBlocks, RenderContent, SectionComponent as Section, SectionProps, Settings, Symbol, SymbolProps, Text, TextProps, Video, VideoProps, _processContentResult, createRegisterComponentMessage, fetchBuilderProps, fetchEntries, fetchOneEntry, getAllContent, getBuilderSearchParams, getContent, isEditing, isPreviewing, register, setEditorSettings, subscribeToEditor, track };
@@ -3368,13 +3368,6 @@ async function fetchEntries(options) {
3368
3368
  }
3369
3369
  var getAllContent = fetchEntries;
3370
3370
 
3371
- // src/functions/is-from-trusted-host.ts
3372
- var DEFAULT_TRUSTED_HOSTS = ["*.beta.builder.io", "beta.builder.io", "builder.io", "localhost", "qa.builder.io"];
3373
- function isFromTrustedHost(trustedHosts, e) {
3374
- const url = new URL(e.origin), hostname = url.hostname;
3375
- return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
3376
- }
3377
-
3378
3371
  // src/functions/is-previewing.ts
3379
3372
  function isPreviewing() {
3380
3373
  if (!isBrowser()) {
@@ -3625,8 +3618,15 @@ var getInteractionPropertiesForEvent = (event) => {
3625
3618
  };
3626
3619
  };
3627
3620
 
3621
+ // src/functions/is-from-trusted-host.ts
3622
+ var DEFAULT_TRUSTED_HOSTS = ["*.beta.builder.io", "beta.builder.io", "builder.io", "localhost", "qa.builder.io"];
3623
+ function isFromTrustedHost(trustedHosts, e) {
3624
+ const url = new URL(e.origin), hostname = url.hostname;
3625
+ return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
3626
+ }
3627
+
3628
3628
  // src/constants/sdk-version.ts
3629
- var SDK_VERSION = "0.12.7";
3629
+ var SDK_VERSION = "0.12.8";
3630
3630
 
3631
3631
  // src/functions/register.ts
3632
3632
  var registry = {};
@@ -3763,6 +3763,66 @@ var setupBrowserForEditing = (options = {}) => {
3763
3763
  }
3764
3764
  };
3765
3765
 
3766
+ // src/helpers/subscribe-to-editor.ts
3767
+ var createEditorListener = ({
3768
+ model,
3769
+ trustedHosts,
3770
+ callbacks
3771
+ }) => {
3772
+ return (event) => {
3773
+ if (!isFromTrustedHost(trustedHosts, event)) {
3774
+ return;
3775
+ }
3776
+ const {
3777
+ data
3778
+ } = event;
3779
+ if (data) {
3780
+ switch (data.type) {
3781
+ case "builder.configureSdk": {
3782
+ callbacks.configureSdk(data.data);
3783
+ break;
3784
+ }
3785
+ case "builder.triggerAnimation": {
3786
+ callbacks.animation(data.data);
3787
+ break;
3788
+ }
3789
+ case "builder.contentUpdate": {
3790
+ const messageContent = data.data;
3791
+ const key = messageContent.key || messageContent.alias || messageContent.entry || messageContent.modelName;
3792
+ const contentData = messageContent.data;
3793
+ if (key === model) {
3794
+ callbacks.contentUpdate(contentData);
3795
+ }
3796
+ break;
3797
+ }
3798
+ }
3799
+ }
3800
+ };
3801
+ };
3802
+ var subscribeToEditor = (model, callback, options) => {
3803
+ if (!isBrowser) {
3804
+ logger.warn("`subscribeToEditor` only works in the browser. It currently seems to be running on the server.");
3805
+ return () => {
3806
+ };
3807
+ }
3808
+ setupBrowserForEditing();
3809
+ const listener = createEditorListener({
3810
+ callbacks: {
3811
+ contentUpdate: callback,
3812
+ animation: () => {
3813
+ },
3814
+ configureSdk: () => {
3815
+ }
3816
+ },
3817
+ model,
3818
+ trustedHosts: options?.trustedHosts
3819
+ });
3820
+ window.addEventListener("message", listener);
3821
+ return () => {
3822
+ window.removeEventListener("message", listener);
3823
+ };
3824
+ };
3825
+
3766
3826
  // src/components/content/components/enable-editor.tsx
3767
3827
  function EnableEditor(props) {
3768
3828
  const [forceReRenderCount, setForceReRenderCount] = createSignal(0);
@@ -3806,16 +3866,11 @@ function EnableEditor(props) {
3806
3866
  }));
3807
3867
  }
3808
3868
  function processMessage(event) {
3809
- if (!isFromTrustedHost(props.trustedHosts, event)) {
3810
- return;
3811
- }
3812
- const {
3813
- data
3814
- } = event;
3815
- if (data) {
3816
- switch (data.type) {
3817
- case "builder.configureSdk": {
3818
- const messageContent = data.data;
3869
+ return createEditorListener({
3870
+ model: props.model,
3871
+ trustedHosts: props.trustedHosts,
3872
+ callbacks: {
3873
+ configureSdk: (messageContent) => {
3819
3874
  const {
3820
3875
  breakpoints,
3821
3876
  contentId
@@ -3829,26 +3884,18 @@ function EnableEditor(props) {
3829
3884
  breakpoints
3830
3885
  }
3831
3886
  });
3832
- }
3833
- setForceReRenderCount(forceReRenderCount() + 1);
3834
- break;
3835
- }
3836
- case "builder.triggerAnimation": {
3837
- triggerAnimation(data.data);
3838
- break;
3839
- }
3840
- case "builder.contentUpdate": {
3841
- const messageContent = data.data;
3842
- const key = messageContent.key || messageContent.alias || messageContent.entry || messageContent.modelName;
3843
- const contentData = messageContent.data;
3844
- if (key === props.model) {
3845
- mergeNewContent(contentData);
3846
3887
  setForceReRenderCount(forceReRenderCount() + 1);
3847
3888
  }
3848
- break;
3889
+ },
3890
+ animation: (animation) => {
3891
+ triggerAnimation(animation);
3892
+ },
3893
+ contentUpdate: (newContent) => {
3894
+ mergeNewContent(newContent);
3895
+ setForceReRenderCount(forceReRenderCount() + 1);
3849
3896
  }
3850
3897
  }
3851
- }
3898
+ })(event);
3852
3899
  }
3853
3900
  function evaluateJsCode() {
3854
3901
  const jsCode = props.builderContextSignal.content?.data?.jsCode;
@@ -4692,4 +4739,4 @@ var fetchBuilderProps = async (_args) => {
4692
4739
  };
4693
4740
  };
4694
4741
 
4695
- export { blocks_default as Blocks, button_default as Button, columns_default as Columns, content_variants_default as Content, fragment_default as Fragment, image_default as Image, RenderBlocks, RenderContent, section_default as Section, symbol_default as Symbol, text_default as Text, video_default as Video, _processContentResult, createRegisterComponentMessage, fetchBuilderProps, fetchEntries, fetchOneEntry, getAllContent, getBuilderSearchParams, getContent, isEditing, isPreviewing, register, setEditorSettings, track };
4742
+ export { blocks_default as Blocks, button_default as Button, columns_default as Columns, content_variants_default as Content, fragment_default as Fragment, image_default as Image, RenderBlocks, RenderContent, section_default as Section, symbol_default as Symbol, text_default as Text, video_default as Video, _processContentResult, createRegisterComponentMessage, fetchBuilderProps, fetchEntries, fetchOneEntry, getAllContent, getBuilderSearchParams, getContent, isEditing, isPreviewing, register, setEditorSettings, subscribeToEditor, track };
@@ -3042,13 +3042,6 @@ async function fetchEntries(options) {
3042
3042
  }
3043
3043
  var getAllContent = fetchEntries;
3044
3044
 
3045
- // src/functions/is-from-trusted-host.ts
3046
- var DEFAULT_TRUSTED_HOSTS = ["*.beta.builder.io", "beta.builder.io", "builder.io", "localhost", "qa.builder.io"];
3047
- function isFromTrustedHost(trustedHosts, e) {
3048
- const url = new URL(e.origin), hostname = url.hostname;
3049
- return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
3050
- }
3051
-
3052
3045
  // src/functions/is-previewing.ts
3053
3046
  function isPreviewing() {
3054
3047
  if (!isBrowser()) {
@@ -3299,8 +3292,15 @@ var getInteractionPropertiesForEvent = (event) => {
3299
3292
  };
3300
3293
  };
3301
3294
 
3295
+ // src/functions/is-from-trusted-host.ts
3296
+ var DEFAULT_TRUSTED_HOSTS = ["*.beta.builder.io", "beta.builder.io", "builder.io", "localhost", "qa.builder.io"];
3297
+ function isFromTrustedHost(trustedHosts, e) {
3298
+ const url = new URL(e.origin), hostname = url.hostname;
3299
+ return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
3300
+ }
3301
+
3302
3302
  // src/constants/sdk-version.ts
3303
- var SDK_VERSION = "0.12.7";
3303
+ var SDK_VERSION = "0.12.8";
3304
3304
 
3305
3305
  // src/functions/register.ts
3306
3306
  var registry = {};
@@ -3437,6 +3437,66 @@ var setupBrowserForEditing = (options = {}) => {
3437
3437
  }
3438
3438
  };
3439
3439
 
3440
+ // src/helpers/subscribe-to-editor.ts
3441
+ var createEditorListener = ({
3442
+ model,
3443
+ trustedHosts,
3444
+ callbacks
3445
+ }) => {
3446
+ return (event) => {
3447
+ if (!isFromTrustedHost(trustedHosts, event)) {
3448
+ return;
3449
+ }
3450
+ const {
3451
+ data
3452
+ } = event;
3453
+ if (data) {
3454
+ switch (data.type) {
3455
+ case "builder.configureSdk": {
3456
+ callbacks.configureSdk(data.data);
3457
+ break;
3458
+ }
3459
+ case "builder.triggerAnimation": {
3460
+ callbacks.animation(data.data);
3461
+ break;
3462
+ }
3463
+ case "builder.contentUpdate": {
3464
+ const messageContent = data.data;
3465
+ const key = messageContent.key || messageContent.alias || messageContent.entry || messageContent.modelName;
3466
+ const contentData = messageContent.data;
3467
+ if (key === model) {
3468
+ callbacks.contentUpdate(contentData);
3469
+ }
3470
+ break;
3471
+ }
3472
+ }
3473
+ }
3474
+ };
3475
+ };
3476
+ var subscribeToEditor = (model, callback, options) => {
3477
+ if (!isBrowser) {
3478
+ logger.warn("`subscribeToEditor` only works in the browser. It currently seems to be running on the server.");
3479
+ return () => {
3480
+ };
3481
+ }
3482
+ setupBrowserForEditing();
3483
+ const listener = createEditorListener({
3484
+ callbacks: {
3485
+ contentUpdate: callback,
3486
+ animation: () => {
3487
+ },
3488
+ configureSdk: () => {
3489
+ }
3490
+ },
3491
+ model,
3492
+ trustedHosts: options?.trustedHosts
3493
+ });
3494
+ window.addEventListener("message", listener);
3495
+ return () => {
3496
+ window.removeEventListener("message", listener);
3497
+ };
3498
+ };
3499
+
3440
3500
  // src/components/content/components/enable-editor.tsx
3441
3501
  function EnableEditor(props) {
3442
3502
  const [forceReRenderCount, setForceReRenderCount] = createSignal10(0);
@@ -3482,14 +3542,11 @@ function EnableEditor(props) {
3482
3542
  }));
3483
3543
  }
3484
3544
  function processMessage(event) {
3485
- if (!isFromTrustedHost(props.trustedHosts, event)) {
3486
- return;
3487
- }
3488
- const { data } = event;
3489
- if (data) {
3490
- switch (data.type) {
3491
- case "builder.configureSdk": {
3492
- const messageContent = data.data;
3545
+ return createEditorListener({
3546
+ model: props.model,
3547
+ trustedHosts: props.trustedHosts,
3548
+ callbacks: {
3549
+ configureSdk: (messageContent) => {
3493
3550
  const { breakpoints, contentId } = messageContent;
3494
3551
  if (!contentId || contentId !== props.builderContextSignal.content?.id) {
3495
3552
  return;
@@ -3500,26 +3557,18 @@ function EnableEditor(props) {
3500
3557
  breakpoints
3501
3558
  }
3502
3559
  });
3503
- }
3504
- setForceReRenderCount(forceReRenderCount() + 1);
3505
- break;
3506
- }
3507
- case "builder.triggerAnimation": {
3508
- triggerAnimation(data.data);
3509
- break;
3510
- }
3511
- case "builder.contentUpdate": {
3512
- const messageContent = data.data;
3513
- const key = messageContent.key || messageContent.alias || messageContent.entry || messageContent.modelName;
3514
- const contentData = messageContent.data;
3515
- if (key === props.model) {
3516
- mergeNewContent(contentData);
3517
3560
  setForceReRenderCount(forceReRenderCount() + 1);
3518
3561
  }
3519
- break;
3562
+ },
3563
+ animation: (animation) => {
3564
+ triggerAnimation(animation);
3565
+ },
3566
+ contentUpdate: (newContent) => {
3567
+ mergeNewContent(newContent);
3568
+ setForceReRenderCount(forceReRenderCount() + 1);
3520
3569
  }
3521
3570
  }
3522
- }
3571
+ })(event);
3523
3572
  }
3524
3573
  function evaluateJsCode() {
3525
3574
  const jsCode = props.builderContextSignal.content?.data?.jsCode;
@@ -4213,5 +4262,6 @@ export {
4213
4262
  isPreviewing,
4214
4263
  register,
4215
4264
  setEditorSettings,
4265
+ subscribeToEditor,
4216
4266
  track
4217
4267
  };
@@ -3356,13 +3356,6 @@ async function fetchEntries(options) {
3356
3356
  }
3357
3357
  var getAllContent = fetchEntries;
3358
3358
 
3359
- // src/functions/is-from-trusted-host.ts
3360
- var DEFAULT_TRUSTED_HOSTS = ["*.beta.builder.io", "beta.builder.io", "builder.io", "localhost", "qa.builder.io"];
3361
- function isFromTrustedHost(trustedHosts, e) {
3362
- const url = new URL(e.origin), hostname = url.hostname;
3363
- return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
3364
- }
3365
-
3366
3359
  // src/functions/is-previewing.ts
3367
3360
  function isPreviewing() {
3368
3361
  if (!isBrowser()) {
@@ -3610,8 +3603,15 @@ var getInteractionPropertiesForEvent = (event) => {
3610
3603
  };
3611
3604
  };
3612
3605
 
3606
+ // src/functions/is-from-trusted-host.ts
3607
+ var DEFAULT_TRUSTED_HOSTS = ["*.beta.builder.io", "beta.builder.io", "builder.io", "localhost", "qa.builder.io"];
3608
+ function isFromTrustedHost(trustedHosts, e) {
3609
+ const url = new URL(e.origin), hostname = url.hostname;
3610
+ return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
3611
+ }
3612
+
3613
3613
  // src/constants/sdk-version.ts
3614
- var SDK_VERSION = "0.12.7";
3614
+ var SDK_VERSION = "0.12.8";
3615
3615
 
3616
3616
  // src/functions/register.ts
3617
3617
  var registry = {};
@@ -3747,6 +3747,66 @@ var setupBrowserForEditing = (options = {}) => {
3747
3747
  }
3748
3748
  };
3749
3749
 
3750
+ // src/helpers/subscribe-to-editor.ts
3751
+ var createEditorListener = ({
3752
+ model,
3753
+ trustedHosts,
3754
+ callbacks
3755
+ }) => {
3756
+ return (event) => {
3757
+ if (!isFromTrustedHost(trustedHosts, event)) {
3758
+ return;
3759
+ }
3760
+ const {
3761
+ data
3762
+ } = event;
3763
+ if (data) {
3764
+ switch (data.type) {
3765
+ case "builder.configureSdk": {
3766
+ callbacks.configureSdk(data.data);
3767
+ break;
3768
+ }
3769
+ case "builder.triggerAnimation": {
3770
+ callbacks.animation(data.data);
3771
+ break;
3772
+ }
3773
+ case "builder.contentUpdate": {
3774
+ const messageContent = data.data;
3775
+ const key = messageContent.key || messageContent.alias || messageContent.entry || messageContent.modelName;
3776
+ const contentData = messageContent.data;
3777
+ if (key === model) {
3778
+ callbacks.contentUpdate(contentData);
3779
+ }
3780
+ break;
3781
+ }
3782
+ }
3783
+ }
3784
+ };
3785
+ };
3786
+ var subscribeToEditor = (model, callback, options) => {
3787
+ if (!isBrowser) {
3788
+ logger.warn("`subscribeToEditor` only works in the browser. It currently seems to be running on the server.");
3789
+ return () => {
3790
+ };
3791
+ }
3792
+ setupBrowserForEditing();
3793
+ const listener = createEditorListener({
3794
+ callbacks: {
3795
+ contentUpdate: callback,
3796
+ animation: () => {
3797
+ },
3798
+ configureSdk: () => {
3799
+ }
3800
+ },
3801
+ model,
3802
+ trustedHosts: options?.trustedHosts
3803
+ });
3804
+ window.addEventListener("message", listener);
3805
+ return () => {
3806
+ window.removeEventListener("message", listener);
3807
+ };
3808
+ };
3809
+
3750
3810
  // src/components/content/components/enable-editor.tsx
3751
3811
  function EnableEditor(props) {
3752
3812
  const [forceReRenderCount, setForceReRenderCount] = createSignal(0);
@@ -3790,16 +3850,11 @@ function EnableEditor(props) {
3790
3850
  }));
3791
3851
  }
3792
3852
  function processMessage(event) {
3793
- if (!isFromTrustedHost(props.trustedHosts, event)) {
3794
- return;
3795
- }
3796
- const {
3797
- data
3798
- } = event;
3799
- if (data) {
3800
- switch (data.type) {
3801
- case "builder.configureSdk": {
3802
- const messageContent = data.data;
3853
+ return createEditorListener({
3854
+ model: props.model,
3855
+ trustedHosts: props.trustedHosts,
3856
+ callbacks: {
3857
+ configureSdk: (messageContent) => {
3803
3858
  const {
3804
3859
  breakpoints,
3805
3860
  contentId
@@ -3813,26 +3868,18 @@ function EnableEditor(props) {
3813
3868
  breakpoints
3814
3869
  }
3815
3870
  });
3816
- }
3817
- setForceReRenderCount(forceReRenderCount() + 1);
3818
- break;
3819
- }
3820
- case "builder.triggerAnimation": {
3821
- triggerAnimation(data.data);
3822
- break;
3823
- }
3824
- case "builder.contentUpdate": {
3825
- const messageContent = data.data;
3826
- const key = messageContent.key || messageContent.alias || messageContent.entry || messageContent.modelName;
3827
- const contentData = messageContent.data;
3828
- if (key === props.model) {
3829
- mergeNewContent(contentData);
3830
3871
  setForceReRenderCount(forceReRenderCount() + 1);
3831
3872
  }
3832
- break;
3873
+ },
3874
+ animation: (animation) => {
3875
+ triggerAnimation(animation);
3876
+ },
3877
+ contentUpdate: (newContent) => {
3878
+ mergeNewContent(newContent);
3879
+ setForceReRenderCount(forceReRenderCount() + 1);
3833
3880
  }
3834
3881
  }
3835
- }
3882
+ })(event);
3836
3883
  }
3837
3884
  function evaluateJsCode() {
3838
3885
  const jsCode = props.builderContextSignal.content?.data?.jsCode;
@@ -4675,4 +4722,4 @@ var fetchBuilderProps = async (_args) => {
4675
4722
  };
4676
4723
  };
4677
4724
 
4678
- export { blocks_default as Blocks, button_default as Button, columns_default as Columns, content_variants_default as Content, fragment_default as Fragment, image_default as Image, RenderBlocks, RenderContent, section_default as Section, symbol_default as Symbol, text_default as Text, video_default as Video, _processContentResult, createRegisterComponentMessage, fetchBuilderProps, fetchEntries, fetchOneEntry, getAllContent, getBuilderSearchParams, getContent, isEditing, isPreviewing, register, setEditorSettings, track };
4725
+ export { blocks_default as Blocks, button_default as Button, columns_default as Columns, content_variants_default as Content, fragment_default as Fragment, image_default as Image, RenderBlocks, RenderContent, section_default as Section, symbol_default as Symbol, text_default as Text, video_default as Video, _processContentResult, createRegisterComponentMessage, fetchBuilderProps, fetchEntries, fetchOneEntry, getAllContent, getBuilderSearchParams, getContent, isEditing, isPreviewing, register, setEditorSettings, subscribeToEditor, track };