@formicoidea/labre-core 0.47.1 → 0.49.0

package/dist/_pkgs/data-view/core/group-by/group-properties.js

@@ -0,0 +1,38 @@
+import { sortByManually } from './trait.js';
+/**
+ * The group ops every grouped preset hands its `GroupTrait`, over the view's
+ * stored `groupProperties` (the shape table and kanban have always stored:
+ * `{ key, hide, manuallyCardSort }`). One copy for table, kanban, gallery and
+ * list (ADR 0035 §8, B8), so a hidden group and a manual order read and write
+ * the same way in every view.
+ *
+ * Every write lists the entry of every group key it is given, so a hidden
+ * group keeps its `hide` and its card order through a reorder; nothing is
+ * written when the value would not change.
+ */
+export const groupPropertiesOps = (read, write) => {
+    const entries = () => new Map(read().map(v => [v.key, v]));
+    const entry = (map, key) => map.get(key) ?? { key, hide: false, manuallyCardSort: [] };
+    const groupHidden = (key) => read().find(v => v.key === key)?.hide === true;
+    return {
+        sortGroup: (keys) => sortByManually(keys, v => v, read().map(v => v.key)),
+        sortRow: (key, rows) => sortByManually(rows, v => v.rowId, read().find(v => v.key === key)?.manuallyCardSort ?? []),
+        changeGroupSort: (keys) => {
+            const map = entries();
+            write(keys.map(key => entry(map, key)));
+        },
+        changeRowSort: (groupKeys, groupKey, keys) => {
+            const map = entries();
+            write(groupKeys.map(key => key === groupKey
+                ? { ...entry(map, key), manuallyCardSort: keys }
+                : entry(map, key)));
+        },
+        groupHidden,
+        groupHideSet: (groupKeys, groupKey, hide) => {
+            if (groupHidden(groupKey) === hide)
+                return;
+            const map = entries();
+            write(groupKeys.map(key => key === groupKey ? { ...entry(map, key), hide } : entry(map, key)));
+        },
+    };
+};

package/dist/_pkgs/data-view/core/group-by/group-title.js

@@ -3,8 +3,12 @@ import { IS_MOBILE } from '../../../global/env/index.js';
 import { MoreHorizontalIcon, PlusIcon } from '@blocksuite/icons/lit';
 import { nothing } from 'lit';
 import { html } from 'lit/static-html.js';
+import { VALUES_PENDING_MARK, valuesReady } from '../data-source/hydration.js';
 import { renderUniLit } from '../utils/uni-component/uni-component.js';
 function GroupHeaderCount(group) {
+    if (!valuesReady(group.property.view.manager.dataSource)) {
+        return html ` <div class="group-header-count">${VALUES_PENDING_MARK}</div>`;
+    }
     const cards = group.rows;
     if (!cards.length) {
         return;

package/dist/_pkgs/data-view/core/group-by/group-visibility.d.ts

@@ -0,0 +1,40 @@
+import { type MenuConfig } from '../../../affine-components/context-menu/index.js';
+import { type BlockStdScope, ShadowlessElement } from '../../../std/index.js';
+import { nothing } from 'lit';
+import { type Wording } from '../utils/wording.js';
+import type { Group, GroupTrait } from './trait.js';
+/**
+ * The group chrome every grouped preset shares (ADR 0035 §8, B8, PRD
+ * REQ-DB-16): "Hide group" in a group's menu, the fold toggle of a group
+ * header, and the list of hidden groups drawn at the end of the view. Hiding
+ * is a view setting, shared by everyone; folding is personal
+ * (`collapsed-state.ts`).
+ */
+/** "Hide group", for a group's own menu. Absent where the view hides none. */
+export declare const hideGroupAction: (group: Group, wording: Wording) => MenuConfig;
+/**
+ * A group header's fold button. Folding is never a write, so a read-only
+ * view folds too.
+ */
+export declare const renderGroupToggle: (group: Group, wording: Wording) => import("lit-html").TemplateResult<1>;
+export declare const groupToggleStyles: import("lit").CSSResult;
+declare const DataViewHiddenGroups_base: typeof ShadowlessElement & import("../../../global/utils/types.js").Constructor<import("../../../global/lit/with-disposable.js").DisposableClass>;
+/**
+ * The hidden groups of a view, at its end, each with a button that shows it
+ * again (PRD REQ-DB-16). Nothing when the view hides no group. A read-only
+ * view lists them without the button.
+ */
+export declare class DataViewHiddenGroups extends DataViewHiddenGroups_base {
+    static styles: import("lit").CSSResult;
+    /** Absent outside an editor (a unit test): the wordings read English. */
+    accessor std: BlockStdScope;
+    accessor groupTrait: GroupTrait | undefined;
+    connectedCallback(): void;
+    render(): import("lit-html").TemplateResult<1> | typeof nothing;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'dv-hidden-groups': DataViewHiddenGroups;
+    }
+}
+export {};

package/dist/_pkgs/data-view/core/group-by/group-visibility.js

@@ -0,0 +1,291 @@
+var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
+    function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
+    var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
+    var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
+    var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
+    var _, done = false;
+    for (var i = decorators.length - 1; i >= 0; i--) {
+        var context = {};
+        for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
+        for (var p in contextIn.access) context.access[p] = contextIn.access[p];
+        context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
+        var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
+        if (kind === "accessor") {
+            if (result === void 0) continue;
+            if (result === null || typeof result !== "object") throw new TypeError("Object expected");
+            if (_ = accept(result.get)) descriptor.get = _;
+            if (_ = accept(result.set)) descriptor.set = _;
+            if (_ = accept(result.init)) initializers.unshift(_);
+        }
+        else if (_ = accept(result)) {
+            if (kind === "field") initializers.unshift(_);
+            else descriptor[key] = _;
+        }
+    }
+    if (target) Object.defineProperty(target, contextIn.name, descriptor);
+    done = true;
+};
+var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) {
+    var useValue = arguments.length > 2;
+    for (var i = 0; i < initializers.length; i++) {
+        value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
+    }
+    return useValue ? value : void 0;
+};
+import { menu } from '../../../affine-components/context-menu/index.js';
+import { SignalWatcher, WithDisposable } from '../../../global/lit/index.js';
+import { InvisibleIcon, ToggleDownIcon, ToggleRightIcon, ViewIcon, } from '@blocksuite/icons/lit';
+import { ShadowlessElement, stdContext } from '../../../std/index.js';
+import { consume } from '@lit/context';
+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 { DATA_VIEW_GROUP_COLLAPSE, DATA_VIEW_GROUP_EXPAND, DATA_VIEW_GROUP_HIDE, DATA_VIEW_GROUP_SHOW, DATA_VIEW_HIDDEN_GROUPS, } from '../../translations.js';
+import { VALUES_PENDING_MARK, valuesReady } from '../data-source/hydration.js';
+import { renderUniLit } from '../utils/uni-component/uni-component.js';
+import { wordingOf } from '../utils/wording.js';
+/**
+ * The group chrome every grouped preset shares (ADR 0035 §8, B8, PRD
+ * REQ-DB-16): "Hide group" in a group's menu, the fold toggle of a group
+ * header, and the list of hidden groups drawn at the end of the view. Hiding
+ * is a view setting, shared by everyone; folding is personal
+ * (`collapsed-state.ts`).
+ */
+/** "Hide group", for a group's own menu. Absent where the view hides none. */
+export const hideGroupAction = (group, wording) => menu.action({
+    name: wording(DATA_VIEW_GROUP_HIDE),
+    prefix: InvisibleIcon(),
+    hide: () => !group.manager.groupsCanHide,
+    select: () => {
+        group.manager.groupHideSet(group.key, true);
+    },
+});
+const groupCount = (group) => valuesReady(group.property.view.manager.dataSource)
+    ? group.rows.length
+    : VALUES_PENDING_MARK;
+/**
+ * A group header's fold button. Folding is never a write, so a read-only
+ * view folds too.
+ */
+export const renderGroupToggle = (group, wording) => {
+    const collapsed = group.manager.collapsed$(group.key).value;
+    const label = wording(collapsed ? DATA_VIEW_GROUP_EXPAND : DATA_VIEW_GROUP_COLLAPSE);
+    return html `<button
+    class="dv-group-toggle"
+    data-testid="dv-group-toggle"
+    aria-expanded="${collapsed ? 'false' : 'true'}"
+    aria-label="${label}"
+    title="${label}"
+    @click="${(event) => {
+        event.stopPropagation();
+        group.manager.collapsedSet(group.key, !collapsed);
+    }}"
+  >
+    ${collapsed ? ToggleRightIcon() : ToggleDownIcon()}
+  </button>`;
+};
+export const groupToggleStyles = css `
+  .dv-group-toggle {
+    display: flex;
+    flex-shrink: 0;
+    align-items: center;
+    justify-content: center;
+    width: 24px;
+    height: 24px;
+    padding: 0;
+    border: none;
+    border-radius: 4px;
+    background: transparent;
+    color: var(--affine-icon-color);
+    cursor: pointer;
+  }
+
+  .dv-group-toggle svg {
+    width: 16px;
+    height: 16px;
+  }
+
+  .dv-group-toggle:focus-visible {
+    outline: 2px solid var(--affine-primary-color);
+    outline-offset: 1px;
+  }
+
+  @media (hover: hover) {
+    .dv-group-toggle:hover {
+      background-color: var(--affine-hover-color);
+    }
+  }
+
+  @media (pointer: coarse) {
+    .dv-group-toggle {
+      width: 44px;
+      height: 44px;
+    }
+  }
+`;
+/**
+ * The hidden groups of a view, at its end, each with a button that shows it
+ * again (PRD REQ-DB-16). Nothing when the view hides no group. A read-only
+ * view lists them without the button.
+ */
+let DataViewHiddenGroups = (() => {
+    let _classSuper = SignalWatcher(WithDisposable(ShadowlessElement));
+    let _std_decorators;
+    let _std_initializers = [];
+    let _std_extraInitializers = [];
+    let _groupTrait_decorators;
+    let _groupTrait_initializers = [];
+    let _groupTrait_extraInitializers = [];
+    return class DataViewHiddenGroups extends _classSuper {
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _std_decorators = [consume({ context: stdContext })];
+            _groupTrait_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, _groupTrait_decorators, { kind: "accessor", name: "groupTrait", static: false, private: false, access: { has: obj => "groupTrait" in obj, get: obj => obj.groupTrait, set: (obj, value) => { obj.groupTrait = value; } }, metadata: _metadata }, _groupTrait_initializers, _groupTrait_extraInitializers);
+            if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        }
+        static { this.styles = css `
+    dv-hidden-groups {
+      display: block;
+    }
+
+    .dv-hidden-groups {
+      display: flex;
+      flex-direction: column;
+      gap: 2px;
+      padding: 8px 0;
+    }
+
+    .dv-hidden-groups-title {
+      display: flex;
+      align-items: center;
+      gap: 8px;
+      padding: 0 4px 4px;
+      font-size: 12px;
+      line-height: 20px;
+      color: var(--affine-text-secondary-color);
+    }
+
+    .dv-hidden-group {
+      display: flex;
+      align-items: center;
+      gap: 8px;
+      min-height: 32px;
+      padding: 0 4px;
+      border-radius: 4px;
+    }
+
+    .dv-hidden-group-title {
+      flex: 1 1 auto;
+      min-width: 0;
+      overflow: hidden;
+      opacity: 0.7;
+    }
+
+    .dv-hidden-group-count {
+      flex-shrink: 0;
+      font-size: 12px;
+      color: var(--affine-text-secondary-color);
+    }
+
+    .dv-hidden-group-show {
+      display: flex;
+      flex-shrink: 0;
+      align-items: center;
+      justify-content: center;
+      width: 28px;
+      height: 28px;
+      padding: 0;
+      border: 1px solid ${unsafeCSS(cssVarV2.layer.insideBorder.border)};
+      border-radius: 4px;
+      background: transparent;
+      color: var(--affine-icon-color);
+      cursor: pointer;
+    }
+
+    .dv-hidden-group-show svg {
+      width: 16px;
+      height: 16px;
+    }
+
+    .dv-hidden-group-show:focus-visible {
+      outline: 2px solid var(--affine-primary-color);
+      outline-offset: 1px;
+    }
+
+    @media (hover: hover) {
+      .dv-hidden-group-show:hover {
+        background-color: var(--affine-hover-color);
+      }
+    }
+
+    @media (pointer: coarse) {
+      .dv-hidden-group {
+        min-height: 44px;
+      }
+
+      .dv-hidden-group-show {
+        width: 44px;
+        height: 44px;
+      }
+    }
+  `; }
+        #std_accessor_storage = __runInitializers(this, _std_initializers, void 0);
+        /** Absent outside an editor (a unit test): the wordings read English. */
+        get std() { return this.#std_accessor_storage; }
+        set std(value) { this.#std_accessor_storage = value; }
+        #groupTrait_accessor_storage = (__runInitializers(this, _std_extraInitializers), __runInitializers(this, _groupTrait_initializers, undefined));
+        get groupTrait() { return this.#groupTrait_accessor_storage; }
+        set groupTrait(value) { this.#groupTrait_accessor_storage = value; }
+        connectedCallback() {
+            super.connectedCallback();
+            this.dataset.testid = 'dv-hidden-groups';
+        }
+        render() {
+            const trait = this.groupTrait;
+            const groups = trait?.hiddenGroups$.value ?? [];
+            if (!trait || !groups.length)
+                return nothing;
+            const wording = wordingOf(this.std);
+            const readonly = trait.view.readonly$.value;
+            const show = wording(DATA_VIEW_GROUP_SHOW);
+            return html `<div class="dv-hidden-groups">
+      <div class="dv-hidden-groups-title">
+        <span>${wording(DATA_VIEW_HIDDEN_GROUPS)}</span>
+        <span>${groups.length}</span>
+      </div>
+      ${repeat(groups, group => group.key, group => {
+                const props = { group, readonly: true };
+                return html `<div
+            class="dv-hidden-group"
+            data-testid="dv-hidden-group"
+            data-group-key="${group.key}"
+          >
+            <div class="dv-hidden-group-title">
+              ${renderUniLit(group.view, props)}
+            </div>
+            <span class="dv-hidden-group-count">${groupCount(group)}</span>
+            ${readonly
+                    ? nothing
+                    : html `<button
+                  class="dv-hidden-group-show"
+                  data-testid="dv-group-show"
+                  aria-label="${show}"
+                  title="${show}"
+                  @click="${() => trait.groupHideSet(group.key, false)}"
+                >
+                  ${ViewIcon()}
+                </button>`}
+          </div>`;
+            })}
+    </div>`;
+        }
+        constructor() {
+            super(...arguments);
+            __runInitializers(this, _groupTrait_extraInitializers);
+        }
+    };
+})();
+export { DataViewHiddenGroups };

package/dist/_pkgs/data-view/core/group-by/setting.d.ts

@@ -1,11 +1,19 @@
 import { type MenuOptions, type PopupTarget } from '../../../affine-components/context-menu/index.js';
 import { ShadowlessElement } from '../../../std/index.js';
-import type { GroupTrait } from './trait.js';
+import { type Wording } from '../utils/wording.js';
+import type { Group, GroupTrait } from './trait.js';
 declare const GroupSetting_base: typeof ShadowlessElement & import("../../../global/utils/types.js").Constructor<import("../../../global/lit/with-disposable.js").DisposableClass>;
 export declare class GroupSetting extends GroupSetting_base {
     static styles: import("lit").CSSResult;
     accessor groupTrait: GroupTrait;
-    groups$: import("@preact/signals-core").ReadonlySignal<import("./trait.js").Group<unknown, unknown, Record<string, unknown>>[] | undefined>;
+    /** Resolved by the menu's opener: a popup renders outside the host. */
+    accessor wording: Wording;
+    /**
+     * The eye of a group (B8): hide it from the view for everyone, or show it
+     * again. A hidden group keeps its row here, in its place in the order.
+     */
+    private renderVisibility;
+    groups$: import("@preact/signals-core").ReadonlySignal<Group<unknown, unknown, Record<string, unknown>>[] | undefined>;
     sortContext: import("../utils/wc-dnd/sort/sort-context.js").SortContext;
     connectedCallback(): void;
     protected render(): unknown;
@@ -21,5 +29,5 @@ export declare const popSelectGroupByProperty: (target: PopupTarget, group: Grou
     onClose?: () => void;
     onBack?: () => void;
 }) => void;
-export declare const popGroupSetting: (target: PopupTarget, group: GroupTrait, onBack: () => void) => void;
+export declare const popGroupSetting: (target: PopupTarget, group: GroupTrait, onBack: () => void, wording?: Wording) => void;
 export {};

package/dist/_pkgs/data-view/core/group-by/setting.js

@@ -34,16 +34,17 @@ var __runInitializers = (this && this.__runInitializers) || function (thisArg, i
 };
 import { menu, popMenu, } from '../../../affine-components/context-menu/index.js';
 import { SignalWatcher, WithDisposable } from '../../../global/lit/index.js';
-import { DeleteIcon } from '@blocksuite/icons/lit';
+import { DeleteIcon, InvisibleIcon, ViewIcon } from '@blocksuite/icons/lit';
 import { ShadowlessElement } from '../../../std/index.js';
 import { computed } from '@preact/signals-core';
-import { css, html, unsafeCSS } from 'lit';
+import { css, html, nothing, unsafeCSS } from 'lit';
 import { property, query } from 'lit/decorators.js';
 import { repeat } from 'lit/directives/repeat.js';
+import { DATA_VIEW_GROUP_HIDE, DATA_VIEW_GROUP_SHOW, } from '../../translations.js';
 import { KanbanSingleView } from '../../view-presets/kanban/kanban-view-manager.js';
-import { TableSingleView } from '../../view-presets/table/table-view-manager.js';
 import { dataViewCssVariable } from '../common/css-variable.js';
 import { renderUniLit } from '../utils/uni-component/uni-component.js';
+import { englishWording } from '../utils/wording.js';
 import { dragHandler } from '../utils/wc-dnd/dnd-context.js';
 import { defaultActivators } from '../utils/wc-dnd/sensors/index.js';
 import { createSortContext, sortable, } from '../utils/wc-dnd/sort/sort-context.js';
@@ -54,6 +55,9 @@ let GroupSetting = (() => {
     let _groupTrait_decorators;
     let _groupTrait_initializers = [];
     let _groupTrait_extraInitializers = [];
+    let _wording_decorators;
+    let _wording_initializers = [];
+    let _wording_extraInitializers = [];
     let _groupContainer_decorators;
     let _groupContainer_initializers = [];
     let _groupContainer_extraInitializers = [];
@@ -61,8 +65,10 @@ let GroupSetting = (() => {
         static {
             const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
             _groupTrait_decorators = [property({ attribute: false })];
+            _wording_decorators = [property({ attribute: false })];
             _groupContainer_decorators = [query('.group-sort-setting')];
             __esDecorate(this, null, _groupTrait_decorators, { kind: "accessor", name: "groupTrait", static: false, private: false, access: { has: obj => "groupTrait" in obj, get: obj => obj.groupTrait, set: (obj, value) => { obj.groupTrait = value; } }, metadata: _metadata }, _groupTrait_initializers, _groupTrait_extraInitializers);
+            __esDecorate(this, null, _wording_decorators, { kind: "accessor", name: "wording", static: false, private: false, access: { has: obj => "wording" in obj, get: obj => obj.wording, set: (obj, value) => { obj.wording = value; } }, metadata: _metadata }, _wording_initializers, _wording_extraInitializers);
             __esDecorate(this, null, _groupContainer_decorators, { kind: "accessor", name: "groupContainer", static: false, private: false, access: { has: obj => "groupContainer" in obj, get: obj => obj.groupContainer, set: (obj, value) => { obj.groupContainer = value; } }, metadata: _metadata }, _groupContainer_initializers, _groupContainer_extraInitializers);
             if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
         }
@@ -96,10 +102,73 @@ let GroupSetting = (() => {
     .group-item:hover .group-item-drag-bar {
       background-color: #c0bfc1;
     }
+
+    .group-item-visibility {
+      display: flex;
+      flex-shrink: 0;
+      align-items: center;
+      justify-content: center;
+      width: 24px;
+      height: 24px;
+      margin-left: auto;
+      padding: 0;
+      border: none;
+      border-radius: 4px;
+      background: transparent;
+      color: var(--affine-icon-color);
+      cursor: pointer;
+    }
+
+    .group-item-visibility svg {
+      width: 16px;
+      height: 16px;
+    }
+
+    .group-item-visibility:hover {
+      background-color: var(--affine-hover-color);
+    }
+
+    @media (pointer: coarse) {
+      .group-item {
+        align-items: center;
+        min-height: 44px;
+      }
+
+      .group-item-visibility {
+        width: 44px;
+        height: 44px;
+      }
+    }
   `; }
         #groupTrait_accessor_storage;
         get groupTrait() { return this.#groupTrait_accessor_storage; }
         set groupTrait(value) { this.#groupTrait_accessor_storage = value; }
+        #wording_accessor_storage;
+        /** Resolved by the menu's opener: a popup renders outside the host. */
+        get wording() { return this.#wording_accessor_storage; }
+        set wording(value) { this.#wording_accessor_storage = value; }
+        /**
+         * The eye of a group (B8): hide it from the view for everyone, or show it
+         * again. A hidden group keeps its row here, in its place in the order.
+         */
+        renderVisibility(group) {
+            const trait = this.groupTrait;
+            if (!trait.groupsCanHide || trait.view.readonly$.value)
+                return nothing;
+            const hidden = trait.hiddenGroups$.value.includes(group);
+            const label = this.wording(hidden ? DATA_VIEW_GROUP_SHOW : DATA_VIEW_GROUP_HIDE);
+            return html `<button
+      class="group-item-visibility"
+      data-testid="dv-group-visibility"
+      aria-label="${label}"
+      title="${label}"
+      aria-pressed="${hidden ? 'true' : 'false'}"
+      @pointerdown="${(event) => event.stopPropagation()}"
+      @click="${() => trait.groupHideSet(group.key, !hidden)}"
+    >
+      ${hidden ? InvisibleIcon() : ViewIcon()}
+    </button>`;
+        }
         connectedCallback() {
             super.connectedCallback();
             this._disposables.addFromEvent(this, 'pointerdown', e => {
@@ -146,6 +215,7 @@ let GroupSetting = (() => {
                   style="position:absolute;left: 0;top: 0;right: 0;bottom: 0;"
                 ></div>
               </div>
+              ${this.renderVisibility(group)}
             </div>`;
             })}
       </div>
@@ -157,7 +227,8 @@ let GroupSetting = (() => {
         constructor() {
             super(...arguments);
             this.#groupTrait_accessor_storage = __runInitializers(this, _groupTrait_initializers, void 0);
-            this.groups$ = (__runInitializers(this, _groupTrait_extraInitializers), computed(() => {
+            this.#wording_accessor_storage = (__runInitializers(this, _groupTrait_extraInitializers), __runInitializers(this, _wording_initializers, englishWording));
+            this.groups$ = (__runInitializers(this, _wording_extraInitializers), computed(() => {
                 return this.groupTrait.groupsDataList$.value;
             }));
             this.sortContext = createSortContext({
@@ -323,7 +394,7 @@ export const popSelectGroupByProperty = (target, group, ops) => {
         options: selectGroupByProperty(group, ops),
     });
 };
-export const popGroupSetting = (target, group, onBack) => {
+export const popGroupSetting = (target, group, onBack, wording) => {
     const view = group.view;
     const groupProperty = group.property$.value;
     if (groupProperty == null) {
@@ -361,7 +432,7 @@ export const popGroupSetting = (target, group, onBack) => {
                             options: selectGroupByProperty(group, {
                                 onSelect: () => {
                                     menuHandler.close();
-                                    popGroupSetting(target, group, onBack);
+                                    popGroupSetting(target, group, onBack, wording);
                                 },
                             }),
                         }),
@@ -371,7 +442,7 @@ export const popGroupSetting = (target, group, onBack) => {
                     items: group.isDateGroup$.value
                         ? dateGroupSettingItems(group, () => {
                             menuHandler.close();
-                            popGroupSetting(target, group, onBack);
+                            popGroupSetting(target, group, onBack, wording);
                         })
                         : [],
                 }),
@@ -384,6 +455,7 @@ export const popGroupSetting = (target, group, onBack) => {
                             menu => html ` <data-view-group-setting
                     @mouseenter="${() => menu.closeSubMenu()}"
                     .groupTrait="${group}"
+                    .wording="${wording ?? englishWording}"
                     .columnId="${groupProperty.id}"
                   ></data-view-group-setting>`,
                         ],
@@ -394,7 +466,8 @@ export const popGroupSetting = (target, group, onBack) => {
                             name: 'Remove grouping',
                             prefix: DeleteIcon(),
                             class: { 'delete-item': true },
-                            hide: () => !(view instanceof TableSingleView),
+                            // Every layout but the kanban, which is a grouping (B8).
+                            hide: () => view instanceof KanbanSingleView,
                             select: () => {
                                 group.changeGroup(undefined);
                             },

package/dist/_pkgs/data-view/core/group-by/trait.d.ts

@@ -57,6 +57,25 @@ export declare class GroupTrait {
     } | undefined>;
     groupDataMap$: ReadonlySignal<Record<string, Group<unknown, unknown, Record<string, unknown>>> | undefined>;
     groupsDataList$: ReadonlySignal<Group<unknown, unknown, Record<string, unknown>>[] | undefined>;
+    /**
+     * The groups a view draws: every group but the ones its stored
+     * `groupProperties` hide (ADR 0035 §8, B8). `groupsDataList$` keeps them
+     * all, because a reorder or a card move writes an entry for every key and
+     * must not drop a hidden group's.
+     */
+    visibleGroups$: ReadonlySignal<Group<unknown, unknown, Record<string, unknown>>[] | undefined>;
+    /** The hidden groups, listed at the end of the view to be shown again. */
+    hiddenGroups$: ReadonlySignal<Group<unknown, unknown, Record<string, unknown>>[]>;
+    /** Whether the view stores hidden groups (every preset of 0.49 does). */
+    get groupsCanHide(): boolean;
+    /**
+     * Hide or show a group for everyone: a view setting, written to the view's
+     * `groupProperties` on the gesture, never when nothing changes.
+     */
+    groupHideSet(groupKey: string, hide: boolean): void;
+    /** Whether a group is folded: personal, on this device, never stored. */
+    collapsed$(groupKey: string): ReadonlySignal<boolean>;
+    collapsedSet(groupKey: string, collapsed: boolean): void;
     updateData: (data: NonNullable<unknown>) => void;
     get addGroup(): ((config: import("../index.js").WithCommonPropertyConfig<{
         text: string;
@@ -69,6 +88,9 @@ export declare class GroupTrait {
         sortRow: (groupKey: string, rows: Row[]) => Row[];
         changeGroupSort: (keys: string[]) => void;
         changeRowSort: (groupKeys: string[], groupKey: string, keys: string[]) => void;
+        /** Absent: the view hides no group (ops written before 0.49). */
+        groupHidden?: (groupKey: string) => boolean;
+        groupHideSet?: (groupKeys: string[], groupKey: string, hide: boolean) => void;
     });
     /**
      * Whether the current grouping reads a date property, and so offers grains