@formicoidea/labre-core 0.42.0 → 0.43.1

package/dist/_pkgs/affine-block-data-view/configs/tooltips.js

@@ -8,7 +8,7 @@ export const ToDoListTooltip = html `<svg width="170" height="68" viewBox="0 0 1
 <g mask="url(#mask0_16460_960)">
 <path fill-rule="evenodd" clip-rule="evenodd" d="M13.6667 19C12.7462 19 12 19.7462 12 20.6667V27.3333C12 28.2538 12.7462 29 13.6667 29H20.3333C21.2538 29 22 28.2538 22 27.3333V20.6667C22 19.7462 21.2538 19 20.3333 19H13.6667ZM12.9091 20.6667C12.9091 20.2483 13.2483 19.9091 13.6667 19.9091H20.3333C20.7517 19.9091 21.0909 20.2483 21.0909 20.6667V27.3333C21.0909 27.7517 20.7517 28.0909 20.3333 28.0909H13.6667C13.2483 28.0909 12.9091 27.7517 12.9091 27.3333V20.6667Z" fill="#77757D"/>
 <text fill="#121212" xml:space="preserve" style="white-space: pre" font-family="Inter" font-size="10" letter-spacing="0px"><tspan x="28" y="27.6364">Here is an example of todo list.</tspan></text>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M12 40.6667C12 39.7462 12.7462 39 13.6667 39H20.3333C21.2538 39 22 39.7462 22 40.6667V47.3333C22 48.2538 21.2538 49 20.3333 49H13.6667C12.7462 49 12 48.2538 12 47.3333V40.6667ZM19.7457 42.5032C19.9232 42.3257 19.9232 42.0379 19.7457 41.8604C19.5681 41.6829 19.2803 41.6829 19.1028 41.8604L16.0909 44.8723L15.2002 43.9816C15.0227 43.8041 14.7349 43.8041 14.5574 43.9816C14.3799 44.1591 14.3799 44.4469 14.5574 44.6244L15.7695 45.8366C15.947 46.0141 16.2348 46.0141 16.4123 45.8366L19.7457 42.5032Z" fill="#1E96EB"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12 40.6667C12 39.7462 12.7462 39 13.6667 39H20.3333C21.2538 39 22 39.7462 22 40.6667V47.3333C22 48.2538 21.2538 49 20.3333 49H13.6667C12.7462 49 12 48.2538 12 47.3333V40.6667ZM19.7457 42.5032C19.9232 42.3257 19.9232 42.0379 19.7457 41.8604C19.5681 41.6829 19.2803 41.6829 19.1028 41.8604L16.0909 44.8723L15.2002 43.9816C15.0227 43.8041 14.7349 43.8041 14.5574 43.9816C14.3799 44.1591 14.3799 44.4469 14.5574 44.6244L15.7695 45.8366C15.947 46.0141 16.2348 46.0141 16.4123 45.8366L19.7457 42.5032Z" fill="var(--affine-primary-color)"/>
 <text fill="#8E8D91" xml:space="preserve" style="white-space: pre" font-family="Inter" font-size="10" letter-spacing="0px"><tspan x="28" y="47.6364">Make a list for building preview.</tspan></text>
 </g>
 </svg>

package/dist/_pkgs/affine-block-database/configs/tooltips.js

@@ -172,7 +172,7 @@ export const ToDoListTooltip = html `<svg width="170" height="68" viewBox="0 0 1
 <g mask="url(#mask0_16460_960)">
 <path fill-rule="evenodd" clip-rule="evenodd" d="M13.6667 19C12.7462 19 12 19.7462 12 20.6667V27.3333C12 28.2538 12.7462 29 13.6667 29H20.3333C21.2538 29 22 28.2538 22 27.3333V20.6667C22 19.7462 21.2538 19 20.3333 19H13.6667ZM12.9091 20.6667C12.9091 20.2483 13.2483 19.9091 13.6667 19.9091H20.3333C20.7517 19.9091 21.0909 20.2483 21.0909 20.6667V27.3333C21.0909 27.7517 20.7517 28.0909 20.3333 28.0909H13.6667C13.2483 28.0909 12.9091 27.7517 12.9091 27.3333V20.6667Z" fill="#77757D"/>
 <text fill="#121212" xml:space="preserve" style="white-space: pre" font-family="Inter" font-size="10" letter-spacing="0px"><tspan x="28" y="27.6364">Here is an example of todo list.</tspan></text>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M12 40.6667C12 39.7462 12.7462 39 13.6667 39H20.3333C21.2538 39 22 39.7462 22 40.6667V47.3333C22 48.2538 21.2538 49 20.3333 49H13.6667C12.7462 49 12 48.2538 12 47.3333V40.6667ZM19.7457 42.5032C19.9232 42.3257 19.9232 42.0379 19.7457 41.8604C19.5681 41.6829 19.2803 41.6829 19.1028 41.8604L16.0909 44.8723L15.2002 43.9816C15.0227 43.8041 14.7349 43.8041 14.5574 43.9816C14.3799 44.1591 14.3799 44.4469 14.5574 44.6244L15.7695 45.8366C15.947 46.0141 16.2348 46.0141 16.4123 45.8366L19.7457 42.5032Z" fill="#1E96EB"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12 40.6667C12 39.7462 12.7462 39 13.6667 39H20.3333C21.2538 39 22 39.7462 22 40.6667V47.3333C22 48.2538 21.2538 49 20.3333 49H13.6667C12.7462 49 12 48.2538 12 47.3333V40.6667ZM19.7457 42.5032C19.9232 42.3257 19.9232 42.0379 19.7457 41.8604C19.5681 41.6829 19.2803 41.6829 19.1028 41.8604L16.0909 44.8723L15.2002 43.9816C15.0227 43.8041 14.7349 43.8041 14.5574 43.9816C14.3799 44.1591 14.3799 44.4469 14.5574 44.6244L15.7695 45.8366C15.947 46.0141 16.2348 46.0141 16.4123 45.8366L19.7457 42.5032Z" fill="var(--affine-primary-color)"/>
 <text fill="#8E8D91" xml:space="preserve" style="white-space: pre" font-family="Inter" font-size="10" letter-spacing="0px"><tspan x="28" y="47.6364">Make a list for building preview.</tspan></text>
 </g>
 </svg>

package/dist/_pkgs/affine-block-edgeless-text/edgeless-text-block.js

@@ -256,10 +256,12 @@ let EdgelessTextBlockComponent = (() => {
             const containerStyle = {
                 transform: `rotate(${rotate}deg)`,
                 transformOrigin: 'center',
-                border: `1px solid ${editing ? 'var(--affine—primary—color, #1e96eb)' : 'transparent'}`,
+                border: `1px solid ${editing ? 'var(--affine-primary-color)' : 'transparent'}`,
                 borderRadius: '4px',
                 boxSizing: 'border-box',
-                boxShadow: editing ? '0px 0px 0px 2px rgba(30, 150, 235, 0.3)' : 'none',
+                boxShadow: editing
+                    ? '0px 0px 0px 2px color-mix(in srgb, var(--affine-primary-color) 30%, transparent)'
+                    : 'none',
                 fontWeight: '400',
                 lineHeight: 'var(--affine-line-height)',
                 minWidth: !hasMaxWidth ? '220px' : undefined,

package/dist/_pkgs/affine-block-embed/common/iframe-sandbox.d.ts

@@ -0,0 +1,39 @@
+/**
+ * The iframe sandbox policy of every embed block, in one place.
+ *
+ * Every `<iframe>` this package renders points at a third party, so every one
+ * of them is sandboxed. The three values below are the only levels there are;
+ * see `docs/adr/0028-iframe-sandbox-policy.md` for why.
+ *
+ * These constants used to live inside `embed-iframe-block/`, out of reach of
+ * the sibling blocks of the same package — which is how the dedicated
+ * YouTube / Figma / Loom players were shipped with no sandbox at all until
+ * issue #389. The policy belongs to the package, not to one block.
+ */
+/**
+ * Sandbox granted to an embed served by a known provider (spotify, miro, …)
+ * through `EmbedIframeConfig`. A provider may widen it through its own
+ * `sandbox` option.
+ */
+export declare const TRUSTED_SANDBOX = "allow-same-origin allow-scripts allow-forms allow-presentation";
+/**
+ * Sandbox granted to an arbitrary url: the generic provider, or no provider at
+ * all. Without `allow-same-origin` the frame runs on an opaque origin.
+ */
+export declare const UNTRUSTED_SANDBOX = "allow-scripts";
+/**
+ * Sandbox granted to the dedicated third-party players whose `src` is built
+ * from a fixed, hard-coded origin (`www.youtube.com`, `www.figma.com`,
+ * `www.loom.com`): they never go through `EmbedIframeConfig`, so this is the
+ * only place their policy is written.
+ *
+ * `allow-same-origin` is not negotiable: without it the YouTube player fails
+ * to start (`Cache storage is disabled because the context is sandboxed`) and
+ * paints a black frame. It is safe here precisely because the origin is fixed
+ * and cross-origin to the host — the frame keeps its own origin and cannot
+ * reach the host document.
+ *
+ * It is `TRUSTED_SANDBOX` minus `allow-forms`: none of these three players has
+ * a form to submit, so the capability is not granted.
+ */
+export declare const PROVIDER_PLAYER_SANDBOX = "allow-same-origin allow-scripts allow-presentation";

package/dist/_pkgs/affine-block-embed/common/iframe-sandbox.js

@@ -0,0 +1,39 @@
+/**
+ * The iframe sandbox policy of every embed block, in one place.
+ *
+ * Every `<iframe>` this package renders points at a third party, so every one
+ * of them is sandboxed. The three values below are the only levels there are;
+ * see `docs/adr/0028-iframe-sandbox-policy.md` for why.
+ *
+ * These constants used to live inside `embed-iframe-block/`, out of reach of
+ * the sibling blocks of the same package — which is how the dedicated
+ * YouTube / Figma / Loom players were shipped with no sandbox at all until
+ * issue #389. The policy belongs to the package, not to one block.
+ */
+/**
+ * Sandbox granted to an embed served by a known provider (spotify, miro, …)
+ * through `EmbedIframeConfig`. A provider may widen it through its own
+ * `sandbox` option.
+ */
+export const TRUSTED_SANDBOX = 'allow-same-origin allow-scripts allow-forms allow-presentation';
+/**
+ * Sandbox granted to an arbitrary url: the generic provider, or no provider at
+ * all. Without `allow-same-origin` the frame runs on an opaque origin.
+ */
+export const UNTRUSTED_SANDBOX = 'allow-scripts';
+/**
+ * Sandbox granted to the dedicated third-party players whose `src` is built
+ * from a fixed, hard-coded origin (`www.youtube.com`, `www.figma.com`,
+ * `www.loom.com`): they never go through `EmbedIframeConfig`, so this is the
+ * only place their policy is written.
+ *
+ * `allow-same-origin` is not negotiable: without it the YouTube player fails
+ * to start (`Cache storage is disabled because the context is sandboxed`) and
+ * paints a black frame. It is safe here precisely because the origin is fixed
+ * and cross-origin to the host — the frame keeps its own origin and cannot
+ * reach the host document.
+ *
+ * It is `TRUSTED_SANDBOX` minus `allow-forms`: none of these three players has
+ * a form to submit, so the capability is not granted.
+ */
+export const PROVIDER_PLAYER_SANDBOX = 'allow-same-origin allow-scripts allow-presentation';

package/dist/_pkgs/affine-block-embed/embed-figma-block/embed-figma-block.js

@@ -4,6 +4,7 @@ import { BlockSelection } from '../../std/index.js';
 import { html, nothing } from 'lit';
 import { classMap } from 'lit/directives/class-map.js';
 import { EmbedBlockComponent } from '../common/embed-block-element.js';
+import { PROVIDER_PLAYER_SANDBOX } from '../common/iframe-sandbox.js';
 import { FigmaIcon, styles } from './styles.js';
 export class EmbedFigmaBlockComponent extends EmbedBlockComponent {
     constructor() {
@@ -69,6 +70,7 @@ export class EmbedFigmaBlockComponent extends EmbedBlockComponent {
                 allowfullscreen
                 loading="lazy"
                 credentialless
+                sandbox=${PROVIDER_PLAYER_SANDBOX}
               ></iframe>
 
               <!-- overlay to prevent the iframe from capturing pointer events -->

package/dist/_pkgs/affine-block-embed/embed-iframe-block/components/embed-iframe-error-card.d.ts

@@ -1,7 +1,20 @@
 import type { EmbedIframeBlockModel } from '../../../affine-model/index.js';
 import type { BlockStdScope } from '../../../std/index.js';
 import { LitElement } from 'lit';
-import type { EmbedIframeStatusCardOptions } from '../types.js';
+import { type EmbedIframeStatusCardOptions } from '../types.js';
+/**
+ * The sentence the error card draws under its (translated) title — #390.
+ *
+ * The card used to render `error.message` raw, which put an English developer
+ * sentence under a French heading. An {@link EmbedIframeError} that declared a
+ * `messageKey` is resolved through it, with its own `message` as the English
+ * fallback; anything else — a plain `Error`, a `BlockSuiteError`, a DI wiring
+ * failure — reads one keyed sentence, and its `message` is NEVER displayed.
+ *
+ * A free function rather than a method so the contract can be tested without
+ * mounting a custom element.
+ */
+export declare function embedIframeErrorMessage(std: BlockStdScope, error?: Error | null): string;
 declare const EmbedIframeErrorCard_base: typeof LitElement & import("../../../global/utils/types.js").Constructor<import("../../../global/lit/with-disposable.js").DisposableClass>;
 export declare class EmbedIframeErrorCard extends EmbedIframeErrorCard_base {
     static styles: import("lit").CSSResult;

package/dist/_pkgs/affine-block-embed/embed-iframe-block/components/embed-iframe-error-card.js

@@ -44,8 +44,27 @@ import { property, query } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { styleMap } from 'lit/directives/style-map.js';
 import { ERROR_CARD_DEFAULT_HEIGHT } from '../consts.js';
-import { EMBED_IFRAME_ERROR_EDIT, EMBED_IFRAME_ERROR_TITLE, } from '../../translations.js';
+import { EmbedIframeError } from '../types.js';
+import { EMBED_IFRAME_ERROR_EDIT, EMBED_IFRAME_ERROR_FALLBACK, EMBED_IFRAME_ERROR_TITLE, } from '../../translations.js';
 const LINK_EDIT_POPUP_OFFSET = 12;
+/**
+ * The sentence the error card draws under its (translated) title — #390.
+ *
+ * The card used to render `error.message` raw, which put an English developer
+ * sentence under a French heading. An {@link EmbedIframeError} that declared a
+ * `messageKey` is resolved through it, with its own `message` as the English
+ * fallback; anything else — a plain `Error`, a `BlockSuiteError`, a DI wiring
+ * failure — reads one keyed sentence, and its `message` is NEVER displayed.
+ *
+ * A free function rather than a method so the contract can be tested without
+ * mounting a custom element.
+ */
+export function embedIframeErrorMessage(std, error) {
+    if (error instanceof EmbedIframeError && error.messageKey) {
+        return translateKey(std, error.messageKey, error.message);
+    }
+    return translateKey(std, ...EMBED_IFRAME_ERROR_FALLBACK);
+}
 let EmbedIframeErrorCard = (() => {
     let _classSuper = WithDisposable(LitElement);
     let __editButton_decorators;
@@ -268,7 +287,7 @@ let EmbedIframeErrorCard = (() => {
             >
           </div>
           <div class="error-message">
-            ${this.error?.message || 'Failed to load embedded content'}
+            ${embedIframeErrorMessage(this.std, this.error)}
           </div>
           <div class="error-info">
             ${this.readonly

package/dist/_pkgs/affine-block-embed/embed-iframe-block/consts.d.ts

@@ -4,8 +4,6 @@ export declare const EMBED_IFRAME_DEFAULT_CONTAINER_BORDER_RADIUS = 8;
 export declare const DEFAULT_IFRAME_HEIGHT = 152;
 export declare const DEFAULT_IFRAME_WIDTH = "100%";
 export declare const LINK_CREATE_POPUP_OFFSET = 4;
-export declare const TRUSTED_SANDBOX = "allow-same-origin allow-scripts allow-forms allow-presentation";
-export declare const UNTRUSTED_SANDBOX = "allow-scripts";
 export declare const IDLE_CARD_DEFAULT_HEIGHT = 48;
 export declare const LOADING_CARD_DEFAULT_HEIGHT = 114;
 export declare const ERROR_CARD_DEFAULT_HEIGHT = 114;

package/dist/_pkgs/affine-block-embed/embed-iframe-block/consts.js

@@ -4,11 +4,8 @@ export const EMBED_IFRAME_DEFAULT_CONTAINER_BORDER_RADIUS = 8;
 export const DEFAULT_IFRAME_HEIGHT = 152;
 export const DEFAULT_IFRAME_WIDTH = '100%';
 export const LINK_CREATE_POPUP_OFFSET = 4;
-// Sandbox granted to an embed served by a known provider (spotify, miro, …).
-export const TRUSTED_SANDBOX = 'allow-same-origin allow-scripts allow-forms allow-presentation';
-// Sandbox granted to an arbitrary url: the generic provider, or no provider at
-// all. Without `allow-same-origin` the frame runs on an opaque origin.
-export const UNTRUSTED_SANDBOX = 'allow-scripts';
+// The sandbox policy now lives at `../common/iframe-sandbox.ts`, so that every
+// block of this package can read it (issue #389).
 export const IDLE_CARD_DEFAULT_HEIGHT = 48;
 export const LOADING_CARD_DEFAULT_HEIGHT = 114;
 export const ERROR_CARD_DEFAULT_HEIGHT = 114;

package/dist/_pkgs/affine-block-embed/embed-iframe-block/embed-iframe-block.d.ts

@@ -4,7 +4,7 @@ import { EmbedIframeService, type IframeOptions } from '../../affine-shared/serv
 import { type ReadonlySignal } from '@preact/signals-core';
 import { type ClassInfo } from 'lit/directives/class-map.js';
 import type { EmbedLinkInputPopupOptions } from './components/embed-iframe-link-input-popup.js';
-import type { EmbedIframeStatusCardOptions } from './types.js';
+import { type EmbedIframeStatusCardOptions } from './types.js';
 export type EmbedIframeStatus = 'idle' | 'loading' | 'success' | 'error';
 export declare class EmbedIframeBlockComponent extends CaptionedBlockComponent<EmbedIframeBlockModel> {
     selectedStyle$: ReadonlySignal<ClassInfo> | null;

package/dist/_pkgs/affine-block-embed/embed-iframe-block/embed-iframe-block.js

@@ -37,7 +37,6 @@ import { CaptionedBlockComponent, SelectedStyle, } from '../../affine-components
 import { createLitPortal } from '../../affine-components/portal/index.js';
 import { EmbedIframeService, LinkPreviewServiceIdentifier, NotificationProvider, TOAST_NO_LINK_FOUND, translateKey, } from '../../affine-shared/services/index.js';
 import { matchModels, shouldRefreshOnPropsUpdate, } from '../../affine-shared/utils/index.js';
-import { BlockSuiteError, ErrorCode } from '../../global/exceptions/index.js';
 import { BlockSelection } from '../../std/index.js';
 import { flip, offset, shift } from '@floating-ui/dom';
 import { computed, effect, signal, } from '@preact/signals-core';
@@ -46,10 +45,12 @@ import { query } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { styleMap } from 'lit/directives/style-map.js';
-import { DEFAULT_IFRAME_HEIGHT, DEFAULT_IFRAME_WIDTH, EMBED_IFRAME_DEFAULT_CONTAINER_BORDER_RADIUS, ERROR_CARD_DEFAULT_HEIGHT, IDLE_CARD_DEFAULT_HEIGHT, LINK_CREATE_POPUP_OFFSET, LOADING_CARD_DEFAULT_HEIGHT, TRUSTED_SANDBOX, UNTRUSTED_SANDBOX, } from './consts.js';
+import { DEFAULT_IFRAME_HEIGHT, DEFAULT_IFRAME_WIDTH, EMBED_IFRAME_DEFAULT_CONTAINER_BORDER_RADIUS, ERROR_CARD_DEFAULT_HEIGHT, IDLE_CARD_DEFAULT_HEIGHT, LINK_CREATE_POPUP_OFFSET, LOADING_CARD_DEFAULT_HEIGHT, } from './consts.js';
 import { embedIframeBlockStyles } from './style.js';
+import { EmbedIframeError, } from './types.js';
 import { isSafeEmbedUrl, safeGetIframeSrc } from './utils.js';
-import { EMBED_IFRAME_NO_LINK_MESSAGE } from '../translations.js';
+import { TRUSTED_SANDBOX, UNTRUSTED_SANDBOX, } from '../common/iframe-sandbox.js';
+import { EMBED_IFRAME_ERROR_INVALID_URL, EMBED_IFRAME_ERROR_NO_DATA, EMBED_IFRAME_NO_LINK_MESSAGE, } from '../translations.js';
 let EmbedIframeBlockComponent = (() => {
     let _classSuper = CaptionedBlockComponent;
     let __blockContainer_decorators;
@@ -249,7 +250,10 @@ let EmbedIframeBlockComponent = (() => {
                     const embedIframeService = this.embedIframeService;
                     const linkPreviewService = this.linkPreviewService;
                     if (!embedIframeService || !linkPreviewService) {
-                        throw new BlockSuiteError(ErrorCode.ValueNotExists, 'EmbedIframeService or LinkPreviewService not found');
+                        // A DI wiring failure, never a user-facing fact: it declares NO
+                        // `messageKey`, so the card shows its generic keyed sentence and this
+                        // technical one stays where a developer reads it (#390).
+                        throw new EmbedIframeError('EmbedIframeService or LinkPreviewService not found');
                     }
                     // get embed data and preview data in a promise
                     const [embedData, previewData] = await Promise.all([
@@ -259,7 +263,9 @@ let EmbedIframeBlockComponent = (() => {
                     // if the embed data is not found, and the iframeUrl is not set, throw an error
                     const currentIframeUrl = this.model.props.iframeUrl;
                     if (!embedData && !currentIframeUrl) {
-                        throw new BlockSuiteError(ErrorCode.ValueNotExists, 'Failed to get embed data');
+                        throw new EmbedIframeError(EMBED_IFRAME_ERROR_NO_DATA[1], {
+                            messageKey: EMBED_IFRAME_ERROR_NO_DATA[0],
+                        });
                     }
                     // update model
                     const iframeUrl = this._getIframeUrl(embedData) ?? currentIframeUrl;
@@ -366,7 +372,9 @@ let EmbedIframeBlockComponent = (() => {
                 // the url comes from the document: refuse to give a non http(s) one to src
                 if (!isSafeEmbedUrl(iframeUrl)) {
                     return html `<embed-iframe-error-card
-        .error=${new Error('Invalid iframe URL')}
+        .error=${new EmbedIframeError(EMBED_IFRAME_ERROR_INVALID_URL[1], {
+                        messageKey: EMBED_IFRAME_ERROR_INVALID_URL[0],
+                    })}
         .model=${this.model}
         .onRetry=${this._handleRetry}
         .std=${this.std}

package/dist/_pkgs/affine-block-embed/embed-iframe-block/types.d.ts

@@ -14,3 +14,19 @@ export type EmbedIframeStatusCardOptions = {
     width?: number;
     height?: number;
 };
+/**
+ * An embed failure that names its own sentence — the `InterchangeImportError`
+ * pattern (`blocks/surface/src/extensions/interchange.ts`) applied to the
+ * iframe error card (#390).
+ *
+ * `message` stays the English developer sentence (the console, a test's
+ * assertion); `messageKey` is what the CARD renders. An error without a key
+ * renders `EMBED_IFRAME_ERROR_FALLBACK`, never its `message`: a sentence
+ * written for a developer has no business under a translated title.
+ */
+export declare class EmbedIframeError extends Error {
+    readonly messageKey?: string;
+    constructor(message: string, options?: {
+        messageKey?: string;
+    });
+}

package/dist/_pkgs/affine-block-embed/embed-iframe-block/types.js

@@ -1 +1,17 @@
-export {};
+/**
+ * An embed failure that names its own sentence — the `InterchangeImportError`
+ * pattern (`blocks/surface/src/extensions/interchange.ts`) applied to the
+ * iframe error card (#390).
+ *
+ * `message` stays the English developer sentence (the console, a test's
+ * assertion); `messageKey` is what the CARD renders. An error without a key
+ * renders `EMBED_IFRAME_ERROR_FALLBACK`, never its `message`: a sentence
+ * written for a developer has no business under a translated title.
+ */
+export class EmbedIframeError extends Error {
+    constructor(message, options) {
+        super(message);
+        this.name = 'EmbedIframeError';
+        this.messageKey = options?.messageKey;
+    }
+}

package/dist/_pkgs/affine-block-embed/embed-loom-block/embed-loom-block.js

@@ -42,6 +42,7 @@ import { property } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { styleMap } from 'lit/directives/style-map.js';
 import { EmbedBlockComponent } from '../common/embed-block-element.js';
+import { PROVIDER_PLAYER_SANDBOX } from '../common/iframe-sandbox.js';
 import { getEmbedCardIcons } from '../common/utils.js';
 import { loomUrlRegex } from './embed-loom-model.js';
 import { LoomIcon, styles } from './styles.js';
@@ -136,6 +137,7 @@ let EmbedLoomBlockComponent = (() => {
                       allow="fullscreen; accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
                       loading="lazy"
                       credentialless
+                      sandbox=${PROVIDER_PLAYER_SANDBOX}
                     ></iframe>
 
                     <!-- overlay to prevent the iframe from capturing pointer events -->

package/dist/_pkgs/affine-block-embed/embed-youtube-block/embed-youtube-block.js

@@ -42,6 +42,7 @@ import { property, state } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { styleMap } from 'lit/directives/style-map.js';
 import { EmbedBlockComponent } from '../common/embed-block-element.js';
+import { PROVIDER_PLAYER_SANDBOX } from '../common/iframe-sandbox.js';
 import { getEmbedCardIcons } from '../common/utils.js';
 import { youtubeUrlRegex } from './embed-youtube-model.js';
 import { styles, YoutubeIcon } from './styles.js';
@@ -153,6 +154,7 @@ let EmbedYoutubeBlockComponent = (() => {
                       allowfullscreen
                       loading="lazy"
                       credentialless
+                      sandbox=${PROVIDER_PLAYER_SANDBOX}
                     ></iframe>
 
                     <!-- overlay to prevent the iframe from capturing pointer events -->

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

@@ -3,6 +3,7 @@ export { createEmbedBlockMarkdownAdapterMatcher } from './common/adapters/markdo
 export { createEmbedBlockPlainTextAdapterMatcher } from './common/adapters/plain-text.js';
 export { createEmbedEdgelessBlockInteraction, EmbedBlockComponent, } from './common/embed-block-element.js';
 export * from './common/embed-note-content-styles.js';
+export { PROVIDER_PLAYER_SANDBOX, TRUSTED_SANDBOX, UNTRUSTED_SANDBOX, } from './common/iframe-sandbox.js';
 export { insertEmbedCard } from './common/insert-embed-card.js';
 export * from './common/render-linked-doc.js';
 export { toEdgelessEmbedBlock } from './common/to-edgeless-embed-block.js';

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

@@ -3,6 +3,7 @@ export { createEmbedBlockMarkdownAdapterMatcher } from './common/adapters/markdo
 export { createEmbedBlockPlainTextAdapterMatcher } from './common/adapters/plain-text.js';
 export { createEmbedEdgelessBlockInteraction, EmbedBlockComponent, } from './common/embed-block-element.js';
 export * from './common/embed-note-content-styles.js';
+export { PROVIDER_PLAYER_SANDBOX, TRUSTED_SANDBOX, UNTRUSTED_SANDBOX, } from './common/iframe-sandbox.js';
 export { insertEmbedCard } from './common/insert-embed-card.js';
 export * from './common/render-linked-doc.js';
 export { toEdgelessEmbedBlock } from './common/to-edgeless-embed-block.js';

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

@@ -18,6 +18,14 @@ export declare const EMBED_IFRAME_SLASH_NAME: ChromeWording;
 export declare const EMBED_IFRAME_SLASH_DESCRIPTION: ChromeWording;
 export declare const EMBED_IFRAME_ERROR_TITLE: ChromeWording;
 export declare const EMBED_IFRAME_ERROR_EDIT: ChromeWording;
+export declare const EMBED_IFRAME_ERROR_NO_DATA: ChromeWording;
+export declare const EMBED_IFRAME_ERROR_INVALID_URL: ChromeWording;
+/**
+ * What the card says for any error that declares no key of its own —
+ * including the DI wiring failure ("EmbedIframeService or LinkPreviewService
+ * not found"), which is never a user-facing fact and stays in the console.
+ */
+export declare const EMBED_IFRAME_ERROR_FALLBACK: ChromeWording;
 export declare const EMBED_IFRAME_IDLE_TEXT: ChromeWording;
 export declare const EMBED_IFRAME_INVALID_URL_TITLE: ChromeWording;
 export declare const EMBED_IFRAME_INVALID_URL_MESSAGE: ChromeWording;

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

@@ -39,6 +39,31 @@ export const EMBED_IFRAME_ERROR_TITLE = [
     'This link couldn’t be loaded.',
 ];
 export const EMBED_IFRAME_ERROR_EDIT = TOOLBAR_EDIT;
+/* ── The error card's own sentence (#390) ─────────────────────────────────
+ *
+ * The card used to render `error.message` raw — a developer sentence thrown
+ * by `refreshData`, drawn under a translated title. An `EmbedIframeError`
+ * carries a `messageKey` instead (the `InterchangeImportError` pattern,
+ * `blocks/surface/src/extensions/interchange.ts`), and the card resolves the
+ * key or this fallback, never the raw `message`.
+ */
+export const EMBED_IFRAME_ERROR_NO_DATA = [
+    'com.labre.embed.iframe.error.no-embed-data',
+    'Failed to get embed data',
+];
+export const EMBED_IFRAME_ERROR_INVALID_URL = [
+    'com.labre.embed.iframe.error.invalid-url',
+    'Invalid iframe URL',
+];
+/**
+ * What the card says for any error that declares no key of its own —
+ * including the DI wiring failure ("EmbedIframeService or LinkPreviewService
+ * not found"), which is never a user-facing fact and stays in the console.
+ */
+export const EMBED_IFRAME_ERROR_FALLBACK = [
+    'com.labre.embed.iframe.error.message',
+    'Failed to load embedded content',
+];
 export const EMBED_IFRAME_IDLE_TEXT = [
     'com.labre.embed.iframe.idle.text',
     'Embed anything (Google Drive, Google Docs, Spotify, Miro…)',
@@ -101,6 +126,9 @@ export const EMBED_WORDINGS = [
     EMBED_IFRAME_SLASH_NAME,
     EMBED_IFRAME_SLASH_DESCRIPTION,
     EMBED_IFRAME_ERROR_TITLE,
+    EMBED_IFRAME_ERROR_NO_DATA,
+    EMBED_IFRAME_ERROR_INVALID_URL,
+    EMBED_IFRAME_ERROR_FALLBACK,
     EMBED_IFRAME_IDLE_TEXT,
     EMBED_IFRAME_INVALID_URL_TITLE,
     EMBED_IFRAME_INVALID_URL_MESSAGE,

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

@@ -38,7 +38,7 @@ import { LoadingIcon } from '../../affine-components/icons/index.js';
 import { isPeekable, Peekable } from '../../affine-components/peek/index.js';
 import { RefNodeSlotsProvider } from '../../affine-inline-reference/index.js';
 import { EMBED_CARD_HEIGHT, EMBED_CARD_WIDTH, REFERENCE_NODE, } from '../../affine-shared/consts/index.js';
-import { CHROME_LOADING, CitationProvider, DocDisplayMetaProvider, DocModeProvider, LINKED_DOC_DELETED, LINKED_DOC_EMPTY_PREVIEW, LINKED_DOC_FAILED, OpenDocExtensionIdentifier, ThemeProvider, TOOLBAR_RELOAD, translateKey, whenLinkedDocContentReady, } from '../../affine-shared/services/index.js';
+import { CHROME_LOADING, CHROME_UNTITLED, CitationProvider, DocDisplayMetaProvider, DocModeProvider, LINKED_DOC_DELETED, LINKED_DOC_EMPTY_PREVIEW, LINKED_DOC_FAILED, OpenDocExtensionIdentifier, ThemeProvider, TOOLBAR_RELOAD, translateKey, whenLinkedDocContentReady, } from '../../affine-shared/services/index.js';
 import { cloneReferenceInfo, cloneReferenceInfoWithoutAliases, isNewTabTrigger, isNewViewTrigger, matchModels, referenceToNode, } from '../../affine-shared/utils/index.js';
 import { Bound } from '../../global/gfx/index.js';
 import { ResetIcon } from '@blocksuite/icons/lit';
@@ -118,7 +118,9 @@ let EmbedLinkedDocBlockComponent = (() => {
         }
         static { this.styles = styles; }
         get docTitle() {
-            return this.model.props.title || this.linkedDoc?.meta?.title || 'Untitled';
+            return (this.model.props.title ||
+                this.linkedDoc?.meta?.title ||
+                translateKey(this.std, ...CHROME_UNTITLED));
         }
         get editorMode() {
             return this._linkedDocMode;

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, translateKey, } from '../../affine-shared/services/index.js';
+import { CHROME_UNTITLED, 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';
@@ -405,7 +405,7 @@ let EmbedSyncedDocBlockComponent = (() => {
             };
         }
         get docTitle() {
-            return this.syncedDoc?.meta?.title || 'Untitled';
+            return (this.syncedDoc?.meta?.title || translateKey(this.std, ...CHROME_UNTITLED));
         }
         get docUpdatedAt() {
             return this._docUpdatedAt;

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

@@ -1,6 +1,6 @@
 import { indexOverBackgrounds, Overlay, stackedElementsOf, } from '../affine-block-surface/index.js';
 import { FrameworkBackgroundElementModel } from '../affine-model/index.js';
-import { EditPropsStore, translateKey } from '../affine-shared/services/index.js';
+import { EditPropsStore, getChromeAccentColor, 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';
@@ -65,7 +65,10 @@ export class FrameOverlay extends Overlay {
     }
     render(ctx) {
         ctx.beginPath();
-        ctx.strokeStyle = '#1E96EB';
+        // The accent read from the theme, not a literal: a canvas context cannot
+        // take a `var(…)`, so the token is resolved here (DESIGN.md, The Borrowed
+        // Blue Rule).
+        ctx.strokeStyle = getChromeAccentColor(this.gfx.std);
         ctx.lineWidth = 2 / this.gfx.viewport.zoom;
         const radius = 2 / this.gfx.viewport.zoom;
         if (this._frame) {

package/dist/_pkgs/affine-block-list/utils/get-list-icon.js

@@ -42,7 +42,9 @@ export function getListIcon(model, showChildren, onClick) {
         @click=${onClick}
       >
         ${model.props.checked
-                ? CheckBoxCheckSolidIcon({ style: 'color: #1E96EB' })
+                ? CheckBoxCheckSolidIcon({
+                    style: 'color: var(--affine-primary-color)',
+                })
                 : CheckBoxUnIcon()}
       </div>`;
         case 'toggle':

package/dist/_pkgs/affine-block-note/configs/tooltips.js

@@ -262,7 +262,7 @@ export const TodoTooltip = html `<svg width="170" height="68" viewBox="0 0 170 6
 <g mask="url(#mask0_5604_203551)">
 <path fill-rule="evenodd" clip-rule="evenodd" d="M13.6667 19C12.7462 19 12 19.7462 12 20.6667V27.3333C12 28.2538 12.7462 29 13.6667 29H20.3333C21.2538 29 22 28.2538 22 27.3333V20.6667C22 19.7462 21.2538 19 20.3333 19H13.6667ZM12.9091 20.6667C12.9091 20.2483 13.2483 19.9091 13.6667 19.9091H20.3333C20.7517 19.9091 21.0909 20.2483 21.0909 20.6667V27.3333C21.0909 27.7517 20.7517 28.0909 20.3333 28.0909H13.6667C13.2483 28.0909 12.9091 27.7517 12.9091 27.3333V20.6667Z" fill="#77757D"/>
 <rect x="28" y="20.1364" width="142" height="8" rx="4" fill="#121212" fill-opacity="0.3"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M12 40.6667C12 39.7462 12.7462 39 13.6667 39H20.3333C21.2538 39 22 39.7462 22 40.6667V47.3333C22 48.2538 21.2538 49 20.3333 49H13.6667C12.7462 49 12 48.2538 12 47.3333V40.6667ZM19.7457 42.5032C19.9232 42.3257 19.9232 42.0379 19.7457 41.8604C19.5681 41.6829 19.2803 41.6829 19.1028 41.8604L16.0909 44.8723L15.2002 43.9816C15.0227 43.8041 14.7349 43.8041 14.5574 43.9816C14.3799 44.1591 14.3799 44.4469 14.5574 44.6244L15.7695 45.8366C15.947 46.0141 16.2348 46.0141 16.4123 45.8366L19.7457 42.5032Z" fill="#1E96EB"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12 40.6667C12 39.7462 12.7462 39 13.6667 39H20.3333C21.2538 39 22 39.7462 22 40.6667V47.3333C22 48.2538 21.2538 49 20.3333 49H13.6667C12.7462 49 12 48.2538 12 47.3333V40.6667ZM19.7457 42.5032C19.9232 42.3257 19.9232 42.0379 19.7457 41.8604C19.5681 41.6829 19.2803 41.6829 19.1028 41.8604L16.0909 44.8723L15.2002 43.9816C15.0227 43.8041 14.7349 43.8041 14.5574 43.9816C14.3799 44.1591 14.3799 44.4469 14.5574 44.6244L15.7695 45.8366C15.947 46.0141 16.2348 46.0141 16.4123 45.8366L19.7457 42.5032Z" fill="var(--affine-primary-color)"/>
 <rect x="28" y="40.1364" width="142" height="8" rx="4" fill="#8E8D91" fill-opacity="0.55"/>
 </g>
 </svg>

package/dist/_pkgs/affine-block-root/adapters/html.js

@@ -49,7 +49,7 @@ export const rootBlockHtmlAdapterMatcher = {
               display: none;
             }
             label:before {
-              background: rgb(30, 150, 235);
+              background: var(--affine-primary-color, rgb(30, 150, 235));
               border-radius: 3px;
               height: 16px;
               width: 16px;
@@ -58,7 +58,7 @@ export const rootBlockHtmlAdapterMatcher = {
             }
             input[type='checkbox'] + label:before {
               content: '';
-              background: rgb(30, 150, 235);
+              background: var(--affine-primary-color, rgb(30, 150, 235));
               color: #fff;
               font-size: 16px;
               line-height: 16px;

package/dist/_pkgs/affine-block-root/commands/copy-link-commands.d.ts

@@ -0,0 +1,2 @@
+import { type AnyCommandDescriptor } from '../../std/index.js';
+export declare const copyLinkCommands: AnyCommandDescriptor[];