@orion-studios/payload-studio 0.5.0-beta.11 → 0.5.0-beta.111

package/dist/chunk-DAIZDGHL.mjs

@@ -0,0 +1,614 @@
+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/shared/studioSections.ts
+var studioRoles = /* @__PURE__ */ new Set(["admin", "editor", "client"]);
+var isRecord = (value) => Boolean(value) && typeof value === "object" && !Array.isArray(value);
+var isAbsoluteExternalURL = (value) => /^[a-zA-Z][a-zA-Z\d+\-.]*:/.test(value) || value.startsWith("//");
+var normalizePathLikeValue = (value) => {
+  const trimmed = value.trim();
+  if (!trimmed) {
+    return "";
+  }
+  if (isAbsoluteExternalURL(trimmed)) {
+    return trimmed;
+  }
+  const withLeadingSlash = trimmed.startsWith("/") ? trimmed : `/${trimmed}`;
+  const normalized = withLeadingSlash.replace(/\/+$/, "");
+  return normalized || "/";
+};
+var normalizeStringArray = (value) => {
+  if (!Array.isArray(value)) {
+    return [];
+  }
+  return value.filter((entry) => typeof entry === "string").map((entry) => normalizePathLikeValue(entry)).filter((entry) => entry.length > 0);
+};
+var normalizeRoles = (value) => {
+  if (!Array.isArray(value)) {
+    return void 0;
+  }
+  const roles = value.filter((entry) => typeof entry === "string" && studioRoles.has(entry));
+  return roles.length > 0 ? roles : void 0;
+};
+var normalizeCard = (value) => {
+  if (!isRecord(value) || typeof value.title !== "string") {
+    return void 0;
+  }
+  const title = value.title.trim();
+  if (!title) {
+    return void 0;
+  }
+  return {
+    title,
+    ...typeof value.description === "string" && value.description.trim().length > 0 ? { description: value.description.trim() } : {}
+  };
+};
+var resolveStudioSections = (value) => {
+  if (!Array.isArray(value)) {
+    return [];
+  }
+  const sections = [];
+  const seen = /* @__PURE__ */ new Set();
+  for (const entry of value) {
+    if (!isRecord(entry) || typeof entry.id !== "string" || typeof entry.label !== "string") {
+      continue;
+    }
+    const id = entry.id.trim();
+    const label = entry.label.trim();
+    if (!id || !label || seen.has(id)) {
+      continue;
+    }
+    const href = typeof entry.href === "string" && entry.href.trim().length > 0 ? normalizePathLikeValue(entry.href) : isRecord(entry.view) && typeof entry.view.path === "string" ? normalizePathLikeValue(entry.view.path) : "";
+    if (!href) {
+      continue;
+    }
+    const matchPrefixes = Array.from(/* @__PURE__ */ new Set([href, ...normalizeStringArray(entry.matchPrefixes)]));
+    sections.push({
+      id,
+      label,
+      href,
+      matchPrefixes,
+      ...normalizeRoles(entry.roles) ? { roles: normalizeRoles(entry.roles) } : {},
+      ...normalizeCard(entry.card) ? { card: normalizeCard(entry.card) } : {}
+    });
+    seen.add(id);
+  }
+  return sections;
+};
+var resolveStudioSectionViews = (value) => {
+  if (!Array.isArray(value)) {
+    return {};
+  }
+  const views = {};
+  for (const entry of value) {
+    if (!isRecord(entry) || typeof entry.id !== "string" || !isRecord(entry.view)) {
+      continue;
+    }
+    const id = entry.id.trim();
+    const view = entry.view;
+    const component = isRecord(view.Component) ? view.Component : null;
+    if (!id || typeof view.path !== "string" || !component || typeof component.exportName !== "string" || typeof component.path !== "string") {
+      continue;
+    }
+    const path2 = normalizePathLikeValue(view.path);
+    const componentPath = component.path.trim();
+    const exportName = component.exportName.trim();
+    if (!path2 || !componentPath || !exportName) {
+      continue;
+    }
+    views[id] = {
+      path: path2,
+      Component: {
+        exportName,
+        path: componentPath,
+        ...isRecord(component.clientProps) ? { clientProps: component.clientProps } : {}
+      }
+    };
+  }
+  return views;
+};
+
+// 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 formsEnabled = config.studio?.forms?.enabled ?? false;
+  const formsCollectionSlug = config.studio?.forms?.collectionSlug || "forms";
+  const formSubmissionsCollectionSlug = config.studio?.forms?.submissionsCollectionSlug || "form-submissions";
+  const formUploadsCollectionSlug = config.studio?.forms?.uploadsCollectionSlug || "form-uploads";
+  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
+    };
+  });
+  const studioSections = resolveStudioSections(config.studio?.sections || []);
+  const studioSectionViews = resolveStudioSectionViews(config.studio?.sections || []);
+  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],
+              formSubmissionsCollectionSlug,
+              formsCollectionSlug,
+              formsEnabled,
+              formUploadsCollectionSlug,
+              mediaCollectionSlug,
+              pagesCollectionSlug,
+              sections: studioSections
+            }
+          }
+        } : {},
+        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],
+                formSubmissionsCollectionSlug,
+                formsCollectionSlug,
+                formsEnabled,
+                formUploadsCollectionSlug,
+                mediaCollectionSlug,
+                pagesCollectionSlug,
+                sections: studioSections
+              }
+            }
+          },
+          ...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"
+                }
+              }
+            },
+            ...formsEnabled ? {
+              studioForms: {
+                path: "/studio-forms",
+                Component: {
+                  exportName: "AdminStudioFormsView",
+                  path: clientPath,
+                  clientProps: {
+                    formsCollectionSlug,
+                    formSubmissionsCollectionSlug,
+                    formUploadsCollectionSlug
+                  }
+                }
+              }
+            } : {},
+            ...Object.fromEntries(
+              Object.entries(studioSectionViews).map(([id, view]) => [
+                id,
+                {
+                  path: view.path,
+                  Component: view.Component
+                }
+              ])
+            )
+          } : {}
+        },
+        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
+};