@bagelink/blox 1.12.21 → 1.12.23

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 (59) hide show
  1. package/dist/CmsPageView.vue.d.ts.map +1 -1
  2. package/dist/PreviewApp-C2T03Jm9.cjs +4 -0
  3. package/dist/PreviewApp-CmThrLvv.js +4 -0
  4. package/dist/PreviewApp.vue.d.ts.map +1 -1
  5. package/dist/PreviewApp.vue_vue_type_style_index_0_lang-B0N5QbfS.js +157 -0
  6. package/dist/PreviewApp.vue_vue_type_style_index_0_lang-BTuE4GmT.cjs +156 -0
  7. package/dist/api/index.d.ts.map +1 -1
  8. package/dist/bridge.d.ts +1 -0
  9. package/dist/bridge.d.ts.map +1 -1
  10. package/dist/core-C3Iu5qa2.js +460 -0
  11. package/dist/core-_fnHoEZN.cjs +459 -0
  12. package/dist/core.d.ts.map +1 -1
  13. package/dist/createBloxApp.d.ts +107 -0
  14. package/dist/createBloxApp.d.ts.map +1 -0
  15. package/dist/defineBlock.d.ts +2 -0
  16. package/dist/defineBlock.d.ts.map +1 -1
  17. package/dist/index.cjs +79 -572
  18. package/dist/index.d.ts +2 -0
  19. package/dist/index.d.ts.map +1 -1
  20. package/dist/index.mjs +78 -570
  21. package/dist/{prerender-6jE_obPj.cjs → prerender-Bi7YtzSp.cjs} +246 -6
  22. package/dist/prerender-D3Q4jKXm.js +522 -0
  23. package/dist/schema.d.ts +2 -0
  24. package/dist/schema.d.ts.map +1 -1
  25. package/dist/ssg/cli.cjs +48 -5
  26. package/dist/ssg/cli.mjs +48 -5
  27. package/dist/ssg/client.cjs +50 -3
  28. package/dist/ssg/client.d.ts +2 -1
  29. package/dist/ssg/client.d.ts.map +1 -1
  30. package/dist/ssg/client.mjs +49 -2
  31. package/dist/ssg/cms-routes.d.ts +21 -4
  32. package/dist/ssg/cms-routes.d.ts.map +1 -1
  33. package/dist/ssg/collection-cache.d.ts +53 -0
  34. package/dist/ssg/collection-cache.d.ts.map +1 -0
  35. package/dist/ssg/constants.d.ts +4 -0
  36. package/dist/ssg/constants.d.ts.map +1 -1
  37. package/dist/ssg/createSSREntry.d.ts +73 -0
  38. package/dist/ssg/createSSREntry.d.ts.map +1 -0
  39. package/dist/ssg/index.cjs +138 -6
  40. package/dist/ssg/index.d.ts +10 -3
  41. package/dist/ssg/index.d.ts.map +1 -1
  42. package/dist/ssg/index.mjs +124 -12
  43. package/dist/ssg/prerender.d.ts +19 -1
  44. package/dist/ssg/prerender.d.ts.map +1 -1
  45. package/dist/ssg/render-resolved-page.d.ts +13 -3
  46. package/dist/ssg/render-resolved-page.d.ts.map +1 -1
  47. package/dist/ssg/seo.d.ts +66 -0
  48. package/dist/ssg/seo.d.ts.map +1 -0
  49. package/dist/style.css +20 -0
  50. package/dist/vite-plugin.cjs +142 -3
  51. package/dist/vite-plugin.d.ts +22 -21
  52. package/dist/vite-plugin.d.ts.map +1 -1
  53. package/dist/vite-plugin.mjs +142 -3
  54. package/package.json +4 -1
  55. package/dist/PreviewApp-BZNzZkit.js +0 -4
  56. package/dist/PreviewApp-C1WvJWI4.cjs +0 -4
  57. package/dist/constants-BIbQhd3z.js +0 -4
  58. package/dist/constants-fZvybj0k.cjs +0 -3
  59. package/dist/prerender-DYmDaqcz.js +0 -282
package/dist/index.cjs CHANGED
@@ -1,204 +1,24 @@
1
1
  "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
4
- var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
+ const core = require("./core-_fnHoEZN.cjs");
4
+ const PreviewApp_vue_vue_type_style_index_0_lang = require("./PreviewApp.vue_vue_type_style_index_0_lang-BTuE4GmT.cjs");
6
5
  const vue = require("vue");
7
6
  const vueRouter = require("vue-router");
8
- const vue$1 = require("@bagelink/vue");
9
- const constants = require("./constants-fZvybj0k.cjs");
10
- const BASE = "/api";
11
- let _websiteName = "";
12
- let _store = "";
13
- let _websiteId = null;
14
- function configureApi(websiteName, store) {
15
- _websiteName = websiteName;
16
- _store = store;
17
- _websiteId = null;
18
- }
19
- async function request(path, { locale: locale2, params, ...opts } = {}) {
20
- const url = new URL(`${BASE}${path}`, window.location.origin);
21
- if (locale2) url.searchParams.set("locale", locale2);
22
- if (params) {
23
- for (const [k, v] of Object.entries(params)) url.searchParams.set(k, String(v));
24
- }
25
- const res = await fetch(url.toString(), opts);
26
- if (!res.ok) throw new Error(`API ${res.status}: ${path}`);
27
- if (res.status === 204) return null;
28
- return res.json();
29
- }
30
- async function getWebsiteId() {
31
- if (_websiteId) return _websiteId;
32
- const websites = await request("/cms/websites");
33
- const website = websites.find((w) => w.name === _websiteName);
34
- if (!website) throw new Error(`Website "${_websiteName}" not found. Run: npm run seed`);
35
- _websiteId = website.id;
36
- return _websiteId;
37
- }
38
- async function resolvePath(path, locale2) {
39
- const websiteId = await getWebsiteId();
40
- return request(`/cms/websites/${websiteId}/resolve-path`, {
41
- locale: locale2,
42
- params: { path }
43
- });
44
- }
45
- async function listItems(collection, { locale: locale2, q, offset = 0, limit = 100 } = {}) {
46
- return request(`/datastore/${_store}/collections/${collection}`, {
47
- locale: locale2,
48
- params: { ...q ? { q } : {}, offset, limit }
49
- });
50
- }
51
- function sendToEditor(msg) {
52
- window.parent.postMessage(msg, "*");
53
- }
54
- function sendToPreview(iframe, msg) {
55
- var _a;
56
- (_a = iframe.contentWindow) == null ? void 0 : _a.postMessage(msg, "*");
57
- }
58
- const locale = vue.ref(localStorage.getItem("blox:locale") || "en");
59
- const currentAlternates = vue.ref({});
60
- function useLocale() {
61
- const dir = vue.computed(() => locale.value === "he" || locale.value === "ar" ? "rtl" : "ltr");
62
- function setLocale(l) {
63
- locale.value = l;
64
- localStorage.setItem("blox:locale", l);
65
- document.documentElement.lang = l;
66
- document.documentElement.dir = dir.value;
67
- try {
68
- const i18n = vue$1.getI18n();
69
- if (i18n == null ? void 0 : i18n.global) i18n.global.locale.value = l;
70
- } catch {
71
- }
72
- }
73
- function setAlternates(alternates) {
74
- currentAlternates.value = alternates;
75
- }
76
- return { locale, dir, setLocale, currentAlternates, setAlternates };
77
- }
78
- const BLOX_REGISTRY_KEY = Symbol("blox:registry");
79
- const BLOX_CONFIG_KEY = Symbol("blox:config");
80
- const BLOX_LOCALE_STRATEGY_KEY = Symbol("blox:locale-strategy");
81
- const PageRenderer = vue.defineComponent({
82
- name: "PageRenderer",
83
- props: {
84
- blocks: {
85
- type: Array,
86
- default: () => []
87
- }
88
- },
89
- setup(props) {
90
- const registry = vue.inject(BLOX_REGISTRY_KEY, {});
91
- return () => vue.h(
92
- "div",
93
- props.blocks.flatMap((block, i) => {
94
- const definition = registry[block.type];
95
- if (!definition) return [];
96
- const props2 = { ...definition.schema.defaults, ...block.props };
97
- return [vue.h(definition.component, { key: i, ...props2 })];
98
- })
99
- );
100
- }
101
- });
102
- const _hoisted_1$1 = {
103
- key: 0,
104
- class: "blox-loading"
105
- };
106
- const _hoisted_2 = {
107
- key: 1,
108
- class: "blox-not-found"
109
- };
110
- const _hoisted_3 = {
111
- key: 2,
112
- class: "blox-error"
113
- };
114
- const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
115
- __name: "CmsPageView",
116
- setup(__props) {
117
- const route = vueRouter.useRoute();
118
- const router = vueRouter.useRouter();
119
- const { locale: locale2, setLocale, setAlternates } = useLocale();
120
- const strategy = vue.inject(BLOX_LOCALE_STRATEGY_KEY, null);
121
- const blocks = vue.ref([]);
122
- const contexts = vue.ref({});
123
- vue.provide("contexts", contexts);
124
- const loading = vue.ref(true);
125
- const notFound = vue.ref(false);
126
- const error = vue.ref(null);
127
- function hydrateFromState(path) {
128
- var _a, _b;
129
- const win = typeof window !== "undefined" ? window : typeof globalThis !== "undefined" ? globalThis : void 0;
130
- if (!win) return false;
131
- const state = win[constants.BLOX_STATE_WINDOW_KEY];
132
- if (!state || typeof state !== "object") return false;
133
- const entry = state[path];
134
- if (!entry) return false;
135
- blocks.value = ((_b = (_a = entry.page) == null ? void 0 : _a.content) == null ? void 0 : _b.blocks) ?? [];
136
- contexts.value = entry.contexts ?? {};
137
- setAlternates(entry.alternates ?? {});
138
- loading.value = false;
139
- return true;
140
- }
141
- async function load() {
142
- var _a;
143
- loading.value = true;
144
- notFound.value = false;
145
- error.value = null;
146
- const { locale: urlLocale, slug } = strategy ? strategy.detect(typeof window !== "undefined" ? window.location.hostname : "", route.path) : { locale: locale2.value, slug: route.path || "/" };
147
- if (urlLocale !== locale2.value) setLocale(urlLocale);
148
- setAlternates({});
149
- if (hydrateFromState(slug)) return;
150
- try {
151
- const resolved = await resolvePath(slug, urlLocale);
152
- blocks.value = ((_a = resolved.page.content) == null ? void 0 : _a.blocks) ?? [];
153
- contexts.value = resolved.contexts ?? {};
154
- setAlternates(resolved.alternates ?? {});
155
- } catch (e) {
156
- const msg = e instanceof Error ? e.message : String(e);
157
- if (msg.includes("404")) {
158
- const home = strategy ? strategy.toPath("/") : "/";
159
- router.replace(home);
160
- } else {
161
- error.value = msg;
162
- }
163
- } finally {
164
- loading.value = false;
165
- }
166
- }
167
- load();
168
- vue.watch(() => route.path, load);
169
- return (_ctx, _cache) => {
170
- const _component_RouterLink = vue.resolveComponent("RouterLink");
171
- return vue.openBlock(), vue.createElementBlock("div", null, [
172
- loading.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$1, " Loading… ")) : notFound.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
173
- _cache[0] || (_cache[0] = vue.createElementVNode("h2", null, "404", -1)),
174
- vue.createElementVNode("p", null, vue.toDisplayString(vue.unref(locale2) === "he" ? "הדף לא נמצא" : "Page not found"), 1),
175
- vue.createVNode(_component_RouterLink, { to: "/" }, {
176
- default: vue.withCtx(() => [
177
- vue.createTextVNode(vue.toDisplayString(vue.unref(locale2) === "he" ? "חזרה הביתה" : "Go home"), 1)
178
- ]),
179
- _: 1
180
- })
181
- ])) : error.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3, vue.toDisplayString(error.value), 1)) : (vue.openBlock(), vue.createBlock(vue.unref(PageRenderer), {
182
- key: 3,
183
- blocks: blocks.value
184
- }, null, 8, ["blocks"]))
185
- ]);
186
- };
187
- }
188
- });
7
+ const pinia = require("pinia");
8
+ const ssg_client = require("./ssg/client.cjs");
189
9
  function useLocaleNav() {
190
- const strategy = vue.inject(BLOX_LOCALE_STRATEGY_KEY, null);
10
+ const strategy = vue.inject(core.BLOX_LOCALE_STRATEGY_KEY, null);
191
11
  const router = vueRouter.useRouter();
192
- const { locale: locale2, currentAlternates: currentAlternates2 } = useLocale();
12
+ const { locale, currentAlternates } = core.useLocale();
193
13
  function switchLocale(targetLocale) {
194
14
  if (!strategy) return;
195
- const alternateSlug = currentAlternates2.value[targetLocale];
15
+ const alternateSlug = currentAlternates.value[targetLocale];
196
16
  strategy.switchTo(targetLocale, alternateSlug ?? "/", router);
197
17
  }
198
18
  function toPath(slug) {
199
19
  return strategy ? strategy.toPath(slug) : slug;
200
20
  }
201
- return { switchLocale, toPath, locale: locale2 };
21
+ return { switchLocale, toPath, locale };
202
22
  }
203
23
  function usePageContext(key) {
204
24
  const contexts = vue.inject("contexts");
@@ -208,396 +28,83 @@ function usePageContext(key) {
208
28
  return value;
209
29
  });
210
30
  }
211
- const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
212
- __name: "LocaleRouterLink",
213
- props: {
214
- to: {},
215
- replace: { type: Boolean },
216
- activeClass: {},
217
- exactActiveClass: {},
218
- ariaCurrentValue: {}
219
- },
220
- setup(__props) {
221
- const props = __props;
222
- const strategy = vue.inject(BLOX_LOCALE_STRATEGY_KEY, null);
223
- const localizedTo = vue.computed(() => {
224
- if (!strategy || typeof props.to !== "string") return props.to;
225
- return strategy.toPath(props.to);
226
- });
227
- return (_ctx, _cache) => {
228
- return vue.openBlock(), vue.createBlock(vue.unref(vueRouter.RouterLink), vue.normalizeProps(vue.guardReactiveProps({ ...props, to: localizedTo.value })), {
229
- default: vue.withCtx(() => [
230
- vue.renderSlot(_ctx.$slots, "default")
231
- ]),
232
- _: 3
233
- }, 16);
234
- };
235
- }
236
- });
237
- function createPathStrategy(options) {
238
- const { defaultLocale, supportedLocales } = options;
239
- let _currentLocale = defaultLocale;
240
- return {
241
- get locales() {
242
- return supportedLocales;
243
- },
244
- get currentLocale() {
245
- return _currentLocale;
246
- },
247
- detect(_hostname, path) {
248
- const segments = path.replace(/^\//, "").split("/");
249
- const first = segments[0];
250
- if (supportedLocales.includes(first)) {
251
- _currentLocale = first;
252
- return {
253
- locale: first,
254
- slug: `/${segments.slice(1).join("/")}` || "/"
255
- };
256
- }
257
- _currentLocale = defaultLocale;
258
- return { locale: defaultLocale, slug: path || "/" };
259
- },
260
- toPath(slug) {
261
- if (_currentLocale === defaultLocale) return slug || "/";
262
- const s = slug || "/";
263
- return s === "/" ? `/${_currentLocale}` : `/${_currentLocale}${s}`;
264
- },
265
- switchTo(locale2, slug, router) {
266
- const s = slug || "/";
267
- const target = locale2 === defaultLocale ? s : s === "/" ? `/${locale2}` : `/${locale2}${s}`;
268
- router.push(target);
269
- }
270
- };
271
- }
272
- function createDomainStrategy(options) {
273
- const { localeDomains } = options;
274
- const locales = Object.keys(localeDomains);
275
- const _currentLocale = locales.find((l) => localeDomains[l] === window.location.hostname) ?? locales[0] ?? "en";
276
- return {
277
- get locales() {
278
- return locales;
279
- },
280
- get currentLocale() {
281
- return _currentLocale;
282
- },
283
- detect(_hostname, path) {
284
- return { locale: _currentLocale, slug: path || "/" };
285
- },
286
- toPath(slug) {
287
- return slug || "/";
288
- },
289
- switchTo(locale2, slug, _router) {
290
- const domain = localeDomains[locale2];
291
- if (!domain) return;
292
- if (locale2 === _currentLocale) {
293
- _router.push(slug || "/");
294
- return;
295
- }
296
- const { protocol } = window.location;
297
- const s = slug || "/";
298
- window.location.href = `${protocol}//${domain}${s}`;
299
- }
31
+ function createBloxApp(options) {
32
+ const {
33
+ rootComponent,
34
+ router,
35
+ modules,
36
+ websiteName,
37
+ store,
38
+ locale = "en",
39
+ supportedLocales = [locale],
40
+ apiBaseURL = "/api",
41
+ mount: mountTarget = "#app",
42
+ plugins = [],
43
+ globalComponents = {},
44
+ setup: userSetup
45
+ } = options;
46
+ ssg_client.installBloxStateCache();
47
+ let axiosInstance;
48
+ if (options.createApi) {
49
+ const result = options.createApi({ baseURL: apiBaseURL });
50
+ axiosInstance = result.axios;
51
+ }
52
+ const collectionInterceptor = ssg_client.installCollectionCache();
53
+ if (collectionInterceptor && axiosInstance) {
54
+ axiosInstance.interceptors.request.use(collectionInterceptor);
55
+ }
56
+ const app = vue.createApp(rootComponent);
57
+ const bloxOpts = {
58
+ modules,
59
+ websiteName,
60
+ store,
61
+ defaultLocale: locale,
62
+ supportedLocales,
63
+ router
300
64
  };
301
- }
302
- function createLocaleStrategy(options) {
303
- if (options.localeStrategy === "domain" && options.localeDomains) {
304
- return createDomainStrategy({ localeDomains: options.localeDomains });
305
- }
306
- return createPathStrategy({
307
- defaultLocale: options.defaultLocale ?? "en",
308
- supportedLocales: options.supportedLocales ?? []
65
+ const blox = core.createBlox(bloxOpts);
66
+ const pinia$1 = pinia.createPinia();
67
+ pinia$1.use(({ store: s }) => {
68
+ s.router = vue.markRaw(router);
309
69
  });
310
- }
311
- function applyDefaultsToFields(schema, defaults) {
312
- var _a;
313
- if (!schema || !defaults) return;
314
- for (const [key, value] of Object.entries(defaults)) {
315
- const field = (_a = schema._fields) == null ? void 0 : _a[key];
316
- if (field && field._config.default === void 0) {
317
- field._config.default = value;
318
- }
319
- }
320
- }
321
- class BloxInstance {
322
- constructor(options) {
323
- __publicField(this, "_registry", {});
324
- __publicField(this, "_routeRegistered", false);
325
- __publicField(this, "_config");
326
- __publicField(this, "_strategy");
327
- this._config = {
328
- defaultLocale: (options == null ? void 0 : options.defaultLocale) ?? "en",
329
- supportedLocales: (options == null ? void 0 : options.supportedLocales) ?? []
330
- };
331
- this._strategy = createLocaleStrategy(options ?? {});
332
- }
333
- registerModules(modules) {
334
- const list = Array.isArray(modules) ? modules : Object.values(modules);
335
- for (const mod of list) {
336
- if (!(mod == null ? void 0 : mod.default)) continue;
337
- for (const [key, value] of Object.entries(mod)) {
338
- if (key === "default") continue;
339
- if (value && typeof value === "object" && "label" in value) {
340
- const meta = value;
341
- applyDefaultsToFields(meta.schema, meta.defaults);
342
- this._registry[meta.name ?? key] = {
343
- component: mod.default,
344
- schema: {
345
- label: meta.label,
346
- description: meta.description,
347
- icon: meta.icon,
348
- fields: meta.schema,
349
- defaults: meta.defaults
350
- }
351
- };
352
- break;
353
- }
354
- }
355
- }
356
- return this;
357
- }
358
- registerComponents(components) {
359
- for (const [key, value] of Object.entries(components)) {
360
- if (!value || typeof value !== "object" && typeof value !== "function") continue;
361
- if (isBlockDefinition(value)) {
362
- this._registry[key] = value;
363
- } else if (value.__blox) {
364
- const meta = value.__blox;
365
- applyDefaultsToFields(meta.schema, meta.defaults);
366
- this._registry[meta.name ?? key] = {
367
- component: value,
368
- schema: {
369
- label: meta.label,
370
- description: meta.description,
371
- icon: meta.icon,
372
- fields: meta.schema,
373
- defaults: meta.defaults
374
- }
375
- };
376
- }
377
- }
378
- return this;
379
- }
380
- registerRoutes(router) {
381
- if (this._routeRegistered) return this;
382
- if (this._config.supportedLocales.length > 0) {
383
- const { defaultLocale } = this._config;
384
- router.beforeEach((to) => {
385
- const segments = to.path.replace(/^\//, "").split("/");
386
- if (segments[0] === defaultLocale) {
387
- const rest = segments.slice(1).join("/");
388
- return { path: `/${rest}`, replace: true };
389
- }
390
- });
391
- }
392
- router.addRoute({
393
- path: "/_blox_preview",
394
- component: () => Promise.resolve().then(() => require("./PreviewApp-C1WvJWI4.cjs")),
395
- beforeEnter: () => window.parent !== window ? true : "/"
396
- });
397
- router.addRoute({ path: "/:pathMatch(.*)*", component: _sfc_main$2 });
398
- this._routeRegistered = true;
399
- return this;
400
- }
401
- install(app, options) {
402
- if (options) {
403
- this._config = {
404
- defaultLocale: options.defaultLocale ?? this._config.defaultLocale,
405
- supportedLocales: options.supportedLocales ?? this._config.supportedLocales
406
- };
407
- this._strategy = createLocaleStrategy({
408
- ...options,
409
- defaultLocale: this._config.defaultLocale,
410
- supportedLocales: this._config.supportedLocales
411
- });
412
- }
413
- if (options == null ? void 0 : options.modules) this.registerModules(options.modules);
414
- if (options == null ? void 0 : options.components) this.registerComponents(options.components);
415
- if (options == null ? void 0 : options.router) this.registerRoutes(options.router);
416
- if ((options == null ? void 0 : options.websiteName) || (options == null ? void 0 : options.store)) {
417
- configureApi(options.websiteName ?? "", options.store ?? "");
418
- }
419
- if (options == null ? void 0 : options.defaultLocale) {
420
- const { setLocale } = useLocale();
421
- if (!localStorage.getItem("blox:locale")) setLocale(options.defaultLocale);
422
- }
423
- app.provide(BLOX_REGISTRY_KEY, this._registry);
424
- app.provide(BLOX_CONFIG_KEY, this._config);
425
- app.provide(BLOX_LOCALE_STRATEGY_KEY, this._strategy);
426
- app.component("RouterLink", _sfc_main$1);
427
- }
428
- }
429
- function isBlockDefinition(value) {
430
- return typeof value === "object" && "component" in value && "schema" in value;
431
- }
432
- function createBlox(options) {
433
- const instance = new BloxInstance(options);
434
- if ((options == null ? void 0 : options.websiteName) || (options == null ? void 0 : options.store)) {
435
- configureApi(options.websiteName ?? "", options.store ?? "");
436
- }
437
- if (options == null ? void 0 : options.modules) instance.registerModules(options.modules);
438
- if (options == null ? void 0 : options.components) instance.registerComponents(options.components);
439
- if (options == null ? void 0 : options.router) instance.registerRoutes(options.router);
440
- return instance;
70
+ blox.install(app, {});
71
+ app.use(pinia$1);
72
+ app.use(router);
73
+ for (const plugin of plugins) {
74
+ if (Array.isArray(plugin)) {
75
+ const [p, ...args] = plugin;
76
+ app.use(p, ...args);
77
+ } else {
78
+ app.use(plugin);
79
+ }
80
+ }
81
+ for (const [name, comp] of Object.entries(globalComponents)) {
82
+ app.component(name, comp);
83
+ }
84
+ if (userSetup) userSetup(app);
85
+ router.isReady().then(() => {
86
+ app.mount(mountTarget);
87
+ });
88
+ return { app, router, blox };
441
89
  }
442
90
  function defineBlock(meta) {
443
91
  return meta;
444
92
  }
445
- const PreviewRenderer = vue.defineComponent({
446
- name: "PreviewRenderer",
447
- props: {
448
- blocks: {
449
- type: Array,
450
- default: () => []
451
- },
452
- selectedIndex: {
453
- type: Number,
454
- default: null
455
- },
456
- hoveredIndex: {
457
- type: Number,
458
- default: null
459
- }
460
- },
461
- setup(props) {
462
- const registry = vue.inject(BLOX_REGISTRY_KEY, {});
463
- const localHovered = vue.ref(null);
464
- function onBlockClick(index) {
465
- sendToEditor({ type: "BLOX_BLOCK_CLICK", index });
466
- }
467
- function onBlockEnter(index) {
468
- localHovered.value = index;
469
- sendToEditor({ type: "BLOX_BLOCK_HOVER", index });
470
- }
471
- function onBlockLeave() {
472
- localHovered.value = null;
473
- sendToEditor({ type: "BLOX_BLOCK_HOVER", index: null });
474
- }
475
- return () => vue.h(
476
- "div",
477
- { class: "blox-preview-canvas" },
478
- props.blocks.flatMap((block, i) => {
479
- const definition = registry[block.type];
480
- if (!definition) return [];
481
- const isSelected = props.selectedIndex === i;
482
- const isHovered = (props.hoveredIndex === i || localHovered.value === i) && !isSelected;
483
- const { label } = definition.schema;
484
- return [
485
- vue.h(
486
- "div",
487
- {
488
- "key": i,
489
- "data-blox-index": i,
490
- "class": [
491
- "blox-block-wrapper",
492
- isSelected && "blox-block--selected",
493
- isHovered && "blox-block--hovered"
494
- ],
495
- "onClick": () => {
496
- onBlockClick(i);
497
- },
498
- "onMouseenter": () => {
499
- onBlockEnter(i);
500
- },
501
- "onMouseleave": onBlockLeave
502
- },
503
- [
504
- vue.h(definition.component, { ...definition.schema.defaults, ...block.props }),
505
- vue.h("div", { class: "blox-block-overlay" }),
506
- (isSelected || isHovered) && vue.h(
507
- "div",
508
- {
509
- class: ["blox-block-label", isSelected && "blox-block-label--selected"]
510
- },
511
- label
512
- )
513
- ]
514
- )
515
- ];
516
- })
517
- );
518
- }
519
- });
520
- const _hoisted_1 = { class: "blox-preview-root" };
521
- const _sfc_main = /* @__PURE__ */ vue.defineComponent({
522
- __name: "PreviewApp",
523
- setup(__props) {
524
- const registry = vue.inject(BLOX_REGISTRY_KEY, {});
525
- const { setLocale } = useLocale();
526
- const blocks = vue.ref([]);
527
- const contexts = vue.ref({});
528
- const selectedIndex = vue.ref(null);
529
- const hoveredIndex = vue.ref(null);
530
- vue.provide("contexts", contexts);
531
- let heightObserver = null;
532
- function onMessage(event) {
533
- var _a;
534
- const msg = event.data;
535
- switch (msg.type) {
536
- case "BLOX_INIT":
537
- blocks.value = ((_a = msg.page.page.content) == null ? void 0 : _a.blocks) ?? [];
538
- contexts.value = msg.page.contexts ?? {};
539
- setLocale(msg.locale);
540
- break;
541
- case "BLOX_SET_LOCALE":
542
- setLocale(msg.locale);
543
- break;
544
- case "BLOX_SET_BLOCKS":
545
- blocks.value = msg.blocks;
546
- break;
547
- case "BLOX_SELECT_BLOCK":
548
- selectedIndex.value = msg.index;
549
- if (msg.index !== null) {
550
- vue.nextTick(() => {
551
- const el = document.querySelector(`[data-blox-index="${msg.index}"]`);
552
- el == null ? void 0 : el.scrollIntoView({ behavior: "smooth", block: "center" });
553
- });
554
- }
555
- break;
556
- case "BLOX_HOVER_BLOCK":
557
- hoveredIndex.value = msg.index;
558
- break;
559
- }
560
- }
561
- vue.onMounted(() => {
562
- window.addEventListener("message", onMessage);
563
- heightObserver = new ResizeObserver(() => {
564
- sendToEditor({ type: "BLOX_HEIGHT", height: document.body.scrollHeight });
565
- });
566
- heightObserver.observe(document.body);
567
- sendToEditor({
568
- type: "BLOX_READY",
569
- registry: Object.fromEntries(Object.entries(registry).map(([key, def]) => [key, def.schema]))
570
- });
571
- });
572
- vue.onUnmounted(() => {
573
- window.removeEventListener("message", onMessage);
574
- heightObserver == null ? void 0 : heightObserver.disconnect();
575
- });
576
- return (_ctx, _cache) => {
577
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
578
- vue.createVNode(vue.unref(PreviewRenderer), {
579
- blocks: blocks.value,
580
- "selected-index": selectedIndex.value,
581
- "hovered-index": hoveredIndex.value
582
- }, null, 8, ["blocks", "selected-index", "hovered-index"])
583
- ]);
584
- };
585
- }
586
- });
587
- exports.BLOX_CONFIG_KEY = BLOX_CONFIG_KEY;
588
- exports.BLOX_LOCALE_STRATEGY_KEY = BLOX_LOCALE_STRATEGY_KEY;
589
- exports.BloxInstance = BloxInstance;
590
- exports.CmsPageView = _sfc_main$2;
591
- exports.PageRenderer = PageRenderer;
592
- exports.PreviewApp = _sfc_main;
593
- exports.PreviewRenderer = PreviewRenderer;
594
- exports.configureApi = configureApi;
595
- exports.createBlox = createBlox;
93
+ exports.BLOX_CONFIG_KEY = core.BLOX_CONFIG_KEY;
94
+ exports.BLOX_LOCALE_STRATEGY_KEY = core.BLOX_LOCALE_STRATEGY_KEY;
95
+ exports.BloxInstance = core.BloxInstance;
96
+ exports.CmsPageView = core._sfc_main;
97
+ exports.PageRenderer = core.PageRenderer;
98
+ exports.configureApi = core.configureApi;
99
+ exports.createBlox = core.createBlox;
100
+ exports.listItems = core.listItems;
101
+ exports.resolvePath = core.resolvePath;
102
+ exports.useLocale = core.useLocale;
103
+ exports.PreviewApp = PreviewApp_vue_vue_type_style_index_0_lang._sfc_main;
104
+ exports.PreviewRenderer = PreviewApp_vue_vue_type_style_index_0_lang.PreviewRenderer;
105
+ exports.sendToEditor = PreviewApp_vue_vue_type_style_index_0_lang.sendToEditor;
106
+ exports.sendToPreview = PreviewApp_vue_vue_type_style_index_0_lang.sendToPreview;
107
+ exports.createBloxApp = createBloxApp;
596
108
  exports.defineBlock = defineBlock;
597
- exports.listItems = listItems;
598
- exports.resolvePath = resolvePath;
599
- exports.sendToEditor = sendToEditor;
600
- exports.sendToPreview = sendToPreview;
601
- exports.useLocale = useLocale;
602
109
  exports.useLocaleNav = useLocaleNav;
603
110
  exports.usePageContext = usePageContext;
package/dist/index.d.ts CHANGED
@@ -10,6 +10,8 @@ export { useLocaleNav } from './composables/useLocaleNav';
10
10
  export { usePageContext } from './composables/usePageContext';
11
11
  export { BloxInstance, createBlox } from './core';
12
12
  export type { BloxComponent, BloxOptions } from './core';
13
+ export { createBloxApp } from './createBloxApp';
14
+ export type { BloxAppResult, CreateBloxAppOptions } from './createBloxApp';
13
15
  export { defineBlock } from './defineBlock';
14
16
  export type { BlockMeta, BlockModule } from './defineBlock';
15
17
  export type { LocaleStrategy } from './localeStrategy';