@kustomizer/visual-editor 0.1.0 → 0.2.0

package/fesm2022/kustomizer-visual-editor.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { InjectionToken, inject, Injectable, makeEnvironmentProviders, ViewContainerRef, DestroyRef, input, effect, reflectComponentType, ChangeDetectionStrategy, Component, computed, NgZone, signal, viewChild, output } from '@angular/core';
 import { Router, ActivatedRoute } from '@angular/router';
-import { of, startWith, map, delay, throwError, isObservable, Observable, BehaviorSubject, tap, Subject, filter, debounceTime, switchMap as switchMap$1, takeUntil } from 'rxjs';
+import { of, startWith, map, delay, throwError, isObservable, Observable, BehaviorSubject, tap, Subject, filter, firstValueFrom, debounceTime, switchMap as switchMap$1, takeUntil } from 'rxjs';
 import { switchMap, map as map$1, catchError } from 'rxjs/operators';
 import { HttpClient } from '@angular/common/http';
 import { createActionGroup, emptyProps, props, createReducer, on, createFeatureSelector, createSelector, provideState, Store } from '@ngrx/store';
@@ -3260,6 +3260,50 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
             type: Injectable
         }], ctorParameters: () => [] });
 
+/**
+ * Service that holds and dynamically loads the per-merchant storefront URL.
+ *
+ * Resolution order:
+ * 1. Metafield value loaded from GET /api/storefront-url (per-shop)
+ * 2. Static STOREFRONT_URL injection token (env var / window global fallback)
+ * 3. Empty string (editor works with local components only)
+ */
+class StorefrontUrlService {
+    http = inject(HttpClient);
+    staticUrl = inject(STOREFRONT_URL);
+    /** Current storefront URL — reactive signal used by the editor and iframe. */
+    url = signal('', ...(ngDevMode ? [{ debugName: "url" }] : []));
+    /**
+     * Load the storefront URL from the backend metafield.
+     * Falls back to the static STOREFRONT_URL token if the endpoint
+     * returns no value or fails.
+     *
+     * Called during APP_INITIALIZER.
+     */
+    async load() {
+        try {
+            const res = await firstValueFrom(this.http.get('/api/storefront-url'));
+            if (res.url) {
+                this.url.set(res.url);
+                return;
+            }
+        }
+        catch {
+            // Non-fatal — fall back to static token
+        }
+        // Fallback: use the static injection token (env var / window global)
+        if (this.staticUrl) {
+            this.url.set(this.staticUrl);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: StorefrontUrlService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: StorefrontUrlService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: StorefrontUrlService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
 const MAX_DEPTH = 12;
 class DragDropService {
     store = inject(Store);
@@ -4391,7 +4435,7 @@ class VisualEditorComponent {
     config = inject(VISUAL_EDITOR_CONFIG);
     dndService = inject(DragDropService);
     iframeBridge = inject(IframeBridgeService);
-    storefrontUrl = inject(STOREFRONT_URL);
+    storefrontUrlService = inject(StorefrontUrlService);
     sanitizer = inject(DomSanitizer);
     destroy$ = new Subject();
     // Configuration-driven UI options
@@ -4404,9 +4448,10 @@ class VisualEditorComponent {
     // Iframe preview
     previewFrame = viewChild('previewFrame', ...(ngDevMode ? [{ debugName: "previewFrame" }] : []));
     previewUrl = computed(() => {
-        if (!this.storefrontUrl)
+        const url = this.storefrontUrlService.url();
+        if (!url)
             return null;
-        return this.sanitizer.bypassSecurityTrustResourceUrl(`${this.storefrontUrl}/kustomizer/editor`);
+        return this.sanitizer.bypassSecurityTrustResourceUrl(`${url}/kustomizer/editor`);
     }, ...(ngDevMode ? [{ debugName: "previewUrl" }] : []));
     iframeReady = false;
     propertiesTab = signal('props', ...(ngDevMode ? [{ debugName: "propertiesTab" }] : []));
@@ -4673,7 +4718,8 @@ class VisualEditorComponent {
     onIframeLoad() {
         const iframe = this.previewFrame()?.nativeElement;
         if (iframe) {
-            const origin = this.storefrontUrl ? new URL(this.storefrontUrl).origin : '*';
+            const sfUrl = this.storefrontUrlService.url();
+            const origin = sfUrl ? new URL(sfUrl).origin : '*';
             this.iframeBridge.connect(iframe, origin);
         }
     }
@@ -7839,5 +7885,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { BlockTreeItemComponent, CREATE_METAFIELD_DEFINITION_MUTATION, ComponentRegistryService, DEFAULT_ROUTER_NAVIGATION_CONFIG, DEFAULT_VISUAL_EDITOR_CONFIG, DELETE_METAFIELDS_MUTATION, DELETE_METAFIELD_DEFINITION_MUTATION, DefaultRouterNavigationService, DragDropService, DynamicRendererComponent, EDITOR_COMPONENT_DEFINITIONS, FILES_QUERY, GET_METAFIELD_DEFINITION_QUERY, GET_SHOP_ID_QUERY, GET_SHOP_METAFIELD_QUERY$1 as GET_SHOP_METAFIELD_QUERY, INDEX_KEY$1 as INDEX_KEY, IframeBridgeService, InputPageLoadingStrategy, MAX_METAFIELD_SIZE, ManifestLoaderService, NAMESPACE$1 as NAMESPACE, PageLoadingStrategy, PageManagerComponent, PageService, PageShopifyRepository, PageStorefrontRepository, ROUTER_NAVIGATION_CONFIG, RoutePageLoadingStrategy, SET_METAFIELD_MUTATION, SHOPIFY_CONFIG, STOREFRONT_CONFIG, STOREFRONT_URL, ShopifyFilePickerComponent, ShopifyFilesService, ShopifyGraphQLClient, ShopifyMetafieldRepository, SlotRendererComponent, StorefrontGraphQLClient, StorefrontMetafieldRepository, USE_IN_MEMORY_PAGES, VISUAL_EDITOR_CONFIG, VISUAL_EDITOR_FEATURE_KEY, VisualEditor, VisualEditorActions, VisualEditorComponent, VisualEditorFacade, VisualEditorNavigation, initialVisualEditorState, provideEditorComponents, provideVisualEditor, provideVisualEditorStore, selectBlocksForSection, selectBlocksForSlot, selectCanRedo, selectCanUndo, selectCurrentPage, selectCurrentPageId, selectCurrentPageSlug, selectCurrentPageStatus, selectCurrentPageTitle, selectCurrentPageVersion, selectDraggedElementId, selectElementById, selectHistory, selectHistoryIndex, selectHistoryLength, selectIsDirty, selectIsDragging, selectIsPageLoaded, selectLastAction, selectSectionById, selectSections, selectSelectedBlock, selectSelectedBlockSlotName, selectSelectedElement, selectSelectedElementId, selectSelectedElementType, selectSelectedSection, selectSelectedSectionId, selectSelectedSectionType, selectVisualEditorState, visualEditorReducer };
+export { BlockTreeItemComponent, CREATE_METAFIELD_DEFINITION_MUTATION, ComponentRegistryService, DEFAULT_ROUTER_NAVIGATION_CONFIG, DEFAULT_VISUAL_EDITOR_CONFIG, DELETE_METAFIELDS_MUTATION, DELETE_METAFIELD_DEFINITION_MUTATION, DefaultRouterNavigationService, DragDropService, DynamicRendererComponent, EDITOR_COMPONENT_DEFINITIONS, FILES_QUERY, GET_METAFIELD_DEFINITION_QUERY, GET_SHOP_ID_QUERY, GET_SHOP_METAFIELD_QUERY$1 as GET_SHOP_METAFIELD_QUERY, INDEX_KEY$1 as INDEX_KEY, IframeBridgeService, InputPageLoadingStrategy, MAX_METAFIELD_SIZE, ManifestLoaderService, NAMESPACE$1 as NAMESPACE, PageLoadingStrategy, PageManagerComponent, PageService, PageShopifyRepository, PageStorefrontRepository, ROUTER_NAVIGATION_CONFIG, RoutePageLoadingStrategy, SET_METAFIELD_MUTATION, SHOPIFY_CONFIG, STOREFRONT_CONFIG, STOREFRONT_URL, ShopifyFilePickerComponent, ShopifyFilesService, ShopifyGraphQLClient, ShopifyMetafieldRepository, SlotRendererComponent, StorefrontGraphQLClient, StorefrontMetafieldRepository, StorefrontUrlService, USE_IN_MEMORY_PAGES, VISUAL_EDITOR_CONFIG, VISUAL_EDITOR_FEATURE_KEY, VisualEditor, VisualEditorActions, VisualEditorComponent, VisualEditorFacade, VisualEditorNavigation, initialVisualEditorState, provideEditorComponents, provideVisualEditor, provideVisualEditorStore, selectBlocksForSection, selectBlocksForSlot, selectCanRedo, selectCanUndo, selectCurrentPage, selectCurrentPageId, selectCurrentPageSlug, selectCurrentPageStatus, selectCurrentPageTitle, selectCurrentPageVersion, selectDraggedElementId, selectElementById, selectHistory, selectHistoryIndex, selectHistoryLength, selectIsDirty, selectIsDragging, selectIsPageLoaded, selectLastAction, selectSectionById, selectSections, selectSelectedBlock, selectSelectedBlockSlotName, selectSelectedElement, selectSelectedElementId, selectSelectedElementType, selectSelectedSection, selectSelectedSectionId, selectSelectedSectionType, selectVisualEditorState, visualEditorReducer };
 //# sourceMappingURL=kustomizer-visual-editor.mjs.map