@grafloria/element 0.3.20 → 0.3.22

package/src/libs/renderer/src/canvas/style-resolution.js

@@ -1,466 +0,0 @@
-"use strict";
-// style-resolution.ts — THE CSS-vs-Canvas seam.
-//
-// THE PROBLEM
-// -----------
-// In CSS mode a diagram's paint comes from THREE places, and the browser's CSS
-// engine merges them for us:
-//
-//   1. presentation attributes on the element   (`<rect fill="#eee">`)
-//   2. the renderer's stylesheet                (`.diagram-node { fill: var(--grafloria-node-fill) }`)
-//      whose values are per-instance CSS custom properties carrying the theme
-//   3. the element's inline style               (`style="fill: red"`), which the
-//      renderer deliberately uses for the resolved cascade because it beats (2)
-//
-// Canvas has NO CSS engine. `ctx.fillStyle` needs a concrete colour. A node body
-// in CSS mode carries NO fill at all — just `class="diagram-node"` — so a canvas
-// backend that only read `props.fill` would paint every node black or not at all.
-// That is the entire "canvas mode looks different from SVG mode" bug class.
-//
-// THE FIX — REUSE the export card's flattener, do not re-derive the cascade
-// ------------------------------------------------------------------------
-// `export/style-flattener.ts` already solved the hard, dangerous half of this for
-// the headless SVG exporter: match an element's class list against the renderer's
-// own `BASE_STYLE_RULES`, order by (specificity, source order) exactly as a
-// browser does, and substitute every `var(--grafloria-*)` from `resolveThemeVars`.
-//
-// This module IMPORTS that resolver (`createClassStyleResolver`) rather than
-// shipping a second copy. If Canvas and Export disagreed about what
-// `.diagram-node.selected` resolves to, then the picture on screen, the picture
-// in the exported file, and the picture on the hit canvas would all drift apart —
-// three renderings of one diagram, three different answers. One cascade, three
-// consumers.
-//
-// What this module adds ON TOP, because a raster backend needs it and a
-// serializer does not:
-//   - the full CSS PRIORITY ORDER (presentation attrs < class rules < inline
-//     style) applied to a live element,
-//   - INHERITANCE down the group chain (fill/stroke/font inherit in SVG; filter
-//     and clip-path do not), and group-opacity compositing,
-//   - TYPED parsing: `"2px"` → 2, `"5,5"` → [5,5], `text-anchor` → `textAlign`,
-//     `dominant-baseline` → `textBaseline`, a canvas `font` shorthand.
-//
-// KNOWN AND DOCUMENTED LIMIT: host-authored CSS *rules* (`.diagram-node { fill:
-// red }` in the app's own stylesheet, or `:hover` selectors) are invisible to
-// Canvas — there is no cascade to consult. CSS custom-property overrides ARE
-// honoured (see `readCssVarOverrides`), and they are the supported theming seam
-// for canvas mode; arbitrary CSS rules remain an SVG-mode-only capability.
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CanvasStyleResolver = exports.INHERITED_DEFAULTS = void 0;
-exports.toNumber = toNumber;
-exports.parseDashArray = parseDashArray;
-exports.parseInlineStyle = parseInlineStyle;
-exports.classListOf = classListOf;
-exports.readCssVarOverrides = readCssVarOverrides;
-exports.fontString = fontString;
-exports.textAlignFor = textAlignFor;
-exports.textBaselineFor = textBaselineFor;
-const style_flattener_1 = require("../export/style-flattener");
-const theme_vars_1 = require("../themes/theme-vars");
-/** Style values that INHERIT from a parent element in SVG. */
-exports.INHERITED_DEFAULTS = {
-    fill: '#000000',
-    stroke: undefined,
-    strokeWidth: 1,
-    opacity: 1,
-    fontFamily: 'sans-serif',
-    fontSize: 12,
-    fontWeight: 'normal',
-    fontStyle: 'normal',
-    textAnchor: 'start',
-    dominantBaseline: 'auto',
-    visible: true,
-};
-// ---------------------------------------------------------------------------
-// CSS value plumbing
-// ---------------------------------------------------------------------------
-/** `"2px"` / `2` / `"2"` → 2. Returns `undefined` for anything unparseable. */
-function toNumber(value) {
-    if (typeof value === 'number')
-        return Number.isFinite(value) ? value : undefined;
-    if (typeof value !== 'string')
-        return undefined;
-    const n = parseFloat(value);
-    return Number.isNaN(n) ? undefined : n;
-}
-/** `"5,5"` / `"5 5"` / `[5,5]` → `[5, 5]`. `"none"` → `[]`. */
-function parseDashArray(value) {
-    if (value === undefined || value === null)
-        return undefined;
-    if (Array.isArray(value))
-        return value.map(Number).filter((n) => Number.isFinite(n));
-    const s = String(value).trim();
-    if (!s || s === 'none')
-        return [];
-    const parts = s
-        .split(/[\s,]+/)
-        .map((v) => parseFloat(v))
-        .filter((v) => Number.isFinite(v));
-    return parts.length > 0 ? parts : undefined;
-}
-/**
- * Parse an inline `style` — the renderer emits BOTH forms: a CSS string
- * (`"fill: red; stroke-width: 2"`, from the shape registry and the link style
- * computation) and an object (`{ cursor: 'move' }`, from the interaction
- * overlays). Both are normalised to kebab-case CSS declarations here.
- */
-function parseInlineStyle(style) {
-    if (!style)
-        return {};
-    if (typeof style === 'string') {
-        const out = {};
-        for (const decl of style.split(';')) {
-            const idx = decl.indexOf(':');
-            if (idx < 0)
-                continue;
-            const prop = decl.slice(0, idx).trim();
-            const value = decl.slice(idx + 1).trim();
-            if (prop)
-                out[prop] = value;
-        }
-        return out;
-    }
-    if (typeof style === 'object') {
-        const out = {};
-        for (const [key, value] of Object.entries(style)) {
-            if (value === null || value === undefined)
-                continue;
-            out[camelToKebab(key)] = String(value);
-        }
-        return out;
-    }
-    return {};
-}
-function camelToKebab(str) {
-    return str.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
-}
-/** The class tokens on an element (`className` prop, space separated). */
-function classListOf(props) {
-    const raw = props === null || props === void 0 ? void 0 : props['className'];
-    if (!raw || typeof raw !== 'string')
-        return [];
-    return raw.trim().split(/\s+/).filter(Boolean);
-}
-/**
- * Resolves VNode props → concrete paint values, reproducing the SVG cascade.
- * The CLASS-RULE layer is the export card's flattener; this adds priority order,
- * inheritance and typed parsing on top.
- */
-class CanvasStyleResolver {
-    constructor(options) {
-        /** Declarations dropped because a variable could not be resolved. */
-        this.warnings = [];
-        this.theme = options.theme;
-        this.classRules = this.compile(options.theme, options.varOverrides);
-    }
-    /**
-     * Build the class-rule resolver for a theme.
-     *
-     * `createClassStyleResolver` bakes `resolveThemeVars(theme)` in, so the honest
-     * way to honour a host's `--grafloria-*` OVERRIDES is to hand it a theme that reads
-     * back the overridden values — rather than forking the flattener, or
-     * post-processing its output (which could not tell a colour that came from an
-     * overridden token apart from an identical colour that did not).
-     */
-    compile(theme, overrides) {
-        const effective = overrides && Object.keys(overrides).length > 0
-            ? applyVarOverridesToTheme(theme, overrides)
-            : theme;
-        this.warnings.length = 0;
-        return (0, style_flattener_1.createClassStyleResolver)(effective, this.warnings);
-    }
-    setTheme(theme, varOverrides) {
-        this.theme = theme;
-        this.classRules = this.compile(theme, varOverrides);
-    }
-    getTheme() {
-        return this.theme;
-    }
-    /** The root style every diagram starts from (theme font, no paint inherited). */
-    rootStyle() {
-        return Object.assign(Object.assign({}, exports.INHERITED_DEFAULTS), { fontFamily: String(this.theme.typography.fontFamily.default), fontSize: Number(this.theme.typography.fontSize.md) || exports.INHERITED_DEFAULTS.fontSize });
-    }
-    /**
-     * Compute an element's style: inherit from the parent, then apply
-     * presentation attributes < matched class rules < inline style.
-     */
-    resolve(props, inherited) {
-        const style = Object.assign({}, inherited);
-        // `opacity` composites down the tree (a group at 0.5 halves its children), so
-        // it is multiplied rather than overwritten. Non-inherited by CSS: a child does
-        // not keep its parent's filter or clip.
-        style.filter = undefined;
-        style.clipPathId = undefined;
-        if (!props)
-            return style;
-        // ---- 1. presentation attributes (lowest priority) ----------------------
-        const decls = {};
-        collectPresentationAttrs(props, decls);
-        // ---- 2. the renderer's stylesheet — THE SHARED CASCADE ------------------
-        const classes = classListOf(props);
-        if (classes.length > 0) {
-            Object.assign(decls, this.classRules(classes));
-        }
-        // ---- 3. inline style (highest priority) --------------------------------
-        Object.assign(decls, parseInlineStyle(props['style']));
-        applyDecls(decls, style);
-        return style;
-    }
-}
-exports.CanvasStyleResolver = CanvasStyleResolver;
-/** Apply a resolved declaration bag onto a typed style. */
-function applyDecls(decls, style) {
-    for (const [prop, rawValue] of Object.entries(decls)) {
-        const value = String(rawValue).trim();
-        if (value === '' || value === 'inherit')
-            continue;
-        switch (prop) {
-            case 'fill':
-                style.fill = value === 'none' ? undefined : value;
-                break;
-            case 'stroke':
-                style.stroke = value === 'none' ? undefined : value;
-                break;
-            case 'stroke-width': {
-                const n = toNumber(value);
-                if (n !== undefined)
-                    style.strokeWidth = n;
-                break;
-            }
-            case 'stroke-dasharray':
-                style.strokeDasharray = parseDashArray(value);
-                break;
-            case 'opacity': {
-                const n = toNumber(value);
-                // Element opacity multiplies whatever the parent chain already applied.
-                if (n !== undefined)
-                    style.opacity *= n;
-                break;
-            }
-            case 'fill-opacity': {
-                const n = toNumber(value);
-                if (n !== undefined)
-                    style.fillOpacity = n;
-                break;
-            }
-            case 'stroke-opacity': {
-                const n = toNumber(value);
-                if (n !== undefined)
-                    style.strokeOpacity = n;
-                break;
-            }
-            case 'font-family':
-                style.fontFamily = value;
-                break;
-            case 'font-size': {
-                const n = toNumber(value);
-                if (n !== undefined)
-                    style.fontSize = n;
-                break;
-            }
-            case 'font-weight':
-                style.fontWeight = value;
-                break;
-            case 'font-style':
-                style.fontStyle = value;
-                break;
-            case 'text-anchor':
-                if (value === 'start' || value === 'middle' || value === 'end')
-                    style.textAnchor = value;
-                break;
-            case 'dominant-baseline':
-            case 'alignment-baseline':
-                style.dominantBaseline = value;
-                break;
-            case 'display':
-                if (value === 'none')
-                    style.visible = false;
-                break;
-            case 'visibility':
-                if (value === 'hidden' || value === 'collapse')
-                    style.visible = false;
-                break;
-            case 'filter':
-                if (value !== 'none')
-                    style.filter = value;
-                break;
-            case 'clip-path': {
-                const m = /url\(\s*#([^)\s]+)\s*\)/.exec(value);
-                if (m)
-                    style.clipPathId = m[1];
-                break;
-            }
-            default:
-                break; // cursor, pointer-events, transition … mean nothing to a raster
-        }
-    }
-}
-/**
- * VNode props that are SVG PRESENTATION ATTRIBUTES, in CSS-property form.
- *
- * Everything else on `props` is geometry (`x`, `d`, `points`), identity (`key`,
- * `data-*`), or DOM plumbing (`onClick`) and is not paint.
- */
-const PRESENTATION_PROPS = {
-    fill: 'fill',
-    stroke: 'stroke',
-    strokeWidth: 'stroke-width',
-    strokeDasharray: 'stroke-dasharray',
-    opacity: 'opacity',
-    fillOpacity: 'fill-opacity',
-    strokeOpacity: 'stroke-opacity',
-    fontFamily: 'font-family',
-    fontSize: 'font-size',
-    fontWeight: 'font-weight',
-    fontStyle: 'font-style',
-    textAnchor: 'text-anchor',
-    dominantBaseline: 'dominant-baseline',
-    alignmentBaseline: 'alignment-baseline',
-    display: 'display',
-    visibility: 'visibility',
-    filter: 'filter',
-    clipPath: 'clip-path',
-};
-function collectPresentationAttrs(props, out) {
-    for (const [key, cssProp] of Object.entries(PRESENTATION_PROPS)) {
-        const value = props[key];
-        if (value === undefined || value === null || typeof value === 'function')
-            continue;
-        out[cssProp] = String(value);
-    }
-}
-/**
- * A theme whose `--grafloria-*` values carry the host's overrides.
- *
- * The flattener resolves variables through `resolveThemeVars(theme)`, so the
- * honest way to inject a host override is to give it a theme that already reads
- * back the overridden value. Only the tokens the host actually overrode are
- * touched; everything else is the theme's own value.
- */
-function applyVarOverridesToTheme(theme, overrides) {
-    const patched = structuredCloneish(theme);
-    for (const token of theme_vars_1.THEME_TOKENS) {
-        const binding = theme_vars_1.THEME_VARS[token];
-        const override = overrides[binding.cssVar];
-        if (override === undefined)
-            continue;
-        writeToken(patched, token, override);
-    }
-    return patched;
-}
-/** Where each theme token is READ from — the inverse of THEME_VARS[token].read. */
-const TOKEN_WRITERS = {
-    'node.fill': (t, v) => (t.colors.node.default.fill = v),
-    'node.stroke': (t, v) => (t.colors.node.default.stroke = v),
-    'node.strokeWidth': (t, v) => (t.nodes.default.strokeWidth = parseFloat(v)),
-    'node.selected.fill': (t, v) => (t.colors.node.selected.fill = v),
-    'node.selected.stroke': (t, v) => (t.colors.node.selected.stroke = v),
-    'node.highlighted.fill': (t, v) => (t.colors.node.highlighted.fill = v),
-    'node.highlighted.stroke': (t, v) => (t.colors.node.highlighted.stroke = v),
-    'node.hovered.fill': (t, v) => (t.colors.node.hovered.fill = v),
-    'node.hovered.stroke': (t, v) => (t.colors.node.hovered.stroke = v),
-    'node.disabled.fill': (t, v) => (t.colors.node.disabled.fill = v),
-    'node.disabled.stroke': (t, v) => (t.colors.node.disabled.stroke = v),
-    'node.disabled.opacity': (t, v) => (t.effects.opacity.disabled = parseFloat(v)),
-    'node.error.fill': (t, v) => (t.colors.node.error.fill = v),
-    'node.error.stroke': (t, v) => (t.colors.node.error.stroke = v),
-    'link.stroke': (t, v) => (t.colors.link.default = v),
-    'link.strokeWidth': (t, v) => (t.links.default.strokeWidth = parseFloat(v)),
-    'link.selected.stroke': (t, v) => (t.colors.link.selected = v),
-    'link.highlighted.stroke': (t, v) => (t.colors.link.highlighted = v),
-    'link.hovered.stroke': (t, v) => (t.colors.link.hovered = v),
-    'label.fontFamily': (t, v) => (t.typography.fontFamily.default = v),
-    'label.fontSize': (t, v) => (t.typography.fontSize.md = parseFloat(v)),
-    'label.color': (t, v) => (t.colors.text.primary = v),
-    'port.fill': (t, v) => (t.colors.background.surface = v),
-    'port.strokeWidth': (t, v) => (t.ports.strokeWidth = parseFloat(v)),
-    'port.input': (t, v) => (t.colors.port.input = v),
-    'port.output': (t, v) => (t.colors.port.output = v),
-    'port.bi': (t, v) => (t.colors.port.bi = v),
-};
-function writeToken(theme, token, value) {
-    var _a;
-    (_a = TOKEN_WRITERS[token]) === null || _a === void 0 ? void 0 : _a.call(TOKEN_WRITERS, theme, value);
-}
-/** Deep-ish clone that survives jsdom/node without structuredClone. */
-function structuredCloneish(value) {
-    return JSON.parse(JSON.stringify(value));
-}
-/**
- * Read the `--grafloria-*` values ACTUALLY COMPUTED on a host element.
- *
- * This is what makes canvas mode honour a host that overrides the theme through
- * CSS (`.dark-mode [data-grafloria-instance] { --grafloria-node-fill: #222 }`) — the
- * variable is resolved by the browser's own cascade and handed to the canvas
- * resolver as a concrete value. Returns `{}` in a headless environment.
- */
-function readCssVarOverrides(element) {
-    var _a;
-    if (!element)
-        return {};
-    const view = (_a = element.ownerDocument) === null || _a === void 0 ? void 0 : _a.defaultView;
-    if (!view || typeof view.getComputedStyle !== 'function')
-        return {};
-    let computed;
-    try {
-        computed = view.getComputedStyle(element);
-    }
-    catch (_b) {
-        return {};
-    }
-    if (!computed || typeof computed.getPropertyValue !== 'function')
-        return {};
-    const out = {};
-    for (const token of theme_vars_1.THEME_TOKENS) {
-        const name = theme_vars_1.THEME_VARS[token].cssVar;
-        const value = computed.getPropertyValue(name);
-        if (value && value.trim())
-            out[name] = value.trim();
-    }
-    return out;
-}
-/** Build the canvas `font` shorthand from a resolved style. */
-function fontString(style) {
-    const parts = [];
-    if (style.fontStyle && style.fontStyle !== 'normal')
-        parts.push(style.fontStyle);
-    if (style.fontWeight && style.fontWeight !== 'normal')
-        parts.push(String(style.fontWeight));
-    parts.push(`${style.fontSize}px`);
-    parts.push(style.fontFamily || 'sans-serif');
-    return parts.join(' ');
-}
-/** SVG `text-anchor` → canvas `textAlign`. */
-function textAlignFor(anchor) {
-    if (anchor === 'middle')
-        return 'center';
-    if (anchor === 'end')
-        return 'right';
-    return 'left';
-}
-/**
- * SVG `dominant-baseline` → canvas `textBaseline`.
- *
- * The renderer only ever emits `middle` (centred labels), `hanging` (top-aligned
- * text blocks) and `baseline`; anything else falls back to the canvas default,
- * which is what an unset `dominant-baseline` means in SVG too.
- */
-function textBaselineFor(baseline) {
-    switch (baseline) {
-        case 'middle':
-        case 'central':
-            return 'middle';
-        case 'hanging':
-        case 'text-before-edge':
-            return 'hanging';
-        case 'text-after-edge':
-        case 'ideographic':
-            return 'ideographic';
-        case 'baseline':
-        case 'alphabetic':
-        case 'auto':
-        default:
-            return 'alphabetic';
-    }
-}
-//# sourceMappingURL=style-resolution.js.map

package/src/libs/renderer/src/canvas/tier-policy.d.ts

@@ -1,33 +0,0 @@
-import type { BackendMode } from './render-backend';
-/** Why canvas mode would take something away from this particular diagram, right now. */
-export type CanvasHazard = 
-/** An assistive-technology surface is live. Canvas has no semantics to give it. */
-'a11y-active'
-/** Focus is inside the diagram; swapping the element out would drop it to <body>. */
- | 'focus-inside'
-/** The scene has foreignObject/HTML nodes. Canvas cannot paint them — they vanish. */
- | 'foreign-object';
-export interface CanvasSafety {
-    /** True when nothing would be lost by drawing this diagram on a canvas. */
-    safe: boolean;
-    /** Everything that would be lost. Empty iff `safe`. */
-    hazards: CanvasHazard[];
-}
-export interface CanvasSafetyInput {
-    a11yActive: boolean;
-    focusInside: boolean;
-    hasForeignObject: boolean;
-}
-/**
- * What would canvas mode cost this diagram?
- *
- * Note the asymmetry, and that it is the whole design: this question is only ever asked
- * about stepping TO canvas. Going back to SVG can lose nothing — it only ever restores
- * focusable, labelled, HTML-capable DOM — so it is never guarded, never refused, and
- * always allowed.
- */
-export declare function canvasSafety(input: CanvasSafetyInput): CanvasSafety;
-/** A human-readable account of what a canvas switch would take away. */
-export declare function explainHazards(hazards: readonly CanvasHazard[]): string;
-/** Modes it is always safe to be in. */
-export declare const ALWAYS_SAFE_MODE: BackendMode;

package/src/libs/renderer/src/canvas/tier-policy.js

@@ -1,89 +0,0 @@
-"use strict";
-// Wave 8 — Card 5: what it is safe to LOSE by drawing on a canvas.
-//
-// ─────────────────────────────────────────────────────────────────────────────
-// CARD 5 AS WRITTEN IS OBSOLETE, AND THE MEASUREMENT SAYS SO TWICE.
-//
-// The card asked for an automatic far-zoom canvas tier: step down to canvas at high
-// element counts / low zoom, hand back to SVG for the near tier. It existed to rescue a
-// zoom-out frame that cost 63 SECONDS at 10k nodes.
-//
-//   1. That cliff is gone. wave8/routing (obstacle index + route memo) and wave8/culling
-//      (LOD gates that skip A* below zoom 0.5) took zoom-out at 10k from 63,234ms to
-//      118ms — cheaper than a pan. There is no longer a frame for canvas to rescue.
-//
-//   2. Even if there were, canvas would not rescue it. `node libs/renderer/e2e/tier-run.mjs`
-//      times the two CONSUMERS against the same VNode tree, with the router stripped out so
-//      it cannot drown the signal:
-//
-//          vnodes    svg mount   svg repatch   canvas paint
-//          23,730       44.5ms        13.7ms        121.8ms    <- SVG 8.9x FASTER
-//
-//      The patcher DIFFS: a steady frame costs a function of what CHANGED. The canvas
-//      backend REPAINTS — the whole scene, every frame, and then a second time into the
-//      colour-keyed hit canvas that buys its O(1) picking. Two full paints, always.
-//
-// So the automatic tier handoff was built, measured, and DELETED. What would have been the
-// perf machinery (thresholds, hysteresis, a step-down loop) is gone; a mechanism that the
-// numbers say should never fire is not a feature, it is a liability with a config option.
-//
-// ─────────────────────────────────────────────────────────────────────────────
-// WHAT SURVIVES, AND WHY IT IS NOT ABOUT PERFORMANCE
-//
-// The canvas backend still exists (wave 4) and `DiagramRenderBackend.setMode('canvas')`
-// still works — a host may want canvas for reasons that have nothing to do with frame
-// time: 1 canvas element instead of 40,000 DOM nodes is a real memory and GC argument.
-//
-// But that switch has shipped since wave 4 with NOTHING guarding it, and canvas is a
-// strictly LESSER surface:
-//
-//   - It has NO accessibility story. The wave-6 a11y work — roles, accessible names, the
-//     roving tabindex, the AT-navigable outline — is emitted as props on the VNode tree and
-//     REALISED as SVG DOM. The canvas painter draws the same tree and throws every one of
-//     those props away. A screen reader handed a <canvas> gets a blank graphic. Today,
-//     setMode('canvas') will do that to a screen-reader user without a word.
-//   - It cannot rasterise DOM (`supportsForeignObject: false`): an HTML node stops being
-//     drawn at all.
-//   - Swapping the element out drops `document.activeElement` to <body>, destroying a
-//     keyboard user's position mid-navigation.
-//
-// That is a real bug in shipped code, and it is independent of whether anyone ever wanted
-// an automatic tier. So THIS is what Card 5 leaves behind: not a perf switch, a safety
-// check on the switch that was already there.
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ALWAYS_SAFE_MODE = void 0;
-exports.canvasSafety = canvasSafety;
-exports.explainHazards = explainHazards;
-/**
- * What would canvas mode cost this diagram?
- *
- * Note the asymmetry, and that it is the whole design: this question is only ever asked
- * about stepping TO canvas. Going back to SVG can lose nothing — it only ever restores
- * focusable, labelled, HTML-capable DOM — so it is never guarded, never refused, and
- * always allowed.
- */
-function canvasSafety(input) {
-    const hazards = [];
-    if (input.a11yActive)
-        hazards.push('a11y-active');
-    if (input.focusInside)
-        hazards.push('focus-inside');
-    if (input.hasForeignObject)
-        hazards.push('foreign-object');
-    return { safe: hazards.length === 0, hazards };
-}
-/** A human-readable account of what a canvas switch would take away. */
-function explainHazards(hazards) {
-    const reasons = {
-        'a11y-active': 'an assistive-technology surface is live for this diagram, and canvas mode has no ' +
-            'accessible semantics at all (a screen reader would see a blank graphic)',
-        'focus-inside': 'focus is currently inside the diagram, and swapping the rendered element out would ' +
-            'drop it to <body>, losing a keyboard user their place',
-        'foreign-object': 'the scene contains HTML/foreignObject nodes, which canvas cannot rasterise — they ' +
-            'would silently stop being drawn',
-    };
-    return hazards.map((h) => reasons[h]).join('; ');
-}
-/** Modes it is always safe to be in. */
-exports.ALWAYS_SAFE_MODE = 'svg';
-//# sourceMappingURL=tier-policy.js.map