@orion-studios/payload-studio 0.5.0-beta.110 → 0.5.0-beta.112

package/README.md

@@ -1,22 +1,67 @@
 # @orion-studios/payload-studio
 
-Unified Payload CMS toolkit for Orion Studios projects.
+`payload-studio` is the base package for Orion's XO-style websites. It defines the supported contract for:
 
-## Editor Scope
+- Payload admin customization
+- Studio builder primitives
+- block schema and document compilation
+- Next.js query helpers
+- shared media and social/global helpers
 
-`payload-studio` now treats block authoring as content-first by default.
+## Canonical Guide
 
-- Generic block-level Layout and Style controls are hidden in the CMS and Studio builder.
-- Internal layout/style fields still remain in the schema for compile compatibility with existing pages.
-- Editors should focus on content, media, typography, and a small set of block-specific variants.
+Start here for any new project:
 
-## Install
+- [Studio Website Setup Guide](./docs/studio-website-setup-guide.md)
+
+## Stable Import Pattern
+
+Prefer explicit subpath imports.
+
+```ts
+import { configureAdmin, type StudioSection } from '@orion-studios/payload-studio/admin'
+import { createPayloadClient, createPageQueries, createSiteQueries } from '@orion-studios/payload-studio/nextjs'
+import { defaultPageLayoutBlocks } from '@orion-studios/payload-studio/blocks'
+import { pageStudioModuleManifest } from '@orion-studios/payload-studio/studio-pages'
+import { withImageUploadOptimization } from '@orion-studios/payload-studio/studio'
+```
+
+The root `@orion-studios/payload-studio` namespace export remains available for backward compatibility, but new integrations should treat subpath imports as the public contract.
+
+## Quick Start
 
 ```bash
 npm install @orion-studios/payload-studio
 ```
 
-## Subpath Exports
+```ts
+import { configureAdmin } from '@orion-studios/payload-studio/admin'
+
+const adminConfig = configureAdmin({
+  brandName: 'Client Name',
+  brandPrimary: '#243654',
+  brandSecondary: '#b56f4d',
+  defaultTheme: 'brand-light',
+  logoUrl: '/branding/logo.svg',
+  studio: {
+    forms: {
+      enabled: true,
+      collectionSlug: 'forms',
+      submissionsCollectionSlug: 'form-submissions',
+      uploadsCollectionSlug: 'form-uploads',
+    },
+    globals: [
+      { slug: 'site-settings', label: 'Website Settings' },
+      { slug: 'header', label: 'Header & Navigation' },
+      { slug: 'footer', label: 'Footer' },
+      { slug: 'social-media', label: 'Social Media' },
+      { slug: 'contact-form', label: 'Contact Form' },
+    ],
+  },
+})
+```
+
+## Key Exports
 
 - `@orion-studios/payload-studio/admin`
 - `@orion-studios/payload-studio/admin/client`
@@ -31,80 +76,17 @@ npm install @orion-studios/payload-studio
 - `@orion-studios/payload-studio/studio-pages/client`
 - `@orion-studios/payload-studio/studio-pages/builder.css`
 
-## Quick Usage
-
-```ts
-import { configureAdmin } from '@orion-studios/payload-studio/admin'
-import { defaultPageLayoutBlocks } from '@orion-studios/payload-studio/blocks'
-import { createPayloadClient, createPageQueries } from '@orion-studios/payload-studio/nextjs'
-import { createStudioRegistry } from '@orion-studios/payload-studio/studio'
-import { pageStudioModuleManifest } from '@orion-studios/payload-studio/studio-pages'
-```
-
-```ts
-import { withImageUploadOptimization } from '@orion-studios/payload-studio/studio'
-
-// In your Media collection:
-// export const Media = withImageUploadOptimization({
-//   slug: 'media',
-//   upload: { ... },
-//   fields: [...],
-// })
-```
-
-```ts
-import { BuilderPageEditor } from '@orion-studios/payload-studio/studio-pages/client'
-import '@orion-studios/payload-studio/studio-pages/builder.css'
-```
-
-```ts
-import { AdminPage } from '@orion-studios/payload-studio/admin-app'
-import { AdminShellClient } from '@orion-studios/payload-studio/admin-app/client'
-import '@orion-studios/payload-studio/admin-app/styles.css'
-```
-
-## Social Media Global
+## Add-on Integration
 
-```ts
-import { createSocialMediaGlobal } from '@orion-studios/payload-studio/admin'
-
-export const globals = [
-  createSocialMediaGlobal(),
-]
-```
-
-`createSocialMediaGlobal` creates a `social-media` global with:
-
-- Major platforms (Facebook, Instagram, X, LinkedIn, YouTube, TikTok, Pinterest, Snapchat)
-- URL field for each platform
-- Four icon choices per platform (`Simple Icons`, `Font Awesome Brands`, `Tabler Brands`, `Remix Icons`)
-
-You can fetch and normalize these links in Next.js:
-
-```ts
-import { createSiteQueries, resolveSocialMediaLinks } from '@orion-studios/payload-studio/nextjs'
-
-const { getSocialMedia } = createSiteQueries(getPayloadClient)
-const social = await getSocialMedia()
-const links = resolveSocialMediaLinks(social)
-```
+`StudioSection` from `@orion-studios/payload-studio/admin` is the official contract for optional add-ons such as analytics and SEO.
 
 ## Build
 
 ```bash
-npm install
 npm run build
+npm run test
 ```
 
-## Upload Optimization Hook
-
-`withImageUploadOptimization` and `createImageUploadOptimizationHook` compress raster uploads
-before Payload writes files and before cloud storage adapters upload them.
-
-- Preserves pixel dimensions (no resize)
-- Optimizes JPEG / PNG / WebP / AVIF / TIFF
-- Runs in a collection `beforeOperation` hook
-
 ## License
 
 MIT © Orion Studios

package/dist/admin-app/client.js

@@ -72,6 +72,14 @@ function NavIcon({ name }) {
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "8", y1: "13", x2: "16", y2: "13" }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "8", y1: "17", x2: "12", y2: "17" })
       ] });
+    case "forms":
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { ...props, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M9 3h6" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12 3v18" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M5 7h14a2 2 0 0 1 2 2v8a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V9a2 2 0 0 1 2-2Z" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M7 11h10" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M7 15h6" })
+      ] });
     case "globals":
       return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { ...props, children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "12", r: "3" }),

package/dist/admin-app/client.mjs

@@ -45,6 +45,14 @@ function NavIcon({ name }) {
         /* @__PURE__ */ jsx("line", { x1: "8", y1: "13", x2: "16", y2: "13" }),
         /* @__PURE__ */ jsx("line", { x1: "8", y1: "17", x2: "12", y2: "17" })
       ] });
+    case "forms":
+      return /* @__PURE__ */ jsxs("svg", { ...props, children: [
+        /* @__PURE__ */ jsx("path", { d: "M9 3h6" }),
+        /* @__PURE__ */ jsx("path", { d: "M12 3v18" }),
+        /* @__PURE__ */ jsx("path", { d: "M5 7h14a2 2 0 0 1 2 2v8a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V9a2 2 0 0 1 2-2Z" }),
+        /* @__PURE__ */ jsx("path", { d: "M7 11h10" }),
+        /* @__PURE__ */ jsx("path", { d: "M7 15h6" })
+      ] });
     case "globals":
       return /* @__PURE__ */ jsxs("svg", { ...props, children: [
         /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "3" }),

package/dist/admin-app/index.d.mts

@@ -1,3 +1,3 @@
-export { A as AdminBreadcrumbItem, a as AdminBreadcrumbs, b as AdminNavIcon, c as AdminNavInput, d as AdminNavItem, e as AdminNavLinkItem, f as AdminPage, g as AdminPageLinkOption, h as AdminPageRecord, j as AdminRole, M as MediaDetailPanelProps, k as MediaListItemProps, N as NestedNavItem, l as NestedNavItemInput, m as NestedNavTree, n as buildAdminPageLinkOptions, o as buildNestedNavTree, p as getAdminNavRows, q as navItemIsActive, r as normalizeAdminNavInputs, s as normalizeNestedNavItems, t as parseAdminHeaderNavFromForm, u as roleCanAccessNav } from '../index-ZbOx4OCF.mjs';
+export { A as AdminBreadcrumbItem, a as AdminBreadcrumbs, b as AdminNavIcon, c as AdminNavInput, d as AdminNavItem, e as AdminNavLinkItem, f as AdminPage, g as AdminPageLinkOption, h as AdminPageRecord, j as AdminRole, M as MediaDetailPanelProps, k as MediaListItemProps, N as NestedNavItem, l as NestedNavItemInput, m as NestedNavTree, n as buildAdminPageLinkOptions, o as buildNestedNavTree, p as getAdminNavRows, q as navItemIsActive, r as normalizeAdminNavInputs, s as normalizeNestedNavItems, t as parseAdminHeaderNavFromForm, u as roleCanAccessNav } from '../index-7lxTrxSG.mjs';
 import 'react/jsx-runtime';
 import 'react';

package/dist/admin-app/index.d.ts

@@ -1,3 +1,3 @@
-export { A as AdminBreadcrumbItem, a as AdminBreadcrumbs, b as AdminNavIcon, c as AdminNavInput, d as AdminNavItem, e as AdminNavLinkItem, f as AdminPage, g as AdminPageLinkOption, h as AdminPageRecord, j as AdminRole, M as MediaDetailPanelProps, k as MediaListItemProps, N as NestedNavItem, l as NestedNavItemInput, m as NestedNavTree, n as buildAdminPageLinkOptions, o as buildNestedNavTree, p as getAdminNavRows, q as navItemIsActive, r as normalizeAdminNavInputs, s as normalizeNestedNavItems, t as parseAdminHeaderNavFromForm, u as roleCanAccessNav } from '../index-ZbOx4OCF.js';
+export { A as AdminBreadcrumbItem, a as AdminBreadcrumbs, b as AdminNavIcon, c as AdminNavInput, d as AdminNavItem, e as AdminNavLinkItem, f as AdminPage, g as AdminPageLinkOption, h as AdminPageRecord, j as AdminRole, M as MediaDetailPanelProps, k as MediaListItemProps, N as NestedNavItem, l as NestedNavItemInput, m as NestedNavTree, n as buildAdminPageLinkOptions, o as buildNestedNavTree, p as getAdminNavRows, q as navItemIsActive, r as normalizeAdminNavInputs, s as normalizeNestedNavItems, t as parseAdminHeaderNavFromForm, u as roleCanAccessNav } from '../index-7lxTrxSG.js';
 import 'react/jsx-runtime';
 import 'react';

package/dist/{chunk-GKMBYYXF.mjs → chunk-3T2P6SDM.mjs}

@@ -50,16 +50,6 @@ var resolveBuilderThemeTokens = (layers) => {
   return merge(withPage, layers.block);
 };
 
-// src/studio-pages/builder/settings-v2/BlockInspectorRenderer.tsx
-import { useMemo, useState as useState2 } from "react";
-
-// src/studio-pages/builder/ui/Accordion.tsx
-import { useEffect, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-
-// src/studio-pages/builder/ui/ImageControls.tsx
-import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-
 // src/studio-pages/builder/settings-v2/inspectorSchema.ts
 var alignOptions = [
   { label: "Left", value: "left" },
@@ -410,9 +400,6 @@ var inspectorDefinitionByBlockType = {
   }
 };
 
-// src/studio-pages/builder/settings-v2/BlockInspectorRenderer.tsx
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-
 // src/studio-pages/migrations.ts
 var isRecord2 = (value) => Boolean(value) && typeof value === "object" && !Array.isArray(value);
 var assertPageStudioDocumentV1 = (value) => {

package/dist/{index-ZbOx4OCF.d.mts → index-7lxTrxSG.d.mts}

@@ -2,7 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactNode } from 'react';
 
 type AdminRole = 'admin' | 'editor' | 'client';
-type AdminNavIcon = 'dashboard' | 'pages' | 'globals' | 'media' | 'tools' | 'account';
+type AdminNavIcon = 'dashboard' | 'pages' | 'forms' | 'globals' | 'media' | 'tools' | 'account';
 type AdminNavItem = {
     href: string;
     icon?: AdminNavIcon;

package/dist/{index-ZbOx4OCF.d.ts → index-7lxTrxSG.d.ts}

@@ -2,7 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactNode } from 'react';
 
 type AdminRole = 'admin' | 'editor' | 'client';
-type AdminNavIcon = 'dashboard' | 'pages' | 'globals' | 'media' | 'tools' | 'account';
+type AdminNavIcon = 'dashboard' | 'pages' | 'forms' | 'globals' | 'media' | 'tools' | 'account';
 type AdminNavItem = {
     href: string;
     icon?: AdminNavIcon;

package/dist/index.d.mts

@@ -1,5 +1,5 @@
 export { i as admin } from './index-B7QvY3yF.mjs';
-export { i as adminApp } from './index-ZbOx4OCF.mjs';
+export { i as adminApp } from './index-7lxTrxSG.mjs';
 export { i as blocks } from './index-CluwY0ZQ.mjs';
 export { i as nextjs } from './index-D8BNfUJb.mjs';
 export { i as studio } from './index-BzKOThsI.mjs';

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 export { i as admin } from './index-BK03FiEM.js';
-export { i as adminApp } from './index-ZbOx4OCF.js';
+export { i as adminApp } from './index-7lxTrxSG.js';
 export { i as blocks } from './index-CluwY0ZQ.js';
 export { i as nextjs } from './index-DD_E2UfJ.js';
 export { i as studio } from './index-BzKOThsI.js';

package/dist/index.js

@@ -3851,16 +3851,6 @@ var resolveBuilderThemeTokens = (layers) => {
   return merge(withPage, layers.block);
 };
 
-// src/studio-pages/builder/settings-v2/BlockInspectorRenderer.tsx
-var import_react2 = require("react");
-
-// src/studio-pages/builder/ui/Accordion.tsx
-var import_react = require("react");
-var import_jsx_runtime4 = require("react/jsx-runtime");
-
-// src/studio-pages/builder/ui/ImageControls.tsx
-var import_jsx_runtime5 = require("react/jsx-runtime");
-
 // src/studio-pages/builder/settings-v2/inspectorSchema.ts
 var alignOptions = [
   { label: "Left", value: "left" },
@@ -4211,9 +4201,6 @@ var inspectorDefinitionByBlockType = {
   }
 };
 
-// src/studio-pages/builder/settings-v2/BlockInspectorRenderer.tsx
-var import_jsx_runtime6 = require("react/jsx-runtime");
-
 // src/studio-pages/migrations.ts
 var isRecord5 = (value) => Boolean(value) && typeof value === "object" && !Array.isArray(value);
 var assertPageStudioDocumentV1 = (value) => {

package/dist/index.mjs

@@ -16,7 +16,7 @@ import {
 } from "./chunk-ADIIWIYL.mjs";
 import {
   studio_pages_exports
-} from "./chunk-GKMBYYXF.mjs";
+} from "./chunk-3T2P6SDM.mjs";
 import "./chunk-OQSEJXC4.mjs";
 import "./chunk-PF3EBZXF.mjs";
 import "./chunk-6BWS3CLP.mjs";

package/dist/nextjs/index.js

@@ -45,21 +45,6 @@ function createPayloadClient(config) {
 // src/nextjs/queries/pages.ts
 var import_cache = require("next/cache");
 
-// src/studio/imageUploadOptimization.ts
-var import_promises = require("fs/promises");
-var DEFAULT_OPTIONS = {
-  avifQuality: 50,
-  enforceSmallerForLossy: true,
-  jpegQuality: 78,
-  minBytes: 48 * 1024,
-  minQualityFloor: 42,
-  onlyIfSmaller: true,
-  pngCompressionLevel: 9,
-  skipAnimated: true,
-  tiffQuality: 75,
-  webpQuality: 78
-};
-
 // src/studio/index.ts
 var isRecord = (value) => Boolean(value) && typeof value === "object" && !Array.isArray(value);
 function assertStudioDocumentV1(input) {

package/dist/studio-pages/index.js

@@ -354,16 +354,6 @@ var resolveBuilderThemeTokens = (layers) => {
   return merge(withPage, layers.block);
 };
 
-// src/studio-pages/builder/settings-v2/BlockInspectorRenderer.tsx
-var import_react2 = require("react");
-
-// src/studio-pages/builder/ui/Accordion.tsx
-var import_react = require("react");
-var import_jsx_runtime = require("react/jsx-runtime");
-
-// src/studio-pages/builder/ui/ImageControls.tsx
-var import_jsx_runtime2 = require("react/jsx-runtime");
-
 // src/studio-pages/builder/settings-v2/inspectorSchema.ts
 var alignOptions = [
   { label: "Left", value: "left" },
@@ -714,9 +704,6 @@ var inspectorDefinitionByBlockType = {
   }
 };
 
-// src/studio-pages/builder/settings-v2/BlockInspectorRenderer.tsx
-var import_jsx_runtime3 = require("react/jsx-runtime");
-
 // src/studio-pages/document.ts
 var ensureNodeID = (value, index) => {
   if (typeof value === "string" && value.trim().length > 0) {

package/dist/studio-pages/index.mjs

@@ -4,7 +4,7 @@ import {
   pagePaletteGroups,
   pageStudioModuleManifest,
   resolveBuilderThemeTokens
-} from "../chunk-GKMBYYXF.mjs";
+} from "../chunk-3T2P6SDM.mjs";
 import "../chunk-OQSEJXC4.mjs";
 import {
   createDefaultStudioDocument,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@orion-studios/payload-studio",
-  "version": "0.5.0-beta.110",
-  "description": "Unified Payload CMS toolkit for Orion Studios",
+  "version": "0.5.0-beta.112",
+  "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,9 +75,9 @@
     "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": {
@@ -98,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",
@@ -109,6 +114,7 @@
   "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.2.0",