@morphemecms/cms 0.1.0 → 0.2.0-next-20261104150211

package/src/standard/steps/load.ts

@@ -1,5 +1,5 @@
-// "Trin" on the site: only its fields (view.ts).
-import type { Load } from '../view';
-import { stepsOf, type StepsView } from './view';
-
-export const load: Load<StepsView> = async (props) => stepsOf(props);
+// "Trin" on the site: only its fields (view.ts).
+import type { Load } from '../view';
+import { stepsOf, type StepsView } from './view';
+
+export const load: Load<StepsView> = async (props) => stepsOf(props);

package/src/standard/steps/view.ts

@@ -1,11 +1,11 @@
-// What "Trin" shows (its view, drawn by the theme's View.tsx and StepList.tsx): its heading, and each step's heading
-// and text. The same in the editor (viewOf) and on the site (load.ts): only its fields.
-import type { ViewOf } from '../view';
-import { headOf, type HeadView } from '../head';
-
-export type Step = { title: string; text: string };
-export type StepsView = HeadView & { items: Step[] };
-
-export const stepsOf = (props: Record<string, any>): StepsView => ({ ...headOf(props), items: props.items ?? [] });
-
-export const viewOf: ViewOf<StepsView> = stepsOf;
+// What "Trin" shows (its view, drawn by the theme's View.tsx and StepList.tsx): its heading, and each step's heading
+// and text. The same in the editor (viewOf) and on the site (load.ts): only its fields.
+import type { ViewOf } from '../view';
+import { headOf, type HeadView } from '../head';
+
+export type Step = { title: string; text: string };
+export type StepsView = HeadView & { items: Step[] };
+
+export const stepsOf = (props: Record<string, any>): StepsView => ({ ...headOf(props), items: props.items ?? [] });
+
+export const viewOf: ViewOf<StepsView> = stepsOf;

package/src/standard/testimonials/index.tsx

@@ -1,87 +1,87 @@
-// "Udtalelser", a standard block: testimonials to leaf through or one after another with the whole text (`layout`
-// 'list'), with a heading: those with any of the block's tags (all without tags), those marked "Vis på forsiden", or
-// those picked. The testimonials are in the list the block brings ("Udtalelser", list.ts; the relation `testimonials`,
-// and BlockData.testimonials). How it looks is the theme's (packages/editor/theme/blocks/testimonials/View.tsx; what it shows: view.ts, and load.ts on the site).
-import { Columns, Quotes, Rows } from '@phosphor-icons/react';
-import { config } from '@site/config';
-import { defineBlock, names, withTags, type BlockData, type BlockProps } from '../../blocks';
-import { t } from '../../i18n';
-import { headFields } from '../head';
-
-/** The tags of these testimonials, as buttons to filter by (List.tsx), each once, in the order they come. */
-export const tagsOf = (list: { categories?: string[] }[]) => [...new Set(list.flatMap((t) => t.categories ?? []))];
-/** Whether the cards show their tags: not when the block picks by tags, which are then the same on all; in a list,
- * all of them without tags. */
-export const tagsShown = (props: BlockProps) =>
-  props.show !== 'categories' || (props.layout === 'list' && !((props.categories ?? []) as string[]).length);
-
-const showOptions = [
-  { label: t.blocks.testimonials.all, value: 'all' },
-  { label: t.blocks.testimonials.withTags, value: 'categories' },
-  { label: t.blocks.testimonials.front, value: 'front' },
-  { label: t.blocks.testimonials.picked, value: 'picked' },
-];
-
-// Which testimonials it shows (as load.ts picks them on the site).
-export function chosen(props: BlockProps, data: BlockData) {
-  const all = data.testimonials;
-  if (props.show === 'all') return all;
-  if (props.show === 'categories') return withTags(all, props.categories);
-  if (props.show === 'picked')
-    return ((props.picked ?? []) as string[]).map((slug) => all.find((row) => row.slug === slug)).filter((row) => row !== undefined);
-  return all.filter((row) => row.frontPage);
-}
-
-export default defineBlock({
-  label: t.blocks.testimonials.label,
-  icon: Quotes,
-  hint: t.blocks.testimonials.hint,
-  edit: { to: `liste/${config.lists.testimonials}`, text: t.blocks.testimonials.edit },
-  fields: [
-    ...headFields,
-    {
-      name: 'layout',
-      label: t.blocks.testimonials.layout,
-      type: 'select',
-      segments: true,
-      default: 'slider',
-      hint: t.blocks.testimonials.layoutHint,
-      options: [
-        { label: t.blocks.testimonials.slider, value: 'slider', icon: Columns },
-        { label: t.blocks.testimonials.list, value: 'list', icon: Rows },
-      ],
-    },
-    {
-      name: 'filter',
-      label: t.blocks.testimonials.filter,
-      type: 'boolean',
-      default: true,
-      hint: t.blocks.testimonials.filterHint,
-      only: { field: 'layout', is: ['list'] },
-    },
-    { name: 'show', label: t.blocks.testimonials.show, type: 'select', required: true, default: 'categories', options: showOptions },
-    {
-      name: 'categories',
-      label: t.blocks.testimonials.tags,
-      type: 'relation',
-      to: 'categories',
-      multiple: true,
-      add: t.blocks.testimonials.addTag,
-      hint: t.blocks.testimonials.tagsHint,
-      only: { field: 'show', is: ['categories'] },
-    },
-    {
-      name: 'picked',
-      label: t.blocks.testimonials.items,
-      type: 'relation',
-      to: 'testimonials',
-      multiple: true,
-      only: { field: 'show', is: ['picked'] },
-    },
-  ],
-  detail: (p, data) => [
-    p.heading ? String(p.heading) : '',
-    showOptions.find((o) => o.value === p.show)?.label ?? '',
-    names(chosen(p, data)),
-  ],
-});
+// "Udtalelser", a standard block: testimonials to leaf through or one after another with the whole text (`layout`
+// 'list'), with a heading: those with any of the block's tags (all without tags), those marked "Vis på forsiden", or
+// those picked. The testimonials are in the list the block brings ("Udtalelser", list.ts; the relation `testimonials`,
+// and BlockData.testimonials). How it looks is the theme's (packages/editor/theme/blocks/testimonials/View.tsx; what it shows: view.ts, and load.ts on the site).
+import { Columns, Quotes, Rows } from '@phosphor-icons/react';
+import { config } from '@site/config';
+import { defineBlock, names, withTags, type BlockData, type BlockProps } from '../../blocks';
+import { t } from '../../i18n';
+import { headFields } from '../head';
+
+/** The tags of these testimonials, as buttons to filter by (List.tsx), each once, in the order they come. */
+export const tagsOf = (list: { categories?: string[] }[]) => [...new Set(list.flatMap((t) => t.categories ?? []))];
+/** Whether the cards show their tags: not when the block picks by tags, which are then the same on all; in a list,
+ * all of them without tags. */
+export const tagsShown = (props: BlockProps) =>
+  props.show !== 'categories' || (props.layout === 'list' && !((props.categories ?? []) as string[]).length);
+
+const showOptions = [
+  { label: t.blocks.testimonials.all, value: 'all' },
+  { label: t.blocks.testimonials.withTags, value: 'categories' },
+  { label: t.blocks.testimonials.front, value: 'front' },
+  { label: t.blocks.testimonials.picked, value: 'picked' },
+];
+
+// Which testimonials it shows (as load.ts picks them on the site).
+export function chosen(props: BlockProps, data: BlockData) {
+  const all = data.testimonials;
+  if (props.show === 'all') return all;
+  if (props.show === 'categories') return withTags(all, props.categories);
+  if (props.show === 'picked')
+    return ((props.picked ?? []) as string[]).map((slug) => all.find((row) => row.slug === slug)).filter((row) => row !== undefined);
+  return all.filter((row) => row.frontPage);
+}
+
+export default defineBlock({
+  label: t.blocks.testimonials.label,
+  icon: Quotes,
+  hint: t.blocks.testimonials.hint,
+  edit: { to: `liste/${config.lists.testimonials}`, text: t.blocks.testimonials.edit },
+  fields: [
+    ...headFields,
+    {
+      name: 'layout',
+      label: t.blocks.testimonials.layout,
+      type: 'select',
+      segments: true,
+      default: 'slider',
+      hint: t.blocks.testimonials.layoutHint,
+      options: [
+        { label: t.blocks.testimonials.slider, value: 'slider', icon: Columns },
+        { label: t.blocks.testimonials.list, value: 'list', icon: Rows },
+      ],
+    },
+    {
+      name: 'filter',
+      label: t.blocks.testimonials.filter,
+      type: 'boolean',
+      default: true,
+      hint: t.blocks.testimonials.filterHint,
+      only: { field: 'layout', is: ['list'] },
+    },
+    { name: 'show', label: t.blocks.testimonials.show, type: 'select', required: true, default: 'categories', options: showOptions },
+    {
+      name: 'categories',
+      label: t.blocks.testimonials.tags,
+      type: 'relation',
+      to: 'categories',
+      multiple: true,
+      add: t.blocks.testimonials.addTag,
+      hint: t.blocks.testimonials.tagsHint,
+      only: { field: 'show', is: ['categories'] },
+    },
+    {
+      name: 'picked',
+      label: t.blocks.testimonials.items,
+      type: 'relation',
+      to: 'testimonials',
+      multiple: true,
+      only: { field: 'show', is: ['picked'] },
+    },
+  ],
+  detail: (p, data) => [
+    p.heading ? String(p.heading) : '',
+    showOptions.find((o) => o.value === p.show)?.label ?? '',
+    names(chosen(p, data)),
+  ],
+});

package/src/standard/testimonials/list.ts

@@ -1,43 +1,43 @@
-// "Udtalelser", the list the standard block brings: one file per testimonial in the site's data
-// (<config.folders.data>/testimonials/<slug>.json), under "Lister" on every site, in their order (the arrows), each
-// with its picture (optional, round by the name), its tags (the relation `categories`) and whether it is marked "Vis
-// på forsiden" (the block's "Hvilke udtalelser"). The site reads them for its pages (StandardSite.testimonials, the
-// site's packages/editor/site/testimonials.ts).
-// Made with the texts of a language: the editor's for the screens, the site's (siteT) for the commits (site.ts).
-import { Quotes } from '@phosphor-icons/react';
-import { config } from '@site/config';
-import type { Messages } from '../../i18n';
-import type { OwnedList } from '../../schema';
-
-export default function testimonialsList(say: Messages): OwnedList {
-  const own = say.blocks.testimonials;
-  return {
-    kind: 'folder',
-    id: config.lists.testimonials,
-    icon: Quotes,
-    create: own.entries.create,
-    label: own.entries.label,
-    singular: own.entries.singular,
-    folder: `${config.folders.data}/testimonials`,
-    deletable: true,
-    orderable: true,
-    slugFrom: 'name',
-    summary: (d) => String(d.name ?? ''),
-    fields: [
-      { name: 'name', label: own.entries.name, type: 'string', required: true },
-      { name: 'image', label: own.entries.image, type: 'image' },
-      { name: 'context', label: own.entries.context, type: 'text' },
-      { name: 'quote', label: own.entries.quote, type: 'text', required: true },
-      {
-        name: 'categories',
-        label: own.tags,
-        type: 'relation',
-        to: 'categories',
-        multiple: true,
-        add: own.addTag,
-        edit: { to: `ny/${config.lists.tags}`, text: own.entries.createTag },
-      },
-      { name: 'frontPage', label: own.entries.frontPage, type: 'boolean', default: true },
-    ],
-  };
-}
+// "Udtalelser", the list the standard block brings: one file per testimonial in the site's data
+// (<config.folders.data>/testimonials/<slug>.json), under "Lister" on every site, in their order (the arrows), each
+// with its picture (optional, round by the name), its tags (the relation `categories`) and whether it is marked "Vis
+// på forsiden" (the block's "Hvilke udtalelser"). The site reads them for its pages (StandardSite.testimonials, the
+// site's packages/editor/site/testimonials.ts).
+// Made with the texts of a language: the editor's for the screens, the site's (siteT) for the commits (site.ts).
+import { Quotes } from '@phosphor-icons/react';
+import { config } from '@site/config';
+import type { Messages } from '../../i18n';
+import type { OwnedList } from '../../schema';
+
+export default function testimonialsList(say: Messages): OwnedList {
+  const own = say.blocks.testimonials;
+  return {
+    kind: 'folder',
+    id: config.lists.testimonials,
+    icon: Quotes,
+    create: own.entries.create,
+    label: own.entries.label,
+    singular: own.entries.singular,
+    folder: `${config.folders.data}/testimonials`,
+    deletable: true,
+    orderable: true,
+    slugFrom: 'name',
+    summary: (d) => String(d.name ?? ''),
+    fields: [
+      { name: 'name', label: own.entries.name, type: 'string', required: true },
+      { name: 'image', label: own.entries.image, type: 'image' },
+      { name: 'context', label: own.entries.context, type: 'text' },
+      { name: 'quote', label: own.entries.quote, type: 'text', required: true },
+      {
+        name: 'categories',
+        label: own.tags,
+        type: 'relation',
+        to: 'categories',
+        multiple: true,
+        add: own.addTag,
+        edit: { to: `ny/${config.lists.tags}`, text: own.entries.createTag },
+      },
+      { name: 'frontPage', label: own.entries.frontPage, type: 'boolean', default: true },
+    ],
+  };
+}

package/src/standard/testimonials/load.ts

@@ -1,58 +1,58 @@
-// "Udtalelser" on the site (view.ts): all of them (`show: 'all'`), those with any of its tags (`show: 'categories'`,
-// all when it has none; the tags are then not on the cards, except in a list of all), those marked "Vis på forsiden"
-// ('front'), or those picked ('picked', by file name, in that order), from the site (@site/standard), with their tags'
-// pages, their pictures' sizes and where their whole text is.
-import { standard } from '@site/standard';
-import { pictureOf } from '../load';
-import type { TestimonialItem } from '../site';
-import type { Load } from '../view';
-import { tagsShown } from '.';
-import { headOf } from '../head';
-import shared from './shared';
-import { labelOf, type TestimonialsView, type TestimonialTexts, type TestimonialView } from './view';
-
-/** Testimonials on the site (a site's own too: this site's front page), with their tags (`showTopic`). */
-export const loadTestimonials = (items: TestimonialItem[], showTopic = true): Promise<TestimonialView[]> =>
-  Promise.all(
-    items.map(async (t) => {
-      const anchor = standard.testimonials.anchor(t);
-      return {
-        slug: t.slug,
-        name: t.name,
-        ...(t.image ? { image: pictureOf(t.image) } : {}),
-        context: t.context,
-        quote: t.quote,
-        categories: t.categories,
-        tags: showTopic ? await Promise.all(t.categories.map((slug) => standard.testimonials.tag(slug))) : [],
-        anchor,
-        href: `${standard.testimonials.page}#${anchor}`,
-      };
-    }),
-  );
-
-/** Its shared texts, with those saved over them. */
-export const testimonialTexts = (texts?: Record<string, any>): TestimonialTexts => ({ ...shared.values, ...texts }) as TestimonialTexts;
-
-export const load: Load<TestimonialsView> = async (props, { texts }) => {
-  const all = standard.testimonials.list;
-  const chosen = () => {
-    if (props.show === 'all') return all;
-    if (props.show === 'categories') {
-      const wanted: string[] = props.categories ?? [];
-      return all.filter((t) => !wanted.length || t.categories.some((c) => wanted.includes(c)));
-    }
-    if (props.show === 'picked')
-      return ((props.picked ?? []) as string[]).map((slug) => all.find((t) => t.slug === slug)).filter((t) => t !== undefined);
-    return all.filter((t) => t.frontPage);
-  };
-  const items = chosen();
-  const slugs = props.layout === 'list' && props.filter !== false ? [...new Set(items.flatMap((t) => t.categories))] : [];
-  return {
-    ...headOf(props),
-    layout: props.layout,
-    testimonials: await loadTestimonials(items, tagsShown(props)),
-    label: labelOf(props),
-    filters: await Promise.all(slugs.map(async (slug) => ({ slug, name: (await standard.testimonials.tag(slug)).name }))),
-    texts: testimonialTexts(texts),
-  };
-};
+// "Udtalelser" on the site (view.ts): all of them (`show: 'all'`), those with any of its tags (`show: 'categories'`,
+// all when it has none; the tags are then not on the cards, except in a list of all), those marked "Vis på forsiden"
+// ('front'), or those picked ('picked', by file name, in that order), from the site (@site/standard), with their tags'
+// pages, their pictures' sizes and where their whole text is.
+import { standard } from '@site/standard';
+import { pictureOf } from '../load';
+import type { TestimonialItem } from '../site';
+import type { Load } from '../view';
+import { tagsShown } from '.';
+import { headOf } from '../head';
+import shared from './shared';
+import { labelOf, type TestimonialsView, type TestimonialTexts, type TestimonialView } from './view';
+
+/** Testimonials on the site (a site's own too: this site's front page), with their tags (`showTopic`). */
+export const loadTestimonials = (items: TestimonialItem[], showTopic = true): Promise<TestimonialView[]> =>
+  Promise.all(
+    items.map(async (t) => {
+      const anchor = standard.testimonials.anchor(t);
+      return {
+        slug: t.slug,
+        name: t.name,
+        ...(t.image ? { image: pictureOf(t.image) } : {}),
+        context: t.context,
+        quote: t.quote,
+        categories: t.categories,
+        tags: showTopic ? await Promise.all(t.categories.map((slug) => standard.testimonials.tag(slug))) : [],
+        anchor,
+        href: `${standard.testimonials.page}#${anchor}`,
+      };
+    }),
+  );
+
+/** Its shared texts, with those saved over them. */
+export const testimonialTexts = (texts?: Record<string, any>): TestimonialTexts => ({ ...shared.values, ...texts }) as TestimonialTexts;
+
+export const load: Load<TestimonialsView> = async (props, { texts }) => {
+  const all = standard.testimonials.list;
+  const chosen = () => {
+    if (props.show === 'all') return all;
+    if (props.show === 'categories') {
+      const wanted: string[] = props.categories ?? [];
+      return all.filter((t) => !wanted.length || t.categories.some((c) => wanted.includes(c)));
+    }
+    if (props.show === 'picked')
+      return ((props.picked ?? []) as string[]).map((slug) => all.find((t) => t.slug === slug)).filter((t) => t !== undefined);
+    return all.filter((t) => t.frontPage);
+  };
+  const items = chosen();
+  const slugs = props.layout === 'list' && props.filter !== false ? [...new Set(items.flatMap((t) => t.categories))] : [];
+  return {
+    ...headOf(props),
+    layout: props.layout,
+    testimonials: await loadTestimonials(items, tagsShown(props)),
+    label: labelOf(props),
+    filters: await Promise.all(slugs.map(async (slug) => ({ slug, name: (await standard.testimonials.tag(slug)).name }))),
+    texts: testimonialTexts(texts),
+  };
+};

package/src/standard/testimonials/shared.ts

@@ -1,13 +1,13 @@
-// The shared texts of "Udtalelser" ("Blokke"): the buttons that unfold a testimonial and fold it again,
-// to begin with in the site's language (siteT). Also on a site's own testimonials (Testimonial.tsx).
-import { siteT, t } from '../../i18n';
-import { defineShared } from '../../shared';
-
-export default defineShared({
-  fields: [
-    { name: 'more', label: t.blocks.testimonials.more, type: 'string', required: true, max: 30 },
-    { name: 'less', label: t.blocks.testimonials.less, type: 'string', required: true, max: 30 },
-  ],
-  values: { more: siteT.blocks.testimonials.moreText, less: siteT.blocks.testimonials.lessText },
-  preview: { props: { show: 'front' } },
-});
+// The shared texts of "Udtalelser" ("Blokke"): the buttons that unfold a testimonial and fold it again,
+// to begin with in the site's language (siteT). Also on a site's own testimonials (Testimonial.tsx).
+import { siteT, t } from '../../i18n';
+import { defineShared } from '../../shared';
+
+export default defineShared({
+  fields: [
+    { name: 'more', label: t.blocks.testimonials.more, type: 'string', required: true, max: 30 },
+    { name: 'less', label: t.blocks.testimonials.less, type: 'string', required: true, max: 30 },
+  ],
+  values: { more: siteT.blocks.testimonials.moreText, less: siteT.blocks.testimonials.lessText },
+  preview: { props: { show: 'front' } },
+});

package/src/standard/testimonials/view.ts

@@ -1,76 +1,76 @@
-// What "Udtalelser" shows (its view, drawn by the theme's View.tsx, Slider.tsx, List.tsx and Testimonial.tsx): its
-// heading, its layout (to leaf through, or 'list': one after another with the whole text), its testimonials (each
-// one's name, picture, context, paragraphs, tags with their pages, and where its whole text is: `anchor` on the
-// testimonials page, `href` from elsewhere), what the slider is called for screen readers, the tags to filter by in a
-// list (`filters`), and its shared texts ("Læs mere", "Vis mindre"). In the editor: viewOf, with the testimonials of
-// the list "Udtalelser"; on the site: load.ts.
-import type { BlockData } from '../../blocks';
-import type { TestimonialRow } from '../../fields';
-import { siteT } from '../../i18n';
-import { sharedIn } from '../../shared';
-import { shownAt } from '../../images';
-import type { Picture, ViewOf } from '../view';
-import { chosen, tagsOf, tagsShown } from '.';
-import { headOf, type HeadView } from '../head';
-import shared from './shared';
-
-export type TestimonialView = {
-  slug: string;
-  name: string;
-  image?: Picture;
-  context?: string;
-  quote: string[];
-  categories: string[];
-  tags: { name: string; href?: string }[];
-  anchor: string;
-  href: string;
-};
-export type TestimonialTexts = { more: string; less: string };
-export type TestimonialsView = HeadView & {
-  layout?: string;
-  testimonials: TestimonialView[];
-  /** What the slider is called for screen readers: its heading, else the block's name (labelOf). */
-  label: string;
-  filters: { slug: string; name: string }[];
-  texts: TestimonialTexts;
-};
-
-/** What the slider is called for screen readers: the block's heading, else "Udtalelser" in the site's language. */
-export const labelOf = (props: Record<string, any>): string => props.heading?.trim() || siteT.blocks.testimonials.label;
-
-// A tag's name, as the list of tags has it.
-const tagName = (data: BlockData, slug: string) => data.relations.categories?.find((o) => o.value === slug)?.label ?? slug;
-
-/** Testimonials in the editor (a site's own too: its preview of the front page), with their tags (`showTopic`). Only
- * drawn: a link leads nowhere. */
-export const shownTestimonials = (rows: TestimonialRow[], data: BlockData, showTopic = true): TestimonialView[] =>
-  rows.map((row) => ({
-    slug: row.slug,
-    name: row.name,
-    ...(row.image ? { image: { src: shownAt(row.image) } } : {}),
-    context: row.context,
-    // Its paragraphs, as the site splits its text.
-    quote: String(row.quote ?? '')
-      .split(/\n\s*\n/)
-      .map((p) => p.trim())
-      .filter(Boolean),
-    categories: row.categories ?? [],
-    tags: showTopic ? (row.categories ?? []).map((slug) => ({ name: tagName(data, slug) })) : [],
-    anchor: row.slug,
-    href: '',
-  }));
-
-/** Its shared texts in the editor. */
-export const shownTexts = (data: BlockData) => sharedIn(data.site, 'testimonials', shared.values) as TestimonialTexts;
-
-export const viewOf: ViewOf<TestimonialsView> = (props, data) => {
-  const rows = chosen(props, data);
-  return {
-    ...headOf(props),
-    layout: props.layout,
-    testimonials: shownTestimonials(rows, data, tagsShown(props)),
-    label: labelOf(props),
-    filters: props.layout === 'list' && props.filter !== false ? tagsOf(rows).map((slug) => ({ slug, name: tagName(data, slug) })) : [],
-    texts: shownTexts(data),
-  };
-};
+// What "Udtalelser" shows (its view, drawn by the theme's View.tsx, Slider.tsx, List.tsx and Testimonial.tsx): its
+// heading, its layout (to leaf through, or 'list': one after another with the whole text), its testimonials (each
+// one's name, picture, context, paragraphs, tags with their pages, and where its whole text is: `anchor` on the
+// testimonials page, `href` from elsewhere), what the slider is called for screen readers, the tags to filter by in a
+// list (`filters`), and its shared texts ("Læs mere", "Vis mindre"). In the editor: viewOf, with the testimonials of
+// the list "Udtalelser"; on the site: load.ts.
+import type { BlockData } from '../../blocks';
+import type { TestimonialRow } from '../../fields';
+import { siteT } from '../../i18n';
+import { sharedIn } from '../../shared';
+import { shownAt } from '../../images';
+import type { Picture, ViewOf } from '../view';
+import { chosen, tagsOf, tagsShown } from '.';
+import { headOf, type HeadView } from '../head';
+import shared from './shared';
+
+export type TestimonialView = {
+  slug: string;
+  name: string;
+  image?: Picture;
+  context?: string;
+  quote: string[];
+  categories: string[];
+  tags: { name: string; href?: string }[];
+  anchor: string;
+  href: string;
+};
+export type TestimonialTexts = { more: string; less: string };
+export type TestimonialsView = HeadView & {
+  layout?: string;
+  testimonials: TestimonialView[];
+  /** What the slider is called for screen readers: its heading, else the block's name (labelOf). */
+  label: string;
+  filters: { slug: string; name: string }[];
+  texts: TestimonialTexts;
+};
+
+/** What the slider is called for screen readers: the block's heading, else "Udtalelser" in the site's language. */
+export const labelOf = (props: Record<string, any>): string => props.heading?.trim() || siteT.blocks.testimonials.label;
+
+// A tag's name, as the list of tags has it.
+const tagName = (data: BlockData, slug: string) => data.relations.categories?.find((o) => o.value === slug)?.label ?? slug;
+
+/** Testimonials in the editor (a site's own too: its preview of the front page), with their tags (`showTopic`). Only
+ * drawn: a link leads nowhere. */
+export const shownTestimonials = (rows: TestimonialRow[], data: BlockData, showTopic = true): TestimonialView[] =>
+  rows.map((row) => ({
+    slug: row.slug,
+    name: row.name,
+    ...(row.image ? { image: { src: shownAt(row.image) } } : {}),
+    context: row.context,
+    // Its paragraphs, as the site splits its text.
+    quote: String(row.quote ?? '')
+      .split(/\n\s*\n/)
+      .map((p) => p.trim())
+      .filter(Boolean),
+    categories: row.categories ?? [],
+    tags: showTopic ? (row.categories ?? []).map((slug) => ({ name: tagName(data, slug) })) : [],
+    anchor: row.slug,
+    href: '',
+  }));
+
+/** Its shared texts in the editor. */
+export const shownTexts = (data: BlockData) => sharedIn(data.site, 'testimonials', shared.values) as TestimonialTexts;
+
+export const viewOf: ViewOf<TestimonialsView> = (props, data) => {
+  const rows = chosen(props, data);
+  return {
+    ...headOf(props),
+    layout: props.layout,
+    testimonials: shownTestimonials(rows, data, tagsShown(props)),
+    label: labelOf(props),
+    filters: props.layout === 'list' && props.filter !== false ? tagsOf(rows).map((slug) => ({ slug, name: tagName(data, slug) })) : [],
+    texts: shownTexts(data),
+  };
+};

package/src/standard/themeBlocks.ts

@@ -1,13 +1,13 @@
-// The theme's blocks for the editor: the drawing of each standard block (View.tsx in a theme's blocks/<type>/, given
-// the view the block's contract makes, view.ts), the theme in use's (@theme), else the standard theme's
-// (packages/editor/theme/blocks/), as on the site (sites.ts). A theme has no blocks of its own: only the look of the
-// standard ones. Apart from editor.ts, so loading the blocks waits until the editor's blocks (registry.tsx) need them.
-import type { View } from './view';
-
-const byType = <T>(found: Record<string, T>) => Object.fromEntries(Object.entries(found).map(([file, d]) => [file.split('/').at(-2)!, d]));
-
-/** How each standard block looks in the editor, by its type. */
-export const blockViews: Record<string, View<any>> = {
-  ...byType(import.meta.glob<View<any>>('@saturn/blocks/*/View.tsx', { eager: true, import: 'default' })),
-  ...byType(import.meta.glob<View<any>>('@theme/blocks/*/View.tsx', { eager: true, import: 'default' })),
-};
+// The theme's blocks for the editor: the drawing of each standard block (View.tsx in a theme's blocks/<type>/, given
+// the view the block's contract makes, view.ts), the theme in use's (@theme), else the standard theme's
+// (packages/editor/theme/blocks/), as on the site (sites.ts). A theme has no blocks of its own: only the look of the
+// standard ones. Apart from editor.ts, so loading the blocks waits until the editor's blocks (registry.tsx) need them.
+import type { View } from './view';
+
+const byType = <T>(found: Record<string, T>) => Object.fromEntries(Object.entries(found).map(([file, d]) => [file.split('/').at(-2)!, d]));
+
+/** How each standard block looks in the editor, by its type. */
+export const blockViews: Record<string, View<any>> = {
+  ...byType(import.meta.glob<View<any>>('@saturn/blocks/*/View.tsx', { eager: true, import: 'default' })),
+  ...byType(import.meta.glob<View<any>>('@theme/blocks/*/View.tsx', { eager: true, import: 'default' })),
+};