drawnui-react 0.1.0-preview.2 → 0.1.0-preview.21

package/dist/controls/SkiaShape.d.ts

@@ -20,6 +20,10 @@ export declare class SkiaShape extends SkiaLayout {
     StrokeCap: StrokeCap;
     /** Gradient painted along the stroke instead of StrokeColor (C# StrokeGradient). */
     StrokeGradient?: SkiaGradient;
+    /** Dashes in points: on, off, on, off... (C# StrokePath, each rounded to pixels). Empty = a solid line. */
+    StrokePath?: number[];
+    /** Blend mode of the stroke, an SKBlendMode name (C# StrokeBlendMode). */
+    StrokeBlendMode: string;
     /** Raised (Bevel) or pressed-in (Emboss) edges, drawn with Bevel after the background (C# BevelType). */
     BevelType: BevelType;
     private bevel?;
@@ -43,11 +47,18 @@ export declare class SkiaShape extends SkiaLayout {
     static ShadowFilter(shadow: SkiaShadow, scale: number): import("canvaskit-wasm").ImageFilter;
     constructor();
     private StrokePixels;
-    /** Rect the outline is drawn on: bounds deflated by half the stroke so the stroke stays inside. */
+    /**
+     * The outline the stroke runs on (C# CalculateShapeSizeForStroke): the bounds inset by half the stroke rounded up, at
+     * least a pixel, then on whole pixels inward, so a 1 px stroke on a plain rectangle sits on the line between two
+     * pixels as upstream draws it.
+     */
     private StrokeAwareRect;
+    /** The fill (C# MeasuredStrokeAwareClipSize): a third of the stroke inside the outline, so it does not show under the stroke's edge. */
+    private BackgroundRect;
     private UsesStroke;
     /** Builds the outline path for rect (canvas pixels). Caller deletes it. */
-    protected CreateShapePath(rect: SKRect, scale: number): Path;
+    /** `radiusReduce`: pixels taken off every corner radius (the fill inside a thick stroke, C# GetCorrectedBackgroundRadii). */
+    protected CreateShapePath(rect: SKRect, scale: number, radiusReduce?: number): Path;
     /** Children live inside the stroke (full width) + Padding. */
     private ChildrenRect;
     /** Clip for overlay effects (ripple) and children: the shape itself, inset by the stroke. */

package/dist/controls/SkiaShape.js

@@ -17,6 +17,10 @@ export class SkiaShape extends SkiaLayout {
     StrokeCap = "Round";
     /** Gradient painted along the stroke instead of StrokeColor (C# StrokeGradient). */
     StrokeGradient;
+    /** Dashes in points: on, off, on, off... (C# StrokePath, each rounded to pixels). Empty = a solid line. */
+    StrokePath;
+    /** Blend mode of the stroke, an SKBlendMode name (C# StrokeBlendMode). */
+    StrokeBlendMode = "SrcOver";
     /** Raised (Bevel) or pressed-in (Emboss) edges, drawn with Bevel after the background (C# BevelType). */
     BevelType = "None";
     bevel;
@@ -66,14 +70,28 @@ export class SkiaShape extends SkiaLayout {
             return 0;
         return this.StrokeWidth > 0 ? this.StrokeWidth * scale : -this.StrokeWidth;
     }
-    /** Rect the outline is drawn on: bounds deflated by half the stroke so the stroke stays inside. */
+    /**
+     * The outline the stroke runs on (C# CalculateShapeSizeForStroke): the bounds inset by half the stroke rounded up, at
+     * least a pixel, then on whole pixels inward, so a 1 px stroke on a plain rectangle sits on the line between two
+     * pixels as upstream draws it.
+     */
     StrokeAwareRect(r, scale) {
-        const half = this.StrokePixels(scale) / 2;
-        return new SKRect(r.Left + half, r.Top + half, r.Right - half, r.Bottom - half);
+        if (!this.UsesStroke())
+            return r;
+        const half = this.StrokePixels(scale) / 2, inset = half < 0.5 ? 1 : Math.ceil(half);
+        return new SKRect(Math.ceil(r.Left + inset), Math.ceil(r.Top + inset), Math.floor(r.Right - inset), Math.floor(r.Bottom - inset));
+    }
+    /** The fill (C# MeasuredStrokeAwareClipSize): a third of the stroke inside the outline, so it does not show under the stroke's edge. */
+    BackgroundRect(r, scale) {
+        if (!this.UsesStroke())
+            return r;
+        const o = this.StrokeAwareRect(r, scale), k = this.StrokePixels(scale) / 3;
+        return new SKRect(o.Left + k, o.Top + k, o.Right - k, o.Bottom - k);
     }
     UsesStroke() { return this.StrokeWidth !== 0 && this.StrokeColor !== Colors.Transparent; }
     /** Builds the outline path for rect (canvas pixels). Caller deletes it. */
-    CreateShapePath(rect, scale) {
+    /** `radiusReduce`: pixels taken off every corner radius (the fill inside a thick stroke, C# GetCorrectedBackgroundRadii). */
+    CreateShapePath(rect, scale, radiusReduce = 0) {
         const CK = Super.CK;
         const b = new CK.PathBuilder();
         const type = this.Type;
@@ -114,7 +132,8 @@ export class SkiaShape extends SkiaLayout {
         else {
             const c = this.cornerRadius;
             if (c.TopLeft || c.TopRight || c.BottomLeft || c.BottomRight) {
-                const tl = c.TopLeft * scale, tr = c.TopRight * scale, br = c.BottomRight * scale, bl = c.BottomLeft * scale;
+                const k = (v) => Math.max(0, v * scale - radiusReduce);
+                const tl = k(c.TopLeft), tr = k(c.TopRight), br = k(c.BottomRight), bl = k(c.BottomLeft);
                 b.addRRect(Float32Array.of(rect.Left, rect.Top, rect.Right, rect.Bottom, tl, tl, tr, tr, br, br, bl, bl));
             }
             else {
@@ -151,8 +170,11 @@ export class SkiaShape extends SkiaLayout {
             return; // open shapes: stroke only
         const CK = Super.CK;
         const canvas = ctx.Context.Canvas;
-        const rect = this.StrokeAwareRect(ctx.Destination, ctx.Scale);
-        const path = this.CreateShapePath(rect, ctx.Scale);
+        const rect = this.BackgroundRect(ctx.Destination, ctx.Scale);
+        // inside a stroke wider than a point the corners of the fill are rounded less (C# GetCorrectedBackgroundRadii)
+        const outline = this.StrokeAwareRect(ctx.Destination, ctx.Scale);
+        const reduce = this.UsesStroke() && this.StrokeWidth > 1 ? Math.min((outline.Width - rect.Width) / 2, (outline.Height - rect.Height) / 2) : 0;
+        const path = this.CreateShapePath(rect, ctx.Scale, reduce);
         // C# PaintWithShadowsInternal: the fill is drawn once per shadow with a drop-shadow filter; a hollow shape
         // (ClipBackgroundColor) clips its own outline away so only the shadow outside remains
         for (const shadow of this.shadows) {
@@ -295,18 +317,36 @@ export class SkiaShape extends SkiaLayout {
             clip.delete();
         }
         if (this.UsesStroke()) {
-            const rect = this.StrokeAwareRect(ctx.Destination, ctx.Scale);
-            const path = this.CreateShapePath(rect, ctx.Scale);
+            const scale = ctx.Scale, px = this.StrokePixels(scale), type = this.Type;
+            let rect = this.StrokeAwareRect(ctx.Destination, scale);
+            const c = this.cornerRadius;
+            const rounded = type === "Rectangle" && !!(c.TopLeft || c.TopRight || c.BottomLeft || c.BottomRight);
+            // C# PaintStroke: on curves a stroke of a point or less is thinned (its antialiasing makes it look heavier than
+            // the straight parts), a thin rounded rectangle runs through pixel centers, a line is at least a pixel wide
+            const curved = rounded || type === "Circle" || type === "Ellipse" || type === "Arc" || type === "Path";
+            const width = type === "Line" ? Math.max(1, px) : curved && px <= scale ? px * 0.55 : px;
+            if (rounded && px <= 2 * scale) {
+                const even = (v) => { const r = Math.round(v); return Math.abs(v % 1) === 0.5 && r % 2 !== 0 ? r - 1 : r; }; // C# Math.Round: ties to even
+                rect = new SKRect(even(rect.Left) + 0.5, even(rect.Top) + 0.5, even(rect.Right) - 0.5, even(rect.Bottom) - 0.5);
+            }
+            const path = this.CreateShapePath(rect, scale);
             const paint = new CK.Paint();
             paint.setAntiAlias(true);
             paint.setStyle(CK.PaintStyle.Stroke);
-            paint.setStrokeWidth(Math.max(1, this.StrokePixels(ctx.Scale)));
+            paint.setStrokeWidth(width);
             paint.setColor(Super.ParseColor(this.StrokeColor));
             if (this.StrokeGradient)
                 this.SetupGradient(paint, this.StrokeGradient, rect);
+            const blend = CK.BlendMode[this.StrokeBlendMode];
+            if (blend && this.StrokeBlendMode !== "SrcOver")
+                paint.setBlendMode(blend);
             paint.setStrokeCap(this.StrokeCap === "Butt" ? CK.StrokeCap.Butt : this.StrokeCap === "Square" ? CK.StrokeCap.Square : CK.StrokeCap.Round);
             paint.setStrokeJoin(this.StrokeCap === "Round" ? CK.StrokeJoin.Round : CK.StrokeJoin.Miter);
+            const dash = this.StrokePath?.length ? CK.PathEffect.MakeDash(this.StrokePath.map((v) => Math.round(v * scale)), 0) : null;
+            if (dash)
+                paint.setPathEffect(dash);
             canvas.drawPath(path, paint);
+            dash?.delete();
             paint.delete();
             path.delete();
         }

package/dist/controls/SkiaSlider.d.ts

@@ -8,6 +8,8 @@ import { type Color, ScaledSize, Thickness } from "../core/Types";
  * Track, selected trail and thumbs are painted directly; the C# thumb-position math (SliderHeight = thumb box) is kept.
  */
 export declare class SkiaSlider extends SkiaControl {
+    /** Takes mouse hover unless ReceivesHover is set false (C# ReceivesHoverByDefault). */
+    protected ReceivesHoverByDefault(): boolean;
     static DefaultAccessibilityRole?: string;
     ControlStyle: PrebuiltControlStyle;
     Min: number;
@@ -17,7 +19,11 @@ export declare class SkiaSlider extends SkiaControl {
     /** Minimum distance between the two thumbs, in value units. */
     RangeMin: number;
     ClickOnTrailEnabled: boolean;
-    RespondsToGestures: boolean;
+    private respondsToGestures;
+    /** False: neither a drag nor the arrow keys move it (code still can), and it is reported disabled (drawnui-cross 6w). */
+    get RespondsToGestures(): boolean;
+    set RespondsToGestures(v: boolean);
+    protected AcceptsInput(): boolean;
     IsPressed: boolean;
     IsUserPanning: boolean;
     /** Extra points around a thumb that still count as grabbing it (C# moreHotspotSize). */
@@ -70,5 +76,17 @@ export declare class SkiaSlider extends SkiaControl {
     protected Paint(ctx: DrawingContext): void;
     ProcessGestures(args: SkiaGesturesParameters, apply: GestureEventProcessingInfo): SkiaControl | null;
     protected DefaultAccessibilityCanInteract(): boolean;
-    protected DefaultAccessibilityLabel(): string | undefined;
+    /** Enter / Space do nothing: the base taps the center, which would jump the value to the middle. */
+    OnAccessibilityActivated(): void;
+    /**
+     * Keyboard adjustment while the slider holds keyboard focus (C# SkiaSlider.OnAccessibilityKey): Right / Up increase and
+     * Left / Down decrease by Step (a hundredth of the range when Step is 0), PageUp / PageDown move a tenth of the range,
+     * Home / End go to Min / Max. A ranged slider moves its End thumb, which stops at Start.
+     */
+    OnAccessibilityKey(key: string): boolean;
+    /**
+     * End between Min and Max, read as the number, or "20 – 80" in range mode; the step is the arrow key's. The name is
+     * the app's AccessibilityLabel only (C# used to make the value the name, drawnui-cross 6c).
+     */
+    get AccessibilityValue(): import("../core/Accessibility").AccessibilityValue;
 }

package/dist/controls/SkiaSlider.js

@@ -9,6 +9,8 @@ import { SkiaShape } from "./SkiaShape";
  * Track, selected trail and thumbs are painted directly; the C# thumb-position math (SliderHeight = thumb box) is kept.
  */
 export class SkiaSlider extends SkiaControl {
+    /** Takes mouse hover unless ReceivesHover is set false (C# ReceivesHoverByDefault). */
+    ReceivesHoverByDefault() { return true; }
     static DefaultAccessibilityRole = "slider";
     ControlStyle = "Unset";
     Min = 0;
@@ -18,7 +20,14 @@ export class SkiaSlider extends SkiaControl {
     /** Minimum distance between the two thumbs, in value units. */
     RangeMin = 0;
     ClickOnTrailEnabled = true;
-    RespondsToGestures = true;
+    respondsToGestures = true;
+    /** False: neither a drag nor the arrow keys move it (code still can), and it is reported disabled (drawnui-cross 6w). */
+    get RespondsToGestures() { return this.respondsToGestures; }
+    set RespondsToGestures(v) { if (this.respondsToGestures !== v) {
+        this.respondsToGestures = v;
+        this.NotifyAccessibility();
+    } }
+    AcceptsInput() { return this.respondsToGestures; }
     IsPressed = false;
     IsUserPanning = false;
     /** Extra points around a thumb that still count as grabbing it (C# moreHotspotSize). */
@@ -60,11 +69,11 @@ export class SkiaSlider extends SkiaControl {
     get SliderHeight() { return this.sliderHeight ?? this.Look().thumb + (this.EnableRange && this.UsingControlStyle !== "Unset" ? 8 : 0); }
     set SliderHeight(v) { this.sliderHeight = v; this.Update(); }
     get ThumbColor() { return this.thumbColor ?? this.Look().thumbColor; }
-    set ThumbColor(v) { this.thumbColor = v; this.Update(); }
+    set ThumbColor(v) { this.thumbColor = v; this.UpdateDraw(); }
     get TrackColor() { return this.trackColor ?? this.Look().track; }
-    set TrackColor(v) { this.trackColor = v; this.Update(); }
+    set TrackColor(v) { this.trackColor = v; this.UpdateDraw(); }
     get TrackSelectedColor() { return this.trackSelectedColor ?? this.Look().selected; }
-    set TrackSelectedColor(v) { this.trackSelectedColor = v; this.Update(); }
+    set TrackSelectedColor(v) { this.trackSelectedColor = v; this.UpdateDraw(); }
     /** C# style builders: thumb diameter, track height, palette, thumb shadow. */
     Look() {
         switch (this.UsingControlStyle) {
@@ -239,5 +248,50 @@ export class SkiaSlider extends SkiaControl {
         return super.ProcessGestures(args, apply);
     }
     DefaultAccessibilityCanInteract() { return this.RespondsToGestures; }
-    DefaultAccessibilityLabel() { return this.EnableRange ? `${this.start} – ${this.end}` : `${this.end}`; }
+    /** Enter / Space do nothing: the base taps the center, which would jump the value to the middle. */
+    OnAccessibilityActivated() { }
+    /**
+     * Keyboard adjustment while the slider holds keyboard focus (C# SkiaSlider.OnAccessibilityKey): Right / Up increase and
+     * Left / Down decrease by Step (a hundredth of the range when Step is 0), PageUp / PageDown move a tenth of the range,
+     * Home / End go to Min / Max. A ranged slider moves its End thumb, which stops at Start.
+     */
+    OnAccessibilityKey(key) {
+        if (!this.RespondsToGestures)
+            return false;
+        const range = this.Max - this.Min, small = this.Step > 0 ? this.Step : range / 100, large = Math.max(small, range / 10);
+        const low = this.EnableRange ? this.Start : this.Min;
+        let value;
+        switch (key) {
+            case "ArrowRight":
+            case "ArrowUp":
+                value = this.End + small;
+                break;
+            case "ArrowLeft":
+            case "ArrowDown":
+                value = this.End - small;
+                break;
+            case "PageUp":
+                value = this.End + large;
+                break;
+            case "PageDown":
+                value = this.End - large;
+                break;
+            case "Home":
+                value = low;
+                break;
+            case "End":
+                value = this.Max;
+                break;
+            default: return false;
+        }
+        this.End = Math.min(this.Max, Math.max(low, value));
+        return true;
+    }
+    /**
+     * End between Min and Max, read as the number, or "20 – 80" in range mode; the step is the arrow key's. The name is
+     * the app's AccessibilityLabel only (C# used to make the value the name, drawnui-cross 6c).
+     */
+    get AccessibilityValue() {
+        return { Now: this.end, Min: this.Min, Max: this.Max, Step: this.Step > 0 ? this.Step : (this.Max - this.Min) / 100, Text: this.EnableRange ? `${this.start} – ${this.end}` : "" };
+    }
 }

package/dist/controls/SkiaSprite.d.ts

@@ -86,6 +86,7 @@ export declare class SkiaSprite extends AnimatedFramesRenderer {
     /** Transparent borders of a frame, scanned once (C# ScanFrameContentBounds over the bitmap alpha). */
     private GetFrameContentBounds;
     protected OnAnimatorUpdated(value: number): void;
+    protected NextChangeMs(value: number): number | undefined;
     protected OnAnimatorSeeking(time: number): void;
     protected OnAnimatorInitializing(): void;
     protected ApplySpeed(): void;

package/dist/controls/SkiaSprite.js

@@ -227,6 +227,10 @@ export class SkiaSprite extends AnimatedFramesRenderer {
     }
     // ---- animator ----
     OnAnimatorUpdated(value) { this.Seek(value); }
+    NextChangeMs(value) {
+        const fd = this.FrameDurationMs;
+        return fd > 0 ? (Math.floor(value / fd) + 1) * fd : undefined;
+    }
     OnAnimatorSeeking(time) {
         if (!this.SpriteSheet)
             return;

package/dist/controls/SkiaSvg.js

@@ -42,7 +42,7 @@ export class SkiaSvg extends SkiaControl {
         }
         const generation = ++this.loadGeneration;
         this.IsLoading = true;
-        fetch(value)
+        fetch(Super.ResolveAssetUrl(value))
             .then((r) => { if (!r.ok)
             throw new Error(`DrawnUi: ${r.status} loading svg '${value}'`); return r.text(); })
             .then((text) => { if (generation === this.loadGeneration)

package/dist/controls/SkiaSwitch.d.ts

@@ -14,7 +14,6 @@ export declare class SkiaSwitch extends SkiaToggle {
     private static readonly DefaultTrack;
     private static readonly MaterialOutline;
     protected StyleDefault(name: "ColorThumbOn" | "ColorFrameOn" | "ColorThumbOff" | "ColorFrameOff"): Color | undefined;
-    private SetContentSize;
     protected CreateDefaultContent(): void;
     /** C# GetThumbPosForOn: track width minus thumb width and margins, in points. */
     private ThumbPosForOn;

package/dist/controls/SkiaSwitch.js

@@ -25,12 +25,6 @@ export class SkiaSwitch extends SkiaToggle {
         };
         return table[s]?.[name];
     }
-    SetContentSize(w, h) {
-        if (this.WidthRequest < 0)
-            this.WidthRequest = w;
-        if (this.HeightRequest < 0)
-            this.HeightRequest = h;
-    }
     CreateDefaultContent() {
         const frame = new SkiaShape();
         frame.Tag = "Frame";

package/dist/controls/SkiaToggle.d.ts

@@ -5,16 +5,25 @@ import { type Color, type ScaledSize } from "../core/Types";
 import { SkiaLayout } from "./SkiaLayout";
 /**
  * Mirrors DrawnUi SkiaToggle: base of SkiaSwitch / SkiaCheckbox / SkiaRadioButton. Tapped flips IsToggled,
- * `Toggled` reports user changes, `ControlStyle` selects the look the default content is built with (once, at first
- * measure, like C# CreateDefaultContent). Colors left unset take the style defaults (C# SetStyleDefault).
+ * `Toggled` reports user changes, `ControlStyle` selects the look the default content is built with (at first
+ * measure, like C# CreateDefaultContent; a later change rebuilds it, C# RebuildDefaultContent). Colors left unset
+ * take the style defaults (C# SetStyleDefault).
  */
 export declare abstract class SkiaToggle extends SkiaLayout {
-    ControlStyle: PrebuiltControlStyle;
+    /** Takes mouse hover unless ReceivesHover is set false (C# ReceivesHoverByDefault): switch, checkbox, radio button. */
+    protected ReceivesHoverByDefault(): boolean;
+    private controlStyle;
+    get ControlStyle(): PrebuiltControlStyle;
+    set ControlStyle(v: PrebuiltControlStyle);
     /** Fires on every IsToggled change; C# fires only on user/external changes, not on DefaultValue application. */
     Toggled?: (sender: SkiaToggle, value: boolean) => void;
     DefaultValue: boolean;
     IsAnimated: boolean;
-    RespondsToGestures: boolean;
+    private respondsToGestures;
+    /** False: a tap or the keyboard does not toggle it (code still can), a tap on it stops there, and it is reported disabled (drawnui-cross 6w). */
+    get RespondsToGestures(): boolean;
+    set RespondsToGestures(v: boolean);
+    protected AcceptsInput(): boolean;
     private isToggled;
     private colorThumbOn?;
     private colorFrameOn?;
@@ -37,10 +46,21 @@ export declare abstract class SkiaToggle extends SkiaLayout {
     /** Per-style color defaults (C# SetStyleDefault); undefined = the SkiaToggle default. */
     protected StyleDefault(_name: "ColorThumbOn" | "ColorFrameOn" | "ColorThumbOff" | "ColorFrameOff"): Color | undefined;
     protected OnToggledChanged(): void;
-    /** Builds the look once (C# CreateDefaultContent) — subclasses add their views here. */
+    /** Builds the look (C# CreateDefaultContent) — subclasses add their views here; called again after a rebuild. */
     protected abstract CreateDefaultContent(): void;
     /** Pushes IsToggled + colors into the views (C# ApplyProperties). */
     abstract ApplyProperties(): void;
+    /** Size requests the style pinned (C# SetDefaultContentSize / SetDefaultMinimumContentSize); a rebuild releases only these. */
+    private stylePinned;
+    /** C# SetDefaultContentSize: the style's size, only where the app left the request unset. */
+    protected SetContentSize(w: number, h: number): void;
+    /** C# SetDefaultMinimumContentSize (height only): the style's minimum, only where the app left it unset. */
+    protected SetMinimumContentHeight(h: number): void;
+    /**
+     * C# RebuildDefaultContent: drops the content built for the previous style and the sizes it pinned (the app's own
+     * requests stay), so the next Measure builds the current style. No-op before the first build.
+     */
+    RebuildDefaultContent(): void;
     /** Content (and the size requests the style sets) must exist before Measure reads WidthRequest/HeightRequest. */
     Measure(widthConstraint: number, heightConstraint: number, scale: number): ScaledSize;
     protected DefaultAccessibilityCanInteract(): boolean;

package/dist/controls/SkiaToggle.js

@@ -3,16 +3,33 @@ import { Colors } from "../core/Types";
 import { SkiaLayout } from "./SkiaLayout";
 /**
  * Mirrors DrawnUi SkiaToggle: base of SkiaSwitch / SkiaCheckbox / SkiaRadioButton. Tapped flips IsToggled,
- * `Toggled` reports user changes, `ControlStyle` selects the look the default content is built with (once, at first
- * measure, like C# CreateDefaultContent). Colors left unset take the style defaults (C# SetStyleDefault).
+ * `Toggled` reports user changes, `ControlStyle` selects the look the default content is built with (at first
+ * measure, like C# CreateDefaultContent; a later change rebuilds it, C# RebuildDefaultContent). Colors left unset
+ * take the style defaults (C# SetStyleDefault).
  */
 export class SkiaToggle extends SkiaLayout {
-    ControlStyle = "Unset";
+    /** Takes mouse hover unless ReceivesHover is set false (C# ReceivesHoverByDefault): switch, checkbox, radio button. */
+    ReceivesHoverByDefault() { return true; }
+    controlStyle = "Unset";
+    get ControlStyle() { return this.controlStyle; }
+    set ControlStyle(v) {
+        if (this.controlStyle === v)
+            return;
+        this.controlStyle = v;
+        this.RebuildDefaultContent();
+    }
     /** Fires on every IsToggled change; C# fires only on user/external changes, not on DefaultValue application. */
     Toggled;
     DefaultValue = false;
     IsAnimated = true;
-    RespondsToGestures = true;
+    respondsToGestures = true;
+    /** False: a tap or the keyboard does not toggle it (code still can), a tap on it stops there, and it is reported disabled (drawnui-cross 6w). */
+    get RespondsToGestures() { return this.respondsToGestures; }
+    set RespondsToGestures(v) { if (this.respondsToGestures !== v) {
+        this.respondsToGestures = v;
+        this.NotifyAccessibility();
+    } }
+    AcceptsInput() { return this.respondsToGestures; }
     isToggled = false;
     colorThumbOn;
     colorFrameOn;
@@ -48,6 +65,40 @@ export class SkiaToggle extends SkiaLayout {
         this.Toggled?.(this, this.isToggled);
         this.NotifyAccessibility();
     }
+    /** Size requests the style pinned (C# SetDefaultContentSize / SetDefaultMinimumContentSize); a rebuild releases only these. */
+    stylePinned = [];
+    /** C# SetDefaultContentSize: the style's size, only where the app left the request unset. */
+    SetContentSize(w, h) {
+        if (this.WidthRequest < 0) {
+            this.WidthRequest = w;
+            this.stylePinned.push("WidthRequest");
+        }
+        if (this.HeightRequest < 0) {
+            this.HeightRequest = h;
+            this.stylePinned.push("HeightRequest");
+        }
+    }
+    /** C# SetDefaultMinimumContentSize (height only): the style's minimum, only where the app left it unset. */
+    SetMinimumContentHeight(h) {
+        if (this.MinimumHeightRequest < 0) {
+            this.MinimumHeightRequest = h;
+            this.stylePinned.push("MinimumHeightRequest");
+        }
+    }
+    /**
+     * C# RebuildDefaultContent: drops the content built for the previous style and the sizes it pinned (the app's own
+     * requests stay), so the next Measure builds the current style. No-op before the first build.
+     */
+    RebuildDefaultContent() {
+        if (!this.contentCreated)
+            return;
+        this.ClearChildren();
+        for (const p of this.stylePinned)
+            this[p] = -1;
+        this.stylePinned = [];
+        this.contentCreated = false;
+        this.Update();
+    }
     /** Content (and the size requests the style sets) must exist before Measure reads WidthRequest/HeightRequest. */
     Measure(widthConstraint, heightConstraint, scale) {
         if (!this.contentCreated) {
@@ -62,7 +113,9 @@ export class SkiaToggle extends SkiaLayout {
     get AccessibilityIsPressed() { return this.isToggled; }
     set AccessibilityIsPressed(_v) { }
     ProcessGestures(args, apply) {
-        if (args.Type === "Tapped" && this.RespondsToGestures) {
+        if (!this.respondsToGestures)
+            return this.BlockedGestureResult(args); // a tap does not toggle it, nor reach controls under it
+        if (args.Type === "Tapped") {
             this.IsToggled = !this.IsToggled;
             return this;
         }

package/dist/controls/SnappingLayout.d.ts

@@ -11,7 +11,11 @@ import { SkiaLayout } from "./SkiaLayout";
  */
 export declare abstract class SnappingLayout extends SkiaLayout {
     Animated: boolean;
-    RespondsToGestures: boolean;
+    private respondsToGestures;
+    /** False: neither a swipe nor the keyboard moves it (code still can), and it is reported disabled; its content keeps its own taps (drawnui-cross 6w). */
+    get RespondsToGestures(): boolean;
+    set RespondsToGestures(v: boolean);
+    protected AcceptsInput(): boolean;
     IgnoreWrongDirection: boolean;
     Bounces: boolean;
     RubberDamping: number;
@@ -50,6 +54,8 @@ export declare abstract class SnappingLayout extends SkiaLayout {
     protected StopSnapAnimators(): void;
     /** C# SnappingLayout.Render: the transition state follows the position every frame. */
     Render(ctx: DrawingContext): void;
+    /** Hover waits while the content slides (C# InTransition) or follows a pan. */
+    MovesContent(): boolean;
     ClampOffset(x: number, y: number, rubber: boolean): SKPoint;
     /** C# GetContentOffsetBounds: the extent covered by the snap points. */
     protected BoundsFromSnapPoints(): SKRect;
@@ -59,6 +65,11 @@ export declare abstract class SnappingLayout extends SkiaLayout {
     protected FindNearestAnchorInternal(current: SKPoint, _velocity: SKPoint): SKPoint;
     /** The closest anchor lying in the direction of the velocity (dot product), else the origin. */
     SelectNextAnchor(origin: SKPoint, velocity: SKPoint): SKPoint;
+    /**
+     * Release speed, points per second along an axis, under which the snap ignores the velocity and goes to the nearest
+     * anchor by distance (C# SnapVelocityThreshold, drawnui-cross 6o): a finger held still before lifting is not a flick.
+     */
+    SnapVelocityThreshold: number;
     ScrollToNearestAnchor(location: SKPoint, velocity: SKPoint): void;
     get CanAnimate(): boolean;
     protected GetAutoVelocity(displacement: SKPoint): SKPoint;

package/dist/controls/SnappingLayout.js

@@ -11,7 +11,14 @@ import { SkiaLayout } from "./SkiaLayout";
  */
 export class SnappingLayout extends SkiaLayout {
     Animated = true;
-    RespondsToGestures = true;
+    respondsToGestures = true;
+    /** False: neither a swipe nor the keyboard moves it (code still can), and it is reported disabled; its content keeps its own taps (drawnui-cross 6w). */
+    get RespondsToGestures() { return this.respondsToGestures; }
+    set RespondsToGestures(v) { if (this.respondsToGestures !== v) {
+        this.respondsToGestures = v;
+        this.NotifyAccessibility();
+    } }
+    AcceptsInput() { return this.respondsToGestures; }
     IgnoreWrongDirection = false;
     Bounces = false;
     RubberDamping = 0.7;
@@ -80,9 +87,12 @@ export class SnappingLayout extends SkiaLayout {
     }
     /** C# SnappingLayout.Render: the transition state follows the position every frame. */
     Render(ctx) {
+        this.Superview?.Hover?.RegisterMover(this);
         super.Render(ctx);
         this.InTransition = !this.CheckTransitionEnded();
     }
+    /** Hover waits while the content slides (C# InTransition) or follows a pan. */
+    MovesContent() { return this.InTransition || this.IsUserPanning; }
     // ---- clamping ----
     ClampOffset(x, y, rubber) {
         const b = this.ContentOffsetBounds;
@@ -135,9 +145,17 @@ export class SnappingLayout extends SkiaLayout {
         }
         return origin;
     }
+    /**
+     * Release speed, points per second along an axis, under which the snap ignores the velocity and goes to the nearest
+     * anchor by distance (C# SnapVelocityThreshold, drawnui-cross 6o): a finger held still before lifting is not a flick.
+     */
+    SnapVelocityThreshold = 100;
     ScrollToNearestAnchor(location, velocity) {
         if (this.SnapPoints.length === 0)
             return;
+        if (Math.abs(velocity.X) < this.SnapVelocityThreshold || Math.abs(velocity.Y) < this.SnapVelocityThreshold) {
+            velocity = new SKPoint(Math.abs(velocity.X) < this.SnapVelocityThreshold ? 0 : velocity.X, Math.abs(velocity.Y) < this.SnapVelocityThreshold ? 0 : velocity.Y);
+        }
         const origin = this.FindNearestAnchorInternal(location, velocity);
         const target = this.SelectNextAnchor(origin, velocity);
         if (SnappingLayout.Dist(location, target) >= 0.5)