@orion-studios/payload-studio 0.5.0-beta.113 → 0.5.0-beta.114

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 (42) hide show
  1. package/dist/admin/client.js +1915 -490
  2. package/dist/admin/client.mjs +1327 -445
  3. package/dist/admin/index.d.mts +2 -1
  4. package/dist/admin/index.d.ts +2 -1
  5. package/dist/admin/index.js +253 -50
  6. package/dist/admin/index.mjs +1 -1
  7. package/dist/admin-app/client.d.mts +1 -0
  8. package/dist/admin-app/client.d.ts +1 -0
  9. package/dist/admin-app/client.js +266 -105
  10. package/dist/admin-app/client.mjs +105 -456
  11. package/dist/admin-app/index.d.mts +2 -1
  12. package/dist/admin-app/index.d.ts +2 -1
  13. package/dist/admin-app/styles.css +351 -0
  14. package/dist/admin.css +9 -0
  15. package/dist/{chunk-DAIZDGHL.mjs → chunk-4YPHQYRR.mjs} +253 -50
  16. package/dist/chunk-6NE7GIVT.mjs +555 -0
  17. package/dist/{chunk-3T2P6SDM.mjs → chunk-XKUTZ7IU.mjs} +215 -6
  18. package/dist/{index-DUi_XND6.d.ts → index-Crx_MtPw.d.ts} +33 -3
  19. package/dist/{index-gLl_358v.d.mts → index-Cv-6qnrw.d.mts} +33 -3
  20. package/dist/index-D5yjivF7.d.ts +382 -0
  21. package/dist/index-DH9KGEZ8.d.mts +382 -0
  22. package/dist/{index-BzKOThsI.d.mts → index-DWmudwDm.d.mts} +1 -1
  23. package/dist/{index-BzKOThsI.d.ts → index-DWmudwDm.d.ts} +1 -1
  24. package/dist/{index-7lxTrxSG.d.mts → index-c5-qTRbH.d.mts} +7 -1
  25. package/dist/{index-7lxTrxSG.d.ts → index-yfpxsgUu.d.ts} +7 -1
  26. package/dist/index.d.mts +5 -4
  27. package/dist/index.d.ts +5 -4
  28. package/dist/index.js +459 -56
  29. package/dist/index.mjs +9 -9
  30. package/dist/nextjs/index.mjs +2 -2
  31. package/dist/sitePreviewTypes-BECnq9xI.d.mts +41 -0
  32. package/dist/sitePreviewTypes-BECnq9xI.d.ts +41 -0
  33. package/dist/studio/index.d.mts +1 -1
  34. package/dist/studio/index.d.ts +1 -1
  35. package/dist/studio-pages/index.d.mts +3 -3
  36. package/dist/studio-pages/index.d.ts +3 -3
  37. package/dist/studio-pages/index.js +330 -7
  38. package/dist/studio-pages/index.mjs +10 -3
  39. package/package.json +1 -1
  40. package/dist/index-B7QvY3yF.d.mts +0 -245
  41. package/dist/index-BK03FiEM.d.ts +0 -245
  42. package/dist/{chunk-BET2YLAS.mjs → chunk-OTHERBGX.mjs} +3 -3
@@ -1,3 +1,4 @@
1
- export { A as AdminConfig, C as CreateSocialMediaConnectionsFieldOptions, a as CreateSocialMediaGlobalOptions, R as ResolvedStudioSection, S as StudioSection, b as StudioSectionCard, c as StudioSectionComponent, d as StudioSectionRole, e as StudioSectionView, f as configureAdmin, g as createHeaderNavItemsField, h as createSocialMediaConnectionsField, j as createSocialMediaGlobal, k as createThemePreferenceField, s as socialMediaConnectionsField, t as themePreferenceField, w as withTooltips } from '../index-B7QvY3yF.mjs';
1
+ export { A as AdminConfig, a as AdminStudioConfig, b as AdminStudioFooterPreviewConfig, c as AdminStudioHeaderPreviewConfig, d as AdminStudioSitePreviewConfig, C as CreateSocialMediaConnectionsFieldOptions, e as CreateSocialMediaGlobalOptions, R as ResolvedStudioSection, S as StudioGlobalLink, f as StudioSection, g as StudioSectionCard, h as StudioSectionComponent, j as StudioSectionRole, k as StudioSectionView, l as configureAdmin, m as createHeaderNavItemsField, n as createSocialMediaConnectionsField, o as createSocialMediaGlobal, p as createThemePreferenceField, s as socialMediaConnectionsField, t as themePreferenceField, w as withTooltips } from '../index-DH9KGEZ8.mjs';
2
2
  export { b as SOCIAL_MEDIA_DEFAULT_ICON_BY_PLATFORM, c as SOCIAL_MEDIA_ICON_OPTIONS, d as SOCIAL_MEDIA_PLATFORMS, e as SOCIAL_MEDIA_PLATFORM_LABELS, S as SocialMediaGlobalData, f as SocialMediaIconLibrary, g as SocialMediaIconOption, a as SocialMediaPlatform, h as SocialMediaProfileData, i as SocialMediaProfilesData } from '../socialMedia-C05Iy-SV.mjs';
3
3
  import 'payload';
4
+ import '../sitePreviewTypes-BECnq9xI.mjs';
@@ -1,3 +1,4 @@
1
- export { A as AdminConfig, C as CreateSocialMediaConnectionsFieldOptions, a as CreateSocialMediaGlobalOptions, R as ResolvedStudioSection, S as StudioSection, b as StudioSectionCard, c as StudioSectionComponent, d as StudioSectionRole, e as StudioSectionView, f as configureAdmin, g as createHeaderNavItemsField, h as createSocialMediaConnectionsField, j as createSocialMediaGlobal, k as createThemePreferenceField, s as socialMediaConnectionsField, t as themePreferenceField, w as withTooltips } from '../index-BK03FiEM.js';
1
+ export { A as AdminConfig, a as AdminStudioConfig, b as AdminStudioFooterPreviewConfig, c as AdminStudioHeaderPreviewConfig, d as AdminStudioSitePreviewConfig, C as CreateSocialMediaConnectionsFieldOptions, e as CreateSocialMediaGlobalOptions, R as ResolvedStudioSection, S as StudioGlobalLink, f as StudioSection, g as StudioSectionCard, h as StudioSectionComponent, j as StudioSectionRole, k as StudioSectionView, l as configureAdmin, m as createHeaderNavItemsField, n as createSocialMediaConnectionsField, o as createSocialMediaGlobal, p as createThemePreferenceField, s as socialMediaConnectionsField, t as themePreferenceField, w as withTooltips } from '../index-D5yjivF7.js';
2
2
  export { b as SOCIAL_MEDIA_DEFAULT_ICON_BY_PLATFORM, c as SOCIAL_MEDIA_ICON_OPTIONS, d as SOCIAL_MEDIA_PLATFORMS, e as SOCIAL_MEDIA_PLATFORM_LABELS, S as SocialMediaGlobalData, f as SocialMediaIconLibrary, g as SocialMediaIconOption, a as SocialMediaPlatform, h as SocialMediaProfileData, i as SocialMediaProfilesData } from '../socialMedia-C05Iy-SV.js';
3
3
  import 'payload';
4
+ import '../sitePreviewTypes-BECnq9xI.js';
@@ -208,13 +208,19 @@ function configureAdmin(config) {
208
208
  const formSubmissionsCollectionSlug = config.studio?.forms?.submissionsCollectionSlug || "form-submissions";
209
209
  const formUploadsCollectionSlug = config.studio?.forms?.uploadsCollectionSlug || "form-uploads";
210
210
  const pagesCollectionSlug = config.studio?.pages?.collectionSlug || "pages";
211
+ const builderBasePath = config.studio?.pages?.builderBasePath || "/builder";
211
212
  const mediaCollectionSlug = config.studio?.media?.collectionSlug || "media";
212
- const contactFormStudioPath = "/studio-contact-form";
213
+ const globalsBasePath = "/globals";
214
+ const pagesBasePath = "/pages";
215
+ const formsBasePath = "/forms";
216
+ const mediaBasePath = "/media";
217
+ const toolsBasePath = "/tools";
218
+ const contactFormStudioPath = "/contact-form";
213
219
  const configuredGlobals = config.studio?.globals || [
214
220
  { slug: "site-settings", label: "Website Settings" },
215
221
  { slug: "header", label: "Header & Navigation" },
216
222
  { slug: "footer", label: "Footer" },
217
- { slug: "contact-form", label: "Contact Form" }
223
+ { slug: "social-media", label: "Social Media" }
218
224
  ];
219
225
  const globals = configuredGlobals.map((global) => {
220
226
  if (global.slug !== "contact-form" || global.href) {
@@ -227,6 +233,7 @@ function configureAdmin(config) {
227
233
  });
228
234
  const studioSections = resolveStudioSections(config.studio?.sections || []);
229
235
  const studioSectionViews = resolveStudioSectionViews(config.studio?.sections || []);
236
+ const sitePreview = config.studio?.sitePreview;
230
237
  let cssPath;
231
238
  const pkgDist = getPkgDistDir();
232
239
  const sourceCssPath = import_path.default.resolve(pkgDist, "admin.css");
@@ -245,6 +252,50 @@ function configureAdmin(config) {
245
252
  cssPath = sourceCssPath;
246
253
  }
247
254
  const clientPath = "@orion-studios/payload-studio/admin/client";
255
+ const studioNavClientProps = {
256
+ brandName,
257
+ formSubmissionsCollectionSlug,
258
+ formsCollectionSlug,
259
+ formsEnabled,
260
+ formUploadsCollectionSlug,
261
+ globalsBasePath,
262
+ globalsExtraMatchPrefixes: [contactFormStudioPath],
263
+ logoUrl,
264
+ mediaCollectionSlug,
265
+ pagesCollectionSlug,
266
+ sections: studioSections
267
+ };
268
+ const studioBackBreadcrumbComponent = {
269
+ exportName: "StudioBackBreadcrumb",
270
+ path: clientPath
271
+ };
272
+ const hasMatchingComponent = (items, exportName) => Array.isArray(items) && items.some(
273
+ (item) => item && typeof item === "object" && item.exportName === exportName && item.path === clientPath
274
+ );
275
+ const appendComponent = (items, component, exportName) => hasMatchingComponent(items, exportName) ? items || [] : [...items || [], component];
276
+ const attachStudioBackBreadcrumbToCollection = (collection) => {
277
+ if (!studioEnabled) {
278
+ return collection;
279
+ }
280
+ const existingBeforeDocumentControls = collection.admin?.components?.edit?.beforeDocumentControls;
281
+ return {
282
+ ...collection,
283
+ admin: {
284
+ ...collection.admin,
285
+ components: {
286
+ ...collection.admin?.components,
287
+ edit: {
288
+ ...collection.admin?.components?.edit,
289
+ beforeDocumentControls: appendComponent(
290
+ existingBeforeDocumentControls,
291
+ studioBackBreadcrumbComponent,
292
+ "StudioBackBreadcrumb"
293
+ )
294
+ }
295
+ }
296
+ }
297
+ };
298
+ };
248
299
  return {
249
300
  admin: {
250
301
  css: cssPath,
@@ -253,19 +304,7 @@ function configureAdmin(config) {
253
304
  Nav: {
254
305
  exportName: "AdminStudioNav",
255
306
  path: clientPath,
256
- clientProps: {
257
- brandName,
258
- logoUrl,
259
- globalsBasePath: "/studio-globals",
260
- globalsExtraMatchPrefixes: [contactFormStudioPath],
261
- formSubmissionsCollectionSlug,
262
- formsCollectionSlug,
263
- formsEnabled,
264
- formUploadsCollectionSlug,
265
- mediaCollectionSlug,
266
- pagesCollectionSlug,
267
- sections: studioSections
268
- }
307
+ clientProps: studioNavClientProps
269
308
  }
270
309
  } : {},
271
310
  graphics: {
@@ -291,51 +330,64 @@ function configureAdmin(config) {
291
330
  Component: {
292
331
  exportName: studioEnabled ? "AdminStudioDashboard" : "Dashboard",
293
332
  path: clientPath,
294
- clientProps: {
295
- brandName,
296
- logoUrl,
297
- globalsBasePath: "/studio-globals",
298
- globalsExtraMatchPrefixes: [contactFormStudioPath],
299
- formSubmissionsCollectionSlug,
300
- formsCollectionSlug,
301
- formsEnabled,
302
- formUploadsCollectionSlug,
303
- mediaCollectionSlug,
304
- pagesCollectionSlug,
305
- sections: studioSections
306
- }
333
+ clientProps: studioNavClientProps
307
334
  }
308
335
  },
309
336
  ...studioEnabled ? {
310
337
  studioGlobals: {
311
- path: "/studio-globals",
338
+ path: globalsBasePath,
312
339
  Component: {
313
340
  exportName: "AdminStudioGlobalsView",
314
341
  path: clientPath,
315
342
  clientProps: {
343
+ ...studioNavClientProps,
316
344
  globals,
317
- globalsBasePath: "/studio-globals"
345
+ globalsBasePath
346
+ }
347
+ }
348
+ },
349
+ studioPages: {
350
+ path: pagesBasePath,
351
+ Component: {
352
+ exportName: "AdminStudioPagesListView",
353
+ path: clientPath,
354
+ clientProps: {
355
+ ...studioNavClientProps,
356
+ pagesCollectionSlug
357
+ }
358
+ }
359
+ },
360
+ studioPageEditor: {
361
+ path: `${pagesBasePath}/:id`,
362
+ Component: {
363
+ exportName: "AdminStudioPageEditView",
364
+ path: clientPath,
365
+ clientProps: {
366
+ ...studioNavClientProps,
367
+ builderBasePath
318
368
  }
319
369
  }
320
370
  },
321
371
  studioContactForm: {
322
- path: "/studio-contact-form",
372
+ path: contactFormStudioPath,
323
373
  Component: {
324
374
  exportName: "AdminStudioContactFormView",
325
375
  path: clientPath,
326
376
  clientProps: {
377
+ ...studioNavClientProps,
327
378
  globalSlug: "contact-form",
328
- globalsBasePath: "/studio-globals"
379
+ globalsBasePath
329
380
  }
330
381
  }
331
382
  },
332
383
  ...formsEnabled ? {
333
384
  studioForms: {
334
- path: "/studio-forms",
385
+ path: formsBasePath,
335
386
  Component: {
336
387
  exportName: "AdminStudioFormsView",
337
388
  path: clientPath,
338
389
  clientProps: {
390
+ ...studioNavClientProps,
339
391
  formsCollectionSlug,
340
392
  formSubmissionsCollectionSlug,
341
393
  formUploadsCollectionSlug
@@ -343,12 +395,41 @@ function configureAdmin(config) {
343
395
  }
344
396
  }
345
397
  } : {},
398
+ studioMedia: {
399
+ path: mediaBasePath,
400
+ Component: {
401
+ exportName: "AdminStudioMediaView",
402
+ path: clientPath,
403
+ clientProps: {
404
+ ...studioNavClientProps,
405
+ mediaCollectionSlug
406
+ }
407
+ }
408
+ },
409
+ studioTools: {
410
+ path: toolsBasePath,
411
+ Component: {
412
+ exportName: "AdminStudioToolsView",
413
+ path: clientPath,
414
+ clientProps: {
415
+ ...studioNavClientProps,
416
+ mediaCollectionSlug,
417
+ pagesCollectionSlug
418
+ }
419
+ }
420
+ },
346
421
  ...Object.fromEntries(
347
422
  Object.entries(studioSectionViews).map(([id, view]) => [
348
423
  id,
349
424
  {
350
425
  path: view.path,
351
- Component: view.Component
426
+ Component: {
427
+ ...view.Component,
428
+ clientProps: {
429
+ ...studioNavClientProps,
430
+ ...view.Component.clientProps || {}
431
+ }
432
+ }
352
433
  }
353
434
  ])
354
435
  )
@@ -386,10 +467,76 @@ function configureAdmin(config) {
386
467
  const hasThemePreference = existingFields.some(
387
468
  (field) => typeof field === "object" && field !== null && "name" in field && field.name === "themePreference"
388
469
  );
389
- return {
470
+ const nextCollection = {
390
471
  ...usersCollection,
391
472
  fields: hasThemePreference ? existingFields : [...existingFields, createThemePreferenceField(defaultTheme)]
392
473
  };
474
+ return attachStudioBackBreadcrumbToCollection(nextCollection);
475
+ },
476
+ wrapPagesCollection(pagesCollection) {
477
+ if (!studioEnabled) {
478
+ return pagesCollection;
479
+ }
480
+ const collectionWithBreadcrumb = attachStudioBackBreadcrumbToCollection(pagesCollection);
481
+ const existingEditMenuItems = collectionWithBreadcrumb.admin?.components?.edit?.editMenuItems;
482
+ const existingViews = collectionWithBreadcrumb.admin?.components?.views;
483
+ const existingEditViews = existingViews?.edit;
484
+ const hasCustomEditView = Boolean(
485
+ existingEditViews?.root || existingEditViews?.default && typeof existingEditViews.default === "object" && existingEditViews.default.Component
486
+ );
487
+ return {
488
+ ...collectionWithBreadcrumb,
489
+ admin: {
490
+ ...collectionWithBreadcrumb.admin,
491
+ components: {
492
+ ...collectionWithBreadcrumb.admin?.components,
493
+ edit: {
494
+ ...collectionWithBreadcrumb.admin?.components?.edit,
495
+ editMenuItems: appendComponent(
496
+ existingEditMenuItems,
497
+ {
498
+ exportName: "OpenInStudioMenuItem",
499
+ path: clientPath,
500
+ clientProps: {
501
+ pagesPathBase: pagesBasePath
502
+ }
503
+ },
504
+ "OpenInStudioMenuItem"
505
+ )
506
+ },
507
+ views: {
508
+ ...existingViews,
509
+ ...hasCustomEditView ? {} : {
510
+ edit: {
511
+ ...existingEditViews,
512
+ default: {
513
+ ...typeof existingEditViews?.default === "object" ? existingEditViews.default : {},
514
+ Component: {
515
+ exportName: "PageEditRedirectToStudio",
516
+ path: clientPath,
517
+ clientProps: {
518
+ pagesPathBase: pagesBasePath
519
+ }
520
+ }
521
+ }
522
+ }
523
+ }
524
+ }
525
+ }
526
+ }
527
+ };
528
+ },
529
+ wrapMediaCollection(mediaCollection) {
530
+ return attachStudioBackBreadcrumbToCollection(mediaCollection);
531
+ },
532
+ wrapFormsCollection(formsCollection) {
533
+ return attachStudioBackBreadcrumbToCollection(formsCollection);
534
+ },
535
+ wrapFormSubmissionsCollection(formSubmissionsCollection) {
536
+ return attachStudioBackBreadcrumbToCollection(formSubmissionsCollection);
537
+ },
538
+ wrapFormUploadsCollection(formUploadsCollection) {
539
+ return attachStudioBackBreadcrumbToCollection(formUploadsCollection);
393
540
  },
394
541
  wrapGlobals(globals2) {
395
542
  const labelMap = {
@@ -403,24 +550,74 @@ function configureAdmin(config) {
403
550
  const mapping = labelMap[global.slug];
404
551
  if (!mapping) return global;
405
552
  const shouldAttachContactFormRedirect = studioEnabled && global.slug === "contact-form";
553
+ const shouldAttachHeaderEditView = studioEnabled && global.slug === "header";
554
+ const shouldAttachFooterEditView = studioEnabled && global.slug === "footer";
406
555
  const existingViews = global.admin?.components?.views;
407
556
  const existingEditViews = existingViews?.edit;
408
557
  const hasCustomContactFormEditView = Boolean(
409
558
  existingEditViews?.root || existingEditViews?.default && typeof existingEditViews.default === "object" && existingEditViews.default.Component
410
559
  );
411
- const contactFormEditViews = shouldAttachContactFormRedirect && !hasCustomContactFormEditView ? {
412
- ...existingEditViews,
413
- default: {
414
- ...typeof existingEditViews?.default === "object" ? existingEditViews.default : {},
415
- Component: {
416
- exportName: "StudioContactFormRedirect",
417
- path: clientPath,
418
- clientProps: {
419
- studioContactFormPath: contactFormStudioPath
560
+ const nextEditViews = (() => {
561
+ if (shouldAttachHeaderEditView && !hasCustomContactFormEditView) {
562
+ return {
563
+ ...existingEditViews,
564
+ default: {
565
+ ...typeof existingEditViews?.default === "object" ? existingEditViews.default : {},
566
+ Component: {
567
+ exportName: "AdminStudioHeaderGlobalView",
568
+ path: clientPath,
569
+ clientProps: {
570
+ ...studioNavClientProps,
571
+ actionHref: sitePreview?.header?.actionHref,
572
+ actionLabel: sitePreview?.header?.actionLabel,
573
+ globalSlug: global.slug,
574
+ locationSummary: sitePreview?.locationSummary,
575
+ pagesCollectionSlug
576
+ }
577
+ }
420
578
  }
421
- }
579
+ };
580
+ }
581
+ if (shouldAttachFooterEditView && !hasCustomContactFormEditView) {
582
+ return {
583
+ ...existingEditViews,
584
+ default: {
585
+ ...typeof existingEditViews?.default === "object" ? existingEditViews.default : {},
586
+ Component: {
587
+ exportName: "AdminStudioFooterGlobalView",
588
+ path: clientPath,
589
+ clientProps: {
590
+ ...studioNavClientProps,
591
+ builtByHref: sitePreview?.footer?.builtByHref,
592
+ builtByLabel: sitePreview?.footer?.builtByLabel,
593
+ description: sitePreview?.footer?.description,
594
+ footerCategories: sitePreview?.footer?.footerCategories,
595
+ footerLinks: sitePreview?.footer?.footerLinks,
596
+ globalSlug: global.slug,
597
+ locationSummary: sitePreview?.locationSummary
598
+ }
599
+ }
600
+ }
601
+ };
602
+ }
603
+ if (shouldAttachContactFormRedirect && !hasCustomContactFormEditView) {
604
+ return {
605
+ ...existingEditViews,
606
+ default: {
607
+ ...typeof existingEditViews?.default === "object" ? existingEditViews.default : {},
608
+ Component: {
609
+ exportName: "StudioContactFormRedirect",
610
+ path: clientPath,
611
+ clientProps: {
612
+ studioContactFormPath: contactFormStudioPath
613
+ }
614
+ }
615
+ }
616
+ };
422
617
  }
423
- } : existingEditViews;
618
+ return existingEditViews;
619
+ })();
620
+ const existingBeforeDocumentControls = global.admin?.components?.elements?.beforeDocumentControls;
424
621
  return {
425
622
  ...global,
426
623
  admin: {
@@ -428,12 +625,18 @@ function configureAdmin(config) {
428
625
  group: mapping.group,
429
626
  components: {
430
627
  ...global.admin?.components,
431
- ...shouldAttachContactFormRedirect ? {
628
+ elements: {
629
+ ...global.admin?.components?.elements,
630
+ beforeDocumentControls: studioEnabled ? appendComponent(
631
+ existingBeforeDocumentControls,
632
+ studioBackBreadcrumbComponent,
633
+ "StudioBackBreadcrumb"
634
+ ) : existingBeforeDocumentControls
635
+ },
636
+ ...nextEditViews ? {
432
637
  views: {
433
638
  ...existingViews,
434
- ...contactFormEditViews ? {
435
- edit: contactFormEditViews
436
- } : {}
639
+ edit: nextEditViews
437
640
  }
438
641
  } : {}
439
642
  }
@@ -7,7 +7,7 @@ import {
7
7
  socialMediaConnectionsField,
8
8
  themePreferenceField,
9
9
  withTooltips
10
- } from "../chunk-DAIZDGHL.mjs";
10
+ } from "../chunk-4YPHQYRR.mjs";
11
11
  import {
12
12
  SOCIAL_MEDIA_DEFAULT_ICON_BY_PLATFORM,
13
13
  SOCIAL_MEDIA_ICON_OPTIONS,
@@ -5,3 +5,4 @@ export { MediaDetailPanel } from './components/MediaDetailPanel'
5
5
  export { MediaListItem } from './components/MediaListItem'
6
6
  export { MediaUploadForm } from './components/MediaUploadForm'
7
7
  export { PageEditorFrame } from './components/PageEditorFrame'
8
+ export { SiteFooterPreview, SiteHeaderPreview } from './components/SitePreview'
@@ -5,3 +5,4 @@ export { MediaDetailPanel } from './components/MediaDetailPanel'
5
5
  export { MediaListItem } from './components/MediaListItem'
6
6
  export { MediaUploadForm } from './components/MediaUploadForm'
7
7
  export { PageEditorFrame } from './components/PageEditorFrame'
8
+ export { SiteFooterPreview, SiteHeaderPreview } from './components/SitePreview'