@formicoidea/labre-core 0.40.0 → 0.42.0

package/dist/_pkgs/affine-block-embed-doc/embed-synced-doc-block/embed-synced-doc-block.js

@@ -38,7 +38,7 @@ import { ViewExtensionManagerIdentifier } from '../../affine-ext-loader/index.js
 import { RefNodeSlotsProvider, } from '../../affine-inline-reference/index.js';
 import { NoteDisplayMode, } from '../../affine-model/index.js';
 import { REFERENCE_NODE } from '../../affine-shared/consts/index.js';
-import { DocDisplayMetaProvider, DocModeProvider, EditorSettingExtension, EditorSettingProvider, GeneralSettingSchema, ThemeExtensionIdentifier, ThemeProvider, } from '../../affine-shared/services/index.js';
+import { DocDisplayMetaProvider, DocModeProvider, EditorSettingExtension, EditorSettingProvider, GeneralSettingSchema, ThemeExtensionIdentifier, ThemeProvider, translateKey, } from '../../affine-shared/services/index.js';
 import { cloneReferenceInfo } from '../../affine-shared/utils/index.js';
 import { Bound, getCommonBound } from '../../global/gfx/index.js';
 import { BlockSelection, BlockStdScope, LifeCycleWatcher, } from '../../std/index.js';
@@ -53,6 +53,7 @@ import { guard } from 'lit/directives/guard.js';
 import { styleMap } from 'lit/directives/style-map.js';
 import * as Y from 'yjs';
 import { isDocTrashed } from '../common/doc-trashed.js';
+import { EMBED_DOC_CARD_EMPTY_CONTENT } from '../translations.js';
 import { blockStyles } from './styles.js';
 let EmbedSyncedDocBlockComponent = (() => {
     let _classDecorators = [Peekable({
@@ -259,7 +260,7 @@ let EmbedSyncedDocBlockComponent = (() => {
                     ? html `
                   <div class="affine-embed-synced-doc-editor-empty">
                     <span>
-                      This is a linked doc, you can add content here.
+                      ${translateKey(this.std, ...EMBED_DOC_CARD_EMPTY_CONTENT)}
                     </span>
                   </div>
                 `

package/dist/_pkgs/affine-block-embed-doc/translations.d.ts

@@ -0,0 +1,40 @@
+import { type ChromeWording } from '../affine-shared/services/index.js';
+export declare const EMBED_DOC_SLASH_NEW_DOC_NAME: ChromeWording;
+export declare const EMBED_DOC_SLASH_NEW_DOC_DESCRIPTION: ChromeWording;
+export declare const EMBED_DOC_SLASH_LINKED_DOC_NAME: ChromeWording;
+/** The tooltip's own word — distinct from the item's name above. */
+export declare const EMBED_DOC_SLASH_LINKED_DOC_CAPTION: ChromeWording;
+export declare const EMBED_DOC_SLASH_LINKED_DOC_DESCRIPTION: ChromeWording;
+/**
+ * The "Open doc" dropdown button — its own `aria-label`/`tooltip` AND the
+ * dropdown's single entry label, in both `embed-linked-doc-block/configs/toolbar.ts`
+ * and `embed-synced-doc-block/configs/toolbar.ts`.
+ */
+export declare const EMBED_DOC_OPEN_DOC: ChromeWording;
+/** The card's "last updated" date label (`components/embed-synced-doc-card.ts`, `embed-linked-doc-block.ts`). */
+export declare const EMBED_DOC_UPDATED_LABEL: ChromeWording;
+export declare const EMBED_DOC_INSERT_TO_PAGE: ChromeWording;
+export declare const EMBED_DOC_DUPLICATE_AS_NOTE: ChromeWording;
+export declare const EMBED_DOC_DUPLICATE_AS_NOTE_TOOLTIP: ChromeWording;
+/**
+ * The nested-editor empty state — the exact same sentence in both the page
+ * and the edgeless synced-doc view (`embed-synced-doc-block.ts`,
+ * `embed-edgeless-synced-doc-block.ts`).
+ */
+export declare const EMBED_DOC_CARD_EMPTY_CONTENT: ChromeWording;
+/**
+ * This package's contribution to the translation-key manifest, listed in
+ * `PACKAGE_WORDINGS` under source `chrome`
+ * (`packages/affine/all/src/translations.ts`). The shared verbs it reuses
+ * (Caption, Reload, Loading…, Untitled, the card-style switcher's four
+ * wordings, Open this doc…) travel with `@labre/affine-shared/services`
+ * instead, so they are not restated here.
+ *
+ * The three export adapters' own "untitled" fallback
+ * (`adapters/html.ts`/`markdown.ts`/`plain-text.ts`) is deliberately left
+ * untouched: per the L2b lot's changeset, the paste/import pipeline's
+ * `Transformer` carries an optional `provider` that is never wired to the
+ * editor's `TranslationProvider` by any existing caller, so resolving a key
+ * there would be dead code, not a real translation path.
+ */
+export declare const EMBED_DOC_WORDINGS: readonly ChromeWording[];

package/dist/_pkgs/affine-block-embed-doc/translations.js

@@ -0,0 +1,85 @@
+import { NEW_DOC_LABEL, } from '../affine-shared/services/index.js';
+/* ── The linked-doc embed's own slash-menu items ─────────────────────────
+ * (`embed-linked-doc-block/configs/slash-menu.ts`)
+ */
+export const EMBED_DOC_SLASH_NEW_DOC_NAME = NEW_DOC_LABEL;
+export const EMBED_DOC_SLASH_NEW_DOC_DESCRIPTION = [
+    'com.labre.embed-doc.slash.new-doc.description',
+    'Start a new document.',
+];
+export const EMBED_DOC_SLASH_LINKED_DOC_NAME = [
+    'com.labre.embed-doc.slash.linked-doc.name',
+    'Linked Doc',
+];
+/** The tooltip's own word — distinct from the item's name above. */
+export const EMBED_DOC_SLASH_LINKED_DOC_CAPTION = [
+    'com.labre.embed-doc.slash.linked-doc.caption',
+    'Link Doc',
+];
+export const EMBED_DOC_SLASH_LINKED_DOC_DESCRIPTION = [
+    'com.labre.embed-doc.slash.linked-doc.description',
+    'Link to another document.',
+];
+/* ── Toolbar chrome shared by the linked-doc and synced-doc toolbars ───── */
+/**
+ * The "Open doc" dropdown button — its own `aria-label`/`tooltip` AND the
+ * dropdown's single entry label, in both `embed-linked-doc-block/configs/toolbar.ts`
+ * and `embed-synced-doc-block/configs/toolbar.ts`.
+ */
+export const EMBED_DOC_OPEN_DOC = [
+    'com.labre.embed-doc.toolbar.open-doc',
+    'Open doc',
+];
+/** The card's "last updated" date label (`components/embed-synced-doc-card.ts`, `embed-linked-doc-block.ts`). */
+export const EMBED_DOC_UPDATED_LABEL = [
+    'com.labre.embed-doc.card.updated',
+    'Updated',
+];
+export const EMBED_DOC_INSERT_TO_PAGE = [
+    'com.labre.embed-doc.toolbar.insert-to-page',
+    'Insert to document',
+];
+export const EMBED_DOC_DUPLICATE_AS_NOTE = [
+    'com.labre.embed-doc.toolbar.duplicate-as-note',
+    'Duplicate as note',
+];
+export const EMBED_DOC_DUPLICATE_AS_NOTE_TOOLTIP = [
+    'com.labre.embed-doc.toolbar.duplicate-as-note.tooltip',
+    'Duplicate as note to create an editable copy, the original remains unchanged.',
+];
+/**
+ * The nested-editor empty state — the exact same sentence in both the page
+ * and the edgeless synced-doc view (`embed-synced-doc-block.ts`,
+ * `embed-edgeless-synced-doc-block.ts`).
+ */
+export const EMBED_DOC_CARD_EMPTY_CONTENT = [
+    'com.labre.embed-doc.card.empty-content',
+    'This is a linked doc, you can add content here.',
+];
+/**
+ * This package's contribution to the translation-key manifest, listed in
+ * `PACKAGE_WORDINGS` under source `chrome`
+ * (`packages/affine/all/src/translations.ts`). The shared verbs it reuses
+ * (Caption, Reload, Loading…, Untitled, the card-style switcher's four
+ * wordings, Open this doc…) travel with `@labre/affine-shared/services`
+ * instead, so they are not restated here.
+ *
+ * The three export adapters' own "untitled" fallback
+ * (`adapters/html.ts`/`markdown.ts`/`plain-text.ts`) is deliberately left
+ * untouched: per the L2b lot's changeset, the paste/import pipeline's
+ * `Transformer` carries an optional `provider` that is never wired to the
+ * editor's `TranslationProvider` by any existing caller, so resolving a key
+ * there would be dead code, not a real translation path.
+ */
+export const EMBED_DOC_WORDINGS = [
+    EMBED_DOC_SLASH_NEW_DOC_DESCRIPTION,
+    EMBED_DOC_SLASH_LINKED_DOC_NAME,
+    EMBED_DOC_SLASH_LINKED_DOC_CAPTION,
+    EMBED_DOC_SLASH_LINKED_DOC_DESCRIPTION,
+    EMBED_DOC_OPEN_DOC,
+    EMBED_DOC_UPDATED_LABEL,
+    EMBED_DOC_INSERT_TO_PAGE,
+    EMBED_DOC_DUPLICATE_AS_NOTE,
+    EMBED_DOC_DUPLICATE_AS_NOTE_TOOLTIP,
+    EMBED_DOC_CARD_EMPTY_CONTENT,
+];

package/dist/_pkgs/affine-block-frame/edgeless-toolbar/frame-dense-menu.js

@@ -1,28 +1,35 @@
 import { DefaultTool } from '../../affine-block-surface/index.js';
 import { menu } from '../../affine-components/context-menu/index.js';
+import { TOOLBAR_FRAME, translateKey } from '../../affine-shared/services/index.js';
 import { FrameIcon } from '@blocksuite/icons/lit';
 import { EdgelessFrameManagerIdentifier } from '../frame-manager.js';
 import { FrameTool } from '../frame-tool.js';
+import { FRAME_DENSE_MENU_CUSTOM, FRAME_DENSE_MENU_SLIDE, } from '../translations.js';
 import { FrameConfig } from './config.js';
-export const buildFrameDenseMenu = (edgeless, gfx) => menu.subMenu({
-    name: 'Frame',
-    prefix: FrameIcon({ width: '20px', height: '20px' }),
-    select: () => gfx.tool.setTool(FrameTool),
-    isSelected: gfx.tool.currentToolName$.peek() === 'frame',
-    options: {
-        items: [
-            menu.action({
-                name: 'Custom',
-                select: () => gfx.tool.setTool(FrameTool),
-            }),
-            ...FrameConfig.map(config => menu.action({
-                name: `Slide ${config.name}`,
-                select: () => {
-                    const frame = edgeless.std.get(EdgelessFrameManagerIdentifier);
-                    gfx.tool.setTool(DefaultTool);
-                    frame.createFrameOnViewportCenter(config.wh);
-                },
-            })),
-        ],
-    },
-});
+export const buildFrameDenseMenu = (edgeless, gfx) => {
+    const { std } = edgeless;
+    return menu.subMenu({
+        name: translateKey(std, ...TOOLBAR_FRAME),
+        prefix: FrameIcon({ width: '20px', height: '20px' }),
+        select: () => gfx.tool.setTool(FrameTool),
+        isSelected: gfx.tool.currentToolName$.peek() === 'frame',
+        options: {
+            items: [
+                menu.action({
+                    name: translateKey(std, ...FRAME_DENSE_MENU_CUSTOM),
+                    select: () => gfx.tool.setTool(FrameTool),
+                }),
+                ...FrameConfig.map(config => menu.action({
+                    name: translateKey(std, ...FRAME_DENSE_MENU_SLIDE, {
+                        name: config.name,
+                    }),
+                    select: () => {
+                        const frame = edgeless.std.get(EdgelessFrameManagerIdentifier);
+                        gfx.tool.setTool(DefaultTool);
+                        frame.createFrameOnViewportCenter(config.wh);
+                    },
+                })),
+            ],
+        },
+    });
+};

package/dist/_pkgs/affine-block-frame/edgeless-toolbar/frame-menu.js

@@ -1,9 +1,11 @@
 import { DefaultTool } from '../../affine-block-surface/index.js';
+import { translateKey } from '../../affine-shared/services/index.js';
 import { EdgelessToolbarToolMixin } from '../../affine-widget-edgeless-toolbar/index.js';
 import { css, html, LitElement } from 'lit';
 import { repeat } from 'lit/directives/repeat.js';
 import { EdgelessFrameManagerIdentifier } from '../frame-manager.js';
 import { FrameTool } from '../frame-tool.js';
+import { FRAME_DENSE_MENU_CUSTOM } from '../translations.js';
 import { FrameConfig } from './config.js';
 export class EdgelessFrameMenu extends EdgelessToolbarToolMixin(LitElement) {
     constructor() {
@@ -75,7 +77,9 @@ export class EdgelessFrameMenu extends EdgelessToolbarToolMixin(LitElement) {
         return html `
       <edgeless-slide-menu .showNext=${false}>
         <div class="menu-content">
-          <div class="frame-add-button custom">Custom</div>
+          <div class="frame-add-button custom">
+            ${translateKey(this.edgeless.std, ...FRAME_DENSE_MENU_CUSTOM)}
+          </div>
           <div class="divider"></div>
           ${repeat(FrameConfig, item => item.name, (item, index) => html `
               <div

package/dist/_pkgs/affine-block-frame/edgeless-toolbar/frame-tool-button.js

@@ -1,3 +1,4 @@
+import { TOOLBAR_FRAME, translateKey } from '../../affine-shared/services/index.js';
 import { QuickToolMixin } from '../../affine-widget-edgeless-toolbar/index.js';
 import { FrameIcon } from '@blocksuite/icons/lit';
 import { css, html, LitElement } from 'lit';
@@ -26,7 +27,7 @@ export class EdgelessFrameToolButton extends QuickToolMixin(LitElement) {
         .tooltip=${this.popper
             ? ''
             : html `<affine-tooltip-content-with-shortcut
-              data-tip="${'Frame'}"
+              data-tip="${translateKey(this.edgeless.std, ...TOOLBAR_FRAME)}"
               data-shortcut="${'F'}"
             ></affine-tooltip-content-with-shortcut>`}
         .tooltipOffset=${17}

package/dist/_pkgs/affine-block-frame/edgeless-toolbar/presentation-toolbar.js

@@ -35,7 +35,7 @@ var __runInitializers = (this && this.__runInitializers) || function (thisArg, i
 import { DefaultTool, EdgelessLegacySlotIdentifier, } from '../../affine-block-surface/index.js';
 import { toast } from '../../affine-components/toast/index.js';
 import { PanTool } from '../../affine-gfx-pointer/index.js';
-import { EditPropsStore, ViewportElementProvider, } from '../../affine-shared/services/index.js';
+import { EditPropsStore, translateKey, ViewportElementProvider, } from '../../affine-shared/services/index.js';
 import { EdgelessToolbarToolMixin } from '../../affine-widget-edgeless-toolbar/index.js';
 import { Bound, clamp } from '../../global/gfx/index.js';
 import { SignalWatcher } from '../../global/lit/index.js';
@@ -46,6 +46,7 @@ import { css, html, LitElement, nothing } from 'lit';
 import { property, state } from 'lit/decorators.js';
 import { EdgelessFrameManagerIdentifier, isFrameBlock, } from '../frame-manager.js';
 import { PresentTool } from '../present-tool.js';
+import { FRAME_PRESENT_ENTER_FULLSCREEN, FRAME_PRESENT_EXIT_FULLSCREEN, FRAME_PRESENT_NEXT, FRAME_PRESENT_NO_FRAME_TITLE, FRAME_PRESENT_PREVIOUS, FRAME_PRESENT_REACHED_FIRST, FRAME_PRESENT_REACHED_LAST, FRAME_PRESENT_REQUIRES_ONE_FRAME, } from '../translations.js';
 let PresentationToolbar = (() => {
     let _classSuper = EdgelessToolbarToolMixin(SignalWatcher(LitElement));
     let __currentFrameIndex_decorators;
@@ -283,7 +284,7 @@ let PresentationToolbar = (() => {
             const min = 0;
             const max = frames.length - 1;
             if (this._currentFrameIndex === frames.length - 1) {
-                toast(this.host, 'You have reached the last frame');
+                toast(this.host, translateKey(this.edgeless.std, ...FRAME_PRESENT_REACHED_LAST));
             }
             else {
                 this._currentFrameIndex = clamp(this._currentFrameIndex + 1, min, max);
@@ -294,7 +295,7 @@ let PresentationToolbar = (() => {
             const min = 0;
             const max = frames.length - 1;
             if (this._currentFrameIndex === 0) {
-                toast(this.host, 'You have reached the first frame');
+                toast(this.host, translateKey(this.edgeless.std, ...FRAME_PRESENT_REACHED_FIRST));
             }
             else {
                 this._currentFrameIndex = clamp(this._currentFrameIndex - 1, min, max);
@@ -344,7 +345,7 @@ let PresentationToolbar = (() => {
                     const store = this.edgeless.std.get(EditPropsStore);
                     if (this._frames.length === 0) {
                         if (!store.getStorage('presentNoFrameToastShown')) {
-                            toast(this.host, 'The presentation requires at least 1 frame. You can firstly create a frame.', 5000);
+                            toast(this.host, translateKey(this.edgeless.std, ...FRAME_PRESENT_REQUIRES_ONE_FRAME), 5000);
                             store.setStorage('presentNoFrameToastShown', true);
                         }
                     }
@@ -398,6 +399,7 @@ let PresentationToolbar = (() => {
             const current = this._currentFrameIndex;
             const frames = this._frames;
             const frame = frames[current];
+            const { std } = this.edgeless;
             return html `
       <style>
         :host {
@@ -406,7 +408,7 @@ let PresentationToolbar = (() => {
       </style>
       <edgeless-tool-icon-button
         .iconContainerPadding=${0}
-        .tooltip=${'Previous'}
+        .tooltip=${translateKey(std, ...FRAME_PRESENT_PREVIOUS)}
         .iconSize=${'24px'}
         @click=${() => this._previousFrame()}
       >
@@ -421,7 +423,8 @@ let PresentationToolbar = (() => {
               class="edgeless-frame-navigator-title"
               @click=${() => this._moveToCurrentFrame()}
             >
-              ${frame?.props.title ?? 'no frame'}
+              ${frame?.props.title ??
+                    translateKey(std, ...FRAME_PRESENT_NO_FRAME_TITLE)}
             </span>`}
 
         <span class="edgeless-frame-navigator-count">
@@ -430,7 +433,7 @@ let PresentationToolbar = (() => {
       </div>
 
       <edgeless-tool-icon-button
-        .tooltip=${'Next'}
+        .tooltip=${translateKey(std, ...FRAME_PRESENT_NEXT)}
         @click=${() => this._nextFrame()}
         .iconContainerPadding=${0}
         .iconSize=${'24px'}
@@ -443,8 +446,8 @@ let PresentationToolbar = (() => {
       <div class="config-buttons">
         <edgeless-tool-icon-button
           .tooltip=${document.fullscreenElement
-                ? 'Exit Full Screen'
-                : 'Enter Full Screen'}
+                ? translateKey(std, ...FRAME_PRESENT_EXIT_FULLSCREEN)
+                : translateKey(std, ...FRAME_PRESENT_ENTER_FULLSCREEN)}
           @click=${() => this._toggleFullScreen()}
           .iconContainerPadding=${0}
           .iconContainerWidth=${'24px'}

package/dist/_pkgs/affine-block-frame/frame-manager.js

@@ -1,12 +1,13 @@
 import { indexOverBackgrounds, Overlay, stackedElementsOf, } from '../affine-block-surface/index.js';
 import { FrameworkBackgroundElementModel } from '../affine-model/index.js';
-import { EditPropsStore } from '../affine-shared/services/index.js';
+import { EditPropsStore, translateKey } from '../affine-shared/services/index.js';
 import { DisposableGroup } from '../global/disposable/index.js';
 import { BlockSuiteError, ErrorCode } from '../global/exceptions/index.js';
 import { Bound, deserializeXYWH, } from '../global/gfx/index.js';
 import { generateKeyBetween, generateKeyBetweenV2, getTopElements, GfxBlockElementModel, GfxExtension, GfxExtensionIdentifier, isGfxGroupCompatibleModel, renderableInEdgeless, } from '../std/gfx/index.js';
 import { Text } from '../store/index.js';
 import * as Y from 'yjs';
+import { FRAME_SEED_NAME } from './translations.js';
 const FRAME_PADDING = 40;
 export class FrameOverlay extends Overlay {
     static { this.overlayName = 'frame'; }
@@ -144,7 +145,12 @@ export class EdgelessFrameManager extends GfxExtension {
         const props = this.gfx.std
             .get(EditPropsStore)
             .applyLastProps('affine:frame', {
-            title: new Text(new Y.Text(`Frame ${this.frames.length + 1}`)),
+            // Translated HERE and once: the title is document content the moment
+            // it lands (ADR 0023), so the host's catalogue is asked at placement
+            // and never again — a renamed frame keeps its name.
+            title: new Text(new Y.Text(translateKey(this.gfx.std, ...FRAME_SEED_NAME, {
+                n: this.frames.length + 1,
+            }))),
             xywh: bound.serialize(),
             index: this.frameIndexAt(bound),
             presentationIndex: this.generatePresentationIndex(),

package/dist/_pkgs/affine-block-frame/frame-tool.js

@@ -1,10 +1,11 @@
 import { DefaultTool, OverlayIdentifier } from '../affine-block-surface/index.js';
-import { EditPropsStore, TelemetryProvider, } from '../affine-shared/services/index.js';
+import { EditPropsStore, TelemetryProvider, translateKey, } from '../affine-shared/services/index.js';
 import { Bound, Vec } from '../global/gfx/index.js';
 import { BaseTool, getTopElements } from '../std/gfx/index.js';
 import { Text } from '../store/index.js';
 import * as Y from 'yjs';
 import { EdgelessFrameManagerIdentifier, } from './frame-manager.js';
+import { FRAME_SEED_NAME } from './translations.js';
 export class FrameTool extends BaseTool {
     constructor() {
         super(...arguments);
@@ -48,7 +49,11 @@ export class FrameTool extends BaseTool {
             const props = this.std
                 .get(EditPropsStore)
                 .applyLastProps('affine:frame', {
-                title: new Text(new Y.Text(`Frame ${frames.length + 1}`)),
+                // Translated HERE and once, like `EdgelessFrameManager._addFrameBlock`:
+                // the title is document content the moment it lands (ADR 0023).
+                title: new Text(new Y.Text(translateKey(this.std, ...FRAME_SEED_NAME, {
+                    n: frames.length + 1,
+                }))),
                 xywh: bound.serialize(),
                 // Not the raw back of the stack: a frame drawn on a framework
                 // background must sit just above it, or the author draws blind

package/dist/_pkgs/affine-block-frame/frame-toolbar.js

@@ -1,8 +1,8 @@
 import { EdgelessCRUDIdentifier } from '../affine-block-surface/index.js';
-import { packColor, } from '../affine-components/color-picker/index.js';
+import { frameworkPaletteGroups, packColor, } from '../affine-components/color-picker/index.js';
 import { toast } from '../affine-components/toast/index.js';
 import { DEFAULT_NOTE_HEIGHT, DefaultTheme, FrameBlockModel, FrameBlockSchema, NoteBlockModel, NoteBlockSchema, NoteDisplayMode, resolveColor, SurfaceRefBlockSchema, } from '../affine-model/index.js';
-import { NotificationProvider, TOAST_FRAME_INSERTED_INTO_PAGE, ToolbarModuleExtension, translateKey, } from '../affine-shared/services/index.js';
+import { NotificationProvider, TOAST_FRAME_INSERTED_INTO_PAGE, TOOLBAR_RENAME, ToolbarModuleExtension, translateKey, } from '../affine-shared/services/index.js';
 import { getMostCommonResolvedValue, matchModels, } from '../affine-shared/utils/index.js';
 import { mountFrameTitleEditor } from '../affine-widget-frame-title/index.js';
 import { Bound } from '../global/gfx/index.js';
@@ -11,6 +11,7 @@ import { BlockFlavourIdentifier } from '../std/index.js';
 import { GfxControllerIdentifier } from '../std/gfx/index.js';
 import { html } from 'lit';
 import { EdgelessFrameManagerIdentifier } from './frame-manager.js';
+import { FRAME_TOAST_INSERTED_MESSAGE, FRAME_TOOLBAR_BACKGROUND, FRAME_TOOLBAR_INSERT_INTO_PAGE, FRAME_TOOLBAR_UNGROUP, } from './translations.js';
 function getRootBlock(ctx) {
     const rootModel = ctx.store.root;
     if (!rootModel)
@@ -21,8 +22,10 @@ const builtinSurfaceToolbarConfig = {
     actions: [
         {
             id: 'a.insert-into-page',
-            label: 'Insert into Page',
-            tooltip: 'Insert into Page',
+            label: 'Insert into Document',
+            labelWording: FRAME_TOOLBAR_INSERT_INTO_PAGE,
+            tooltip: 'Insert into Document',
+            tooltipWording: FRAME_TOOLBAR_INSERT_INTO_PAGE,
             icon: InsertIntoPageIcon(),
             when: ctx => ctx.getSurfaceModelsByType(FrameBlockModel).length === 1,
             run(ctx) {
@@ -47,18 +50,19 @@ const builtinSurfaceToolbarConfig = {
                 if (notification) {
                     notification.notifyWithUndoAction({
                         title: translateKey(ctx.std, ...TOAST_FRAME_INSERTED_INTO_PAGE),
-                        message: 'Frame has been inserted into doc',
+                        message: translateKey(ctx.std, ...FRAME_TOAST_INSERTED_MESSAGE),
                         accent: 'success',
                     });
                 }
                 else {
-                    toast(ctx.host, 'Frame has been inserted into doc');
+                    toast(ctx.host, translateKey(ctx.std, ...FRAME_TOAST_INSERTED_MESSAGE));
                 }
             },
         },
         {
             id: 'b.rename',
             tooltip: 'Rename',
+            tooltipWording: TOOLBAR_RENAME,
             icon: EditIcon(),
             when: ctx => ctx.getSurfaceModelsByType(FrameBlockModel).length === 1,
             run(ctx) {
@@ -74,6 +78,7 @@ const builtinSurfaceToolbarConfig = {
         {
             id: 'b.ungroup',
             tooltip: 'Ungroup',
+            tooltipWording: FRAME_TOOLBAR_UNGROUP,
             icon: UngroupIcon(),
             run(ctx) {
                 const models = ctx.getSurfaceModelsByType(FrameBlockModel);
@@ -130,14 +135,20 @@ const builtinSurfaceToolbarConfig = {
                             break;
                     }
                 };
+                // A frame drawn over a framework board opens on that framework's hues
+                // (`docs/adr/0027`); the editor palette stays page one.
+                const carousel = frameworkPaletteGroups(ctx.std, models, DefaultTheme.Palettes);
                 return html `
           <edgeless-color-picker-button
             class="background"
-            .label="${'Background'}"
+            .label="${translateKey(ctx.std, ...FRAME_TOOLBAR_BACKGROUND)}"
             .pick=${onPick}
             .color=${background}
             .theme=${theme}
+            .std=${ctx.std}
             .originalColor=${firstModel.props.background}
+            .paletteGroups=${carousel.groups}
+            .activeGroupKey=${carousel.activeKey}
             .enableCustomColor=${enableCustomColor}
           >
           </edgeless-color-picker-button>

package/dist/_pkgs/affine-block-frame/index.d.ts

@@ -7,3 +7,4 @@ export * from './frame-spec.js';
 export * from './frame-tool.js';
 export * from './frame-toolbar.js';
 export * from './present-tool.js';
+export * from './translations.js';

package/dist/_pkgs/affine-block-frame/index.js

@@ -7,3 +7,4 @@ export * from './frame-spec.js';
 export * from './frame-tool.js';
 export * from './frame-toolbar.js';
 export * from './present-tool.js';
+export * from './translations.js';

package/dist/_pkgs/affine-block-frame/present/frame-order-button.js

@@ -32,11 +32,13 @@ var __runInitializers = (this && this.__runInitializers) || function (thisArg, i
     }
     return useValue ? value : void 0;
 };
+import { translateKey } from '../../affine-shared/services/index.js';
 import { createButtonPopper } from '../../affine-shared/utils/index.js';
 import { WithDisposable } from '../../global/lit/index.js';
 import { LayerIcon } from '@blocksuite/icons/lit';
 import { css, html, LitElement } from 'lit';
 import { property, query } from 'lit/decorators.js';
+import { FRAME_PRESENT_FRAME_ORDER } from '../translations.js';
 let EdgelessFrameOrderButton = (() => {
     let _classSuper = WithDisposable(LitElement);
     let __edgelessFrameOrderButton_decorators;
@@ -106,7 +108,9 @@ let EdgelessFrameOrderButton = (() => {
       <edgeless-tool-icon-button
         class="edgeless-frame-order-button"
         .iconSize=${'24px'}
-        .tooltip=${this.popperShow ? '' : 'Frame Order'}
+        .tooltip=${this.popperShow
+                ? ''
+                : translateKey(this.edgeless.std, ...FRAME_PRESENT_FRAME_ORDER)}
         @click=${() => {
                 if (readonly)
                     return;

package/dist/_pkgs/affine-block-frame/present/navigator-setting-button.js

@@ -33,12 +33,13 @@ var __runInitializers = (this && this.__runInitializers) || function (thisArg, i
     return useValue ? value : void 0;
 };
 import { EdgelessLegacySlotIdentifier } from '../../affine-block-surface/index.js';
-import { EditPropsStore } from '../../affine-shared/services/index.js';
+import { EditPropsStore, TOOLBAR_HIDE_TOOLBAR, TOOLBAR_PLAYBACK_SETTINGS, TOOLBAR_SETTINGS, translateKey, } from '../../affine-shared/services/index.js';
 import { createButtonPopper } from '../../affine-shared/utils/index.js';
 import { WithDisposable } from '../../global/lit/index.js';
 import { SettingsIcon } from '@blocksuite/icons/lit';
 import { css, html, LitElement, nothing } from 'lit';
 import { property, query, state } from 'lit/decorators.js';
+import { FRAME_PRESENT_BLACK_BACKGROUND, FRAME_PRESENT_FRAME_ORDER, } from '../translations.js';
 let EdgelessNavigatorSettingButton = (() => {
     let _classSuper = WithDisposable(LitElement);
     let __navigatorSettingButton_decorators;
@@ -170,10 +171,13 @@ let EdgelessNavigatorSettingButton = (() => {
             });
         }
         render() {
+            const { std } = this.edgeless;
             return html `
       <edgeless-tool-icon-button
         class="navigator-setting-button"
-        .tooltip=${this.popperShow ? '' : 'Settings'}
+        .tooltip=${this.popperShow
+                ? ''
+                : translateKey(std, ...TOOLBAR_SETTINGS)}
         .iconSize=${'24px'}
         @click=${() => {
                 this._navigatorSettingPopper?.toggle();
@@ -190,11 +194,15 @@ let EdgelessNavigatorSettingButton = (() => {
             }}
       >
         <div class="item-container header">
-          <div class="text title">Playback Settings</div>
+          <div class="text title">
+            ${translateKey(std, ...TOOLBAR_PLAYBACK_SETTINGS)}
+          </div>
         </div>
 
         <div class="item-container">
-          <div class="text">Black background</div>
+          <div class="text">
+            ${translateKey(std, ...FRAME_PRESENT_BLACK_BACKGROUND)}
+          </div>
 
           <toggle-switch
             .on=${this.blackBackground}
@@ -204,7 +212,7 @@ let EdgelessNavigatorSettingButton = (() => {
         </div>
 
         <div class="item-container">
-          <div class="text">Hide toolbar</div>
+          <div class="text">${translateKey(std, ...TOOLBAR_HIDE_TOOLBAR)}</div>
 
           <toggle-switch
             .on=${this.hideToolbar}
@@ -218,7 +226,9 @@ let EdgelessNavigatorSettingButton = (() => {
         ${this.includeFrameOrder
                 ? html ` <div class="divider"></div>
               <div class="item-container header">
-                <div class="text title">Frame Order</div>
+                <div class="text title">
+                  ${translateKey(std, ...FRAME_PRESENT_FRAME_ORDER)}
+                </div>
               </div>
 
               <edgeless-frame-order-menu

package/dist/_pkgs/affine-block-frame/present/present-button.js

@@ -1,7 +1,9 @@
+import { translateKey } from '../../affine-shared/services/index.js';
 import { EdgelessToolbarToolMixin, QuickToolMixin, } from '../../affine-widget-edgeless-toolbar/index.js';
 import { PresentationIcon } from '@blocksuite/icons/lit';
 import { css, html, LitElement } from 'lit';
 import { PresentTool } from '../present-tool.js';
+import { FRAME_PRESENT_TOOL_TOOLTIP } from '../translations.js';
 export class EdgelessPresentButton extends QuickToolMixin(EdgelessToolbarToolMixin(LitElement)) {
     constructor() {
         super(...arguments);
@@ -19,7 +21,7 @@ export class EdgelessPresentButton extends QuickToolMixin(EdgelessToolbarToolMix
     render() {
         return html `<edgeless-tool-icon-button
     class="edgeless-frame-navigator-button"
-    .tooltip=${'Present'}
+    .tooltip=${translateKey(this.edgeless.std, ...FRAME_PRESENT_TOOL_TOOLTIP)}
     .tooltipOffset=${17}
     .iconContainerPadding=${6}
     .iconSize=${'24px'}