@formicoidea/labre-core 0.47.1 → 0.49.0

package/dist/_pkgs/affine-fragment-doc-title/title-band/title-band.js

@@ -32,21 +32,21 @@ var __runInitializers = (this && this.__runInitializers) || function (thisArg, i
     }
     return useValue ? value : void 0;
 };
-import { menu, popMenu, popupTargetFromElement, } from '../../affine-components/context-menu/index.js';
-import { DatePicker } from '../../affine-components/date-picker/index.js';
 import { RefNodeSlotsProvider } from '../../affine-inline-reference/index.js';
-import { DOC_UNTITLED, formatLocale, PropertiesPanelProvider, TitleBandProvider, translateKey, } from '../../affine-shared/services/index.js';
+import { DOC_UNTITLED, FeatureFlagService, formatLocale, PropertiesPanelProvider, TitleBandProvider, translateKey, } from '../../affine-shared/services/index.js';
 import { stopPropagation } from '../../affine-shared/utils/index.js';
+import { createStandaloneCell, StandaloneCellMetaProvider, } from '../../data-view/index.js';
 import { SignalWatcher, WithDisposable } from '../../global/lit/index.js';
 import { ShadowlessElement } from '../../std/index.js';
-import { CheckBoxCheckSolidIcon, CheckBoxUnIcon, LinkedPageIcon, PlusIcon, SidebarIcon, ToggleDownIcon, ToggleRightIcon, } from '@blocksuite/icons/lit';
+import { LinkedPageIcon, PlusIcon, SidebarIcon, ToggleDownIcon, ToggleRightIcon, } from '@blocksuite/icons/lit';
 import { computed, signal } from '@preact/signals-core';
 import { css, html, nothing } from 'lit';
 import { property } from 'lit/decorators.js';
 import { repeat } from 'lit/directives/repeat.js';
-import { styleMap } from 'lit/directives/style-map.js';
-import { TITLE_BAND_ADD, TITLE_BAND_CLEAR, TITLE_BAND_COLLAPSE, TITLE_BAND_EMPTY, TITLE_BAND_EXPAND, TITLE_BAND_LABEL, TITLE_BAND_LOADING, TITLE_BAND_NOT_SHOWN, TITLE_BAND_OPEN_PANEL, } from '../translations.js';
-import { chipEditorKind, chipOptions, chipValueView, parseChipNumber, } from './format.js';
+import { TITLE_BAND_ADD, TITLE_BAND_COLLAPSE, TITLE_BAND_EMPTY, TITLE_BAND_EXPAND, TITLE_BAND_LABEL, TITLE_BAND_LOADING, TITLE_BAND_NOT_SHOWN, TITLE_BAND_OPEN_PANEL, TITLE_BAND_SHOW_HERE, } from '../translations.js';
+import { bandCellData, bandCellMeta, bandCellValue, bandOptionsWritable, bandWriteValue, isBandReadonlyType, sameBandValue, } from './band-cell.js';
+import { formatPropertyValue, isPropertyValueEmpty } from './format.js';
+import { showPageHere } from './show-here.js';
 export const LABRE_TITLE_BAND = 'labre-title-band';
 const NO_PAGES = [];
 /**
@@ -61,12 +61,19 @@ const NO_PAGES = [];
  *
  * Fed by `TitleBandProvider` alone (§9d): no provider, nothing at all. The
  * chips are the sheet's visible properties in the host's order, an empty one
- * included (REQ-PR-1); a click opens the editor of the property's data-view
- * type and hands the value back through `set`, showing the chip as pending
- * until the host settles it. The band never writes to the document and never
- * applies a value. The "+" is drawn when the host passes `add`; the panel
- * button when a `PropertiesPanelProvider` is registered; the "Not shown in
- * this document" row only on the canvas (the page view's row is the host's).
+ * included (REQ-PR-1). Each value is drawn and edited by the cell the inline
+ * table mounts for its data-view type (`<dv-standalone-cell>`, ADR 0035
+ * §11 amended 2026-10-13): the checkbox, the tag menu of a select, the date
+ * picker, the number, text and link inputs, with the table's own styles. The
+ * value the cell commits goes back through `set`, the chip shows pending
+ * until the host settles it, and a type with no cell keeps a plain-text
+ * reading that opens the properties panel. The band never applies a value, and writes to
+ * the document only the card "Show here" inserts. The "+" is drawn when the
+ * host passes `add`; the panel button when a `PropertiesPanelProvider` is
+ * registered. The "Not shown on this page" row is drawn in both views
+ * from the host's `notShown$` (ADR 0035 §9d, amended 2026-10-13): each page
+ * opens through the linked-document path, and "Show here" inserts a card of
+ * it into this document; the host then drops the page from its list.
  */
 let TitleBand = (() => {
     let _classSuper = SignalWatcher(WithDisposable(ShadowlessElement));
@@ -154,7 +161,7 @@ let TitleBand = (() => {
       background-color: transparent;
     }
 
-    .labre-title-band svg {
+    .labre-title-band button > svg {
       flex: none;
       width: 16px;
       height: 16px;
@@ -165,36 +172,57 @@ let TitleBand = (() => {
       padding: 0 6px !important;
     }
 
+    .labre-title-band-chip {
+      display: inline-flex;
+      align-items: center;
+      gap: 6px;
+      min-height: 28px;
+      max-width: 100%;
+      padding: 0 8px;
+      border-radius: 6px;
+      transition: background-color 150ms;
+    }
+
+    .labre-title-band-chip[data-clickable='true'] {
+      cursor: pointer;
+    }
+
+    .labre-title-band-chip[data-clickable='true']:hover {
+      background-color: var(--affine-hover-color);
+    }
+
+    .labre-title-band-chip[aria-busy='true'] {
+      cursor: progress;
+      opacity: 0.6;
+    }
+
+    .labre-title-band-chip:focus-visible,
+    .labre-title-band-chip dv-standalone-cell:focus-visible {
+      outline: 2px solid var(--affine-primary-color);
+      outline-offset: 1px;
+      border-radius: 4px;
+    }
+
     .labre-title-band-chip-name {
       color: var(--affine-text-secondary-color);
       white-space: nowrap;
     }
 
+    /* Room only: what is inside is the cell's own drawing. */
     .labre-title-band-chip-value {
-      display: inline-flex;
-      align-items: center;
-      gap: 4px;
+      max-width: 240px;
       overflow: hidden;
+    }
+
+    .labre-title-band-chip-text {
       text-overflow: ellipsis;
       white-space: nowrap;
-      max-width: 240px;
     }
 
-    .labre-title-band-chip[data-empty='true'] .labre-title-band-chip-value {
+    .labre-title-band-chip-text[data-empty='true'] {
       color: var(--affine-placeholder-color);
     }
 
-    .labre-title-band-tag {
-      display: inline-block;
-      padding: 0 6px;
-      border-radius: 4px;
-      max-width: 160px;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      background-color: var(--affine-tag-white);
-    }
-
     .labre-title-band-skeleton {
       display: inline-block;
       width: 96px;
@@ -208,39 +236,34 @@ let TitleBand = (() => {
       padding-right: 4px;
     }
 
+    /* Layout only: the buttons are the band's own, no drawing of their own. */
+    .labre-title-band-not-shown-item {
+      display: inline-flex;
+      align-items: center;
+      max-width: 100%;
+    }
+
     @media (prefers-reduced-motion: reduce) {
-      .labre-title-band button {
+      .labre-title-band button,
+      .labre-title-band-chip {
         transition: none;
       }
     }
 
     /* A 44px target under a coarse pointer, without changing the drawing. */
     @media (pointer: coarse) {
-      .labre-title-band button {
+      .labre-title-band button,
+      .labre-title-band-chip {
         position: relative;
       }
-      .labre-title-band button::after {
+      .labre-title-band button::after,
+      .labre-title-band-chip::after {
         content: '';
         position: absolute;
         inset: -8px 0;
       }
     }
   `; }
-        _pop(target, title, items) {
-            this._menu?.close();
-            const handler = popMenu(popupTargetFromElement(target), {
-                options: {
-                    title: { text: title },
-                    items,
-                    onClose: () => {
-                        if (this._menu === handler)
-                            this._menu = null;
-                    },
-                },
-            });
-            this._menu = handler;
-            return handler;
-        }
         /** Read inside `render` it subscribes, through `SignalWatcher`. */
         get _readonly() {
             return this.std?.store.readonly$.value ?? true;
@@ -264,7 +287,8 @@ let TitleBand = (() => {
                 docId,
                 sheet$: service.sheet$(docId),
                 collapsed$: service.collapsed$?.(docId) ?? null,
-                notShown$: this.surface === 'canvas' ? (service.notShown$?.(docId) ?? null) : null,
+                notShown$: service.notShown$?.(docId) ?? null,
+                cells: new Map(),
             };
             this._sources = sources;
             return sources;
@@ -305,125 +329,149 @@ let TitleBand = (() => {
                 console.error('[title-band] set was refused', error);
             });
         }
-        _tagLabel(tag) {
-            return html `<span
-      class="labre-title-band-tag"
-      style=${styleMap(tag.color ? { backgroundColor: tag.color } : {})}
-      >${tag.label}</span
-    >`;
-        }
-        _clearItem(prop) {
-            return menu.action({
-                name: this._t(TITLE_BAND_CLEAR),
-                select: () => this._write(prop, null),
+        /**
+         * A definition a select's tag menu commits (a created or renamed option):
+         * handed to the host's `setData`, never applied here.
+         */
+        _writeData(property, data) {
+            const service = this._sources?.service;
+            if (!service?.setData || this._isReadonlyChip(property))
+                return;
+            if (property.dataWritable !== true)
+                return;
+            let written;
+            try {
+                written = service.setData(this.docId, property.id, {
+                    ...property.data,
+                    options: data.options,
+                });
+            }
+            catch (error) {
+                console.error('[title-band] setData threw', error);
+                return;
+            }
+            Promise.resolve(written).catch((error) => {
+                console.error('[title-band] setData was refused', error);
             });
         }
-        _popSelect(target, prop) {
-            const items = chipOptions(prop).map(tag => menu.action({
-                name: tag.label,
-                label: () => this._tagLabel(tag),
-                isSelected: tag.id === prop.value,
-                select: () => {
-                    if (tag.id !== prop.value)
-                        this._write(prop, tag.id);
-                },
-            }));
-            if (prop.value != null)
-                items.push(this._clearItem(prop));
-            this._pop(target, prop.name, items);
-        }
-        _popMultiSelect(target, prop) {
-            // A draft, because the host's answer arrives later through `sheet$`: two
-            // ticks in one open menu must not both start from the stale value.
-            const draft$ = signal(Array.isArray(prop.value)
-                ? prop.value.filter((id) => typeof id === 'string')
-                : []);
-            const items = chipOptions(prop).map(tag => menu.checkbox({
-                name: tag.label,
-                label: () => this._tagLabel(tag),
-                checked: computed(() => draft$.value.includes(tag.id)),
-                select: checked => {
-                    const next = checked
-                        ? draft$.peek().filter(id => id !== tag.id)
-                        : [...draft$.peek(), tag.id];
-                    draft$.value = next;
-                    this._write(prop, next);
-                    return !checked;
-                },
-            }));
-            this._pop(target, prop.name, items);
+        /** A value a cell commits: unchanged, nothing is written. */
+        _commit(prop, cellType, value) {
+            if (sameBandValue(cellType, prop.value, value))
+                return;
+            this._write(prop, bandWriteValue(value));
         }
-        _popDate(target, prop) {
-            let close = () => { };
-            const picker = new DatePicker();
-            picker.padding = 0;
-            picker.value = typeof prop.value === 'number' ? prop.value : Date.now();
-            picker.onChange = (date) => {
-                if (date.getTime() !== prop.value)
-                    this._write(prop, date.getTime());
-                close();
-            };
-            picker.onClear = () => {
-                this._write(prop, null);
-                close();
-            };
-            picker.onEscape = () => close();
-            const items = [() => html `${picker}`];
-            const handler = this._pop(target, prop.name, items);
-            close = () => handler.close();
+        /** Neither the property nor the document can be written, or the type. */
+        _isReadonlyChip(prop) {
+            return (!prop || prop.readonly || this._readonly || isBandReadonlyType(prop.type));
         }
-        _popInput(target, prop, kind) {
-            const initial = typeof prop.value === 'string' || typeof prop.value === 'number'
-                ? String(prop.value)
-                : '';
-            this._pop(target, prop.name, [
-                menu.input({
-                    initialValue: initial,
-                    onComplete: text => {
-                        if (text === initial)
-                            return;
-                        if (kind === 'number') {
-                            const parsed = parseChipNumber(text);
-                            this._write(prop, Number.isNaN(parsed) ? null : parsed);
-                            return;
-                        }
-                        this._write(prop, text.trim() === '' ? null : text);
-                    },
+        /**
+         * The cell that draws `prop`, built once per property and type: its value,
+         * name and config are read from the sheet, so a new sheet updates the cell
+         * in place and an editor open in it stays open.
+         */
+        _cellFor(sources, prop) {
+            const std = this.std;
+            if (!std)
+                return null;
+            const meta = bandCellMeta(prop.type, cellType => std.getOptional(StandaloneCellMetaProvider(cellType)));
+            if (!meta)
+                return null;
+            const cellType = meta.type;
+            const optionsWritable = bandOptionsWritable(cellType, prop, !!sources.service.setData) &&
+                !this._isReadonlyChip(prop);
+            const cached = sources.cells.get(prop.id);
+            if (cached?.type === prop.type &&
+                cached.optionsWritable === optionsWritable)
+                return cached.cell;
+            const { id, type } = prop;
+            const current$ = computed(() => {
+                const state = sources.sheet$.value;
+                if (state.status !== 'ready')
+                    return undefined;
+                return state.properties.find(p => p.id === id && p.type === type);
+            });
+            const cell = createStandaloneCell(meta, {
+                propertyId: id,
+                name$: computed(() => current$.value?.name ?? ''),
+                data$: computed(() => {
+                    const current = current$.value;
+                    return current ? bandCellData(cellType, current) : {};
                 }),
-            ]);
+                value$: computed(() => bandCellValue(cellType, current$.value?.value)),
+                readonly$: computed(() => this._isReadonlyChip(current$.value)),
+                valueSet: value => {
+                    const current = current$.peek();
+                    if (current)
+                        this._commit(current, cellType, value);
+                },
+                featureFlags$: this._featureFlags$,
+                serviceGet: key => std.getOptional(key),
+                // A chip creates and renames options only, never deletes, recolours
+                // or reorders one (product owner, 2026-10-14).
+                ...(optionsWritable
+                    ? {
+                        dataSet: (data) => {
+                            const current = current$.peek();
+                            if (current)
+                                this._writeData(current, data);
+                        },
+                        optionEdits: 'create-rename',
+                    }
+                    : {}),
+            });
+            sources.cells.set(id, { type, optionsWritable, cell });
+            return cell;
         }
-        _renderValue(prop) {
-            const view = chipValueView(prop, this._locale);
-            switch (view.kind) {
-                case 'checkbox':
-                    return view.checked ? CheckBoxCheckSolidIcon() : CheckBoxUnIcon();
-                case 'tags':
-                    return repeat(view.tags, tag => tag.id, tag => this._tagLabel(tag));
-                case 'text':
-                    return view.text;
-                default:
-                    return this._t(TITLE_BAND_EMPTY);
-            }
+        _renderFallback(prop) {
+            const text = formatPropertyValue(prop, this._locale);
+            return html `<span
+      class="labre-title-band-chip-value labre-title-band-chip-text"
+      data-empty=${text ? 'false' : 'true'}
+      >${text || this._t(TITLE_BAND_EMPTY)}</span
+    >`;
         }
-        _renderChip(prop, hasPanel) {
+        _renderChip(sources, prop, hasPanel) {
             const pending = this._pending$.value.has(prop.id);
-            const editable = !this._readonly && chipEditorKind(prop) !== 'none';
+            const cell = this._cellFor(sources, prop);
+            const editable = !!cell && !this._isReadonlyChip(prop);
             const clickable = editable || hasPanel;
-            const view = chipValueView(prop, this._locale);
-            return html `<button
-      class="labre-title-band-chip ${clickable ? '' : 'static'}"
+            // Without a cell the chip itself is what a keyboard reaches.
+            const focusable = !cell && hasPanel;
+            return html `<div
+      class="labre-title-band-chip"
       data-testid="title-band-chip"
       data-property-id=${prop.id}
-      data-empty=${view.kind === 'empty' ? 'true' : 'false'}
+      data-empty=${isPropertyValueEmpty(prop) ? 'true' : 'false'}
+      data-clickable=${clickable ? 'true' : 'false'}
       aria-busy=${pending ? 'true' : 'false'}
-      ?disabled=${pending || !clickable}
-      @click=${(event) => this._onChip(event, prop)}
+      role=${focusable ? 'button' : nothing}
+      tabindex=${focusable ? '0' : nothing}
+      @click=${(event) => {
+                if (clickable)
+                    this._onChip(event, editable);
+            }}
+      @keydown=${(event) => {
+                if (!focusable || event.target !== event.currentTarget)
+                    return;
+                if (event.key !== 'Enter' && event.key !== ' ')
+                    return;
+                event.preventDefault();
+                this._onChip(event, false);
+            }}
     >
       <span class="labre-title-band-chip-name">${prop.name}</span>
-      <span class="labre-title-band-chip-value"
-        >${this._renderValue(prop)}</span
-      >
-    </button>`;
+      ${cell
+                ? html `<dv-standalone-cell
+            class="labre-title-band-chip-value"
+            data-testid="title-band-cell"
+            role=${editable ? 'button' : nothing}
+            aria-label=${prop.name}
+            .cell=${cell}
+            .readonly=${!editable}
+            .placeholder=${this._t(TITLE_BAND_EMPTY)}
+          ></dv-standalone-cell>`
+                : this._renderFallback(prop)}
+    </div>`;
         }
         _renderTools(sources, hasPanel) {
             const canAdd = !!sources.service.add && !this._readonly;
@@ -519,7 +567,7 @@ let TitleBand = (() => {
             ${ToggleDownIcon()}
           </button>`
                 : nothing}
-      ${repeat(properties, prop => prop.id, prop => this._renderChip(prop, hasPanel))}
+      ${repeat(properties, prop => prop.id, prop => this._renderChip(sources, prop, hasPanel))}
       ${this._renderTools(sources, hasPanel)}
     </div>`;
         }
@@ -530,32 +578,55 @@ let TitleBand = (() => {
             // A link that opens nothing is a lie: no linked-document path, no row.
             if (!std || !slots || pages.length === 0)
                 return nothing;
+            const label = this._t(TITLE_BAND_NOT_SHOWN);
+            const showHere = this._readonly ? null : this._t(TITLE_BAND_SHOW_HERE);
             return html `<div
       class="labre-title-band-row"
+      role="group"
+      aria-label=${label}
       data-testid="title-band-not-shown"
     >
-      <span class="labre-title-band-not-shown-label"
-        >${this._t(TITLE_BAND_NOT_SHOWN)}</span
+      <span class="labre-title-band-not-shown-label" aria-hidden="true"
+        >${label}</span
       >
-      ${repeat(pages, page => page.docId, page => html `<button
-            data-testid="title-band-not-shown-page"
-            data-doc-id=${page.docId}
-            @click=${(event) => {
-                event.stopPropagation();
-                slots.docLinkClicked.next({
-                    pageId: page.docId,
-                    host: std.host,
-                    event,
-                });
-            }}
+      ${repeat(pages, page => page.docId, page => {
+                const title = page.title.trim() === '' ? this._t(DOC_UNTITLED) : page.title;
+                // A group named after the page, so a screen reader hears which
+                // page each "Show here" belongs to without a second wording.
+                return html `<span
+            class="labre-title-band-not-shown-item"
+            role="group"
+            aria-label=${title}
           >
-            ${LinkedPageIcon()}
-            <span class="labre-title-band-chip-value"
-              >${page.title.trim() === ''
-                ? this._t(DOC_UNTITLED)
-                : page.title}</span
+            <button
+              data-testid="title-band-not-shown-page"
+              data-doc-id=${page.docId}
+              @click=${(event) => {
+                    event.stopPropagation();
+                    slots.docLinkClicked.next({
+                        pageId: page.docId,
+                        host: std.host,
+                        event,
+                    });
+                }}
             >
-          </button>`)}
+              ${LinkedPageIcon()}
+              <span class="labre-title-band-chip-value">${title}</span>
+            </button>
+            ${showHere
+                    ? html `<button
+                  data-testid="title-band-show-here"
+                  data-doc-id=${page.docId}
+                  @click=${(event) => {
+                        event.stopPropagation();
+                        showPageHere(std, this.surface, page.docId);
+                    }}
+                >
+                  ${showHere}
+                </button>`
+                    : nothing}
+          </span>`;
+            })}
     </div>`;
         }
         connectedCallback() {
@@ -565,7 +636,6 @@ let TitleBand = (() => {
             // split the title) nor the canvas's (a press would start a drag).
             this._disposables.addFromEvent(this, 'keydown', stopPropagation);
             this._disposables.addFromEvent(this, 'pointerdown', stopPropagation);
-            this._disposables.add(() => this._menu?.close());
         }
         render() {
             const std = this.std;
@@ -576,7 +646,7 @@ let TitleBand = (() => {
                 return nothing;
             const sources = this._getSources(service);
             const sheet = this._renderSheet(sources);
-            const notShown = this.surface === 'canvas' ? this._renderNotShown(sources) : nothing;
+            const notShown = this._renderNotShown(sources);
             if (sheet === nothing && notShown === nothing)
                 return nothing;
             return html `<div
@@ -594,44 +664,23 @@ let TitleBand = (() => {
         get docId() { return this.#docId_accessor_storage; }
         set docId(value) { this.#docId_accessor_storage = value; }
         #surface_accessor_storage;
-        /** Where the band is drawn; only the canvas draws the "Not shown" row. */
+        /** Where the band is drawn: where "Show here" puts the card. */
         get surface() { return this.#surface_accessor_storage; }
         set surface(value) { this.#surface_accessor_storage = value; }
         constructor() {
             super(...arguments);
             this._sources = null;
-            /** The editor menu open now, put away with the band. */
-            this._menu = null;
             /** Collapse state when the host does not remember one. */
             this._localCollapsed$ = signal(false);
             /** Property ids whose `set` has not settled yet. */
             this._pending$ = signal(new Set());
-            this._onChip = (event, prop) => {
-                event.stopPropagation();
-                const target = event.currentTarget;
-                switch (chipEditorKind(prop)) {
-                    case 'toggle':
-                        this._write(prop, prop.value !== true);
-                        return;
-                    case 'select':
-                        this._popSelect(target, prop);
-                        return;
-                    case 'multi-select':
-                        this._popMultiSelect(target, prop);
-                        return;
-                    case 'date':
-                        this._popDate(target, prop);
-                        return;
-                    case 'number':
-                        this._popInput(target, prop, 'number');
-                        return;
-                    case 'text':
-                        this._popInput(target, prop, 'text');
-                        return;
-                    default:
-                        this._openPanel();
-                }
-            };
+            /** The table's own flags, so a number reads as it does in a cell. */
+            this._featureFlags$ = computed(() => ({
+                enable_number_formatting: this.std
+                    ?.getOptional(FeatureFlagService)
+                    ?.getFlag('enable_database_number_formatting') ?? false,
+                enable_table_virtual_scroll: false,
+            }));
             this._openPanel = () => {
                 if (!this.std)
                     return;
@@ -639,6 +688,15 @@ let TitleBand = (() => {
                     .getOptional(PropertiesPanelProvider)
                     ?.open({ scope: 'page', docId: this.docId });
             };
+            this._onChip = (event, editable) => {
+                event.stopPropagation();
+                const chip = event.currentTarget;
+                if (editable) {
+                    chip.querySelector('dv-standalone-cell')?.edit();
+                    return;
+                }
+                this._openPanel();
+            };
             this.#std_accessor_storage = __runInitializers(this, _std_initializers, null);
             this.#docId_accessor_storage = (__runInitializers(this, _std_extraInitializers), __runInitializers(this, _docId_initializers, ''));
             this.#surface_accessor_storage = (__runInitializers(this, _docId_extraInitializers), __runInitializers(this, _surface_initializers, 'page'));

package/dist/_pkgs/affine-fragment-doc-title/translations.d.ts

@@ -23,12 +23,15 @@ export declare const TITLE_BAND_COLLAPSE: ChromeWording;
 export declare const TITLE_BAND_EXPAND: ChromeWording;
 /** The accessible name of the skeleton drawn while the sheet loads. */
 export declare const TITLE_BAND_LOADING: ChromeWording;
-/** Clears a select or a date from its editor. */
-export declare const TITLE_BAND_CLEAR: ChromeWording;
 /**
- * The note header's row of child pages the document holds but does not
- * display (ADR 0035 §9d, canvas view only).
+ * The row of child pages the document holds but does not display, under the
+ * title and in the note header (ADR 0035 §9d and its 2026-10-13 amendment).
  */
 export declare const TITLE_BAND_NOT_SHOWN: ChromeWording;
+/**
+ * The button beside each page of that row: inserts a card of the page here
+ * (labre ADR-0045 §7).
+ */
+export declare const TITLE_BAND_SHOW_HERE: ChromeWording;
 /** Every wording this package declares, in the order it renders them. */
 export declare const DOC_TITLE_WORDINGS: readonly ChromeWording[];