@fiddle-digital/string-tune 1.1.55 → 1.2.1-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -469,12 +469,13 @@ declare class StringObject {
469
469
  * Mirror objects linked via `string-copy-from`.
470
470
  */
471
471
  private mirrors;
472
+ private _cachedMirrorObjects;
473
+ private _cachedConnects;
474
+ private _mirrorsDirty;
472
475
  /**
473
476
  * Internal key-value store of dynamic object properties (like offsets, progress, etc.).
474
477
  */
475
478
  private properties;
476
- private eventNameCache;
477
- private eventNameSuffixCache;
478
479
  /**
479
480
  * Modules currently connected to this object.
480
481
  */
@@ -484,6 +485,8 @@ declare class StringObject {
484
485
  * Provides functionality to register, trigger, and manage event listeners.
485
486
  */
486
487
  events: EventManager;
488
+ private eventNameCache;
489
+ private eventNameSuffixCache;
487
490
  constructor(id: string, element: HTMLElement);
488
491
  /**
489
492
  * Returns a cached event name in one of these forms:
@@ -521,6 +524,8 @@ declare class StringObject {
521
524
  remove(): void;
522
525
  setInviewAutoBlocked(blocked: boolean): void;
523
526
  isInviewAutoBlocked(): boolean;
527
+ setInviewManualActive(active: boolean): void;
528
+ isInviewManualActive(): boolean;
524
529
  syncInviewClass(): void;
525
530
  /**
526
531
  * Shows the object, applies visual class and notifies connected modules.
@@ -539,6 +544,7 @@ declare class StringObject {
539
544
  isConnectedTo(module: IStringModule): boolean;
540
545
  setTokens(tokens: StringToken[]): void;
541
546
  getToken(key: string): StringToken | null;
547
+ private updateMirrorsCache;
542
548
  addMirror(mirror: StringMirrorObject): void;
543
549
  removeMirror(id: string): void;
544
550
  get mirrorObjects(): StringMirrorObject[];
@@ -757,7 +763,7 @@ declare class LerpTool implements IStringTool<LerpInput, number> {
757
763
  */
758
764
  interface UnitParserInput {
759
765
  /** Unit string, e.g. `"20px"`, `"50%"`, `"1.5rem"`, or `"selfHeight"` */
760
- value: string;
766
+ value: string | number;
761
767
  /** DOM element used for `"selfHeight"` calculation */
762
768
  element: HTMLElement;
763
769
  /** Viewport height in pixels (for percentage conversion) */
@@ -1060,7 +1066,9 @@ interface ISplitOptionItem {
1060
1066
  * Holds arrays of option definitions for each split type.
1061
1067
  */
1062
1068
  interface ISplitOptions {
1069
+ segment?: "legacy" | "visual";
1063
1070
  fit?: boolean;
1071
+ trimInlineGaps?: boolean;
1064
1072
  line?: ISplitOptionItem[];
1065
1073
  word?: ISplitOptionItem[];
1066
1074
  char?: ISplitOptionItem[];
@@ -1084,6 +1092,7 @@ declare class SplitOptionsParserTool implements IStringTool<SplitOptionsParserIn
1084
1092
  process({ attributeValue }: SplitOptionsParserInput): ISplitOptions;
1085
1093
  private toCamelCase;
1086
1094
  private parseParamsArray;
1095
+ private parseSegmentMode;
1087
1096
  }
1088
1097
 
1089
1098
  interface RuleParserInput {
@@ -1237,6 +1246,29 @@ type AttributeMapping = {
1237
1246
  transform?: (value: any) => any;
1238
1247
  };
1239
1248
 
1249
+ type StringSignalValue = number | boolean | string | null;
1250
+ declare class StringSignalHub {
1251
+ private readonly emit;
1252
+ private values;
1253
+ constructor(emit: (eventName: string, payload?: any) => void);
1254
+ publish(objectId: string, signal: string, value: StringSignalValue): void;
1255
+ subscribe(objectId: string, signal: string, events: {
1256
+ on<T = any>(eventName: string, callback: EventCallback<T>, id?: string | null): void;
1257
+ }, callback: EventCallback<StringSignalValue>): void;
1258
+ unsubscribe(objectId: string, signal: string, events: {
1259
+ off<T = any>(eventName: string, callback: EventCallback<T>, id?: string): void;
1260
+ }, callback: EventCallback<StringSignalValue>): void;
1261
+ get(objectId: string, signal: string): StringSignalValue | undefined;
1262
+ getEventName(objectId: string, signal: string): string;
1263
+ private getKey;
1264
+ }
1265
+
1266
+ interface ParseContext {
1267
+ element?: HTMLElement;
1268
+ boundingRect?: DOMRect;
1269
+ viewportHeight?: number;
1270
+ baseRem?: number;
1271
+ }
1240
1272
  /**
1241
1273
  * Base class for a module used in the string-tune system.
1242
1274
  * Extend this class to create custom modules that respond to scroll, resize, input, etc.
@@ -1328,6 +1360,7 @@ declare class StringModule implements IStringModule {
1328
1360
  * Object manager for layout refreshes and in-view recalculation.
1329
1361
  */
1330
1362
  protected objectManager: ObjectManager;
1363
+ protected signals: StringSignalHub;
1331
1364
  permissions: ModuleLifecyclePermissions;
1332
1365
  constructor(context: StringContext);
1333
1366
  /**
@@ -1370,12 +1403,7 @@ declare class StringModule implements IStringModule {
1370
1403
  * @param context Optional helper values like element or viewport size.
1371
1404
  * @returns The parsed and transformed value.
1372
1405
  */
1373
- protected parseAttribute(value: string | null, type: AttributeType, context?: {
1374
- element?: HTMLElement;
1375
- boundingRect?: DOMRect;
1376
- viewportHeight?: number;
1377
- baseRem?: number;
1378
- }): any;
1406
+ protected parseAttribute(value: string | number | null, type: AttributeType, context?: ParseContext): any;
1379
1407
  /**
1380
1408
  * Determines whether the module should attach to a given object,
1381
1409
  * based on the presence of the module's `htmlKey` in the object keys.
@@ -1398,6 +1426,7 @@ declare class StringModule implements IStringModule {
1398
1426
  * Registers the object internally when it enters the module’s scope.
1399
1427
  */
1400
1428
  enterObject(id: string, object: StringObject): void;
1429
+ protected fastRemoveFromArray<T>(array: T[], index: number): void;
1401
1430
  /**
1402
1431
  * Unregisters the object when it leaves the module’s scope.
1403
1432
  */
@@ -1436,6 +1465,8 @@ declare class StringModule implements IStringModule {
1436
1465
  * @param object The disconnected object.
1437
1466
  */
1438
1467
  onObjectDisconnected(object: StringObject): void;
1468
+ protected get respectSelfDisable(): boolean;
1469
+ protected isPrimaryElementEnabled(object: StringObject): boolean;
1439
1470
  /**
1440
1471
  * Applies a style or callback to both the main element and all its connected elements.
1441
1472
  *
@@ -1463,6 +1494,8 @@ declare class StringModule implements IStringModule {
1463
1494
  * Returns a cached per-object event name to avoid building strings in hot paths.
1464
1495
  */
1465
1496
  protected getObjectEventName(object: StringObject, prefix: string, suffix?: string): string;
1497
+ protected emitSignal(object: StringObject, signal: string, value: StringSignalValue): void;
1498
+ protected getSignal(objectId: string, signal: string): StringSignalValue | undefined;
1466
1499
  protected clearManagedStyles(object: StringObject): void;
1467
1500
  protected onObjectModeActivated(object: StringObject): void;
1468
1501
  protected onObjectModeDeactivated(object: StringObject): void;
@@ -1695,6 +1728,10 @@ interface StringContext {
1695
1728
  * Manages all interactive objects (elements with `string-*` attributes).
1696
1729
  */
1697
1730
  objectManager: ObjectManager;
1731
+ /**
1732
+ * Lightweight stateful signal transport for object-scoped values.
1733
+ */
1734
+ signals: StringSignalHub;
1698
1735
  }
1699
1736
 
1700
1737
  /**
@@ -1788,6 +1825,27 @@ declare class StringImpulse extends StringModule {
1788
1825
  onMutate(): void;
1789
1826
  }
1790
1827
 
1828
+ declare class StringMarquee extends StringModule {
1829
+ private onFontsReadyBound;
1830
+ constructor(context: StringContext);
1831
+ onInit(): void;
1832
+ onUnsubscribe(): void;
1833
+ onObjectConnected(object: StringObject): void;
1834
+ onObjectDisconnected(object: StringObject): void;
1835
+ onResizeWidth(): void;
1836
+ onFrame(data: StringData): void;
1837
+ private createState;
1838
+ private mountStructure;
1839
+ private syncConfig;
1840
+ private refresh;
1841
+ private syncCopies;
1842
+ private syncPartClass;
1843
+ private updatePartProgress;
1844
+ private onFontsReady;
1845
+ private onMouseEnter;
1846
+ private onMouseLeave;
1847
+ }
1848
+
1791
1849
  declare class StringMasonry extends StringModule {
1792
1850
  private states;
1793
1851
  constructor(context: StringContext);
@@ -2053,11 +2111,31 @@ declare class StringScrollbar extends StringModule {
2053
2111
  * computes alignment/random values, and applies CSS vars.
2054
2112
  */
2055
2113
  declare class StringSplit extends StringModule {
2114
+ /** Last content-width (px) at which each element was split. Keyed by element itself. */
2115
+ private lastSplitWidth;
2056
2116
  constructor(context: StringContext);
2057
2117
  onInit(): void;
2118
+ onObjectDisconnected(object: StringObject): void;
2058
2119
  onResizeWidth(): void;
2059
2120
  onObjectConnected(object: StringObject): void;
2060
- split(element: HTMLElement, options: ISplitOptions): {
2121
+ private extractTextContent;
2122
+ private getSplitOptions;
2123
+ private hasLineDrivenSplit;
2124
+ private needsWidthRebuild;
2125
+ private needsForcedRebuildOnFontLoad;
2126
+ private getDebugStoreKey;
2127
+ private writeDebugRecord;
2128
+ private isDebugEnabled;
2129
+ private getDebugLabel;
2130
+ private logConnectionStart;
2131
+ private captureBaselineSnapshot;
2132
+ private logSplitAnalysis;
2133
+ private getTokenDebugText;
2134
+ private logRenderedState;
2135
+ private applyFlexLineBreaks;
2136
+ private getBlockContainerContentWidth;
2137
+ private getElementContentWidth;
2138
+ split(element: HTMLElement, options: ISplitOptions, debugEnabled?: boolean): {
2061
2139
  fragment: DocumentFragment;
2062
2140
  result: DocumentFragment;
2063
2141
  extraProps: Map<string, string>;
@@ -2574,6 +2652,16 @@ declare class StringProgressPart extends StringModule {
2574
2652
  onObjectDisconnected(object: StringObject): void;
2575
2653
  }
2576
2654
 
2655
+ declare class StringSignal extends StringModule {
2656
+ constructor(context: StringContext);
2657
+ onObjectConnected(object: StringObject): void;
2658
+ onObjectDisconnected(object: StringObject): void;
2659
+ private applyRuleState;
2660
+ private applyEffectState;
2661
+ private applyEffect;
2662
+ private resetEffect;
2663
+ }
2664
+
2577
2665
  type Job = () => void;
2578
2666
  declare class FrameDOM {
2579
2667
  private measureQueue;
@@ -2591,104 +2679,36 @@ declare class StringRandom extends StringModule {
2591
2679
  onObjectConnected(object: StringObject): void;
2592
2680
  }
2593
2681
 
2594
- /**
2595
- * Base class for managing scroll behavior in the system.
2596
- * Handles abstract scroll state and updates, intended for extension.
2597
- */
2598
2682
  declare class ScrollController {
2599
- /** Shared context containing data and tools */
2600
2683
  protected context: StringContext;
2601
- /** Reference to the document object */
2602
2684
  protected document: Document;
2603
- /** Name of the scroll mode (e.g. 'default', 'smooth', etc.) */
2604
2685
  name: string;
2605
- /** Whether the system is in programmatic scroll mode */
2606
2686
  isProg: boolean;
2607
- /** Whether parallax-related logic should be active */
2608
2687
  isParallaxEnabled: boolean;
2609
- /** Scroll direction: vertical or horizontal */
2610
- protected _scrollDirection: "vertical" | "horizontal";
2611
- /**
2612
- * Current scroll direction.
2613
- * - `true` — scrolling down
2614
- * - `false` — scrolling up
2615
- * - `null` — unknown (initial state)
2616
- */
2617
- protected isBottomScrollDirection: boolean | null;
2688
+ protected _isVertical: boolean;
2689
+ protected _scrollDirState: number;
2690
+ protected _lastAppliedDirState: number;
2618
2691
  protected isLastBottomScrollDirection: boolean;
2619
2692
  protected scrollTriggerRules: Array<ScrollMarkRule>;
2620
- /** Tracks whether this controller is currently active */
2621
2693
  protected isActive: boolean;
2622
- /** Last direction applied to DOM classes (for global-class toggles) */
2623
- protected lastAppliedDirection: boolean | null;
2624
- /**
2625
- * Sets scroll direction and updates internal scroll logic.
2626
- * @param scrollDirection Either 'vertical' or 'horizontal'.
2627
- */
2628
- set scrollDirection(scrollDirection: "vertical" | "horizontal");
2629
- /**
2630
- * Creates a new ScrollController instance.
2631
- * @param context Shared context containing data and settings.
2632
- */
2694
+ set scrollDirection(dir: "vertical" | "horizontal");
2633
2695
  constructor(context: StringContext);
2634
- /**
2635
- * Called when scroll direction changes (up ↔ down).
2636
- * Override this callback in subclasses or instances.
2637
- */
2638
2696
  onChangeDirection: () => void;
2639
- /**
2640
- * Called when scroll starts (user input).
2641
- * Override this callback in subclasses or instances.
2642
- */
2643
2697
  onScrollStart: () => void;
2644
- /**
2645
- * Called when scroll ends.
2646
- * Override this callback in subclasses or instances.
2647
- */
2648
2698
  onScrollStop: () => void;
2649
- /**
2650
- * Scroll-to function called on each frame.
2651
- * This will be reassigned depending on scroll direction.
2652
- */
2653
- onCalcUpdate: () => void;
2654
- /**
2655
- * Called every animation frame.
2656
- * Intended to be overridden in subclasses.
2657
- */
2699
+ onCalcUpdate(): void;
2658
2700
  onFrame(): void;
2659
- /**
2660
- * Called when wheel event is fired.
2661
- * Override to implement custom scroll interaction.
2662
- * @param e Wheel event.
2663
- */
2664
2701
  onWheel(e: any): void;
2665
- /**
2666
- * Called when native scroll event is fired.
2667
- * Override to track native scroll position.
2668
- * @param e Scroll event.
2669
- */
2670
2702
  onScroll(e: any): void;
2703
+ onTouchStart(e: TouchEvent): void;
2704
+ onTouchMove(e: TouchEvent): void;
2705
+ onTouchEnd(e: TouchEvent): void;
2671
2706
  disableScrollEvents(): void;
2672
2707
  enableScrollEvents(): void;
2673
- /**
2674
- * Called when this controller becomes the active scroll engine.
2675
- * Ensures event bindings are attached only once.
2676
- */
2677
2708
  activate(): void;
2678
- /**
2679
- * Called when this controller is deactivated.
2680
- * Ensures event bindings are detached only once.
2681
- */
2682
2709
  deactivate(): void;
2683
- /**
2684
- * Allows controllers to clean up resources on global destroy.
2685
- */
2686
2710
  destroy(): void;
2687
- /**
2688
- * Updates scroll direction state, emits events, and toggles global classes.
2689
- * Intended for reuse by custom scroll adapters.
2690
- */
2691
- protected updateScrollDirection(newDirection: boolean): void;
2711
+ protected updateScrollDirection(isDown: boolean): void;
2692
2712
  protected clearScrollingClasses(): void;
2693
2713
  protected triggerScrollRules(): void;
2694
2714
  addScrollMark(rule: ScrollMarkRule): void;
@@ -2699,11 +2719,31 @@ declare class ScrollController {
2699
2719
  interface StringDevtoolState {
2700
2720
  active: boolean;
2701
2721
  }
2722
+ interface StringDevtoolHotkey {
2723
+ key: string;
2724
+ shiftKey?: boolean;
2725
+ ctrlKey?: boolean;
2726
+ altKey?: boolean;
2727
+ metaKey?: boolean;
2728
+ }
2729
+ interface StringDevtoolSubBadge {
2730
+ id: string;
2731
+ icon: string;
2732
+ label: string;
2733
+ /** Extra attribute used as a CSS selector hook (e.g. "data-string-grid-global-toggle"). */
2734
+ selectorAttribute?: string;
2735
+ /** Additional data-* attributes applied to the badge button. */
2736
+ attributes?: Record<string, string | boolean | number | null | undefined>;
2737
+ onClick: (anchorElement?: HTMLElement) => void;
2738
+ }
2702
2739
  interface StringDevtoolDefinition {
2703
2740
  id: string;
2704
2741
  label: string;
2705
2742
  icon: string;
2706
2743
  order?: number;
2744
+ group?: number;
2745
+ hotkey?: StringDevtoolHotkey;
2746
+ subBadges?: StringDevtoolSubBadge[];
2707
2747
  getState: () => StringDevtoolState;
2708
2748
  setActive: (active: boolean) => void;
2709
2749
  subscribe?: (listener: (state: StringDevtoolState) => void) => () => void;
@@ -2744,6 +2784,16 @@ interface StringDevModuleDefinitionConfig {
2744
2784
  label: string;
2745
2785
  icon: string;
2746
2786
  order?: number;
2787
+ group?: number;
2788
+ hotkey?: StringDevtoolHotkey;
2789
+ }
2790
+ interface StringDevConnectsConfig {
2791
+ /** If true, connects to every StringObject (overlay default). If false, only explicit matches below + dev-inspect fallback. */
2792
+ global?: boolean;
2793
+ /** Connect to objects whose string="…" token list includes any of these keys. */
2794
+ keys?: string[];
2795
+ /** Connect to objects whose DOM element has any of these attributes present. */
2796
+ attributes?: string[];
2747
2797
  }
2748
2798
  interface StringDevOverlayConfig {
2749
2799
  /** Unique layer name, e.g. "devtools-progress" */
@@ -2764,6 +2814,8 @@ interface StringDevModuleConfig extends StringDevModuleDefinitionConfig {
2764
2814
  styles?: string | (() => string);
2765
2815
  /** Overlay layer configuration. Declare for any module that uses a viewport layer. */
2766
2816
  overlay?: StringDevOverlayConfig;
2817
+ /** Declare which StringObjects this module connects to. Replaces htmlKey assignment in constructor. */
2818
+ connects?: StringDevConnectsConfig;
2767
2819
  }
2768
2820
  declare class StringDevModule extends StringModule implements StringDevtoolProvider {
2769
2821
  /** Declare module metadata statically. Subclasses override this. */
@@ -2771,12 +2823,18 @@ declare class StringDevModule extends StringModule implements StringDevtoolProvi
2771
2823
  protected readonly overlayRegistry: StringDevOverlayRegistry;
2772
2824
  private readonly acquiredViewportLayers;
2773
2825
  private readonly devtoolListeners;
2826
+ private hotkeyHandler;
2774
2827
  protected devtoolConfig: StringDevModuleDefinitionConfig | null;
2775
2828
  constructor(context: StringContext);
2829
+ protected get respectSelfDisable(): boolean;
2830
+ protected get connectsConfig(): StringDevConnectsConfig | undefined;
2831
+ canConnect(object: StringObject): boolean;
2776
2832
  protected getStyleScopeId(stylesText: string): string;
2777
2833
  protected getStyles(): string | null;
2778
2834
  getDevtoolDefinition(): StringDevtoolDefinition | null;
2835
+ protected getDevtoolSubBadges(): StringDevtoolSubBadge[];
2779
2836
  protected configureDevtool(config: StringDevModuleDefinitionConfig): void;
2837
+ protected bindDevtoolHotkey(hotkey?: StringDevtoolHotkey): void;
2780
2838
  protected emitDevtoolState(active?: boolean): void;
2781
2839
  protected acquireViewportLayer(id: string, zIndex: number): StringDevViewportLayer;
2782
2840
  protected releaseViewportLayer(id: string): void;
@@ -2793,7 +2851,7 @@ declare function buildGridCSS(): string;
2793
2851
  * StringDevLayout — developer utility module for layout overlays.
2794
2852
  *
2795
2853
  * Usage:
2796
- * <div string="grid">...</div>
2854
+ * <div string="layout">...</div>
2797
2855
  *
2798
2856
  * No configuration attributes needed. All configuration happens
2799
2857
  * through the interactive HUD panel (hover top-right corner).
@@ -2806,6 +2864,7 @@ declare function buildGridCSS(): string;
2806
2864
  declare class StringDevLayout extends StringDevModule {
2807
2865
  private gridManager;
2808
2866
  private viewportLayer;
2867
+ private overlayLayer;
2809
2868
  private overlays;
2810
2869
  private huds;
2811
2870
  private elementMap;
@@ -2814,15 +2873,29 @@ declare class StringDevLayout extends StringDevModule {
2814
2873
  private enabled;
2815
2874
  private needsMeasure;
2816
2875
  private hasPendingMutate;
2876
+ private globalHost;
2877
+ private globalOverlay;
2878
+ private globalHUD;
2879
+ private globalSubBadge;
2817
2880
  static devtool: {
2818
2881
  id: string;
2819
2882
  label: string;
2820
2883
  icon: string;
2821
2884
  order: number;
2885
+ group: number;
2886
+ hotkey: {
2887
+ key: string;
2888
+ shiftKey: boolean;
2889
+ };
2822
2890
  styles: typeof buildGridCSS;
2891
+ connects: {
2892
+ global: boolean;
2893
+ keys: string[];
2894
+ };
2823
2895
  };
2824
2896
  constructor(context: StringContext);
2825
2897
  onInit(): void;
2898
+ protected getDevtoolSubBadges(): StringDevtoolSubBadge[];
2826
2899
  onObjectConnected(object: StringObject): void;
2827
2900
  onObjectDisconnected(object: StringObject): void;
2828
2901
  onResize(): void;
@@ -2843,9 +2916,10 @@ declare class StringDevLayout extends StringDevModule {
2843
2916
  private handleMoveToEnd;
2844
2917
  private handleSelectLayout;
2845
2918
  private handleUpdateLayoutMinWidth;
2846
- private handlePreviewResponsiveLayout;
2847
- private handleCommitResponsiveLayout;
2919
+ private handleAddLayout;
2920
+ private handleRemoveLayout;
2848
2921
  private handleRenameInstance;
2922
+ private handleRenamePanelTitle;
2849
2923
  private handleHUDOpen;
2850
2924
  private handleHUDClose;
2851
2925
  private handleLayoutPanelOpen;
@@ -2853,9 +2927,17 @@ declare class StringDevLayout extends StringDevModule {
2853
2927
  private handleExport;
2854
2928
  private handleImport;
2855
2929
  private renderElement;
2930
+ private syncToResolved;
2931
+ private syncSelectedLayoutToViewport;
2856
2932
  private refreshHUD;
2857
- private resolveActiveLayoutState;
2858
- private syncSelectedLayoutToResolved;
2933
+ private ensureGlobalGrid;
2934
+ private syncGlobalHostSize;
2935
+ private renderGlobal;
2936
+ private refreshGlobalHUD;
2937
+ private toggleGlobalPanel;
2938
+ private syncGlobalSubBadgeState;
2939
+ private positionGlobalHudAtAnchor;
2940
+ private destroyGlobalGrid;
2859
2941
  private destroyElement;
2860
2942
  private ensureTriggerLayer;
2861
2943
  private applyTriggerLayerState;
@@ -2877,7 +2959,14 @@ declare class StringDevLayout extends StringDevModule {
2877
2959
  * Each devtool module returns an array of these to describe its settings panel.
2878
2960
  */
2879
2961
  type StringDevUIFieldDescriptor = StringDevUIFieldNumber | StringDevUIFieldRange | StringDevUIFieldColor | StringDevUIFieldSelect | StringDevUIFieldToggle | StringDevUIFieldDivider;
2880
- interface StringDevUIFieldNumber {
2962
+ interface StringDevUIFieldDisabledWhen {
2963
+ readonly key: string;
2964
+ readonly equals: string | number | boolean;
2965
+ }
2966
+ interface StringDevUIFieldBase {
2967
+ readonly disabledWhen?: StringDevUIFieldDisabledWhen;
2968
+ }
2969
+ interface StringDevUIFieldNumber extends StringDevUIFieldBase {
2881
2970
  readonly type: "number";
2882
2971
  readonly key: string;
2883
2972
  readonly label: string;
@@ -2886,7 +2975,7 @@ interface StringDevUIFieldNumber {
2886
2975
  readonly max?: number;
2887
2976
  readonly step?: number;
2888
2977
  }
2889
- interface StringDevUIFieldRange {
2978
+ interface StringDevUIFieldRange extends StringDevUIFieldBase {
2890
2979
  readonly type: "range";
2891
2980
  readonly key: string;
2892
2981
  readonly label: string;
@@ -2894,6 +2983,12 @@ interface StringDevUIFieldRange {
2894
2983
  readonly min: number;
2895
2984
  readonly max: number;
2896
2985
  readonly step?: number;
2986
+ /** Multiplies the stored value for display/editing in the UI. */
2987
+ readonly displayMultiplier?: number;
2988
+ /** Optional UI step in display-space (e.g. 10 for 0..100 opacity UX). */
2989
+ readonly displayStep?: number;
2990
+ /** Optional display-only suffix rendered next to the numeric value. */
2991
+ readonly suffix?: string;
2897
2992
  /** When provided, a compact unit dropdown is shown next to the value input. */
2898
2993
  readonly units?: ReadonlyArray<{
2899
2994
  value: string;
@@ -2902,13 +2997,13 @@ interface StringDevUIFieldRange {
2902
2997
  /** Default unit value (used when no persisted unit exists). */
2903
2998
  readonly defaultUnit?: string;
2904
2999
  }
2905
- interface StringDevUIFieldColor {
3000
+ interface StringDevUIFieldColor extends StringDevUIFieldBase {
2906
3001
  readonly type: "color";
2907
3002
  readonly key: string;
2908
3003
  readonly label: string;
2909
3004
  readonly default: string;
2910
3005
  }
2911
- interface StringDevUIFieldSelect {
3006
+ interface StringDevUIFieldSelect extends StringDevUIFieldBase {
2912
3007
  readonly type: "select";
2913
3008
  readonly key: string;
2914
3009
  readonly label: string;
@@ -2918,7 +3013,7 @@ interface StringDevUIFieldSelect {
2918
3013
  label: string;
2919
3014
  }>;
2920
3015
  }
2921
- interface StringDevUIFieldToggle {
3016
+ interface StringDevUIFieldToggle extends StringDevUIFieldBase {
2922
3017
  readonly type: "toggle";
2923
3018
  readonly key: string;
2924
3019
  readonly label: string;
@@ -2998,8 +3093,94 @@ declare abstract class GridAdapter {
2998
3093
  protected createPath(d: string, stroke: string, opacity: number, strokeWidth?: number, fill?: string): SVGPathElement;
2999
3094
  }
3000
3095
 
3096
+ /**
3097
+ * StringDevRulers — developer utility module for guide-line rulers.
3098
+ *
3099
+ * Usage:
3100
+ * st.use(StringDevRulers)
3101
+ * st.use(StringDevRulers, { triggers: [...], grid: { type: "columns", count: 12, ... } })
3102
+ *
3103
+ * Default trigger: Shift + R
3104
+ *
3105
+ * Settings:
3106
+ * triggers — array of trigger descriptors (keyboard / element / event)
3107
+ * rulers-snap — grid step in px (0 = off)
3108
+ * rulers-snap-elements — snap to [string] element edges (default: true)
3109
+ * rulers-snap-threshold — snap pull radius in px (default: 8)
3110
+ * rulers-snap-selector — CSS selector for snap targets
3111
+ * grid — RulersLayoutGrid | RulersLayoutGrid[]
3112
+ *
3113
+ * Snap visual feedback:
3114
+ * amber → snapping to a DOM element edge / center
3115
+ * green → snapping to a layout-grid line
3116
+ */
3117
+ declare class StringDevRulers extends StringDevModule {
3118
+ private manager;
3119
+ private overlay;
3120
+ private visible;
3121
+ private dockDisabled;
3122
+ private currentModeId;
3123
+ private readonly modeStore;
3124
+ private readonly viewportLayer;
3125
+ private _kbHandlers;
3126
+ private _elHandlers;
3127
+ private _evHandlers;
3128
+ static devtool: {
3129
+ id: string;
3130
+ label: string;
3131
+ icon: string;
3132
+ order: number;
3133
+ group: number;
3134
+ hotkey: {
3135
+ key: string;
3136
+ shiftKey: boolean;
3137
+ };
3138
+ styles: string;
3139
+ connects: {
3140
+ global: boolean;
3141
+ keys: string[];
3142
+ };
3143
+ };
3144
+ constructor(context: StringContext);
3145
+ onInit(): void;
3146
+ onSettingsChange(): void;
3147
+ onSubscribe(): void;
3148
+ onUnsubscribe(): void;
3149
+ onFrame(data: StringData): void;
3150
+ onResize(): void;
3151
+ destroy(): void;
3152
+ toggle(): void;
3153
+ show(): void;
3154
+ hide(): void;
3155
+ clear(): void;
3156
+ isVisible(): boolean;
3157
+ protected getDevtoolActiveState(): boolean;
3158
+ protected setDevtoolActiveState(active: boolean): void;
3159
+ protected getDevtoolSubBadges(): StringDevtoolSubBadge[];
3160
+ private _bindTriggers;
3161
+ private _unbindTriggers;
3162
+ private _applyAction;
3163
+ private setVisible;
3164
+ private setDockActive;
3165
+ private mountOverlay;
3166
+ private cycleMode;
3167
+ private switchMode;
3168
+ private applyStyleSettings;
3169
+ private clearStyleSettings;
3170
+ /** Normalises the `grid` setting to RulersLayoutGrid[] (or undefined). */
3171
+ private _resolveGrids;
3172
+ private syncOverlayMetrics;
3173
+ private pushScrollToOverlay;
3174
+ }
3175
+
3001
3176
  type StringDevtoolsOverlayId = string;
3177
+ interface AnchorPoint {
3178
+ docX: number;
3179
+ docY: number;
3180
+ }
3002
3181
 
3182
+ type OverlayAxis = "y" | "x";
3183
+ type OverlayAnchor = "start" | "end";
3003
3184
  interface OverlayBaseMetrics {
3004
3185
  visible: boolean;
3005
3186
  contentX: number;
@@ -3010,6 +3191,17 @@ interface OverlayBaseMetrics {
3010
3191
  baseAnchorX: number;
3011
3192
  baseAnchorY: number;
3012
3193
  collisionOffset: number;
3194
+ axis: OverlayAxis;
3195
+ primarySize: number;
3196
+ crossSize: number;
3197
+ primaryContentOffset: number;
3198
+ viewportPrimarySize: number;
3199
+ }
3200
+ interface OverlayObjectGeometry {
3201
+ contentX: number;
3202
+ contentY: number;
3203
+ width: number;
3204
+ height: number;
3013
3205
  }
3014
3206
  interface StringDevOverlayBadgeInit {
3015
3207
  targetId: string;
@@ -3023,20 +3215,29 @@ interface StringDevOverlayBadgeState {
3023
3215
  disabled?: boolean;
3024
3216
  title?: string;
3025
3217
  html?: string;
3218
+ label?: string;
3026
3219
  attributes?: Record<string, string | boolean | number | null | undefined>;
3027
3220
  }
3028
3221
  declare abstract class StringDevOverlayModule<TEntry = unknown, TMeasurement = unknown> extends StringDevModule {
3029
3222
  private _viewportLayer?;
3223
+ private _badgeLayer?;
3224
+ private _hudLayer?;
3030
3225
  protected get viewportLayer(): StringDevViewportLayer;
3226
+ protected get badgeLayer(): StringDevViewportLayer;
3227
+ protected get hudLayer(): StringDevViewportLayer;
3031
3228
  protected readonly entries: Map<string, TEntry>;
3032
3229
  protected readonly measurements: Map<string, TMeasurement>;
3033
3230
  protected enabled: boolean;
3034
3231
  protected needsMeasure: boolean;
3035
3232
  protected hasPendingMutate: boolean;
3233
+ private _rafId;
3234
+ private _pendingSingleIds;
3036
3235
  private readonly onOverlayLayoutChangeBind;
3037
3236
  private get _overlayConfig();
3038
3237
  /** Override to provide the overlay ID for the anchor/collision system. */
3039
3238
  protected get overlayId(): StringDevtoolsOverlayId | null;
3239
+ /** Override to declare how many badge slots this overlay occupies. */
3240
+ protected get overlayBadgeCount(): number;
3040
3241
  /** Override to define your viewport layer name. Falls back to devtool.overlay.layerName. */
3041
3242
  protected get layerName(): string;
3042
3243
  /** Override to define your viewport layer z-index. Falls back to devtool.overlay.zIndex. */
@@ -3068,11 +3269,29 @@ declare abstract class StringDevOverlayModule<TEntry = unknown, TMeasurement = u
3068
3269
  onMutate(): void;
3069
3270
  onResize(): void;
3070
3271
  onDOMRebuild(): void;
3272
+ /**
3273
+ * Immediate synchronous full sync — use only when instant visual response
3274
+ * is required (e.g. setEnabled). For everything else prefer scheduleSync().
3275
+ */
3071
3276
  protected scheduleFullSync(): void;
3277
+ /**
3278
+ * Deferred full sync — batches multiple calls within the same animation
3279
+ * frame into a single measure+flush pass. Use for resize, layout changes,
3280
+ * object connected, and any other non-immediate triggers.
3281
+ */
3282
+ protected scheduleSync(): void;
3283
+ /**
3284
+ * Deferred single-entry sync — measures and flushes only the given entry.
3285
+ * Multiple calls for different entries within the same frame are batched
3286
+ * together into one styleTxn flush. Use for per-object events like
3287
+ * object:inview or slider input where only one entry changes.
3288
+ */
3289
+ protected scheduleSingleSync(entry: TEntry): void;
3072
3290
  protected collectMeasurements(): void;
3073
3291
  protected flushMeasurements(): void;
3074
3292
  protected ensureLayer(): HTMLDivElement;
3075
3293
  protected applyEnabledState(): void;
3294
+ private syncSlotRegistration;
3076
3295
  protected resolveOverlayTargetId(object: StringObject): string;
3077
3296
  protected resolveOverlayObjectDepth(element: HTMLElement): number;
3078
3297
  protected createOverlayBadge(init: StringDevOverlayBadgeInit): HTMLButtonElement;
@@ -3081,19 +3300,66 @@ declare abstract class StringDevOverlayModule<TEntry = unknown, TMeasurement = u
3081
3300
  visible: boolean;
3082
3301
  docX: number;
3083
3302
  docY: number;
3303
+ translate?: string;
3084
3304
  } | undefined): void;
3305
+ protected getOverlayTargetLabel(object: StringObject): string;
3306
+ protected getViewportAnchorOffset(anchor: OverlayAnchor, metrics: OverlayBaseMetrics): number;
3307
+ protected getOverlayAnchorAdjustment(_object: StringObject, _anchor: AnchorPoint, _metrics?: {
3308
+ contentX: number;
3309
+ contentY: number;
3310
+ width: number;
3311
+ height: number;
3312
+ }): AnchorPoint;
3313
+ protected resolveRulerPanelOffset(contentX: number, contentY: number): {
3314
+ x: number;
3315
+ y: number;
3316
+ };
3085
3317
  protected computeBaseMetrics(entry: any): OverlayBaseMetrics;
3086
- private getHiddenMetrics;
3318
+ protected getHiddenMetrics(): OverlayBaseMetrics;
3087
3319
  protected getObjectDocY(object: StringObject): number;
3320
+ protected resolveOverlayObjectGeometry(object: StringObject, element?: HTMLElement): OverlayObjectGeometry;
3088
3321
  protected getViewportScrollLeft(): number;
3089
3322
  protected getViewportScrollTop(): number;
3323
+ protected resolveLiveElementMetrics(element: HTMLElement, rect: DOMRect): {
3324
+ docLeft?: number;
3325
+ docTop?: number;
3326
+ width: number;
3327
+ height: number;
3328
+ };
3090
3329
  destroy(): void;
3091
3330
  }
3092
3331
 
3093
- interface StringDevBadgeMeasurement {
3332
+ type StringDevBadgeSlot = "top-left" | "top-right" | "bottom-right" | "bottom-left";
3333
+ interface StringDevBadgeSlotConfig {
3334
+ gap?: number;
3335
+ offsetX?: number;
3336
+ offsetY?: number;
3337
+ }
3338
+ interface StringDevBadgeDescriptor {
3339
+ id: string;
3340
+ slot?: StringDevBadgeSlot;
3341
+ group?: string;
3342
+ selectorAttribute?: string;
3343
+ depth?: number;
3344
+ attributes?: Record<string, string | boolean | number | null | undefined>;
3345
+ gap?: number;
3346
+ offsetX?: number;
3347
+ offsetY?: number;
3348
+ }
3349
+ interface StringDevManagedBadge {
3350
+ id: string;
3351
+ descriptor: StringDevBadgeDescriptor;
3352
+ element: HTMLButtonElement;
3353
+ }
3354
+ interface StringDevBadgePositionMeasurement {
3094
3355
  visible: boolean;
3095
3356
  docX: number;
3096
3357
  docY: number;
3358
+ translate?: string;
3359
+ }
3360
+ interface StringDevBadgeMeasurement {
3361
+ visible: boolean;
3362
+ badges: Record<string, StringDevBadgePositionMeasurement>;
3097
3363
  }
3098
3364
  interface StringDevBadgeEntry<TExtra = undefined> {
3099
3365
  object: StringObject;
@@ -3102,207 +3368,139 @@ interface StringDevBadgeEntry<TExtra = undefined> {
3102
3368
  depth: number;
3103
3369
  extra: TExtra;
3104
3370
  cleanup: Array<() => void>;
3371
+ badges: Map<string, StringDevManagedBadge>;
3372
+ groups: Map<string, HTMLDivElement>;
3105
3373
  }
3106
3374
  declare abstract class StringDevBadgeOverlayModule<TExtra = undefined, TMeasurement extends StringDevBadgeMeasurement = StringDevBadgeMeasurement> extends StringDevOverlayModule<StringDevBadgeEntry<TExtra>, TMeasurement> {
3107
- /** Override to define the data-attribute on the badge element. Falls back to devtool.overlay.badgeAttribute. */
3108
3375
  protected get badgeAttribute(): string;
3109
3376
  protected createOverlayEntry(object: StringObject): StringDevBadgeEntry<TExtra>;
3110
3377
  protected destroyOverlayEntry(entry: StringDevBadgeEntry<TExtra>): void;
3111
- protected measureEntry(_entry: StringDevBadgeEntry<TExtra>, metrics: OverlayBaseMetrics): TMeasurement;
3378
+ protected measureEntry(entry: StringDevBadgeEntry<TExtra>, metrics: OverlayBaseMetrics): TMeasurement;
3112
3379
  protected applyMeasurement(entry: StringDevBadgeEntry<TExtra>, measurement: TMeasurement | undefined): void;
3113
3380
  protected onEnabledChange(_enabled: boolean): void;
3114
3381
  protected createBadgeExtra(_object: StringObject, _badge: HTMLButtonElement, _targetId: string, _depth: number): TExtra;
3115
3382
  protected destroyBadgeExtra(_entry: StringDevBadgeEntry<TExtra>): void;
3116
3383
  protected bindBadge(_entry: StringDevBadgeEntry<TExtra>): Array<() => void> | void;
3117
3384
  protected resolveBadgeDepth(object: StringObject): number;
3385
+ protected getBadgeSlotConfig(): Partial<Record<StringDevBadgeSlot, StringDevBadgeSlotConfig>>;
3386
+ protected getBadgeDescriptors(object: StringObject, targetId: string, depth: number): Array<StringDevBadgeDescriptor>;
3118
3387
  protected getInitialBadgeAttributes(_object: StringObject, _targetId: string, _depth: number): Record<string, string | boolean | number | null | undefined> | undefined;
3119
3388
  protected applyBadgeEnabledState(entry: StringDevBadgeEntry<TExtra>): void;
3120
3389
  protected renderBadge(entry: StringDevBadgeEntry<TExtra>): void;
3121
3390
  protected afterBadgeMeasurement(_entry: StringDevBadgeEntry<TExtra>, _measurement: TMeasurement | undefined): void;
3122
- protected abstract onBadgeClick(entry: StringDevBadgeEntry<TExtra>, event: MouseEvent): void;
3123
- protected abstract getBadgeState(entry: StringDevBadgeEntry<TExtra>): StringDevOverlayBadgeState;
3124
- }
3125
-
3126
- interface InviewToggleExtra {
3127
- onInviewChange: () => void;
3128
- }
3129
- declare class StringDevInviewToggle extends StringDevBadgeOverlayModule<InviewToggleExtra> {
3130
- static devtool: {
3131
- id: string;
3132
- label: string;
3133
- icon: string;
3134
- order: number;
3135
- styles: string;
3136
- overlay: {
3137
- layerName: string;
3138
- zIndex: number;
3139
- layerAttribute: string;
3140
- overlayId: string;
3141
- badgeAttribute: string;
3142
- defaultEnabled: boolean;
3143
- };
3144
- };
3145
- canConnect(_object: StringObject): boolean;
3146
- protected createBadgeExtra(object: StringObject): InviewToggleExtra;
3147
- protected bindBadge(entry: StringDevBadgeEntry<InviewToggleExtra>): Array<() => void>;
3148
- protected onBadgeClick(entry: StringDevBadgeEntry<InviewToggleExtra>, _event: MouseEvent): void;
3149
- protected getBadgeState(entry: StringDevBadgeEntry<InviewToggleExtra>): StringDevOverlayBadgeState;
3150
- }
3151
-
3152
- /**
3153
- * StringDevRulers — developer utility module for guide-line rulers.
3154
- *
3155
- * Usage:
3156
- * st.use(StringDevRulers)
3157
- * st.use(StringDevRulers, { triggers: [...], grid: { type: "columns", count: 12, ... } })
3158
- *
3159
- * Default trigger: Shift + R
3160
- *
3161
- * Settings:
3162
- * triggers — array of trigger descriptors (keyboard / element / event)
3163
- * rulers-snap — grid step in px (0 = off)
3164
- * rulers-snap-elements — snap to [string] element edges (default: true)
3165
- * rulers-snap-threshold — snap pull radius in px (default: 8)
3166
- * rulers-snap-selector — CSS selector for snap targets
3167
- * grid — RulersLayoutGrid | RulersLayoutGrid[]
3168
- *
3169
- * Snap visual feedback:
3170
- * amber → snapping to a DOM element edge / center
3171
- * green → snapping to a layout-grid line
3172
- */
3173
- declare class StringDevRulers extends StringDevModule {
3174
- private manager;
3175
- private overlay;
3176
- private visible;
3177
- private dockDisabled;
3178
- private currentModeId;
3179
- private readonly viewportLayer;
3180
- private _kbHandlers;
3181
- private _elHandlers;
3182
- private _evHandlers;
3183
- static devtool: {
3184
- id: string;
3185
- label: string;
3186
- icon: string;
3187
- order: number;
3188
- styles: string;
3189
- };
3190
- constructor(context: StringContext);
3191
- onInit(): void;
3192
- onSettingsChange(): void;
3193
- onSubscribe(): void;
3194
- onUnsubscribe(): void;
3195
- onFrame(data: StringData): void;
3196
- onResize(): void;
3197
- destroy(): void;
3198
- toggle(): void;
3199
- show(): void;
3200
- hide(): void;
3201
- isVisible(): boolean;
3202
- protected getDevtoolActiveState(): boolean;
3203
- protected setDevtoolActiveState(active: boolean): void;
3204
- private _bindTriggers;
3205
- private _unbindTriggers;
3206
- private _applyAction;
3207
- private setVisible;
3208
- private setDockActive;
3209
- private mountOverlay;
3210
- private cycleMode;
3211
- private switchMode;
3212
- private applyStyleSettings;
3213
- private clearStyleSettings;
3214
- /** Normalises the `grid` setting to RulersLayoutGrid[] (or undefined). */
3215
- private _resolveGrids;
3216
- private syncOverlayMetrics;
3217
- }
3218
-
3219
- interface OffsetOverlayEntry {
3220
- object: StringObject;
3221
- root: HTMLDivElement;
3222
- box: HTMLDivElement;
3223
- topZone: HTMLDivElement;
3224
- bottomZone: HTMLDivElement;
3225
- topMarker: HTMLDivElement;
3226
- bottomMarker: HTMLDivElement;
3227
- topMarkerValue: HTMLSpanElement;
3228
- bottomMarkerValue: HTMLSpanElement;
3229
- badge: HTMLButtonElement;
3230
- badgeDepth: number;
3231
- onBadgeClick: (event: MouseEvent) => void;
3232
- }
3233
- interface OffsetOverlayMeasurement {
3234
- visible: boolean;
3391
+ protected abstract onBadgeClick(entry: StringDevBadgeEntry<TExtra>, event: MouseEvent, badge: StringDevManagedBadge): void;
3392
+ protected abstract getBadgeState(entry: StringDevBadgeEntry<TExtra>, badge?: StringDevManagedBadge): StringDevOverlayBadgeState;
3393
+ private resolveBadgeSlotConfig;
3394
+ private resolveBadgePosition;
3395
+ }
3396
+
3397
+ interface InviewExtra {
3398
+ outline: HTMLDivElement;
3399
+ enterConnector: HTMLDivElement;
3400
+ exitConnector: HTMLDivElement;
3401
+ enterMarker: HTMLDivElement;
3402
+ exitMarker: HTMLDivElement;
3403
+ enterMarkerLabel: HTMLSpanElement;
3404
+ exitMarkerLabel: HTMLSpanElement;
3405
+ }
3406
+ interface InviewMeasurement extends StringDevBadgeMeasurement {
3235
3407
  overlayVisible: boolean;
3236
3408
  badgeVisible: boolean;
3409
+ markersVisible: boolean;
3237
3410
  inview: boolean;
3238
- boxDocX: number;
3239
- boxDocY: number;
3240
- width: number;
3241
- height: number;
3242
- borderRadius: string;
3243
- topZoneDocX: number;
3244
- topZoneDocY: number;
3245
- topZoneWidth: number;
3246
- topZoneHeight: number;
3247
- topZoneEmpty: boolean;
3248
- bottomZoneDocX: number;
3249
- bottomZoneDocY: number;
3250
- bottomZoneWidth: number;
3251
- bottomZoneHeight: number;
3252
- bottomZoneEmpty: boolean;
3253
- topMarkerDocX: number;
3254
- topMarkerDocY: number;
3255
- topMarkerValue: string;
3256
- bottomMarkerDocX: number;
3257
- bottomMarkerDocY: number;
3258
- bottomMarkerValue: string;
3259
- badgeDocX: number;
3260
- badgeDocY: number;
3261
- }
3262
- declare class StringDevOffsets extends StringDevOverlayModule<OffsetOverlayEntry, OffsetOverlayMeasurement> {
3411
+ outlineDocX: number;
3412
+ outlineDocY: number;
3413
+ outlineWidth: number;
3414
+ outlineHeight: number;
3415
+ enterConnectorDocX: number;
3416
+ enterConnectorDocY: number;
3417
+ enterConnectorWidth: number;
3418
+ enterConnectorHeight: number;
3419
+ exitConnectorDocX: number;
3420
+ exitConnectorDocY: number;
3421
+ exitConnectorWidth: number;
3422
+ exitConnectorHeight: number;
3423
+ enterMarkerDocX: number;
3424
+ enterMarkerDocY: number;
3425
+ enterMarkerFlippedY: boolean;
3426
+ exitMarkerDocX: number;
3427
+ exitMarkerDocY: number;
3428
+ exitMarkerFlippedY: boolean;
3429
+ }
3430
+ declare class StringDevInview extends StringDevBadgeOverlayModule<InviewExtra, InviewMeasurement> {
3263
3431
  static devtool: {
3264
3432
  id: string;
3265
3433
  label: string;
3266
3434
  icon: string;
3267
3435
  order: number;
3436
+ group: number;
3437
+ hotkey: {
3438
+ key: string;
3439
+ shiftKey: boolean;
3440
+ };
3268
3441
  styles: string;
3269
3442
  overlay: {
3270
3443
  layerName: string;
3271
3444
  zIndex: number;
3272
3445
  layerAttribute: string;
3273
3446
  overlayId: string;
3447
+ defaultEnabled: boolean;
3448
+ };
3449
+ connects: {
3450
+ global: boolean;
3274
3451
  };
3275
3452
  };
3453
+ protected get overlayBadgeCount(): number;
3454
+ protected getDevtoolSubBadges(): StringDevtoolSubBadge[];
3276
3455
  private entryEnabled;
3277
- canConnect(_object: StringObject): boolean;
3278
- protected createOverlayEntry(object: StringObject): OffsetOverlayEntry;
3279
- protected destroyOverlayEntry(entry: OffsetOverlayEntry): void;
3280
- protected measureEntry(entry: OffsetOverlayEntry, metrics: OverlayBaseMetrics): OffsetOverlayMeasurement;
3281
- protected applyMeasurement(entry: OffsetOverlayEntry, measurement: OffsetOverlayMeasurement | undefined): void;
3456
+ private markerSizeCache;
3457
+ private readonly disabledStore;
3458
+ private readonly markerStore;
3459
+ private disabledTargetIds;
3460
+ private markerOffsets;
3461
+ private stableCoarseViewportWidth;
3462
+ private stableCoarseViewportHeight;
3463
+ protected getBadgeDescriptors(_object: StringObject, _targetId: string, _depth: number): Array<StringDevBadgeDescriptor>;
3464
+ protected createBadgeExtra(object: StringObject, _badge: HTMLButtonElement, targetId: string, _depth: number): InviewExtra;
3465
+ protected destroyBadgeExtra(entry: StringDevBadgeEntry<InviewExtra>): void;
3466
+ protected bindBadge(entry: StringDevBadgeEntry<InviewExtra>): Array<() => void>;
3467
+ protected measureEntry(entry: StringDevBadgeEntry<InviewExtra>, metrics: OverlayBaseMetrics): InviewMeasurement;
3468
+ protected afterBadgeMeasurement(entry: StringDevBadgeEntry<InviewExtra>, measurement: InviewMeasurement | undefined): void;
3469
+ protected onBadgeClick(entry: StringDevBadgeEntry<InviewExtra>, _event: MouseEvent, badge: StringDevManagedBadge): void;
3470
+ protected getBadgeState(entry: StringDevBadgeEntry<InviewExtra>, badge?: StringDevManagedBadge): StringDevOverlayBadgeState;
3282
3471
  private hiddenMeasurement;
3472
+ private getInviewBadgeState;
3473
+ private toggleInview;
3474
+ private isInviewBadgeActive;
3283
3475
  private isEntryEnabled;
3284
3476
  private setEntryEnabled;
3285
- private getViewportAnchorOffset;
3477
+ private disableAllOffsets;
3478
+ private bindMarkerDrag;
3479
+ private getMarkerOffset;
3480
+ private setMarkerOffset;
3481
+ private syncMarkerContent;
3482
+ private getViewportMarkerLabel;
3483
+ private measureMarkerSize;
3484
+ private resolveLiveStickyGeometry;
3485
+ private clampMarkerPercentInViewport;
3486
+ private clampMarkerPercentInClientViewport;
3487
+ private syncCompactMode;
3488
+ private syncCompactModeForExtra;
3489
+ private setAttributeIfChanged;
3490
+ private getStableViewportHeight;
3286
3491
  }
3287
3492
 
3288
3493
  interface ProgressEntry {
3289
3494
  object: StringObject;
3290
- chrome: HTMLDivElement;
3495
+ hud: HTMLDivElement;
3291
3496
  badge: HTMLButtonElement;
3292
- panel: HTMLDivElement;
3293
- title: HTMLSpanElement;
3294
- slider: HTMLInputElement;
3295
- easedValue: HTMLSpanElement;
3296
- rawValue: HTMLSpanElement;
3297
- rangeValue: HTMLSpanElement;
3298
3497
  onBadgeClick: (event: MouseEvent) => void;
3299
- onSliderInput: () => void;
3300
3498
  }
3301
3499
  interface ProgressMeasurement {
3302
3500
  visible: boolean;
3303
3501
  docX: number;
3304
3502
  docY: number;
3305
- targetLabel: string;
3503
+ targetId: string;
3306
3504
  progress: number;
3307
3505
  rawProgress: number;
3308
3506
  startPosition: number;
@@ -3316,6 +3514,11 @@ declare class StringDevProgress extends StringDevOverlayModule<ProgressEntry, Pr
3316
3514
  label: string;
3317
3515
  icon: string;
3318
3516
  order: number;
3517
+ group: number;
3518
+ hotkey: {
3519
+ key: string;
3520
+ shiftKey: boolean;
3521
+ };
3319
3522
  styles: string;
3320
3523
  overlay: {
3321
3524
  layerName: string;
@@ -3323,10 +3526,24 @@ declare class StringDevProgress extends StringDevOverlayModule<ProgressEntry, Pr
3323
3526
  layerAttribute: string;
3324
3527
  overlayId: string;
3325
3528
  };
3529
+ connects: {
3530
+ keys: string[];
3531
+ };
3326
3532
  };
3327
- private openEntryId;
3328
- private readonly onDocumentPointerDownBind;
3329
- constructor(context: any);
3533
+ private openTargetLabel;
3534
+ private panelRoot;
3535
+ private panelTitle;
3536
+ private panelSlider;
3537
+ private panelValue;
3538
+ private panelEasedValue;
3539
+ private panelPlayForwardButton;
3540
+ private panelPlayBackwardButton;
3541
+ private autoplayRaf;
3542
+ private autoplayDirection;
3543
+ private autoplayProgress;
3544
+ private readonly onPanelSliderInputBind;
3545
+ private unbindOutsideClick;
3546
+ constructor(context: StringContext);
3330
3547
  onInit(): void;
3331
3548
  destroy(): void;
3332
3549
  protected createOverlayEntry(object: StringObject): ProgressEntry;
@@ -3338,25 +3555,40 @@ declare class StringDevProgress extends StringDevOverlayModule<ProgressEntry, Pr
3338
3555
  private openPanel;
3339
3556
  private closePanel;
3340
3557
  private closeAllPanels;
3341
- private onDocumentPointerDown;
3558
+ private collectEntryHuds;
3559
+ private startAutoplay;
3560
+ private stopAutoplay;
3561
+ private syncPlayButtonState;
3562
+ private getEntryRange;
3342
3563
  private resolveEntryRawProgress;
3343
3564
  private resolveEasedProgress;
3344
3565
  private setEntryProgressOverride;
3345
3566
  private clearEntryProgressOverride;
3346
3567
  private clearAllProgressOverrides;
3347
3568
  private applyObjectProgress;
3569
+ private ensurePanel;
3570
+ private onPanelSliderInput;
3571
+ private renderPanel;
3572
+ private findEntryByTargetLabel;
3573
+ }
3574
+
3575
+ interface DevtoolsIconDef {
3576
+ id: string;
3577
+ viewBox: string;
3578
+ content: string;
3348
3579
  }
3349
3580
 
3581
+ type DevtoolsIconSize = 12 | 16 | 20;
3350
3582
  declare class StringDevIconRegistry {
3351
3583
  private static instance;
3352
- private readonly icons;
3584
+ private spriteRoot;
3353
3585
  private constructor();
3354
3586
  static getInstance(): StringDevIconRegistry;
3355
- register(id: string, svg: string): void;
3356
- get(id: string): string | null;
3357
- resolve(iconOrId: string): string;
3587
+ register(icon: DevtoolsIconDef): void;
3588
+ resolve(size: DevtoolsIconSize, name: string, ...modifiers: string[]): string;
3589
+ private ensureSprite;
3358
3590
  }
3359
- declare function resolveDevtoolsIcon(iconOrId: string): string;
3591
+ declare function resolveDevtoolsIcon(size: DevtoolsIconSize, name: string, ...modifiers: string[]): string;
3360
3592
 
3361
3593
  type StringDevStyleTokens = Record<string, string>;
3362
3594
  declare function buildDevtoolsThemeBlock(selectors: string | string[], overrides?: StringDevStyleTokens): string;
@@ -3497,6 +3729,7 @@ declare class DOMBatcher {
3497
3729
  declare class StringTune {
3498
3730
  private static readonly DEVTOOLS_ACCESS_URL;
3499
3731
  private static readonly DEVTOOLS_LOG_PREFIX;
3732
+ private static readonly DEVTOOLS_ARTIFACT_SELECTORS;
3500
3733
  /** Bound handler for the scroll start event */
3501
3734
  private onScrollStartBind;
3502
3735
  /** Bound handler for the scroll stop event */
@@ -3523,6 +3756,7 @@ declare class StringTune {
3523
3756
  private observerContainerMutation;
3524
3757
  private pendingResizeRaf;
3525
3758
  private pendingResizeForce;
3759
+ private activeScrollIntent;
3526
3760
  /** Singleton instance of StringTune */
3527
3761
  private static i;
3528
3762
  /** Root scrollable element (typically <body>) */
@@ -3541,6 +3775,7 @@ declare class StringTune {
3541
3775
  private objectManager;
3542
3776
  /** Central event manager for internal pub-sub logic */
3543
3777
  private eventManager;
3778
+ private signalHub;
3544
3779
  /** Handles custom cursor logic (if enabled) */
3545
3780
  private cursorController;
3546
3781
  /** Provides default utility tools (parsers, interpolation, etc.) */
@@ -3642,6 +3877,7 @@ declare class StringTune {
3642
3877
  * @param settings Optional settings specific to this module.
3643
3878
  */
3644
3879
  use(objectClass: typeof StringModule, settings?: any): void;
3880
+ private cleanupExistingDevtoolsArtifacts;
3645
3881
  private instantiateModule;
3646
3882
  private shouldDeferDevtoolModule;
3647
3883
  private validateDevtoolsAccess;
@@ -3795,7 +4031,9 @@ declare class StringTune {
3795
4031
  }): void;
3796
4032
  private resolveScrollToValue;
3797
4033
  private resolveElementScrollPosition;
4034
+ private resolveScrollIntentPosition;
4035
+ private clearActiveScrollIntent;
3798
4036
  destroy(): void;
3799
4037
  }
3800
4038
 
3801
- export { CursorReactiveModule, DOMBatcher, GridAdapter, type RulersLayoutGrid, type RulersTriggerAction, ScrollController, type ScrollMarkRule as ScrollTriggerRule, StringAnchor, type StringContext, StringCursor, StringData, StringDelayLerpTracker, StringDevIconRegistry, StringDevInviewToggle, StringDevLayout, StringDevModule, StringDevOffsets, StringDevOverlayRegistry, StringDevProgress, StringDevRulers, type StringDevStyleTokens, type StringDevtoolDefinition, type StringDevtoolProvider, type StringDevtoolState, StringFPSTracker, StringForm, StringGlide, StringImpulse, StringLazy, StringLerp, StringLerpTracker, StringLoading, StringMagnetic, StringMasonry, StringModule, StringObject, StringParallax, StringPositionTracker, StringProgress, StringProgressPart, StringRandom, StringResponsive, type StringRulersTrigger, StringScrollContainer, StringScrollbar, StringScroller, StringSequence, StringSplit, StringSpotlight, StringTune, StringVideoAutoplay, buildDevtoolsThemeBlock, StringTune as default, ensureStringDevtoolsSharedStyles, frameDOM, resolveDevtoolsIcon, styleTxn };
4039
+ export { CursorReactiveModule, DOMBatcher, GridAdapter, type RulersLayoutGrid, type RulersTriggerAction, ScrollController, type ScrollMarkRule as ScrollTriggerRule, StringAnchor, type StringContext, StringCursor, StringData, StringDelayLerpTracker, StringDevIconRegistry, StringDevInview, StringDevLayout, StringDevModule, StringDevOverlayRegistry, StringDevProgress, StringDevRulers, type StringDevStyleTokens, type StringDevtoolDefinition, type StringDevtoolProvider, type StringDevtoolState, StringFPSTracker, StringForm, StringGlide, StringImpulse, StringLazy, StringLerp, StringLerpTracker, StringLoading, StringMagnetic, StringMarquee, StringMasonry, StringModule, StringObject, StringParallax, StringPositionTracker, StringProgress, StringProgressPart, StringRandom, StringResponsive, type StringRulersTrigger, StringScrollContainer, StringScrollbar, StringScroller, StringSequence, StringSignal, StringSplit, StringSpotlight, StringTune, StringVideoAutoplay, buildDevtoolsThemeBlock, StringTune as default, ensureStringDevtoolsSharedStyles, frameDOM, resolveDevtoolsIcon, styleTxn };