@protobase/schema 0.19.15 → 0.20.0

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import { FileOptions, FileProcessor, FileProcessorInput, ImageFormat, ImageVariant, ImageVariantOptions, imageFormats } from "./files/file-options.js";
-import { ActionInputKind, ActionInputModel, ActionModel, ActionRun, AppAddress, BadgeShape, BottomBarItemModel, BottomBarModel, CardFavoriteModel, CardPhotosModel, ChartGranularity, ChartModel, ChartRange, CheckedFilter, CompareOp, CreateModel, CustomSectionModel, DatePreset, DurationLiteral, DurationUnit, EventModel, EventOperation, ExportModel, FieldFormat, FieldModel, FieldPath, FieldType, FieldViewModel, FieldWidgetModel, FileFieldModel, FilterError, FilterErrorCode, FilterExpr, FilterLayout, FilterOf, FilterValue, FilterWidgetModel, GalleryModel, HelpWhen, JsonValue, KeyValue, LayoutItemModel, ListDisplayModel, ListModel, ListQuery, Literal, MapSectionModel, MapView, NavModel, NavRecentModel, NowValue, OrderByItem, RecordMode, RelatedColumnModel, RelatedModel, ResourceModel, SaveFeedback, SaveSearchModel, SearchMatch, SearchResultModel, SearchesOfModel, SectionPresentation, ShowWhen, SignInPromptModel, SignInViewModel, SortSpec, Span, StatusTone, UserMenuItemModel, UserMenuModel, ViewModel } from "./model.js";
+import { ActionInputKind, ActionInputModel, ActionModel, ActionRun, AppAddress, BadgeShape, BottomBarItemModel, BottomBarModel, CardFavoriteModel, CardPhotosModel, ChartGranularity, ChartModel, ChartRange, CheckedFilter, CompareOp, CreateModel, CustomSectionModel, DatePreset, DurationLiteral, DurationUnit, EventModel, EventOperation, ExportModel, FieldFormat, FieldModel, FieldPath, FieldType, FieldViewModel, FieldWidgetModel, FileFieldModel, FilterError, FilterErrorCode, FilterExpr, FilterLayout, FilterOf, FilterValue, FilterWidgetModel, GalleryModel, GroupChartModel, HelpWhen, JsonValue, KeyValue, LayoutItemModel, ListDisplayModel, ListModel, ListQuery, Literal, MapSectionModel, MapView, NavModel, NavRecentModel, NowValue, OrderByItem, PeriodChartModel, RecordMode, RelatedColumnModel, RelatedModel, ResourceModel, SaveFeedback, SaveSearchModel, SearchMatch, SearchResultModel, SearchesOfModel, SectionPresentation, ShowWhen, SignInPromptModel, SignInViewModel, SortSpec, Span, StatusTone, UserMenuItemModel, UserMenuModel, ViewModel } from "./model.js";
 import { AccessAction, AccessContext, AccessFn, AccessResult, AccessUser, FieldAccess, FieldRule } from "./access/types.js";
 import { AnyField, Constraint, Field, FieldMeta, FieldTypeDef } from "./field.js";
 import { RelationField } from "./relation-field.js";
@@ -9,6 +9,7 @@ import { FieldRefs, FieldsInput, Ref, Refs } from "./refs.js";
 import { CreatedOptions, DeletedOptions, EventActor, EventContext, EventHelpers, EventMatch, EventSpec, UndeletedOptions, UpdatedOptions } from "./events/event-helpers.js";
 import { Access, InferRecord, Issue, KeyOf, KeyRefs, RecordKey, RecordOf } from "./resource-types.js";
 import { ResourceBuilder, SearchRef, SearchRefs, Validator, resource } from "./resource.js";
+import { ChartInput, GroupChartInput, PeriodChartInput } from "./view-chart.js";
 import { ListColumn } from "./view-columns.js";
 import { ComponentRef, ViewProps } from "./view-displays.js";
 import { FieldView } from "./view-field.js";
@@ -19,7 +20,7 @@ import { UserMenuSource, userMenu } from "./user-menu.js";
 import { BottomBarSource, bottomBar, maxBottomBarItems } from "./bottom-bar.js";
 import { BottomBarNames, bottomBarErrors } from "./bottom-bar-errors.js";
 import { layout } from "./layout.js";
-import { KeyType, keyTypes } from "./keys.js";
+import { KeyType, fitsKeyType, keyTypes } from "./keys.js";
 import { addressWords, appPath, readAppPath } from "./app-address.js";
 import { SignInAddress, SignInStep, readSignInAddress, signInParams, signInPath, signInRoute, signInSteps } from "./sign-in-address.js";
 import { FilterLimits, FilterParse, parseFilter } from "./filter/parse.js";
@@ -38,4 +39,4 @@ import { AccessSource, ResolveOptions, ResolvedAccess, RowFilterOperation, acces
 import { restrictModel } from "./access/restrict.js";
 import "./access/index.js";
 import { AssistantAction, AssistantActionRequest, AssistantCardPart, AssistantDiff, AssistantEvent, AssistantMessage, AssistantMessageRequest, AssistantPart, AssistantState, AssistantStep, AssistantStepState, AssistantTablePart, AssistantTextPart, AssistantTone, AssistantWidgetPart } from "./assistant/protocol.js";
-export { type Access, type AccessAction, type AccessContext, type AccessFn, type AccessResult, type AccessSource, type AccessUser, type ActionInputKind, type ActionInputModel, type ActionModel, type ActionRun, type AnyField, type AppAddress, type AssistantAction, type AssistantActionRequest, type AssistantCardPart, type AssistantDiff, type AssistantEvent, type AssistantMessage, type AssistantMessageRequest, type AssistantPart, type AssistantState, type AssistantStep, type AssistantStepState, type AssistantTablePart, type AssistantTextPart, type AssistantTone, type AssistantWidgetPart, type BadgeShape, type BottomBarItemModel, type BottomBarModel, type BottomBarNames, type BottomBarSource, type Capability, type CapabilityAction, type CapabilityLimit, type CapabilityScope, type CardFavoriteModel, type CardPhotosModel, type ChartGranularity, type ChartModel, type ChartRange, type CheckResult, type CheckedFilter, type CompareOp, type ComponentRef, type Constraint, type CreateModel, type CreatedOptions, type CustomSectionModel, type DatePreset, type DeletedOptions, type DurationLiteral, type DurationUnit, type EvaluateOptions, type EventActor, type EventContext, type EventHelpers, type EventMatch, type EventModel, type EventOperation, type EventSpec, type ExportModel, type Field, type FieldAccess, type FieldFormat, type FieldMeta, type FieldModel, type FieldPath, type FieldRefValue, type FieldRefs, type FieldRule, type FieldType, type FieldTypeDef, type FieldView, type FieldViewModel, type FieldViews, type FieldWidgetModel, type FieldsInput, type FileField, type FileFieldModel, type FileOptions, type FileProcessor, type FileProcessorInput, type FilterError, type FilterErrorCode, type FilterExpr, type FilterLayout, type FilterLimits, type FilterOf, type FilterParse, type FilterValue, type FilterWidgetModel, type GalleryModel, type Grant, type HeldCapability, type HelpWhen, type ImageFormat, type ImageVariant, type ImageVariantOptions, type InferRecord, type Issue, type JsonValue, type KeyOf, type KeyRefs, type KeyType, type KeyValue, type LayoutItemModel, type ListColumn, type ListDisplayModel, type ListModel, type ListQuery, type Literal, type MapSectionModel, type MapView, type NavModel, type NavRecentModel, type NowValue, type OrderByCheck, type OrderByItem, type OrderByParse, type RecordKey, type RecordMode, type RecordOf, type Ref, type Refs, type RelatedColumnModel, type RelatedModel, type RelationField, type ResolveOptions, type ResolvedAccess, type ResourceBuilder, type ResourceModel, type RoleEntry, type RoleLimit, type Roles, type RolesOptions, type RowFilterOperation, type Rule, type SaveFeedback, type SaveSearchModel, type SearchMatch, type SearchRef, type SearchRefs, type SearchResultModel, type SearchesOfModel, type SectionPresentation, type ShowWhen, type SignInAddress, type SignInPromptModel, type SignInStep, type SignInViewModel, type SortSpec, type Span, type StatusTone, type UndeletedOptions, type UpdatedOptions, type UserMenuItemModel, type UserMenuModel, type UserMenuSource, type Validator, type ViewBuilder, type ViewModel, type ViewProps, accessWarnings, addressWords, anonymousRole, appPath, bottomBar, bottomBarErrors, checkFilter, checkOrderBy, checkRecord, createWhere, defineRoles, enumLabel, evaluateFilter, f, fieldRef, fieldsUsedBy, imageFormats, keyTypes, layout as l, maxBottomBarItems, parseFilter, parseOrderBy, pickView, printFilter, printOrderBy, readAppPath, readSignInAddress, resolveAccess, resource, restrictModel, rule, signInParams, signInPath, signInRoute, signInSteps, userMenu, view, where };
+export { type Access, type AccessAction, type AccessContext, type AccessFn, type AccessResult, type AccessSource, type AccessUser, type ActionInputKind, type ActionInputModel, type ActionModel, type ActionRun, type AnyField, type AppAddress, type AssistantAction, type AssistantActionRequest, type AssistantCardPart, type AssistantDiff, type AssistantEvent, type AssistantMessage, type AssistantMessageRequest, type AssistantPart, type AssistantState, type AssistantStep, type AssistantStepState, type AssistantTablePart, type AssistantTextPart, type AssistantTone, type AssistantWidgetPart, type BadgeShape, type BottomBarItemModel, type BottomBarModel, type BottomBarNames, type BottomBarSource, type Capability, type CapabilityAction, type CapabilityLimit, type CapabilityScope, type CardFavoriteModel, type CardPhotosModel, type ChartGranularity, type ChartInput, type ChartModel, type ChartRange, type CheckResult, type CheckedFilter, type CompareOp, type ComponentRef, type Constraint, type CreateModel, type CreatedOptions, type CustomSectionModel, type DatePreset, type DeletedOptions, type DurationLiteral, type DurationUnit, type EvaluateOptions, type EventActor, type EventContext, type EventHelpers, type EventMatch, type EventModel, type EventOperation, type EventSpec, type ExportModel, type Field, type FieldAccess, type FieldFormat, type FieldMeta, type FieldModel, type FieldPath, type FieldRefValue, type FieldRefs, type FieldRule, type FieldType, type FieldTypeDef, type FieldView, type FieldViewModel, type FieldViews, type FieldWidgetModel, type FieldsInput, type FileField, type FileFieldModel, type FileOptions, type FileProcessor, type FileProcessorInput, type FilterError, type FilterErrorCode, type FilterExpr, type FilterLayout, type FilterLimits, type FilterOf, type FilterParse, type FilterValue, type FilterWidgetModel, type GalleryModel, type Grant, type GroupChartInput, type GroupChartModel, type HeldCapability, type HelpWhen, type ImageFormat, type ImageVariant, type ImageVariantOptions, type InferRecord, type Issue, type JsonValue, type KeyOf, type KeyRefs, type KeyType, type KeyValue, type LayoutItemModel, type ListColumn, type ListDisplayModel, type ListModel, type ListQuery, type Literal, type MapSectionModel, type MapView, type NavModel, type NavRecentModel, type NowValue, type OrderByCheck, type OrderByItem, type OrderByParse, type PeriodChartInput, type PeriodChartModel, type RecordKey, type RecordMode, type RecordOf, type Ref, type Refs, type RelatedColumnModel, type RelatedModel, type RelationField, type ResolveOptions, type ResolvedAccess, type ResourceBuilder, type ResourceModel, type RoleEntry, type RoleLimit, type Roles, type RolesOptions, type RowFilterOperation, type Rule, type SaveFeedback, type SaveSearchModel, type SearchMatch, type SearchRef, type SearchRefs, type SearchResultModel, type SearchesOfModel, type SectionPresentation, type ShowWhen, type SignInAddress, type SignInPromptModel, type SignInStep, type SignInViewModel, type SortSpec, type Span, type StatusTone, type UndeletedOptions, type UpdatedOptions, type UserMenuItemModel, type UserMenuModel, type UserMenuSource, type Validator, type ViewBuilder, type ViewModel, type ViewProps, accessWarnings, addressWords, anonymousRole, appPath, bottomBar, bottomBarErrors, checkFilter, checkOrderBy, checkRecord, createWhere, defineRoles, enumLabel, evaluateFilter, f, fieldRef, fieldsUsedBy, fitsKeyType, imageFormats, keyTypes, layout as l, maxBottomBarItems, parseFilter, parseOrderBy, pickView, printFilter, printOrderBy, readAppPath, readSignInAddress, resolveAccess, resource, restrictModel, rule, signInParams, signInPath, signInRoute, signInSteps, userMenu, view, where };

package/dist/index.js

@@ -16,11 +16,11 @@ import { userMenu } from "./user-menu.js";
 import { bottomBar, maxBottomBarItems } from "./bottom-bar.js";
 import { bottomBarErrors } from "./bottom-bar-errors.js";
 import { layout } from "./layout.js";
-import { keyTypes } from "./keys.js";
+import { fitsKeyType, keyTypes } from "./keys.js";
 import { addressWords, appPath, readAppPath } from "./app-address.js";
 import { readSignInAddress, signInParams, signInPath, signInRoute, signInSteps } from "./sign-in-address.js";
 import { rule } from "./access/rule.js";
 import { defineRoles } from "./access/roles.js";
 import { pickView } from "./access/pick-view.js";
 import { restrictModel } from "./access/restrict.js";
-export { accessWarnings, addressWords, anonymousRole, appPath, bottomBar, bottomBarErrors, checkFilter, checkOrderBy, checkRecord, createWhere, defineRoles, enumLabel, evaluateFilter, f, fieldRef, fieldsUsedBy, imageFormats, keyTypes, layout as l, maxBottomBarItems, parseFilter, parseOrderBy, pickView, printFilter, printOrderBy, readAppPath, readSignInAddress, resolveAccess, resource, restrictModel, rule, signInParams, signInPath, signInRoute, signInSteps, userMenu, view, where };
+export { accessWarnings, addressWords, anonymousRole, appPath, bottomBar, bottomBarErrors, checkFilter, checkOrderBy, checkRecord, createWhere, defineRoles, enumLabel, evaluateFilter, f, fieldRef, fieldsUsedBy, fitsKeyType, imageFormats, keyTypes, layout as l, maxBottomBarItems, parseFilter, parseOrderBy, pickView, printFilter, printOrderBy, readAppPath, readSignInAddress, resolveAccess, resource, restrictModel, rule, signInParams, signInPath, signInRoute, signInSteps, userMenu, view, where };

package/dist/internal.d.ts

@@ -1,6 +1,7 @@
 import { checkedAccept, checkedProvider, parseSize } from "./files/file-options.js";
 import { actionInputErrors, shownInputs } from "./action-inputs.js";
-import { cardPhotoLimit, displayFields, tableDisplay } from "./view-displays.js";
+import { chartFields, isGroupChart } from "./view-chart.js";
+import { boardErrors, cardPhotoLimit, displayFields, tableDisplay } from "./view-displays.js";
 import { fieldRefsIn, isFieldRef, markFieldRefs, unmarkFieldRefs } from "./field-ref.js";
 import { bottomBarFor } from "./bottom-bar.js";
 import { decodeKey, encodeKey } from "./keys.js";
@@ -15,4 +16,4 @@ import { addressPlaceholders, appHrefError, fillAddress, hrefField, hrefPlacehol
 import { AddressCheck, addressErrors } from "./address-errors.js";
 import { applyAssistantEvent, emptyAssistantState } from "./assistant/apply-event.js";
 import { readEventStream } from "./assistant/event-stream.js";
-export { type AddressCheck, type PluginHost, type PluginRequirement, type PropShapes, type RefShape, type SearchTerm, actionInputErrors, addressErrors, addressPlaceholders, appHrefError, applyAssistantEvent, bottomBarFor, cardPhotoLimit, checkEventFilter, checkedAccept, checkedProvider, decodeKey, defaultRecentLimit, displayFields, emptyAssistantState, encodeKey, fieldRefsIn, fillAddress, hrefField, hrefPlaceholders, inRange, isFieldRef, leavesApp, linkActionError, markFieldRefs, matchedSearchField, matchesSearch, navRecentErrors, parseSize, pluginProblem, pruneByShape, readEventStream, redactSecrets, searchTerms, shapes, shownInputs, statusTones, tableDisplay, termMatches, unmarkFieldRefs, webhookResources };
+export { type AddressCheck, type PluginHost, type PluginRequirement, type PropShapes, type RefShape, type SearchTerm, actionInputErrors, addressErrors, addressPlaceholders, appHrefError, applyAssistantEvent, boardErrors, bottomBarFor, cardPhotoLimit, chartFields, checkEventFilter, checkedAccept, checkedProvider, decodeKey, defaultRecentLimit, displayFields, emptyAssistantState, encodeKey, fieldRefsIn, fillAddress, hrefField, hrefPlaceholders, inRange, isFieldRef, isGroupChart, leavesApp, linkActionError, markFieldRefs, matchedSearchField, matchesSearch, navRecentErrors, parseSize, pluginProblem, pruneByShape, readEventStream, redactSecrets, searchTerms, shapes, shownInputs, statusTones, tableDisplay, termMatches, unmarkFieldRefs, webhookResources };

package/dist/internal.js

@@ -4,8 +4,9 @@ import { checkEventFilter } from "./events/event-models.js";
 import { defaultRecentLimit, navRecentErrors, statusTones } from "./nav-recent.js";
 import { actionInputErrors, shownInputs } from "./action-inputs.js";
 import { addressPlaceholders, appHrefError, fillAddress, hrefField, hrefPlaceholders, leavesApp, linkActionError } from "./address-template.js";
+import { chartFields, isGroupChart } from "./view-chart.js";
 import { fieldRefsIn, isFieldRef, markFieldRefs, unmarkFieldRefs } from "./field-ref.js";
-import { cardPhotoLimit, displayFields, tableDisplay } from "./view-displays.js";
+import { boardErrors, cardPhotoLimit, displayFields, tableDisplay } from "./view-displays.js";
 import { bottomBarFor } from "./bottom-bar.js";
 import { decodeKey, encodeKey } from "./keys.js";
 import { webhookResources } from "./webhooks/webhook-resources.js";
@@ -15,4 +16,4 @@ import { redactSecrets } from "./redact-secrets.js";
 import { addressErrors } from "./address-errors.js";
 import { applyAssistantEvent, emptyAssistantState } from "./assistant/apply-event.js";
 import { readEventStream } from "./assistant/event-stream.js";
-export { actionInputErrors, addressErrors, addressPlaceholders, appHrefError, applyAssistantEvent, bottomBarFor, cardPhotoLimit, checkEventFilter, checkedAccept, checkedProvider, decodeKey, defaultRecentLimit, displayFields, emptyAssistantState, encodeKey, fieldRefsIn, fillAddress, hrefField, hrefPlaceholders, inRange, isFieldRef, leavesApp, linkActionError, markFieldRefs, matchedSearchField, matchesSearch, navRecentErrors, parseSize, pluginProblem, pruneByShape, readEventStream, redactSecrets, searchTerms, shapes, shownInputs, statusTones, tableDisplay, termMatches, unmarkFieldRefs, webhookResources };
+export { actionInputErrors, addressErrors, addressPlaceholders, appHrefError, applyAssistantEvent, boardErrors, bottomBarFor, cardPhotoLimit, chartFields, checkEventFilter, checkedAccept, checkedProvider, decodeKey, defaultRecentLimit, displayFields, emptyAssistantState, encodeKey, fieldRefsIn, fillAddress, hrefField, hrefPlaceholders, inRange, isFieldRef, isGroupChart, leavesApp, linkActionError, markFieldRefs, matchedSearchField, matchesSearch, navRecentErrors, parseSize, pluginProblem, pruneByShape, readEventStream, redactSecrets, searchTerms, shapes, shownInputs, statusTones, tableDisplay, termMatches, unmarkFieldRefs, webhookResources };

package/dist/keys.d.ts

@@ -2,6 +2,8 @@ import { FieldType, KeyValue, ResourceModel } from "./model.js";
 //#region src/keys.d.ts
 /** The field types a primary key part may have: `integer`, `bigint`, `uuid` or `text`. */
 export type KeyType = Extract<FieldType, 'integer' | 'bigint' | 'uuid' | 'text'>;
+/** Whether a column of `type` can hold `value`, such as a user id an owner field stores. */
+export declare const fitsKeyType: (value: string, type: KeyType) => boolean;
 export declare const encodeKey: (key: KeyValue | readonly KeyValue[]) => string;
 export declare const decodeKey: (encoded: string, types: readonly KeyType[]) => string | number | (string | number)[];
 /**

package/dist/keys.js

@@ -13,6 +13,15 @@ const decodePart = (part, type) => {
 	if (!Number.isSafeInteger(value)) throw new Error("Invalid integer key part");
 	return value;
 };
+/** Whether a column of `type` can hold `value`, such as a user id an owner field stores. */
+const fitsKeyType = (value, type) => {
+	if (type === "text") return true;
+	if (type === "uuid") return uuidPattern.test(value);
+	if (!integerPattern.test(value)) return false;
+	if (type === "bigint") return true;
+	const number = Number(value);
+	return Number.isSafeInteger(number) && Math.abs(number) <= 2 ** 31 - 1;
+};
 const decodeComponent = (part) => {
 	try {
 		return decodeURIComponent(part);
@@ -54,4 +63,4 @@ const keyTypes = (model, resolve, seen = []) => model.primaryKey.flatMap((name)
 	return types;
 });
 //#endregion
-export { decodeKey, encodeKey, keyTypes };
+export { decodeKey, encodeKey, fitsKeyType, keyTypes };

package/dist/model.d.ts

@@ -304,6 +304,8 @@ export type ListDisplayModel = {
   footer?: string[];
   /** Boolean fields shown as small badges of their labels when true. */
   flags?: string[];
+  /** Related columns of the list (`c.related`) shown as lines of their dots at the card's bottom, by their names. */
+  dots?: string[];
   /** The component that draws each card's content instead of the built-in card. */
   card?: string;
   /** Where the card's further photos come from. */
@@ -335,6 +337,25 @@ export type ListDisplayModel = {
   defaultRadius?: number;
   /** The field holding the GeoJSON geometry around an approximate position: a polygon, or a line such as a street. */
   area?: string;
+} | {
+  /** A column per value of an enum field, a card per record in its value's column, moved by dragging. */
+  kind: 'board';
+  /** What the address names (`?display=board`). */
+  name: string;
+  /** The display's name in the switch. */
+  label?: string;
+  /** The display's icon in the switch. */
+  icon?: string;
+  /** The filterable enum field whose values are the columns, and which a card dragged to another column sets. */
+  by: string;
+  /** The card's title; the view's title when omitted. */
+  title?: string;
+  /** The line under the title. */
+  subtitle?: string;
+  /** A field drawn as a badge with its value labels. */
+  badge?: string;
+  /** A few small fields, such as dates, each shown when it has a value. */
+  meta?: string[];
 } | {
   /** The rows drawn by a project component. */
   kind: 'custom';
@@ -465,6 +486,11 @@ export type ListModel = {
   default?: string;
   /** The columns of related records among `columns`, each named there by its `name`. */
   relatedColumns?: RelatedColumnModel[];
+  /**
+   * The fields among `columns` edited in their cell, by a user who may change the record and the field; see
+   * [Editing in the list](website/src/content/docs/reference/ui-config.mdx#editing-in-the-list).
+   */
+  editable?: string[];
 };
 /**
  * A list column of the records of another resource that point at each row, directly or through a join resource, as a
@@ -661,8 +687,8 @@ export type GalleryModel = {
 export type ChartRange = '7d' | '30d' | '90d' | '1y' | 'all';
 /** How long each bar of a list's chart is. */
 export type ChartGranularity = 'hour' | 'day' | 'week' | 'month';
-/** A chart of records over time above a list, following its filters (`.chart(...)`). */
-export type ChartModel = {
+/** A chart of records over time above a list, following its filters (`.chart(...)` with `field`). */
+export type PeriodChartModel = {
   /** The date or timestamp field the records are counted by. */
   field: string;
   /** How far back it reaches. */
@@ -670,6 +696,21 @@ export type ChartModel = {
   /** How long each bar is. */
   granularity: ChartGranularity;
 };
+/** A chart of records per value of a field above a list, following its filters (`.chart(...)` with `groupBy`). */
+export type GroupChartModel = {
+  /** The field whose values make the groups, such as a status or a relation; not a date. */
+  groupBy: string;
+  /** Bars, the largest first, or a donut. */
+  type: 'bar' | 'donut';
+  /** A numeric field each group adds up, instead of counting its records. */
+  sum?: string;
+  /** A numeric field each group averages, instead of counting its records. */
+  average?: string;
+  /** How many values it shows, the largest. */
+  limit: number;
+};
+/** The chart above a list: records over time, or records per value of a field. */
+export type ChartModel = PeriodChartModel | GroupChartModel;
 /**
  * How the record page opens to a user who may change the record: `edit`, the default, as its form, ready to change;
  * `read` as a read view of label/value tables, with an Edit button to the form; `locked` as the same form, locked until

package/dist/view-actions.d.ts

@@ -17,7 +17,10 @@ export declare const actions: {
     bulk?: boolean;
     inputs?: (i: typeof inputs) => ActionInputModel[];
   }) => ActionModel;
-  /** Sets fields of the record, as one update with its ETag, for example `{ status: 'paid' }`. */
+  /**
+   * Sets fields of the record, as one update with its ETag, for example `{ status: 'paid' }`. It is not offered on a
+   * record that holds these values already.
+   */
   update: (name: string, o: ActionOptions & {
     set: Record<string, unknown>;
   }) => ActionModel;

package/dist/view-actions.js

@@ -24,7 +24,10 @@ const actions = {
 			inputs: built
 		};
 	},
-	/** Sets fields of the record, as one update with its ETag, for example `{ status: 'paid' }`. */
+	/**
+	* Sets fields of the record, as one update with its ETag, for example `{ status: 'paid' }`. It is not offered on a
+	* record that holds these values already.
+	*/
 	update: (name, o) => ({
 		...named(name, o),
 		run: {

package/dist/view-chart.d.ts

@@ -0,0 +1,32 @@
+import { ChartGranularity, ChartModel, ChartRange, GroupChartModel } from "./model.js";
+import { Ref } from "./refs.js";
+//#region src/view-chart.d.ts
+/** Records per `granularity` over a date or timestamp `field`. */
+export type PeriodChartInput = {
+  /** The date or timestamp field the records are counted by. */
+  field: Ref;
+  /** How far back it reaches. */
+  range: ChartRange;
+  /** How long each bar is. */
+  granularity: ChartGranularity;
+};
+/** Records per value of `groupBy`, counted, or with `sum` or `average` that of a numeric field. */
+export type GroupChartInput = {
+  /** The field whose values make the groups, such as a status or a relation; not a date. */
+  groupBy: Ref;
+  /** Bars, the default, or a donut. */
+  type?: GroupChartModel['type'];
+  /** How many values it shows, the largest; default 10. */
+  limit?: number;
+  /** A numeric field each group adds up, instead of counting its records. */
+  sum?: Ref;
+  /** A numeric field each group averages, instead of counting its records. */
+  average?: Ref;
+};
+/** What `.chart(...)` takes: a chart over time or per value. */
+export type ChartInput = PeriodChartInput | GroupChartInput;
+/** Whether a list's chart counts records per value of a field rather than over time. */
+export declare const isGroupChart: (chart: ChartModel) => chart is GroupChartModel;
+/** The fields a list's chart reads: its date field, or the field it groups by and the one it adds up. */
+export declare const chartFields: (chart: ChartModel) => string[];
+//#endregion

package/dist/view-chart.js

@@ -0,0 +1,29 @@
+//#region src/view-chart.ts
+const defaultLimit = 10;
+const chartModel = (input) => {
+	if (!("groupBy" in input)) return {
+		field: input.field.name,
+		range: input.range,
+		granularity: input.granularity
+	};
+	if (input.sum && input.average) throw new Error("A chart takes sum or average, not both");
+	const limit = input.limit ?? defaultLimit;
+	if (!Number.isInteger(limit) || limit < 1) throw new Error(`A chart's limit must be a positive whole number, not ${limit}`);
+	return {
+		groupBy: input.groupBy.name,
+		type: input.type ?? "bar",
+		...input.sum && { sum: input.sum.name },
+		...input.average && { average: input.average.name },
+		limit
+	};
+};
+/** Whether a list's chart counts records per value of a field rather than over time. */
+const isGroupChart = (chart) => "groupBy" in chart;
+/** The fields a list's chart reads: its date field, or the field it groups by and the one it adds up. */
+const chartFields = (chart) => isGroupChart(chart) ? [
+	chart.groupBy,
+	...chart.sum ? [chart.sum] : [],
+	...chart.average ? [chart.average] : []
+] : [chart.field];
+//#endregion
+export { chartFields, chartModel, isGroupChart };

package/dist/view-displays.d.ts

@@ -1,5 +1,6 @@
-import { CardFavoriteModel, CardPhotosModel, ListDisplayModel } from "./model.js";
+import { CardFavoriteModel, CardPhotosModel, ListDisplayModel, ResourceModel } from "./model.js";
 import { Ref } from "./refs.js";
+import { ListColumn } from "./view-columns.js";
 //#region src/view-displays.d.ts
 /** A custom component as `component(name)` from `@protobase/layout` declares it. */
 export type ComponentRef<P> = ((props: P) => unknown) & {
@@ -26,6 +27,8 @@ export declare const displays: {
    * view's title) over `subtitle`, `badge` drawn as a badge with its value labels, `amount` the first of its fields with a
    * value in bold, such as a purchase price or a rent, and a few small `meta` fields such as dates. `footer` is a line at
    * the card's bottom of its fields with a value, joined by bullets. `flags` are boolean fields shown as small badges of their labels when true, such as a garden or parking.
+   * `dots` are related columns of the list (`c.related`), each a line of its dots under the rest of the card, with the
+   * colours, order and hover cards they have in the table; a column with no records for the row shows no line.
    * With `card`, a component of the project or a plugin draws each card's content instead, from the row of those
    * fields (`{ row }`); without it, or when it throws, the card is the built-in one. With `photos`, the built-in card's
    * picture gets arrows through the `image` of the records of another resource that point at the card's record, after
@@ -43,6 +46,7 @@ export declare const displays: {
     meta?: Ref[];
     footer?: Ref[];
     flags?: Ref[];
+    dots?: ListColumn[];
   }, o?: Naming & {
     card?: ComponentRef<never>;
     photos?: CardPhotosModel;
@@ -70,6 +74,24 @@ export declare const displays: {
     cards?: string;
     defaultRadius?: number;
   }) => ListDisplayModel;
+  /**
+   * A column per value of the enum field `by`, in the order the field lists them, each headed by its value label and how
+   * many of the list's records have it; with a column for records without a value when the field may be empty. Each
+   * column pages through the list API with the list's filter and search, its value added, in the list's order. A card
+   * shows `title` (default: the view's title) over `subtitle`, with `badge` and a few small `meta` fields, as the built-in
+   * card of `d.cards` does, and opens the record. Dragging a card to another column, or picking it up with Space and
+   * moving it with the arrow keys, saves the record with `by` set to that column's value, as one update with its ETag,
+   * so the resource's access rules and `validate` decide, and a refusal puts the card back and says why. `by` must be
+   * a filterable enum field. Named `board` unless `name` says otherwise. See
+   * [Boards](website/src/content/docs/reference/ui-config.mdx#boards).
+   */
+  board: (fields: {
+    by: Ref;
+    title?: Ref;
+    subtitle?: Ref;
+    badge?: Ref;
+    meta?: Ref[];
+  }, o?: Naming) => ListDisplayModel;
   /**
    * The list drawn by a component of the project, registered in `protobase.ui.tsx` under its name. It gets `props` and
    * reads the rows with `useListDisplay()`; `fields` are the fields it shows, fetched with relation names.
@@ -81,6 +103,10 @@ export declare const displays: {
     props?: ViewProps<P>;
   }) => ListDisplayModel;
 };
-/** Every field a display names: what it shows, a map's position and the fields saying how exact it is, and the field references in a custom display's props. */
+/** What makes a board unable to put the records in columns: a `by` field that is no filterable enum. */
+export declare const boardErrors: (display: Extract<ListDisplayModel, {
+  kind: "board";
+}>, model: ResourceModel) => string[];
+/** Every field a display names: what it shows, a map's position and the fields saying how exact it is, a board's columns, and the field references in a custom display's props. */
 export declare const displayFields: (display: ListDisplayModel) => string[];
 //#endregion

package/dist/view-displays.js

@@ -19,6 +19,8 @@ const displays = {
 	* view's title) over `subtitle`, `badge` drawn as a badge with its value labels, `amount` the first of its fields with a
 	* value in bold, such as a purchase price or a rent, and a few small `meta` fields such as dates. `footer` is a line at
 	* the card's bottom of its fields with a value, joined by bullets. `flags` are boolean fields shown as small badges of their labels when true, such as a garden or parking.
+	* `dots` are related columns of the list (`c.related`), each a line of its dots under the rest of the card, with the
+	* colours, order and hover cards they have in the table; a column with no records for the row shows no line.
 	* With `card`, a component of the project or a plugin draws each card's content instead, from the row of those
 	* fields (`{ row }`); without it, or when it throws, the card is the built-in one. With `photos`, the built-in card's
 	* picture gets arrows through the `image` of the records of another resource that point at the card's record, after
@@ -39,6 +41,7 @@ const displays = {
 		...fields.meta && { meta: fields.meta.map((ref) => ref.name) },
 		...fields.footer && { footer: fields.footer.map((ref) => ref.name) },
 		...fields.flags && { flags: fields.flags.map((ref) => ref.name) },
+		...fields.dots && { dots: fields.dots.map((column) => column.name) },
 		...o.card && { card: customComponent(o.card, "d.cards card") },
 		...o.photos && { photos: { ...o.photos } },
 		...o.favorite && { favorite: { ...o.favorite } }
@@ -68,6 +71,27 @@ const displays = {
 		...fields.area && { area: fields.area.name }
 	}),
 	/**
+	* A column per value of the enum field `by`, in the order the field lists them, each headed by its value label and how
+	* many of the list's records have it; with a column for records without a value when the field may be empty. Each
+	* column pages through the list API with the list's filter and search, its value added, in the list's order. A card
+	* shows `title` (default: the view's title) over `subtitle`, with `badge` and a few small `meta` fields, as the built-in
+	* card of `d.cards` does, and opens the record. Dragging a card to another column, or picking it up with Space and
+	* moving it with the arrow keys, saves the record with `by` set to that column's value, as one update with its ETag,
+	* so the resource's access rules and `validate` decide, and a refusal puts the card back and says why. `by` must be
+	* a filterable enum field. Named `board` unless `name` says otherwise. See
+	* [Boards](website/src/content/docs/reference/ui-config.mdx#boards).
+	*/
+	board: (fields, o = {}) => ({
+		kind: "board",
+		name: o.name ?? "board",
+		...naming(o),
+		by: fields.by.name,
+		...fields.title && { title: fields.title.name },
+		...fields.subtitle && { subtitle: fields.subtitle.name },
+		...fields.badge && { badge: fields.badge.name },
+		...fields.meta && { meta: fields.meta.map((ref) => ref.name) }
+	}),
+	/**
 	* The list drawn by a component of the project, registered in `protobase.ui.tsx` under its name. It gets `props` and
 	* reads the rows with `useListDisplay()`; `fields` are the fields it shows, fetched with relation names.
 	*/
@@ -90,6 +114,7 @@ const displayErrors = (list) => {
 		...names.filter((name) => name === tableDisplay).map(() => `"${tableDisplay}" is the list's own display; give the display another name`),
 		...names.filter((name, index) => names.indexOf(name) !== index).map((name) => `display "${name}" is defined twice`),
 		...(list.displays ?? []).flatMap((display) => display.kind === "map" && display.cards !== void 0 && !list.displays.some((other) => other.kind === "cards" && other.name === display.cards) ? [`display "${display.name}" names cards "${display.cards}", which is not a cards display of the list`] : []),
+		...(list.displays ?? []).flatMap((display) => display.kind === "cards" ? (display.dots ?? []).filter((name) => !list.relatedColumns?.some((column) => column.name === name)).map((name) => `display "${display.name}" shows dots of "${name}", which is not a related column of the list`) : []),
 		...(list.displays ?? []).flatMap((display) => display.kind === "map" ? approximateErrors(display).map((error) => `display "${display.name}": ${error}`) : []),
 		...list.default === void 0 || list.default === "table" || names.includes(list.default) ? [] : [`default "${list.default}" is not one of the displays (${[tableDisplay, ...names].join(", ")})`]
 	];
@@ -99,7 +124,14 @@ const approximateErrors = (display) => {
 	if (approximate !== void 0 && exact !== void 0) return ["name approximate or exact, not both"];
 	return [...(radius !== void 0 || defaultRadius !== void 0 || area !== void 0) && approximate === void 0 && exact === void 0 ? ["an area around approximate positions needs the approximate or exact field"] : [], ...defaultRadius === void 0 || Number.isFinite(defaultRadius) && defaultRadius > 0 ? [] : [`defaultRadius ${defaultRadius} is not a number of metres above 0`]];
 };
-/** Every field a display names: what it shows, a map's position and the fields saying how exact it is, and the field references in a custom display's props. */
+/** What makes a board unable to put the records in columns: a `by` field that is no filterable enum. */
+const boardErrors = (display, model) => {
+	const field = Object.hasOwn(model.fields, display.by) ? model.fields[display.by] : void 0;
+	if (!field) return [];
+	if (field.type !== "enum") return [`"${display.by}" on ${model.name} is ${field.type}, not an enum, whose values are the board's columns`];
+	return field.filterable ? [] : [`"${display.by}" on ${model.name} is not filterable, and each column of the board filters by its value`];
+};
+/** Every field a display names: what it shows, a map's position and the fields saying how exact it is, a board's columns, and the field references in a custom display's props. */
 const displayFields = (display) => {
 	if (display.kind === "map") return [
 		display.latitude,
@@ -110,6 +142,13 @@ const displayFields = (display) => {
 		display.area
 	].filter((name) => name !== void 0);
 	if (display.kind === "custom") return [...display.fields, ...fieldRefsIn(display.props)];
+	if (display.kind === "board") return [
+		display.by,
+		display.title,
+		display.subtitle,
+		display.badge,
+		...display.meta ?? []
+	].filter((name) => name !== void 0);
 	return [
 		display.image,
 		display.title,
@@ -122,4 +161,4 @@ const displayFields = (display) => {
 	].filter((name) => name !== void 0);
 };
 //#endregion
-export { cardPhotoLimit, customComponent, displayErrors, displayFields, displays, tableDisplay };
+export { boardErrors, cardPhotoLimit, customComponent, displayErrors, displayFields, displays, tableDisplay };

package/dist/view.d.ts

@@ -1,6 +1,7 @@
-import { ActionModel, ChartGranularity, ChartRange, CreateModel, ExportModel, FilterWidgetModel, HelpWhen, LayoutItemModel, ListDisplayModel, NavModel, NavRecentModel, RecordMode, ResourceModel, SaveFeedback, SaveSearchModel, SignInPromptModel, ViewModel } from "./model.js";
+import { ActionModel, CreateModel, ExportModel, FilterWidgetModel, HelpWhen, LayoutItemModel, ListDisplayModel, NavModel, NavRecentModel, RecordMode, ResourceModel, SaveFeedback, SaveSearchModel, SignInPromptModel, ViewModel } from "./model.js";
 import { FieldRefs, Ref } from "./refs.js";
 import { actions } from "./view-actions.js";
+import { ChartInput } from "./view-chart.js";
 import { ListColumn, columns } from "./view-columns.js";
 import { displays } from "./view-displays.js";
 import { FieldView } from "./view-field.js";
@@ -66,14 +67,17 @@ export declare class ViewBuilder<R extends {
   /** Hints per field, such as `{ total: r.total.prefix('€').decimals(2) }`; calls add up. */
   fields(build: (r: FieldViews<R>) => Record<string, FieldView>): ViewBuilder<R>;
   /**
-   * The list: its table's `columns`, fields or columns of related records (`c.related`), `sort` and `search`, and other
-   * `displays` to switch to (`d.cards`, `d.custom`), one of which may be the `default` the list opens in. Throws when
-   * display or column names collide or `default` names none.
+   * The list: its table's `columns`, fields or columns of related records (`c.related`), `sort` and `search`, the
+   * columns that are `editable` in their cell, and other `displays` to switch to (`d.cards`, `d.map`, `d.board`, `d.custom`), one of which
+   * may be the `default` the list opens in. Throws when display or column names collide, `default` names none or an
+   * editable field is not among the columns. See
+   * [Editing in the list](website/src/content/docs/reference/ui-config.mdx#editing-in-the-list).
    */
   list(build: (r: FieldRefs<FieldsOf<R>>, d: typeof displays, c: typeof columns) => {
     columns: Array<Ref | ListColumn>;
     sort?: Array<[Ref, 'asc' | 'desc']>;
     search?: Ref[];
+    editable?: Ref[];
     displays?: ListDisplayModel[];
     default?: string;
   }): ViewBuilder<R>;
@@ -87,12 +91,12 @@ export declare class ViewBuilder<R extends {
    * Without it the page shows one section with every field.
    */
   layout(build: (r: FieldRefs<FieldsOf<R>>) => LayoutItemModel[]): ViewBuilder<R>;
-  /** A chart of records per `granularity` over a date or timestamp `field` above the list, following its filters. */
-  chart(build: (r: FieldRefs<FieldsOf<R>>) => {
-    field: Ref;
-    range: ChartRange;
-    granularity: ChartGranularity;
-  }): ViewBuilder<R>;
+  /**
+   * A chart above the list, following its filters: records per `granularity` over a date or timestamp `field`, or
+   * records per value of `groupBy`, such as a status or a relation, as bars or a donut of the `limit` largest (default
+   * 10), counted or with `sum` or `average` that of a numeric field.
+   */
+  chart(build: (r: FieldRefs<FieldsOf<R>>) => ChartInput): ViewBuilder<R>;
   /**
    * How the record page opens to a user who may change the record: `edit`, the default, as its form; `read` as a read
    * view, its sections as tables of labels and values, with an Edit button to the form; `locked` as the form, locked

package/dist/view.js

@@ -2,8 +2,9 @@ import { createRefs, ref } from "./refs.js";
 import { isMenuHref } from "./menu-href.js";
 import { navRecentErrors } from "./nav-recent.js";
 import { actions } from "./view-actions.js";
+import { chartModel } from "./view-chart.js";
 import { columns, isListColumn } from "./view-columns.js";
-import { displayErrors, displayFields, displays } from "./view-displays.js";
+import { boardErrors, displayErrors, displayFields, displays } from "./view-displays.js";
 import { FieldView } from "./view-field.js";
 import { widgets } from "./view-widgets.js";
 //#region src/view.ts
@@ -73,21 +74,26 @@ var ViewBuilder = class ViewBuilder {
 		} });
 	}
 	/**
-	* The list: its table's `columns`, fields or columns of related records (`c.related`), `sort` and `search`, and other
-	* `displays` to switch to (`d.cards`, `d.custom`), one of which may be the `default` the list opens in. Throws when
-	* display or column names collide or `default` names none.
+	* The list: its table's `columns`, fields or columns of related records (`c.related`), `sort` and `search`, the
+	* columns that are `editable` in their cell, and other `displays` to switch to (`d.cards`, `d.map`, `d.board`, `d.custom`), one of which
+	* may be the `default` the list opens in. Throws when display or column names collide, `default` names none or an
+	* editable field is not among the columns. See
+	* [Editing in the list](website/src/content/docs/reference/ui-config.mdx#editing-in-the-list).
 	*/
 	list(build) {
-		const { columns: columns$1, sort, search, displays: shown = [], default: opens } = build(this.refs(), displays, columns);
+		const { columns: columns$1, sort, search, editable, displays: shown = [], default: opens } = build(this.refs(), displays, columns);
 		const related = columns$1.filter(isListColumn).map(({ kind: _, ...column }) => column);
 		const names = columns$1.map((column) => column.name);
 		const repeated = names.find((name, index) => names.indexOf(name) !== index);
 		if (repeated !== void 0) throw new Error(`View "${this.state.resource}": the list has two columns named "${repeated}"`);
+		const stray = editable?.find((ref) => !names.includes(ref.name));
+		if (stray) throw new Error(`View "${this.state.resource}": editable field "${stray.name}" is not among the list's columns`);
 		const list = {
 			columns: names,
 			...related.length > 0 && { relatedColumns: related },
 			...sort && { sort: sort.map(([ref, dir]) => [ref.name, dir]) },
 			...search && { search: search.map((ref) => ref.name) },
+			...editable && editable.length > 0 && { editable: editable.map((ref) => ref.name) },
 			...shown.length > 0 && { displays: shown },
 			...opens !== void 0 && { default: opens }
 		};
@@ -109,14 +115,13 @@ var ViewBuilder = class ViewBuilder {
 	layout(build) {
 		return this.next({ layout: build(this.refs()) });
 	}
-	/** A chart of records per `granularity` over a date or timestamp `field` above the list, following its filters. */
+	/**
+	* A chart above the list, following its filters: records per `granularity` over a date or timestamp `field`, or
+	* records per value of `groupBy`, such as a status or a relation, as bars or a donut of the `limit` largest (default
+	* 10), counted or with `sum` or `average` that of a numeric field.
+	*/
 	chart(build) {
-		const { field, range, granularity } = build(this.refs());
-		return this.next({ chart: {
-			field: field.name,
-			range,
-			granularity
-		} });
+		return this.next({ chart: chartModel(build(this.refs())) });
 	}
 	/**
 	* How the record page opens to a user who may change the record: `edit`, the default, as its form; `read` as a read
@@ -237,6 +242,8 @@ var ViewBuilder = class ViewBuilder {
 			if (display.kind === "cards" && display.image !== void 0 && resource.fields[display.image].type !== "file") throw new Error(`View "${this.state.resource}": display "${display.name}" shows "${display.image}" as its image, which is not a file field`);
 			const flag = display.kind === "cards" ? display.flags?.find((name) => resource.fields[name].type !== "boolean") : void 0;
 			if (flag !== void 0) throw new Error(`View "${this.state.resource}": display "${display.name}" shows "${flag}" as a flag, which is not a boolean field`);
+			const board = display.kind === "board" ? boardErrors(display, resource) : [];
+			if (board.length > 0) throw new Error(`View "${this.state.resource}": display "${display.name}": ${board.join("; ")}`);
 		}
 		const clash = resource ? list?.relatedColumns?.find((column) => Object.hasOwn(resource.fields, column.name)) : void 0;
 		if (clash) throw new Error(`View "${this.state.resource}": related column "${clash.name}" has the name of a field of the resource`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@protobase/schema",
-  "version": "0.19.15",
+  "version": "0.20.0",
   "description": "Resource, field, view and access definitions for Protobase configs.",
   "license": "Apache-2.0",
   "repository": {