@seamlet/astro 0.3.0 → 0.4.0

package/README.md

@@ -115,6 +115,26 @@ item: { name: text({ label: "Название" }), isHidden: toggle({ label: "С
 // content.practices.filter((practice) => !practice.isHidden)
 ```
 
+A photo may carry the point that must stay in view when the site crops it, chosen in the editor: put `imagePosition(photo)` into its `object-position` (the middle when no point is chosen):
+
+```astro
+<img
+  src={photo.src}
+  alt={photo.alt}
+  style={`object-fit: cover; object-position: ${imagePosition(photo)}`}
+/>
+```
+
+## Presets
+
+Sets of fields almost every site has, edited the same way everywhere; they are plain groups and collections, rendered as the site likes:
+
+- `seoFields()` — `title`, `description` and `image` of a page for search engines and links shared in messengers;
+- `contactsFields()` — `phone` (a link), `address`, `map` (an address) and `messengers` (links);
+- `openingHoursField()` — rows of `days` (`WEEKDAYS`), `opens` and `closes` times and a `note`.
+
+Each takes `{ label }` to name it otherwise.
+
 ## Records and references
 
 Every record of a collection has an `id` of its own, which never changes when records move, so a record has no field named `id`. The CMS gives ids to records that have none (`withRecordIds`), so a site's initial content may leave them out, unless something refers to those records.

package/dist/bridge.d.ts

@@ -1,6 +1,6 @@
-import { F as Fields } from './content-GL5k9Mch.js';
-import { P as PageMessage, E as EditorMessage } from './messages-CJ8vKPs9.js';
-import './parse-content-CVU-pHrH.js';
+import { F as Fields } from './content-C_WpiWBm.js';
+import { P as PageMessage, E as EditorMessage } from './messages-CBf5diaN.js';
+import './parse-content-9RIWhb6z.js';
 
 interface BridgeOptions {
     /** The origin of the CMS whose editor may frame the page, such as `https://cms.example.com`. */

package/dist/bridge.js

@@ -5,13 +5,13 @@ import {
   imageFieldAt,
   readEditorMessage,
   shortcutOf
-} from "./chunk-N2UE3EQU.js";
+} from "./chunk-XCBYYKWR.js";
 import {
   FIELD_PATH_ATTRIBUTE,
   REVEALED_ATTRIBUTE,
   REVEAL_ATTRIBUTE,
   REVEAL_EVENT
-} from "./chunk-AFTVM755.js";
+} from "./chunk-GLXC5OLC.js";
 
 // src/bridge/page-markers.ts
 var MARKER_SELECTOR = `[${FIELD_PATH_ATTRIBUTE}]`;

package/dist/{chunk-AFTVM755.js → chunk-GLXC5OLC.js}

@@ -398,7 +398,8 @@ function parseImage(field, input, path) {
   if (typeof src !== "string" || typeof alt !== "string") {
     return invalidType(defaultValue(field), path);
   }
-  const image2 = { src, alt };
+  const focus = isRecord(input) ? focusOf(input["focus"]) : void 0;
+  const image2 = focus === void 0 ? { src, alt } : { src, alt, focus };
   if (src.trim() === "") {
     return { value: image2, issues: [{ path, code: "missing-image-src" }] };
   }
@@ -521,6 +522,15 @@ function parseReferences(field, input, path) {
   const ids = [...new Set(input)];
   return valid(ids);
 }
+function focusOf(input) {
+  if (!isRecord(input)) return void 0;
+  const { x, y } = input;
+  const isInside = isFraction(x) && isFraction(y);
+  return isInside ? { x, y } : void 0;
+}
+function isFraction(value) {
+  return typeof value === "number" && value >= 0 && value <= 1;
+}
 function isCalendarDate(value) {
   if (!DATE_PATTERN.test(value)) {
     return false;
@@ -588,6 +598,73 @@ var REVEAL_ATTRIBUTE = "data-cms-reveal";
 var REVEALED_ATTRIBUTE = "data-cms-revealed";
 var REVEAL_EVENT = "cms:reveal";
 
+// src/schema/image-position.ts
+var PERCENT = 100;
+var STEPS_PER_PERCENT = 10;
+var MIDDLE = 0.5;
+function imagePosition(image2) {
+  const x = image2?.focus?.x ?? MIDDLE;
+  const y = image2?.focus?.y ?? MIDDLE;
+  return `${percentOf(x)} ${percentOf(y)}`;
+}
+function percentOf(fraction) {
+  const steps = Math.round(fraction * PERCENT * STEPS_PER_PERCENT);
+  const rounded = steps / STEPS_PER_PERCENT;
+  return `${String(rounded)}%`;
+}
+
+// src/schema/presets.ts
+function seoFields(options = {}) {
+  return group({
+    label: options.label ?? "\u041F\u043E\u0438\u0441\u043A\u043E\u0432\u0438\u043A\u0438 \u0438 \u0441\u043E\u0446\u0441\u0435\u0442\u0438",
+    fields: {
+      title: text({ label: "\u0417\u0430\u0433\u043E\u043B\u043E\u0432\u043E\u043A \u0432 \u043F\u043E\u0438\u0441\u043A\u0435", maxLength: 60 }),
+      description: text({
+        label: "\u041E\u043F\u0438\u0441\u0430\u043D\u0438\u0435 \u0432 \u043F\u043E\u0438\u0441\u043A\u0435",
+        multiline: true,
+        maxLength: 160
+      }),
+      image: image({ label: "\u041A\u0430\u0440\u0442\u0438\u043D\u043A\u0430 \u0434\u043B\u044F \u0441\u043E\u0446\u0441\u0435\u0442\u0435\u0439" })
+    }
+  });
+}
+function contactsFields(options = {}) {
+  return group({
+    label: options.label ?? "\u041A\u043E\u043D\u0442\u0430\u043A\u0442\u044B",
+    fields: {
+      phone: link({ label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D" }),
+      address: text({ label: "\u0410\u0434\u0440\u0435\u0441", multiline: true }),
+      map: url({ label: "\u0421\u0441\u044B\u043B\u043A\u0430 \u043D\u0430 \u043A\u0430\u0440\u0442\u0443" }),
+      messengers: collection({
+        label: "\u041C\u0435\u0441\u0441\u0435\u043D\u0434\u0436\u0435\u0440\u044B \u0438 \u0441\u043E\u0446\u0441\u0435\u0442\u0438",
+        itemTitle: "link",
+        item: { link: link({ label: "\u0421\u0441\u044B\u043B\u043A\u0430" }) }
+      })
+    }
+  });
+}
+var WEEKDAYS = [
+  { value: "mon", label: "\u041F\u043D" },
+  { value: "tue", label: "\u0412\u0442" },
+  { value: "wed", label: "\u0421\u0440" },
+  { value: "thu", label: "\u0427\u0442" },
+  { value: "fri", label: "\u041F\u0442" },
+  { value: "sat", label: "\u0421\u0431" },
+  { value: "sun", label: "\u0412\u0441" }
+];
+function openingHoursField(options = {}) {
+  return collection({
+    label: options.label ?? "\u0427\u0430\u0441\u044B \u0440\u0430\u0431\u043E\u0442\u044B",
+    itemTitle: "note",
+    item: {
+      days: choices({ label: "\u0414\u043D\u0438", options: WEEKDAYS }),
+      opens: time({ label: "\u041E\u0442\u043A\u0440\u044B\u0432\u0430\u0435\u0442\u0441\u044F" }),
+      closes: time({ label: "\u0417\u0430\u043A\u0440\u044B\u0432\u0430\u0435\u0442\u0441\u044F" }),
+      note: text({ label: "\u041F\u043E\u0434\u043F\u0438\u0441\u044C", maxLength: 40 })
+    }
+  });
+}
+
 export {
   defineSchema,
   text,
@@ -622,5 +699,10 @@ export {
   resolveFieldPath,
   REVEAL_ATTRIBUTE,
   REVEALED_ATTRIBUTE,
-  REVEAL_EVENT
+  REVEAL_EVENT,
+  imagePosition,
+  seoFields,
+  contactsFields,
+  WEEKDAYS,
+  openingHoursField
 };

package/dist/{chunk-N2UE3EQU.js → chunk-XCBYYKWR.js}

@@ -1,7 +1,7 @@
 import {
   formatFieldPath,
   resolveFieldPath
-} from "./chunk-AFTVM755.js";
+} from "./chunk-GLXC5OLC.js";
 
 // src/bridge/editor-shortcuts.ts
 function shortcutOf(event) {

package/dist/{content-GL5k9Mch.d.ts → content-C_WpiWBm.d.ts}

@@ -125,9 +125,16 @@ declare function references(options: FieldOptions<ReferencesField>): ReferencesF
 declare function group<F extends Fields>(options: FieldOptions<GroupField<F>>): GroupField<F>;
 declare function collection<F extends RecordFields>(options: FieldOptions<CollectionField<F>>): CollectionField<F>;
 
+/** The point of a photo that must stay in view when a site crops it: 0 to 1 from the left and the top. */
+interface ImageFocus {
+    readonly x: number;
+    readonly y: number;
+}
 interface ImageValue {
     readonly src: string;
     readonly alt: string;
+    /** Unset: the middle of the photo (see imagePosition). */
+    readonly focus?: ImageFocus;
 }
 interface LinkValue {
     readonly text: string;
@@ -160,4 +167,4 @@ type FieldValue = string | number | boolean | null | readonly string[] | ImageVa
 declare function defaultValue(field: Field): FieldValue;
 declare function defaultContent(fields: Fields): Content;
 
-export { reference as A, references as B, type ContentOf as C, type DateField as D, text as E, type Fields as F, type GroupField as G, time as H, type ImageField as I, toggle as J, url as K, type LinkValue as L, type NumberField as N, type OptionValue as O, type RecordFields as R, type TextField as T, type UrlField as U, type ValueOf as V, type Content as a, type ImageValue as b, type Field as c, type CollectionField as d, type ChoiceField as e, type ChoiceOption as f, type ChoicesField as g, type FieldKind as h, type FieldValue as i, type LinkField as j, type RecordOf as k, type ReferenceField as l, type ReferencesField as m, type TimeField as n, type ToggleField as o, choice as p, choices as q, collection as r, date as s, defaultContent as t, defaultValue as u, defineSchema as v, group as w, image as x, link as y, number as z };
+export { number as A, reference as B, type ContentOf as C, type DateField as D, references as E, type Fields as F, type GroupField as G, text as H, type ImageField as I, time as J, toggle as K, type LinkValue as L, url as M, type NumberField as N, type OptionValue as O, type RecordFields as R, type TextField as T, type UrlField as U, type ValueOf as V, type Content as a, type ImageValue as b, type Field as c, type CollectionField as d, type LinkField as e, type ChoicesField as f, type TimeField as g, type ChoiceField as h, type ChoiceOption as i, type FieldKind as j, type FieldValue as k, type ImageFocus as l, type RecordOf as m, type ReferenceField as n, type ReferencesField as o, type ToggleField as p, choice as q, choices as r, collection as s, date as t, defaultContent as u, defaultValue as v, defineSchema as w, group as x, image as y, link as z };

package/dist/{messages-CJ8vKPs9.d.ts → messages-CBf5diaN.d.ts}

@@ -1,5 +1,5 @@
-import { F as Fields, a as Content } from './content-GL5k9Mch.js';
-import { F as FieldPath } from './parse-content-CVU-pHrH.js';
+import { F as Fields, a as Content } from './content-C_WpiWBm.js';
+import { F as FieldPath } from './parse-content-9RIWhb6z.js';
 
 interface Box {
     readonly top: number;

package/dist/{parse-content-CVU-pHrH.d.ts → parse-content-9RIWhb6z.d.ts}

@@ -1,4 +1,4 @@
-import { F as Fields, C as ContentOf } from './content-GL5k9Mch.js';
+import { F as Fields, C as ContentOf } from './content-C_WpiWBm.js';
 
 /** Where a value lives in the content: field names and, inside a collection, record indexes. */
 type FieldPath = readonly (string | number)[];

package/dist/protocol.d.ts

@@ -1,6 +1,6 @@
-export { B as Box, a as EditorKey, E as EditorMessage, I as InlineEditingOutcome, L as LinkBox, M as MarkerBox, b as PROTOCOL_VERSION, c as PageLayout, P as PageMessage, d as Point, S as Shortcut, V as Viewport, r as readEditorMessage, e as readPageMessage, s as shortcutOf } from './messages-CJ8vKPs9.js';
-import { F as Fields, I as ImageField } from './content-GL5k9Mch.js';
-import { F as FieldPath } from './parse-content-CVU-pHrH.js';
+export { B as Box, a as EditorKey, E as EditorMessage, I as InlineEditingOutcome, L as LinkBox, M as MarkerBox, b as PROTOCOL_VERSION, c as PageLayout, P as PageMessage, d as Point, S as Shortcut, V as Viewport, r as readEditorMessage, e as readPageMessage, s as shortcutOf } from './messages-CBf5diaN.js';
+import { F as Fields, I as ImageField } from './content-C_WpiWBm.js';
+import { F as FieldPath } from './parse-content-9RIWhb6z.js';
 
 declare function carriesFiles(event: DragEvent): boolean;
 

package/dist/protocol.js

@@ -6,8 +6,8 @@ import {
   readEditorMessage,
   readPageMessage,
   shortcutOf
-} from "./chunk-N2UE3EQU.js";
-import "./chunk-AFTVM755.js";
+} from "./chunk-XCBYYKWR.js";
+import "./chunk-GLXC5OLC.js";
 export {
   PROTOCOL_VERSION,
   carriesFiles,

package/dist/schema.d.ts

@@ -1,7 +1,7 @@
-import { b as ImageValue, L as LinkValue, c as Field, d as CollectionField, F as Fields, a as Content, R as RecordFields, C as ContentOf } from './content-GL5k9Mch.js';
-export { e as ChoiceField, f as ChoiceOption, g as ChoicesField, D as DateField, h as FieldKind, i as FieldValue, G as GroupField, I as ImageField, j as LinkField, N as NumberField, O as OptionValue, k as RecordOf, l as ReferenceField, m as ReferencesField, T as TextField, n as TimeField, o as ToggleField, U as UrlField, V as ValueOf, p as choice, q as choices, r as collection, s as date, t as defaultContent, u as defaultValue, v as defineSchema, w as group, x as image, y as link, z as number, A as reference, B as references, E as text, H as time, J as toggle, K as url } from './content-GL5k9Mch.js';
-import { F as FieldPath } from './parse-content-CVU-pHrH.js';
-export { C as ContentIssue, P as ParsedContent, c as countCharacters, f as formatFieldPath, p as parseContent } from './parse-content-CVU-pHrH.js';
+import { b as ImageValue, L as LinkValue, c as Field, d as CollectionField, F as Fields, a as Content, R as RecordFields, C as ContentOf, G as GroupField, e as LinkField, T as TextField, U as UrlField, f as ChoicesField, g as TimeField, I as ImageField } from './content-C_WpiWBm.js';
+export { h as ChoiceField, i as ChoiceOption, D as DateField, j as FieldKind, k as FieldValue, l as ImageFocus, N as NumberField, O as OptionValue, m as RecordOf, n as ReferenceField, o as ReferencesField, p as ToggleField, V as ValueOf, q as choice, r as choices, s as collection, t as date, u as defaultContent, v as defaultValue, w as defineSchema, x as group, y as image, z as link, A as number, B as reference, E as references, H as text, J as time, K as toggle, M as url } from './content-C_WpiWBm.js';
+import { F as FieldPath } from './parse-content-9RIWhb6z.js';
+export { C as ContentIssue, P as ParsedContent, c as countCharacters, f as formatFieldPath, p as parseContent } from './parse-content-9RIWhb6z.js';
 
 declare const FIELD_PATH_ATTRIBUTE = "data-cms-path";
 interface FieldMarker {
@@ -96,4 +96,79 @@ declare function linkTargetOf(href: string): LinkTarget | undefined;
  */
 declare function hrefOf(target: LinkTarget): string;
 
-export { CollectionField, type CollectionRecords, Content, ContentOf, type ContentPath, FIELD_PATH_ATTRIBUTE, Field, type FieldMarker, FieldPath, type FieldTarget, Fields, ImageValue, type LinkKind, type LinkTarget, LinkValue, RECORD_ID_KEY, REVEALED_ATTRIBUTE, REVEAL_ATTRIBUTE, REVEAL_EVENT, RecordFields, collectionAt, editable, findRecord, hrefOf, isRecordId, linkTargetOf, newRecord, resolveFieldPath, withRecordIds };
+/** `object-position` of the photo: "50% 30%"; the middle when no point is chosen. */
+declare function imagePosition(image: ImageValue | null): string;
+
+/** What search engines and a link shared in a messenger show: one per page. */
+declare function seoFields(options?: {
+    readonly label?: string;
+}): GroupField<{
+    title: TextField;
+    description: TextField;
+    image: ImageField;
+}>;
+/** How to reach the business: the phone, the address with a map, the messengers. */
+declare function contactsFields(options?: {
+    readonly label?: string;
+}): GroupField<{
+    phone: LinkField;
+    address: TextField;
+    map: UrlField;
+    messengers: CollectionField<{
+        link: LinkField;
+    }>;
+}>;
+declare const WEEKDAYS: readonly [{
+    readonly value: "mon";
+    readonly label: "Пн";
+}, {
+    readonly value: "tue";
+    readonly label: "Вт";
+}, {
+    readonly value: "wed";
+    readonly label: "Ср";
+}, {
+    readonly value: "thu";
+    readonly label: "Чт";
+}, {
+    readonly value: "fri";
+    readonly label: "Пт";
+}, {
+    readonly value: "sat";
+    readonly label: "Сб";
+}, {
+    readonly value: "sun";
+    readonly label: "Вс";
+}];
+/** When the business is open: rows of days with the same hours, «Пн–Пт 08:00–21:00». */
+declare function openingHoursField(options?: {
+    readonly label?: string;
+}): CollectionField<{
+    days: ChoicesField<readonly [{
+        readonly value: "mon";
+        readonly label: "Пн";
+    }, {
+        readonly value: "tue";
+        readonly label: "Вт";
+    }, {
+        readonly value: "wed";
+        readonly label: "Ср";
+    }, {
+        readonly value: "thu";
+        readonly label: "Чт";
+    }, {
+        readonly value: "fri";
+        readonly label: "Пт";
+    }, {
+        readonly value: "sat";
+        readonly label: "Сб";
+    }, {
+        readonly value: "sun";
+        readonly label: "Вс";
+    }]>;
+    opens: TimeField;
+    closes: TimeField;
+    note: TextField;
+}>;
+
+export { ChoicesField, CollectionField, type CollectionRecords, Content, ContentOf, type ContentPath, FIELD_PATH_ATTRIBUTE, Field, type FieldMarker, FieldPath, type FieldTarget, Fields, GroupField, ImageField, ImageValue, LinkField, type LinkKind, type LinkTarget, LinkValue, RECORD_ID_KEY, REVEALED_ATTRIBUTE, REVEAL_ATTRIBUTE, REVEAL_EVENT, RecordFields, TextField, TimeField, UrlField, WEEKDAYS, collectionAt, contactsFields, editable, findRecord, hrefOf, imagePosition, isRecordId, linkTargetOf, newRecord, openingHoursField, resolveFieldPath, seoFields, withRecordIds };

package/dist/schema.js

@@ -4,10 +4,12 @@ import {
   REVEALED_ATTRIBUTE,
   REVEAL_ATTRIBUTE,
   REVEAL_EVENT,
+  WEEKDAYS,
   choice,
   choices,
   collection,
   collectionAt,
+  contactsFields,
   countCharacters,
   date,
   defaultContent,
@@ -19,31 +21,36 @@ import {
   group,
   hrefOf,
   image,
+  imagePosition,
   isRecordId,
   link,
   linkTargetOf,
   newRecord,
   number,
+  openingHoursField,
   parseContent,
   reference,
   references,
   resolveFieldPath,
+  seoFields,
   text,
   time,
   toggle,
   url,
   withRecordIds
-} from "./chunk-AFTVM755.js";
+} from "./chunk-GLXC5OLC.js";
 export {
   FIELD_PATH_ATTRIBUTE,
   RECORD_ID_KEY,
   REVEALED_ATTRIBUTE,
   REVEAL_ATTRIBUTE,
   REVEAL_EVENT,
+  WEEKDAYS,
   choice,
   choices,
   collection,
   collectionAt,
+  contactsFields,
   countCharacters,
   date,
   defaultContent,
@@ -55,15 +62,18 @@ export {
   group,
   hrefOf,
   image,
+  imagePosition,
   isRecordId,
   link,
   linkTargetOf,
   newRecord,
   number,
+  openingHoursField,
   parseContent,
   reference,
   references,
   resolveFieldPath,
+  seoFields,
   text,
   time,
   toggle,

package/dist/site.d.ts

@@ -1,5 +1,5 @@
 import { AstroComponentFactory } from 'astro/runtime/server/index.js';
-import { F as Fields, C as ContentOf } from './content-GL5k9Mch.js';
+import { F as Fields, C as ContentOf } from './content-C_WpiWBm.js';
 
 interface SeamletSiteDefinition<F extends Fields> {
     /** The site's address in the CMS: `/sites/<id>`. */

package/dist/site.js

@@ -1,6 +1,6 @@
 import {
   parseContent
-} from "./chunk-AFTVM755.js";
+} from "./chunk-GLXC5OLC.js";
 
 // src/site.ts
 import { cmsOrigin } from "virtual:seamlet/config";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seamlet/astro",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "Connects an Astro site to the Seamlet CMS: the schema of its content, the preview the editor frames, and its published content.",
   "license": "MIT",
   "type": "module",