@formicoidea/labre-core 0.48.0 → 0.49.0

package/dist/_pkgs/data-view/translations.d.ts

@@ -0,0 +1,55 @@
+import type { ChromeWording } from '../affine-shared/services/index.js';
+/**
+ * The view engine's own wordings. Most of the data-view's chrome is still a
+ * deferred surface of the literal ratchet (`DEFERRED_DIRS` in
+ * `affine/all/src/__tests__/translations/literals.unit.spec.ts`); what is
+ * declared here is what was written after that decision, keyed from the start.
+ */
+/** Beside the view's name in its tab: the stored mode is drawn as a table. */
+export declare const VIEW_SHOWN_AS_TABLE: ChromeWording;
+/**
+ * The view menu's way out of such a view: a new table view, same name, the
+ * stored one left untouched.
+ */
+export declare const VIEW_DUPLICATE_AS_TABLE: ChromeWording;
+/**
+ * The "New page" card of a gallery and row of a list: adds a row, opens it.
+ * Their open button says the components' "Open" (`OPEN_LABEL`), one chrome
+ * word, one key.
+ */
+export declare const DATA_VIEW_NEW_PAGE: ChromeWording;
+export declare const VIEW_NAME_TABLE: ChromeWording;
+export declare const VIEW_NAME_KANBAN: ChromeWording;
+export declare const VIEW_NAME_CALENDAR: ChromeWording;
+export declare const VIEW_NAME_GALLERY: ChromeWording;
+export declare const VIEW_NAME_LIST: ChromeWording;
+export declare const TAG_SELECT_PLACEHOLDER: ChromeWording;
+export declare const TAG_SELECT_TIP: ChromeWording;
+export declare const TAG_SELECT_CREATE: ChromeWording;
+export declare const TAG_COLOR_TEAL: ChromeWording;
+/** The button standing for the views whose tabs do not fit; `count` of them. */
+export declare const VIEWS_BAR_MORE: ChromeWording;
+/** The "+" after the tabs, as its label and tooltip. */
+export declare const VIEWS_BAR_ADD_VIEW: ChromeWording;
+/** A tab's menu: the name field. */
+export declare const VIEWS_BAR_VIEW_NAME: ChromeWording;
+/** A tab's menu: opens the view's settings. */
+export declare const VIEWS_BAR_EDIT_VIEW: ChromeWording;
+export declare const VIEWS_BAR_MOVE_LEFT: ChromeWording;
+export declare const VIEWS_BAR_MOVE_RIGHT: ChromeWording;
+/** A group's menu entry: a view setting, shared by everyone (PRD REQ-DB-16). */
+export declare const DATA_VIEW_GROUP_HIDE: ChromeWording;
+/** A hidden group's button, in the list at the end of the view. */
+export declare const DATA_VIEW_GROUP_SHOW: ChromeWording;
+/** The heading of the hidden groups, listed at the end of the view. */
+export declare const DATA_VIEW_HIDDEN_GROUPS: ChromeWording;
+/** A group's fold toggle: personal, kept on this device only. */
+export declare const DATA_VIEW_GROUP_COLLAPSE: ChromeWording;
+export declare const DATA_VIEW_GROUP_EXPAND: ChromeWording;
+/** The view setting naming where a row's page opens (`openIn`). */
+export declare const DATA_VIEW_OPEN_IN: ChromeWording;
+export declare const DATA_VIEW_OPEN_IN_SIDE: ChromeWording;
+export declare const DATA_VIEW_OPEN_IN_CENTER: ChromeWording;
+export declare const DATA_VIEW_OPEN_IN_FULL: ChromeWording;
+/** Walked by `PACKAGE_WORDINGS` in `packages/affine/all/src/translations.ts`. */
+export declare const DATA_VIEW_WORDINGS: readonly ChromeWording[];

package/dist/_pkgs/data-view/translations.js

@@ -0,0 +1,181 @@
+/**
+ * The view engine's own wordings. Most of the data-view's chrome is still a
+ * deferred surface of the literal ratchet (`DEFERRED_DIRS` in
+ * `affine/all/src/__tests__/translations/literals.unit.spec.ts`); what is
+ * declared here is what was written after that decision, keyed from the start.
+ */
+/* ── A view whose mode has no preset here (ADR 0035 §6) ───────────────── */
+/** Beside the view's name in its tab: the stored mode is drawn as a table. */
+export const VIEW_SHOWN_AS_TABLE = [
+    'com.labre.data-view.view.shown-as-table',
+    'Shown as a table',
+];
+/**
+ * The view menu's way out of such a view: a new table view, same name, the
+ * stored one left untouched.
+ */
+export const VIEW_DUPLICATE_AS_TABLE = [
+    'com.labre.data-view.view.duplicate-as-table',
+    'Duplicate as table',
+];
+/* ── The gallery and list presets (ADR 0035 §1, B6 and B7) ───────────── */
+/**
+ * The "New page" card of a gallery and row of a list: adds a row, opens it.
+ * Their open button says the components' "Open" (`OPEN_LABEL`), one chrome
+ * word, one key.
+ */
+export const DATA_VIEW_NEW_PAGE = [
+    'com.labre.data-view.new-page',
+    'New page',
+];
+/* ── A view's name when it is created ─────────────────────────────────── */
+/*
+ * The name a new view is given. Each preset's `defaultName` is the English
+ * fallback and its `defaultNameKey` the key; the creation site writes the
+ * name resolved at the gesture (`viewDefaultName`), so a document keeps the
+ * words its author saw and a stored name is never re-translated. A model
+ * default never changes to translate a seed (ADR 0023).
+ */
+export const VIEW_NAME_TABLE = [
+    'com.labre.data-view.view.default-name.table',
+    'Table View',
+];
+export const VIEW_NAME_KANBAN = [
+    'com.labre.data-view.view.default-name.kanban',
+    'Kanban View',
+];
+export const VIEW_NAME_CALENDAR = [
+    'com.labre.data-view.view.default-name.calendar',
+    'Calendar View',
+];
+export const VIEW_NAME_GALLERY = [
+    'com.labre.data-view.view.default-name.gallery',
+    'Gallery View',
+];
+export const VIEW_NAME_LIST = [
+    'com.labre.data-view.view.default-name.list',
+    'List View',
+];
+/* ── The tag menu (select and multi-select cells, the chips band) ─────── */
+export const TAG_SELECT_PLACEHOLDER = [
+    'com.labre.data-view.tag.placeholder',
+    'Type here...',
+];
+export const TAG_SELECT_TIP = [
+    'com.labre.data-view.tag.tip',
+    'Select tag or create one',
+];
+export const TAG_SELECT_CREATE = [
+    'com.labre.data-view.tag.create',
+    'Create',
+];
+/*
+ * The colours an option can take, as the option menu lists them: the
+ * palette's own names (`PALETTE_NAME_*`, one word, one key), and teal, which
+ * the canvas palette does not have.
+ */
+export const TAG_COLOR_TEAL = [
+    'com.labre.data-view.tag.color.teal',
+    'Teal',
+];
+/* ── The views bar (ADR 0035 B11, labre PRD REQ-DB-7) ─────────────────── */
+/** The button standing for the views whose tabs do not fit; `count` of them. */
+export const VIEWS_BAR_MORE = [
+    'com.labre.data-view.views-bar.more',
+    '{{count}} more',
+];
+/** The "+" after the tabs, as its label and tooltip. */
+export const VIEWS_BAR_ADD_VIEW = [
+    'com.labre.data-view.views-bar.add-view',
+    'New view',
+];
+/** A tab's menu: the name field. */
+export const VIEWS_BAR_VIEW_NAME = [
+    'com.labre.data-view.views-bar.view-name',
+    'View name',
+];
+/** A tab's menu: opens the view's settings. */
+export const VIEWS_BAR_EDIT_VIEW = [
+    'com.labre.data-view.views-bar.edit-view',
+    'Edit view',
+];
+export const VIEWS_BAR_MOVE_LEFT = [
+    'com.labre.data-view.views-bar.move-left',
+    'Move left',
+];
+export const VIEWS_BAR_MOVE_RIGHT = [
+    'com.labre.data-view.views-bar.move-right',
+    'Move right',
+];
+/* ── Grouping and row opening, per view (ADR 0035 §8, B8) ───────────── */
+/** A group's menu entry: a view setting, shared by everyone (PRD REQ-DB-16). */
+export const DATA_VIEW_GROUP_HIDE = [
+    'com.labre.data-view.group.hide',
+    'Hide group',
+];
+/** A hidden group's button, in the list at the end of the view. */
+export const DATA_VIEW_GROUP_SHOW = [
+    'com.labre.data-view.group.show',
+    'Show group',
+];
+/** The heading of the hidden groups, listed at the end of the view. */
+export const DATA_VIEW_HIDDEN_GROUPS = [
+    'com.labre.data-view.group.hidden',
+    'Hidden groups',
+];
+/** A group's fold toggle: personal, kept on this device only. */
+export const DATA_VIEW_GROUP_COLLAPSE = [
+    'com.labre.data-view.group.collapse',
+    'Collapse group',
+];
+export const DATA_VIEW_GROUP_EXPAND = [
+    'com.labre.data-view.group.expand',
+    'Expand group',
+];
+/** The view setting naming where a row's page opens (`openIn`). */
+export const DATA_VIEW_OPEN_IN = [
+    'com.labre.data-view.open-in',
+    'Open pages in',
+];
+export const DATA_VIEW_OPEN_IN_SIDE = [
+    'com.labre.data-view.open-in.side',
+    'Side peek',
+];
+export const DATA_VIEW_OPEN_IN_CENTER = [
+    'com.labre.data-view.open-in.center',
+    'Center peek',
+];
+export const DATA_VIEW_OPEN_IN_FULL = [
+    'com.labre.data-view.open-in.full',
+    'Full page',
+];
+/** Walked by `PACKAGE_WORDINGS` in `packages/affine/all/src/translations.ts`. */
+export const DATA_VIEW_WORDINGS = [
+    VIEW_SHOWN_AS_TABLE,
+    VIEW_DUPLICATE_AS_TABLE,
+    DATA_VIEW_NEW_PAGE,
+    VIEW_NAME_TABLE,
+    VIEW_NAME_KANBAN,
+    VIEW_NAME_CALENDAR,
+    VIEW_NAME_GALLERY,
+    VIEW_NAME_LIST,
+    TAG_SELECT_PLACEHOLDER,
+    TAG_SELECT_TIP,
+    TAG_SELECT_CREATE,
+    TAG_COLOR_TEAL,
+    VIEWS_BAR_MORE,
+    VIEWS_BAR_ADD_VIEW,
+    VIEWS_BAR_VIEW_NAME,
+    VIEWS_BAR_EDIT_VIEW,
+    VIEWS_BAR_MOVE_LEFT,
+    VIEWS_BAR_MOVE_RIGHT,
+    DATA_VIEW_GROUP_HIDE,
+    DATA_VIEW_GROUP_SHOW,
+    DATA_VIEW_HIDDEN_GROUPS,
+    DATA_VIEW_GROUP_COLLAPSE,
+    DATA_VIEW_GROUP_EXPAND,
+    DATA_VIEW_OPEN_IN,
+    DATA_VIEW_OPEN_IN_SIDE,
+    DATA_VIEW_OPEN_IN_CENTER,
+    DATA_VIEW_OPEN_IN_FULL,
+];

package/dist/_pkgs/data-view/view-presets/calendar/define.js

@@ -1,8 +1,10 @@
 import { viewType } from '../../core/view/data-view.js';
+import { VIEW_NAME_CALENDAR } from '../../translations.js';
 import { CalendarSingleView } from './calendar-view-manager.js';
 export const calendarViewType = viewType('calendar');
 export const calendarViewModel = calendarViewType.createModel({
-    defaultName: 'Calendar View',
+    defaultName: VIEW_NAME_CALENDAR[1],
+    defaultNameKey: VIEW_NAME_CALENDAR[0],
     dataViewManager: CalendarSingleView,
     defaultData: viewManager => {
         return {

package/dist/_pkgs/data-view/view-presets/convert.js

@@ -1,5 +1,6 @@
 import { createViewConvert } from '../core/view/convert.js';
 import { calendarViewModel } from './calendar/index.js';
+import { flatViewConverts } from './flat/flat-converts.js';
 import { kanbanViewModel } from './kanban/index.js';
 import { tableViewModel } from './table/index.js';
 const headerToCalendarCard = (header) => ({
@@ -45,4 +46,5 @@ export const viewConverts = [
         sort: data.sort,
         header: calendarCardToHeader(data.card),
     })),
+    ...flatViewConverts,
 ];

package/dist/_pkgs/data-view/view-presets/effect.js

@@ -1,8 +1,12 @@
 import { calendarEffects } from './calendar/effect.js';
+import { galleryEffects } from './gallery/effect.js';
 import { kanbanEffects } from './kanban/effect.js';
+import { listEffects } from './list/effect.js';
 import { tableEffects } from './table/effect.js';
 export function viewPresetsEffects() {
     calendarEffects();
+    galleryEffects();
     kanbanEffects();
+    listEffects();
     tableEffects();
 }

package/dist/_pkgs/data-view/view-presets/flat/flat-converts.d.ts

@@ -0,0 +1,2 @@
+import type { ViewConvertConfig } from '../../core/view/convert.js';
+export declare const flatViewConverts: ViewConvertConfig[];

package/dist/_pkgs/data-view/view-presets/flat/flat-converts.js

@@ -0,0 +1,35 @@
+import { calendarViewModel } from '../calendar/define.js';
+import { galleryViewModel } from '../gallery/define.js';
+import { kanbanViewModel } from '../kanban/define.js';
+import { listViewModel } from '../list/define.js';
+import { tableViewModel } from '../table/define.js';
+/**
+ * A layout switch into or out of a gallery or a list keeps the filter, the
+ * sort and the grouping (B8: every layout groups, as table and kanban already
+ * kept `groupBy` between them); the properties shown are the target layout's
+ * own default, as when Notion switches a view's layout. A source with no
+ * grouping leaves the target's default: a kanban still gets its own. Calendar
+ * is a source only: nothing converts into it (ADR 0035 §6).
+ */
+const keepFilterSortAndGroup = (data) => {
+    const { filter, sort, groupBy } = data;
+    // View data is an open record per mode: the target model types the rest.
+    return {
+        ...(filter ? { filter } : {}),
+        ...(sort ? { sort } : {}),
+        ...(groupBy ? { groupBy } : {}),
+    };
+};
+const flatModels = [galleryViewModel, listViewModel];
+const convert = (from, to) => ({
+    from,
+    to,
+    convert: keepFilterSortAndGroup,
+});
+export const flatViewConverts = [
+    ...[tableViewModel, kanbanViewModel, calendarViewModel, ...flatModels]
+        .flatMap(from => flatModels.map(to => [from.type, to.type]))
+        .filter(([from, to]) => from !== to)
+        .map(([from, to]) => convert(from, to)),
+    ...flatModels.flatMap(from => [tableViewModel, kanbanViewModel].map(to => convert(from.type, to.type))),
+];

package/dist/_pkgs/data-view/view-presets/flat/flat-view-manager.d.ts

@@ -0,0 +1,79 @@
+import { type InsertToPosition } from '../../../affine-shared/utils/index.js';
+import type { GroupBy, GroupProperty } from '../../core/common/types.js';
+import { FilterTrait } from '../../core/filter/trait.js';
+import type { FilterGroup } from '../../core/filter/types.js';
+import { GroupTrait } from '../../core/group-by/trait.js';
+import type { Sort } from '../../core/sort/types.js';
+import type { BasicViewDataType } from '../../core/view/data-view.js';
+import { PropertyBase } from '../../core/view-manager/property.js';
+import type { Row } from '../../core/view-manager/row.js';
+import { SingleViewBase } from '../../core/view-manager/single-view.js';
+import type { ViewManager } from '../../core/view-manager/view-manager.js';
+/**
+ * A property's place in a gallery or list view: the shape table and kanban
+ * already store, `columns[].hide` (ADR 0035 §8), so per-view visibility reads
+ * and writes the same way in every preset.
+ */
+export type FlatViewColumn = {
+    id: string;
+    hide?: boolean;
+};
+export type FlatViewDataType<Mode extends string = string> = BasicViewDataType<Mode, {
+    columns: FlatViewColumn[];
+    filter: FilterGroup;
+    sort?: Sort;
+    groupBy?: GroupBy;
+    groupProperties?: GroupProperty[];
+}>;
+/**
+ * What a new gallery or list view stores: its title shown, every other
+ * property hidden until the user shows it, as Notion does for these two
+ * layouts. Written once, by the gesture that creates the view; a stored view
+ * is never rewritten on load.
+ */
+export declare const flatViewDefaultData: (viewManager: ViewManager) => {
+    columns: FlatViewColumn[];
+    filter: FilterGroup;
+};
+/**
+ * The manager both ungrouped presets share, gallery and list (ADR 0035 §1,
+ * B6 and B7): the table's per-view property order and visibility, filter and
+ * sort, and its row creation from the filter's default values, without the
+ * table's widths and statistics. Grouping (B8) is the table's too: the same
+ * stored `groupBy` and `groupProperties`, the same trait and ops.
+ */
+export declare abstract class FlatSingleView<ViewData extends FlatViewDataType = FlatViewDataType> extends SingleViewBase<ViewData> {
+    propertiesRaw$: import("@preact/signals-core").ReadonlySignal<FlatProperty[]>;
+    properties$: import("@preact/signals-core").ReadonlySignal<FlatProperty[]>;
+    detailProperties$: import("@preact/signals-core").ReadonlySignal<FlatProperty[]>;
+    /** The title, drawn first on a card or a row whatever the columns say. */
+    titleProperty$: import("@preact/signals-core").ReadonlySignal<FlatProperty | undefined>;
+    /** The visible properties drawn after the title. */
+    bodyProperties$: import("@preact/signals-core").ReadonlySignal<FlatProperty[]>;
+    mainProperties$: import("@preact/signals-core").ReadonlySignal<{
+        titleColumn: string | undefined;
+        iconColumn: string;
+    }>;
+    readonly$: import("@preact/signals-core").ReadonlySignal<boolean>;
+    private readonly filter$;
+    private readonly sortList$;
+    filterTrait: FilterTrait;
+    private readonly sortManager;
+    private readonly groupBy$;
+    groupTrait: GroupTrait;
+    /** Every property's column entry, so a first hide stores the full order. */
+    readonly columnsData$: import("@preact/signals-core").ReadonlySignal<FlatViewColumn[]>;
+    isShow(rowId: string): boolean;
+    propertyGetOrCreate(propertyId: string): FlatProperty;
+    /** A row added from a group's "New page" takes that group's value. */
+    rowAdd(insertPosition: InsertToPosition | number, groupKey?: string): string;
+    protected rowsMapping(rows: Row[]): Row[];
+}
+export declare class FlatProperty extends PropertyBase {
+    private readonly flatView;
+    hide$: import("@preact/signals-core").ReadonlySignal<boolean>;
+    viewData$: import("@preact/signals-core").ReadonlySignal<FlatViewColumn | undefined>;
+    constructor(flatView: FlatSingleView, propertyId: string);
+    hideSet(hide: boolean): void;
+    move(position: InsertToPosition): void;
+}

package/dist/_pkgs/data-view/view-presets/flat/flat-view-manager.js

@@ -0,0 +1,194 @@
+import { insertPositionToIndex, } from '../../../affine-shared/utils/index.js';
+import { computed } from '@preact/signals-core';
+import { evalFilter } from '../../core/filter/eval.js';
+import { generateDefaultValues } from '../../core/filter/generate-default-values.js';
+import { FilterTrait, filterTraitKey } from '../../core/filter/trait.js';
+import { emptyFilterGroup } from '../../core/filter/utils.js';
+import { groupPropertiesOps } from '../../core/group-by/group-properties.js';
+import { GroupTrait, groupTraitKey } from '../../core/group-by/trait.js';
+import { fromJson } from '../../core/property/utils.js';
+import { SortManager, sortTraitKey } from '../../core/sort/manager.js';
+import { PropertyBase } from '../../core/view-manager/property.js';
+import { SingleViewBase } from '../../core/view-manager/single-view.js';
+/**
+ * What a new gallery or list view stores: its title shown, every other
+ * property hidden until the user shows it, as Notion does for these two
+ * layouts. Written once, by the gesture that creates the view; a stored view
+ * is never rewritten on load.
+ */
+export const flatViewDefaultData = (viewManager) => {
+    const dataSource = viewManager.dataSource;
+    return {
+        columns: dataSource.properties$.value.map(id => ({
+            id,
+            hide: dataSource.propertyTypeGet(id) !== 'title',
+        })),
+        filter: { type: 'group', op: 'and', conditions: [] },
+    };
+};
+/**
+ * The manager both ungrouped presets share, gallery and list (ADR 0035 §1,
+ * B6 and B7): the table's per-view property order and visibility, filter and
+ * sort, and its row creation from the filter's default values, without the
+ * table's widths and statistics. Grouping (B8) is the table's too: the same
+ * stored `groupBy` and `groupProperties`, the same trait and ops.
+ */
+export class FlatSingleView extends SingleViewBase {
+    constructor() {
+        super(...arguments);
+        this.propertiesRaw$ = computed(() => {
+            const needShow = new Set(this.dataSource.properties$.value);
+            const result = [];
+            this.data$.value?.columns.forEach(v => {
+                if (needShow.has(v.id)) {
+                    result.push(v.id);
+                    needShow.delete(v.id);
+                }
+            });
+            result.push(...needShow);
+            return result.map(id => this.propertyGetOrCreate(id));
+        });
+        this.properties$ = computed(() => {
+            return this.propertiesRaw$.value.filter(property => !property.hide$.value);
+        });
+        this.detailProperties$ = computed(() => {
+            return this.propertiesRaw$.value.filter(property => property.type$.value !== 'title');
+        });
+        /** The title, drawn first on a card or a row whatever the columns say. */
+        this.titleProperty$ = computed(() => {
+            return this.properties$.value.find(property => property.type$.value === 'title');
+        });
+        /** The visible properties drawn after the title. */
+        this.bodyProperties$ = computed(() => {
+            return this.properties$.value.filter(property => property.type$.value !== 'title');
+        });
+        this.mainProperties$ = computed(() => ({
+            titleColumn: this.propertiesRaw$.value.find(property => property.type$.value === 'title')?.id,
+            iconColumn: 'type',
+        }));
+        this.readonly$ = computed(() => {
+            return this.manager.readonly$.value;
+        });
+        this.filter$ = computed(() => {
+            return this.data$.value?.filter ?? emptyFilterGroup;
+        });
+        this.sortList$ = computed(() => {
+            return this.data$.value?.sort;
+        });
+        this.filterTrait = this.traitSet(filterTraitKey, new FilterTrait(this.filter$, this, {
+            filterSet: (filter) => {
+                this.dataUpdate(() => ({ filter }));
+            },
+        }));
+        this.sortManager = this.traitSet(sortTraitKey, new SortManager(this.sortList$, this, {
+            setSortList: sortList => {
+                this.dataUpdate(data => ({
+                    sort: {
+                        ...data.sort,
+                        ...sortList,
+                    },
+                }));
+            },
+        }));
+        this.groupBy$ = computed(() => {
+            return this.data$.value?.groupBy;
+        });
+        this.groupTrait = this.traitSet(groupTraitKey, new GroupTrait(this.groupBy$, this, {
+            groupBySet: groupBy => {
+                this.dataUpdate(() => ({ groupBy }));
+            },
+            ...groupPropertiesOps(() => this.data$.value?.groupProperties ?? [], groupProperties => {
+                this.dataUpdate(() => ({ groupProperties }));
+            }),
+        }));
+        /** Every property's column entry, so a first hide stores the full order. */
+        this.columnsData$ = computed(() => {
+            return this.propertiesRaw$.value.map(property => ({
+                id: property.id,
+                hide: property.hide$.value,
+            }));
+        });
+    }
+    isShow(rowId) {
+        const filter = this.filter$.value;
+        if (!filter.conditions.length)
+            return true;
+        // Hidden properties included, as in the table: hiding a property must not
+        // silently drop the condition on it.
+        const rowMap = Object.fromEntries(this.propertiesRaw$.value.map(property => [
+            property.id,
+            property.cellGetOrCreate(rowId).jsonValue$.value,
+        ]));
+        return evalFilter(filter, rowMap);
+    }
+    propertyGetOrCreate(propertyId) {
+        return new FlatProperty(this, propertyId);
+    }
+    /** A row added from a group's "New page" takes that group's value. */
+    rowAdd(insertPosition, groupKey) {
+        const id = super.rowAdd(insertPosition);
+        if (!id)
+            return id;
+        const filter = this.filter$.value;
+        const defaultValues = filter.conditions.length
+            ? generateDefaultValues(filter, this.vars$.value)
+            : {};
+        Object.entries(defaultValues).forEach(([propertyId, jsonValue]) => {
+            const property = this.propertyGetOrCreate(propertyId);
+            const propertyMeta = property.meta$.value;
+            if (!propertyMeta)
+                return;
+            const value = fromJson(propertyMeta.config, {
+                value: jsonValue,
+                data: property.data$.value,
+                dataSource: this.dataSource,
+            });
+            this.cellGetOrCreate(id, propertyId).valueSet(value);
+        });
+        // After the filter's defaults, as in the table: the group clicked wins.
+        if (groupKey != null)
+            this.groupTrait.addToGroup(id, groupKey);
+        return id;
+    }
+    rowsMapping(rows) {
+        return this.sortManager.sort(super.rowsMapping(rows));
+    }
+}
+export class FlatProperty extends PropertyBase {
+    constructor(flatView, propertyId) {
+        super(flatView, propertyId);
+        this.flatView = flatView;
+        this.hide$ = computed(() => {
+            const hideFromViewData = this.viewData$.value?.hide;
+            if (hideFromViewData != null) {
+                return hideFromViewData;
+            }
+            const defaultShow = this.meta$.value?.config.fixed?.defaultShow;
+            if (defaultShow != null) {
+                return !defaultShow;
+            }
+            return false;
+        });
+        this.viewData$ = computed(() => {
+            return this.flatView.data$.value?.columns.find(v => v.id === this.id);
+        });
+    }
+    hideSet(hide) {
+        this.flatView.dataUpdate(() => ({
+            columns: this.flatView.columnsData$.value.map(v => v.id === this.id ? { ...v, hide } : v),
+        }));
+    }
+    move(position) {
+        this.flatView.dataUpdate(() => {
+            const columns = [...this.flatView.columnsData$.value];
+            const index = columns.findIndex(v => v.id === this.id);
+            if (index < 0)
+                return {};
+            const [column] = columns.splice(index, 1);
+            if (!column)
+                return {};
+            columns.splice(insertPositionToIndex(position, columns), 0, column);
+            return { columns };
+        });
+    }
+}

package/dist/_pkgs/data-view/view-presets/flat/flat-view-ui.d.ts

@@ -0,0 +1,56 @@
+import type { ChromeWording } from '../../../affine-shared/services/index.js';
+import type { UniComponent } from '../../../affine-shared/types/index.js';
+import type { InsertToPosition } from '../../../affine-shared/utils/index.js';
+import type { BlockStdScope } from '../../../std/index.js';
+import { nothing } from 'lit';
+import type { Group } from '../../core/group-by/trait.js';
+import { DataViewUIBase, DataViewUILogicBase } from '../../core/view/data-view-base.js';
+import type { Property } from '../../core/view-manager/property.js';
+import type { Row } from '../../core/view-manager/row.js';
+import type { FlatSingleView } from './flat-view-manager.js';
+/**
+ * The UI logic both ungrouped presets share. Neither has a selection model of
+ * its own: a cell edits through the cell host (`dv-standalone-cell`), with the
+ * very renderer and popups a table cell mounts, and a click anywhere else on
+ * a card or a row opens the row through the root's detail panel, the path
+ * the table's and the kanban's open buttons take. Grouped (B8), each group
+ * draws under the table's group header; drag and drop of rows between groups
+ * is not offered: a row changes group by editing its value.
+ */
+export declare abstract class FlatViewUILogic<View extends FlatSingleView = FlatSingleView> extends DataViewUILogicBase<View> {
+    clearSelection: () => void;
+    focusFirstCell: () => void;
+    showIndicator: (_evt: MouseEvent) => boolean;
+    hideIndicator: () => void;
+    moveTo: (_id: string, _evt: MouseEvent) => void;
+    addRow: (position: InsertToPosition, groupKey?: string) => string | undefined;
+    abstract renderer: UniComponent<unknown>;
+    /** A Ctrl/Cmd click asks the host for a new tab (ADR 0035 §9a). */
+    openRow: (rowId: string, newTab?: boolean) => void;
+}
+export declare abstract class FlatViewUI<Logic extends FlatViewUILogic = FlatViewUILogic> extends DataViewUIBase<Logic> {
+    /** Absent outside an editor (a unit test): the wordings read English. */
+    accessor std: BlockStdScope;
+    protected wording([key, fallback]: ChromeWording): string;
+    protected get view(): FlatSingleView<import("./flat-view-manager.js").FlatViewDataType<string>>;
+    /**
+     * One property's value, drawn and edited by the cell renderer a table cell
+     * mounts. `readonly` draws the value only and lets a click through to the
+     * card or row, which is how the title opens its row.
+     */
+    protected renderCell(property: Property, rowId: string, readonly?: boolean): import("lit-html").TemplateResult<1>;
+    protected renderOpenButton(rowId: string): import("lit-html").TemplateResult<1>;
+    protected renderHeaderWidget(): import("lit-html").TemplateResult | typeof nothing;
+    /**
+     * The view's rows through `renderBody`: once, or once per visible group
+     * under its header, then the hidden groups (B8, PRD REQ-DB-13 and 16). A
+     * folded group keeps its header only.
+     */
+    protected renderGrouped(renderBody: (rows: Row[], group?: Group) => unknown): unknown;
+    private renderGroup;
+    protected readonly onRowClick: (event: MouseEvent) => void;
+}
+/** The group header both presets draw, the table's title and count. */
+export declare const flatGroupStyles: import("lit").CSSResult;
+/** The open button both presets draw, shown on hover or keyboard focus. */
+export declare const flatOpenButtonStyles: import("lit").CSSResult;