@mudlet/mudlet-web 0.5.0 → 1.0.1

package/dist-lib/ui/output/TextAnalyzerModal.d.ts

@@ -0,0 +1,25 @@
+interface Props {
+    /** The raw selection, as taken from the console. Trimmed to its first line
+     *  here rather than by the caller, so the modal can say that it did. */
+    selection: string;
+    onClose: () => void;
+}
+/**
+ * Mudlet's "Analyse characters" report (`TTextEdit::slot_analyseSelection`),
+ * as a dialog rather than as a tooltip.
+ *
+ * Desktop builds the table into the context-menu item's tooltip and shows it on
+ * hover, which works because a Qt tooltip can be arbitrarily large and stays up
+ * while the menu does. In a browser the menu item is a `<button>` and its
+ * `title` is a one-line string the OS draws — so the report gets a dialog of
+ * its own, where it can also be selected and copied, which the tooltip never
+ * allowed.
+ *
+ * The table is transposed from desktop's: Mudlet lays characters out across the
+ * page in rows of about sixteen, which suits a fixed-size tooltip and means a
+ * long selection wraps into a block. Here each character is a row, so the
+ * columns stay aligned however long the selection is and the dialog scrolls
+ * the way every other list in the app does.
+ */
+export declare function TextAnalyzerModal({ selection, onClose }: Props): import("react").ReactPortal;
+export {};

package/dist-lib/ui/output/caretMode.d.ts

@@ -18,8 +18,9 @@ export type CaretShortcut = 'none' | 'tab' | 'ctrltab' | 'f6';
  *  and the modifier flags. */
 export declare function matchCaretToggle(e: KeyboardEvent, shortcut: CaretShortcut): boolean;
 /** The rendered line elements under the main output wrapper, in order. Each
- *  logical line is one `div.output-msg`; the height:0 sticky sentinel and any
- *  other children are skipped (mirrors WindowManager.lineElements). */
+ *  logical line is one `div.output-msg`, inside a scrollback block
+ *  (outputRows.ts); the height:0 sticky sentinel and any other children are
+ *  skipped (mirrors WindowManager.lineElements). */
 export declare function outputLineElements(outputEl: HTMLElement): HTMLElement[];
 /**
  * Clone one rendered output line for the review surface and revive its links.

package/dist-lib/ui/output/clearSplit.d.ts

@@ -1,3 +1,6 @@
+/** The height in px the split view's lower pane opens at, before the player
+ *  drags it. */
+export declare const DEFAULT_SPLIT_PANE_HEIGHT = 160;
 /**
  * Closing the split view — Mudlet's `TConsole::clearSplit`, which drops the
  * frozen upper pane and puts the console back on the tail. Mudlet reaches it
@@ -15,3 +18,11 @@ export declare function matchClearSplitKey(e: KeyboardEvent): boolean;
 export declare function isClearSplitClick(e: {
     button: number;
 }): boolean;
+/**
+ * The page the main command line's PageUp / PageDown scroll the main console by
+ * (`TCommandLine::event` → `TConsole::scrollUp/scrollDown`), or null when `e`
+ * is not one. Plain keys only, typed into the main command line: desktop offers
+ * a modified PageUp to the keybinding engine instead, and Qt reports a numpad
+ * key with KeypadModifier set, so that one is not plain either.
+ */
+export declare function matchPageScrollKey(e: KeyboardEvent): 'up' | 'down' | null;

package/dist-lib/ui/output/outputCopy.d.ts

@@ -1,7 +1,44 @@
 /** True when the current selection touches any line inside `container`. */
 export declare function hasSelectionIn(container: HTMLElement): boolean;
+/** A selection as desktop's TTextEdit holds it (mPA / mPB): the line and
+ *  column of its first character and of its last, buffer lines counted from
+ *  0. All zero when nothing in the console is selected. */
+export interface SelectionBounds {
+    startX: number;
+    startY: number;
+    endX: number;
+    endY: number;
+}
+export declare const NO_SELECTION_BOUNDS: SelectionBounds;
+/**
+ * Where the selection lies in `container`, in the form addMouseEvent handlers
+ * receive it (TTextEdit::slot_mouseAction passes mPA.x, mPA.y, mPB.x, mPB.y).
+ * The end is the last selected character, not one past it.
+ */
+export declare function selectionBounds(container: HTMLElement): SelectionBounds;
+/** True when this console holds any line at all — what separates "nothing is
+ *  selected" from "there is nothing here to copy". */
+export declare function hasCopyableLines(container: HTMLElement): boolean;
+/** Open a web search for the selected text, the way Mudlet's
+ *  `TTextEdit::searchSelectionOnline` does. `engine` is a {@link SEARCH_ENGINES}
+ *  key; an unknown one falls back to the default engine. */
+export declare function searchSelectionOnline(engine: string | undefined): void;
+/** The current selection's ranges, cloned so later collapsing cannot disturb
+ *  them. Empty when nothing is selected. */
+export declare function saveSelection(): Range[];
+/**
+ * Put `saved` back when the selection has since been collapsed — the browser
+ * does that on a right-click outside the selection, and whenever a text field
+ * takes focus. A selection that survived is left alone, and so is one whose
+ * lines have since scrolled out of the buffer (restoring a detached range would
+ * select nothing at all).
+ */
+export declare function restoreSelection(container: HTMLElement, saved: Range[]): void;
 /** Select every line in the container (Range over its contents). */
 export declare function selectAll(container: HTMLElement): void;
+/** The native selection text verbatim (character-precise). Timestamps sit in a
+ *  `user-select: none` span, so they are absent here as they are from a copy. */
+export declare function selectionText(): string;
 /** Copy the native selection text verbatim (character-precise). */
 export declare function copySelectionText(): Promise<void>;
 /**
@@ -10,6 +47,8 @@ export declare function copySelectionText(): Promise<void>;
  * paste it rendered) and `text/plain` (so plain targets paste the HTML markup
  * itself), with a `writeText` fallback for browsers without ClipboardItem.
  */
-export declare function copySelectionAsHtml(container: HTMLElement): Promise<void>;
-/** Copy the selected lines to the clipboard as a PNG image. */
+export declare function copySelectionAsHtml(container: HTMLElement, sourceName?: string): Promise<void>;
+/** Copy the selection to the clipboard as a PNG image, falling back to a
+ *  picture of the visible area when nothing is selected — unlike Copy and Copy
+ *  as HTML, "as image" has an obvious default (Mudlet #9715). */
 export declare function copySelectionAsImage(container: HTMLElement): Promise<void>;

package/dist-lib/ui/output/outputRows.d.ts

@@ -0,0 +1,43 @@
+export declare const OUTPUT_ROW_CLASS = "output-msg";
+export declare const OUTPUT_BLOCK_CLASS = "output-block";
+/** The newest block, still being written to, which is always rendered. */
+export declare const OUTPUT_OPEN_BLOCK_CLASS = "output-block--open";
+/** Rows a block holds before the next row starts a new one. */
+export declare const OUTPUT_BLOCK_ROWS = 100;
+export declare function isOutputBlock(el: Element | null): el is HTMLElement;
+/**
+ * Add `row` as the console's newest line: into the last block before
+ * `sentinel` (the end of the scroller when null), or a new block when that
+ * one is full or there is none.
+ */
+export declare function appendRow(container: HTMLElement, row: HTMLElement, sentinel?: Element | null): void;
+/** Every row of the console, oldest first. */
+export declare function outputRows(container: Element): HTMLElement[];
+/** The last `n` rows of the console, oldest first. */
+export declare function lastRows(container: Element, n: number): HTMLElement[];
+/** How many rows the console holds. Counts blocks, not rows. */
+export declare function rowCount(container: Element): number;
+/** The row at 0-based `index`, or null past either end. */
+export declare function rowAt(container: Element, index: number): HTMLElement | null;
+/** `row`'s 0-based position in the console, or -1 when it is not one of its rows. */
+export declare function rowIndex(container: Element, row: Element): number;
+/** The newest row, or null when the console is empty. */
+export declare function lastRow(container: Element): HTMLElement | null;
+/** The row before `row`, across a block boundary; null at the oldest. */
+export declare function previousRow(row: Element): HTMLElement | null;
+/** The row after `row`, across a block boundary; null at the newest. */
+export declare function nextRow(row: Element): HTMLElement | null;
+/** Take `el` out of its parent, and the block it was in with it once empty. */
+export declare function detachRow(el: Element): void;
+/**
+ * Take a run of `rows` out of the DOM at once — eviction's batch removal. A
+ * trim takes lines off the head of the console, which sit side by side in a
+ * few blocks: a block they fill goes whole, and the part of one they share
+ * with lines that stay goes as one Range deletion. Rows not side by side in
+ * their parent (some other element between two of them) are removed one at a
+ * time, so nothing that is not one of these rows is touched.
+ */
+export declare function detachRows(rows: readonly Element[]): void;
+/** Remove every row (and block) of the console, keeping anything else — the
+ *  sticky sentinel. */
+export declare function clearRows(container: Element): void;

package/dist-lib/ui/output/selectionGesture.d.ts

@@ -0,0 +1,35 @@
+/**
+ * Telling a click that *made* a selection from a click that is about to clear
+ * one — the question the console asks before handing focus back to the command
+ * line, since focusing a text field collapses the page selection.
+ *
+ * It cannot be answered by looking at the selection alone. Chrome collapses a
+ * selection on the click that lands inside it, but not until the tick *after*
+ * the click handler runs, so at that moment "text is selected" is equally true
+ * of a drag that just selected it and a click that is about to throw it away.
+ * (Clicking outside the selection is different again: that collapses on mouseup,
+ * before the click.) The gesture is what separates them — a drag or a
+ * multi-click selects, a plain single click does not.
+ */
+/** The part of a click event this predicate reads. */
+export interface ClickGesture {
+    /** Clicks in this sequence — 2 and 3 are the double/triple click that select
+     *  a word and a line. */
+    detail: number;
+    /** Shift+click extends an existing selection rather than clearing it. */
+    shiftKey: boolean;
+    clientX: number;
+    clientY: number;
+}
+/**
+ * True when this click is the end of a gesture that selected text, and so must
+ * be left alone. False for a plain click — including one on top of an existing
+ * selection, which the browser is about to collapse anyway.
+ *
+ * `downAt` is where the button went down (null when the press was not seen, e.g.
+ * a click synthesised by the keyboard).
+ */
+export declare function clickMadeSelection(e: ClickGesture, downAt: {
+    x: number;
+    y: number;
+} | null, selectedText: string): boolean;

package/dist-lib/ui/output/wordSelection.d.ts

@@ -0,0 +1,33 @@
+/**
+ * Mudlet's "Stop selecting a word on these characters"
+ * (`doubleclick_ignore_lineedit`).
+ *
+ * A double-click in the main display is the browser's own word selection, and
+ * the browser's idea of a word is not configurable. Mudlet's is: a profile can
+ * name extra characters that end a word, so double-clicking `"Ancalagon"` in a
+ * game that quotes names gives you the name rather than the name plus quotes.
+ *
+ * So the selection is narrowed after the fact — the browser picks a range, and
+ * this pulls each end inward past any listed character. Narrowing only: a
+ * double-click never selects *more* than the browser would, which keeps the
+ * behaviour predictable when the character set is empty or unhelpful.
+ */
+/**
+ * Where the selection should end up, given the text the browser selected and
+ * the characters that end a word. Pure, so the edge cases are testable without
+ * a DOM: returns offsets into `text`, always within the original `[start, end)`.
+ *
+ * Trims from both ends, then — because a boundary character in the *middle* is
+ * a boundary too — keeps the run containing the click. `anchor` is where in the
+ * text the user actually clicked; the run covering it is the one they meant.
+ */
+export declare function trimWordSelection(text: string, start: number, end: number, ignore: string, anchor?: number): {
+    start: number;
+    end: number;
+};
+/**
+ * Apply {@link trimWordSelection} to the live selection after a double-click.
+ * A no-op when the selection spans more than one text node — that is a
+ * multi-line or cross-span selection, which is not what a word looks like.
+ */
+export declare function trimSelectionForDoubleClick(ignore: string): void;

package/dist-lib/ui/search/matcher.d.ts

@@ -1,7 +1,8 @@
 /**
  * The query compiler shared by every search bar in the app (the script editor's
- * `ScriptSearch`, the output find bar). Turns a raw query plus the case/regex
- * toggles into something that hands back match ranges for any string.
+ * `ScriptSearch`, the output find bar). Turns a raw query plus the
+ * case/regex/whole-word toggles into something that hands back match ranges for
+ * any string.
  */
 /** Half-open `[start, end)` character offsets of one match. */
 export type MatchRange = [number, number];
@@ -11,5 +12,14 @@ export interface SearchMatcher {
     valid: boolean;
     ranges: (s: string) => MatchRange[];
 }
-/** Compile a search bar query into a matcher honouring the case / regex flags. */
-export declare function buildMatcher(pattern: string, matchCase: boolean, useRegex: boolean): SearchMatcher;
+/**
+ * Compile a search bar query into a matcher honouring the case / regex /
+ * whole-word flags.
+ *
+ * `wholeWord` follows `dlgTriggerEditor::findSearchMatch`
+ * (dlgTriggerEditor.cpp:13128-13148): the escaped needle wrapped in `\b…\b`. It
+ * composes with regex mode too, which desktop has no equivalent for since its
+ * search has no regex option — there the pattern is bracketed as written rather
+ * than escaped, so `gold|silver` matches either word whole.
+ */
+export declare function buildMatcher(pattern: string, matchCase: boolean, useRegex: boolean, wholeWord?: boolean): SearchMatcher;

package/dist-lib/ui/settings/SettingsShell.d.ts

@@ -0,0 +1,91 @@
+import { type ReactNode } from 'react';
+import { type LucideIcon } from 'lucide-react';
+/**
+ * The sidebar-and-cards settings shell, ported from Mudlet's settings redesign
+ * (`dlgProfilePreferences` on its `settings-redesign` branch): a category
+ * sidebar down the left, a "Find in settings" field over a single reading
+ * column of cards, subpages reached by drilling into a card, and search results
+ * that gather the matching cards from every category under their own headings.
+ *
+ * Mudlet moves its real widgets between pages because Qt lets it. React does
+ * not, so every card is mounted once, in declaration order, and hidden when it
+ * is not on the page being shown — which is also what lets the search index be
+ * read straight off the rendered DOM instead of being duplicated as strings.
+ */
+export type CategoryKey = 'general' | 'appearance' | 'mainDisplay' | 'inputLine' | 'editor' | 'shortcuts' | 'mapper' | 'media' | 'connection' | 'privacy' | 'accessibility' | 'advanced';
+export interface CategoryDefinition {
+    key: CategoryKey;
+    /** Sidebar row, page title, and the heading a search result is filed under. */
+    label: string;
+    Icon: LucideIcon;
+    /** Mudlet's one sidebar separator, above Connection: what sits below it is
+     *  about the game and the machine rather than about the client. */
+    separatorAbove?: boolean;
+}
+/** Sidebar order, icon and name — the one place a category is declared.
+ *  Mirrors Mudlet's `categoryDefinitions()`, minus the category the web client
+ *  has nothing to put on (Chat and sharing) and plus the one it does that
+ *  Mudlet keeps on a toolbar instead (Sound and media). */
+export declare const CATEGORIES: CategoryDefinition[];
+/** A page reached by drilling into a card: the sidebar stays on the parent
+ *  category and a breadcrumb with a back chevron leads out. */
+export interface SubpageDefinition {
+    /** Unique across the dialog; the shell's `subpage` state and a card's
+     *  `subpage` field both name a subpage by this. */
+    key: string;
+    category: CategoryKey;
+    /** What the breadcrumb calls it: "Connection › Game protocols". */
+    title: string;
+}
+export interface CardDefinition {
+    id: string;
+    category: CategoryKey;
+    /** Set to put the card on that subpage instead of on the category page. */
+    subpage?: string;
+    /** Omitted for a card that is a bare row rather than a titled group. */
+    title?: string;
+    /** One muted line under the title saying what the card is for. */
+    description?: ReactNode;
+    /** Where "Learn more" at the end of the description leads. */
+    learnMore?: string;
+    /** Words a player might type for a setting whose own text does not include
+     *  them — folded into the card's search text, never shown. */
+    keywords?: string;
+    body: ReactNode;
+}
+interface SettingsShellProps {
+    cards: CardDefinition[];
+    subpages: SubpageDefinition[];
+    category: CategoryKey;
+    onCategory: (next: CategoryKey) => void;
+    /** Which subpage is showing, or null for the category page. */
+    subpage: string | null;
+    onSubpage: (next: string | null) => void;
+    /** The one sidebar row that is a link rather than a category — Mudlet's
+     *  "Mudlet support", at the bottom under its own separator. Omit it and the
+     *  row (and the offer under an empty search) goes away, which is how a
+     *  branded build avoids pointing its players at someone else's wiki. */
+    support?: {
+        label: string;
+        url: string;
+    };
+    /** Opens the Help topic listing which desktop Mudlet preferences are absent
+     *  here and why. Shown as a sidebar row, and offered again when a search
+     *  finds nothing — the two moments a player is hunting for a setting that
+     *  isn't there. Omitted like `support` by a branded build, which is not a
+     *  subset of Mudlet as far as its own players are concerned. */
+    differences?: {
+        label: string;
+        onOpen: () => void;
+    };
+}
+export declare function SettingsShell({ cards, subpages, category, onCategory, subpage, onSubpage, support, differences }: SettingsShellProps): import("react/jsx-runtime").JSX.Element;
+interface SubpageRowProps {
+    label: string;
+    /** What the row reports about the page behind it — Mudlet's "9 of 10 turned on". */
+    summary: string;
+    onOpen: () => void;
+}
+/** The chevron row a card carries when its settings live on a subpage. */
+export declare function SubpageRow({ label, summary, onOpen }: SubpageRowProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist-lib/ui/settings/ShortcutEditor.d.ts

@@ -0,0 +1,13 @@
+import { type AppCommandId, type ShortcutOverrides } from '../commands/appShortcuts';
+import './ShortcutEditor.css';
+interface Props {
+    overrides: ShortcutOverrides | undefined;
+    platform: string;
+    /** Write one command's binding. An empty string clears it; `undefined`
+     *  puts it back to the platform default. */
+    onChange: (id: AppCommandId, shortcut: string | undefined) => void;
+    /** Put every binding back to its default. */
+    onResetAll: () => void;
+}
+export declare function ShortcutEditor({ overrides, platform, onChange, onResetAll }: Props): import("react/jsx-runtime").JSX.Element;
+export {};