@lightspeed/crane 1.2.3 → 1.2.5

package/CHANGELOG.md

@@ -1,5 +1,35 @@
 # Changelog
 
+## 1.2.5 - 2025-07-07
+
+### Added
+
+- Move 'Local Preview' functionality from experimental to the core feature list.
+- Add new CLI command to start a local development server to serve previews of custom sections.
+
+### Changed
+
+- Update version of 'vite' dependency.
+
+## 1.2.4 - 2025-06-02
+
+### Added
+
+- **Storefront (experimental):** add multipage template support in the 'deploy' flow.
+- **Storefront (experimental):** add external layout support during compilation of multipage templates.
+- **Storefront (experimental):** implement external layout selection and deployment integration for multipage templates.
+- **Local Preview (experimental):** add structural support for local custom section preview generation.
+- Add validation for translation label properties in custom section configuration files during the 'build' command.
+- Add typing for all the available font sets in the custom section configuration files.
+
+### Changed
+
+- Update versions of 'unbuild' and 'vite-plugin-static-copy' dependencies.
+
+### Fixed
+
+- Fix the validation flow for template section showcase overrides. 
+
 ## 1.2.3 - 2025-05-15
 
 ### Changed

package/README.md

@@ -56,6 +56,12 @@ npx @lightspeed/crane@latest build
 Builds the application. Upon a successful build, the following directories can be located inside the application folder: ```dist``` and ```node_modules```.
 A prompt describing the next steps will be shown.
 
+```
+npx @lightspeed/crane@latest preview
+``` 
+Builds the application and starts a development server for local preview. A prompt pointing to the preview URL will be shown in the terminal, which can be accessed in a browser.
+This command needs to be run only once, after a consecutive build and refresh of the preview browser window, the changes will be visible without the need to run this command again.
+
 ```
 npx @lightspeed/crane@latest deploy
 ```
@@ -122,3 +128,5 @@ For more information regarding the notable changes for each versioned release an
 
 - [CHANGELOG](CHANGELOG.md)
 - [UPGRADE](UPGRADE.md)
+
+Note: for visitors through the `npmjs.com` site, please refer to the individual files in the `Code` tab of the package repository, as the links above will not work.

package/dist/app.d.mts

@@ -1,5 +1,5 @@
 import * as vue from 'vue';
-import type { Ref, App, Component } from 'vue';
+import { App, Ref, Component } from 'vue';
 
 interface AppBaseContext {
     readonly appName: string;
@@ -56,8 +56,6 @@ interface GlobalDesign {
     customCss?: string;
 }
 
-
-
 interface VueBaseProps<CONTENT, DESIGN> {
     init: (app: App<Element>, contextValue: AppBaseContext, contentValue: CONTENT, designValue: DESIGN, defaultsValue: Record<string, unknown>, externalContent: ExternalContentData, globalDesignValue: GlobalDesign) => void;
     update: (app: App<Element>, contentValue: CONTENT, designValue: DESIGN, defaultsValue: Record<string, unknown>, externalContent: ExternalContentData, globalDesignValue: GlobalDesign) => void;
@@ -208,15 +206,6 @@ declare function useDeckElementContent<CONTENT>(elementName: keyof CONTENT): {
 declare function getReactiveRef(card: Card | undefined, editorType: EditorTypes, contentElementName: string): {
     hasContent: boolean;
     value: string | undefined;
-} | {
-    hasContent: boolean;
-    lowResolutionMobileImage: string;
-    highResolutionMobileImage: string;
-    lowResolutionDesktopImage: string;
-    highResolutionDesktopImage: string;
-} | {
-    hasContent: boolean;
-    value: boolean | undefined;
 } | {
     title: string | undefined;
     type: ActionLinkType | undefined;
@@ -229,6 +218,15 @@ declare function getReactiveRef(card: Card | undefined, editorType: EditorTypes,
     hasTitle: boolean;
     hasLink: boolean;
     performAction: (() => void) | undefined;
+} | {
+    hasContent: boolean;
+    value: boolean | undefined;
+} | {
+    hasContent: boolean;
+    lowResolutionMobileImage: string;
+    highResolutionMobileImage: string;
+    lowResolutionDesktopImage: string;
+    highResolutionDesktopImage: string;
 } | undefined;
 
 declare function useLogoElementContent<CONTENT>(): {
@@ -242,15 +240,6 @@ declare function useLogoElementContent<CONTENT>(): {
     };
 };
 
-
-
-
-
-
-
-
-
-
 declare function useTextElementDesign<DESIGN>(elementName: keyof DESIGN): {
     font: string | undefined;
     size: number | GlobalTextSizeString | undefined;
@@ -302,10 +291,6 @@ declare function useLayoutElementDesign(): {
 
 declare function useLogoElementDesign<DESIGN>(): vue.ComputedRef<LogoDesignData>;
 
-
-
-
-
 interface VueServerAppExtensions {
     init?: (app: App<Element>) => void;
     render?: <C, D>(app: App<Element>, context: AppBaseContext, data: AppBaseData<C, D>) => void;
@@ -320,10 +305,6 @@ declare function createVueServerApp<C, D>(appComponent: Component, extensions?:
     };
 };
 
-
-
-
-
 interface VueClientAppExtensions {
     init?: (app: App<Element>) => void;
     mount?: <C, D, S extends AppBaseState<C, D>>(app: App<Element>, rootContainer: string, state: S) => void;
@@ -343,74 +324,84 @@ interface InstantsiteTilePromise {
 }
 interface InstantsiteJSAPI {
     /**
-     * Retrieves the current site ID.
-     *
-     * @returns {number} The site ID.
-     */
+       * Retrieves the current site ID.
+       *
+       * @returns {number} The site ID.
+       */
     getSiteId: () => number;
     /**
-     * Retrieves the public token for a given app.
-     *
-     * @param {string} appId - The ID of the app.
-     * @returns {string | undefined} The app's public token, or `undefined` if not found.
-     */
+       * Retrieves the public token for a given app.
+       *
+       * @param {string} appId - The ID of the app.
+       * @returns {string | undefined} The app's public token, or `undefined` if not found.
+       */
     getAppPublicToken: (appId: string) => string | undefined;
     /**
-     * Retrieves the public configuration for a given app.
-     *
-     * @param {string} appId - The ID of the app.
-     * @returns {string | undefined} The app's public configuration, or `undefined` if not found.
-     */
+       * Retrieves the public configuration for a given app.
+       *
+       * @param {string} appId - The ID of the app.
+       * @returns {string | undefined} The app's public configuration, or `undefined` if not found.
+       */
     getAppPublicConfig: (appId: string) => string | undefined;
     /**
-     * An event that triggers when a tile is loaded.
-     *
-     * @type {InstantsiteTilePromise}
-     *
-     * @example
-     * ```ts
-     * const tileLoadedPromise = instantsiteJsApi?.onTileLoaded;
-     *
-     * tileLoadedPromise?.add((tileId) => {
-     *     console.log('Tile loaded:', tileId);
-     * });
-     * ```
-     */
+       * An event that triggers when a tile is loaded.
+       *
+       * @type {InstantsiteTilePromise}
+       *
+       * @example
+       * ```ts
+       * const tileLoadedPromise = instantsiteJsApi?.onTileLoaded;
+       *
+       * tileLoadedPromise?.add((tileId) => {
+       *     console.log('Tile loaded:', tileId);
+       * });
+       * ```
+       */
     onTileLoaded: InstantsiteTilePromise;
     /**
-     * An event that triggers when a tile is unloaded.
-     *
-     * @type {InstantsiteTilePromise}
-     *
-     * @example
-     * ```ts
-     * const tileUnloadedPromise = instantsiteJsApi?.onTileUnloaded;
-     *
-     * tileUnloadedPromise?.add((tileId) => {
-     *     console.log('Tile unloaded:', tileId);
-     * });
-     * ```
-     */
+       * An event that triggers when a tile is unloaded.
+       *
+       * @type {InstantsiteTilePromise}
+       *
+       * @example
+       * ```ts
+       * const tileUnloadedPromise = instantsiteJsApi?.onTileUnloaded;
+       *
+       * tileUnloadedPromise?.add((tileId) => {
+       *     console.log('Tile unloaded:', tileId);
+       * });
+       * ```
+       */
     onTileUnloaded: InstantsiteTilePromise;
     /**
-     * Opens the search page with the specified keyword.
-     *
-     * @param {string | undefined} keyword - The keyword to search for.
-     * @returns {void}
-     */
+       * Opens the search page with the specified keyword.
+       *
+       * @param {string | undefined} keyword - The keyword to search for.
+       * @returns {void}
+       */
     openSearchPage: (keyword: string | undefined) => void;
 }
 
 declare function useInstantsiteJsApi(): InstantsiteJSAPI | undefined;
 
+declare const CatalogLayoutSlot: {
+    readonly PRODUCT_LIST: "CONTROLS";
+    readonly BOTTOM_BAR: "FOOTER";
+};
+declare const CategoryLayoutSlot: {
+    readonly CATEGORY_TITLE: "MAIN_TITLE";
+    readonly PRODUCT_LIST: "CONTROLS";
+    readonly BOTTOM_BAR: "FOOTER";
+};
+declare const ProductLayoutSlot: {
+    readonly TOP_BAR: "TOP_BAR";
+    readonly GALLERY: "GALLERY";
+    readonly SIDEBAR: "SIDEBAR";
+    readonly DESCRIPTION: "DESCRIPTION";
+    readonly REVIEW_LIST: "REVIEW_LIST";
+    readonly RELATED_PRODUCTS: "RELATED_PRODUCTS";
+    readonly BOTTOM_BAR: "FOOTER";
+};
 
-
-
-
-
-
-
-
-
-export { EditorTypes, createVueClientApp, createVueServerApp, useBackgroundElementDesign, useButtonElementContent, useButtonElementDesign, useDeckElementContent, useImageElementContent, useImageElementDesign, useInputboxElementContent, useInstantsiteJsApi, useLayoutElementDesign, useLogoElementContent, useLogoElementDesign, useMenuElementContent, useNavigationMenuElementContent, useSelectboxElementContent, useSelectboxElementDesign, useTextElementDesign, useTextareaElementContent, useTextareaElementDesign, useToggleElementContent, useToggleElementDesign, useVueBaseProps };
+export { CatalogLayoutSlot, CategoryLayoutSlot, EditorTypes, ProductLayoutSlot, createVueClientApp, createVueServerApp, useBackgroundElementDesign, useButtonElementContent, useButtonElementDesign, useDeckElementContent, useImageElementContent, useImageElementDesign, useInputboxElementContent, useInstantsiteJsApi, useLayoutElementDesign, useLogoElementContent, useLogoElementDesign, useMenuElementContent, useNavigationMenuElementContent, useSelectboxElementContent, useSelectboxElementDesign, useTextElementDesign, useTextareaElementContent, useTextareaElementDesign, useToggleElementContent, useToggleElementDesign, useVueBaseProps };
 export type { ButtonContent, Card, Deck, ImageContent, InputBoxContent, SelectBoxContent, TextAreaContent, ToggleContent };

package/dist/app.d.ts

@@ -1,5 +1,5 @@
 import * as vue from 'vue';
-import type { Ref, App, Component } from 'vue';
+import { App, Ref, Component } from 'vue';
 
 interface AppBaseContext {
     readonly appName: string;
@@ -56,8 +56,6 @@ interface GlobalDesign {
     customCss?: string;
 }
 
-
-
 interface VueBaseProps<CONTENT, DESIGN> {
     init: (app: App<Element>, contextValue: AppBaseContext, contentValue: CONTENT, designValue: DESIGN, defaultsValue: Record<string, unknown>, externalContent: ExternalContentData, globalDesignValue: GlobalDesign) => void;
     update: (app: App<Element>, contentValue: CONTENT, designValue: DESIGN, defaultsValue: Record<string, unknown>, externalContent: ExternalContentData, globalDesignValue: GlobalDesign) => void;
@@ -208,15 +206,6 @@ declare function useDeckElementContent<CONTENT>(elementName: keyof CONTENT): {
 declare function getReactiveRef(card: Card | undefined, editorType: EditorTypes, contentElementName: string): {
     hasContent: boolean;
     value: string | undefined;
-} | {
-    hasContent: boolean;
-    lowResolutionMobileImage: string;
-    highResolutionMobileImage: string;
-    lowResolutionDesktopImage: string;
-    highResolutionDesktopImage: string;
-} | {
-    hasContent: boolean;
-    value: boolean | undefined;
 } | {
     title: string | undefined;
     type: ActionLinkType | undefined;
@@ -229,6 +218,15 @@ declare function getReactiveRef(card: Card | undefined, editorType: EditorTypes,
     hasTitle: boolean;
     hasLink: boolean;
     performAction: (() => void) | undefined;
+} | {
+    hasContent: boolean;
+    value: boolean | undefined;
+} | {
+    hasContent: boolean;
+    lowResolutionMobileImage: string;
+    highResolutionMobileImage: string;
+    lowResolutionDesktopImage: string;
+    highResolutionDesktopImage: string;
 } | undefined;
 
 declare function useLogoElementContent<CONTENT>(): {
@@ -242,15 +240,6 @@ declare function useLogoElementContent<CONTENT>(): {
     };
 };
 
-
-
-
-
-
-
-
-
-
 declare function useTextElementDesign<DESIGN>(elementName: keyof DESIGN): {
     font: string | undefined;
     size: number | GlobalTextSizeString | undefined;
@@ -302,10 +291,6 @@ declare function useLayoutElementDesign(): {
 
 declare function useLogoElementDesign<DESIGN>(): vue.ComputedRef<LogoDesignData>;
 
-
-
-
-
 interface VueServerAppExtensions {
     init?: (app: App<Element>) => void;
     render?: <C, D>(app: App<Element>, context: AppBaseContext, data: AppBaseData<C, D>) => void;
@@ -320,10 +305,6 @@ declare function createVueServerApp<C, D>(appComponent: Component, extensions?:
     };
 };
 
-
-
-
-
 interface VueClientAppExtensions {
     init?: (app: App<Element>) => void;
     mount?: <C, D, S extends AppBaseState<C, D>>(app: App<Element>, rootContainer: string, state: S) => void;
@@ -343,74 +324,84 @@ interface InstantsiteTilePromise {
 }
 interface InstantsiteJSAPI {
     /**
-     * Retrieves the current site ID.
-     *
-     * @returns {number} The site ID.
-     */
+       * Retrieves the current site ID.
+       *
+       * @returns {number} The site ID.
+       */
     getSiteId: () => number;
     /**
-     * Retrieves the public token for a given app.
-     *
-     * @param {string} appId - The ID of the app.
-     * @returns {string | undefined} The app's public token, or `undefined` if not found.
-     */
+       * Retrieves the public token for a given app.
+       *
+       * @param {string} appId - The ID of the app.
+       * @returns {string | undefined} The app's public token, or `undefined` if not found.
+       */
     getAppPublicToken: (appId: string) => string | undefined;
     /**
-     * Retrieves the public configuration for a given app.
-     *
-     * @param {string} appId - The ID of the app.
-     * @returns {string | undefined} The app's public configuration, or `undefined` if not found.
-     */
+       * Retrieves the public configuration for a given app.
+       *
+       * @param {string} appId - The ID of the app.
+       * @returns {string | undefined} The app's public configuration, or `undefined` if not found.
+       */
     getAppPublicConfig: (appId: string) => string | undefined;
     /**
-     * An event that triggers when a tile is loaded.
-     *
-     * @type {InstantsiteTilePromise}
-     *
-     * @example
-     * ```ts
-     * const tileLoadedPromise = instantsiteJsApi?.onTileLoaded;
-     *
-     * tileLoadedPromise?.add((tileId) => {
-     *     console.log('Tile loaded:', tileId);
-     * });
-     * ```
-     */
+       * An event that triggers when a tile is loaded.
+       *
+       * @type {InstantsiteTilePromise}
+       *
+       * @example
+       * ```ts
+       * const tileLoadedPromise = instantsiteJsApi?.onTileLoaded;
+       *
+       * tileLoadedPromise?.add((tileId) => {
+       *     console.log('Tile loaded:', tileId);
+       * });
+       * ```
+       */
     onTileLoaded: InstantsiteTilePromise;
     /**
-     * An event that triggers when a tile is unloaded.
-     *
-     * @type {InstantsiteTilePromise}
-     *
-     * @example
-     * ```ts
-     * const tileUnloadedPromise = instantsiteJsApi?.onTileUnloaded;
-     *
-     * tileUnloadedPromise?.add((tileId) => {
-     *     console.log('Tile unloaded:', tileId);
-     * });
-     * ```
-     */
+       * An event that triggers when a tile is unloaded.
+       *
+       * @type {InstantsiteTilePromise}
+       *
+       * @example
+       * ```ts
+       * const tileUnloadedPromise = instantsiteJsApi?.onTileUnloaded;
+       *
+       * tileUnloadedPromise?.add((tileId) => {
+       *     console.log('Tile unloaded:', tileId);
+       * });
+       * ```
+       */
     onTileUnloaded: InstantsiteTilePromise;
     /**
-     * Opens the search page with the specified keyword.
-     *
-     * @param {string | undefined} keyword - The keyword to search for.
-     * @returns {void}
-     */
+       * Opens the search page with the specified keyword.
+       *
+       * @param {string | undefined} keyword - The keyword to search for.
+       * @returns {void}
+       */
     openSearchPage: (keyword: string | undefined) => void;
 }
 
 declare function useInstantsiteJsApi(): InstantsiteJSAPI | undefined;
 
+declare const CatalogLayoutSlot: {
+    readonly PRODUCT_LIST: "CONTROLS";
+    readonly BOTTOM_BAR: "FOOTER";
+};
+declare const CategoryLayoutSlot: {
+    readonly CATEGORY_TITLE: "MAIN_TITLE";
+    readonly PRODUCT_LIST: "CONTROLS";
+    readonly BOTTOM_BAR: "FOOTER";
+};
+declare const ProductLayoutSlot: {
+    readonly TOP_BAR: "TOP_BAR";
+    readonly GALLERY: "GALLERY";
+    readonly SIDEBAR: "SIDEBAR";
+    readonly DESCRIPTION: "DESCRIPTION";
+    readonly REVIEW_LIST: "REVIEW_LIST";
+    readonly RELATED_PRODUCTS: "RELATED_PRODUCTS";
+    readonly BOTTOM_BAR: "FOOTER";
+};
 
-
-
-
-
-
-
-
-
-export { EditorTypes, createVueClientApp, createVueServerApp, useBackgroundElementDesign, useButtonElementContent, useButtonElementDesign, useDeckElementContent, useImageElementContent, useImageElementDesign, useInputboxElementContent, useInstantsiteJsApi, useLayoutElementDesign, useLogoElementContent, useLogoElementDesign, useMenuElementContent, useNavigationMenuElementContent, useSelectboxElementContent, useSelectboxElementDesign, useTextElementDesign, useTextareaElementContent, useTextareaElementDesign, useToggleElementContent, useToggleElementDesign, useVueBaseProps };
+export { CatalogLayoutSlot, CategoryLayoutSlot, EditorTypes, ProductLayoutSlot, createVueClientApp, createVueServerApp, useBackgroundElementDesign, useButtonElementContent, useButtonElementDesign, useDeckElementContent, useImageElementContent, useImageElementDesign, useInputboxElementContent, useInstantsiteJsApi, useLayoutElementDesign, useLogoElementContent, useLogoElementDesign, useMenuElementContent, useNavigationMenuElementContent, useSelectboxElementContent, useSelectboxElementDesign, useTextElementDesign, useTextareaElementContent, useTextareaElementDesign, useToggleElementContent, useToggleElementDesign, useVueBaseProps };
 export type { ButtonContent, Card, Deck, ImageContent, InputBoxContent, SelectBoxContent, TextAreaContent, ToggleContent };

package/dist/app.mjs

@@ -1 +1 @@
-import{getCurrentInstance as K,ref as b,computed as i,reactive as d,createSSRApp as P}from"vue";import{renderToString as U}from"vue/server-renderer";const I=new Map;function c(){const e=(l,r,a,v,g,s,u)=>{I.set(l._uid,{context:b(r),content:b(a),design:b(v),defaults:b(g),site:b(s?.site??{}),category:b(s?.category),globalDesign:b(u)})},n=(l,r,a,v,g,s)=>{const u=I.get(l._uid);u!==void 0&&(u.content.value=r,u.design.value=a,u.defaults.value=v,u.site.value=g.site??{},u.category.value=g.category,u.globalDesign.value=s)},t=K()?.appContext.app._uid??-1,o=I.get(t);return{init:e,update:n,context:o?.context,content:o?.content,design:o?.design,defaults:o?.defaults,site:o?.site,category:o?.category,globalDesign:o?.globalDesign}}function O(e,n){const t=c(),o=i(()=>n!==void 0?n:t.content.value);return X(o,e)}function X(e,n){const t=i(()=>{const r=e.value[n];if(r!==void 0){if(typeof r=="string")return r;throw new Error(`Element ${n} is not inputbox`)}}),o=i(()=>t.value!==void 0),l=i(()=>t.value);return d({hasContent:o,value:l})}function C(e,n){const t=c(),o=i(()=>n!==void 0?n:t.content.value);return F(o,e)}function F(e,n){const t=i(()=>{const r=e.value[n];if(r!==void 0){if(typeof r=="string")return r;throw new Error(`Element ${n} is not textarea`)}}),o=i(()=>t.value!==void 0),l=i(()=>t.value);return d({hasContent:o,value:l})}const m={HYPER_LINK:"HYPER_LINK",SCROLL_TO_TILE:"SCROLL_TO_TILE",MAIL_LINK:"MAIL_LINK",TEL_LINK:"TEL_LINK",GO_TO_STORE:"GO_TO_STORE",GO_TO_STORE_LINK:"GO_TO_STORE_LINK",GO_TO_PAGE:"GO_TO_PAGE"};function W(e){if("tileId"in e)return e.tileId;if("tileIdForScroll"in e)return e.tileIdForScroll}function V(e){if("pageId"in e)return e.pageId;if("pageIdForNavigate"in e)return e.pageIdForNavigate}function H(e){if("pageUrl"in e)return e.pageUrl;switch(V(e)){case"products":return"/products";case"cart":return"/cart";case"account":return"/account";case"search":return"/search";case"home":default:return"/"}}const L=(e,n)=>{if(!e||n)return;const{type:t,link:o,email:l,phone:r}=e,a=H(e);switch(t){case m.HYPER_LINK:if(o)return()=>window.open(o,"_blank");break;case m.GO_TO_STORE:case m.GO_TO_STORE_LINK:return()=>window.open("/products","_self");case m.MAIL_LINK:if(l)return()=>window.open(`mailto:${l}`,"_self");break;case m.TEL_LINK:if(r)return()=>window.open(`tel:${r}`,"_self");break;case m.SCROLL_TO_TILE:if(typeof document<"u")return()=>{const v=W(e);document.getElementById(`tile-${v}`)?.scrollIntoView()};break;case m.GO_TO_PAGE:if(a)return()=>window.open(a,"_self");break;default:console.error(`Unknown type of ActionLink: ${t}`)}};function Y(e){return"title"in e&&"type"in e}function j(e,n,t){const o=i(()=>{const h=e.value[n];if(h!==void 0){if(Y(h))return h;throw new Error(`Element ${n} is not action link`)}}),l=i(()=>o.value?.title),r=i(()=>o.value?.type),a=i(()=>o.value?.link),v=i(()=>o.value?.email),g=i(()=>o.value?.phone),s=i(()=>o.value?.tileId?`tile-${o.value?.tileId}`:null),u=i(()=>o.value?.type==="GO_TO_STORE_LINK"?"products":o.value?.pageId),f=i(()=>o.value?.pageUrl),E=i(()=>!!l.value),B=i(()=>!!a.value),M=L(o.value,t);return d({title:l,type:r,link:a,email:v,phone:g,tileDivId:s,pageId:u,pageUrl:f,hasTitle:E,hasLink:B,performAction:M})}function x(e,n){const t=c(),o=i(()=>!!t.site?.value?.isPreviewMode),l=i(()=>n!==void 0?n:t.content.value!==void 0?t.content.value:{});return j(l,e,o.value)}function J(e){return"bucket"in e&&"borderInfo"in e&&"set"in e}function w(e,n){const t=new RegExp(/^https?:\/\//);return e!=null&&t.test(e)?e:`${n}/${e}`}function k(e,n){const t=c(),o=i(()=>n!==void 0?n:t.content.value);return q(o,e)}function q(e,n){const t=i(()=>{const s=e.value[n];if(s!==void 0){if(J(s))return s;throw new Error(`Element ${n} is not image`)}}),o=i(()=>t.value===void 0?"":c().context.value.imageBuckets?.[t.value?.bucket]),l=i(()=>t.value!==void 0),r=i(()=>w(t.value?.set?.["cropped-webp-100x200"]?.url,o.value)),a=i(()=>w(t.value?.set?.["cropped-webp-1000x2000"]?.url,o.value)),v=i(()=>w(t.value?.set?.["webp-200x200"]?.url,o.value)),g=i(()=>w(t.value?.set?.["webp-2000x2000"]?.url,o.value));return d({hasContent:l,lowResolutionMobileImage:r,highResolutionMobileImage:a,lowResolutionDesktopImage:v,highResolutionDesktopImage:g})}function Q(e){return"enabled"in e}function D(e,n){const t=c(),o=i(()=>n!==void 0?n:t.content.value);return Z(o,e)}function Z(e,n){const t=i(()=>{const r=e.value[n];if(r!==void 0){if(Q(r))return r;throw new Error(`Element ${n} is not toggle`)}}),o=i(()=>t.value!==void 0),l=i(()=>t.value?.enabled);return d({hasContent:o,value:l})}function R(e,n){const t=c(),o=i(()=>n!==void 0?n:t.content.value);return ee(o,e)}function ee(e,n){const t=i(()=>{const r=e.value[n];if(r!==void 0){if(typeof r=="string")return r;throw new Error(`Element ${n} is not selectbox`)}}),o=i(()=>t.value!==void 0),l=i(()=>t.value);return d({hasContent:o,value:l})}function te(e){return e!==null&&"items"in e}function A(e){const n=c(),t=i(()=>{const a=n.content.value[e];if(a!==void 0){if(te(a))return a;throw new Error(`Element ${e} is not an menu`)}}),o=i(()=>!!n.site?.value?.isPreviewMode),l=i(()=>t.value!==void 0),r=i(()=>t.value?.items?t.value.items.map(a=>({...a,performAction:L(a,o.value)})):[]);return d({hasContent:l,items:r})}const ne="menu";function oe(){return A(ne)}var G=(e=>(e.INPUTBOX="INPUTBOX",e.TEXTAREA="TEXTAREA",e.BUTTON="BUTTON",e.IMAGE="IMAGE",e.TOGGLE="TOGGLE",e.SELECTBOX="SELECTBOX",e))(G||{});function ie(e){if(typeof e!="object"||e===null)return!1;const n=e;return Array.isArray(n.cards)&&n.cards.every(t=>typeof t.settings=="object"&&t.settings!==null)}function le(e){const n=c(),t=i(()=>{const r=n.content.value[e];if(r!==void 0){if(ie(r))return r;throw new Error(`Element ${e} is not of DECK type`)}}),o=i(()=>t.value!==void 0&&t.value.cards.length>0),l=i(()=>t.value?.cards);return d({hasContent:o,cards:l,getReactiveRef:re})}function re(e,n,t){if(e==null)throw Error("Could not get a reactive ref for undefined Card");const o=e.settings[t];if(o===void 0)return o;switch(n){case"TEXTAREA":return C(t,e.settings);case"INPUTBOX":return O(t,e.settings);case"SELECTBOX":return R(t,e.settings);case"IMAGE":return k(t,e.settings);case"TOGGLE":return D(t,e.settings);case"BUTTON":return x(t,e.settings);default:return}}function ae(e){return"type"in e&&("text"in e||"image"in e)}function T(e,n){const t=new RegExp(/^https?:\/\//);return e!==void 0&&t.test(e)?e:`${n}/${e}`}function ue(){const e=c(),n=i(()=>{const a=e.content.value.logo;if(a!==void 0){if(ae(a))return a;throw new Error("Element logo is not LOGO")}}),t=i(()=>n.value?.type),o=i(()=>n.value?.text),l=i(()=>n.value?.image===void 0?"":e.context.value.imageBuckets?.[n.value.image.bucket]),r=i(()=>({lowResolutionMobileImage:T(n.value?.image?.set?.["cropped-webp-100x200"]?.url,l.value),highResolutionMobileImage:T(n.value?.image?.set?.["cropped-webp-1000x2000"]?.url,l.value),lowResolutionDesktopImage:T(n.value?.image?.set?.["webp-200x200"]?.url,l.value),highResolutionDesktopImage:T(n.value?.image?.set?.["webp-2000x2000"]?.url,l.value)}));return d({type:t,text:o,image:r})}function S(e,n){if(n===void 0)return;if(!n.startsWith("global."))return n.replaceAll("_"," ");const t=n.split(".").at(2);if(t!==void 0)return e.fontFamily?e.fontFamily[t].replaceAll("_"," "):void 0}function y(e,n,t){return n?S(e,n):S(e,t)}function $(e,n){if(n===void 0)return;if(typeof n!="string"||!n.startsWith("global."))return n;const t=n.split(".").at(2);if(t!==void 0)return e.textSize?e.textSize[t]:void 0}function _(e,n,t){return n?$(e,n):$(e,t)}function z(e,n){if(n===void 0)return;if(typeof n!="string"||!n.startsWith("global."))return n;const t=n.split(".").at(2);if(t!==void 0)return e.color?e.color[t]:void 0}function p(e,n,t){return n?z(e,n):z(e,t)}function se(e,n,t){return{visible:n?.visible??t?.visible??!1,width:n?.width??t?.width??1,color:p(e,n?.color,t?.color)}}function ce(e){const n=c(),t=i(()=>{const s=n.design.value[e],u=n.defaults.value[e],f=n.globalDesign.value;return{font:y(f,s?.font,u?.font),size:_(f,s?.size,u?.size),bold:s?.bold??u?.bold,italic:s?.italic??u?.italic,color:p(f,s?.color,u?.color),visible:s?.visible??u?.visible??!1}}),o=i(()=>t.value?.font),l=i(()=>t.value?.size),r=i(()=>t.value?.bold),a=i(()=>t.value?.italic),v=i(()=>t.value?.color),g=i(()=>t.value?.visible);return d({font:o,size:l,bold:r,italic:a,color:v,visible:g})}function ve(e){const n=c(),t=i(()=>{const u=n.design.value[e],f=n.defaults.value[e],E=n.globalDesign.value;return{font:y(E,u?.font,f?.font),size:_(E,u?.size,f?.size),bold:u?.bold??f?.bold,italic:u?.italic??f?.italic,color:p(E,u?.color,f?.color),visible:u?.visible??f?.visible??!1,whiteSpace:"pre-wrap"}}),o=i(()=>t.value?.font),l=i(()=>t.value?.size),r=i(()=>t.value?.bold),a=i(()=>t.value?.italic),v=i(()=>t.value?.color),g=i(()=>t.value?.visible),s=i(()=>t.value?.whiteSpace);return d({font:o,size:l,bold:r,italic:a,color:v,visible:g,whiteSpace:s})}function de(e){const n=c(),t=i(()=>{const s=n.design.value[e],u=n.defaults.value[e],f=n.globalDesign.value;return{appearance:s?.appearance??u?.appearance,font:y(f,s?.font,u?.font),size:s?.size??u?.size,style:s?.style??u?.style,color:p(f,s?.color,u?.color),visible:s?.visible??u?.visible??!1}}),o=i(()=>t.value?.appearance),l=i(()=>t.value?.font),r=i(()=>t.value?.size),a=i(()=>t.value?.style),v=i(()=>t.value?.color),g=i(()=>t.value?.visible);return d({appearance:o,font:l,size:r,style:a,color:v,visible:g})}function fe(e){const n=c(),t=i(()=>{const r=n.design.value[e],a=n.defaults.value[e],v=n.globalDesign.value;return{overlay:{type:r?.overlay?.type??a?.overlay?.type,solid:{color:p(v,r?.overlay?.solid?.color,a?.overlay?.solid?.color)},gradient:{fromColor:p(v,r?.overlay?.gradient?.fromColor,a?.overlay?.gradient?.fromColor),toColor:p(v,r?.overlay?.gradient?.toColor,a?.overlay?.gradient?.toColor)}},visible:r?.visible??a?.visible??!1}}),o=i(()=>t.value?.overlay),l=i(()=>t.value?.visible);return d({overlay:o,visible:l})}function ge(e){const n=c(),t=i(()=>{const l=n.design.value[e],r=n.defaults.value[e];return{enabled:l?.enabled??r?.enabled}}),o=i(()=>t.value?.enabled);return d({enabled:o})}function pe(e){const n=c(),t=i(()=>{const l=n.design.value[e],r=n.defaults.value[e];return{value:l?.value??r?.value}}),o=i(()=>t.value?.value);return d({value:o})}function be(e){const n=c(),t=i(()=>{const l=n.design.value[e],r=n.defaults.value[e],a=n.globalDesign.value;return{background:{type:l?.background?.type??r?.background?.type,solid:{color:p(a,l?.background?.solid?.color,r?.background?.solid?.color)},gradient:{fromColor:p(a,l?.background?.gradient?.fromColor,r?.background?.gradient?.fromColor),toColor:p(a,l?.background?.gradient?.toColor,r?.background?.gradient?.toColor)}}}}),o=i(()=>t.value?.background);return d({background:o})}function me(){const e=c(),n=i(()=>e.design.value.layout),t=i(()=>n.value);return d({layout:t})}function Ee(){const e=c();return i(()=>{const n=e.design.value.logo,t=e.defaults.value.logo,o=e.globalDesign.value;return{font:y(o,n?.font,t?.font),size:_(o,n?.size,t?.size),bold:n?.bold??t?.bold,italic:n?.italic??t?.italic,color:p(o,n?.color,t?.color),visible:n?.visible??t?.visible??!1,spacing:n?.spacing??t?.spacing??0,capitalization:n?.capitalization??t?.capitalization??"none",frame:se(o,n?.frame,t?.frame)}})}function N(e){return{app:P(e)}}function we(e,n){return{init:()=>{const{app:t}=N(e);return n?.init?.(t),{render:async(o,l)=>(c().init(t,o,l.content,l.design,l.defaults,l.externalContent,o.globalDesign),n?.render?.(t,o,l),{html:await U(t,{context:o}),state:{context:o,data:l}})}}}}function Te(e,n){return{init:()=>{const{app:t}=N(e);return n?.init?.(t),{mount:(o,l)=>{c().init(t,l.context,l.data.content,l.data.design,l.data.defaults,l.data.externalContent,l.context.globalDesign),n?.mount?.(t,o,l),t.mount(o)},update:o=>{c().update(t,o.data.content,o.data.design,o.data.defaults,o.data.externalContent,o.context.globalDesign),n?.update?.(t,o)},unmount:()=>{n?.unmount?.(t),t.unmount()}}}}}function ye(){return globalThis.window.instantsite}export{G as EditorTypes,Te as createVueClientApp,we as createVueServerApp,be as useBackgroundElementDesign,x as useButtonElementContent,de as useButtonElementDesign,le as useDeckElementContent,k as useImageElementContent,fe as useImageElementDesign,O as useInputboxElementContent,ye as useInstantsiteJsApi,me as useLayoutElementDesign,ue as useLogoElementContent,Ee as useLogoElementDesign,A as useMenuElementContent,oe as useNavigationMenuElementContent,R as useSelectboxElementContent,pe as useSelectboxElementDesign,ce as useTextElementDesign,C as useTextareaElementContent,ve as useTextareaElementDesign,D as useToggleElementContent,ge as useToggleElementDesign,c as useVueBaseProps};
+import{getCurrentInstance as M,ref as b,computed as i,reactive as d,createSSRApp as U}from"vue";import{renderToString as K}from"vue/server-renderer";const w=new Map;function c(){const e=(l,r,a,v,g,s,u)=>{w.set(l._uid,{context:b(r),content:b(a),design:b(v),defaults:b(g),site:b(s?.site??{}),category:b(s?.category),globalDesign:b(u)})},n=(l,r,a,v,g,s)=>{const u=w.get(l._uid);u!==void 0&&(u.content.value=r,u.design.value=a,u.defaults.value=v,u.site.value=g.site??{},u.category.value=g.category,u.globalDesign.value=s)},t=M()?.appContext.app._uid??-1,o=w.get(t);return{init:e,update:n,context:o?.context,content:o?.content,design:o?.design,defaults:o?.defaults,site:o?.site,category:o?.category,globalDesign:o?.globalDesign}}function R(e,n){const t=c(),o=i(()=>n!==void 0?n:t.content.value);return F(o,e)}function F(e,n){const t=i(()=>{const r=e.value[n];if(r!==void 0){if(typeof r=="string")return r;throw new Error(`Element ${n} is not inputbox`)}}),o=i(()=>t.value!==void 0),l=i(()=>t.value);return d({hasContent:o,value:l})}function C(e,n){const t=c(),o=i(()=>n!==void 0?n:t.content.value);return W(o,e)}function W(e,n){const t=i(()=>{const r=e.value[n];if(r!==void 0){if(typeof r=="string")return r;throw new Error(`Element ${n} is not textarea`)}}),o=i(()=>t.value!==void 0),l=i(()=>t.value);return d({hasContent:o,value:l})}const E={HYPER_LINK:"HYPER_LINK",SCROLL_TO_TILE:"SCROLL_TO_TILE",MAIL_LINK:"MAIL_LINK",TEL_LINK:"TEL_LINK",GO_TO_STORE:"GO_TO_STORE",GO_TO_STORE_LINK:"GO_TO_STORE_LINK",GO_TO_PAGE:"GO_TO_PAGE",GO_TO_CATEGORY:"GO_TO_CATEGORY"};function X(e){if("tileId"in e)return e.tileId;if("tileIdForScroll"in e)return e.tileIdForScroll}function Y(e){if("pageId"in e)return e.pageId;if("pageIdForNavigate"in e)return e.pageIdForNavigate}function V(e){if("pageUrl"in e)return e.pageUrl;switch(Y(e)){case"products":return"/products";case"cart":return"/cart";case"account":return"/account";case"search":return"/search";case"home":default:return"/"}}const L=(e,n)=>{if(!e||n)return;const{type:t,link:o,email:l,phone:r}=e,a=V(e);switch(t){case E.HYPER_LINK:if(o)return()=>window.open(o,"_blank");break;case E.GO_TO_STORE:case E.GO_TO_STORE_LINK:return()=>window.open("/products","_self");case E.MAIL_LINK:if(l)return()=>window.open(`mailto:${l}`,"_self");break;case E.TEL_LINK:if(r)return()=>window.open(`tel:${r}`,"_self");break;case E.SCROLL_TO_TILE:if(typeof document<"u")return()=>{const v=X(e);document.getElementById(`tile-${v}`)?.scrollIntoView()};break;case E.GO_TO_PAGE:if(a)return()=>window.open(a,"_self");break;default:console.error(`Unknown type of ActionLink: ${t}`)}};function H(e){return"title"in e&&"type"in e}function j(e,n,t){const o=i(()=>{const _=e.value[n];if(_!==void 0){if(H(_))return _;throw new Error(`Element ${n} is not action link`)}}),l=i(()=>o.value?.title),r=i(()=>o.value?.type),a=i(()=>o.value?.link),v=i(()=>o.value?.email),g=i(()=>o.value?.phone),s=i(()=>o.value?.tileId?`tile-${o.value?.tileId}`:null),u=i(()=>o.value?.type==="GO_TO_STORE_LINK"?"products":o.value?.pageId),f=i(()=>o.value?.pageUrl),m=i(()=>!!l.value),$=i(()=>!!a.value),P=L(o.value,t);return d({title:l,type:r,link:a,email:v,phone:g,tileDivId:s,pageId:u,pageUrl:f,hasTitle:m,hasLink:$,performAction:P})}function h(e,n){const t=c(),o=i(()=>!!t.site?.value?.isPreviewMode),l=i(()=>n!==void 0?n:t.content.value!==void 0?t.content.value:{});return j(l,e,o.value)}function J(e){return"bucket"in e&&"borderInfo"in e&&"set"in e}function T(e,n){const t=new RegExp(/^https?:\/\//);return e!=null&&t.test(e)?e:`${n}/${e}`}function D(e,n){const t=c(),o=i(()=>n!==void 0?n:t.content.value);return q(o,e)}function q(e,n){const t=i(()=>{const s=e.value[n];if(s!==void 0){if(J(s))return s;throw new Error(`Element ${n} is not image`)}}),o=i(()=>t.value===void 0?"":c().context.value.imageBuckets?.[t.value?.bucket]),l=i(()=>t.value!==void 0),r=i(()=>T(t.value?.set?.["cropped-webp-100x200"]?.url,o.value)),a=i(()=>T(t.value?.set?.["cropped-webp-1000x2000"]?.url,o.value)),v=i(()=>T(t.value?.set?.["webp-200x200"]?.url,o.value)),g=i(()=>T(t.value?.set?.["webp-2000x2000"]?.url,o.value));return d({hasContent:l,lowResolutionMobileImage:r,highResolutionMobileImage:a,lowResolutionDesktopImage:v,highResolutionDesktopImage:g})}function Q(e){return"enabled"in e}function A(e,n){const t=c(),o=i(()=>n!==void 0?n:t.content.value);return Z(o,e)}function Z(e,n){const t=i(()=>{const r=e.value[n];if(r!==void 0){if(Q(r))return r;throw new Error(`Element ${n} is not toggle`)}}),o=i(()=>t.value!==void 0),l=i(()=>t.value?.enabled);return d({hasContent:o,value:l})}function S(e,n){const t=c(),o=i(()=>n!==void 0?n:t.content.value);return ee(o,e)}function ee(e,n){const t=i(()=>{const r=e.value[n];if(r!==void 0){if(typeof r=="string")return r;throw new Error(`Element ${n} is not selectbox`)}}),o=i(()=>t.value!==void 0),l=i(()=>t.value);return d({hasContent:o,value:l})}function te(e){return e!==null&&"items"in e}function x(e){const n=c(),t=i(()=>{const a=n.content.value[e];if(a!==void 0){if(te(a))return a;throw new Error(`Element ${e} is not an menu`)}}),o=i(()=>!!n.site?.value?.isPreviewMode),l=i(()=>t.value!==void 0),r=i(()=>t.value?.items?t.value.items.map(a=>({...a,performAction:L(a,o.value)})):[]);return d({hasContent:l,items:r})}const ne="menu";function oe(){return x(ne)}var k=(e=>(e.INPUTBOX="INPUTBOX",e.TEXTAREA="TEXTAREA",e.BUTTON="BUTTON",e.IMAGE="IMAGE",e.TOGGLE="TOGGLE",e.SELECTBOX="SELECTBOX",e))(k||{});function ie(e){if(typeof e!="object"||e===null)return!1;const n=e;return Array.isArray(n.cards)&&n.cards.every(t=>typeof t.settings=="object"&&t.settings!==null)}function le(e){const n=c(),t=i(()=>{const r=n.content.value[e];if(r!==void 0){if(ie(r))return r;throw new Error(`Element ${e} is not of DECK type`)}}),o=i(()=>t.value!==void 0&&t.value.cards.length>0),l=i(()=>t.value?.cards);return d({hasContent:o,cards:l,getReactiveRef:re})}function re(e,n,t){if(e==null)throw Error("Could not get a reactive ref for undefined Card");const o=e.settings[t];if(o===void 0)return o;switch(n){case"TEXTAREA":return C(t,e.settings);case"INPUTBOX":return R(t,e.settings);case"SELECTBOX":return S(t,e.settings);case"IMAGE":return D(t,e.settings);case"TOGGLE":return A(t,e.settings);case"BUTTON":return h(t,e.settings);default:return}}function ae(e){return"type"in e&&("text"in e||"image"in e)}function O(e,n){const t=new RegExp(/^https?:\/\//);return e!==void 0&&t.test(e)?e:`${n}/${e}`}function ue(){const e=c(),n=i(()=>{const a=e.content.value.logo;if(a!==void 0){if(ae(a))return a;throw new Error("Element logo is not LOGO")}}),t=i(()=>n.value?.type),o=i(()=>n.value?.text),l=i(()=>n.value?.image===void 0?"":e.context.value.imageBuckets?.[n.value.image.bucket]),r=i(()=>({lowResolutionMobileImage:O(n.value?.image?.set?.["cropped-webp-100x200"]?.url,l.value),highResolutionMobileImage:O(n.value?.image?.set?.["cropped-webp-1000x2000"]?.url,l.value),lowResolutionDesktopImage:O(n.value?.image?.set?.["webp-200x200"]?.url,l.value),highResolutionDesktopImage:O(n.value?.image?.set?.["webp-2000x2000"]?.url,l.value)}));return d({type:t,text:o,image:r})}function G(e,n){if(n===void 0)return;if(!n.startsWith("global."))return n.replaceAll("_"," ");const t=n.split(".").at(2);if(t!==void 0)return e.fontFamily?e.fontFamily[t].replaceAll("_"," "):void 0}function I(e,n,t){return n?G(e,n):G(e,t)}function N(e,n){if(n===void 0)return;if(typeof n!="string"||!n.startsWith("global."))return n;const t=n.split(".").at(2);if(t!==void 0)return e.textSize?e.textSize[t]:void 0}function y(e,n,t){return n?N(e,n):N(e,t)}function B(e,n){if(n===void 0)return;if(typeof n!="string"||!n.startsWith("global."))return n;const t=n.split(".").at(2);if(t!==void 0)return e.color?e.color[t]:void 0}function p(e,n,t){return n?B(e,n):B(e,t)}function se(e,n,t){return{visible:n?.visible??t?.visible??!1,width:n?.width??t?.width??1,color:p(e,n?.color,t?.color)}}function ce(e){const n=c(),t=i(()=>{const s=n.design.value[e],u=n.defaults.value[e],f=n.globalDesign.value;return{font:I(f,s?.font,u?.font),size:y(f,s?.size,u?.size),bold:s?.bold??u?.bold,italic:s?.italic??u?.italic,color:p(f,s?.color,u?.color),visible:s?.visible??u?.visible??!1}}),o=i(()=>t.value?.font),l=i(()=>t.value?.size),r=i(()=>t.value?.bold),a=i(()=>t.value?.italic),v=i(()=>t.value?.color),g=i(()=>t.value?.visible);return d({font:o,size:l,bold:r,italic:a,color:v,visible:g})}function ve(e){const n=c(),t=i(()=>{const u=n.design.value[e],f=n.defaults.value[e],m=n.globalDesign.value;return{font:I(m,u?.font,f?.font),size:y(m,u?.size,f?.size),bold:u?.bold??f?.bold,italic:u?.italic??f?.italic,color:p(m,u?.color,f?.color),visible:u?.visible??f?.visible??!1,whiteSpace:"pre-wrap"}}),o=i(()=>t.value?.font),l=i(()=>t.value?.size),r=i(()=>t.value?.bold),a=i(()=>t.value?.italic),v=i(()=>t.value?.color),g=i(()=>t.value?.visible),s=i(()=>t.value?.whiteSpace);return d({font:o,size:l,bold:r,italic:a,color:v,visible:g,whiteSpace:s})}function de(e){const n=c(),t=i(()=>{const s=n.design.value[e],u=n.defaults.value[e],f=n.globalDesign.value;return{appearance:s?.appearance??u?.appearance,font:I(f,s?.font,u?.font),size:s?.size??u?.size,style:s?.style??u?.style,color:p(f,s?.color,u?.color),visible:s?.visible??u?.visible??!1}}),o=i(()=>t.value?.appearance),l=i(()=>t.value?.font),r=i(()=>t.value?.size),a=i(()=>t.value?.style),v=i(()=>t.value?.color),g=i(()=>t.value?.visible);return d({appearance:o,font:l,size:r,style:a,color:v,visible:g})}function fe(e){const n=c(),t=i(()=>{const r=n.design.value[e],a=n.defaults.value[e],v=n.globalDesign.value;return{overlay:{type:r?.overlay?.type??a?.overlay?.type,solid:{color:p(v,r?.overlay?.solid?.color,a?.overlay?.solid?.color)},gradient:{fromColor:p(v,r?.overlay?.gradient?.fromColor,a?.overlay?.gradient?.fromColor),toColor:p(v,r?.overlay?.gradient?.toColor,a?.overlay?.gradient?.toColor)}},visible:r?.visible??a?.visible??!1}}),o=i(()=>t.value?.overlay),l=i(()=>t.value?.visible);return d({overlay:o,visible:l})}function ge(e){const n=c(),t=i(()=>{const l=n.design.value[e],r=n.defaults.value[e];return{enabled:l?.enabled??r?.enabled}}),o=i(()=>t.value?.enabled);return d({enabled:o})}function pe(e){const n=c(),t=i(()=>{const l=n.design.value[e],r=n.defaults.value[e];return{value:l?.value??r?.value}}),o=i(()=>t.value?.value);return d({value:o})}function be(e){const n=c(),t=i(()=>{const l=n.design.value[e],r=n.defaults.value[e],a=n.globalDesign.value;return{background:{type:l?.background?.type??r?.background?.type,solid:{color:p(a,l?.background?.solid?.color,r?.background?.solid?.color)},gradient:{fromColor:p(a,l?.background?.gradient?.fromColor,r?.background?.gradient?.fromColor),toColor:p(a,l?.background?.gradient?.toColor,r?.background?.gradient?.toColor)}}}}),o=i(()=>t.value?.background);return d({background:o})}function Ee(){const e=c(),n=i(()=>e.design.value.layout),t=i(()=>n.value);return d({layout:t})}function me(){const e=c();return i(()=>{const n=e.design.value.logo,t=e.defaults.value.logo,o=e.globalDesign.value;return{font:I(o,n?.font,t?.font),size:y(o,n?.size,t?.size),bold:n?.bold??t?.bold,italic:n?.italic??t?.italic,color:p(o,n?.color,t?.color),visible:n?.visible??t?.visible??!1,spacing:n?.spacing??t?.spacing??0,capitalization:n?.capitalization??t?.capitalization??"none",frame:se(o,n?.frame,t?.frame)}})}function z(e){return{app:U(e)}}function Te(e,n){return{init:()=>{const{app:t}=z(e);return n?.init?.(t),{render:async(o,l)=>(c().init(t,o,l.content,l.design,l.defaults,l.externalContent,o.globalDesign),n?.render?.(t,o,l),{html:await K(t,{context:o}),state:{context:o,data:l}})}}}}function Oe(e,n){return{init:()=>{const{app:t}=z(e);return n?.init?.(t),{mount:(o,l)=>{c().init(t,l.context,l.data.content,l.data.design,l.data.defaults,l.data.externalContent,l.context.globalDesign),n?.mount?.(t,o,l),t.mount(o)},update:o=>{c().update(t,o.data.content,o.data.design,o.data.defaults,o.data.externalContent,o.context.globalDesign),n?.update?.(t,o)},unmount:()=>{n?.unmount?.(t),t.unmount()}}}}}function Ie(){return globalThis.window.instantsite}const _e={PRODUCT_LIST:"CONTROLS",BOTTOM_BAR:"FOOTER"},we={CATEGORY_TITLE:"MAIN_TITLE",PRODUCT_LIST:"CONTROLS",BOTTOM_BAR:"FOOTER"},ye={TOP_BAR:"TOP_BAR",GALLERY:"GALLERY",SIDEBAR:"SIDEBAR",DESCRIPTION:"DESCRIPTION",REVIEW_LIST:"REVIEW_LIST",RELATED_PRODUCTS:"RELATED_PRODUCTS",BOTTOM_BAR:"FOOTER"};export{_e as CatalogLayoutSlot,we as CategoryLayoutSlot,k as EditorTypes,ye as ProductLayoutSlot,Oe as createVueClientApp,Te as createVueServerApp,be as useBackgroundElementDesign,h as useButtonElementContent,de as useButtonElementDesign,le as useDeckElementContent,D as useImageElementContent,fe as useImageElementDesign,R as useInputboxElementContent,Ie as useInstantsiteJsApi,Ee as useLayoutElementDesign,ue as useLogoElementContent,me as useLogoElementDesign,x as useMenuElementContent,oe as useNavigationMenuElementContent,S as useSelectboxElementContent,pe as useSelectboxElementDesign,ce as useTextElementDesign,C as useTextareaElementContent,ve as useTextareaElementDesign,A as useToggleElementContent,ge as useToggleElementDesign,c as useVueBaseProps};