@lightspeed/crane 1.2.0 → 1.2.2
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/CHANGELOG.md +198 -0
- package/README.md +11 -0
- package/UPGRADE.md +30 -0
- package/bin/crane.js +3 -1
- package/dist/app.d.mts +79 -13
- package/dist/app.d.ts +79 -13
- package/dist/app.mjs +1 -1
- package/dist/cli.d.mts +2 -1
- package/dist/cli.d.ts +2 -1
- package/dist/cli.mjs +8 -10
- package/package.json +11 -8
- package/template/eslint.config.cjs +1 -0
- package/template/footers/example-footer/component/MadeWith.vue +1 -1
- package/template/headers/example-header/showcases/2.ts +1 -1
- package/template/package.json +4 -7
- package/template/page-templates/assets/template_cover_image.png +0 -0
- package/template/page-templates/example-template/configuration.ts +22 -0
- package/template/page-templates/example-template/pages/catalog.ts +8 -0
- package/template/page-templates/example-template/pages/category.ts +8 -0
- package/template/page-templates/example-template/pages/home.ts +178 -0
- package/template/page-templates/example-template/pages/product.ts +8 -0
- package/template/reference/sections/about-us/settings/content.ts +4 -7
- package/template/reference/sections/about-us/showcases/1.ts +0 -3
- package/template/reference/sections/about-us/showcases/2.ts +0 -3
- package/template/reference/sections/intro-slider/assets/category_4.jpg +0 -0
- package/template/reference/sections/intro-slider/assets/category_4@2x.jpg +0 -0
- package/template/reference/sections/intro-slider/settings/content.ts +1 -0
- package/template/reference/sections/intro-slider/showcases/1.ts +0 -18
- package/template/reference/sections/intro-slider/showcases/2.ts +0 -18
- package/template/reference/sections/tag-lines/settings/content.ts +1 -0
- package/template/reference/sections/tag-lines/showcases/1.ts +0 -12
- package/template/reference/sections/tag-lines/showcases/2.ts +0 -12
- package/template/sections/example-section/settings/content.ts +4 -4
- package/template/sections/example-section/settings/design.ts +4 -0
- package/template/sections/example-section/showcases/1.ts +0 -12
- package/template/sections/example-section/showcases/2.ts +0 -12
- package/template/sections/example-section/showcases/3.ts +0 -12
- package/template/templates/template.ts +0 -12
- package/types.d.ts +15 -8
- package/template/.eslintrc.cjs +0 -3
package/CHANGELOG.md
ADDED
|
@@ -0,0 +1,198 @@
|
|
|
1
|
+
# Changelog
|
|
2
|
+
|
|
3
|
+
## 1.2.2 - 2025-05-12
|
|
4
|
+
|
|
5
|
+
_If you are upgrading: please see [UPGRADE.md](UPGRADE.md)._
|
|
6
|
+
|
|
7
|
+
### Added
|
|
8
|
+
|
|
9
|
+
- **Storefront (experimental):** add multipage support for Custom Templates.
|
|
10
|
+
- Add image validation for custom section and template configuration files during the 'build' command.
|
|
11
|
+
- Provide icon URL for 'Made With' component through the external content.
|
|
12
|
+
|
|
13
|
+
### Changed
|
|
14
|
+
|
|
15
|
+
- **Breaking:** Change minimal supported Node.js version to 22 LTS.
|
|
16
|
+
- **Breaking:** Upgrade ESLint dependency to version 9.
|
|
17
|
+
|
|
18
|
+
### Removed
|
|
19
|
+
|
|
20
|
+
- **Breaking:** Remove unused image resolutions from the templating files across all sections.
|
|
21
|
+
|
|
22
|
+
## 1.2.1 - 2025-04-17
|
|
23
|
+
|
|
24
|
+
### Added
|
|
25
|
+
|
|
26
|
+
- Add support for 'Divider' configuration type for custom sections.
|
|
27
|
+
|
|
28
|
+
### Changed
|
|
29
|
+
|
|
30
|
+
- Update versions of 'unbuild' and 'axios' dependencies.
|
|
31
|
+
- Clean up unused package dependencies for the reference custom section.
|
|
32
|
+
|
|
33
|
+
### Fixed
|
|
34
|
+
|
|
35
|
+
- Fix preview image name of the example header.
|
|
36
|
+
- Fix reference custom section to respect the global design configurations.
|
|
37
|
+
- Display CLI help instructions consistently.
|
|
38
|
+
|
|
39
|
+
## 1.2.0 - 2025-03-07
|
|
40
|
+
|
|
41
|
+
### Added
|
|
42
|
+
|
|
43
|
+
- **Breaking:** Add a maximum server file size restriction during 'build' execution.
|
|
44
|
+
- Move 'header & footer' functionality from experimental to the core feature list.
|
|
45
|
+
- Add usage example of all the missing available configuration types to the reference section.
|
|
46
|
+
- Add compressed source code bundle to 'deployment' process.
|
|
47
|
+
|
|
48
|
+
### Changed
|
|
49
|
+
|
|
50
|
+
- Update error message display upon asset deployment to be more descriptive.
|
|
51
|
+
|
|
52
|
+
### Fixed
|
|
53
|
+
|
|
54
|
+
- Fix 'shared' folder generation while creating sections, headers and footers.
|
|
55
|
+
- Fix section showcase validation during the 'build' execution in case of empty content and design configurations.
|
|
56
|
+
- Fix validation rules around newly generated section, header and footer.
|
|
57
|
+
- Fix the external content usage of the 'Language Selector' component in headers and footers.
|
|
58
|
+
|
|
59
|
+
## 1.1.3 - 2025-02-03
|
|
60
|
+
|
|
61
|
+
### Added
|
|
62
|
+
|
|
63
|
+
- **Header & Footer (experimental):** add support for 'Made With' component in footers.
|
|
64
|
+
- **Header & Footer (experimental):** add validation to custom header and footer setting files during 'build' execution.
|
|
65
|
+
- **Header & Footer (experimental):** add individual header and footer resource initialisation to the CLI options.
|
|
66
|
+
- **Header & Footer (experimental):** add support for external content for headers and footers.
|
|
67
|
+
- **Header & Footer (experimental):** implement mandatory content settings for custom headers and footers.
|
|
68
|
+
- Add validation to custom section setting files during 'build' execution.
|
|
69
|
+
- Add two new reference custom templates.
|
|
70
|
+
|
|
71
|
+
### Changed
|
|
72
|
+
|
|
73
|
+
- Update progress bar for deployment to monitor upload speed.
|
|
74
|
+
- Make externalization default during 'build' process.
|
|
75
|
+
- Enhance client-side performance by enabling code splitting.
|
|
76
|
+
- Improve 'BUTTON' configuration type's interface.
|
|
77
|
+
|
|
78
|
+
### Fixed
|
|
79
|
+
|
|
80
|
+
- **Header & Footer (experimental):** fix showcase URL for headers and footers.
|
|
81
|
+
- Fix the need to manually install 'vite:terser' as a dependency for the 'build' process.
|
|
82
|
+
- Fix template name prompt for names containing numbers.
|
|
83
|
+
- Fix 'BUTTON' configuration type validation during 'build'.
|
|
84
|
+
|
|
85
|
+
## 1.1.2 - 2025-01-09
|
|
86
|
+
|
|
87
|
+
### Added
|
|
88
|
+
|
|
89
|
+
- **Header & Footer (experimental):** add support for 'Language Selector' component in headers and footers.
|
|
90
|
+
- **Header & Footer (experimental):** add support for 'Logo' component in headers.
|
|
91
|
+
- **Header & Footer (experimental):** add support for 'Navigation' component in headers.
|
|
92
|
+
- **Header & Footer (experimental):** add support for 'Account' component in headers.
|
|
93
|
+
- **Header & Footer (experimental):** add support for 'Legal Pages' component in footers.
|
|
94
|
+
|
|
95
|
+
### Fixed
|
|
96
|
+
|
|
97
|
+
- Fix showcase overrides for images in case of the 'DECK' configuration element.
|
|
98
|
+
|
|
99
|
+
## 1.1.1 - 2024-12-10
|
|
100
|
+
|
|
101
|
+
### Added
|
|
102
|
+
|
|
103
|
+
- **Header & Footer (experimental):** add support for 'Report Abuse' component in footers.
|
|
104
|
+
- **Header & Footer (experimental):** add support for 'Cart' component in headers.
|
|
105
|
+
- **Header & Footer (experimental):** add support for 'Search' component in headers.
|
|
106
|
+
- **Header & Footer (experimental):** include header and footer generation in template initialisation.
|
|
107
|
+
- Add compression and minification to 'build' process.
|
|
108
|
+
- Add new 'DECK' configuration element to custom sections.
|
|
109
|
+
|
|
110
|
+
### Fixed
|
|
111
|
+
|
|
112
|
+
- Fix 'BUTTON' configuration element with 'GO_TO_PAGE' type.
|
|
113
|
+
|
|
114
|
+
## 1.1.0 - 2024-11-07
|
|
115
|
+
|
|
116
|
+
### Added
|
|
117
|
+
|
|
118
|
+
- **Header & Footer (experimental):** add skeleton folder structure for custom reference header and footer.
|
|
119
|
+
- Perform a clean operation of the 'dist' folder during the 'build' command.
|
|
120
|
+
- Add support for deployment of high number of sections at one time.
|
|
121
|
+
- Add a progress bar for the deployment process.
|
|
122
|
+
- Add retry mechanism for recoverable errors during the section deployment.
|
|
123
|
+
- Update template descriptor to include optional showcase ID.
|
|
124
|
+
- Add optional custom template url to use for template previews.
|
|
125
|
+
- Add optional showcase overrides to template descriptor.
|
|
126
|
+
|
|
127
|
+
### Changed
|
|
128
|
+
|
|
129
|
+
- Update section validation to make layout descriptor file optional.
|
|
130
|
+
- Change error message display upon failed deployment.
|
|
131
|
+
|
|
132
|
+
### Fixed
|
|
133
|
+
|
|
134
|
+
- Update failed command executions to return the proper exit code.
|
|
135
|
+
|
|
136
|
+
## 1.0.3 - 2024-09-24
|
|
137
|
+
|
|
138
|
+
### Added
|
|
139
|
+
|
|
140
|
+
- Add Layout support.
|
|
141
|
+
|
|
142
|
+
### Fixed
|
|
143
|
+
|
|
144
|
+
- Apply line breaks and multiple spaces to 'TEXTAREA' types.
|
|
145
|
+
|
|
146
|
+
## 1.0.2 - 2024-09-12
|
|
147
|
+
|
|
148
|
+
### Added
|
|
149
|
+
|
|
150
|
+
- Add the possibility to specify a cover image for the created templates.
|
|
151
|
+
- Add 'test_site_id' to the template descriptor.
|
|
152
|
+
- Impose file size restriction during build execution.
|
|
153
|
+
|
|
154
|
+
### Changed
|
|
155
|
+
|
|
156
|
+
- Update 'build' and 'deploy' flows to include the template assets.
|
|
157
|
+
|
|
158
|
+
### Fixed
|
|
159
|
+
|
|
160
|
+
- Fix logic regarding determining correct 'BUTTON' type.
|
|
161
|
+
- Fix deployment on Windows machines.
|
|
162
|
+
|
|
163
|
+
## 1.0.1 - 2024-08-08
|
|
164
|
+
|
|
165
|
+
### Added
|
|
166
|
+
|
|
167
|
+
- Add font support for design configurations.
|
|
168
|
+
- Clean 'dist' folder before every 'build' command execution.
|
|
169
|
+
- Add licensing.
|
|
170
|
+
|
|
171
|
+
### Fixed
|
|
172
|
+
|
|
173
|
+
- Fix handling of thumbnails for reference custom section.
|
|
174
|
+
- Fix version increment in case of failed deployment.
|
|
175
|
+
- Fix application creation with same name to avoid overriding an existing version.
|
|
176
|
+
|
|
177
|
+
## 1.0.0 - 2024-07-29
|
|
178
|
+
|
|
179
|
+
### Added
|
|
180
|
+
|
|
181
|
+
- Add reference section for third party developers.
|
|
182
|
+
|
|
183
|
+
## 0.1.1 - 2024-07-22
|
|
184
|
+
|
|
185
|
+
### Added
|
|
186
|
+
|
|
187
|
+
- Include a README.md file.
|
|
188
|
+
|
|
189
|
+
## 0.1.0 - 2024-07-22
|
|
190
|
+
|
|
191
|
+
### Changed
|
|
192
|
+
|
|
193
|
+
- Include template descriptor in 'deploy' command.
|
|
194
|
+
- Standardize CLI commands.
|
|
195
|
+
|
|
196
|
+
## 0.0.1-beta.24 - 2024-05-13
|
|
197
|
+
|
|
198
|
+
_Last beta release._
|
package/README.md
CHANGED
|
@@ -22,6 +22,10 @@ permissions granted, as well as an optional test site in order to verify the cha
|
|
|
22
22
|
|
|
23
23
|
```For both the test site and the permission, please contact your Partner Manager!```
|
|
24
24
|
|
|
25
|
+
### Recommended Node.js Version
|
|
26
|
+
|
|
27
|
+
For the best compatibility and performance, it is recommended to use **Node.js 22.x**
|
|
28
|
+
|
|
25
29
|
### Installation
|
|
26
30
|
|
|
27
31
|
The following commands need to be performed to install the required dependencies and Crane utility, along with our linter:
|
|
@@ -111,3 +115,10 @@ npm install
|
|
|
111
115
|
|
|
112
116
|
3. HTTP 403 during deployment:
|
|
113
117
|
Insufficient permissions, please contact your Partner Manager regarding the necessary permissions.
|
|
118
|
+
|
|
119
|
+
### More information
|
|
120
|
+
|
|
121
|
+
For more information regarding the notable changes for each versioned release and the upgrade guide, please refer to the following files:
|
|
122
|
+
|
|
123
|
+
- [CHANGELOG](CHANGELOG.md)
|
|
124
|
+
- [UPGRADE](UPGRADE.md)
|
package/UPGRADE.md
ADDED
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
# Upgrades
|
|
2
|
+
|
|
3
|
+
## 1.2.1 to 1.2.2
|
|
4
|
+
|
|
5
|
+
### Node.js Version Upgrade
|
|
6
|
+
|
|
7
|
+
The required Node.js version has been updated from **20 LTS** to **22 LTS**.
|
|
8
|
+
Ensure that your environment is running Node.js 22 LTS to maintain compatibility with the latest dependencies.
|
|
9
|
+
|
|
10
|
+
### Restriction on Image Resolutions
|
|
11
|
+
|
|
12
|
+
As of this update, a new limitation on the types of image resolutions that can be uploaded has been added.
|
|
13
|
+
The build will fail if any resolutions other than the ones specified below are used:
|
|
14
|
+
|
|
15
|
+
- **MOBILE_WEBP_HI_RES**: 1000px x 2000px
|
|
16
|
+
- **WEBP_LOW_RES**: 200px x 200px
|
|
17
|
+
- **WEBP_HI_2X_RES**: 2000px x 2000px
|
|
18
|
+
- **MOBILE_WEBP_LOW_RES**: 100px x 200px
|
|
19
|
+
- **ORIGINAL**: The original version of the image, not resized.
|
|
20
|
+
|
|
21
|
+
Ensure that all images conform to these resolutions to prevent build failures.
|
|
22
|
+
|
|
23
|
+
### ESLint upgrade from 8 to 9
|
|
24
|
+
|
|
25
|
+
1. Create a file named ```eslint.config.cjs``` in custom app root directory.
|
|
26
|
+
2. Add the following content to the file:
|
|
27
|
+
```js
|
|
28
|
+
module.exports = require('@lightspeed/eslint-config-crane');
|
|
29
|
+
```
|
|
30
|
+
3. Remove existing ```.eslintrc.cjs``` file
|
package/bin/crane.js
CHANGED
package/dist/app.d.mts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as vue from 'vue';
|
|
2
|
-
import {
|
|
2
|
+
import type { Ref, App, Component } from 'vue';
|
|
3
3
|
|
|
4
4
|
interface AppBaseContext {
|
|
5
5
|
readonly appName: string;
|
|
@@ -20,14 +20,53 @@ interface AppBaseState<C, D> {
|
|
|
20
20
|
readonly data: AppBaseData<C, D>;
|
|
21
21
|
}
|
|
22
22
|
|
|
23
|
+
interface GlobalColors {
|
|
24
|
+
title?: Color;
|
|
25
|
+
body?: Color;
|
|
26
|
+
button?: Color;
|
|
27
|
+
link?: Color;
|
|
28
|
+
background?: Color;
|
|
29
|
+
}
|
|
30
|
+
interface GlobalFonts {
|
|
31
|
+
title: string;
|
|
32
|
+
body: string;
|
|
33
|
+
}
|
|
34
|
+
interface GlobalTextSize {
|
|
35
|
+
title: number;
|
|
36
|
+
subtitle: number;
|
|
37
|
+
body: number;
|
|
38
|
+
}
|
|
39
|
+
interface GlobalButtonSize {
|
|
40
|
+
small: number;
|
|
41
|
+
medium: number;
|
|
42
|
+
large: number;
|
|
43
|
+
}
|
|
44
|
+
type AppearanceEffectType = 'none' | 'fade-in' | 'fade-in-up';
|
|
45
|
+
interface GlobalLayout {
|
|
46
|
+
maxWidth: number;
|
|
47
|
+
tileMargin: number;
|
|
48
|
+
appearanceEffect: AppearanceEffectType;
|
|
49
|
+
}
|
|
50
|
+
interface GlobalDesign {
|
|
51
|
+
color?: GlobalColors;
|
|
52
|
+
fontFamily?: GlobalFonts;
|
|
53
|
+
textSize?: GlobalTextSize;
|
|
54
|
+
buttonSize?: GlobalButtonSize;
|
|
55
|
+
layout?: GlobalLayout;
|
|
56
|
+
customCss?: string;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
|
|
60
|
+
|
|
23
61
|
interface VueBaseProps<CONTENT, DESIGN> {
|
|
24
|
-
init: (app: App<Element>, contextValue: AppBaseContext, contentValue: CONTENT, designValue: DESIGN, defaultsValue: Record<string, unknown>, externalContent: ExternalContentData) => void;
|
|
25
|
-
update: (app: App<Element>, contentValue: CONTENT, designValue: DESIGN, defaultsValue: Record<string, unknown>, externalContent: ExternalContentData) => void;
|
|
62
|
+
init: (app: App<Element>, contextValue: AppBaseContext, contentValue: CONTENT, designValue: DESIGN, defaultsValue: Record<string, unknown>, externalContent: ExternalContentData, globalDesignValue: GlobalDesign) => void;
|
|
63
|
+
update: (app: App<Element>, contentValue: CONTENT, designValue: DESIGN, defaultsValue: Record<string, unknown>, externalContent: ExternalContentData, globalDesignValue: GlobalDesign) => void;
|
|
26
64
|
readonly context: Ref<AppBaseContext>;
|
|
27
65
|
readonly content: Ref<CONTENT>;
|
|
28
66
|
readonly design: Ref<DESIGN>;
|
|
29
67
|
readonly defaults: Ref<Record<string, unknown>>;
|
|
30
68
|
readonly site: Ref<SiteContent>;
|
|
69
|
+
readonly globalDesign: Ref<GlobalDesign>;
|
|
31
70
|
}
|
|
32
71
|
declare function useVueBaseProps<CONTENT, DESIGN>(): VueBaseProps<CONTENT, DESIGN>;
|
|
33
72
|
|
|
@@ -168,6 +207,15 @@ declare function useDeckElementContent<CONTENT>(elementName: keyof CONTENT): {
|
|
|
168
207
|
declare function getReactiveRef(card: Card | undefined, editorType: EditorTypes, contentElementName: string): {
|
|
169
208
|
hasContent: boolean;
|
|
170
209
|
value: string | undefined;
|
|
210
|
+
} | {
|
|
211
|
+
hasContent: boolean;
|
|
212
|
+
lowResolutionMobileImage: string;
|
|
213
|
+
highResolutionMobileImage: string;
|
|
214
|
+
lowResolutionDesktopImage: string;
|
|
215
|
+
highResolutionDesktopImage: string;
|
|
216
|
+
} | {
|
|
217
|
+
hasContent: boolean;
|
|
218
|
+
value: boolean | undefined;
|
|
171
219
|
} | {
|
|
172
220
|
title: string | undefined;
|
|
173
221
|
type: ActionLinkType | undefined;
|
|
@@ -180,15 +228,6 @@ declare function getReactiveRef(card: Card | undefined, editorType: EditorTypes,
|
|
|
180
228
|
hasTitle: boolean;
|
|
181
229
|
hasLink: boolean;
|
|
182
230
|
performAction: (() => void) | undefined;
|
|
183
|
-
} | {
|
|
184
|
-
hasContent: boolean;
|
|
185
|
-
lowResolutionMobileImage: string;
|
|
186
|
-
highResolutionMobileImage: string;
|
|
187
|
-
lowResolutionDesktopImage: string;
|
|
188
|
-
highResolutionDesktopImage: string;
|
|
189
|
-
} | {
|
|
190
|
-
hasContent: boolean;
|
|
191
|
-
value: boolean | undefined;
|
|
192
231
|
} | undefined;
|
|
193
232
|
|
|
194
233
|
declare function useLogoElementContent<CONTENT>(): {
|
|
@@ -202,6 +241,15 @@ declare function useLogoElementContent<CONTENT>(): {
|
|
|
202
241
|
};
|
|
203
242
|
};
|
|
204
243
|
|
|
244
|
+
|
|
245
|
+
|
|
246
|
+
|
|
247
|
+
|
|
248
|
+
|
|
249
|
+
|
|
250
|
+
|
|
251
|
+
|
|
252
|
+
|
|
205
253
|
declare function useTextElementDesign<DESIGN>(elementName: keyof DESIGN): {
|
|
206
254
|
font: string | undefined;
|
|
207
255
|
size: number | GlobalTextSizeString | undefined;
|
|
@@ -253,6 +301,10 @@ declare function useLayoutElementDesign(): {
|
|
|
253
301
|
|
|
254
302
|
declare function useLogoElementDesign<DESIGN>(): vue.ComputedRef<LogoDesignData>;
|
|
255
303
|
|
|
304
|
+
|
|
305
|
+
|
|
306
|
+
|
|
307
|
+
|
|
256
308
|
interface VueServerAppExtensions {
|
|
257
309
|
init?: (app: App<Element>) => void;
|
|
258
310
|
render?: <C, D>(app: App<Element>, context: AppBaseContext, data: AppBaseData<C, D>) => void;
|
|
@@ -267,6 +319,10 @@ declare function createVueServerApp<C, D>(appComponent: Component, extensions?:
|
|
|
267
319
|
};
|
|
268
320
|
};
|
|
269
321
|
|
|
322
|
+
|
|
323
|
+
|
|
324
|
+
|
|
325
|
+
|
|
270
326
|
interface VueClientAppExtensions {
|
|
271
327
|
init?: (app: App<Element>) => void;
|
|
272
328
|
mount?: <C, D, S extends AppBaseState<C, D>>(app: App<Element>, rootContainer: string, state: S) => void;
|
|
@@ -346,4 +402,14 @@ interface InstantsiteJSAPI {
|
|
|
346
402
|
|
|
347
403
|
declare function useInstantsiteJsApi(): InstantsiteJSAPI | undefined;
|
|
348
404
|
|
|
349
|
-
|
|
405
|
+
|
|
406
|
+
|
|
407
|
+
|
|
408
|
+
|
|
409
|
+
|
|
410
|
+
|
|
411
|
+
|
|
412
|
+
|
|
413
|
+
|
|
414
|
+
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 };
|
|
415
|
+
export type { ButtonContent, Card, Deck, ImageContent, InputBoxContent, SelectBoxContent, TextAreaContent, ToggleContent };
|
package/dist/app.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as vue from 'vue';
|
|
2
|
-
import {
|
|
2
|
+
import type { Ref, App, Component } from 'vue';
|
|
3
3
|
|
|
4
4
|
interface AppBaseContext {
|
|
5
5
|
readonly appName: string;
|
|
@@ -20,14 +20,53 @@ interface AppBaseState<C, D> {
|
|
|
20
20
|
readonly data: AppBaseData<C, D>;
|
|
21
21
|
}
|
|
22
22
|
|
|
23
|
+
interface GlobalColors {
|
|
24
|
+
title?: Color;
|
|
25
|
+
body?: Color;
|
|
26
|
+
button?: Color;
|
|
27
|
+
link?: Color;
|
|
28
|
+
background?: Color;
|
|
29
|
+
}
|
|
30
|
+
interface GlobalFonts {
|
|
31
|
+
title: string;
|
|
32
|
+
body: string;
|
|
33
|
+
}
|
|
34
|
+
interface GlobalTextSize {
|
|
35
|
+
title: number;
|
|
36
|
+
subtitle: number;
|
|
37
|
+
body: number;
|
|
38
|
+
}
|
|
39
|
+
interface GlobalButtonSize {
|
|
40
|
+
small: number;
|
|
41
|
+
medium: number;
|
|
42
|
+
large: number;
|
|
43
|
+
}
|
|
44
|
+
type AppearanceEffectType = 'none' | 'fade-in' | 'fade-in-up';
|
|
45
|
+
interface GlobalLayout {
|
|
46
|
+
maxWidth: number;
|
|
47
|
+
tileMargin: number;
|
|
48
|
+
appearanceEffect: AppearanceEffectType;
|
|
49
|
+
}
|
|
50
|
+
interface GlobalDesign {
|
|
51
|
+
color?: GlobalColors;
|
|
52
|
+
fontFamily?: GlobalFonts;
|
|
53
|
+
textSize?: GlobalTextSize;
|
|
54
|
+
buttonSize?: GlobalButtonSize;
|
|
55
|
+
layout?: GlobalLayout;
|
|
56
|
+
customCss?: string;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
|
|
60
|
+
|
|
23
61
|
interface VueBaseProps<CONTENT, DESIGN> {
|
|
24
|
-
init: (app: App<Element>, contextValue: AppBaseContext, contentValue: CONTENT, designValue: DESIGN, defaultsValue: Record<string, unknown>, externalContent: ExternalContentData) => void;
|
|
25
|
-
update: (app: App<Element>, contentValue: CONTENT, designValue: DESIGN, defaultsValue: Record<string, unknown>, externalContent: ExternalContentData) => void;
|
|
62
|
+
init: (app: App<Element>, contextValue: AppBaseContext, contentValue: CONTENT, designValue: DESIGN, defaultsValue: Record<string, unknown>, externalContent: ExternalContentData, globalDesignValue: GlobalDesign) => void;
|
|
63
|
+
update: (app: App<Element>, contentValue: CONTENT, designValue: DESIGN, defaultsValue: Record<string, unknown>, externalContent: ExternalContentData, globalDesignValue: GlobalDesign) => void;
|
|
26
64
|
readonly context: Ref<AppBaseContext>;
|
|
27
65
|
readonly content: Ref<CONTENT>;
|
|
28
66
|
readonly design: Ref<DESIGN>;
|
|
29
67
|
readonly defaults: Ref<Record<string, unknown>>;
|
|
30
68
|
readonly site: Ref<SiteContent>;
|
|
69
|
+
readonly globalDesign: Ref<GlobalDesign>;
|
|
31
70
|
}
|
|
32
71
|
declare function useVueBaseProps<CONTENT, DESIGN>(): VueBaseProps<CONTENT, DESIGN>;
|
|
33
72
|
|
|
@@ -168,6 +207,15 @@ declare function useDeckElementContent<CONTENT>(elementName: keyof CONTENT): {
|
|
|
168
207
|
declare function getReactiveRef(card: Card | undefined, editorType: EditorTypes, contentElementName: string): {
|
|
169
208
|
hasContent: boolean;
|
|
170
209
|
value: string | undefined;
|
|
210
|
+
} | {
|
|
211
|
+
hasContent: boolean;
|
|
212
|
+
lowResolutionMobileImage: string;
|
|
213
|
+
highResolutionMobileImage: string;
|
|
214
|
+
lowResolutionDesktopImage: string;
|
|
215
|
+
highResolutionDesktopImage: string;
|
|
216
|
+
} | {
|
|
217
|
+
hasContent: boolean;
|
|
218
|
+
value: boolean | undefined;
|
|
171
219
|
} | {
|
|
172
220
|
title: string | undefined;
|
|
173
221
|
type: ActionLinkType | undefined;
|
|
@@ -180,15 +228,6 @@ declare function getReactiveRef(card: Card | undefined, editorType: EditorTypes,
|
|
|
180
228
|
hasTitle: boolean;
|
|
181
229
|
hasLink: boolean;
|
|
182
230
|
performAction: (() => void) | undefined;
|
|
183
|
-
} | {
|
|
184
|
-
hasContent: boolean;
|
|
185
|
-
lowResolutionMobileImage: string;
|
|
186
|
-
highResolutionMobileImage: string;
|
|
187
|
-
lowResolutionDesktopImage: string;
|
|
188
|
-
highResolutionDesktopImage: string;
|
|
189
|
-
} | {
|
|
190
|
-
hasContent: boolean;
|
|
191
|
-
value: boolean | undefined;
|
|
192
231
|
} | undefined;
|
|
193
232
|
|
|
194
233
|
declare function useLogoElementContent<CONTENT>(): {
|
|
@@ -202,6 +241,15 @@ declare function useLogoElementContent<CONTENT>(): {
|
|
|
202
241
|
};
|
|
203
242
|
};
|
|
204
243
|
|
|
244
|
+
|
|
245
|
+
|
|
246
|
+
|
|
247
|
+
|
|
248
|
+
|
|
249
|
+
|
|
250
|
+
|
|
251
|
+
|
|
252
|
+
|
|
205
253
|
declare function useTextElementDesign<DESIGN>(elementName: keyof DESIGN): {
|
|
206
254
|
font: string | undefined;
|
|
207
255
|
size: number | GlobalTextSizeString | undefined;
|
|
@@ -253,6 +301,10 @@ declare function useLayoutElementDesign(): {
|
|
|
253
301
|
|
|
254
302
|
declare function useLogoElementDesign<DESIGN>(): vue.ComputedRef<LogoDesignData>;
|
|
255
303
|
|
|
304
|
+
|
|
305
|
+
|
|
306
|
+
|
|
307
|
+
|
|
256
308
|
interface VueServerAppExtensions {
|
|
257
309
|
init?: (app: App<Element>) => void;
|
|
258
310
|
render?: <C, D>(app: App<Element>, context: AppBaseContext, data: AppBaseData<C, D>) => void;
|
|
@@ -267,6 +319,10 @@ declare function createVueServerApp<C, D>(appComponent: Component, extensions?:
|
|
|
267
319
|
};
|
|
268
320
|
};
|
|
269
321
|
|
|
322
|
+
|
|
323
|
+
|
|
324
|
+
|
|
325
|
+
|
|
270
326
|
interface VueClientAppExtensions {
|
|
271
327
|
init?: (app: App<Element>) => void;
|
|
272
328
|
mount?: <C, D, S extends AppBaseState<C, D>>(app: App<Element>, rootContainer: string, state: S) => void;
|
|
@@ -346,4 +402,14 @@ interface InstantsiteJSAPI {
|
|
|
346
402
|
|
|
347
403
|
declare function useInstantsiteJsApi(): InstantsiteJSAPI | undefined;
|
|
348
404
|
|
|
349
|
-
|
|
405
|
+
|
|
406
|
+
|
|
407
|
+
|
|
408
|
+
|
|
409
|
+
|
|
410
|
+
|
|
411
|
+
|
|
412
|
+
|
|
413
|
+
|
|
414
|
+
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 };
|
|
415
|
+
export type { ButtonContent, Card, Deck, ImageContent, InputBoxContent, SelectBoxContent, TextAreaContent, ToggleContent };
|
package/dist/app.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{getCurrentInstance as N,ref as E,computed as i,reactive as d,createSSRApp as B}from"vue";import{renderToString as M}from"vue/server-renderer";const y=new Map;function s(){const e=(r,l,a,v,g,u)=>{y.set(r._uid,{context:E(l),content:E(a),design:E(v),defaults:E(g),site:E(u?.site??{})})},n=(r,l,a,v,g)=>{const u=y.get(r._uid);u!==void 0&&(u.content.value=l,u.design.value=a,u.defaults.value=v,u.site.value=g.site??{})},t=N()?.appContext.app._uid??-1,o=y.get(t);return{init:e,update:n,context:o?.context,content:o?.content,design:o?.design,defaults:o?.defaults,site:o?.site}}function O(e,n){const t=s(),o=i(()=>n!==void 0?n:t.content.value);return K(o,e)}function K(e,n){const t=i(()=>{const l=e.value[n];if(l!==void 0){if(typeof l=="string")return l;throw new Error(`Element ${n} is not inputbox`)}}),o=i(()=>t.value!==void 0),r=i(()=>t.value);return d({hasContent:o,value:r})}function C(e,n){const t=s(),o=i(()=>n!==void 0?n:t.content.value);return P(o,e)}function P(e,n){const t=i(()=>{const l=e.value[n];if(l!==void 0){if(typeof l=="string")return l;throw new Error(`Element ${n} is not textarea`)}}),o=i(()=>t.value!==void 0),r=i(()=>t.value);return d({hasContent:o,value:r})}const b={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 U(e){if("tileId"in e)return e.tileId;if("tileIdForScroll"in e)return e.tileIdForScroll}function X(e){if("pageId"in e)return e.pageId;if("pageIdForNavigate"in e)return e.pageIdForNavigate}function F(e){if("pageUrl"in e)return e.pageUrl;switch(X(e)){case"products":return"/products";case"cart":return"/cart";case"account":return"/account";case"search":return"/search";case"home":default:return"/"}}const x=(e,n)=>{if(!e||n)return;const{type:t,link:o,email:r,phone:l}=e,a=F(e);switch(t){case b.HYPER_LINK:if(o)return()=>window.open(o,"_blank");break;case b.GO_TO_STORE:case b.GO_TO_STORE_LINK:return()=>window.open("/products","_self");case b.MAIL_LINK:if(r)return()=>window.open(`mailto:${r}`,"_self");break;case b.TEL_LINK:if(l)return()=>window.open(`tel:${l}`,"_self");break;case b.SCROLL_TO_TILE:if(typeof document<"u")return()=>{const v=U(e);document.getElementById(`tile-${v}`)?.scrollIntoView()};break;case b.GO_TO_PAGE:if(a)return()=>window.open(a,"_self");break;default:console.error(`Unknown type of ActionLink: ${t}`)}};function V(e){return"title"in e&&"type"in e}function H(e,n,t){const o=i(()=>{const _=e.value[n];if(_!==void 0){if(V(_))return _;throw new Error(`Element ${n} is not action link`)}}),r=i(()=>o.value?.title),l=i(()=>o.value?.type),a=i(()=>o.value?.link),v=i(()=>o.value?.email),g=i(()=>o.value?.phone),u=i(()=>o.value?.tileId?`tile-${o.value?.tileId}`:null),c=i(()=>o.value?.type==="GO_TO_STORE_LINK"?"products":o.value?.pageId),f=i(()=>o.value?.pageUrl),m=i(()=>!!r.value),$=i(()=>!!a.value),D=x(o.value,t);return d({title:r,type:l,link:a,email:v,phone:g,tileDivId:u,pageId:c,pageUrl:f,hasTitle:m,hasLink:$,performAction:D})}function L(e,n){const t=s(),o=i(()=>!!t.site?.value?.isPreviewMode),r=i(()=>n!==void 0?n:t.content.value!==void 0?t.content.value:{});return H(r,e,o.value)}function W(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=s(),o=i(()=>n!==void 0?n:t.content.value);return Y(o,e)}function Y(e,n){const t=i(()=>{const u=e.value[n];if(u!==void 0){if(W(u))return u;throw new Error(`Element ${n} is not image`)}}),o=i(()=>t.value===void 0?"":s().context.value.imageBuckets?.[t.value?.bucket]),r=i(()=>t.value!==void 0),l=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:r,lowResolutionMobileImage:l,highResolutionMobileImage:a,lowResolutionDesktopImage:v,highResolutionDesktopImage:g})}function j(e){return"enabled"in e}function R(e,n){const t=s(),o=i(()=>n!==void 0?n:t.content.value);return J(o,e)}function J(e,n){const t=i(()=>{const l=e.value[n];if(l!==void 0){if(j(l))return l;throw new Error(`Element ${n} is not toggle`)}}),o=i(()=>t.value!==void 0),r=i(()=>t.value?.enabled);return d({hasContent:o,value:r})}function A(e,n){const t=s(),o=i(()=>n!==void 0?n:t.content.value);return q(o,e)}function q(e,n){const t=i(()=>{const l=e.value[n];if(l!==void 0){if(typeof l=="string")return l;throw new Error(`Element ${n} is not selectbox`)}}),o=i(()=>t.value!==void 0),r=i(()=>t.value);return d({hasContent:o,value:r})}function Q(e){return e!==null&&"items"in e}function G(e){const n=s(),t=i(()=>{const a=n.content.value[e];if(a!==void 0){if(Q(a))return a;throw new Error(`Element ${e} is not an menu`)}}),o=i(()=>!!n.site?.value?.isPreviewMode),r=i(()=>t.value!==void 0),l=i(()=>t.value?.items?t.value.items.map(a=>({...a,performAction:x(a,o.value)})):[]);return d({hasContent:r,items:l})}const Z="menu";function ee(){return G(Z)}var S=(e=>(e.INPUTBOX="INPUTBOX",e.TEXTAREA="TEXTAREA",e.BUTTON="BUTTON",e.IMAGE="IMAGE",e.TOGGLE="TOGGLE",e.SELECTBOX="SELECTBOX",e))(S||{});function te(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 ne(e){const n=s(),t=i(()=>{const l=n.content.value[e];if(l!==void 0){if(te(l))return l;throw new Error(`Element ${e} is not of DECK type`)}}),o=i(()=>t.value!==void 0&&t.value.cards.length>0),r=i(()=>t.value?.cards);return d({hasContent:o,cards:r,getReactiveRef:oe})}function oe(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 A(t,e.settings);case"IMAGE":return k(t,e.settings);case"TOGGLE":return R(t,e.settings);case"BUTTON":return L(t,e.settings);default:return}}function ie(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 re(){const e=s(),n=i(()=>{const a=e.content.value.logo;if(a!==void 0){if(ie(a))return a;throw new Error("Element logo is not LOGO")}}),t=i(()=>n.value?.type),o=i(()=>n.value?.text),r=i(()=>n.value?.image===void 0?"":e.context.value.imageBuckets?.[n.value.image.bucket]),l=i(()=>({lowResolutionMobileImage:T(n.value?.image?.set?.["cropped-webp-100x200"]?.url,r.value),highResolutionMobileImage:T(n.value?.image?.set?.["cropped-webp-1000x2000"]?.url,r.value),lowResolutionDesktopImage:T(n.value?.image?.set?.["webp-200x200"]?.url,r.value),highResolutionDesktopImage:T(n.value?.image?.set?.["webp-2000x2000"]?.url,r.value)}));return d({type:t,text:o,image:l})}function I(e,n){if(n===void 0)return;if(!n.startsWith("global."))return n;const t=n.split(".").at(2);if(t!==void 0)return e.fontFamily[t]}function h(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[t]}function p(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[t]}function le(e){const n=s(),t=i(()=>{const u=n.design.value[e],c=n.defaults.value[e],f=n.context.value.globalDesign;return{font:u?.font?.replaceAll("_"," ")??I(f,c?.font),size:u?.size??h(f,c?.size),bold:u?.bold??c?.bold,italic:u?.italic??c?.italic,color:u?.color??p(f,c?.color),visible:u?.visible??c?.visible??!1}}),o=i(()=>t.value?.font),r=i(()=>t.value?.size),l=i(()=>t.value?.bold),a=i(()=>t.value?.italic),v=i(()=>t.value?.color),g=i(()=>t.value?.visible);return d({font:o,size:r,bold:l,italic:a,color:v,visible:g})}function ae(e){const n=s(),t=i(()=>{const c=n.design.value[e],f=n.defaults.value[e],m=n.context.value.globalDesign;return{font:c?.font?.replaceAll("_"," ")??I(m,f?.font),size:c?.size??h(m,f?.size),bold:c?.bold??f?.bold,italic:c?.italic??f?.italic,color:c?.color??p(m,f?.color),visible:c?.visible??f?.visible??!1,whiteSpace:"pre-wrap"}}),o=i(()=>t.value?.font),r=i(()=>t.value?.size),l=i(()=>t.value?.bold),a=i(()=>t.value?.italic),v=i(()=>t.value?.color),g=i(()=>t.value?.visible),u=i(()=>t.value?.whiteSpace);return d({font:o,size:r,bold:l,italic:a,color:v,visible:g,whiteSpace:u})}function ue(e){const n=s(),t=i(()=>{const u=n.design.value[e],c=n.defaults.value[e],f=n.context.value.globalDesign;return{appearance:u?.appearance??c?.appearance,font:u?.font??I(f,c?.font),size:u?.size??c?.size,style:u?.style??c?.style,color:u?.color??p(f,c?.color),visible:u?.visible??c?.visible??!1}}),o=i(()=>t.value?.appearance),r=i(()=>t.value?.font),l=i(()=>t.value?.size),a=i(()=>t.value?.style),v=i(()=>t.value?.color),g=i(()=>t.value?.visible);return d({appearance:o,font:r,size:l,style:a,color:v,visible:g})}function se(e){const n=s(),t=i(()=>{const l=n.design.value[e],a=n.defaults.value[e],v=n.context.value.globalDesign;return{overlay:{type:l?.overlay?.type??a?.overlay?.type,solid:{color:l?.overlay?.solid?.color??p(v,a?.overlay?.solid?.color)},gradient:{fromColor:l?.overlay?.gradient?.fromColor??p(v,a?.overlay?.gradient?.fromColor),toColor:l?.overlay?.gradient?.toColor??p(v,a?.overlay?.gradient?.toColor)}},visible:l?.visible??a?.visible??!1}}),o=i(()=>t.value?.overlay),r=i(()=>t.value?.visible);return d({overlay:o,visible:r})}function ce(e){const n=s(),t=i(()=>{const r=n.design.value[e],l=n.defaults.value[e];return{enabled:r?.enabled??l?.enabled}}),o=i(()=>t.value?.enabled);return d({enabled:o})}function ve(e){const n=s(),t=i(()=>{const r=n.design.value[e],l=n.defaults.value[e];return{value:r?.value??l?.value}}),o=i(()=>t.value?.value);return d({value:o})}function de(e){const n=s(),t=i(()=>{const r=n.design.value[e],l=n.defaults.value[e],a=n.context.value.globalDesign;return{background:{type:r?.background?.type??l?.background?.type,solid:{color:r?.background?.solid?.color??p(a,l?.background?.solid?.color)},gradient:{fromColor:r?.background?.gradient?.fromColor??p(a,l?.background?.gradient?.fromColor),toColor:r?.background?.gradient?.toColor??p(a,l?.background?.gradient?.toColor)}}}}),o=i(()=>t.value?.background);return d({background:o})}function fe(){const e=s(),n=i(()=>e.design.value.layout),t=i(()=>n.value);return d({layout:t})}function ge(e,n){return{visible:n?.visible??!1,width:n?.width??1,color:p(e,n?.color)}}function pe(){const e=s();return i(()=>{const n=e.design.value.logo,t=e.defaults.value.logo,o=e.context.value.globalDesign;return{font:n?.font?.replaceAll("_"," ")??I(o,t?.font),size:n?.size??h(o,t?.size),bold:n?.bold??t?.bold,italic:n?.italic??t?.italic,color:n?.color??p(o,t?.color),visible:n?.visible??t?.visible??!1,spacing:n?.spacing??t?.spacing??0,capitalization:n?.capitalization??t?.capitalization??"none",frame:n?.frame??ge(o,t?.frame)}})}function z(e){return{app:B(e)}}function be(e,n){return{init:()=>{const{app:t}=z(e);return n?.init?.(t),{render:async(o,r)=>(s().init(t,o,r.content,r.design,r.defaults,r.externalContent),n?.render?.(t,o,r),{html:await M(t,{context:o}),state:{context:o,data:r}})}}}}function me(e,n){return{init:()=>{const{app:t}=z(e);return n?.init?.(t),{mount:(o,r)=>{s().init(t,r.context,r.data.content,r.data.design,r.data.defaults,r.data.externalContent),n?.mount?.(t,o,r),t.mount(o)},update:o=>{s().update(t,o.data.content,o.data.design,o.data.defaults,o.data.externalContent),n?.update?.(t,o)},unmount:()=>{n?.unmount?.(t),t.unmount()}}}}}function Ee(){return globalThis.window.instantsite}export{S as EditorTypes,me as createVueClientApp,be as createVueServerApp,de as useBackgroundElementDesign,L as useButtonElementContent,ue as useButtonElementDesign,ne as useDeckElementContent,k as useImageElementContent,se as useImageElementDesign,O as useInputboxElementContent,Ee as useInstantsiteJsApi,fe as useLayoutElementDesign,re as useLogoElementContent,pe as useLogoElementDesign,G as useMenuElementContent,ee as useNavigationMenuElementContent,A as useSelectboxElementContent,ve as useSelectboxElementDesign,le as useTextElementDesign,C as useTextareaElementContent,ae as useTextareaElementDesign,R as useToggleElementContent,ce as useToggleElementDesign,s as useVueBaseProps};
|
|
1
|
+
import{getCurrentInstance as K,ref as m,computed as i,reactive as d,createSSRApp as P}from"vue";import{renderToString as U}from"vue/server-renderer";const y=new Map;function c(){const e=(l,r,a,v,g,s,u)=>{y.set(l._uid,{context:m(r),content:m(a),design:m(v),defaults:m(g),site:m(s?.site??{}),globalDesign:m(u)})},n=(l,r,a,v,g,s)=>{const u=y.get(l._uid);u!==void 0&&(u.content.value=r,u.design.value=a,u.defaults.value=v,u.site.value=g.site??{},u.globalDesign.value=s)},t=K()?.appContext.app._uid??-1,o=y.get(t);return{init:e,update:n,context:o?.context,content:o?.content,design:o?.design,defaults:o?.defaults,site:o?.site,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 b={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 b.HYPER_LINK:if(o)return()=>window.open(o,"_blank");break;case b.GO_TO_STORE:case b.GO_TO_STORE_LINK:return()=>window.open("/products","_self");case b.MAIL_LINK:if(l)return()=>window.open(`mailto:${l}`,"_self");break;case b.TEL_LINK:if(r)return()=>window.open(`tel:${r}`,"_self");break;case b.SCROLL_TO_TILE:if(typeof document<"u")return()=>{const v=W(e);document.getElementById(`tile-${v}`)?.scrollIntoView()};break;case b.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 I=e.value[n];if(I!==void 0){if(Y(I))return I;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 h(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:h(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:h(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:h(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:h(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 he(){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,he 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};
|
package/dist/cli.d.mts
CHANGED
package/dist/cli.d.ts
CHANGED