@formicoidea/labre-core 0.47.1 → 0.49.0

package/dist/_pkgs/data-view/view-presets/kanban/pc/group.js

@@ -35,13 +35,16 @@ var __runInitializers = (this && this.__runInitializers) || function (thisArg, i
 import { menu, popFilterableSimpleMenu, popupTargetFromElement, } from '../../../../affine-components/context-menu/index.js';
 import { SignalWatcher, WithDisposable } from '../../../../global/lit/index.js';
 import { AddCursorIcon } from '@blocksuite/icons/lit';
-import { ShadowlessElement } from '../../../../std/index.js';
+import { ShadowlessElement, stdContext } from '../../../../std/index.js';
+import { consume } from '@lit/context';
 import { css, nothing } from 'lit';
 import { property } from 'lit/decorators.js';
 import { repeat } from 'lit/directives/repeat.js';
 import { html } from 'lit/static-html.js';
 import { GroupTitle } from '../../../core/group-by/group-title.js';
+import { groupToggleStyles, hideGroupAction, renderGroupToggle, } from '../../../core/group-by/group-visibility.js';
 import { dragHandler } from '../../../core/utils/wc-dnd/dnd-context.js';
+import { wordingOf } from '../../../core/utils/wording.js';
 const styles = css `
   affine-data-view-kanban-group {
     width: 260px;
@@ -114,9 +117,38 @@ const styles = css `
   .sortable-drag {
     background-color: var(--affine-background-primary-color);
   }
+
+  .group-body[hidden] {
+    display: none;
+  }
+
+  @media (pointer: coarse) {
+    .group-header {
+      height: auto;
+      min-height: 44px;
+    }
+  }
+
+  .group-header-main {
+    flex: 1 1 auto;
+    min-width: 0;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 8px;
+    overflow: hidden;
+  }
+
+  .dv-kanban-hidden-groups {
+    width: 260px;
+    flex-shrink: 0;
+  }
 `;
 let KanbanGroup = (() => {
     let _classSuper = SignalWatcher(WithDisposable(ShadowlessElement));
+    let _std_decorators;
+    let _std_initializers = [];
+    let _std_extraInitializers = [];
     let _group_decorators;
     let _group_initializers = [];
     let _group_extraInitializers = [];
@@ -126,24 +158,35 @@ let KanbanGroup = (() => {
     return class KanbanGroup extends _classSuper {
         static {
             const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _std_decorators = [consume({ context: stdContext })];
             _group_decorators = [property({ attribute: false })];
             _kanbanViewLogic_decorators = [property({ attribute: false })];
+            __esDecorate(this, null, _std_decorators, { kind: "accessor", name: "std", static: false, private: false, access: { has: obj => "std" in obj, get: obj => obj.std, set: (obj, value) => { obj.std = value; } }, metadata: _metadata }, _std_initializers, _std_extraInitializers);
             __esDecorate(this, null, _group_decorators, { kind: "accessor", name: "group", static: false, private: false, access: { has: obj => "group" in obj, get: obj => obj.group, set: (obj, value) => { obj.group = value; } }, metadata: _metadata }, _group_initializers, _group_extraInitializers);
             __esDecorate(this, null, _kanbanViewLogic_decorators, { kind: "accessor", name: "kanbanViewLogic", static: false, private: false, access: { has: obj => "kanbanViewLogic" in obj, get: obj => obj.kanbanViewLogic, set: (obj, value) => { obj.kanbanViewLogic = value; } }, metadata: _metadata }, _kanbanViewLogic_initializers, _kanbanViewLogic_extraInitializers);
             if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
         }
-        static { this.styles = styles; }
+        static { this.styles = [styles, groupToggleStyles]; }
+        #std_accessor_storage;
+        /** Absent outside an editor host: the wordings read English. */
+        get std() { return this.#std_accessor_storage; }
+        set std(value) { this.#std_accessor_storage = value; }
         render() {
             const cards = this.group.rows;
+            // Folded (personal, B8): the header and its count stay, the cards go.
+            const collapsed = this.group.manager.collapsed$(this.group.key).value;
             return html `
       <div class="group-header" ${dragHandler(this.group.key)}>
-        ${GroupTitle(this.group, {
+        ${renderGroupToggle(this.group, wordingOf(this.std))}
+        <div class="group-header-main">
+          ${GroupTitle(this.group, {
                 readonly: this.view.readonly$.value,
                 clickAdd: this.clickAddCardInStart,
                 clickOps: this.clickGroupOptions,
             })}
+        </div>
       </div>
-      <div class="group-body">
+      <div class="group-body" ?hidden="${collapsed}">
         ${repeat(cards, row => row.rowId, row => {
                 return html `
               <affine-data-view-kanban-card
@@ -178,7 +221,8 @@ let KanbanGroup = (() => {
         }
         constructor() {
             super(...arguments);
-            this.clickAddCard = () => {
+            this.#std_accessor_storage = __runInitializers(this, _std_initializers, void 0);
+            this.clickAddCard = (__runInitializers(this, _std_extraInitializers), () => {
                 const id = this.view.addCard('end', this.group.key);
                 requestAnimationFrame(() => {
                     const columnId = this.view.mainProperties$.value.titleColumn ||
@@ -194,7 +238,7 @@ let KanbanGroup = (() => {
                     };
                 });
                 this.requestUpdate();
-            };
+            });
             this.clickAddCardInStart = () => {
                 const id = this.view.addCard('start', this.group.key);
                 requestAnimationFrame(() => {
@@ -225,6 +269,7 @@ let KanbanGroup = (() => {
                             this.requestUpdate();
                         },
                     }),
+                    hideGroupAction(this.group, wordingOf(this.std)),
                     menu.action({
                         name: 'Delete Cards',
                         select: () => {

package/dist/_pkgs/data-view/view-presets/kanban/pc/kanban-view-ui-logic.js

@@ -29,7 +29,7 @@ export class KanbanViewUILogic extends DataViewUILogicBase {
         });
         this.groups$ = computed(() => {
             const groupTrait = this.groupTrait$.value;
-            return groupTrait?.groupsDataList$.value || [];
+            return groupTrait?.visibleGroups$.value || [];
         });
         this.clearSelection = () => {
             this.selectionController.clear();
@@ -204,6 +204,10 @@ export class KanbanViewUI extends DataViewUIBase {
       >
         ${this.renderGroups()}
         ${groupTrait ? this.logic.renderAddGroup(groupTrait) : ''}
+        <dv-hidden-groups
+          class="dv-kanban-hidden-groups"
+          .groupTrait="${groupTrait}"
+        ></dv-hidden-groups>
       </div>
     `;
     }

package/dist/_pkgs/data-view/view-presets/list/define.d.ts

@@ -0,0 +1,14 @@
+import { FlatSingleView, type FlatViewDataType } from '../flat/flat-view-manager.js';
+export declare const listViewType: {
+    type: "list";
+    createModel: <Data extends import("../../index.js").DataViewDataType>(model: import("../../index.js").DataViewModelConfig<Data>) => import("../../index.js").DataViewModel<"list", Data> & {
+        createMeta: (renderer: import("../../index.js").DataViewRendererConfig) => import("../../index.js").ViewMeta<"list", Data>;
+    };
+};
+export type ListViewData = FlatViewDataType<typeof listViewType.type>;
+export declare class ListSingleView extends FlatSingleView<ListViewData> {
+    get type(): string;
+}
+export declare const listViewModel: import("../../index.js").DataViewModel<"list", ListViewData> & {
+    createMeta: (renderer: import("../../index.js").DataViewRendererConfig) => import("../../index.js").ViewMeta<"list", ListViewData>;
+};

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

@@ -0,0 +1,15 @@
+import { viewType } from '../../core/view/data-view.js';
+import { VIEW_NAME_LIST } from '../../translations.js';
+import { FlatSingleView, flatViewDefaultData, } from '../flat/flat-view-manager.js';
+export const listViewType = viewType('list');
+export class ListSingleView extends FlatSingleView {
+    get type() {
+        return this.data$.value?.mode ?? listViewType.type;
+    }
+}
+export const listViewModel = listViewType.createModel({
+    defaultName: VIEW_NAME_LIST[1],
+    defaultNameKey: VIEW_NAME_LIST[0],
+    dataViewManager: ListSingleView,
+    defaultData: flatViewDefaultData,
+});

package/dist/_pkgs/data-view/view-presets/list/effect.d.ts

@@ -0,0 +1 @@
+export declare function listEffects(): void;

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

@@ -0,0 +1,4 @@
+import { ListViewUI } from './list-view.js';
+export function listEffects() {
+    customElements.define('dv-list-view-ui', ListViewUI);
+}

package/dist/_pkgs/data-view/view-presets/list/index.d.ts

@@ -0,0 +1,2 @@
+export * from './define.js';
+export * from './renderer.js';

package/dist/_pkgs/data-view/view-presets/list/index.js

@@ -0,0 +1,2 @@
+export * from './define.js';
+export * from './renderer.js';

package/dist/_pkgs/data-view/view-presets/list/list-view.d.ts

@@ -0,0 +1,24 @@
+import { FlatViewUI, FlatViewUILogic } from '../flat/flat-view-ui.js';
+import type { ListSingleView } from './define.js';
+/**
+ * The list preset (ADR 0035 §1, B7): one line per row, the title on the left
+ * and the visible properties on the right, each drawn by the cell a table
+ * draws, so a select is the table's tag and opens the table's tag menu. An
+ * empty value draws no chip, as in Notion's list: it is set from the opened
+ * row. Narrow screens wrap the chips under the title.
+ */
+export declare class ListViewUILogic extends FlatViewUILogic<ListSingleView> {
+    renderer: import("../../../affine-shared/types/uni-component.js").UniComponent<unknown, {}>;
+}
+export declare class ListViewUI extends FlatViewUI<ListViewUILogic> {
+    static styles: import("lit").CSSResult[];
+    connectedCallback(): void;
+    private renderRow;
+    private renderNewRow;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'dv-list-view-ui': ListViewUI;
+    }
+}

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

@@ -0,0 +1,194 @@
+import { PlusIcon } from '@blocksuite/icons/lit';
+import { cssVarV2 } from '@toeverything/theme/v2';
+import { css, html, nothing, unsafeCSS } from 'lit';
+import { repeat } from 'lit/directives/repeat.js';
+import { groupToggleStyles } from '../../core/group-by/group-visibility.js';
+import { createUniComponentFromWebComponent } from '../../core/utils/uni-component/uni-component.js';
+import { DATA_VIEW_NEW_PAGE } from '../../translations.js';
+import { flatGroupStyles, flatOpenButtonStyles, FlatViewUI, FlatViewUILogic, } from '../flat/flat-view-ui.js';
+/**
+ * The list preset (ADR 0035 §1, B7): one line per row, the title on the left
+ * and the visible properties on the right, each drawn by the cell a table
+ * draws, so a select is the table's tag and opens the table's tag menu. An
+ * empty value draws no chip, as in Notion's list: it is set from the opened
+ * row. Narrow screens wrap the chips under the title.
+ */
+export class ListViewUILogic extends FlatViewUILogic {
+    constructor() {
+        super(...arguments);
+        this.renderer = createUniComponentFromWebComponent(ListViewUI);
+    }
+}
+export class ListViewUI extends FlatViewUI {
+    static { this.styles = [
+        flatOpenButtonStyles,
+        flatGroupStyles,
+        groupToggleStyles,
+        css `
+      dv-list-view-ui {
+        display: block;
+      }
+
+      .dv-list {
+        display: flex;
+        flex-direction: column;
+        padding: 4px 0 8px;
+      }
+
+      .dv-list-row {
+        position: relative;
+        display: flex;
+        align-items: center;
+        gap: 8px;
+        min-height: 36px;
+        padding: 2px 40px 2px 8px;
+        box-sizing: border-box;
+        border-bottom: 1px solid
+          ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
+        cursor: pointer;
+      }
+
+      .dv-list-row-title {
+        flex: 1 1 auto;
+        min-width: 0;
+        overflow: hidden;
+        font-size: var(--data-view-cell-text-size);
+        line-height: var(--data-view-cell-text-line-height);
+      }
+
+      .dv-list-row-properties {
+        display: flex;
+        flex: 0 1 auto;
+        align-items: center;
+        justify-content: flex-end;
+        gap: 8px;
+        min-width: 0;
+        max-width: 60%;
+        overflow: hidden;
+      }
+
+      .dv-list-row-property {
+        display: flex;
+        align-items: center;
+        flex: 0 1 auto;
+        min-width: 0;
+        max-width: 200px;
+        overflow: hidden;
+      }
+
+      .dv-list-row .dv-flat-open {
+        top: 50%;
+        transform: translateY(-50%);
+      }
+
+      .dv-list-row:focus-within .dv-flat-open {
+        visibility: visible;
+      }
+
+      .dv-list-new {
+        display: flex;
+        align-items: center;
+        gap: 4px;
+        min-height: 36px;
+        padding: 0 8px;
+        border: none;
+        background: transparent;
+        color: var(--affine-text-secondary-color);
+        font-family: inherit;
+        font-size: var(--data-view-cell-text-size);
+        text-align: start;
+        cursor: pointer;
+      }
+
+      .dv-list-new svg {
+        width: 16px;
+        height: 16px;
+      }
+
+      @media (hover: hover) {
+        .dv-list-row:hover,
+        .dv-list-new:hover {
+          background-color: var(--affine-hover-color);
+        }
+
+        .dv-list-row:hover .dv-flat-open {
+          visibility: visible;
+        }
+      }
+
+      @media (pointer: coarse) {
+        .dv-list-row,
+        .dv-list-new {
+          min-height: 44px;
+        }
+      }
+
+      @media (max-width: 640px) {
+        .dv-list-row {
+          flex-wrap: wrap;
+          padding-top: 6px;
+          padding-bottom: 6px;
+        }
+
+        .dv-list-row-title {
+          flex-basis: 100%;
+        }
+
+        .dv-list-row-properties {
+          flex-wrap: wrap;
+          justify-content: flex-start;
+          max-width: 100%;
+        }
+      }
+    `,
+    ]; }
+    connectedCallback() {
+        super.connectedCallback();
+        this.dataset.testid = 'dv-list-view';
+    }
+    renderRow(rowId) {
+        const view = this.view;
+        const title = view.titleProperty$.value;
+        // A value still loading keeps its chip, as a skeleton.
+        const chips = view.bodyProperties$.value.filter(property => {
+            const cell = property.cellGetOrCreate(rowId);
+            return cell.status$?.value === 'pending' || !cell.isEmpty$.value;
+        });
+        return html `<div
+      class="dv-list-row"
+      data-testid="dv-list-row"
+      data-row-id="${rowId}"
+      @click="${this.onRowClick}"
+    >
+      <div class="dv-list-row-title">
+        ${title ? this.renderCell(title, rowId, true) : nothing}
+      </div>
+      ${chips.length
+            ? html `<div class="dv-list-row-properties">
+            ${repeat(chips, property => property.id, property => html `<div class="dv-list-row-property">
+                  ${this.renderCell(property, rowId)}
+                </div>`)}
+          </div>`
+            : nothing}
+      ${this.renderOpenButton(rowId)}
+    </div>`;
+    }
+    renderNewRow(groupKey) {
+        if (this.view.readonly$.value)
+            return nothing;
+        return html `<button
+      class="dv-list-new"
+      data-testid="dv-flat-new"
+      @click="${() => this.logic.addRow('end', groupKey)}"
+    >
+      ${PlusIcon()}<span>${this.wording(DATA_VIEW_NEW_PAGE)}</span>
+    </button>`;
+    }
+    render() {
+        return html `${this.renderHeaderWidget()}
+    ${this.renderGrouped((rows, group) => html `<div class="dv-list">
+          ${repeat(rows, row => row.rowId, row => this.renderRow(row.rowId))}
+          ${this.renderNewRow(group?.key)}
+        </div>`)}`;
+    }
+}

package/dist/_pkgs/data-view/view-presets/list/renderer.d.ts

@@ -0,0 +1 @@
+export declare const listViewMeta: import("../../index.js").ViewMeta<"list", import("./define.js").ListViewData>;

package/dist/_pkgs/data-view/view-presets/list/renderer.js

@@ -0,0 +1,11 @@
+import { createIcon } from '../../core/utils/uni-icon.js';
+import { listViewModel } from './define.js';
+import { ListViewUILogic } from './list-view.js';
+// One UI for both: the chips wrap under the title on a narrow screen.
+export const listViewMeta = listViewModel.createMeta({
+    icon: createIcon('DatabaseListViewIcon'),
+    pcLogic: () => ListViewUILogic,
+    // Named, not left to the pc fallback: a touch screen draws this UI on
+    // purpose (B5, `mobile-editing.unit.spec.ts`).
+    mobileLogic: () => ListViewUILogic,
+});

package/dist/_pkgs/data-view/view-presets/table/collapsed-state.d.ts

@@ -1,18 +1,7 @@
 /**
- * Shared utility for managing table group collapsed state in sessionStorage.
- * Used by both PC and mobile table group implementations.
- */
-/**
- * Gets the collapsed state for a specific table group from sessionStorage.
- * @param viewId - The ID of the table view
- * @param groupKey - The key of the group
- * @returns The collapsed state as a boolean, or false if not found or invalid
+ * The table's two entry points into the shared, per-device group fold
+ * (`core/group-by/collapsed-state.ts`, ADR 0035 B8), kept so the pc and
+ * mobile table groups read and write it as before.
  */
 export declare function getCollapsedState(viewId: string, groupKey: string): boolean;
-/**
- * Sets the collapsed state for a specific table group in sessionStorage.
- * @param viewId - The ID of the table view
- * @param groupKey - The key of the group
- * @param collapsed - The collapsed state to store
- */
 export declare function setCollapsedState(viewId: string, groupKey: string, collapsed: boolean): void;

package/dist/_pkgs/data-view/view-presets/table/collapsed-state.js

@@ -1,36 +1,12 @@
+import { groupCollapsed$, groupCollapsedSet, } from '../../core/group-by/collapsed-state.js';
 /**
- * Shared utility for managing table group collapsed state in sessionStorage.
- * Used by both PC and mobile table group implementations.
- */
-/**
- * Gets the collapsed state for a specific table group from sessionStorage.
- * @param viewId - The ID of the table view
- * @param groupKey - The key of the group
- * @returns The collapsed state as a boolean, or false if not found or invalid
+ * The table's two entry points into the shared, per-device group fold
+ * (`core/group-by/collapsed-state.ts`, ADR 0035 B8), kept so the pc and
+ * mobile table groups read and write it as before.
  */
 export function getCollapsedState(viewId, groupKey) {
-    try {
-        const value = sessionStorage.getItem(`affine:table-group:${viewId}:${groupKey}:collapsed`);
-        if (!value)
-            return false;
-        const parsed = JSON.parse(value);
-        return typeof parsed === 'boolean' ? parsed : false;
-    }
-    catch {
-        return false;
-    }
+    return groupCollapsed$(viewId, groupKey).peek();
 }
-/**
- * Sets the collapsed state for a specific table group in sessionStorage.
- * @param viewId - The ID of the table view
- * @param groupKey - The key of the group
- * @param collapsed - The collapsed state to store
- */
 export function setCollapsedState(viewId, groupKey, collapsed) {
-    try {
-        sessionStorage.setItem(`affine:table-group:${viewId}:${groupKey}:collapsed`, JSON.stringify(collapsed));
-    }
-    catch {
-        // ignore
-    }
+    groupCollapsedSet(viewId, groupKey, collapsed);
 }

package/dist/_pkgs/data-view/view-presets/table/consts.d.ts

@@ -4,6 +4,8 @@ export declare const DEFAULT_COLUMN_WIDTH = 180;
 export declare const DEFAULT_COLUMN_MIN_WIDTH = 100;
 /** column title height */
 export declare const DEFAULT_COLUMN_TITLE_HEIGHT = 34;
+/** A finger's minimum target on the mobile renderers (B5, ADR 0035 §1). */
+export declare const MOBILE_TOUCH_TARGET = 44;
 /** column title height */
 export declare const DEFAULT_ADD_BUTTON_WIDTH = 40;
 export declare const LEFT_TOOL_BAR_WIDTH = 24;

package/dist/_pkgs/data-view/view-presets/table/consts.js

@@ -4,6 +4,8 @@ export const DEFAULT_COLUMN_WIDTH = 180;
 export const DEFAULT_COLUMN_MIN_WIDTH = 100;
 /** column title height */
 export const DEFAULT_COLUMN_TITLE_HEIGHT = 34;
+/** A finger's minimum target on the mobile renderers (B5, ADR 0035 §1). */
+export const MOBILE_TOUCH_TARGET = 44;
 /** column title height */
 export const DEFAULT_ADD_BUTTON_WIDTH = 40;
 export const LEFT_TOOL_BAR_WIDTH = 24;

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

@@ -1,8 +1,10 @@
 import { viewType } from '../../core/view/data-view.js';
+import { VIEW_NAME_TABLE } from '../../translations.js';
 import { TableSingleView } from './table-view-manager.js';
 export const tableViewType = viewType('table');
 export const tableViewModel = tableViewType.createModel({
-    defaultName: 'Table View',
+    defaultName: VIEW_NAME_TABLE[1],
+    defaultNameKey: VIEW_NAME_TABLE[0],
     dataViewManager: TableSingleView,
     defaultData: viewManager => {
         return {

package/dist/_pkgs/data-view/view-presets/table/mobile/cell.js

@@ -37,7 +37,7 @@ import { ShadowlessElement } from '../../../../std/index.js';
 import { computed, effect, signal } from '@preact/signals-core';
 import { css } from 'lit';
 import { property } from 'lit/decorators.js';
-import { renderUniLit, } from '../../../core/index.js';
+import { renderCellStatus, renderUniLit, } from '../../../core/index.js';
 import { TableViewAreaSelection } from '../selection.js';
 let MobileTableCell = (() => {
     let _classSuper = SignalWatcher(WithDisposable(ShadowlessElement));
@@ -136,6 +136,9 @@ let MobileTableCell = (() => {
                 return;
             }
             const { view } = renderer;
+            const status = renderCellStatus(this.cell$.value);
+            if (status)
+                return status;
             this.view.lockRows(this.isEditing$.value);
             this.dataset['editing'] = `${this.isEditing$.value}`;
             const props = {

package/dist/_pkgs/data-view/view-presets/table/mobile/column-header.js

@@ -43,7 +43,7 @@ import { styleMap } from 'lit/directives/style-map.js';
 import { html } from 'lit/static-html.js';
 import { inputConfig, typeConfig } from '../../../core/common/property-menu.js';
 import { numberFormats } from '../../../property-presets/number/utils/formats.js';
-import { DEFAULT_COLUMN_TITLE_HEIGHT } from '../consts.js';
+import { MOBILE_TOUCH_TARGET } from '../consts.js';
 let MobileTableColumnHeader = (() => {
     let _classSuper = SignalWatcher(WithDisposable(ShadowlessElement));
     let _column_decorators;
@@ -249,7 +249,7 @@ let MobileTableColumnHeader = (() => {
         render() {
             const column = this.column;
             const style = styleMap({
-                height: DEFAULT_COLUMN_TITLE_HEIGHT + 'px',
+                height: MOBILE_TOUCH_TARGET + 'px',
             });
             return html `
       <div

package/dist/_pkgs/data-view/view-presets/table/mobile/group.d.ts

@@ -1,10 +1,12 @@
-import { ShadowlessElement } from '../../../../std/index.js';
+import { type BlockStdScope, ShadowlessElement } from '../../../../std/index.js';
 import type { Group } from '../../../core/group-by/trait.js';
 import type { Row } from '../../../core/index.js';
 import type { MobileTableViewUILogic } from './table-view-ui-logic.js';
 declare const MobileTableGroup_base: typeof ShadowlessElement & import("../../../../global/utils/types.js").Constructor<import("../../../../global/lit/with-disposable.js").DisposableClass>;
 export declare class MobileTableGroup extends MobileTableGroup_base {
     static styles: import("lit").CSSResult;
+    /** Absent outside an editor host: the wordings read English. */
+    accessor std: BlockStdScope;
     collapsed$: import("@preact/signals-core").Signal<boolean>;
     private storageLoaded;
     /**

package/dist/_pkgs/data-view/view-presets/table/mobile/group.js

@@ -35,13 +35,17 @@ var __runInitializers = (this && this.__runInitializers) || function (thisArg, i
 import { menu, popFilterableSimpleMenu, popupTargetFromElement, } from '../../../../affine-components/context-menu/index.js';
 import { SignalWatcher, WithDisposable } from '../../../../global/lit/index.js';
 import { PlusIcon, ToggleDownIcon, ToggleRightIcon, } from '@blocksuite/icons/lit';
-import { ShadowlessElement } from '../../../../std/index.js';
+import { ShadowlessElement, stdContext } from '../../../../std/index.js';
+import { consume } from '@lit/context';
 import { signal } from '@preact/signals-core';
 import { cssVarV2 } from '@toeverything/theme/v2';
 import { css, html, nothing, unsafeCSS } from 'lit';
 import { property } from 'lit/decorators.js';
 import { repeat } from 'lit/directives/repeat.js';
 import { GroupTitle } from '../../../core/group-by/group-title.js';
+import { hideGroupAction } from '../../../core/group-by/group-visibility.js';
+import { wordingOf } from '../../../core/utils/wording.js';
+import { DATA_VIEW_GROUP_COLLAPSE, DATA_VIEW_GROUP_EXPAND, } from '../../../translations.js';
 import { getCollapsedState, setCollapsedState } from '../collapsed-state.js';
 import { LEFT_TOOL_BAR_WIDTH } from '../consts.js';
 const styles = css `
@@ -94,6 +98,9 @@ const styles = css `
 `;
 let MobileTableGroup = (() => {
     let _classSuper = SignalWatcher(WithDisposable(ShadowlessElement));
+    let _std_decorators;
+    let _std_initializers = [];
+    let _std_extraInitializers = [];
     let _group_decorators;
     let _group_initializers = [];
     let _group_extraInitializers = [];
@@ -103,13 +110,19 @@ let MobileTableGroup = (() => {
     return class MobileTableGroup extends _classSuper {
         static {
             const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _std_decorators = [consume({ context: stdContext })];
             _group_decorators = [property({ attribute: false })];
             _tableViewLogic_decorators = [property({ attribute: false })];
+            __esDecorate(this, null, _std_decorators, { kind: "accessor", name: "std", static: false, private: false, access: { has: obj => "std" in obj, get: obj => obj.std, set: (obj, value) => { obj.std = value; } }, metadata: _metadata }, _std_initializers, _std_extraInitializers);
             __esDecorate(this, null, _group_decorators, { kind: "accessor", name: "group", static: false, private: false, access: { has: obj => "group" in obj, get: obj => obj.group, set: (obj, value) => { obj.group = value; } }, metadata: _metadata }, _group_initializers, _group_extraInitializers);
             __esDecorate(this, null, _tableViewLogic_decorators, { kind: "accessor", name: "tableViewLogic", static: false, private: false, access: { has: obj => "tableViewLogic" in obj, get: obj => obj.tableViewLogic, set: (obj, value) => { obj.tableViewLogic = value; } }, metadata: _metadata }, _tableViewLogic_initializers, _tableViewLogic_extraInitializers);
             if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
         }
         static { this.styles = styles; }
+        #std_accessor_storage;
+        /** Absent outside an editor host: the wordings read English. */
+        get std() { return this.#std_accessor_storage; }
+        set std(value) { this.#std_accessor_storage = value; }
         /**
          * Read the stored collapsed state once, as soon as the group and its view
          * are both known. Reading it earlier would key the lookup on a missing view
@@ -190,7 +203,8 @@ let MobileTableGroup = (() => {
         }
         constructor() {
             super(...arguments);
-            this.collapsed$ = signal(false);
+            this.#std_accessor_storage = __runInitializers(this, _std_initializers, void 0);
+            this.collapsed$ = (__runInitializers(this, _std_extraInitializers), signal(false));
             this.storageLoaded = false;
             this._toggleCollapse = (e) => {
                 e?.stopPropagation();
@@ -225,6 +239,7 @@ let MobileTableGroup = (() => {
                             });
                         },
                     }),
+                    hideGroupAction(group, wordingOf(this.std)),
                     menu.action({
                         name: 'Delete Cards',
                         select: () => {
@@ -246,9 +261,9 @@ let MobileTableGroup = (() => {
           class="group-toggle-btn"
           role="button"
           aria-expanded=${this.collapsed$.value ? 'false' : 'true'}
-          aria-label=${this.collapsed$.value
-                    ? 'Expand group'
-                    : 'Collapse group'}
+          aria-label=${wordingOf(this.std)(this.collapsed$.value
+                    ? DATA_VIEW_GROUP_EXPAND
+                    : DATA_VIEW_GROUP_COLLAPSE)}
           tabindex="0"
           @click=${this._toggleCollapse}
           @keydown=${(e) => {