@orion-studios/payload-studio 0.5.0-beta.98 → 0.6.0-beta.1

package/dist/studio-pages/index.mjs

@@ -1,24 +1,33 @@
 import {
-  createDefaultStudioDocument,
-  defaultBuilderThemeTokens,
-  layoutToStudioDocument,
+  createStudioPageService,
+  getStudioDocumentFromPage,
   pageInspectorPanels,
   pageNodeTypes,
   pagePaletteGroups,
   pageStudioModuleManifest,
   resolveBuilderThemeTokens,
+  toEditorInitialDoc
+} from "../chunk-XKUTZ7IU.mjs";
+import "../chunk-OQSEJXC4.mjs";
+import {
+  createDefaultStudioDocument,
+  defaultBuilderThemeTokens,
+  layoutToStudioDocument,
   studioDocumentToLayout
-} from "../chunk-C4J35SPJ.mjs";
-import "../chunk-SIL2J5MF.mjs";
+} from "../chunk-PF3EBZXF.mjs";
+import "../chunk-ADIIWIYL.mjs";
 import "../chunk-6BWS3CLP.mjs";
 export {
   createDefaultStudioDocument,
+  createStudioPageService,
   defaultBuilderThemeTokens,
+  getStudioDocumentFromPage,
   layoutToStudioDocument,
   pageInspectorPanels,
   pageNodeTypes,
   pagePaletteGroups,
   pageStudioModuleManifest,
   resolveBuilderThemeTokens,
-  studioDocumentToLayout
+  studioDocumentToLayout,
+  toEditorInitialDoc
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@orion-studios/payload-studio",
-  "version": "0.5.0-beta.98",
-  "description": "Unified Payload CMS toolkit for Orion Studios",
+  "version": "0.6.0-beta.1",
+  "description": "Base CMS, builder, and custom admin toolkit for Orion Studios websites",
   "types": "./dist/index.d.ts",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
@@ -75,11 +75,19 @@
     "dist"
   ],
   "scripts": {
-    "build": "tsup && node -e \"const fs=require('fs'); fs.copyFileSync('src/admin/styles/admin.css','dist/admin.css'); fs.mkdirSync('dist/admin-app',{recursive:true}); fs.copyFileSync('src/admin-app/styles/admin-app.css','dist/admin-app/styles.css'); fs.mkdirSync('dist/studio-pages',{recursive:true}); fs.copyFileSync('src/studio-pages/styles/builder.css','dist/studio-pages/builder.css'); fs.mkdirSync('dist/admin',{recursive:true}); fs.copyFileSync('src/admin/client.d.ts','dist/admin/client.d.ts'); fs.copyFileSync('src/admin/client.d.ts','dist/admin/client.d.mts'); fs.copyFileSync('src/admin-app/client.d.ts','dist/admin-app/client.d.ts'); fs.copyFileSync('src/admin-app/client.d.ts','dist/admin-app/client.d.mts'); fs.copyFileSync('src/studio-pages/client.d.ts','dist/studio-pages/client.d.ts'); fs.copyFileSync('src/studio-pages/client.d.ts','dist/studio-pages/client.d.mts')\"",
+    "build": "tsup && node scripts/copy-assets.mjs",
     "dev": "tsup --watch",
-    "test": "tsx --test src/studio-pages/builder/settings-v2/__tests__/*.test.ts src/studio-pages/__tests__/*.test.ts",
+    "test": "tsx --test src/shared/__tests__/*.test.ts src/studio-pages/builder/settings-v2/__tests__/*.test.ts src/studio-pages/__tests__/*.test.ts",
     "typecheck": "tsc --noEmit"
   },
+  "overrides": {
+    "ajv": "^8.18.0",
+    "dompurify": "^3.3.3",
+    "file-type": "^21.3.3",
+    "immutable": "^4.3.8",
+    "rollup": "^4.59.0",
+    "undici": "^7.24.4"
+  },
   "keywords": [
     "payload",
     "cms",
@@ -90,6 +98,11 @@
   ],
   "author": "Orion Studios",
   "license": "MIT",
+  "sideEffects": [
+    "./dist/admin.css",
+    "./dist/admin-app/styles.css",
+    "./dist/studio-pages/builder.css"
+  ],
   "peerDependencies": {
     "@payloadcms/richtext-lexical": "^3.0.0",
     "@payloadcms/ui": "^3.0.0",
@@ -101,9 +114,10 @@
   "devDependencies": {
     "@payloadcms/richtext-lexical": "3.75.0",
     "@payloadcms/ui": "3.75.0",
+    "@types/node": "^22.0.0",
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
-    "next": "16.1.6",
+    "next": "16.2.0",
     "payload": "3.75.0",
     "tsx": "^4.21.0",
     "tsup": "^8.0.0",

package/dist/chunk-2FO2ROW4.mjs

@@ -1,468 +0,0 @@
-import {
-  SOCIAL_MEDIA_DEFAULT_ICON_BY_PLATFORM,
-  SOCIAL_MEDIA_ICON_OPTIONS,
-  SOCIAL_MEDIA_PLATFORMS,
-  SOCIAL_MEDIA_PLATFORM_LABELS
-} from "./chunk-ZTXJG4K5.mjs";
-import {
-  __export,
-  __require
-} from "./chunk-6BWS3CLP.mjs";
-
-// src/admin/index.ts
-var admin_exports = {};
-__export(admin_exports, {
-  SOCIAL_MEDIA_DEFAULT_ICON_BY_PLATFORM: () => SOCIAL_MEDIA_DEFAULT_ICON_BY_PLATFORM,
-  SOCIAL_MEDIA_ICON_OPTIONS: () => SOCIAL_MEDIA_ICON_OPTIONS,
-  SOCIAL_MEDIA_PLATFORMS: () => SOCIAL_MEDIA_PLATFORMS,
-  SOCIAL_MEDIA_PLATFORM_LABELS: () => SOCIAL_MEDIA_PLATFORM_LABELS,
-  configureAdmin: () => configureAdmin,
-  createHeaderNavItemsField: () => createHeaderNavItemsField,
-  createSocialMediaConnectionsField: () => createSocialMediaConnectionsField,
-  createSocialMediaGlobal: () => createSocialMediaGlobal,
-  createThemePreferenceField: () => createThemePreferenceField,
-  socialMediaConnectionsField: () => socialMediaConnectionsField,
-  themePreferenceField: () => themePreferenceField,
-  withTooltips: () => withTooltips
-});
-
-// src/admin/helpers/configureAdmin.ts
-import fs from "fs";
-import path from "path";
-import { fileURLToPath } from "url";
-
-// src/admin/fields/themePreference.ts
-var createThemePreferenceField = (defaultTheme = "brand-light") => ({
-  name: "themePreference",
-  type: "select",
-  defaultValue: defaultTheme,
-  options: [
-    { label: "Light", value: "light" },
-    { label: "Dark", value: "dark" },
-    { label: "Brand Light", value: "brand-light" },
-    { label: "Brand Dark", value: "brand-dark" }
-  ],
-  admin: {
-    position: "sidebar",
-    condition: () => false
-  }
-});
-var themePreferenceField = createThemePreferenceField("brand-light");
-
-// src/admin/helpers/configureAdmin.ts
-function getPkgDistDir() {
-  try {
-    if (typeof import.meta?.url === "string") {
-      return path.dirname(fileURLToPath(import.meta.url));
-    }
-  } catch {
-  }
-  if (typeof __dirname === "string") {
-    return __dirname;
-  }
-  try {
-    const pkgJson = __require.resolve("@orion-studios/payload-studio/package.json");
-    return path.resolve(path.dirname(pkgJson), "dist");
-  } catch {
-    return process.cwd();
-  }
-}
-function configureAdmin(config) {
-  const {
-    brandName,
-    brandPrimary = "#3b82f6",
-    brandSecondary = "#8b5cf6",
-    defaultTheme = "brand-light",
-    logoUrl
-  } = config;
-  const studioEnabled = config.studio?.enabled ?? true;
-  const pagesCollectionSlug = config.studio?.pages?.collectionSlug || "pages";
-  const mediaCollectionSlug = config.studio?.media?.collectionSlug || "media";
-  const contactFormStudioPath = "/studio-contact-form";
-  const configuredGlobals = config.studio?.globals || [
-    { slug: "site-settings", label: "Website Settings" },
-    { slug: "header", label: "Header & Navigation" },
-    { slug: "footer", label: "Footer" },
-    { slug: "contact-form", label: "Contact Form" }
-  ];
-  const globals = configuredGlobals.map((global) => {
-    if (global.slug !== "contact-form" || global.href) {
-      return global;
-    }
-    return {
-      ...global,
-      href: contactFormStudioPath
-    };
-  });
-  let cssPath;
-  const pkgDist = getPkgDistDir();
-  const sourceCssPath = path.resolve(pkgDist, "admin.css");
-  if (config.basePath && fs.existsSync(sourceCssPath)) {
-    let css = fs.readFileSync(sourceCssPath, "utf-8");
-    css = css.replace("--brand-primary: #3b82f6;", `--brand-primary: ${brandPrimary};`);
-    css = css.replace("--brand-secondary: #8b5cf6;", `--brand-secondary: ${brandSecondary};`);
-    const genDir = path.resolve(config.basePath, ".generated");
-    if (!fs.existsSync(genDir)) {
-      fs.mkdirSync(genDir, { recursive: true });
-    }
-    const genPath = path.resolve(genDir, "admin.css");
-    fs.writeFileSync(genPath, css);
-    cssPath = genPath;
-  } else {
-    cssPath = sourceCssPath;
-  }
-  const clientPath = "@orion-studios/payload-studio/admin/client";
-  return {
-    admin: {
-      css: cssPath,
-      components: {
-        ...studioEnabled ? {
-          Nav: {
-            exportName: "AdminStudioNav",
-            path: clientPath,
-            clientProps: {
-              brandName,
-              logoUrl,
-              globalsBasePath: "/studio-globals",
-              globalsExtraMatchPrefixes: [contactFormStudioPath],
-              mediaCollectionSlug,
-              pagesCollectionSlug
-            }
-          }
-        } : {},
-        graphics: {
-          Logo: {
-            exportName: "Logo",
-            path: clientPath,
-            clientProps: {
-              brandName,
-              logoUrl
-            }
-          },
-          Icon: {
-            exportName: "Icon",
-            path: clientPath,
-            clientProps: {
-              brandName,
-              logoUrl
-            }
-          }
-        },
-        views: {
-          dashboard: {
-            Component: {
-              exportName: studioEnabled ? "AdminStudioDashboard" : "Dashboard",
-              path: clientPath,
-              clientProps: {
-                brandName,
-                logoUrl,
-                globalsBasePath: "/studio-globals",
-                globalsExtraMatchPrefixes: [contactFormStudioPath],
-                mediaCollectionSlug,
-                pagesCollectionSlug
-              }
-            }
-          },
-          ...studioEnabled ? {
-            studioGlobals: {
-              path: "/studio-globals",
-              Component: {
-                exportName: "AdminStudioGlobalsView",
-                path: clientPath,
-                clientProps: {
-                  globals,
-                  globalsBasePath: "/studio-globals"
-                }
-              }
-            },
-            studioContactForm: {
-              path: "/studio-contact-form",
-              Component: {
-                exportName: "AdminStudioContactFormView",
-                path: clientPath,
-                clientProps: {
-                  globalSlug: "contact-form",
-                  globalsBasePath: "/studio-globals"
-                }
-              }
-            }
-          } : {}
-        },
-        providers: [
-          {
-            exportName: "ThemeProvider",
-            path: clientPath,
-            clientProps: {
-              defaultTheme
-            }
-          }
-        ],
-        afterNavLinks: [
-          {
-            exportName: "ThemeSwitcher",
-            path: clientPath,
-            clientProps: {
-              defaultTheme
-            }
-          }
-        ]
-      },
-      meta: {
-        titleSuffix: ` \u2014 ${brandName}`
-      }
-    },
-    brandName,
-    brandPrimary,
-    brandSecondary,
-    defaultTheme,
-    wrapUsers(usersCollection) {
-      const existingFields = usersCollection.fields || [];
-      const hasThemePreference = existingFields.some(
-        (field) => typeof field === "object" && field !== null && "name" in field && field.name === "themePreference"
-      );
-      return {
-        ...usersCollection,
-        fields: hasThemePreference ? existingFields : [...existingFields, createThemePreferenceField(defaultTheme)]
-      };
-    },
-    wrapGlobals(globals2) {
-      const labelMap = {
-        header: { group: "Site Design", label: "Header & Navigation" },
-        footer: { group: "Site Design", label: "Footer" },
-        "site-settings": { group: "Site Design", label: "Website Settings" },
-        "social-media": { group: "Site Design", label: "Social Media" },
-        "contact-form": { group: "Lead Forms", label: "Contact Form" }
-      };
-      return globals2.map((global) => {
-        const mapping = labelMap[global.slug];
-        if (!mapping) return global;
-        const shouldAttachContactFormRedirect = studioEnabled && global.slug === "contact-form";
-        const existingViews = global.admin?.components?.views;
-        const existingEditViews = existingViews?.edit;
-        const hasCustomContactFormEditView = Boolean(
-          existingEditViews?.root || existingEditViews?.default && typeof existingEditViews.default === "object" && existingEditViews.default.Component
-        );
-        const contactFormEditViews = shouldAttachContactFormRedirect && !hasCustomContactFormEditView ? {
-          ...existingEditViews,
-          default: {
-            ...typeof existingEditViews?.default === "object" ? existingEditViews.default : {},
-            Component: {
-              exportName: "StudioContactFormRedirect",
-              path: clientPath,
-              clientProps: {
-                studioContactFormPath: contactFormStudioPath
-              }
-            }
-          }
-        } : existingEditViews;
-        return {
-          ...global,
-          admin: {
-            ...global.admin,
-            group: mapping.group,
-            components: {
-              ...global.admin?.components,
-              ...shouldAttachContactFormRedirect ? {
-                views: {
-                  ...existingViews,
-                  ...contactFormEditViews ? {
-                    edit: contactFormEditViews
-                  } : {}
-                }
-              } : {}
-            }
-          },
-          label: mapping.label
-        };
-      });
-    }
-  };
-}
-
-// src/admin/helpers/withTooltips.ts
-var defaultTooltips = {
-  title: "The main title displayed on this page.",
-  slug: 'The URL-friendly name for this page (e.g., "about-us"). This appears in the web address.',
-  template: "Choose a layout template. This controls the overall structure of the page.",
-  parent: "Select a parent page to nest this page under. This affects the URL path.",
-  path: "The full URL path for this page. This is automatically generated from the slug and parent.",
-  layout: "Add and arrange content sections on your page. Each section is a building block.",
-  metaTitle: "The title shown in search engine results and browser tabs. Keep under 60 characters.",
-  metaDescription: "A brief summary shown in search results. Keep under 160 characters for best results.",
-  canonicalUrl: "The preferred URL for this page. Used to prevent duplicate content in search engines.",
-  ogImage: "The image shown when this page is shared on social media (Facebook, LinkedIn, etc.).",
-  noIndex: "When enabled, search engines will not list this page in results.",
-  noFollow: "When enabled, search engines will not follow links on this page.",
-  publishedAt: "The date and time this page was first published.",
-  alt: "Describe this image for screen readers and search engines. Be specific and concise.",
-  navItems: "The links shown in your website's navigation menu.",
-  copyright: "The copyright text displayed in your website footer.",
-  contactEmail: "The email address displayed in your footer and contact sections.",
-  contactPhone: "The phone number displayed in your footer and contact sections.",
-  siteName: "Your website's name. Appears in browser tabs and search results.",
-  tagline: "A short phrase describing your business. Used in SEO and site metadata.",
-  canonicalBaseUrl: 'The base URL of your website (e.g., "https://example.com"). Used for generating canonical URLs.'
-};
-function withTooltips(fields, customTooltips) {
-  const tooltips = { ...defaultTooltips, ...customTooltips };
-  return fields.map((field) => addTooltipToField(field, tooltips));
-}
-function addTooltipToField(field, tooltips) {
-  if ("name" in field && field.name && tooltips[field.name]) {
-    const tooltip = tooltips[field.name];
-    const admin = field.admin;
-    if (!admin?.description) {
-      return {
-        ...field,
-        admin: {
-          ...admin,
-          description: tooltip
-        }
-      };
-    }
-  }
-  if ("fields" in field && Array.isArray(field.fields)) {
-    return {
-      ...field,
-      fields: field.fields.map((f) => addTooltipToField(f, tooltips))
-    };
-  }
-  if ("tabs" in field && Array.isArray(field.tabs)) {
-    return {
-      ...field,
-      tabs: field.tabs.map((tab) => ({
-        ...tab,
-        fields: tab.fields ? tab.fields.map((f) => addTooltipToField(f, tooltips)) : tab.fields
-      }))
-    };
-  }
-  return field;
-}
-
-// src/admin/fields/headerNav.ts
-var createHeaderNavItemsField = () => ({
-  name: "navItems",
-  type: "array",
-  labels: { singular: "Navigation Link", plural: "Navigation Links" },
-  admin: {
-    description: "The links displayed in your website's main navigation menu."
-  },
-  fields: [
-    {
-      name: "label",
-      type: "text",
-      required: true,
-      admin: {
-        description: "The text shown for this navigation link."
-      }
-    },
-    {
-      name: "href",
-      type: "text",
-      required: true,
-      admin: {
-        description: 'The URL this link points to (e.g., "/about" or "https://example.com").'
-      }
-    },
-    {
-      name: "parentHref",
-      type: "text",
-      admin: {
-        description: "Optional parent link URL. If set to another nav item href, this item appears in that dropdown."
-      }
-    }
-  ]
-});
-
-// src/admin/fields/socialMedia.ts
-var DEFAULT_DESCRIPTION = "Add profile URLs and choose one of two icon styles for each platform. Leave a URL blank to hide that profile on your site.";
-function validateOptionalHttpsUrl(value) {
-  if (value === null || value === void 0 || value === "") {
-    return true;
-  }
-  if (typeof value !== "string") {
-    return "Enter a valid URL.";
-  }
-  try {
-    const url = new URL(value);
-    if (url.protocol !== "http:" && url.protocol !== "https:") {
-      return "Use an http:// or https:// URL.";
-    }
-    return true;
-  } catch {
-    return "Enter a valid URL (for example: https://instagram.com/yourbrand).";
-  }
-}
-function createPlatformField(platform) {
-  const platformLabel = SOCIAL_MEDIA_PLATFORM_LABELS[platform];
-  const iconOptions = SOCIAL_MEDIA_ICON_OPTIONS[platform].map((option) => ({
-    label: option.label,
-    value: option.value
-  }));
-  return {
-    name: platform,
-    type: "group",
-    label: platformLabel,
-    fields: [
-      {
-        name: "url",
-        type: "text",
-        admin: {
-          description: `Full ${platformLabel} profile URL. Leave blank to hide ${platformLabel}.`
-        },
-        validate: validateOptionalHttpsUrl
-      },
-      {
-        name: "icon",
-        type: "select",
-        defaultValue: SOCIAL_MEDIA_DEFAULT_ICON_BY_PLATFORM[platform],
-        options: iconOptions,
-        admin: {
-          description: "Pick which icon style to display for this platform."
-        }
-      }
-    ]
-  };
-}
-var createSocialMediaConnectionsField = (options = {}) => {
-  const selectedPlatforms = Array.isArray(options.platforms) && options.platforms.length > 0 ? options.platforms : SOCIAL_MEDIA_PLATFORMS;
-  return {
-    name: options.name || "profiles",
-    type: "group",
-    label: options.label || "Social Media Profiles",
-    admin: {
-      description: options.description || DEFAULT_DESCRIPTION
-    },
-    fields: selectedPlatforms.map((platform) => createPlatformField(platform))
-  };
-};
-var socialMediaConnectionsField = createSocialMediaConnectionsField();
-
-// src/admin/globals/socialMedia.ts
-var createSocialMediaGlobal = (options = {}) => ({
-  slug: options.slug || "social-media",
-  label: "Social Media",
-  admin: {
-    description: options.description || "Manage social profile links and icon variants used across your website.",
-    group: "Site Design"
-  },
-  fields: [
-    createSocialMediaConnectionsField({
-      ...options.fieldOptions,
-      label: "Profiles",
-      name: "profiles"
-    })
-  ]
-});
-
-export {
-  createThemePreferenceField,
-  themePreferenceField,
-  configureAdmin,
-  withTooltips,
-  createHeaderNavItemsField,
-  createSocialMediaConnectionsField,
-  socialMediaConnectionsField,
-  createSocialMediaGlobal,
-  admin_exports
-};