bsmnt 0.12.0 → 0.13.0

package/src/modules/features/cms/sanity-pagebuilder-cache/files/lib/integrations/sanity/components/spacing-steps-input.tsx

@@ -0,0 +1,84 @@
+import { Button, Card, Stack, Text } from "@sanity/ui";
+import { useEffect, useRef } from "react";
+import { type ArrayOfObjectsInputProps, set } from "sanity";
+import { defaultSpacingSteps } from "@/lib/integrations/sanity/schemas/shared/spacing";
+
+type StepValue = { _key?: string; isDefault?: boolean };
+
+const defaultKeysOf = (value: StepValue[] | undefined) =>
+	(value ?? [])
+		.filter((step) => step?.isDefault === true)
+		.flatMap((step) => (step._key ? [step._key] : []));
+
+export function SpacingStepsInput(props: ArrayOfObjectsInputProps) {
+	const value = props.value as StepValue[] | undefined;
+	const { onChange } = props;
+
+	const defaultKeys = defaultKeysOf(value);
+	const defaultKeysId = defaultKeys.join(",");
+	const lastSingleDefault = useRef<string | undefined>(defaultKeys[0]);
+
+	useEffect(() => {
+		const keys = defaultKeysId ? defaultKeysId.split(",") : [];
+
+		if (keys.length < 2) {
+			lastSingleDefault.current = keys[0];
+			return;
+		}
+
+		const keep = keys.find((key) => key !== lastSingleDefault.current) ?? keys[0];
+		lastSingleDefault.current = keep;
+
+		onChange(
+			keys
+				.filter((key) => key !== keep)
+				.map((key) => set(false, [{ _key: key }, "isDefault"])),
+		);
+	}, [defaultKeysId, onChange]);
+
+	const seed = () => {
+		onChange(
+			set(
+				defaultSpacingSteps.map((step) => ({
+					_key: step.key,
+					_type: "spacingStep",
+					name: step.name,
+					mobile: step.mobile,
+					tablet: step.tablet,
+					desktop: step.desktop,
+					isDefault: step.isDefault,
+				})),
+			),
+		);
+	};
+
+	return (
+		<Stack space={3}>
+			{props.renderDefault(props)}
+			{value?.length ? null : (
+				<Card padding={3} radius={2} border tone="primary">
+					<Stack space={3}>
+						<Text size={1}>
+							No steps yet, so blocks fall back to the built-in scale:{" "}
+							{defaultSpacingSteps
+								.map(
+									(step) =>
+										`${step.name} ${step.desktop}px${
+											step.isDefault ? " (default)" : ""
+										}`,
+								)
+								.join(" · ")}
+							.
+						</Text>
+						<Button
+							text="Add the built-in steps"
+							tone="primary"
+							mode="ghost"
+							onClick={seed}
+						/>
+					</Stack>
+				</Card>
+			)}
+		</Stack>
+	);
+}

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

@@ -12,16 +12,18 @@ export type NavbarData = NonNullable<LayoutData["navbar"]>
 export type FooterData = NonNullable<LayoutData["footer"]>
 export type CompanyData = NonNullable<LayoutData["companyData"]>
 export type StructuredData = NonNullable<LayoutData["structuredData"]>
+export type SpacingSettings = NonNullable<LayoutData["spacingSettings"]>
 
 const EMPTY_LAYOUT: LayoutData = {
   navbar: null,
   footer: null,
   companyData: null,
   structuredData: null,
+  spacingSettings: null,
 }
 
-// One entry for all four layout singletons: header, footer and json-ld call this
-// with the same options, so they share one fetch instead of four.
+// One entry for every layout singleton: header, footer, json-ld and the spacing
+// scale call this with the same options, so they share one fetch.
 //
 // Don't cap the empty branch — this renders in every route's shell, and a nested
 // lifetime propagates upwards as a min().

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

@@ -2,6 +2,9 @@ import type { Icon, IconProps } from "@phosphor-icons/react";
 import {
 	AppWindowIcon,
 	ArrowBendUpRightIcon,
+	ArrowLineDownIcon,
+	ArrowLineUpIcon,
+	ArrowsOutLineVerticalIcon,
 	ArticleNyTimesIcon,
 	BracketsCurlyIcon,
 	BriefcaseIcon,
@@ -75,6 +78,11 @@ export const richTextIcon = asDuotoneIcon(TextTIcon);
 export const contentIcon = asDuotoneIcon(ArticleNyTimesIcon);
 export const gatedContentIcon = asDuotoneIcon(LockKeyIcon);
 
+export const spacingSettingsIcon = asDuotoneIcon(ArrowsOutLineVerticalIcon);
+
+export const paddingTopIcon = asDuotoneIcon(ArrowLineUpIcon);
+export const paddingBottomIcon = asDuotoneIcon(ArrowLineDownIcon);
+
 export const pageIcon = asDuotoneIcon(FileTextIcon);
 export const pagesFolderIcon = asDuotoneIcon(BrowsersIcon);
 export const pageFolderIcon = asDuotoneIcon(FolderOpenIcon);

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/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/index.ts

@@ -23,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";
@@ -35,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,
@@ -74,9 +76,12 @@ export {
 	pageBuilder,
 	pageFolder,
 	pageReference,
+	presentation,
 	redirect,
 	richText,
 	softwareApplicationJsonLd,
+	spacingSettings,
+	spacingStep,
 	structuredData,
 	studioPreview,
 	videoJsonLd,
@@ -91,6 +96,7 @@ export const schema: { types: SchemaTypeDefinition[] } = {
 		link,
 		metadata,
 		pageBuilder,
+		presentation,
 		richText,
 
 		// Page-level JSON-LD blocks (selectable in metadata)
@@ -122,6 +128,8 @@ export const schema: { types: SchemaTypeDefinition[] } = {
 		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,
+			),
+		],
+	});
+};

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

@@ -0,0 +1,44 @@
+import { defineField, defineType } from "sanity";
+import { AnchorIdInput } from "@/lib/integrations/sanity/components/anchor-id-input";
+import { PresentationInput } from "@/lib/integrations/sanity/components/presentation-input";
+
+export const presentation = defineType({
+	name: "presentation",
+	title: "Presentation Mode",
+	type: "object",
+	components: { input: PresentationInput },
+	fields: [
+		defineField({
+			name: "paddingTop",
+			title: "Padding top",
+			type: "string",
+		}),
+		defineField({
+			name: "paddingBottom",
+			title: "Padding bottom",
+			type: "string",
+		}),
+	],
+});
+
+export const presentationFields = (options?: { group?: string }) => [
+	defineField({
+		name: "anchorId",
+		title: "Anchor ID",
+		type: "string",
+		...(options?.group ? { group: options.group } : {}),
+		components: { input: AnchorIdInput },
+		description:
+			"Links to this block as /page#your-anchor-id. Leave empty to generate it from the block title.",
+		validation: (Rule) =>
+			Rule.regex(/^[a-z0-9]+(?:-[a-z0-9]+)*$/, { name: "anchor id" }).error(
+				"Use lowercase letters, numbers and dashes only (e.g. how-it-works)",
+			),
+	}),
+	defineField({
+		name: "presentation",
+		title: "Presentation Mode",
+		type: "presentation",
+		...(options?.group ? { group: options.group } : {}),
+	}),
+];