@orangelogic/design-system 2.161.0 → 2.163.0

package/library/components/video.js

@@ -1,14 +1,14 @@
 import { _ as kd, a as Sa, b as Be, c as Je } from "../chunks/inheritsLoose.BuSn_CvZ.js";
 import { c as ps, a as Bn } from "../chunks/_commonjsHelpers.DQNKXVTB.js";
 import { r as Sb } from "../chunks/___vite-browser-external_commonjs-proxy.C2tf3HsQ.js";
-import { C as Cb } from "../chunks/image.5mhGPvMN.js";
+import { C as Cb } from "../chunks/image.BgODrAzQ.js";
 import Mb from "./resize-observer.js";
 import { r as Db, R as Pb, a as Rp, b as Lb } from "../chunks/resizable-component.styles.CAfXABBc.js";
 import { c as Rb } from "../chunks/component.styles.CRO4Odto.js";
 import { b as Ib } from "../chunks/browser.BHOCIF_A.js";
 import { c as Ob } from "../chunks/custom-element.L4WJXn1j.js";
 import { L as kb } from "../chunks/i18n.Bchq8v1d.js";
-import { w as Ki } from "../chunks/watch.DOt4Mabe.js";
+import { w as Ki } from "../chunks/watch.DJF5K-8U.js";
 import { i as Bb, x as Qc } from "../chunks/lit-element.jLBm65_O.js";
 import { n as Ri } from "../chunks/lib-cortex-element.CVMmyPMC.js";
 import { r as yn } from "../chunks/state.CSDxrqLd.js";

package/library/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@orangelogic/design-system",
   "type": "module",
-  "version": "2.161.0",
+  "version": "2.163.0",
   "license": "UNLICENSED",
   "types": "library/types.d.ts",
   "scripts": {
@@ -12,6 +12,7 @@
     "build": "vite build --config vite.config.ts && bun run build-worker && node ./scripts/remove-index-html-file.js && node ./scripts/copy-entry-file.js",
     "build-sync": "bun run build && bun run sync-csharp",
     "start": "vite",
+    "host": "bun run build && bunx serve dist --cors -l 4321",
     "dev-build": "vite build --config vite.dev-build.config.ts",
     "open": "npx playwright test --project=chromium --ui",
     "playwright": "npx playwright test --project=chromium",

package/library/packages/atoms/src/components/markdown/markdown.d.ts

@@ -1,3 +1,4 @@
+import { default as CxIconButton } from '../icon-button/icon-button.ts';
 import { default as CortexLightElement } from '../../../../base/src/cortex-light-element.ts';
 import { TemplateResult } from 'lit';
 import { RendererObject, TokenizerAndRendererExtension } from 'marked';
@@ -8,10 +9,36 @@ import { RendererObject, TokenizerAndRendererExtension } from 'marked';
  * @description cx-markdown is a Light DOM element, so can be styled from outside the Shadow DOM.
  * cx-markdown is powered by [MarkedJs](https://marked.js.org/).
  *
- * @event cx-ready - Emitted when the markdown has been rendered.
+ * Fenced `mermaid` code blocks render as diagrams; Mermaid is imported lazily only when one is
+ * present. Output is sanitized with DOMPurify unless `live-script` is set.
+ *
+ * Leading YAML frontmatter renders as a collapsed disclosure instead of an `<hr>` plus heading, and
+ * is parsed onto the `frontmatter` property.
+ *
+ * Set `link-target="_blank"` to open links in a new tab — that is enough for the common case, so
+ * consumers should not need a custom `link` renderer.
+ *
+ * Fenced code blocks get a copy button, revealed on hover or keyboard focus.
+ *
+ * Clicks on interactive rendered content — links, the frontmatter disclosure, checkboxes, copy
+ * buttons, Mermaid nodes — do not bubble past the component. Clicks on inert content still do.
+ *
+ * @event cx-ready - Emitted when the markdown has been rendered, deferred until any Mermaid
+ * diagrams have been drawn.
  */
 export default class CxMarkdown extends CortexLightElement {
     #private;
+    static readonly styles: import('lit').CSSResult;
+    static readonly dependencies: {
+        'cx-icon-button': typeof CxIconButton;
+    };
+    private readonly localize;
+    /**
+     * YAML frontmatter parsed from `markdown`, empty when there is none. Derived output — assigning
+     * to it has no effect. Read it after `cx-ready`. Deliberately non-reactive: the disclosure is
+     * built in the same pass, so setting it during `update()` would only cost an extra render.
+     */
+    frontmatter: Record<string, unknown>;
     /**
      * The class name to apply to the root element. As this is a light DOM element, it can be styled
      * from outside the Shadow DOM.
@@ -19,8 +46,14 @@ export default class CxMarkdown extends CortexLightElement {
     classname: string;
     /**
      * If true, re-adds script tags from inside the markdown to the body, wrapping them in IIFEs.
+     * Also skips sanitization, since DOMPurify would strip those script tags. Trusted content only.
      */
     liveScript: boolean;
+    /**
+     * Target applied to every rendered link. Set to `_blank` to open links in a new tab, which also
+     * adds `rel="noopener noreferrer"`. Empty (the default) leaves anchors untouched.
+     */
+    linkTarget: string;
     /**
      * The markdown to render.
      */
@@ -39,7 +72,14 @@ export default class CxMarkdown extends CortexLightElement {
      */
     rendered: string;
     connectedCallback(): void;
+    disconnectedCallback(): void;
     updateRendered(): void;
+    /**
+     * Light DOM means every click reaches ancestors, which commonly treat one as "start editing".
+     * Clicks the rendered markdown acts on itself stop here; inert content still bubbles. The
+     * containment check keeps an ancestor `<a>` or `<label>` around the component from matching.
+     */
+    handleClick(event: MouseEvent): void;
     handleRenderedWithNewMarkdown(): void;
     render(): TemplateResult;
     updated(): void;

package/library/packages/atoms/src/components/markdown/parser.d.ts

@@ -1,7 +1,22 @@
-import { Marked } from 'marked';
+import { Marked, Tokens } from 'marked';
 
+/** Class name cx-markdown looks for when deciding whether to load Mermaid. */
+export declare const MERMAID_CLASS_NAME = "mermaid";
+/** Class name on the disclosure wrapping YAML frontmatter. */
+export declare const FRONTMATTER_CLASS_NAME = "cx-frontmatter";
+export type ExtractedFrontmatter = {
+    /** The markdown with the frontmatter block removed. */
+    body: string;
+    /** Parsed YAML mapping. Empty when absent, malformed, or not a mapping. */
+    data: Record<string, unknown>;
+    /** Raw YAML source, kept for display. */
+    raw: string;
+};
+export declare function extractFrontmatter(source: string): ExtractedFrontmatter;
+/** Collapsed disclosure shown in place of the frontmatter block. */
+export declare function renderFrontmatterDetails(raw: string, label: string): string;
 export declare const baseRenderer: {
-    code(text: string, value: string | undefined): string;
+    code(this: import('marked').Renderer<string, string>, { escaped, lang: infoString, text }: Tokens.Code): string;
 };
 /**
  * https://marked.js.org/using_advanced in Marked instance section.
@@ -10,5 +25,5 @@ export declare const baseRenderer: {
  *
  * Change from Singleton to Factory pattern: returns a new isolated Marked parser.
  */
-export declare function createParser(): Marked;
+export declare function createParser(): Marked<string, string>;
 export type Parser = ReturnType<typeof createParser>;

package/library/packages/atoms/src/components/markdown/styles.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Baseline document typography, modelled on the VS Code markdown preview. Without this a bare
+ * cx-markdown inherits whatever the host page provides, which collapses tables and flattens the
+ * heading hierarchy. Apps that already style markdown (the docs site) override via a `classname`,
+ * since a class selector outranks these element selectors.
+ */
+export declare const documentStyles: import('lit').CSSResult;
+/**
+ * Prism default theme. CortexLightElement injects these into `document.head` with `:host` rewritten
+ * to `cx-markdown`, so every selector needs the `:host` prefix or it styles the whole page.
+ */
+export declare const code: import('lit').CSSResult;
+/**
+ * Single stylesheet for the component. CortexLightElement assigns `static styles` straight to
+ * `textContent`, so an array would stringify with a stray comma between the two sheets.
+ */
+export declare const styles: import('lit').CSSResult;

package/library/packages/hybrid/table-core/src/tabulator-tables/modules/Page/Page.d.ts

@@ -20,6 +20,12 @@ export default class Page extends Module implements IPage {
     dataChanging: boolean;
     pageSizes: number[];
     mode: 'remote' | 'local' | 'progressive_load' | 'progressive_scroll';
+    /**
+     * Coalesces bursts of 'row-added'/'row-deleted' (e.g. a streaming loader
+     * calling addData() per chunk, which dispatches one event per row) into a
+     * single pipeline refresh instead of one full re-render per row.
+     */
+    private rowsUpdatedScheduled;
     constructor(table: Tabulator);
     options(key: string): any;
     initialize(): void;

package/library/packages/hybrid/table-core/src/tabulator-tables/modules/Validate/Validate.d.ts

@@ -106,6 +106,12 @@ export default class Validate extends Module {
      * responsive.
      */
     private validateColumnsOnMainThread;
+    /**
+     * Only style cells that already have real DOM (`cell.loaded`). Calling
+     * `getElement()` on an unloaded cell forces it to generate a detached
+     * element — the virtual renderer's later `layoutCell()` call (on scroll/
+     * page change) is what actually applies the style once the cell is real.
+     */
     private applyCellInvalidState;
     private clearCellInvalidState;
     private runSuppressed;

package/library/packages/molecules/src/index.d.ts

@@ -24,6 +24,7 @@ export { default as CxFontPicker } from './font-picker/font-picker';
 export { default as CxGalleryItem } from './gallery-item/gallery-item';
 export { default as CxGraphView } from './graph-view/graph-view';
 export { default as CxIconPicker } from './icon-picker/icon-picker';
+export { default as CxMarkdownViewer } from './markdown-viewer/markdown-viewer';
 export { default as CxMasonry } from './masonry/masonry';
 export { default as CxMentions } from './mentions/mentions';
 export { default as CxMultiSelect } from './multi-select/multi-select';

package/library/packages/molecules/src/markdown-viewer/markdown-viewer.d.ts

@@ -0,0 +1,124 @@
+import { default as CortexElement } from '../../../base/src/cortex-element.ts';
+import { MarkdownViewerViewMode } from '../../../types/src/markdown-viewer';
+import { CSSResultGroup, TemplateResult } from 'lit';
+
+/**
+ * @summary Renders markdown with a toggle between the rendered preview, the raw source, and — when
+ * `editable` — a plain-text editor and a rich editor.
+ *
+ * @description Wraps `cx-markdown` and adds a view switcher. The source view shows the markdown
+ * verbatim, frontmatter included, syntax highlighted with Prism.
+ *
+ * `editable` adds two editors. `edit` is a `cx-textarea` over the raw source: plain text only, and
+ * byte-exact — what is loaded is what is saved. `wysiwyg` is a ProseMirror editor over a document
+ * model, with formatting and table controls; it is **not** byte-exact, because blocks the user
+ * changes are regenerated. Constructs the model cannot represent, such as HTML blocks, keep their
+ * source and are written back untouched. Choose per document which editor a host offers, through
+ * `available-view-modes`.
+ *
+ * `markdown` is the source coming in, `value` the current text including unsaved edits. Preview and
+ * source both render `value`. Assigning `markdown` again resets `value`.
+ *
+ * The view switcher is omitted when only one mode is on offer, since there is nothing to switch to.
+ *
+ * `cx-markdown` is a Light DOM element whose stylesheet is injected into `document.head`, out of
+ * reach of this shadow root. It is therefore imported into this component's `styles` too, where its
+ * `:host`-prefixed rules give the preview its typography.
+ *
+ * @event cx-change - Emitted after editing settles. Read the new markdown from `value`.
+ *
+ * @csspart toolbar - The overlaid bar holding the view switcher.
+ * @csspart preview - The `cx-markdown` element rendering the markdown.
+ * @csspart source - The `pre` element showing the raw markdown.
+ * @csspart editor - The `cx-textarea` used by the edit view.
+ * @csspart rich-editor - The wrapper around the rich editor and its formatting toolbar.
+ * @csspart format-toolbar - The formatting toolbar shown in the rich view.
+ *
+ * @cssproperty [--cx-markdown-viewer-toolbar-gap=var(--cx-spacing-x-small)] - Gap between toolbar items.
+ * @cssproperty [--cx-markdown-viewer-toolbar-offset-block=var(--cx-spacing-medium)] - Toolbar inset from the top edge.
+ * @cssproperty [--cx-markdown-viewer-toolbar-offset-inline=var(--cx-spacing-medium)] - Toolbar inset from the end edge.
+ * @cssproperty [--cx-markdown-viewer-source-font-size=var(--cx-font-size-small)] - Font size of the source and edit views.
+ * @cssproperty [--cx-markdown-viewer-source-max-height=none] - Max height of the source view before it scrolls.
+ * @cssproperty [--cx-markdown-viewer-edit-min-height=auto] - Min height of the plain-text editor, overriding its row count. The rich editor uses it too, defaulting to 20lh.
+ * @cssproperty [--cx-markdown-viewer-view-switcher-width=12rem] - Space the rich view's toolbar reserves at its end so the overlaid view switcher never covers a control.
+ */
+export default class CxMarkdownViewer extends CortexElement {
+    static readonly styles: CSSResultGroup;
+    static readonly dependencies: Record<string, typeof CortexElement>;
+    private readonly localize;
+    private readonly richEditor;
+    private readonly richEditorHost?;
+    /** The modes the switcher offers, in this order. Empty offers all of them. */
+    availableViewModes: MarkdownViewerViewMode[];
+    /** The mode to open in. Omit to open on the preview. */
+    defaultViewMode?: MarkdownViewerViewMode;
+    /** Adds the edit view. While false no editor is created. */
+    editable: boolean;
+    /** Target applied to rendered links. `_blank` also adds `rel="noopener noreferrer"`. */
+    linkTarget: string;
+    /** The markdown to render. Assigning it resets `value`. */
+    markdown: string;
+    /** Drops the copy button the source view otherwise offers. */
+    noCopyButton: boolean;
+    /** Lets the toolbar scroll away with the content instead of pinning to the top. */
+    noStickyToolbar: boolean;
+    /** Drops the view switcher, fixing the component to the current view. */
+    noViewToggle: boolean;
+    /** The current markdown, including unsaved edits. What hosts read back. */
+    value: string;
+    /** Which view is showing. Falls back to the first offered mode. */
+    view: MarkdownViewerViewMode;
+    handleDefaultViewModeChange(): void;
+    /** A replacement source document discards any in-progress edit of the previous one. */
+    handleMarkdownChange(): void;
+    /**
+     * The editor is created after render, since its mount point only exists once the view is showing.
+     * Leaving the view tears it down rather than leaving a hidden editor holding a selection.
+     *
+     * Watched props are the ones `activeView` and `editorSource` are derived from. The await is what
+     * makes a watcher workable here — they run before render, when the mount point does not exist yet.
+     * Two watched props changing in the same cycle call this twice; harmless, since the first pass
+     * mounts and the second finds the editor already holding this markdown.
+     */
+    handleRichEditorSync(): Promise<void>;
+    /** LF form of `value`: what both editors work in, since a textarea and marked both report LF. */
+    private get editorSource();
+    /**
+     * The view actually showing. `render()` derives the same thing; this exists for the editor-sync
+     * watcher, which runs outside the template and has no access to its locals.
+     */
+    private get activeView();
+    /** The host's list narrowed to supported modes, falling back to all of them when empty. */
+    private get offeredViews();
+    private handleViewChange;
+    /** The host contract is `value` plus one `cx-change`, so the textarea's own events stop here. */
+    private handleEditorInput;
+    private handleEditorChange;
+    /**
+     * One handler for every formatting button: the action rides on the element as a data attribute, so
+     * the template needs no per-button closure.
+     */
+    private handleFormatClick;
+    private handleInsertTableClick;
+    private handleUndoClick;
+    private handleRedoClick;
+    /** Same contract as the plain-text editor: `value` stays current, `cx-change` settles. */
+    private handleRichEditorChange;
+    /** Debounced: `value` is current on every keystroke, so hosts only need the settled edit. */
+    private emitChange;
+    /**
+     * A native `<textarea>` reports LF, so put back the ending the source used and keep the round trip
+     * byte-exact. One ending for the whole document: a mixed-ending source comes back uniformly CRLF.
+     */
+    private restoreLineEndings;
+    /** Prism escapes its input, so the result is safe to pass to `unsafeHTML` unsanitized. */
+    private highlightSource;
+    /** Formatting and table controls for the rich view. */
+    private renderFormatToolbar;
+    render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'cx-markdown-viewer': CxMarkdownViewer;
+    }
+}

package/library/packages/molecules/src/markdown-viewer/markdown-viewer.styles.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Deliberately small: cx-markdown's own stylesheet is imported into this shadow root, so document
+ * typography arrives with it.
+ */
+declare const _default: import('lit').CSSResult;
+export default _default;

package/library/packages/molecules/src/pdf-viewer-toolbar/pdf-viewer-toolbar.d.ts

@@ -90,6 +90,7 @@ export default class CxPdfViewerToolbar extends CortexElement {
     private handleMoreOptionsSelect;
     private renderLeft;
     private static getScaleOptions;
+    private renderCustomScaleOption;
     private renderMiddle;
     private renderRight;
     render(): TemplateResult;

package/library/packages/tools/src/tiptap/utils/md/editor-controller.d.ts

@@ -0,0 +1,57 @@
+import { ReactiveController, ReactiveControllerHost } from 'lit';
+
+/** Toolbar actions the editor exposes, so the viewer's template stays declarative. */
+export type MarkdownEditorAction = 'blockquote' | 'bold' | 'bulletList' | 'code' | 'codeBlock' | 'heading1' | 'heading2' | 'heading3' | 'italic' | 'orderedList' | 'paragraph' | 'strike' | 'tableColumnAfter' | 'tableDeleteColumn' | 'tableDeleteRow' | 'tableDelete' | 'tableRowAfter';
+interface MarkdownEditorOptions {
+    /** Called with the serialized markdown whenever the document actually changes. */
+    onChange: (markdown: string) => void;
+}
+/**
+ * Owns the ProseMirror editor behind `cx-markdown-viewer`'s WYSIWYG view.
+ *
+ * The host stays declarative: it hands over a mount point and the markdown, receives serialized
+ * markdown through `onChange`, and drives formatting through `run()` / `isActive()` rather than
+ * touching editor internals.
+ */
+export declare class MarkdownEditorController implements ReactiveController {
+    private readonly host;
+    private readonly options;
+    private view?;
+    /**
+     * The markdown this editor last parsed or produced. `setMarkdown` compares against it so a value
+     * the editor itself emitted does not tear the document down and drop the cursor.
+     */
+    private current;
+    constructor(host: ReactiveControllerHost, options: MarkdownEditorOptions);
+    hostDisconnected(): void;
+    /** Creates the editor in `container`, replacing any previous one. */
+    mount(container: HTMLElement, markdown: string): void;
+    destroy(): void;
+    get isMounted(): boolean;
+    /** Replaces the document, unless the incoming markdown is what the editor already holds. */
+    setMarkdown(markdown: string): void;
+    focus(): void;
+    /** Runs a toolbar action against the current selection. */
+    run(action: MarkdownEditorAction): void;
+    /** Whether the selection already carries the mark or sits in the block an action would apply. */
+    isActive(action: MarkdownEditorAction): boolean;
+    /** Whether a table action applies where the cursor is, so the toolbar can disable the rest. */
+    get isInTable(): boolean;
+    canUndo(): boolean;
+    canRedo(): boolean;
+    undo(): void;
+    redo(): void;
+    /** Inserts a table with a header row, the only shape markdown can represent. */
+    insertTable(rows?: number, columns?: number): void;
+    /** Serializes and reports the document, then lets the host re-render its toolbar state. */
+    private dispatch;
+    private buildKeymap;
+    private commandFor;
+    private markTypeFor;
+    private nodeCheckFor;
+    /** Mirrors ProseMirror's own rule: stored marks when the selection is empty, the range otherwise. */
+    private hasMark;
+    private hasBlock;
+    private hasAncestor;
+}
+export {};

package/library/packages/tools/src/tiptap/utils/md/from-markdown.d.ts

@@ -0,0 +1,11 @@
+import { Node as ProseMirrorNode } from '@tiptap/pm/model';
+
+/**
+ * Turns markdown into a document for the WYSIWYG editor, using the same marked lexer `cx-markdown`
+ * renders with — one markdown dialect in the component, not two.
+ *
+ * Every token marked hands over carries `raw`, its exact source slice. Tokens the schema models are
+ * converted; the rest keep `raw` in an `html_block` / `html_inline` node, which `toMarkdown` replays
+ * verbatim. Nothing is silently discarded.
+ */
+export declare function markdownToDoc(markdown: string): ProseMirrorNode;

package/library/packages/tools/src/tiptap/utils/md/input-rules.d.ts

@@ -0,0 +1,15 @@
+import { Plugin } from '@tiptap/pm/state';
+
+/**
+ * Markdown shorthand that converts as it is typed: `# ` becomes a heading, `- ` a list, `**bold**`
+ * bold. Without these the rich view is a formatting-buttons-only editor, and anyone used to writing
+ * markdown finds their syntax sitting there as literal text.
+ *
+ * Every rule captures the marker the author typed and stores it on the node or mark, so a list
+ * started with `*` serializes back as `*` and one started with `-` as `-`.
+ *
+ * Deliberately excludes the smart quotes, ellipsis and em-dash rules that ship with
+ * prosemirror-example-setup: replacing `"` with `“` or `--` with `–` rewrites the source, which is
+ * exactly what this editor is built not to do.
+ */
+export declare function markdownInputRules(): Plugin;

package/library/packages/tools/src/tiptap/utils/md/schema.d.ts

@@ -0,0 +1,13 @@
+import { Schema } from '@tiptap/pm/model';
+
+/**
+ * Document model for markdown editing.
+ *
+ * Every node that markdown writes more than one way carries the chosen spelling as an attribute —
+ * bullet character, ordered delimiter, fence character, emphasis marker — so an untouched block
+ * serializes back to the bytes it came from instead of to this file's preferences.
+ *
+ * Constructs the model cannot represent are not dropped: `html_block` and `html_inline` hold their
+ * source verbatim and are replayed on the way out.
+ */
+export declare const markdownSchema: Schema<"image" | "blockquote" | "table" | "text" | "heading" | "paragraph" | "frontmatter" | "doc" | "horizontal_rule" | "bullet_list" | "code_block" | "list_item" | "ordered_list" | "table_row" | "table_cell" | "table_header" | "hard_break" | "html_block" | "html_inline", "link" | "code" | "em" | "strong" | "strike">;

package/library/packages/tools/src/tiptap/utils/md/to-markdown.d.ts

@@ -0,0 +1,14 @@
+import { Node as ProseMirrorNode } from '@tiptap/pm/model';
+
+/**
+ * Writes a document back to markdown.
+ *
+ * The counterpart to `from-markdown`: node attributes carry the spelling the author used — bullet
+ * character, ordered delimiter, fence, emphasis marker — and this reuses them rather than imposing a
+ * house style, so an untouched block comes back as the bytes it went in as. `html_block` and
+ * `html_inline` are replayed from their stored source.
+ *
+ * Blocks the user *has* edited are regenerated, and regeneration is canonical: this is the lossy
+ * mode by design. `cx-markdown-viewer`'s `edit` view remains the byte-exact editor.
+ */
+export declare function docToMarkdown(doc: ProseMirrorNode): string;

package/library/packages/types/src/markdown-viewer.d.ts

@@ -0,0 +1,12 @@
+/** Which representation of the markdown `cx-markdown-viewer` is showing. */
+export declare enum MarkdownViewerViewMode {
+    Preview = "preview",
+    Source = "source",
+    /** Plain-text editing of the source. Only reachable when the viewer is `editable`. */
+    Edit = "edit",
+    /**
+     * Rich editing of the same markdown. Only reachable when the viewer is `editable`. Unlike `edit`
+     * this is not byte-exact: blocks the user changes are regenerated from a document model.
+     */
+    Wysiwyg = "wysiwyg"
+}

package/library/packages/types/src/pdf-viewer-toolbar.d.ts

@@ -11,10 +11,11 @@ export type PdfViewerScrollMode = 'page' | 'vertical' | 'horizontal' | 'wrapped'
 /** How page spreads are joined. */
 export type PdfViewerSpreadMode = 'none' | 'odd' | 'even';
 /**
- * The zoom scale. Either a named mode, a percentage zoom factor (as a string, e.g.
- * `'150-percent'` = 150%), or `'custom'` for a non-preset factor shown via `customScalePercent`.
+ * The zoom scale: a named mode, one of the select's percentage presets, or — for a
+ * zoom off that list, e.g. once the zoom buttons step past 400% — the raw scale
+ * factor as a number string (`'4.6'` = 460%).
  */
-export type PdfViewerScaleValue = 'auto' | 'page-actual' | 'page-fit' | 'page-width' | '50-percent' | '75-percent' | '100-percent' | '125-percent' | '150-percent' | '200-percent' | '300-percent' | '400-percent';
+export type PdfViewerScaleValue = 'auto' | 'page-actual' | 'page-fit' | 'page-width' | '50-percent' | '75-percent' | '100-percent' | '125-percent' | '150-percent' | '200-percent' | '300-percent' | '400-percent' | `${number}`;
 /** A row in the "View on asset" dropdown. */
 export interface ViewOnAssetRow {
     checked: boolean;

package/library/packages/utils/src/transformation/transformation.d.ts

@@ -11,3 +11,11 @@ export declare function buildTransformationString({ asset, baseUrl, extension, o
     transformations?: Transformation[];
     useSession?: string;
 }): string;
+/**
+ * Applies transformations to a (possibly finished) asset URL and returns the display URL.
+ *
+ * The backend resolver splits on the FIRST `/t/` after the access key, so for `/AssetLink/`
+ * URLs the transform is anchored right after the access key (before any prettyName/ext tail)
+ * and merged into an existing `/t/`. Other URLs keep the plain append behavior.
+ */
+export declare function applyTransformationsToUrl(url: string, transformations: Transformation[]): string;