@redneckz/wildless-cms-uni-blocks 0.14.858 → 0.14.860

package/mobile/src/content-page-repository/computeImgOutputPath.ts

@@ -0,0 +1,21 @@
+import path from 'path';
+import { type ImgSource } from '../model/Picture';
+import { type TransformationOptions } from './TransformationOptions';
+
+export function computeImgOutputPath(
+  imgInputPath: string,
+  { contentDir, publicDir, format, size }: TransformationOptions & ImgSource,
+  withoutTransform = false,
+): string {
+  const imgRelativePath = path.relative(contentDir, imgInputPath);
+
+  const imgDir = path.dirname(imgRelativePath);
+
+  const inputExt = path.extname(imgRelativePath);
+  const fileName = path.basename(imgRelativePath, inputExt);
+  const suffixParts = [size?.width, size?.height].filter(Boolean);
+  const suffix = suffixParts.length && !withoutTransform ? `-${suffixParts.join('-')}` : '';
+  const ext = format && !withoutTransform ? `.${format}` : inputExt;
+
+  return path.join(publicDir, imgDir, `${fileName}${suffix}${ext}`);
+}

package/mobile/src/content-page-repository/extensions.ts

@@ -0,0 +1,17 @@
+export const OUTPUT_SUFFIX = '.static';
+
+export const DOCUMENT_EXT_LIST = [
+  '.txt',
+  '.doc',
+  '.docx',
+  '.xls',
+  '.xlsx',
+  '.xlsb',
+  '.ppt',
+  '.pptx',
+  '.pdf',
+  '.zip',
+  '.7z',
+];
+
+export const IMAGE_EXT_LIST = ['.jpeg', '.jpg', '.png', '.gif', '.webp', '.heif', '.avif', '.svg'];

package/mobile/src/content-page-repository/index.ts

@@ -0,0 +1,3 @@
+export { clearAttachmentHref } from './clearAttachmentHref';
+export { ContentPageRepository } from './ContentPageRepository';
+export { transformContentPage } from './transformContentPage';

package/mobile/src/content-page-repository/mapJSON.ts

@@ -0,0 +1,30 @@
+export async function mapJSON<T>(
+  data: T,
+  mapper: <In, Out = In>(value: In, key: string[]) => Promise<Out>,
+  keyParts: string[] = [],
+): Promise<T> {
+  if (data === null || data === undefined) {
+    return data;
+  }
+
+  const mappedData = await mapper(data, keyParts);
+  if (mappedData !== data) {
+    return mappedData as T;
+  }
+
+  if (Array.isArray(data)) {
+    const values = data.map((_, i) => mapJSON(_, mapper, [String(i)].concat(keyParts)));
+
+    return Promise.all(values) as any;
+  } else if (typeof data === 'object' && (data as any).toString() === '[object Object]') {
+    const subKeys = Object.keys(data);
+    const values = subKeys.map((k) => mapJSON(data[k], mapper, [k].concat(keyParts)));
+    const pairs = (await Promise.all(values)).map((_, i) => ({
+      [subKeys[i]]: _,
+    }));
+
+    return Object.assign({}, ...pairs);
+  }
+
+  return mapper<T>(data, keyParts);
+}

package/mobile/src/content-page-repository/mergePages.ts

@@ -0,0 +1,8 @@
+import { leafs, merge, type JSONRecord } from '@redneckz/json-op';
+import { JSONDocContentBox } from './JSONDocContentBox';
+
+export const mergePages = (page: JSONRecord, diffs: JSONRecord): JSONRecord =>
+  merge(
+    new JSONDocContentBox(page as JSONRecord),
+    leafs(new JSONDocContentBox(diffs as JSONRecord)),
+  ) as JSONRecord;

package/mobile/src/content-page-repository/replaceHeadingTags.ts

@@ -0,0 +1,2 @@
+export const replaceHeadingTags = (html: string) =>
+  html.replaceAll(/<h(\d)>(.*?)<\/h\d>/g, '<p class="h$1">$2</p>');

package/mobile/src/content-page-repository/resizeImg.ts

@@ -0,0 +1,17 @@
+import sharp, { type ResizeOptions, type Sharp } from 'sharp';
+import { type ImageSize } from '../model/ImageSize';
+
+export const resizeImg =
+  (size?: Partial<ImageSize>, options?: ResizeOptions) =>
+  (chain: Sharp): Sharp =>
+    size
+      ? chain.resize(size.width || null, size.height || null, {
+          /*
+           * Editor behaviour with one dimension present: resize by given dimension maintaining aspect ratio. (fit: contain)
+           * With two dimensions present: resize trying to fill given dimensions (fit: fill)
+           */
+          fit: size.width && size.height ? sharp.fit.fill : sharp.fit.contain,
+          background: { r: 0, g: 0, b: 0, alpha: 0 },
+          ...options,
+        })
+      : chain;

package/mobile/src/content-page-repository/transformAttachmentLink.ts

@@ -0,0 +1,46 @@
+import fs from 'fs';
+import path from 'path';
+import util from 'util';
+import { type LinkProps } from '../model/LinkProps';
+import { isUUID } from '../utils/isUUID';
+import { clearAttachmentHref } from './clearAttachmentHref';
+import { type TransformationOptions } from './TransformationOptions';
+
+const mkdir = util.promisify(fs.mkdir);
+const copyFile = util.promisify(fs.copyFile);
+
+export async function transformAttachmentLink(
+  link: LinkProps,
+  pagePath: string,
+  options: TransformationOptions,
+): Promise<LinkProps> {
+  if (!link?.href) {
+    return link;
+  }
+
+  try {
+    return {
+      ...link,
+      href: await transformHref(clearAttachmentHref(link.href), options),
+    };
+  } catch (e) {
+    console.info(`No "${link.href}" attachment found on page: "${pagePath}"`);
+
+    return link;
+  }
+}
+
+async function transformHref(input: string, options: TransformationOptions) {
+  if (isUUID(input)) {
+    return input;
+  }
+
+  const { contentDir, publicDir } = options;
+  const docRelativePath = path.relative(contentDir, input);
+  const output = path.join(publicDir, docRelativePath);
+
+  await mkdir(path.dirname(output), { recursive: true });
+  await copyFile(input, output);
+
+  return path.join('/', docRelativePath);
+}

package/mobile/src/content-page-repository/transformContentPage.ts

@@ -0,0 +1,102 @@
+import { type JSONRecord } from '@redneckz/json-op';
+import fs from 'fs';
+import util from 'util';
+import { type Attachment } from '../model/Attachment';
+import { type ContentPageDef } from '../model/ContentPageDef';
+import { type LinkProps } from '../model/LinkProps';
+import { type Picture } from '../model/Picture';
+import { isUUID } from '../utils/isUUID';
+import { tableFunc } from '../utils/tableFunc';
+import { ATTACHMENT_PREFIX } from './clearAttachmentHref';
+import { DOCUMENT_EXT_LIST, IMAGE_EXT_LIST, OUTPUT_SUFFIX } from './extensions';
+import { mapJSON } from './mapJSON';
+import { mergePages } from './mergePages';
+import { type TransformationOptions } from './TransformationOptions';
+import { transformAttachmentLink } from './transformAttachmentLink';
+import { transformDocument } from './transformDocument';
+import { transformHTML } from './transformHTML';
+import { transformMarkdown } from './transformMarkdown';
+import { transformPicture } from './transformPicture';
+
+const readFile = util.promisify(fs.readFile);
+const writeFile = util.promisify(fs.writeFile);
+
+const DEFAULT_PARENT_CONTENT = {};
+
+export async function transformContentPage(
+  pagePath: string,
+  options: TransformationOptions,
+): Promise<ContentPageDef> {
+  const content: JSONRecord = JSON.parse(await readFile(pagePath, 'utf8'));
+  const parentContent: JSONRecord = await (content?._extends
+    ? JSON.parse(await readFile(content._extends as string, 'utf-8'))
+    : DEFAULT_PARENT_CONTENT);
+
+  const mergedContent = mergePages(parentContent, content);
+
+  const result = await mapJSON(mergedContent as ContentPageDef, async (value: any, [key]) => {
+    try {
+      return await transform([value, key])(value, pagePath, options);
+    } catch (ex) {
+      console.warn(`Error while transforming field "${key}" on page: ${pagePath}`);
+      console.error(ex);
+    }
+
+    return value;
+  });
+
+  await writeFile(generatedPagePath(pagePath), JSON.stringify(result), 'utf-8');
+
+  return result;
+}
+
+const transform = tableFunc<
+  [any, string],
+  (value: any, pagePath: string, options: TransformationOptions) => Promise<any>
+>([
+  [([value, key]) => isMarkdown(key, value), async (value: string) => transformMarkdown(value)],
+  [([value, key]) => isHTML(key, value), async (value: string) => transformHTML(value)],
+  [([value]) => isUUID(value?.src as string), async (value) => ({ src: value?.src })],
+  [
+    ([value]) => isAttachmentLink(value),
+    async (value, pagePath, options) =>
+      transformAttachmentLink(value as LinkProps, pagePath, options),
+  ],
+  [
+    ([value]) => isAttachmentFile(value, DOCUMENT_EXT_LIST),
+    async (value, pagePath, options) => transformDocument(value as Attachment, pagePath, options),
+  ],
+  [
+    ([value]) => isAttachmentFile(value, IMAGE_EXT_LIST),
+    async (value, pagePath, options) => transformPicture(value as Picture, pagePath, options),
+  ],
+  [() => true, async (value) => value],
+]);
+
+export const generatedPagePath = (pagePath: string) => `${pagePath}${OUTPUT_SUFFIX}`;
+
+const isMarkdown = (key: string, value: any): value is string =>
+  isString(value) && key?.endsWith('__md');
+const isHTML = (key: string, value: any): value is string =>
+  isString(value) && key?.endsWith('__html');
+
+const isAttachmentLink = (_: any): _ is LinkProps =>
+  isLocalPath(_?.href) && (_.href.startsWith(ATTACHMENT_PREFIX) || isLocalFile(_.href));
+
+const isAttachmentFile = (_: any, exts: string[]): _ is Attachment =>
+  Boolean(_ && isLocalPath(_?.src)) && exts.some((ext) => _.src.toLowerCase().endsWith(ext));
+
+const isLocalPath = (_: any): _ is string => isString(_) && _.length < 1024 && !isURL(_);
+const isURL = (src: string) => ['data:', 'https:', 'http:'].some((proto) => src.startsWith(proto));
+
+const isString = (_: any): _ is string => Boolean(_ && typeof _ === 'string');
+
+const isLocalFile = (_: any): _ is string => isString(_) && isFileExists(_);
+
+const isFileExists = (_: string) => {
+  try {
+    return fs.statSync(_).isFile();
+  } catch (ex) {
+    return false;
+  }
+};

package/mobile/src/content-page-repository/transformDocument.ts

@@ -0,0 +1,43 @@
+import fs from 'fs';
+import path from 'path';
+import util from 'util';
+import { type Attachment } from '../model/Attachment';
+import { isUUID } from '../utils/isUUID';
+import { type TransformationOptions } from './TransformationOptions';
+
+const mkdir = util.promisify(fs.mkdir);
+const copyFile = util.promisify(fs.copyFile);
+const stat = util.promisify(fs.stat);
+
+export async function transformDocument(
+  attachment: Attachment,
+  pagePath: string,
+  options: TransformationOptions,
+): Promise<Attachment> {
+  if (!attachment?.src || isUUID(attachment.src)) {
+    return attachment;
+  }
+
+  const { contentDir, publicDir } = options;
+  const input = attachment.src;
+  const docRelativePath = path.relative(contentDir, input);
+  const output = path.join(publicDir, docRelativePath);
+  const inputFileSize = (await stat(input)).size;
+
+  try {
+    await mkdir(path.dirname(output), { recursive: true });
+    await copyFile(input, output);
+  } catch (e) {
+    console.info(`No "${input}" attachment found on page: "${pagePath}"`);
+
+    return attachment;
+  }
+
+  const src = path.join('/', docRelativePath);
+
+  return {
+    ...attachment,
+    src,
+    fileSize: inputFileSize,
+  };
+}

package/mobile/src/content-page-repository/transformHTML.ts

@@ -0,0 +1,28 @@
+import rehypeParse from 'rehype-parse';
+import rehypeSanitize, { defaultSchema } from 'rehype-sanitize';
+import rehypeStringify from 'rehype-stringify';
+import { unified } from 'unified';
+import { replaceHeadingTags } from './replaceHeadingTags';
+
+export async function transformHTML(html: string | null | undefined): Promise<string> {
+  if (!html) {
+    return '';
+  }
+
+  const extendedSchema = {
+    ...defaultSchema,
+    protocols: {
+      ...defaultSchema.protocols,
+      href: [...(defaultSchema?.protocols?.href || []), 'tel'],
+      src: [...(defaultSchema.protocols?.src ?? []), 'data'],
+    },
+  };
+
+  const result = await unified()
+    .use(rehypeParse)
+    .use(rehypeSanitize, extendedSchema)
+    .use(rehypeStringify)
+    .process(html);
+
+  return replaceHeadingTags(result.toString('utf-8'));
+}

package/mobile/src/content-page-repository/transformImg.ts

@@ -0,0 +1,81 @@
+import fs from 'fs';
+import path from 'path';
+import sharp, { type Sharp } from 'sharp';
+import util from 'util';
+import { type ImageSize } from '../model/ImageSize';
+import { type ImgSource } from '../model/Picture';
+import { isPictureSizeEmpty } from '../utils/isPictureSizeEmpty';
+import { computeImgOutputPath } from './computeImgOutputPath';
+import { resizeImg } from './resizeImg';
+import { type TransformationOptions } from './TransformationOptions';
+
+const mkdir = util.promisify(fs.mkdir);
+const copyFile = util.promisify(fs.copyFile);
+
+type ImgOutputPath = string;
+type TransformationTaskKey = ImgOutputPath;
+type TransformationTasksCache = Map<TransformationTaskKey, Promise<ImgOutputPath>>;
+
+type TransformImgOptions = TransformationOptions &
+  ImgSource & { containerSize?: ImageSize; cache?: TransformationTasksCache };
+
+const defaultTransformationCache: TransformationTasksCache = new Map();
+
+const isNilTransform = ({ size, containerSize, format }: TransformImgOptions) =>
+  isPictureSizeEmpty(size) && isPictureSizeEmpty(containerSize) && !format;
+
+const isVectorInput = (input: string) =>
+  ['.svg', '.eps', '.epsf', '.epsi', '.pdf'].some((ext) => input.toLowerCase().endsWith(ext));
+
+export function transformImg(
+  src: string,
+  pagePath: string,
+  options: TransformImgOptions,
+): ImgOutputPath | Promise<ImgOutputPath> {
+  if (!src) {
+    return src;
+  }
+
+  const withoutTransform = isNilTransform(options) || isVectorInput(src);
+
+  const output = computeImgOutputPath(src, options, withoutTransform);
+
+  const { cache = defaultTransformationCache } = options;
+
+  const cachedResult = cache.get(output);
+  if (cachedResult) {
+    return cachedResult;
+  }
+
+  const result = (async () => {
+    try {
+      await mkdir(path.dirname(output), { recursive: true });
+      if (withoutTransform) {
+        await copyFile(src, output);
+      } else {
+        const chain = await computeTransformationChain(options)(sharp(src));
+        await chain.toFile(output);
+      }
+    } catch (e) {
+      console.info(`No "${src}" attachment found on page: "${pagePath}"`);
+    }
+
+    return output;
+  })();
+  cache.set(output, result);
+
+  return result;
+}
+
+const computeTransformationChain = ({
+  size,
+  containerSize,
+  format,
+  options,
+}: TransformImgOptions) =>
+  pipe(resizeImg(isPictureSizeEmpty(size) ? containerSize : size), (_) =>
+    format ? _.toFormat(format, { ...options, lossless: true }) : _,
+  );
+
+const pipe = (...operations: Array<(chain: Sharp) => Promise<Sharp> | Sharp>) =>
+  operations.reduce((a, b) => async (chain: Sharp) => b(await a(chain)));

package/mobile/src/content-page-repository/transformMarkdown.ts

@@ -0,0 +1,14 @@
+import remarkHtml from 'remark-html';
+import remarkParse from 'remark-parse';
+import { unified } from 'unified';
+import { replaceHeadingTags } from './replaceHeadingTags';
+
+export async function transformMarkdown(markdown: string | null | undefined): Promise<string> {
+  if (!markdown) {
+    return '';
+  }
+
+  const result = await unified().use(remarkParse).use(remarkHtml).process(markdown);
+
+  return replaceHeadingTags(result.toString('utf-8'));
+}

package/mobile/src/content-page-repository/transformPicture.ts

@@ -0,0 +1,35 @@
+import path from 'path';
+import sharp from 'sharp';
+import { type Picture } from '../model/Picture';
+import { type TransformationOptions } from './TransformationOptions';
+import { transformImg } from './transformImg';
+
+export async function transformPicture(
+  picture: Picture,
+  pagePath: string,
+  options: TransformationOptions,
+): Promise<Picture> {
+  const src = picture?.src || '';
+
+  const transformedImgPath = await transformImg(src, pagePath, { ...options, ...picture });
+
+  const { width, height } = await sharp(transformedImgPath).metadata();
+  const containerSize = width && height ? { width, height } : undefined;
+
+  const sources = picture.sources || [];
+  const transformedSources = await Promise.all(
+    sources.map((_) => transformImg(src, pagePath, { ...options, ..._, containerSize })),
+  );
+
+  const imgPathToSrc = (_: string) => path.join('/', path.relative(options.publicDir, _));
+
+  return {
+    ...picture,
+    src: imgPathToSrc(transformedImgPath),
+    sources: transformedSources.map((_, i) => ({
+      ...sources[i],
+      src: imgPathToSrc(_),
+      size: { width, height },
+    })),
+  };
+}

package/mobile/src/model/Fallback.ts

@@ -1,4 +1,5 @@
 type Key = string;
 type Data = any;
 
+export type FallbackMap = Record<Key, () => Promise<Data>>;
 export type Fallback = Record<Key, Data>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redneckz/wildless-cms-uni-blocks",
-  "version": "0.14.858",
+  "version": "0.14.860",
   "private": false,
   "license": "MIT",
   "author": "ЦК",
@@ -39,6 +39,26 @@
     "./lib/common.css": "./lib/common.css",
     "./mobile/lib/common.css": "./mobile/lib/common.css",
     "./fonts/ubuntu/*": "./fonts/ubuntu/*",
+    "./lib/content-page-repository": {
+      "import": "./lib/content-page-repository/index.js",
+      "require": "./dist/content-page-repository/index.js",
+      "types": "./lib/content-page-repository/index.d.ts"
+    },
+    "./lib/content-page-repository/*": {
+      "import": "./lib/content-page-repository/*.js",
+      "require": "./dist/content-page-repository/*.js",
+      "types": "./lib/content-page-repository/*.d.ts"
+    },
+    "./mobile/lib/content-page-repository": {
+      "import": "./mobile/lib/content-page-repository/index.js",
+      "require": "./mobile/dist/content-page-repository/index.js",
+      "types": "./mobile/lib/content-page-repository/index.d.ts"
+    },
+    "./mobile/lib/content-page-repository/*": {
+      "import": "./mobile/lib/content-page-repository/*.js",
+      "require": "./mobile/dist/content-page-repository/*.js",
+      "types": "./mobile/lib/content-page-repository/*.d.ts"
+    },
     "./bundle/*.js": "./bundle/*.js",
     "./bundle/*.json": "./bundle/*.json",
     "./*.json": "./*.json",

package/src/components/ContentPage/ContentPage.fixture.mobile.tsx

@@ -4,12 +4,15 @@ import '../../setup-fixture';
 import { type ContentPageDef } from '../../model/ContentPageDef';
 import { Blocks } from '../Blocks';
 import { ContentPage } from './ContentPage';
+import { normalizePage } from './normalizePage';
 import { useContentPageData } from './useContentPageData';
 
 export default {
   default: () => {
     const data = useContentPageData(Blocks);
 
-    return <ContentPage blocksRegistry={Blocks} data={data as ContentPageDef} />;
+    return (
+      <ContentPage blocksRegistry={Blocks} data={normalizePage(Blocks)(data as ContentPageDef)} />
+    );
   },
 };

package/src/components/ContentPage/ContentPage.fixture.tsx

@@ -5,6 +5,7 @@ import { type BlockDecorator } from '../../model/BlockDecorator';
 import { type ContentPageDef } from '../../model/ContentPageDef';
 import { Blocks } from '../Blocks';
 import { ContentPage } from './ContentPage';
+import { normalizePage } from './normalizePage';
 import { useContentPageData } from './useContentPageData';
 
 const blockDecorator: BlockDecorator = ({ blockClassName, block, render }, i) => (
@@ -32,7 +33,11 @@ export default {
     const data = useContentPageData(Blocks);
 
     return (
-      <ContentPage className="bg-main" blocksRegistry={Blocks} data={data as ContentPageDef} />
+      <ContentPage
+        className="bg-main"
+        blocksRegistry={Blocks}
+        data={normalizePage(Blocks)(data as ContentPageDef)}
+      />
     );
   },
   editor: () => {
@@ -43,7 +48,7 @@ export default {
         <ContentPage
           className="bg-transparent"
           blocksRegistry={Blocks}
-          data={data as ContentPageDef}
+          data={normalizePage(Blocks)(data as ContentPageDef)}
           blockDecorator={blockDecorator}
         />
       </div>

package/src/components/ContentPage/computeAPIFallback.ts

@@ -0,0 +1,67 @@
+import { type JSONNode } from '@redneckz/json-op';
+import { collectRef, resolveJPointer } from '@redneckz/json-ref';
+import { ContentPageRepository } from '../../content-page-repository/ContentPageRepository';
+import { type BlocksRegistry } from '../../model/BlocksRegistry';
+import { type ContentPageDef } from '../../model/ContentPageDef';
+import { type Fallback, type FallbackMap } from '../../model/Fallback';
+import { unique } from '../../utils/unique';
+import { joinPath } from '../../utils/url';
+import { loadModuleFallback } from './loadModuleFallback';
+
+type FallbackEntry = [key: string, data: JSONNode];
+
+const BASE_DIR = 'content';
+
+export const computeAPIFallback = async (
+  blocksRegistry: BlocksRegistry,
+  contentPageData: ContentPageDef,
+): Promise<Fallback> => {
+  return Object.fromEntries(
+    (
+      await Promise.all([
+        computeFallbackFromModules(blocksRegistry),
+        computeFallbackFromContentRefs(contentPageData),
+      ])
+    )
+      .flatMap((_) => _)
+      .filter(([key, data]) => key && data),
+  );
+};
+
+const computeFallbackFromModules = async (
+  blocksRegistry: BlocksRegistry,
+): Promise<FallbackEntry[]> => {
+  const fallbackMap: FallbackMap = (
+    await Promise.all(Object.keys(blocksRegistry).map(loadModuleFallback))
+  )
+    .filter((_): _ is FallbackMap => Boolean(_))
+    .reduce((acc, _) => ({ ...acc, ..._ }), {});
+
+  return (
+    await Promise.allSettled(
+      Object.entries(fallbackMap).map(
+        async ([key, fetcher]): Promise<FallbackEntry> => [key, await fetcher()],
+      ),
+    )
+  )
+    .filter((_): _ is PromiseFulfilledResult<FallbackEntry> => _.status === 'fulfilled')
+    .map(({ value }) => value);
+};
+
+const computeFallbackFromContentRefs = async (
+  contentPageData: ContentPageDef,
+): Promise<FallbackEntry[]> => {
+  const refs = unique(collectRef(contentPageData as JSONNode));
+
+  return (
+    await Promise.allSettled(
+      refs.map(async (_) => [
+        _,
+        (await ContentPageRepository.inst.generatePage(joinPath(BASE_DIR, _))) as JSONNode,
+      ]),
+    )
+  )
+    .filter((_): _ is PromiseFulfilledResult<FallbackEntry> => _.status === 'fulfilled')
+    .map(({ value }) => value)
+    .map(([ref, data]) => [ref, resolveJPointer(data, ref)]);
+};

package/src/components/ContentPage/loadModuleFallback.ts

@@ -0,0 +1,11 @@
+import { type FallbackMap } from '../../model/Fallback';
+
+export const loadModuleFallback = async (blockName: string): Promise<FallbackMap | undefined> => {
+  try {
+    const blockFallback = await import(`../${blockName}/${blockName}.fallback`);
+
+    return blockFallback?.fallback ? await blockFallback.fallback() : undefined;
+  } catch (error) {
+    return undefined;
+  }
+};

package/src/components/ContentPage/mapSlot.ts

@@ -0,0 +1,18 @@
+import { type BlockDef, type Slot } from '../../model/ContentPageDef';
+
+export const mapSlot =
+  (mapper: (blocks?: BlockDef[]) => BlockDef[]) =>
+  <S extends Slot>(slot: S): S => ({
+    ...slot,
+    ...(slot.blocks ? { blocks: mapper(slot.blocks) } : {}),
+    ...(slot.slots
+      ? {
+          slots: Object.fromEntries(
+            Object.entries(slot.slots).map(([slotKey, slotBlocks]) => [
+              slotKey,
+              mapper(slotBlocks),
+            ]),
+          ),
+        }
+      : {}),
+  });