@formicoidea/labre-core 0.39.3 → 0.41.0

package/dist/_pkgs/affine-block-surface-ref/translations.js

@@ -0,0 +1,175 @@
+import { DISPLAY_MODE_EDGELESS, EDGELESS_CONTENT_LABEL, MINDMAP_NAME, } from '../affine-shared/services/index.js';
+/**
+ * The "/ Mind Map" slash-menu entry's seeds: the root and child node captions
+ * a freshly inserted mindmap is written with (`configs/slash-menu.ts`).
+ * Resolved at PLACEMENT and never again — a node renamed by its author keeps
+ * its name, and a mindmap inserted before these keys existed keeps the plain
+ * text it was given.
+ */
+export const SURFACE_REF_SEED_MINDMAP_ROOT = [
+    'com.labre.surface-ref.seed.mindmap-root',
+    'Mind Map',
+];
+export const SURFACE_REF_SEED_MINDMAP_NODE = [
+    'com.labre.surface-ref.seed.mindmap-node',
+    'Text',
+];
+/**
+ * This package's contribution to the translation-key manifest, listed in
+ * `PACKAGE_SEED_WORDINGS` under source `seed`
+ * (`packages/affine/all/src/translations.ts`).
+ */
+export const SURFACE_REF_WORDINGS = [
+    SURFACE_REF_SEED_MINDMAP_ROOT,
+    SURFACE_REF_SEED_MINDMAP_NODE,
+];
+/* ── Chrome: the slash-menu items rendered for surface-ref (`configs/slash-menu.ts`) ──
+ *
+ * These are the ITEM's own chrome name/tooltip, distinct from the SEEDS
+ * above: a seed is the text written into a freshly-inserted node, re-keyed
+ * even when it happens to read the same as a menu item's name.
+ */
+/**
+ * The "Mind Map" slash-menu item's own name — the item shown in the menu,
+ * NOT the root node's seed text (`SURFACE_REF_SEED_MINDMAP_ROOT`), which
+ * happens to read the same but is a different concern (see the module doc
+ * above).
+ */
+export const SURFACE_REF_SLASH_MINDMAP_NAME = MINDMAP_NAME;
+export const SURFACE_REF_SLASH_MINDMAP_DESCRIPTION = [
+    'com.labre.surface-ref.slash.mindmap.description',
+    'Insert a mind map',
+];
+export const SURFACE_REF_SLASH_FRAME_DESCRIPTION = [
+    'com.labre.surface-ref.slash.frame.description',
+    'Insert a blank frame',
+];
+/** The tooltip caption shared by the mindmap, frame and group list items. */
+export const SURFACE_REF_SLASH_TOOLTIP_EDGELESS = DISPLAY_MODE_EDGELESS;
+/**
+ * The "Frame: {{title}}" / "Group: {{title}}" list items — a placed frame's
+ * or group's own entry in the slash menu, named after its live title. Was a
+ * string CONCATENATION (`'Frame: ' + frameModel.props.title`) the literal
+ * guard could only half-detect (see `literals.unit.spec.ts`'s ponytail
+ * note); resolving it through the seam removes the literal outright.
+ */
+export const SURFACE_REF_SLASH_FRAME_ITEM_NAME = [
+    'com.labre.surface-ref.slash.frame-item.name',
+    'Frame: {{title}}',
+];
+export const SURFACE_REF_SLASH_GROUP_ITEM_NAME = [
+    'com.labre.surface-ref.slash.group-item.name',
+    'Group: {{title}}',
+];
+/* ── Chrome: the placeholder card (`components/placeholder.ts`) and the
+ * reference-type table it shares with `utils.ts`'s `TYPE_ICON_MAP` ──────── */
+/**
+ * The reference kinds' own display names. `frame` reuses the shared
+ * `TOOLBAR_FRAME` chrome wording (the frame primitive's name, also used by
+ * the `frame` package's own tool and dense-menu entry) rather than a second
+ * key for the same word.
+ */
+export const SURFACE_REF_TYPE_GROUP = [
+    'com.labre.surface-ref.type.group',
+    'Group',
+];
+export const SURFACE_REF_TYPE_MINDMAP = [
+    'com.labre.surface-ref.type.mindmap',
+    'Mind map',
+];
+export const SURFACE_REF_TYPE_EDGELESS = EDGELESS_CONTENT_LABEL;
+/** The title shown when the referenced element is missing entirely. */
+export const SURFACE_REF_PLACEHOLDER_NOT_AVAILABLE = [
+    'com.labre.surface-ref.placeholder.not-available',
+    'This {{type}} not available',
+];
+/**
+ * The body sentence for each kind, once found to be deleted — one full
+ * sentence per kind rather than one interpolated onto a lowercased name: the
+ * lower-casing is a purely English inflection the fallback needs to
+ * reproduce exactly, and a translated host may not have a stable "lowercase"
+ * of a translated noun at all (mirrors `BOARD_LEGEND_NOTATION` /
+ * `BOARD_LEGEND_COMPONENTS` in `chrome.ts`: a full sentence per case rather
+ * than a shared template).
+ */
+export const SURFACE_REF_PLACEHOLDER_DELETED_FRAME = [
+    'com.labre.surface-ref.placeholder.deleted.frame',
+    'The frame is deleted or not in this doc.',
+];
+export const SURFACE_REF_PLACEHOLDER_DELETED_GROUP = [
+    'com.labre.surface-ref.placeholder.deleted.group',
+    'The group is deleted or not in this doc.',
+];
+export const SURFACE_REF_PLACEHOLDER_DELETED_MINDMAP = [
+    'com.labre.surface-ref.placeholder.deleted.mindmap',
+    'The mind map is deleted or not in this doc.',
+];
+export const SURFACE_REF_PLACEHOLDER_DELETED_EDGELESS = [
+    'com.labre.surface-ref.placeholder.deleted.edgeless',
+    'The canvas content is deleted or not in this doc.',
+];
+export const SURFACE_REF_PLACEHOLDER_CANNOT_DISPLAY_FRAME = [
+    'com.labre.surface-ref.placeholder.cannot-display.frame',
+    'The frame is inserted but cannot display in canvas mode. Switch to document mode to view the block.',
+];
+export const SURFACE_REF_PLACEHOLDER_CANNOT_DISPLAY_GROUP = [
+    'com.labre.surface-ref.placeholder.cannot-display.group',
+    'The group is inserted but cannot display in canvas mode. Switch to document mode to view the block.',
+];
+export const SURFACE_REF_PLACEHOLDER_CANNOT_DISPLAY_MINDMAP = [
+    'com.labre.surface-ref.placeholder.cannot-display.mindmap',
+    'The mind map is inserted but cannot display in canvas mode. Switch to document mode to view the block.',
+];
+export const SURFACE_REF_PLACEHOLDER_CANNOT_DISPLAY_EDGELESS = [
+    'com.labre.surface-ref.placeholder.cannot-display.edgeless',
+    'The canvas content is inserted but cannot display in canvas mode. Switch to document mode to view the block.',
+];
+/**
+ * Per-kind table joining the two placeholder sentences above to the
+ * `refFlavour` / `TYPE_ICON_MAP` key they answer for
+ * (`components/placeholder.ts`). The kind's NAME itself is
+ * `TYPE_ICON_MAP[key].wording` (`utils.ts`) — not repeated here.
+ */
+export const SURFACE_REF_TYPE_SENTENCE_WORDINGS = {
+    'affine:frame': {
+        deleted: SURFACE_REF_PLACEHOLDER_DELETED_FRAME,
+        cannotDisplay: SURFACE_REF_PLACEHOLDER_CANNOT_DISPLAY_FRAME,
+    },
+    group: {
+        deleted: SURFACE_REF_PLACEHOLDER_DELETED_GROUP,
+        cannotDisplay: SURFACE_REF_PLACEHOLDER_CANNOT_DISPLAY_GROUP,
+    },
+    mindmap: {
+        deleted: SURFACE_REF_PLACEHOLDER_DELETED_MINDMAP,
+        cannotDisplay: SURFACE_REF_PLACEHOLDER_CANNOT_DISPLAY_MINDMAP,
+    },
+    edgeless: {
+        deleted: SURFACE_REF_PLACEHOLDER_DELETED_EDGELESS,
+        cannotDisplay: SURFACE_REF_PLACEHOLDER_CANNOT_DISPLAY_EDGELESS,
+    },
+};
+/**
+ * This package's CHROME contribution to the translation-key manifest,
+ * listed in `PACKAGE_WORDINGS` under source `chrome`
+ * (`packages/affine/all/src/translations.ts`) — separate from
+ * {@link SURFACE_REF_WORDINGS} above, which stays under `PACKAGE_SEED_WORDINGS`
+ * (source `seed`). `TOOLBAR_FRAME` travels with
+ * `@labre/affine-shared/services` instead, so it is not restated here.
+ */
+export const SURFACE_REF_CHROME_WORDINGS = [
+    SURFACE_REF_SLASH_MINDMAP_DESCRIPTION,
+    SURFACE_REF_SLASH_FRAME_DESCRIPTION,
+    SURFACE_REF_SLASH_FRAME_ITEM_NAME,
+    SURFACE_REF_SLASH_GROUP_ITEM_NAME,
+    SURFACE_REF_TYPE_GROUP,
+    SURFACE_REF_TYPE_MINDMAP,
+    SURFACE_REF_PLACEHOLDER_NOT_AVAILABLE,
+    SURFACE_REF_PLACEHOLDER_DELETED_FRAME,
+    SURFACE_REF_PLACEHOLDER_DELETED_GROUP,
+    SURFACE_REF_PLACEHOLDER_DELETED_MINDMAP,
+    SURFACE_REF_PLACEHOLDER_DELETED_EDGELESS,
+    SURFACE_REF_PLACEHOLDER_CANNOT_DISPLAY_FRAME,
+    SURFACE_REF_PLACEHOLDER_CANNOT_DISPLAY_GROUP,
+    SURFACE_REF_PLACEHOLDER_CANNOT_DISPLAY_MINDMAP,
+    SURFACE_REF_PLACEHOLDER_CANNOT_DISPLAY_EDGELESS,
+];

package/dist/_pkgs/affine-block-surface-ref/utils.d.ts

@@ -1,9 +1,16 @@
+import { type ChromeWording } from '../affine-shared/services/index.js';
 import { type GfxModel } from '../std/gfx/index.js';
 import { type TemplateResult } from 'lit';
 export declare const noContentPlaceholder: TemplateResult<1>;
+/**
+ * `wording`, not a plain `name`: the placeholder card (`components/placeholder.ts`)
+ * resolves it through the seam at render, the same "static config a widget
+ * resolves" pattern `labelWording` follows — the English identity lives in
+ * the wording's own fallback (`translations.ts`) rather than restated here.
+ */
 export declare const TYPE_ICON_MAP: {
     [key: string]: {
-        name: string;
+        wording: ChromeWording;
         icon: TemplateResult;
     };
 };

package/dist/_pkgs/affine-block-surface-ref/utils.js

@@ -1,8 +1,10 @@
 import { isFrameBlock } from '../affine-block-frame/index.js';
 import { GroupElementModel, MindmapElementModel, ShapeElementModel, } from '../affine-model/index.js';
+import { TOOLBAR_FRAME, } from '../affine-shared/services/index.js';
 import { EdgelessIcon, FrameIcon, GroupIcon, MindmapIcon, } from '@blocksuite/icons/lit';
 import {} from '../std/gfx/index.js';
 import { html } from 'lit';
+import { SURFACE_REF_TYPE_EDGELESS, SURFACE_REF_TYPE_GROUP, SURFACE_REF_TYPE_MINDMAP, } from './translations.js';
 export const noContentPlaceholder = html `
   <svg
     width="182"
@@ -100,21 +102,27 @@ export const noContentPlaceholder = html `
     />
   </svg>
 `;
+/**
+ * `wording`, not a plain `name`: the placeholder card (`components/placeholder.ts`)
+ * resolves it through the seam at render, the same "static config a widget
+ * resolves" pattern `labelWording` follows — the English identity lives in
+ * the wording's own fallback (`translations.ts`) rather than restated here.
+ */
 export const TYPE_ICON_MAP = {
     'affine:frame': {
-        name: 'Frame',
+        wording: TOOLBAR_FRAME,
         icon: FrameIcon(),
     },
     group: {
-        name: 'Group',
+        wording: SURFACE_REF_TYPE_GROUP,
         icon: GroupIcon(),
     },
     mindmap: {
-        name: 'Mind map',
+        wording: SURFACE_REF_TYPE_MINDMAP,
         icon: MindmapIcon(),
     },
     edgeless: {
-        name: 'Edgeless content',
+        wording: SURFACE_REF_TYPE_EDGELESS,
         icon: EdgelessIcon(),
     },
 };

package/dist/_pkgs/affine-components/caption/block-caption.js

@@ -32,6 +32,7 @@ var __runInitializers = (this && this.__runInitializers) || function (thisArg, i
     }
     return useValue ? value : void 0;
 };
+import { translateKey } from '../../affine-shared/services/index.js';
 import { stopPropagation } from '../../affine-shared/utils/index.js';
 import { WithDisposable } from '../../global/lit/index.js';
 import { modelContext, ShadowlessElement, stdContext, storeContext, TextSelection, } from '../../std/index.js';
@@ -40,6 +41,7 @@ import { Text } from '../../store/index.js';
 import { consume } from '@lit/context';
 import { css, html, nothing } from 'lit';
 import { query, state } from 'lit/decorators.js';
+import { CAPTION_PLACEHOLDER } from '../translations.js';
 let BlockCaptionEditor = (() => {
     let _classSuper = WithDisposable(ShadowlessElement);
     let _caption_decorators;
@@ -168,7 +170,7 @@ let BlockCaptionEditor = (() => {
             }
             return html `<textarea
       .disabled=${this.doc.readonly}
-      placeholder="Write a caption"
+      placeholder=${translateKey(this.std, ...CAPTION_PLACEHOLDER)}
       class="block-caption-editor"
       .value=${this.caption ?? ''}
       @input=${this._onInputChange}

package/dist/_pkgs/affine-components/card-style-dropdown-menu/dropdown-menu.js

@@ -32,7 +32,7 @@ var __runInitializers = (this && this.__runInitializers) || function (thisArg, i
     }
     return useValue ? value : void 0;
 };
-import { ToolbarContext, } from '../../affine-shared/services/index.js';
+import { ToolbarContext, translateKey, } from '../../affine-shared/services/index.js';
 import { SignalWatcher } from '../../global/lit/index.js';
 import { PaletteIcon } from '@blocksuite/icons/lit';
 import { PropTypes, requiredProperties } from '../../std/index.js';
@@ -43,6 +43,7 @@ import { html } from 'lit-html';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
 import { repeat } from 'lit-html/directives/repeat.js';
 import { EmbedCardDarkCubeIcon, EmbedCardDarkHorizontalIcon, EmbedCardDarkListIcon, EmbedCardDarkVerticalIcon, EmbedCardLightCubeIcon, EmbedCardLightHorizontalIcon, EmbedCardLightListIcon, EmbedCardLightVerticalIcon, } from '../icons/index.js';
+import { CARD_STYLE_LABEL } from '../translations.js';
 const cardStyleMap = {
     light: {
         cube: EmbedCardLightCubeIcon,
@@ -118,8 +119,8 @@ let CardStyleDropdownMenu = (() => {
         .contentPadding="${'8px'}"
         .button=${html `
           <editor-icon-button
-            aria-label="Card style"
-            .tooltip="${'Card style'}"
+            aria-label="${translateKey(context.std, ...CARD_STYLE_LABEL)}"
+            .tooltip="${translateKey(context.std, ...CARD_STYLE_LABEL)}"
           >
             ${PaletteIcon()}
           </editor-icon-button>

package/dist/_pkgs/affine-components/citation/citation.d.ts

@@ -1,6 +1,8 @@
+import type { BlockStdScope } from '../../std/index.js';
 import { LitElement, type TemplateResult } from 'lit';
 declare const CitationCard_base: typeof LitElement & import("../../global/utils/types.js").Constructor<import("../../global/lit/with-disposable.js").DisposableClass>;
 export declare class CitationCard extends CitationCard_base {
+    accessor std: BlockStdScope;
     static styles: import("lit").CSSResult;
     private readonly _IconTemplate;
     render(): TemplateResult<1>;

package/dist/_pkgs/affine-components/citation/citation.js

@@ -32,14 +32,21 @@ var __runInitializers = (this && this.__runInitializers) || function (thisArg, i
     }
     return useValue ? value : void 0;
 };
+import { translateKey } from '../../affine-shared/services/index.js';
 import { unsafeCSSVarV2 } from '../../affine-shared/theme/index.js';
 import { SignalWatcher, WithDisposable } from '../../global/lit/index.js';
+import { stdContext } from '../../std/index.js';
 import { baseTheme } from '@toeverything/theme';
+import { consume } from '@lit/context';
 import { css, html, LitElement, nothing, unsafeCSS, } from 'lit';
 import { property } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
+import { FAVICON_ALT } from '../translations.js';
 let CitationCard = (() => {
     let _classSuper = SignalWatcher(WithDisposable(LitElement));
+    let _std_decorators;
+    let _std_initializers = [];
+    let _std_extraInitializers = [];
     let _icon_decorators;
     let _icon_initializers = [];
     let _icon_extraInitializers = [];
@@ -64,6 +71,7 @@ let CitationCard = (() => {
     return class CitationCard extends _classSuper {
         static {
             const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _std_decorators = [consume({ context: stdContext })];
             _icon_decorators = [property({ attribute: false })];
             _citationTitle_decorators = [property({ attribute: false })];
             _citationContent_decorators = [property({ attribute: false })];
@@ -71,6 +79,7 @@ let CitationCard = (() => {
             _onClickCallback_decorators = [property({ attribute: false })];
             _onDoubleClickCallback_decorators = [property({ attribute: false })];
             _active_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, _icon_decorators, { kind: "accessor", name: "icon", static: false, private: false, access: { has: obj => "icon" in obj, get: obj => obj.icon, set: (obj, value) => { obj.icon = value; } }, metadata: _metadata }, _icon_initializers, _icon_extraInitializers);
             __esDecorate(this, null, _citationTitle_decorators, { kind: "accessor", name: "citationTitle", static: false, private: false, access: { has: obj => "citationTitle" in obj, get: obj => obj.citationTitle, set: (obj, value) => { obj.citationTitle = value; } }, metadata: _metadata }, _citationTitle_initializers, _citationTitle_extraInitializers);
             __esDecorate(this, null, _citationContent_decorators, { kind: "accessor", name: "citationContent", static: false, private: false, access: { has: obj => "citationContent" in obj, get: obj => obj.citationContent, set: (obj, value) => { obj.citationContent = value; } }, metadata: _metadata }, _citationContent_initializers, _citationContent_extraInitializers);
@@ -80,6 +89,9 @@ let CitationCard = (() => {
             __esDecorate(this, null, _active_decorators, { kind: "accessor", name: "active", static: false, private: false, access: { has: obj => "active" in obj, get: obj => obj.active, set: (obj, value) => { obj.active = value; } }, metadata: _metadata }, _active_initializers, _active_extraInitializers);
             if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
         }
+        #std_accessor_storage;
+        get std() { return this.#std_accessor_storage; }
+        set std(value) { this.#std_accessor_storage = value; }
         static { this.styles = css `
     .citation-container {
       width: 100%;
@@ -224,12 +236,16 @@ let CitationCard = (() => {
         set active(value) { this.#active_accessor_storage = value; }
         constructor() {
             super(...arguments);
-            this._IconTemplate = (icon) => {
+            this.#std_accessor_storage = __runInitializers(this, _std_initializers, void 0);
+            this._IconTemplate = (__runInitializers(this, _std_extraInitializers), (icon) => {
                 if (typeof icon === 'string') {
-                    return html `<img src="${icon}" alt="favicon" />`;
+                    const alt = this.std
+                        ? translateKey(this.std, ...FAVICON_ALT)
+                        : FAVICON_ALT[1];
+                    return html `<img src="${icon}" alt="${alt}" />`;
                 }
                 return icon;
-            };
+            });
             this.#icon_accessor_storage = __runInitializers(this, _icon_initializers, undefined);
             this.#citationTitle_accessor_storage = (__runInitializers(this, _icon_extraInitializers), __runInitializers(this, _citationTitle_initializers, ''));
             this.#citationContent_accessor_storage = (__runInitializers(this, _citationTitle_extraInitializers), __runInitializers(this, _citationContent_initializers, undefined));

package/dist/_pkgs/affine-components/color-picker/button.d.ts

@@ -1,4 +1,5 @@
 import type { Color, ColorScheme, Palette } from '../../affine-model/index.js';
+import type { BlockStdScope } from '../../std/index.js';
 import { LitElement } from 'lit';
 import type { EditorMenuButton } from '../toolbar/menu-button.js';
 import type { PickColorEvent } from './types.js';
@@ -25,6 +26,11 @@ export declare class EdgelessColorPickerButton extends EdgelessColorPickerButton
     accessor menuButton: EditorMenuButton;
     accessor palettes: Palette[];
     accessor pick: (event: PickColorEvent) => void;
+    /**
+     * Optional, forwarded to the nested `edgeless-color-panel` — see
+     * `EdgelessColorPanel.std` (`color-panel.ts`) for what it changes.
+     */
+    accessor std: BlockStdScope | undefined;
     accessor tabType: Type;
     accessor theme: ColorScheme;
     accessor tooltip: string | undefined;

package/dist/_pkgs/affine-components/color-picker/button.js

@@ -70,6 +70,9 @@ let EdgelessColorPickerButton = (() => {
     let _pick_decorators;
     let _pick_initializers = [];
     let _pick_extraInitializers = [];
+    let _std_decorators;
+    let _std_initializers = [];
+    let _std_extraInitializers = [];
     let _tabType_decorators;
     let _tabType_initializers = [];
     let _tabType_extraInitializers = [];
@@ -94,6 +97,7 @@ let EdgelessColorPickerButton = (() => {
             _menuButton_decorators = [query('editor-menu-button')];
             _palettes_decorators = [property({ attribute: false })];
             _pick_decorators = [property({ attribute: false })];
+            _std_decorators = [property({ attribute: false })];
             _tabType_decorators = [state()];
             _theme_decorators = [property({ attribute: false })];
             _tooltip_decorators = [property()];
@@ -107,6 +111,7 @@ let EdgelessColorPickerButton = (() => {
             __esDecorate(this, null, _menuButton_decorators, { kind: "accessor", name: "menuButton", static: false, private: false, access: { has: obj => "menuButton" in obj, get: obj => obj.menuButton, set: (obj, value) => { obj.menuButton = value; } }, metadata: _metadata }, _menuButton_initializers, _menuButton_extraInitializers);
             __esDecorate(this, null, _palettes_decorators, { kind: "accessor", name: "palettes", static: false, private: false, access: { has: obj => "palettes" in obj, get: obj => obj.palettes, set: (obj, value) => { obj.palettes = value; } }, metadata: _metadata }, _palettes_initializers, _palettes_extraInitializers);
             __esDecorate(this, null, _pick_decorators, { kind: "accessor", name: "pick", static: false, private: false, access: { has: obj => "pick" in obj, get: obj => obj.pick, set: (obj, value) => { obj.pick = value; } }, metadata: _metadata }, _pick_initializers, _pick_extraInitializers);
+            __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, _tabType_decorators, { kind: "accessor", name: "tabType", static: false, private: false, access: { has: obj => "tabType" in obj, get: obj => obj.tabType, set: (obj, value) => { obj.tabType = value; } }, metadata: _metadata }, _tabType_initializers, _tabType_extraInitializers);
             __esDecorate(this, null, _theme_decorators, { kind: "accessor", name: "theme", static: false, private: false, access: { has: obj => "theme" in obj, get: obj => obj.theme, set: (obj, value) => { obj.theme = value; } }, metadata: _metadata }, _theme_initializers, _theme_extraInitializers);
             __esDecorate(this, null, _tooltip_decorators, { kind: "accessor", name: "tooltip", static: false, private: false, access: { has: obj => "tooltip" in obj, get: obj => obj.tooltip, set: (obj, value) => { obj.tooltip = value; } }, metadata: _metadata }, _tooltip_initializers, _tooltip_extraInitializers);
@@ -183,6 +188,7 @@ let EdgelessColorPickerButton = (() => {
                   .palettes=${this.palettes}
                   .hollowCircle=${this.hollowCircle}
                   .hasTransparent=${false}
+                  .std=${this.std}
                   @select=${this.#select}
                 >
                   ${when(this.enableCustomColor, () => html `
@@ -243,6 +249,13 @@ let EdgelessColorPickerButton = (() => {
         #pick_accessor_storage;
         get pick() { return this.#pick_accessor_storage; }
         set pick(value) { this.#pick_accessor_storage = value; }
+        #std_accessor_storage;
+        /**
+         * Optional, forwarded to the nested `edgeless-color-panel` — see
+         * `EdgelessColorPanel.std` (`color-panel.ts`) for what it changes.
+         */
+        get std() { return this.#std_accessor_storage; }
+        set std(value) { this.#std_accessor_storage = value; }
         #tabType_accessor_storage;
         get tabType() { return this.#tabType_accessor_storage; }
         set tabType(value) { this.#tabType_accessor_storage = value; }
@@ -276,7 +289,8 @@ let EdgelessColorPickerButton = (() => {
             this.#menuButton_accessor_storage = (__runInitializers(this, _label_extraInitializers), __runInitializers(this, _menuButton_initializers, void 0));
             this.#palettes_accessor_storage = (__runInitializers(this, _menuButton_extraInitializers), __runInitializers(this, _palettes_initializers, DefaultTheme.Palettes));
             this.#pick_accessor_storage = (__runInitializers(this, _palettes_extraInitializers), __runInitializers(this, _pick_initializers, void 0));
-            this.#tabType_accessor_storage = (__runInitializers(this, _pick_extraInitializers), __runInitializers(this, _tabType_initializers, 'normal'));
+            this.#std_accessor_storage = (__runInitializers(this, _pick_extraInitializers), __runInitializers(this, _std_initializers, undefined));
+            this.#tabType_accessor_storage = (__runInitializers(this, _std_extraInitializers), __runInitializers(this, _tabType_initializers, 'normal'));
             this.#theme_accessor_storage = (__runInitializers(this, _tabType_extraInitializers), __runInitializers(this, _theme_initializers, void 0));
             this.#tooltip_accessor_storage = (__runInitializers(this, _theme_extraInitializers), __runInitializers(this, _tooltip_initializers, undefined));
             this.#enableCustomColor_accessor_storage = (__runInitializers(this, _tooltip_extraInitializers), __runInitializers(this, _enableCustomColor_initializers, true));

package/dist/_pkgs/affine-components/color-picker/color-panel.d.ts

@@ -1,4 +1,5 @@
 import type { Color, ColorScheme, Palette } from '../../affine-model/index.js';
+import type { BlockStdScope } from '../../std/index.js';
 import { LitElement, type PropertyValues } from 'lit';
 export declare class EdgelessColorButton extends LitElement {
     static styles: import("lit").CSSResult;
@@ -19,6 +20,13 @@ export declare class EdgelessColorPanel extends LitElement {
     accessor hasTransparent: boolean;
     accessor hollowCircle: boolean;
     accessor palettes: readonly Palette[];
+    /**
+     * Optional: with none, every swatch's label resolves to its English
+     * fallback (or, for a swatch neither {@link resolvePaletteLabel} tier
+     * knows, its raw `key`) — exactly the panel's behaviour before this
+     * property existed.
+     */
+    accessor std: BlockStdScope | undefined;
     accessor theme: ColorScheme;
     accessor value: Color | null;
     accessor columns: number | undefined;

package/dist/_pkgs/affine-components/color-picker/color-panel.js

@@ -42,6 +42,7 @@ import { ifDefined } from 'lit/directives/if-defined.js';
 import { repeat } from 'lit/directives/repeat.js';
 import isEqual from 'lodash-es/isEqual.js';
 import { AdditionIcon } from './icons.js';
+import { resolvePaletteLabel } from './utils.js';
 let EdgelessColorButton = (() => {
     let _classSuper = LitElement;
     let _active_decorators;
@@ -186,6 +187,9 @@ let EdgelessColorPanel = (() => {
     let _palettes_decorators;
     let _palettes_initializers = [];
     let _palettes_extraInitializers = [];
+    let _std_decorators;
+    let _std_initializers = [];
+    let _std_extraInitializers = [];
     let _theme_decorators;
     let _theme_initializers = [];
     let _theme_extraInitializers = [];
@@ -201,12 +205,14 @@ let EdgelessColorPanel = (() => {
             _hasTransparent_decorators = [property({ attribute: false })];
             _hollowCircle_decorators = [property({ attribute: false })];
             _palettes_decorators = [property({ type: Array })];
+            _std_decorators = [property({ attribute: false })];
             _theme_decorators = [property({ attribute: false })];
             _value_decorators = [property({ attribute: false })];
             _columns_decorators = [property({ attribute: false })];
             __esDecorate(this, null, _hasTransparent_decorators, { kind: "accessor", name: "hasTransparent", static: false, private: false, access: { has: obj => "hasTransparent" in obj, get: obj => obj.hasTransparent, set: (obj, value) => { obj.hasTransparent = value; } }, metadata: _metadata }, _hasTransparent_initializers, _hasTransparent_extraInitializers);
             __esDecorate(this, null, _hollowCircle_decorators, { kind: "accessor", name: "hollowCircle", static: false, private: false, access: { has: obj => "hollowCircle" in obj, get: obj => obj.hollowCircle, set: (obj, value) => { obj.hollowCircle = value; } }, metadata: _metadata }, _hollowCircle_initializers, _hollowCircle_extraInitializers);
             __esDecorate(this, null, _palettes_decorators, { kind: "accessor", name: "palettes", static: false, private: false, access: { has: obj => "palettes" in obj, get: obj => obj.palettes, set: (obj, value) => { obj.palettes = value; } }, metadata: _metadata }, _palettes_initializers, _palettes_extraInitializers);
+            __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, _theme_decorators, { kind: "accessor", name: "theme", static: false, private: false, access: { has: obj => "theme" in obj, get: obj => obj.theme, set: (obj, value) => { obj.theme = value; } }, metadata: _metadata }, _theme_initializers, _theme_extraInitializers);
             __esDecorate(this, null, _value_decorators, { kind: "accessor", name: "value", static: false, private: false, access: { has: obj => "value" in obj, get: obj => obj.value, set: (obj, value) => { obj.value = value; } }, metadata: _metadata }, _value_initializers, _value_extraInitializers);
             __esDecorate(this, null, _columns_decorators, { kind: "accessor", name: "columns", static: false, private: false, access: { has: obj => "columns" in obj, get: obj => obj.columns, set: (obj, value) => { obj.columns = value; } }, metadata: _metadata }, _columns_initializers, _columns_extraInitializers);
@@ -269,7 +275,7 @@ let EdgelessColorPanel = (() => {
                 const activated = isEqual(resolvedColor, this.resolvedValue);
                 return html `<edgeless-color-button
             class=${classMap({ large: true })}
-            .label=${palette.key}
+            .label=${resolvePaletteLabel(this.std, palette)}
             .color=${palette.value}
             .theme=${this.theme}
             .hollowCircle=${this.hollowCircle}
@@ -293,7 +299,16 @@ let EdgelessColorPanel = (() => {
         #palettes_accessor_storage = (__runInitializers(this, _hollowCircle_extraInitializers), __runInitializers(this, _palettes_initializers, DefaultTheme.Palettes));
         get palettes() { return this.#palettes_accessor_storage; }
         set palettes(value) { this.#palettes_accessor_storage = value; }
-        #theme_accessor_storage = (__runInitializers(this, _palettes_extraInitializers), __runInitializers(this, _theme_initializers, void 0));
+        #std_accessor_storage = (__runInitializers(this, _palettes_extraInitializers), __runInitializers(this, _std_initializers, undefined));
+        /**
+         * Optional: with none, every swatch's label resolves to its English
+         * fallback (or, for a swatch neither {@link resolvePaletteLabel} tier
+         * knows, its raw `key`) — exactly the panel's behaviour before this
+         * property existed.
+         */
+        get std() { return this.#std_accessor_storage; }
+        set std(value) { this.#std_accessor_storage = value; }
+        #theme_accessor_storage = (__runInitializers(this, _std_extraInitializers), __runInitializers(this, _theme_initializers, void 0));
         get theme() { return this.#theme_accessor_storage; }
         set theme(value) { this.#theme_accessor_storage = value; }
         #value_accessor_storage = (__runInitializers(this, _theme_extraInitializers), __runInitializers(this, _value_initializers, null));

package/dist/_pkgs/affine-components/color-picker/color-picker.d.ts

@@ -1,9 +1,13 @@
+import type { BlockStdScope } from '../../std/index.js';
 import { LitElement } from 'lit';
 import type { Hsva, ModeRgba, ModeTab, ModeType, NavType, PickColorEvent, Point, Rgb } from './types.js';
 declare const EdgelessColorPicker_base: typeof LitElement & import("../../global/utils/types.js").Constructor<import("../../global/lit/with-disposable.js").DisposableClass>;
 export declare class EdgelessColorPicker extends EdgelessColorPicker_base {
     #private;
     static styles: import("lit").CSSResult;
+    accessor std: BlockStdScope;
+    private _tabLabel;
+    private _modeLabel;
     firstUpdated(): void;
     render(): import("lit-html").TemplateResult<1>;
     accessor alpha100$: import("@preact/signals-core").ReadonlySignal<string>;

package/dist/_pkgs/affine-components/color-picker/color-picker.js

@@ -32,8 +32,11 @@ var __runInitializers = (this && this.__runInitializers) || function (thisArg, i
     }
     return useValue ? value : void 0;
 };
+import { translateKey } from '../../affine-shared/services/index.js';
 import { on, once, stopPropagation } from '../../affine-shared/utils/index.js';
 import { SignalWatcher, WithDisposable } from '../../global/lit/index.js';
+import { stdContext } from '../../std/index.js';
+import { consume } from '@lit/context';
 import { batch, computed, signal } from '@preact/signals-core';
 import { html, LitElement } from 'lit';
 import { property, query } from 'lit/decorators.js';
@@ -46,12 +49,16 @@ import { AREA_CIRCLE_R, MATCHERS, SLIDER_CIRCLE_R } from './consts.js';
 import { TransparentIcon } from './icons.js';
 import { COLOR_PICKER_STYLE } from './styles.js';
 import { bound01, defaultHsva, eq, hsvaToHex8, hsvaToRgba, linearGradientAt, parseHexToHsva, renderCanvas, rgbaToHex8, rgbaToHsva, rgbToHex, rgbToHsv, } from './utils.js';
+import { COLOR_PICKER_MODE_DARK, COLOR_PICKER_MODE_LIGHT, COLOR_PICKER_MODE_NORMAL, COLOR_PICKER_TAB_COLORS, COLOR_PICKER_TAB_CUSTOM, } from '../translations.js';
 const TABS = [
     { type: 'colors', name: 'Colors' },
     { type: 'custom', name: 'Custom' },
 ];
 let EdgelessColorPicker = (() => {
     let _classSuper = SignalWatcher(WithDisposable(LitElement));
+    let _std_decorators;
+    let _std_initializers = [];
+    let _std_extraInitializers = [];
     let _alphaControl_decorators;
     let _alphaControl_initializers = [];
     let _alphaControl_extraInitializers = [];
@@ -73,12 +80,14 @@ let EdgelessColorPicker = (() => {
     return class EdgelessColorPicker extends _classSuper {
         static {
             const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _std_decorators = [consume({ context: stdContext })];
             _alphaControl_decorators = [query('.color-slider-wrapper.alpha .color-slider')];
             _canvas_decorators = [query('canvas')];
             _colors_decorators = [property({ attribute: false })];
             _hueControl_decorators = [query('.color-slider-wrapper.hue .color-slider')];
             _paletteControl_decorators = [query('.color-palette')];
             _pick_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, _alphaControl_decorators, { kind: "accessor", name: "alphaControl", static: false, private: false, access: { has: obj => "alphaControl" in obj, get: obj => obj.alphaControl, set: (obj, value) => { obj.alphaControl = value; } }, metadata: _metadata }, _alphaControl_initializers, _alphaControl_extraInitializers);
             __esDecorate(this, null, _canvas_decorators, { kind: "accessor", name: "canvas", static: false, private: false, access: { has: obj => "canvas" in obj, get: obj => obj.canvas, set: (obj, value) => { obj.canvas = value; } }, metadata: _metadata }, _canvas_initializers, _canvas_extraInitializers);
             __esDecorate(this, null, _colors_decorators, { kind: "accessor", name: "colors", static: false, private: false, access: { has: obj => "colors" in obj, get: obj => obj.colors, set: (obj, value) => { obj.colors = value; } }, metadata: _metadata }, _colors_initializers, _colors_extraInitializers);
@@ -88,7 +97,22 @@ let EdgelessColorPicker = (() => {
             if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
         }
         static { this.styles = COLOR_PICKER_STYLE; }
-        #alphaRect = new DOMRect();
+        #std_accessor_storage = __runInitializers(this, _std_initializers, void 0);
+        get std() { return this.#std_accessor_storage; }
+        set std(value) { this.#std_accessor_storage = value; }
+        _tabLabel(name) {
+            const wording = name === 'Custom' ? COLOR_PICKER_TAB_CUSTOM : COLOR_PICKER_TAB_COLORS;
+            return this.std ? translateKey(this.std, ...wording) : wording[1];
+        }
+        _modeLabel(name) {
+            const wording = name === 'Light'
+                ? COLOR_PICKER_MODE_LIGHT
+                : name === 'Dark'
+                    ? COLOR_PICKER_MODE_DARK
+                    : COLOR_PICKER_MODE_NORMAL;
+            return this.std ? translateKey(this.std, ...wording) : wording[1];
+        }
+        #alphaRect = (__runInitializers(this, _std_extraInitializers), new DOMRect());
         #editAlpha = (e) => {
             const target = e.target;
             const orignalValue = target.value;
@@ -419,7 +443,7 @@ let EdgelessColorPicker = (() => {
                 ?active=${type === this.navType$.value}
                 @click=${() => this.#switchNavTab(type)}
               >
-                ${name}
+                ${this._tabLabel(name)}
               </button>
             `)}
         </nav>
@@ -439,7 +463,7 @@ let EdgelessColorPicker = (() => {
                   ${TransparentIcon()}
                   <div class="color"></div>
                 </div>
-                <div>${name}</div>
+                <div>${this._modeLabel(name)}</div>
               </button>
             </div>
           `)}