@lightspeed/crane 1.1.0 → 1.1.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.
Files changed (51) hide show
  1. package/dist/app.d.mts +198 -11
  2. package/dist/app.d.ts +198 -11
  3. package/dist/app.mjs +1 -1
  4. package/dist/cli.mjs +22 -11
  5. package/package.json +5 -2
  6. package/template/footers/example-footer/ExampleFooter.vue +40 -1
  7. package/template/footers/example-footer/component/LegalLinks.vue +20 -0
  8. package/template/footers/example-footer/component/ReportAbuse.vue +18 -0
  9. package/template/footers/example-footer/entity/color.ts +4 -0
  10. package/template/footers/{settings/translations.ts → example-footer/settings/content.ts} +0 -2
  11. package/template/footers/example-footer/settings/design.ts +11 -0
  12. package/template/footers/example-footer/settings/translations.ts +12 -0
  13. package/template/footers/example-footer/showcases/1.ts +2 -0
  14. package/template/footers/example-footer/showcases/translations.ts +9 -0
  15. package/template/footers/example-footer/type.ts +2 -2
  16. package/template/headers/example-header/ExampleHeader.vue +39 -7
  17. package/template/headers/example-header/assets/account_icon.svg +11 -0
  18. package/template/headers/example-header/assets/cart.svg +20 -0
  19. package/template/headers/example-header/assets/lightspeed_logo.png +0 -0
  20. package/template/headers/example-header/assets/search.svg +13 -0
  21. package/template/headers/example-header/component/Account.vue +20 -0
  22. package/template/headers/example-header/component/Cart.vue +64 -0
  23. package/template/headers/example-header/component/Logo.vue +95 -0
  24. package/template/headers/example-header/component/NavigationMenu.vue +53 -0
  25. package/template/headers/example-header/component/SearchForm.vue +89 -0
  26. package/template/headers/example-header/settings/content.ts +9 -0
  27. package/template/headers/example-header/settings/design.ts +23 -0
  28. package/template/headers/example-header/settings/translations.ts +9 -0
  29. package/template/headers/example-header/showcases/1.ts +40 -0
  30. package/template/headers/example-header/showcases/2.ts +42 -0
  31. package/template/headers/example-header/showcases/translations.ts +17 -0
  32. package/template/headers/example-header/type.ts +2 -2
  33. package/template/package.json +3 -2
  34. package/template/sections/example-section/component/image/ImagesGrid.vue +18 -37
  35. package/template/sections/example-section/settings/content.ts +53 -55
  36. package/template/sections/example-section/settings/translations.ts +27 -24
  37. package/template/sections/example-section/showcases/1.ts +143 -103
  38. package/template/sections/example-section/showcases/2.ts +127 -103
  39. package/template/sections/example-section/showcases/translations.ts +4 -0
  40. package/template/shared/LanguageSelector.vue +75 -0
  41. package/template/templates/template.ts +128 -104
  42. package/types.d.ts +262 -152
  43. package/template/footers/example-footer/component/SampleComponent.vue +0 -11
  44. package/template/footers/settings/content.ts +0 -1
  45. package/template/footers/settings/design.ts +0 -1
  46. package/template/headers/example-header/component/SampleComponent.vue +0 -11
  47. package/template/headers/settings/content.ts +0 -1
  48. package/template/headers/settings/design.ts +0 -1
  49. package/template/headers/settings/layout.ts +0 -1
  50. package/template/headers/settings/translations.ts +0 -5
  51. /package/template/{footers → headers/example-header}/settings/layout.ts +0 -0
package/types.d.ts CHANGED
@@ -1,52 +1,83 @@
1
1
  /// <reference types="vite/client" />
2
2
 
3
3
  declare module '*.vue' {
4
- import type { DefineComponent } from 'vue';
5
-
6
- const component: DefineComponent<{}, {}, any>;
7
- export default component;
4
+ import type { DefineComponent } from 'vue';
5
+ // eslint-disable-next-line
6
+ const component: DefineComponent<{}, {}, any>;
7
+ export default component;
8
8
  }
9
9
 
10
- type ButtonType =
11
- 'SCROLL_TO_TILE'
12
- | 'HYPER_LINK'
13
- | 'MAIL_LINK'
14
- | 'TEL_LINK'
15
- | 'GO_TO_STORE_LINK';
10
+ type ActionLinkType
11
+ = 'SCROLL_TO_TILE'
12
+ | 'HYPER_LINK'
13
+ | 'MAIL_LINK'
14
+ | 'TEL_LINK'
15
+ | 'GO_TO_STORE'
16
+ | 'GO_TO_STORE_LINK'
17
+ | 'GO_TO_PAGE';
16
18
 
17
19
  interface ButtonContentData {
18
- readonly title: string;
19
- readonly type: ButtonType;
20
- readonly link?: string;
21
- readonly email?: string;
22
- readonly phone?: string;
23
- readonly tileId?: string;
20
+ readonly title: string;
21
+ readonly type: ActionLinkType;
22
+ readonly link?: string;
23
+ readonly email?: string;
24
+ readonly phone?: string;
25
+ readonly tileId?: string;
26
+ readonly pageId?: string;
27
+ readonly pageUrl?: string;
24
28
  }
25
29
 
26
30
  interface ImageInfoData {
27
- readonly url: string;
28
- readonly width: number;
29
- readonly height: number;
31
+ readonly url: string;
32
+ readonly width: number;
33
+ readonly height: number;
30
34
  }
31
35
 
32
36
  interface ImageBorderInfoData {
33
- readonly homogeneity: boolean;
34
- readonly color: {
35
- readonly r: number;
36
- readonly g: number;
37
- readonly b: number;
38
- readonly a: number;
39
- };
37
+ readonly homogeneity: boolean;
38
+ readonly color: {
39
+ readonly r: number;
40
+ readonly g: number;
41
+ readonly b: number;
42
+ readonly a: number;
43
+ };
40
44
  }
41
45
 
42
46
  interface ImageContentData {
43
- readonly bucket: string;
44
- readonly borderInfo: ImageBorderInfoData;
45
- readonly set: Record<string, ImageInfoData>;
47
+ readonly bucket: string;
48
+ readonly borderInfo: ImageBorderInfoData;
49
+ readonly set: Record<string, ImageInfoData>;
46
50
  }
47
51
 
48
52
  interface ToggleContentData {
49
- readonly enabled: boolean;
53
+ readonly enabled: boolean;
54
+ }
55
+
56
+ interface ActionLink {
57
+ id: string;
58
+ title?: string;
59
+ type?: string;
60
+ link?: string;
61
+ email?: string;
62
+ phone?: string;
63
+ tileIdForScroll?: string;
64
+ pageIdForNavigate?: string;
65
+ showStoreCategories?: boolean;
66
+ isSubmenuOpened?: boolean;
67
+ categoryId?: number;
68
+ performAction?: () => void;
69
+ }
70
+
71
+ interface MenuContentData {
72
+ readonly items: ReadonlyArray<ActionLink>;
73
+ }
74
+
75
+ type LogoType = 'TEXT' | 'IMAGE';
76
+
77
+ interface LogoContentData {
78
+ readonly type: LogoType;
79
+ readonly text: string;
80
+ readonly image: ImageContentData
50
81
  }
51
82
 
52
83
  type GlobalColorsString =
@@ -66,232 +97,311 @@ type GlobalTextSizeString =
66
97
  'global.textSize.body';
67
98
 
68
99
  interface HSLColor {
69
- h: number;
70
- s: number;
71
- l: number;
72
- a: number;
100
+ h: number;
101
+ s: number;
102
+ l: number;
103
+ a: number;
73
104
  }
74
105
  interface RGBAColor {
75
- r: number;
76
- g: number;
77
- b: number;
78
- a: number;
106
+ r: number;
107
+ g: number;
108
+ b: number;
109
+ a: number;
79
110
  }
80
111
 
81
112
  interface Color {
82
- raw: string;
83
- hex: string;
84
- hsl: HSLColor;
85
- rgba: RGBAColor;
86
- auto?: boolean;
113
+ raw: string;
114
+ hex: string;
115
+ hsl: HSLColor;
116
+ rgba: RGBAColor;
117
+ auto?: boolean;
87
118
  }
88
119
 
89
120
  interface SolidColor {
90
- color: Color | GlobalColorsString | undefined;
121
+ color: Color | GlobalColorsString | undefined;
91
122
  }
92
123
 
93
124
  interface GradientColor {
94
- fromColor: Color | GlobalColorsString| undefined;
95
- toColor: Color | GlobalColorsString| undefined;
125
+ fromColor: Color | GlobalColorsString | undefined;
126
+ toColor: Color | GlobalColorsString | undefined;
96
127
  }
97
128
 
98
129
  interface TextDesignData {
99
- font: string | GlobalFontsString | undefined;
100
- size: number | GlobalTextSizeString | undefined;
101
- bold: boolean | undefined;
102
- italic: boolean | undefined;
103
- color: Color | GlobalColorsString | undefined;
104
- visible: boolean;
130
+ font: string | GlobalFontsString | undefined;
131
+ size: number | GlobalTextSizeString | undefined;
132
+ bold: boolean | undefined;
133
+ italic: boolean | undefined;
134
+ color: Color | GlobalColorsString | undefined;
135
+ visible: boolean;
105
136
  }
106
137
 
107
138
  interface TextareaDesignData extends TextDesignData {
108
- readonly whiteSpace: string;
139
+ readonly whiteSpace: string;
140
+ }
141
+
142
+ type CapitalizationType =
143
+ 'none'
144
+ | 'all'
145
+ | 'small';
146
+
147
+ interface Frame {
148
+ visible: boolean;
149
+ width: number | undefined;
150
+ color: Color | GlobalColorsString | undefined;
151
+ }
152
+
153
+ interface LogoDesignData {
154
+ font: string | GlobalFontsString | undefined;
155
+ size: number | GlobalTextSizeString | undefined;
156
+ bold: boolean | undefined;
157
+ italic: boolean | undefined;
158
+ color: Color | GlobalColorsString | undefined;
159
+ visible: boolean;
160
+ spacing: number | undefined;
161
+ capitalization: CapitalizationType | undefined;
162
+ frame: Frame | undefined;
109
163
  }
110
164
 
111
165
  type ButtonAppearance =
112
- 'solid-button'
113
- | 'outline-button'
114
- | 'text-link';
166
+ 'solid-button'
167
+ | 'outline-button'
168
+ | 'text-link';
115
169
 
116
170
  type ButtonSize =
117
- 'small'
118
- | 'medium'
119
- | 'large';
171
+ 'small'
172
+ | 'medium'
173
+ | 'large';
120
174
 
121
175
  type ButtonStyle =
122
- 'round-corner'
123
- | 'rectangle'
124
- | 'pill';
176
+ 'round-corner'
177
+ | 'rectangle'
178
+ | 'pill';
125
179
 
126
180
  interface ButtonDesignData {
127
- appearance: ButtonAppearance | undefined;
128
- font: string | GlobalFontsString | undefined;
129
- size: ButtonSize | undefined;
130
- style: ButtonStyle | undefined;
131
- color: Color | GlobalColorsString | undefined;
132
- visible: boolean;
181
+ appearance: ButtonAppearance | undefined;
182
+ font: string | GlobalFontsString | undefined;
183
+ size: ButtonSize | undefined;
184
+ style: ButtonStyle | undefined;
185
+ color: Color | GlobalColorsString | undefined;
186
+ visible: boolean;
133
187
  }
134
188
 
135
189
  type OverlayType =
136
- 'solid'
137
- | 'gradient'
138
- | 'none';
190
+ 'solid'
191
+ | 'gradient'
192
+ | 'none';
139
193
 
140
194
  interface Overlay {
141
- type: OverlayType | undefined;
142
- solid: SolidColor | undefined;
143
- gradient: GradientColor | undefined;
195
+ type: OverlayType | undefined;
196
+ solid: SolidColor | undefined;
197
+ gradient: GradientColor | undefined;
144
198
  }
145
199
 
146
200
  interface ImageDesignData {
147
- overlay: Overlay | undefined;
148
- visible: boolean;
201
+ overlay: Overlay | undefined;
202
+ visible: boolean;
149
203
  }
150
204
 
151
205
  interface SelectboxDesignData {
152
- value: string | undefined;
206
+ value: string | undefined;
153
207
  }
154
208
 
155
209
  interface ToggleDesignData {
156
- enabled: boolean | undefined;
210
+ enabled: boolean | undefined;
157
211
  }
158
212
 
159
213
  type BackgroundType =
160
- 'solid'
161
- | 'gradient';
214
+ 'solid'
215
+ | 'gradient';
162
216
 
163
217
  interface Background {
164
- type: BackgroundType | undefined;
165
- solid: SolidColor | undefined;
166
- gradient: GradientColor | undefined;
218
+ type: BackgroundType | undefined;
219
+ solid: SolidColor | undefined;
220
+ gradient: GradientColor | undefined;
167
221
  }
168
222
 
169
223
  interface BackgroundDesignData {
170
- background: Background | undefined;
224
+ background: Background | undefined;
171
225
  }
172
226
 
173
227
  type MapEditorContentTypes = {
174
- readonly INPUTBOX: string;
175
- readonly TEXTAREA: string;
176
- readonly BUTTON: ButtonContentData;
177
- readonly IMAGE: ImageContentData;
178
- readonly TOGGLE: ToggleContentData;
179
- readonly SELECTBOX: string;
228
+ readonly INPUTBOX: string;
229
+ readonly TEXTAREA: string;
230
+ readonly BUTTON: ButtonContentData;
231
+ readonly IMAGE: ImageContentData;
232
+ readonly TOGGLE: ToggleContentData;
233
+ readonly SELECTBOX: string;
234
+ readonly MENU: MenuContentData;
235
+ readonly LOGO: LogoContentData;
180
236
  };
181
237
 
182
238
  interface InputboxContentEditor {
183
- readonly type: 'INPUTBOX';
184
- readonly label: Record<string, string>;
185
- readonly placeholder: Record<string, string>;
239
+ readonly type: 'INPUTBOX';
240
+ readonly label: Record<string, string>;
241
+ readonly placeholder: Record<string, string>;
186
242
  }
187
243
 
188
244
  interface TextareaContentEditor {
189
- readonly type: 'TEXTAREA';
190
- readonly label: Record<string, string>;
191
- readonly placeholder: Record<string, string>;
245
+ readonly type: 'TEXTAREA';
246
+ readonly label: Record<string, string>;
247
+ readonly placeholder: Record<string, string>;
248
+ }
249
+
250
+ interface SimpleLink {
251
+ readonly url?: string,
252
+ readonly title?: string,
253
+ readonly target?: string,
254
+ }
255
+
256
+ interface SimpleLink {
257
+ readonly url?: string,
258
+ readonly title?: string,
259
+ readonly target?: string,
260
+ }
261
+
262
+ interface Language {
263
+ readonly code: string;
264
+ readonly description: string;
265
+ readonly main: boolean;
266
+ readonly selected: boolean;
267
+ readonly url?: string;
268
+ }
269
+
270
+ interface ExternalContentData {
271
+ readonly reportAbuse?: SimpleLink;
272
+ readonly account?: SimpleLink;
273
+ readonly languages?: Language[];
274
+ readonly legalLinks?: SimpleLink[];
275
+ readonly isPreviewMode?: boolean;
192
276
  }
193
277
 
194
278
  interface ButtonContentEditor {
195
- readonly type: 'BUTTON';
196
- readonly label: Record<string, string>;
279
+ readonly type: 'BUTTON';
280
+ readonly label: Record<string, string>;
197
281
  }
198
282
 
199
283
  interface ImageContentEditor {
200
- readonly type: 'IMAGE';
201
- readonly label: Record<string, string>;
284
+ readonly type: 'IMAGE';
285
+ readonly label: Record<string, string>;
202
286
  }
203
287
 
204
288
  interface ToggleContentEditor {
205
- readonly type: 'TOGGLE';
206
- readonly label: Record<string, string>;
207
- readonly description?: Record<string, string>;
289
+ readonly type: 'TOGGLE';
290
+ readonly label: Record<string, string>;
291
+ readonly description?: Record<string, string>;
208
292
  }
209
293
 
210
294
  interface SelectboxContentOption {
211
- readonly value: string;
212
- readonly label: Record<string, string>;
295
+ readonly value: string;
296
+ readonly label: Record<string, string>;
213
297
  }
214
298
 
215
299
  interface SelectboxContentEditor {
216
- readonly type: 'SELECTBOX';
217
- readonly label: Record<string, string>;
218
- readonly placeholder: Record<string, string>;
219
- readonly description?: Record<string, string>;
220
- readonly options: ReadonlyArray<SelectboxOption>;
300
+ readonly type: 'SELECTBOX';
301
+ readonly label: Record<string, string>;
302
+ readonly placeholder: Record<string, string>;
303
+ readonly description?: Record<string, string>;
304
+ readonly options: ReadonlyArray<SelectboxOption>;
305
+ }
306
+
307
+ interface MenuContentEditor {
308
+ readonly type: 'MENU';
309
+ readonly label: Record<string, string>;
310
+ readonly items: ReadonlyArray<ActionLink>;
311
+ }
312
+
313
+ interface NavigationMenuContentEditor {
314
+ readonly type: 'NAVIGATION_MENU';
315
+ }
316
+
317
+ interface LogoContentEditor {
318
+ readonly type: 'LOGO';
319
+ readonly label: Record<string, string>;
221
320
  }
222
321
 
223
322
  type ContentEditor =
224
- TextContentEditor
225
- | MultilineTextContentEditor
226
- | ButtonContentEditor
227
- | ImageContentEditor
228
- | ToggleContentEditor
229
- | SelectboxContentEditor;
323
+ TextContentEditor
324
+ | MultilineTextContentEditor
325
+ | ButtonContentEditor
326
+ | ImageContentEditor
327
+ | ToggleContentEditor
328
+ | SelectboxContentEditor
329
+ | MenuContentEditor
330
+ | NavigationMenuContentEditor
331
+ | LogoContentEditor;
230
332
 
231
333
  type InferContentType<T extends Record<string, ContentEditor>> = {
232
- readonly [P in keyof T]: MapEditorContentTypes[T[P]['type']]
334
+ readonly [P in keyof T]: MapEditorContentTypes[T[P]['type']]
233
335
  }
234
336
 
235
337
  type MapEditorDesignTypes = {
236
- readonly TEXT: string;
237
- readonly BUTTON: string;
238
- readonly IMAGE: string;
239
- readonly TOGGLE: string;
240
- readonly SELECTBOX: string;
241
- readonly BACKGROUND: string;
242
- readonly COLOR_PICKER: string;
338
+ readonly TEXT: string;
339
+ readonly BUTTON: string;
340
+ readonly IMAGE: string;
341
+ readonly TOGGLE: string;
342
+ readonly SELECTBOX: string;
343
+ readonly BACKGROUND: string;
344
+ readonly COLOR_PICKER: string;
345
+ readonly LOGO: string;
243
346
  };
244
347
 
245
348
  interface TextDesignEditor {
246
- readonly type: 'TEXT';
247
- readonly label: string | Record<string, string>;
248
- defaults: Record<string, unknown>;
349
+ readonly type: 'TEXT';
350
+ readonly label: string | Record<string, string>;
351
+ defaults: Record<string, unknown>;
249
352
  }
250
353
 
251
354
  interface ButtonDesignEditor {
252
- readonly type: 'BUTTON';
253
- readonly label: string | Record<string, string>;
254
- defaults: Record<string, unknown>;
355
+ readonly type: 'BUTTON';
356
+ readonly label: string | Record<string, string>;
357
+ defaults: Record<string, unknown>;
255
358
  }
256
359
 
257
360
  interface ImageDesignEditor {
258
- readonly type: 'IMAGE';
259
- readonly label: string | Record<string, string>;
260
- defaults: Record<string, unknown>;
361
+ readonly type: 'IMAGE';
362
+ readonly label: string | Record<string, string>;
363
+ defaults: Record<string, unknown>;
261
364
  }
262
365
 
263
366
  interface ToggleDesignEditor {
264
- readonly type: 'TOGGLE';
265
- readonly label: string | Record<string, string>;
266
- defaults: Record<string, unknown>;
367
+ readonly type: 'TOGGLE';
368
+ readonly label: string | Record<string, string>;
369
+ defaults: Record<string, unknown>;
267
370
  }
268
371
 
269
372
  interface SelectboxDesignEditor {
270
- readonly type: 'SELECTBOX';
271
- readonly label: string | Record<string, string>;
272
- defaults: Record<string, unknown>;
373
+ readonly type: 'SELECTBOX';
374
+ readonly label: string | Record<string, string>;
375
+ defaults: Record<string, unknown>;
273
376
  }
274
377
 
275
378
  interface BackgroundDesignEditor {
276
- readonly type: 'BACKGROUND';
277
- readonly label: string | Record<string, string>;
278
- defaults: Record<string, unknown>;
379
+ readonly type: 'BACKGROUND';
380
+ readonly label: string | Record<string, string>;
381
+ defaults: Record<string, unknown>;
279
382
  }
280
383
 
281
384
  interface ColorPickerDesignEditor {
282
- readonly type: 'COLOR_PICKER';
283
- defaults: Record<string, unknown>;
385
+ readonly type: 'COLOR_PICKER';
386
+ defaults: Record<string, unknown>;
387
+ }
388
+
389
+ interface LogoDesignEditor {
390
+ readonly type: 'LOGO';
391
+ readonly label: string | Record<string, string>;
392
+ defaults: Record<string, unknown>;
284
393
  }
285
394
 
286
395
  type DesignEditor =
287
- TextDesignEditor
288
- | ButtonDesignEditor
289
- | ImageDesignEditor
290
- | ToggleDesignEditor
291
- | SelectboxDesignEditor
292
- | BackgroundDesignEditor
293
- | ColorPickerDesignEditor;
396
+ TextDesignEditor
397
+ | ButtonDesignEditor
398
+ | ImageDesignEditor
399
+ | ToggleDesignEditor
400
+ | SelectboxDesignEditor
401
+ | BackgroundDesignEditor
402
+ | ColorPickerDesignEditor
403
+ | LogoDesignEditor;
294
404
 
295
405
  type InferDesignType<T extends Record<string, DesignEditor>> = {
296
- readonly [P in keyof T]: MapEditorDesignTypes[T[P]['type']]
406
+ readonly [P in keyof T]: MapEditorDesignTypes[T[P]['type']]
297
407
  }
@@ -1,11 +0,0 @@
1
- <script setup lang="ts">
2
-
3
- </script>
4
-
5
- <template>
6
-
7
- </template>
8
-
9
- <style scoped lang="scss">
10
-
11
- </style>
@@ -1 +0,0 @@
1
- export default {} as const;
@@ -1 +0,0 @@
1
- export default {} as const;
@@ -1,11 +0,0 @@
1
- <script setup lang="ts">
2
-
3
- </script>
4
-
5
- <template>
6
-
7
- </template>
8
-
9
- <style scoped lang="scss">
10
-
11
- </style>
@@ -1 +0,0 @@
1
- export default {} as const;
@@ -1 +0,0 @@
1
- export default {} as const;
@@ -1 +0,0 @@
1
- export default [] as const;
@@ -1,5 +0,0 @@
1
- export default {
2
- en: {},
3
-
4
- nl: {},
5
- } as const;