bsmnt 0.11.0 → 0.13.0

package/src/modules/features/cms/sanity-pagebuilder-cache/files/lib/integrations/sanity/page-builder-config.ts

@@ -9,15 +9,35 @@ export type PageBuilderDocumentType =
 	| "blogContent"
 	| (typeof singletonComponents)[number]["schemaType"];
 
+/**
+ * A block declares two orthogonal axes. `pageTypes` is which page documents may
+ * host it and drives validation; `category` is what the block structurally is
+ * and drives the insert menu. Never collapse them back into one field — that is
+ * what made the menu a single flat list.
+ */
+export type PageBuilderGroupName = "generic" | "blogEntry";
+
+export const componentCategories = [
+	{ name: "hero", title: "Hero" },
+	{ name: "text", title: "Text" },
+	{ name: "list", title: "List" },
+	{ name: "content", title: "Content" },
+	{ name: "misc", title: "Miscellaneous" },
+] as const satisfies ReadonlyArray<{ name: string; title: string }>;
+
+export type ComponentCategory = (typeof componentCategories)[number]["name"];
+
 type PageBuilderReferenceMember = {
 	documentType: PageBuilderDocumentType;
 	name: string;
 	title: string;
 	documentId?: string;
-	groups: PageBuilderGroupName[];
+	pageTypes: readonly PageBuilderGroupName[];
+	category: ComponentCategory;
 };
 
-export type PageBuilderGroupName = "generic" | "blogEntry";
+export const blockPreviewKey = (schemaTypeName: string) =>
+	`block.${schemaTypeName}`;
 
 export const pageBuilderPageTypes: Array<{
 	title: string;
@@ -41,31 +61,36 @@ const reusablePageBuilderReferenceMembers: PageBuilderReferenceMember[] = [
 		documentType: "hero",
 		name: "heroReference",
 		title: "Heading",
-		groups: ["generic"],
+		pageTypes: ["generic"],
+		category: "hero",
 	},
 	{
 		documentType: "description",
 		name: "descriptionReference",
 		title: "Description",
-		groups: ["generic"],
+		pageTypes: ["generic"],
+		category: "text",
 	},
 	{
 		documentType: "richTextBlock",
 		name: "richTextBlockReference",
 		title: "Rich Text",
-		groups: ["generic"],
+		pageTypes: ["generic"],
+		category: "text",
 	},
 	{
 		documentType: "gatedContent",
 		name: "gatedContentReference",
 		title: "Gated Content",
-		groups: ["generic"],
+		pageTypes: ["generic"],
+		category: "misc",
 	},
 	{
 		documentType: "blogContent",
 		name: "blogContentReference",
 		title: "Blog Content",
-		groups: ["blogEntry"],
+		pageTypes: ["blogEntry"],
+		category: "content",
 	},
 ];
 
@@ -75,7 +100,8 @@ const singletonPageBuilderReferenceMembers: PageBuilderReferenceMember[] =
 		name: `${component.schemaType}Reference`,
 		title: component.title,
 		documentId: component.documentId,
-		groups: ["generic"],
+		pageTypes: ["generic"],
+		category: component.category,
 	}));
 
 export const pageBuilderReferenceMembers: PageBuilderReferenceMember[] = [
@@ -93,25 +119,37 @@ export const getPageBuilderReferenceMemberByDocumentType = (
 		(member) => member.documentType === documentType,
 	);
 
-const isPageBuilderGroupVisible = (
+const isMemberVisibleForPageType = (
+	member: PageBuilderReferenceMember,
 	pageType: PageBuilderGroupName | undefined,
-	group: PageBuilderGroupName,
-) => (pageType ?? "generic") === group;
+) => member.pageTypes.includes(pageType ?? "generic");
 
 export const getVisiblePageBuilderReferenceMembers = (
 	pageType: PageBuilderGroupName | undefined,
 ) =>
 	pageBuilderReferenceMembers.filter((member) =>
-		member.groups.some((group) => isPageBuilderGroupVisible(pageType, group)),
+		isMemberVisibleForPageType(member, pageType),
 	);
 
-export const getVisiblePageBuilderInsertMenuGroups = (
+export const getVisiblePageBuilderMemberNames = (
 	pageType: PageBuilderGroupName | undefined,
 ) =>
-	pageBuilderInsertMenuGroups.filter(
-		(group) => group.name === (pageType ?? "generic"),
+	new Set(
+		getVisiblePageBuilderReferenceMembers(pageType).map((member) => member.name),
 	);
 
+export const getVisiblePageBuilderInsertMenuGroups = (
+	pageType: PageBuilderGroupName | undefined,
+) => {
+	const visible = getVisiblePageBuilderMemberNames(pageType);
+	return pageBuilderInsertMenuGroups
+		.map((group) => ({
+			...group,
+			of: group.of.filter((name) => visible.has(name)),
+		}))
+		.filter((group) => group.of.length > 0);
+};
+
 export const getInvalidPageBuilderDocumentTypes = (
 	pageType: PageBuilderGroupName | undefined,
 	documentTypes: PageBuilderDocumentType[],
@@ -121,24 +159,24 @@ export const getInvalidPageBuilderDocumentTypes = (
 
 		if (!member) return false;
 
-		return !member.groups.some((group) =>
-			isPageBuilderGroupVisible(pageType, group),
-		);
+		return !isMemberVisibleForPageType(member, pageType);
 	});
 
-export const pageBuilderInsertMenuGroups = [
-	{
-		name: "generic",
-		title: "Generic",
-		of: pageBuilderReferenceMembers
-			.filter((member) => member.groups.includes("generic"))
-			.map((member) => member.name),
-	},
-	{
-		name: "blogEntry",
-		title: "Blog Entry",
-		of: pageBuilderReferenceMembers
-			.filter((member) => member.groups.includes("blogEntry"))
-			.map((member) => member.name),
-	},
-];
+export const pageBuilderInsertMenuGroups: Array<{
+	name: ComponentCategory;
+	title: string;
+	of: string[];
+}> = componentCategories.map(({ name, title }) => ({
+	name,
+	title,
+	of: pageBuilderReferenceMembers
+		.filter((member) => member.category === name)
+		.map((member) => member.name),
+}));
+
+export const pageBuilderBlockPreviewOptions = pageBuilderReferenceMembers.map(
+	(member) => ({
+		title: `Block — ${member.title} · ${member.name}`,
+		value: blockPreviewKey(member.name),
+	}),
+);

package/src/modules/features/cms/sanity-pagebuilder-cache/files/lib/integrations/sanity/queries.ts

@@ -96,6 +96,8 @@ const pageBuilderProjection = `
       _type == "gatedContent" => {
         _id,
         _type,
+        anchorId,
+        presentation,
         internalTitle,
         teaserHeading,
         teaserBody[]{
@@ -533,6 +535,16 @@ export const LAYOUT_QUERY = defineQuery(`
     },
     "structuredData": *[_type == "structuredData"][0]{
       ${structuredDataProjection}
+    },
+    "spacingSettings": *[_type == "spacingSettings"][0]{
+      steps[]{
+        _key,
+        name,
+        mobile,
+        tablet,
+        desktop,
+        isDefault
+      }
     }
   }
 `);

package/src/modules/features/cms/sanity-pagebuilder-cache/files/lib/integrations/sanity/schemas/components/index.ts

@@ -4,3 +4,4 @@ export { gatedContent } from "./reusable/gated-content";
 export { hero } from "./reusable/hero";
 export { richTextBlock } from "./reusable/rich-text-block";
 export { blogCollection } from "./singleton/content-collection";
+export { studioPreview } from "./studio-preview";

package/src/modules/features/cms/sanity-pagebuilder-cache/files/lib/integrations/sanity/schemas/components/reusable/blog-content.ts

@@ -1,10 +1,10 @@
-import { defineField, defineType } from "sanity";
+import { defineField } from "sanity";
 import { contentIcon } from "@/lib/integrations/sanity/icons";
+import { defineBlock } from "@/lib/integrations/sanity/schemas/shared/block";
 
-export const blogContent = defineType({
+export const blogContent = defineBlock({
 	name: "blogContent",
 	title: "Blog Content",
-	type: "document",
 	icon: contentIcon,
 	fields: [
 		defineField({

package/src/modules/features/cms/sanity-pagebuilder-cache/files/lib/integrations/sanity/schemas/components/reusable/description.ts

@@ -1,10 +1,10 @@
-import { defineField, defineType } from "sanity";
+import { defineField } from "sanity";
 import { descriptionIcon } from "@/lib/integrations/sanity/icons";
+import { defineBlock } from "@/lib/integrations/sanity/schemas/shared/block";
 
-export const description = defineType({
+export const description = defineBlock({
 	name: "description",
 	title: "Description",
-	type: "document",
 	icon: descriptionIcon,
 	fields: [
 		defineField({

package/src/modules/features/cms/sanity-pagebuilder-cache/files/lib/integrations/sanity/schemas/components/reusable/gated-content.ts

@@ -1,5 +1,6 @@
-import { defineField, defineType } from "sanity";
+import { defineField } from "sanity";
 import { gatedContentIcon } from "@/lib/integrations/sanity/icons";
+import { defineBlock } from "@/lib/integrations/sanity/schemas/shared/block";
 
 type GatedContentParent = { kind?: string };
 
@@ -19,10 +20,9 @@ const requiredForKind =
 		return isEmpty ? message : true;
 	};
 
-export const gatedContent = defineType({
+export const gatedContent = defineBlock({
 	name: "gatedContent",
 	title: "Gated Content",
-	type: "document",
 	icon: gatedContentIcon,
 	description:
 		"Content hidden behind a lead-capture gate. Everyone sees the teaser; the payload is withheld from the page until the visitor submits the form.",

package/src/modules/features/cms/sanity-pagebuilder-cache/files/lib/integrations/sanity/schemas/components/reusable/hero.ts

@@ -1,10 +1,10 @@
-import { defineField, defineType } from "sanity";
+import { defineField } from "sanity";
 import { heroIcon } from "@/lib/integrations/sanity/icons";
+import { defineBlock } from "@/lib/integrations/sanity/schemas/shared/block";
 
-export const hero = defineType({
+export const hero = defineBlock({
 	name: "hero",
 	title: "Heading",
-	type: "document",
 	icon: heroIcon,
 	fields: [
 		defineField({

package/src/modules/features/cms/sanity-pagebuilder-cache/files/lib/integrations/sanity/schemas/components/reusable/rich-text-block.ts

@@ -1,10 +1,10 @@
-import { defineField, defineType } from "sanity";
+import { defineField } from "sanity";
 import { richTextIcon } from "@/lib/integrations/sanity/icons";
+import { defineBlock } from "@/lib/integrations/sanity/schemas/shared/block";
 
-export const richTextBlock = defineType({
+export const richTextBlock = defineBlock({
 	name: "richTextBlock",
 	title: "Rich Text",
-	type: "document",
 	icon: richTextIcon,
 	fields: [
 		defineField({

package/src/modules/features/cms/sanity-pagebuilder-cache/files/lib/integrations/sanity/schemas/components/singleton/content-collection.ts

@@ -1,6 +1,7 @@
-import { defineField, defineType } from "sanity";
+import { defineField } from "sanity";
 import type { SanityStudioIcon } from "@/lib/integrations/sanity/icons";
 import { pageListIcon } from "@/lib/integrations/sanity/icons";
+import { defineBlock } from "@/lib/integrations/sanity/schemas/shared/block";
 
 function createContentCollection(config: {
 	name: string;
@@ -8,10 +9,9 @@ function createContentCollection(config: {
 	icon: SanityStudioIcon;
 	label: string;
 }) {
-	return defineType({
+	return defineBlock({
 		name: config.name,
 		title: config.title,
-		type: "document",
 		icon: config.icon,
 		description: `This component contains all the ${config.label}`,
 		fields: [

package/src/modules/features/cms/sanity-pagebuilder-cache/files/lib/integrations/sanity/schemas/components/studio-preview.ts

@@ -0,0 +1,37 @@
+import { defineField, defineType } from "sanity";
+import { pageBuilderCardIcon } from "@/lib/integrations/sanity/icons";
+import { pageBuilderBlockPreviewOptions } from "@/lib/integrations/sanity/page-builder-config";
+
+export const studioPreview = defineType({
+	name: "studioPreview",
+	title: "Component Preview",
+	type: "document",
+	icon: pageBuilderCardIcon,
+	fields: [
+		defineField({
+			name: "key",
+			title: "Component",
+			type: "string",
+			options: { list: pageBuilderBlockPreviewOptions },
+			validation: (Rule) => Rule.required(),
+		}),
+		defineField({
+			name: "preview",
+			title: "Preview image",
+			type: "image",
+			options: { hotspot: true },
+			validation: (Rule) => Rule.required(),
+		}),
+	],
+	preview: {
+		select: { key: "key", media: "preview" },
+		prepare({ key, media }) {
+			return {
+				title:
+					pageBuilderBlockPreviewOptions.find((option) => option.value === key)
+						?.title ?? "Component Preview",
+				media,
+			};
+		},
+	},
+});

package/src/modules/features/cms/sanity-pagebuilder-cache/files/lib/integrations/sanity/schemas/index.ts

@@ -15,6 +15,7 @@ import {
 	gatedContent,
 	hero,
 	richTextBlock,
+	studioPreview,
 } from "./components";
 import { author } from "./content/author";
 import { blogCategory } from "./content/blog-category";
@@ -22,6 +23,7 @@ import { companyData } from "./layout/company-data";
 import { footer } from "./layout/footer";
 import { navbar } from "./layout/navbar";
 import { redirect } from "./layout/redirect";
+import { spacingSettings, spacingStep } from "./layout/spacing-settings";
 import { structuredData } from "./layout/structured-data";
 import { externalLink, link, pageReference } from "./shared/link";
 import { metadata } from "./shared/metadata";
@@ -34,6 +36,7 @@ import {
 import { page } from "./shared/page";
 import { pageBuilder } from "./shared/page-builder";
 import { pageFolder } from "./shared/page-folder";
+import { presentation } from "./shared/presentation";
 import { richText } from "./shared/richText";
 import {
 	customJsonLd,
@@ -73,10 +76,14 @@ export {
 	pageBuilder,
 	pageFolder,
 	pageReference,
+	presentation,
 	redirect,
 	richText,
 	softwareApplicationJsonLd,
+	spacingSettings,
+	spacingStep,
 	structuredData,
+	studioPreview,
 	videoJsonLd,
 };
 
@@ -89,6 +96,7 @@ export const schema: { types: SchemaTypeDefinition[] } = {
 		link,
 		metadata,
 		pageBuilder,
+		presentation,
 		richText,
 
 		// Page-level JSON-LD blocks (selectable in metadata)
@@ -113,12 +121,15 @@ export const schema: { types: SchemaTypeDefinition[] } = {
 		description,
 		richTextBlock,
 		gatedContent,
+		studioPreview,
 
 		// Layout types (singletons for site-wide layout)
 		companyData,
 		navbar,
 		footer,
 		structuredData,
+		spacingStep,
+		spacingSettings,
 
 		// Layout collections (managed lists, not singletons)
 		redirect,

package/src/modules/features/cms/sanity-pagebuilder-cache/files/lib/integrations/sanity/schemas/layout/spacing-settings.ts

@@ -0,0 +1,120 @@
+import { defineArrayMember, defineField, defineType } from "sanity";
+import { SpacingStepsInput } from "@/lib/integrations/sanity/components/spacing-steps-input";
+import { spacingSettingsIcon } from "@/lib/integrations/sanity/icons";
+import { defaultSpacingSteps } from "@/lib/integrations/sanity/schemas/shared/spacing";
+
+const pxField = (
+	name: "mobile" | "tablet" | "desktop",
+	title: string,
+	description: string,
+	isRequired = false,
+) =>
+	defineField({
+		name,
+		title,
+		type: "number",
+		description,
+		validation: (Rule) => {
+			const range = Rule.min(0).max(400).integer();
+			return isRequired ? range.required() : range;
+		},
+	});
+
+export const spacingStep = defineType({
+	name: "spacingStep",
+	title: "Spacing step",
+	type: "object",
+	fields: [
+		defineField({
+			name: "name",
+			title: "Name",
+			type: "string",
+			description: "Shown in the Presentation Mode dropdown on every block.",
+			validation: (Rule) => Rule.required().max(24),
+		}),
+		pxField("desktop", "Desktop", "From 1440px up. Required.", true),
+		pxField("tablet", "Tablet", "From 768px up. Empty reuses Desktop."),
+		pxField("mobile", "Mobile", "Below 768px. Empty reuses Desktop."),
+		defineField({
+			name: "isDefault",
+			title: "Use as default",
+			type: "boolean",
+			description:
+				"Blocks that never touch Presentation Mode use this step. Exactly one step can be the default.",
+			initialValue: false,
+		}),
+	],
+	preview: {
+		select: {
+			name: "name",
+			mobile: "mobile",
+			tablet: "tablet",
+			desktop: "desktop",
+			isDefault: "isDefault",
+		},
+		prepare({ name, mobile, tablet, desktop, isDefault }) {
+			const px = [mobile ?? desktop, tablet ?? desktop, desktop]
+				.map((value) => (typeof value === "number" ? `${value}px` : "—"))
+				.join(" / ");
+
+			return {
+				title: `${name || "Untitled"}${isDefault ? " · default" : ""}`,
+				subtitle: `${px} (mobile / tablet / desktop)`,
+			};
+		},
+	},
+});
+
+export const spacingSettings = defineType({
+	name: "spacingSettings",
+	title: "Spacing Scale",
+	type: "document",
+	icon: spacingSettingsIcon,
+	fields: [
+		defineField({
+			name: "steps",
+			title: "Spacing steps",
+			description:
+				"The vertical spacing every block can pick from. Add as many as you need and mark one as the default. Left empty, the built-in scale is used.",
+			type: "array",
+			components: { input: SpacingStepsInput },
+			of: [defineArrayMember({ type: "spacingStep" })],
+			initialValue: defaultSpacingSteps.map((step) => ({
+				_key: step.key,
+				_type: "spacingStep",
+				name: step.name,
+				mobile: step.mobile,
+				tablet: step.tablet,
+				desktop: step.desktop,
+				isDefault: step.isDefault,
+			})),
+			validation: (Rule) =>
+				Rule.custom((steps: unknown) => {
+					if (!Array.isArray(steps) || steps.length === 0) return true;
+
+					const defaults = steps.filter(
+						(step) => (step as { isDefault?: boolean })?.isDefault === true,
+					);
+
+					if (defaults.length === 0) return "Mark one step as the default";
+					if (defaults.length > 1) return "Only one step can be the default";
+
+					const names = steps.map((step) =>
+						(step as { name?: string })?.name?.trim().toLowerCase(),
+					);
+
+					return new Set(names).size === names.length
+						? true
+						: "Two steps share the same name";
+				}),
+		}),
+	],
+	preview: {
+		prepare() {
+			return {
+				title: "Spacing Scale",
+				subtitle: "Section padding steps per breakpoint",
+			};
+		},
+	},
+});

package/src/modules/features/cms/sanity-pagebuilder-cache/files/lib/integrations/sanity/schemas/shared/anchor.ts

@@ -0,0 +1,75 @@
+const anchorSourceFields = [
+	"headline",
+	"heading",
+	"teaserHeading",
+	"title",
+	"label",
+] as const;
+
+const ANCHOR_MAX_LENGTH = 60;
+
+export const slugifyAnchor = (raw: string) =>
+	raw
+		.normalize("NFKD")
+		.replace(/[\u0300-\u036f]/g, "")
+		.toLowerCase()
+		.replace(/[^a-z0-9]+/g, "-")
+		.replace(/^-+|-+$/g, "")
+		.slice(0, ANCHOR_MAX_LENGTH)
+		.replace(/-+$/g, "");
+
+export const deriveAnchorId = (block: Record<string, unknown>) => {
+	for (const field of anchorSourceFields) {
+		const value = block[field];
+		if (typeof value === "string" && value.trim()) {
+			const slug = slugifyAnchor(value);
+			if (slug) return slug;
+		}
+	}
+
+	return "";
+};
+
+const explicitAnchorId = (block: Record<string, unknown>) =>
+	typeof block.anchorId === "string" ? slugifyAnchor(block.anchorId) : "";
+
+const NO_RESERVED_IDS: ReadonlySet<string> = new Set();
+
+export const reserveAnchorIds = (
+	blocks: readonly Record<string, unknown>[],
+): ReadonlySet<string> => {
+	const reserved = new Set<string>();
+
+	for (const block of blocks) {
+		const explicit = explicitAnchorId(block);
+		if (explicit) reserved.add(explicit);
+	}
+
+	return reserved;
+};
+
+export const resolveAnchorId = (
+	block: Record<string, unknown>,
+	taken: Set<string>,
+	reserved: ReadonlySet<string> = NO_RESERVED_IDS,
+) => {
+	const explicit = explicitAnchorId(block);
+	const base = explicit || deriveAnchorId(block);
+
+	if (!base) return "";
+
+	const isBlocked = (candidate: string) =>
+		taken.has(candidate) || (!explicit && reserved.has(candidate));
+
+	let candidate = base;
+	let suffix = 2;
+
+	while (isBlocked(candidate)) {
+		candidate = `${base}-${suffix}`;
+		suffix += 1;
+	}
+
+	taken.add(candidate);
+
+	return candidate;
+};

package/src/modules/features/cms/sanity-pagebuilder-cache/files/lib/integrations/sanity/schemas/shared/block.ts

@@ -0,0 +1,46 @@
+import {
+	type DocumentDefinition,
+	defineType,
+	type FieldDefinition,
+	type FieldGroupDefinition,
+} from "sanity";
+import { presentationFields } from "./presentation";
+
+const presentationGroup: FieldGroupDefinition = {
+	name: "presentation",
+	title: "Presentation",
+};
+
+type BlockDefinition = Omit<DocumentDefinition, "type" | "fields" | "groups"> & {
+	fields: FieldDefinition[];
+	groups?: FieldGroupDefinition[];
+};
+
+const withPresentationGroup = (groups: FieldGroupDefinition[] | undefined) => {
+	if (!groups?.length) return undefined;
+	if (groups.some((group) => group.name === presentationGroup.name)) {
+		return groups;
+	}
+
+	return [...groups, presentationGroup];
+};
+
+/**
+ * Defines a page-builder block — `type: "document"` plus Anchor ID and
+ * Presentation Mode. Use instead of `defineType`.
+ */
+export const defineBlock = ({ fields, groups, ...rest }: BlockDefinition) => {
+	const blockGroups = withPresentationGroup(groups);
+
+	return defineType({
+		...rest,
+		type: "document",
+		...(blockGroups ? { groups: blockGroups } : {}),
+		fields: [
+			...fields,
+			...presentationFields(
+				blockGroups ? { group: presentationGroup.name } : undefined,
+			),
+		],
+	});
+};