@bison-lab/payload-core 3.12.0 → 3.13.0

package/dist/admin.mjs

@@ -1,6 +1,6 @@
 "use client";
 import { a as colorDocFromState, i as SYSTEM_COLOR_KEYS, n as pageEditorLooks, r as pageEditorTokens, s as stateFromColorDoc } from "./looks-BbL309kO.mjs";
-import { ArrayField, CheckboxInput, FieldDescription, FieldError, FieldLabel, fieldBaseClass, useConfig, useField, useForm, useFormFields } from "@payloadcms/ui";
+import { ArrayField, CheckboxInput, FieldDescription, FieldError, FieldLabel, fieldBaseClass, useConfig, useField, useForm, useFormFields, useRowLabel } from "@payloadcms/ui";
 import { GREY_SCALES, SHADE_STEPS, contrastForeground, contrastRatio, createColorScale, deriveDarkPalette, deriveLightPalette, hexToHSL, hslToString, includedShadeSteps, isThemeHex, presetHints, setColorScaleInclude } from "@bison-lab/tokens";
 import { useCallback, useEffect, useId, useMemo, useRef, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -1010,15 +1010,19 @@ function deleteLibraryColor(doc, key, replacement) {
 	return next;
 }
 //#endregion
+//#region src/theme/color-usages.ts
+/** Theme-store REST path. LibraryField calls `/api/globals/theme` + this. */
+const COLOR_USAGES_PATH = "/color-usages";
+//#endregion
 //#region src/admin/library-field.tsx
 function slugify(value) {
 	return value.trim().toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-|-$/g, "");
 }
 /**
-* Custom colors: the same scale controls as system colors. A row that is
-* not referenced on a page deletes immediately. Rewriting in-use tokens
-* (`rewriteColorToken`) waits on a site usage lookup — Theme cannot see
-* page assignments by itself.
+* Custom colors: the same scale controls as system colors. Unused: the
+* Theme store's color-usages endpoint returns nothing and the row is
+* gone. In use: pick a live replacement; confirm rewrites stored tokens
+* then drops the row. Success and Destructive stay off that list.
 */
 const LibraryField = ({ field, path, readOnly }) => {
 	const dataPath = typeof field.admin?.custom?.dataPath === "string" ? field.admin.custom.dataPath : path;
@@ -1027,14 +1031,21 @@ const LibraryField = ({ field, path, readOnly }) => {
 		hasRows: true
 	});
 	const { getDataByPath } = useForm();
+	const { config } = useConfig();
 	const rows = asLibraryRows(value).length > 0 ? asLibraryRows(value) : asLibraryRows(getDataByPath?.(dataPath));
 	const [adding, setAdding] = useState(false);
 	const [name, setName] = useState("");
 	const [hex, setHex] = useState("");
 	const [sourceStep, setSourceStep] = useState(500);
+	const [replacing, setReplacing] = useState(null);
+	const [replacement, setReplacement] = useState("");
+	const [busy, setBusy] = useState(false);
 	function write(next) {
 		setValue(next);
 	}
+	function usagesUrl(key) {
+		return `${config.serverURL ?? ""}${config.routes?.api ?? "/api"}/globals/theme${COLOR_USAGES_PATH}?key=${encodeURIComponent(key)}`;
+	}
 	function add() {
 		const key = slugify(name);
 		if (!key || !isThemeHex(hex) || rows.some((row) => row.key === key)) return;
@@ -1048,9 +1059,42 @@ const LibraryField = ({ field, path, readOnly }) => {
 		setSourceStep(500);
 		setAdding(false);
 	}
-	function remove(row) {
-		write(deleteLibraryColor({ colors: { library: rows } }, row.key ?? "").colors?.library ?? []);
+	async function remove(row) {
+		const key = row.key ?? "";
+		const response = await fetch(usagesUrl(key), { credentials: "include" });
+		if (!response.ok) return;
+		const usages = (await response.json()).usages ?? [];
+		if (usages.length === 0) {
+			write(deleteLibraryColor({ colors: { library: rows } }, key).colors?.library ?? []);
+			return;
+		}
+		setReplacement("");
+		setReplacing({
+			row,
+			usages
+		});
 	}
+	async function confirmReplace() {
+		if (!replacing || !replacement || busy) return;
+		const key = replacing.row.key ?? "";
+		setBusy(true);
+		try {
+			if (!(await fetch(usagesUrl(key), {
+				method: "POST",
+				credentials: "include",
+				headers: { "Content-Type": "application/json" },
+				body: JSON.stringify({
+					key,
+					replacement
+				})
+			})).ok) return;
+			write(deleteLibraryColor({ colors: { library: rows } }, key, replacement).colors?.library ?? []);
+			setReplacing(null);
+		} finally {
+			setBusy(false);
+		}
+	}
+	const replacementOptions = replacing ? pageEditorLooks({ colors: { library: rows.filter((row) => row.key !== replacing.row.key) } }) : [];
 	return /* @__PURE__ */ jsxs("div", {
 		className: "field-type bl-library",
 		children: [
@@ -1136,6 +1180,69 @@ const LibraryField = ({ field, path, readOnly }) => {
 					]
 				})
 			}) }) : null,
+			replacing ? /* @__PURE__ */ jsx(ThemePortal, { children: /* @__PURE__ */ jsx("div", {
+				className: "bl-library__modal",
+				role: "dialog",
+				"aria-modal": "true",
+				"aria-labelledby": "bl-library-replace-title",
+				onClick: (event) => {
+					if (event.target === event.currentTarget && !busy) setReplacing(null);
+				},
+				children: /* @__PURE__ */ jsxs("div", {
+					className: "bl-library__panel",
+					children: [
+						/* @__PURE__ */ jsxs("div", {
+							className: "bl-library__panel-head",
+							children: [/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs("h2", {
+								id: "bl-library-replace-title",
+								children: ["Replace ", replacing.row.label ?? replacing.row.key]
+							}), /* @__PURE__ */ jsx("p", { children: replacing.usages.length === 1 ? "1 document uses this color. Pick a replacement at the same step." : `${replacing.usages.length} documents use this color. Pick a replacement at the same step.` })] }), /* @__PURE__ */ jsx("button", {
+								type: "button",
+								onClick: () => setReplacing(null),
+								"aria-label": "Close",
+								disabled: busy,
+								children: "×"
+							})]
+						}),
+						/* @__PURE__ */ jsx("ul", {
+							className: "bl-library__usages",
+							children: replacing.usages.map((usage, index) => /* @__PURE__ */ jsxs("li", { children: [
+								usage.collection ?? usage.global,
+								usage.id != null ? ` #${usage.id}` : "",
+								" · ",
+								usage.path,
+								" · ",
+								usage.token
+							] }, `${usage.collection ?? usage.global}-${usage.id ?? ""}-${usage.path}-${index}`))
+						}),
+						/* @__PURE__ */ jsxs("label", { children: ["Replacement", /* @__PURE__ */ jsxs("select", {
+							value: replacement,
+							onChange: (event) => setReplacement(event.target.value),
+							children: [/* @__PURE__ */ jsx("option", {
+								value: "",
+								children: "Select a color…"
+							}), replacementOptions.map((option) => /* @__PURE__ */ jsx("option", {
+								value: option.value,
+								children: option.label
+							}, option.value))]
+						})] }),
+						/* @__PURE__ */ jsxs("div", {
+							className: "bl-library__actions",
+							children: [/* @__PURE__ */ jsx("button", {
+								type: "button",
+								onClick: () => setReplacing(null),
+								disabled: busy,
+								children: "Cancel"
+							}), /* @__PURE__ */ jsx("button", {
+								type: "button",
+								disabled: !replacement || busy,
+								onClick: () => void confirmReplace(),
+								children: "Replace and delete"
+							})]
+						})
+					]
+				})
+			}) }) : null,
 			/* @__PURE__ */ jsx("div", {
 				className: "bl-library__list",
 				children: rows.map((row, index) => /* @__PURE__ */ jsx(ColorScaleCard, {
@@ -1152,7 +1259,7 @@ const LibraryField = ({ field, path, readOnly }) => {
 						};
 						write(copy);
 					},
-					onDelete: readOnly ? void 0 : () => remove(row),
+					onDelete: readOnly ? void 0 : () => void remove(row),
 					readOnly
 				}, row.key ?? index))
 			})
@@ -1173,6 +1280,8 @@ const CSS$3 = `
 .bl-library__panel p{margin:.5rem 0 0;color:#475569;font-size:14px}
 .bl-library__panel label{display:flex;flex-direction:column;gap:.4rem;margin-top:1rem;font-size:13px;font-weight:600}
 .bl-library__panel input,.bl-library__panel select{min-height:2.25rem;border:1px solid #cbd5e1;border-radius:8px;padding:.35rem .5rem;background:#fff;color:#0f172a}
+.bl-library__usages{margin:1rem 0 0;padding-left:1.1rem;color:#475569;font-size:13px;font-weight:400}
+.bl-library__usages li{margin:.25rem 0}
 .bl-library__actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.5rem;margin-top:1rem}
 .bl-library__actions button:last-child{border:0;background:#0f172a;color:#fff;font-weight:600}
 .bl-library__actions button:last-child:disabled{opacity:.4;cursor:not-allowed}
@@ -2433,8 +2542,18 @@ const CAPABILITIES = [
 function isRole(value) {
 	return typeof value === "string" && ROLES.includes(value);
 }
+/** Lowercase slug: `editor`, `site-editor`. Empty and punctuation are out. */
+function isRoleSlug(value) {
+	return typeof value === "string" && /^[a-z][a-z0-9]*(-[a-z0-9]+)*$/.test(value);
+}
+function roleLabel(role, label) {
+	const trimmed = typeof label === "string" ? label.trim() : "";
+	if (trimmed) return trimmed;
+	return isRole(role) ? ROLE_LABELS[role] : role;
+}
 //#endregion
 //#region src/roles/matrix.ts
+const ROLES_SLUG = "roles";
 /**
 * Default rank and ticks. Brand is Designer only. The API tab is not a
 * column — it is locked to Developer in `isDeveloper`.
@@ -2470,21 +2589,73 @@ const DEFAULT_ROLE_MATRIX = [
 	}
 ];
 const DEVELOPER_DESCRIPTION = "Everything Admin can do, plus the document API tab.";
+const MISSING_SEED_ROLES_MESSAGE = "Roles must include Developer, Admin, Designer, and Author.";
+const DUPLICATE_ROLE_SLUG_MESSAGE = "Each role needs a unique slug.";
 const CAPABILITY_LABELS = {
 	content: "Content",
 	brand: "Brand",
 	publish: "Publish",
 	users: "Users"
 };
-function defaultRolesFieldValue() {
-	return DEFAULT_ROLE_MATRIX.map((row) => ({
+function seedRoleRows(extras = []) {
+	return [...DEFAULT_ROLE_MATRIX.map((row) => ({
+		...row,
+		label: isRole(row.role) ? ROLE_LABELS[row.role] : row.role
+	})), ...extras.map((extra) => ({ ...extra }))];
+}
+function defaultRolesFieldValue(extras = []) {
+	return seedRoleRows(extras).map((row) => ({
 		id: row.role,
 		...row
 	}));
 }
+function readRoleRow(item) {
+	const role = "role" in item ? item.role : void 0;
+	if (typeof role !== "string" || role.trim() === "") return { error: DUPLICATE_ROLE_SLUG_MESSAGE };
+	if (!isRoleSlug(role)) return { error: DUPLICATE_ROLE_SLUG_MESSAGE };
+	return {
+		id: role,
+		role,
+		label: roleLabel(role, "label" in item && typeof item.label === "string" ? item.label : void 0),
+		content: Boolean("content" in item && item.content),
+		brand: Boolean("brand" in item && item.brand),
+		publish: Boolean("publish" in item && item.publish),
+		users: Boolean("users" in item && item.users)
+	};
+}
+function parseRolesMatrix(value) {
+	if (!Array.isArray(value)) return {
+		ok: false,
+		message: MISSING_SEED_ROLES_MESSAGE
+	};
+	const rows = [];
+	const seen = /* @__PURE__ */ new Set();
+	for (const item of value) {
+		if (!item || typeof item !== "object") continue;
+		const parsed = readRoleRow(item);
+		if ("error" in parsed) return {
+			ok: false,
+			message: parsed.error
+		};
+		if (seen.has(parsed.role)) return {
+			ok: false,
+			message: DUPLICATE_ROLE_SLUG_MESSAGE
+		};
+		seen.add(parsed.role);
+		rows.push(parsed);
+	}
+	if (ROLES.some((role) => !seen.has(role))) return {
+		ok: false,
+		message: MISSING_SEED_ROLES_MESSAGE
+	};
+	return {
+		ok: true,
+		rows
+	};
+}
 function roleSelectOptions(matrix = DEFAULT_ROLE_MATRIX) {
 	return matrix.map((row) => ({
-		label: ROLE_LABELS[row.role],
+		label: roleLabel(row.role, row.label),
 		value: row.role
 	}));
 }
@@ -2495,17 +2666,58 @@ function roleDescription(role, matrix = DEFAULT_ROLE_MATRIX) {
 	if (!row) return "No capabilities";
 	return CAPABILITIES.filter((capability) => row[capability]).map((capability) => CAPABILITY_LABELS[capability]).join(", ") || "No capabilities";
 }
+/**
+* Seed ticks and package labels come back; extra rows stay as they are.
+*/
+function resetRolesMatrix(current) {
+	const extras = [];
+	if (Array.isArray(current)) for (const item of current) {
+		if (!item || typeof item !== "object") continue;
+		const parsed = readRoleRow(item);
+		if ("error" in parsed || isRole(parsed.role)) continue;
+		extras.push(parsed);
+	}
+	return [...defaultRolesFieldValue(), ...extras];
+}
 //#endregion
 //#region src/admin/roles-matrix-field.tsx
-const HIDE_ROW_CHROME = `.bl-roles-matrix .array-field__add-row,.bl-roles-matrix .array-actions__add,.bl-roles-matrix .array-actions__remove,.bl-roles-matrix .array-actions__duplicate,.bl-roles-matrix .array-actions__copy{display:none}.bl-roles-matrix__toolbar{display:flex;justify-content:flex-end;margin-block-end:.75rem}.bl-roles-matrix__reset{min-height:2.25rem;padding:.35rem .9rem;border:1px solid var(--theme-elevation-150,#e2e8f0);border-radius:8px;background:transparent;color:inherit;font:inherit;cursor:pointer}`;
+const HIDE_ROW_CHROME = `.bl-roles-matrix .array-actions__add,.bl-roles-matrix .array-actions__duplicate,.bl-roles-matrix .array-actions__copy{display:none}.bl-roles-matrix__toolbar{display:flex;justify-content:flex-end;margin-block-end:.75rem}.bl-roles-matrix__reset{min-height:2.25rem;padding:.35rem .9rem;border:1px solid var(--theme-elevation-150,#e2e8f0);border-radius:8px;background:transparent;color:inherit;font:inherit;cursor:pointer}body.bl-roles-matrix-seed-menu .array-actions__remove{display:none}`;
+function seedRoleFromTrigger(trigger) {
+	let node = trigger.parentElement;
+	while (node) {
+		const slugs = node.querySelectorAll("[data-role-slug]");
+		if (slugs.length === 1) return isRole(slugs[0]?.getAttribute("data-role-slug"));
+		if (slugs.length > 1) return false;
+		node = node.parentElement;
+	}
+	return false;
+}
 /**
-* Payload's array field: drag rank stays, add/remove go away. Reset writes
-* the package seed back onto the field.
+* Payload's array field: drag rank stays, add is for custom rows, seed
+* rows have no remove. Reset restores seed ticks and package labels.
 */
 const RolesMatrixField = (props) => {
-	const { setValue } = useField({ path: props.path });
+	const { setValue, value } = useField({ path: props.path });
+	const rootRef = useRef(null);
+	const seedMenu = useRef(false);
 	return /* @__PURE__ */ jsxs("div", {
 		className: "bl-roles-matrix",
+		ref: rootRef,
+		onClickCapture: useCallback((event) => {
+			const target = event.target;
+			if (!(target instanceof Element)) return;
+			const trigger = target.closest(".array-actions__button");
+			if (trigger) {
+				const owner = trigger.closest(".array-field");
+				seedMenu.current = owner !== null && owner === rootRef.current?.querySelector(".array-field") && seedRoleFromTrigger(trigger);
+				document.body.classList.toggle("bl-roles-matrix-seed-menu", seedMenu.current);
+				return;
+			}
+			if (!target.closest(".array-actions__remove")) return;
+			if (!seedMenu.current) return;
+			event.preventDefault();
+			event.stopPropagation();
+		}, []),
 		children: [
 			/* @__PURE__ */ jsx("style", {
 				href: "bl-roles-matrix",
@@ -2517,7 +2729,7 @@ const RolesMatrixField = (props) => {
 				children: /* @__PURE__ */ jsx("button", {
 					type: "button",
 					className: "bl-roles-matrix__reset",
-					onClick: () => setValue(defaultRolesFieldValue()),
+					onClick: () => setValue(resetRolesMatrix(value)),
 					children: "Reset to defaults"
 				})
 			}),
@@ -2526,25 +2738,107 @@ const RolesMatrixField = (props) => {
 	});
 };
 //#endregion
+//#region src/admin/roles-row-label.tsx
+/**
+* Array row header. Shows the current display name, not “Role 01”.
+*/
+function RolesRowLabel() {
+	const { data } = useRowLabel();
+	const role = typeof data.role === "string" ? data.role : "";
+	const label = roleLabel(role, data.label) || "Role";
+	return /* @__PURE__ */ jsx("span", {
+		"data-role-slug": role,
+		children: label
+	});
+}
+//#endregion
+//#region src/admin/role-slug-field.tsx
+/**
+* Seed slugs stay read-only. A custom row's slug is typed here.
+*/
+const RoleSlugField = ({ field, path, readOnly }) => {
+	const { value, setValue, showError, errorMessage } = useField({ path });
+	const locked = Boolean(readOnly) || isRole(value);
+	const required = Boolean(field.required);
+	const id = `field-${path.replace(/\./g, "__")}`;
+	return /* @__PURE__ */ jsxs("div", {
+		className: [
+			fieldBaseClass,
+			"text",
+			locked && "read-only"
+		].filter(Boolean).join(" "),
+		children: [
+			/* @__PURE__ */ jsx(FieldLabel, {
+				htmlFor: id,
+				label: field.label,
+				required
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: `${fieldBaseClass}__wrap`,
+				children: [/* @__PURE__ */ jsx(FieldError, {
+					message: errorMessage,
+					path,
+					showError
+				}), /* @__PURE__ */ jsx("input", {
+					id,
+					"data-role-slug": value ?? "",
+					type: "text",
+					autoComplete: "off",
+					spellCheck: false,
+					readOnly: locked,
+					disabled: locked,
+					value: value ?? "",
+					onChange: (event) => {
+						if (!locked) setValue(event.target.value);
+					}
+				})]
+			}),
+			/* @__PURE__ */ jsx(FieldDescription, {
+				description: field.admin?.description,
+				path
+			})
+		]
+	});
+};
+//#endregion
 //#region src/admin/roles-field.tsx
-const GRID_CSS = `.bl-roles__grid{display:grid;gap:.75rem;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));margin-block:.35rem 0}.bl-roles__option{display:flex;flex-direction:column;gap:.25rem;padding:.65rem .75rem;border:1px solid var(--theme-elevation-150,#e2e8f0);border-radius:8px}.bl-roles__option.is-checked{border-color:var(--theme-elevation-400,#94a3b8)}.bl-roles__option.is-included{opacity:.7}.bl-roles__what{font-size:.8rem;line-height:1.35;color:var(--theme-elevation-500,#64748b)}`;
+const GRID_CSS$1 = `.bl-roles__grid{display:grid;gap:.75rem;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));margin-block:.35rem 0}.bl-roles__option{display:flex;flex-direction:column;gap:.25rem;padding:.65rem .75rem;border:1px solid var(--theme-elevation-150,#e2e8f0);border-radius:8px}.bl-roles__option.is-checked{border-color:var(--theme-elevation-400,#94a3b8)}.bl-roles__option.is-included{opacity:.7}.bl-roles__what{font-size:.8rem;line-height:1.35;color:var(--theme-elevation-500,#64748b)}`;
 function optionValue(option) {
 	return typeof option === "string" ? option : String(option.value);
 }
 function optionLabel(option) {
 	return typeof option === "string" ? option : String(option.label);
 }
+function useOfferedRoles(fallback) {
+	const { config } = useConfig();
+	const [live, setLive] = useState(null);
+	const api = config?.routes?.api;
+	const serverURL = config?.serverURL ?? "";
+	useEffect(() => {
+		if (!api) return;
+		let cancelled = false;
+		fetch(`${serverURL}${api}/globals/${ROLES_SLUG}?depth=0`, { credentials: "include" }).then((response) => response.ok ? response.json() : null).then((doc) => {
+			if (cancelled || !doc) return;
+			const parsed = parseRolesMatrix(doc.roles);
+			if (parsed.ok) setLive(roleSelectOptions(parsed.rows));
+		}).catch(() => void 0);
+		return () => {
+			cancelled = true;
+		};
+	}, [api, serverURL]);
+	return live ?? fallback;
+}
 /**
 * Users Roles checklist. Order and labels come from the field options (the
-* Roles Global, or the seed). Copy is `roleDescription`. Developer is
-* exclusive; Admin does not swallow Designer.
+* Roles Global, or the seed plus extras). Copy is `roleDescription`.
+* Developer is exclusive; a custom role does not clear Designer.
 */
 const RolesField = ({ field, path: pathFromProps, readOnly, validate }) => {
 	const { admin: { description } = {}, label, localized, options = [], required } = field;
-	const offered = (options.length ? options : roleSelectOptions()).map((option) => ({
+	const offered = useOfferedRoles((options.length ? options : roleSelectOptions()).map((option) => ({
 		value: optionValue(option),
 		label: optionLabel(option)
-	}));
+	})));
 	const { disabled, errorMessage, path, setValue, showError, value } = useField({
 		potentiallyStalePath: pathFromProps,
 		validate: useCallback((value, validationOptions) => {
@@ -2587,7 +2881,7 @@ const RolesField = ({ field, path: pathFromProps, readOnly, validate }) => {
 			/* @__PURE__ */ jsx("style", {
 				href: "bl-roles",
 				precedence: "default",
-				children: GRID_CSS
+				children: GRID_CSS$1
 			}),
 			/* @__PURE__ */ jsx(FieldLabel, {
 				as: "span",
@@ -2607,7 +2901,7 @@ const RolesField = ({ field, path: pathFromProps, readOnly, validate }) => {
 					className: "bl-roles__grid",
 					role: "group",
 					children: offered.map((option) => {
-						const role = isRole(option.value) ? option.value : null;
+						const role = option.value;
 						if (!role) return null;
 						const included = exclusive !== null && role !== exclusive;
 						const checked = selected.includes(role);
@@ -2620,7 +2914,7 @@ const RolesField = ({ field, path: pathFromProps, readOnly, validate }) => {
 							children: [/* @__PURE__ */ jsx(CheckboxInput, {
 								checked,
 								id: `${path}-${role}`,
-								label: option.label || ROLE_LABELS[role],
+								label: option.label || roleLabel(role),
 								onToggle: () => toggle(role),
 								readOnly: locked || included
 							}), /* @__PURE__ */ jsx("span", {
@@ -2639,6 +2933,135 @@ const RolesField = ({ field, path: pathFromProps, readOnly, validate }) => {
 	});
 };
 //#endregion
-export { AppearanceField, ColorField, ColorScaleField, ContrastReport, FontField, GreyScaleField, HiddenSaveButton, IdentityFallback, LibraryField, LookField, PairingField, PublishChild, RolesField, RolesMatrixField, SectionHeading, ThemeDocumentControls, ThemeSaveButton };
+//#region src/features/types.ts
+/**
+* Package catalogue. Locked rows cannot be turned off. Empty Global falls
+* back to the named capability (Content → Pages/Media, Brand → Theme /
+* Brand assets, Users → Users/Roles/Features).
+*/
+const PACKAGE_FEATURES = [
+	{
+		slug: "pages",
+		label: "Pages",
+		fallback: "content",
+		locked: false
+	},
+	{
+		slug: "media",
+		label: "Media",
+		fallback: "content",
+		locked: false
+	},
+	{
+		slug: "theme",
+		label: "Theme",
+		fallback: "brand",
+		locked: false
+	},
+	{
+		slug: "brand-assets",
+		label: "Brand assets",
+		fallback: "brand",
+		locked: false
+	},
+	{
+		slug: "users",
+		label: "Users",
+		fallback: "users",
+		locked: true
+	},
+	{
+		slug: "roles",
+		label: "Roles",
+		fallback: "users",
+		locked: true
+	},
+	{
+		slug: "features",
+		label: "Features",
+		fallback: "users",
+		locked: true
+	}
+];
+function isLockedFeature(slug, locked) {
+	if (locked === true) return true;
+	return PACKAGE_FEATURES.find((feature) => feature.slug === slug)?.locked === true;
+}
+//#endregion
+//#region src/admin/features-matrix-field.tsx
+const GRID_CSS = `.bl-features{margin-block:.35rem 0;overflow:auto}.bl-features table{width:100%;border-collapse:collapse;font:inherit}.bl-features th,.bl-features td{padding:.45rem .6rem;border-bottom:1px solid var(--theme-elevation-150,#e2e8f0);text-align:center;white-space:nowrap}.bl-features th:first-child,.bl-features td:first-child{text-align:left;font-weight:600}.bl-features th{font-size:.8rem;color:var(--theme-elevation-500,#64748b)}.bl-features input{inline-size:1rem;block-size:1rem}`;
+function asRows(value) {
+	return Array.isArray(value) ? value : [];
+}
+/**
+* Feature × role grid. Columns come from the Roles Global (or the seed).
+* Locked rows and Developer cannot be cleared.
+*/
+const FeaturesMatrixField = (props) => {
+	const { setValue, value } = useField({ path: props.path });
+	const { config } = useConfig();
+	const [columns, setColumns] = useState(roleSelectOptions(seedRoleRows()));
+	const api = config?.routes?.api;
+	const serverURL = config?.serverURL ?? "";
+	useEffect(() => {
+		if (!api) return;
+		let cancelled = false;
+		fetch(`${serverURL}${api}/globals/${ROLES_SLUG}?depth=0`, { credentials: "include" }).then((response) => response.ok ? response.json() : null).then((doc) => {
+			if (cancelled || !doc) return;
+			const parsed = parseRolesMatrix(doc.roles);
+			if (parsed.ok) setColumns(roleSelectOptions(parsed.rows));
+		}).catch(() => void 0);
+		return () => {
+			cancelled = true;
+		};
+	}, [api, serverURL]);
+	const rows = asRows(value);
+	function toggle(slug, role, checked) {
+		if (role === "developer") return;
+		setValue(rows.map((row) => {
+			if (row.slug !== slug || isLockedFeature(row.slug, row.locked)) return row;
+			const roles = new Set(row.roles ?? []);
+			if (checked) roles.add(role);
+			else roles.delete(role);
+			roles.add("developer");
+			return {
+				...row,
+				roles: [...roles]
+			};
+		}));
+	}
+	return /* @__PURE__ */ jsxs("div", {
+		className: "bl-features",
+		children: [/* @__PURE__ */ jsx("style", {
+			href: "bl-features",
+			precedence: "default",
+			children: GRID_CSS
+		}), /* @__PURE__ */ jsxs("table", { children: [/* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [/* @__PURE__ */ jsx("th", {
+			scope: "col",
+			children: "Feature"
+		}), columns.map((column) => /* @__PURE__ */ jsx("th", {
+			scope: "col",
+			children: column.label
+		}, column.value))] }) }), /* @__PURE__ */ jsx("tbody", { children: rows.map((row) => {
+			const locked = isLockedFeature(row.slug, row.locked);
+			return /* @__PURE__ */ jsxs("tr", { children: [/* @__PURE__ */ jsx("th", {
+				scope: "row",
+				children: row.label || row.slug
+			}), columns.map((column) => {
+				const disabled = locked || column.value === "developer";
+				const checked = column.value === "developer" || locked || Boolean(row.roles?.includes(column.value));
+				return /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx("input", {
+					type: "checkbox",
+					"aria-label": `${row.label || row.slug} · ${column.label}`,
+					checked,
+					disabled,
+					onChange: (event) => toggle(row.slug, column.value, event.target.checked)
+				}) }, column.value);
+			})] }, row.slug);
+		}) })] })]
+	});
+};
+//#endregion
+export { AppearanceField, ColorField, ColorScaleField, ContrastReport, FeaturesMatrixField, FontField, GreyScaleField, HiddenSaveButton, IdentityFallback, LibraryField, LookField, PairingField, PublishChild, RoleSlugField, RolesField, RolesMatrixField, RolesRowLabel, SectionHeading, ThemeDocumentControls, ThemeSaveButton };
 
 //# sourceMappingURL=admin.mjs.map