From c3326e5dd009149e1e732df2dec56940f3369318 Mon Sep 17 00:00:00 2001
From: "Q. Omair Ahmed" <me@omairahmed.me>
Date: Sun, 21 Dec 2025 18:55:30 -0500
Subject: [PATCH 01/26] feat(slider): add linear-gradient support for track
 background

Enable using CSS linear-gradient for the Slider component's track.
This allows setting gradient backgrounds via the background-image
CSS property or programmatically.

On Android:
- Creates LinearGradient shader applied to ShapeDrawable
- Sets gradient on both progress and background layers of SeekBar

On iOS:
- Creates CAGradientLayer and renders to UIImage
- Sets resizable track images for min/max track states

Closes #5940
---
 apps/automated/src/ui/slider/slider-tests.ts |  63 ++++++++++++
 packages/core/ui/slider/index.android.ts     |  79 +++++++++++++-
 packages/core/ui/slider/index.ios.ts         | 103 ++++++++++++++++++-
 3 files changed, 243 insertions(+), 2 deletions(-)

diff --git a/apps/automated/src/ui/slider/slider-tests.ts b/apps/automated/src/ui/slider/slider-tests.ts
index 0fded42417..df8254add2 100644
--- a/apps/automated/src/ui/slider/slider-tests.ts
+++ b/apps/automated/src/ui/slider/slider-tests.ts
@@ -6,6 +6,8 @@ import { BindingOptions, View, Page, Observable, EventData, PropertyChangeData,
 import { Slider } from '@nativescript/core/ui/slider';
 // << article-require-slider
 
+import { LinearGradient } from '@nativescript/core/ui/styling/linear-gradient';
+
 // ### Binding the Progress and Slider value properties to a observable view-model property.
 
 // >> article-binding-slider-properties
@@ -121,6 +123,67 @@ export function test_set_backgroundColor() {
 	}
 }
 
+export function test_set_linear_gradient_background() {
+	const slider = new Slider();
+
+	// Create a linear gradient programmatically
+	const gradient = new LinearGradient();
+	gradient.angle = Math.PI / 2; // 90 degrees (left to right)
+	gradient.colorStops = [{ color: new Color('red') }, { color: new Color('green') }, { color: new Color('blue') }];
+
+	function testAction(views: Array<View>) {
+		// Set the gradient via the style's backgroundImage
+		slider.style.backgroundImage = gradient;
+
+		// Verify the slider was created and the gradient was applied
+		TKUnit.assertNotNull(slider, 'slider should not be null');
+
+		if (__APPLE__) {
+			// On iOS, verify that track images were set
+			const minTrackImage = slider.ios.minimumTrackImageForState(UIControlState.Normal);
+			const maxTrackImage = slider.ios.maximumTrackImageForState(UIControlState.Normal);
+			TKUnit.assertNotNull(minTrackImage, 'minimumTrackImage should be set after applying gradient');
+			TKUnit.assertNotNull(maxTrackImage, 'maximumTrackImage should be set after applying gradient');
+		} else if (__ANDROID__) {
+			// On Android, verify the progress drawable was modified
+			const progressDrawable = slider.android.getProgressDrawable();
+			TKUnit.assertNotNull(progressDrawable, 'progressDrawable should not be null');
+		}
+	}
+
+	helper.buildUIAndRunTest(slider, testAction);
+}
+
+export function test_set_linear_gradient_with_stops() {
+	const slider = new Slider();
+
+	// Create a linear gradient with explicit color stops
+	const gradient = new LinearGradient();
+	gradient.angle = 0; // 0 degrees (bottom to top)
+	gradient.colorStops = [
+		{ color: new Color('orangered'), offset: { unit: '%', value: 0 } },
+		{ color: new Color('green'), offset: { unit: '%', value: 0.5 } },
+		{ color: new Color('lightblue'), offset: { unit: '%', value: 1 } },
+	];
+
+	function testAction(views: Array<View>) {
+		slider.style.backgroundImage = gradient;
+
+		// Verify the slider was created
+		TKUnit.assertNotNull(slider, 'slider should not be null');
+
+		if (__APPLE__) {
+			const minTrackImage = slider.ios.minimumTrackImageForState(UIControlState.Normal);
+			TKUnit.assertNotNull(minTrackImage, 'minimumTrackImage should be set after applying gradient with stops');
+		} else if (__ANDROID__) {
+			const progressDrawable = slider.android.getProgressDrawable();
+			TKUnit.assertNotNull(progressDrawable, 'progressDrawable should not be null');
+		}
+	}
+
+	helper.buildUIAndRunTest(slider, testAction);
+}
+
 export function test_default_TNS_values() {
 	const slider = new Slider();
 	TKUnit.assertEqual(slider.value, 0, 'Default slider.value');
diff --git a/packages/core/ui/slider/index.android.ts b/packages/core/ui/slider/index.android.ts
index f76b283f78..0f3c9977ff 100644
--- a/packages/core/ui/slider/index.android.ts
+++ b/packages/core/ui/slider/index.android.ts
@@ -3,6 +3,7 @@ import { SliderBase, valueProperty, minValueProperty, maxValueProperty } from '.
 import { colorProperty, backgroundColorProperty, backgroundInternalProperty } from '../styling/style-properties';
 import { Color } from '../../color';
 import { AndroidHelper } from '../core/view';
+import { LinearGradient } from '../styling/linear-gradient';
 
 export * from './slider-common';
 
@@ -142,6 +143,82 @@ export class Slider extends SliderBase {
 		return null;
 	}
 	[backgroundInternalProperty.setNative](value: Background) {
-		//
+		if (value && value.image instanceof LinearGradient) {
+			this._applyGradientToTrack(value.image);
+		}
+	}
+
+	private _applyGradientToTrack(gradient: LinearGradient): void {
+		const nativeView = this.nativeViewProtected;
+		if (!nativeView) {
+			return;
+		}
+
+		// Create colors array from gradient stops
+		const colors = Array.create('int', gradient.colorStops.length);
+		const positions = Array.create('float', gradient.colorStops.length);
+		let hasPositions = false;
+
+		gradient.colorStops.forEach((stop, index) => {
+			colors[index] = stop.color.android;
+			if (stop.offset) {
+				positions[index] = stop.offset.value;
+				hasPositions = true;
+			} else {
+				// Default evenly distributed positions
+				positions[index] = index / (gradient.colorStops.length - 1);
+			}
+		});
+
+		// Calculate gradient direction based on angle
+		const alpha = gradient.angle / (Math.PI * 2);
+		const startX = Math.pow(Math.sin(Math.PI * (alpha + 0.75)), 2);
+		const startY = Math.pow(Math.sin(Math.PI * (alpha + 0.5)), 2);
+		const endX = Math.pow(Math.sin(Math.PI * (alpha + 0.25)), 2);
+		const endY = Math.pow(Math.sin(Math.PI * alpha), 2);
+
+		// Create the shape drawable with gradient
+		const shape = new android.graphics.drawable.shapes.RectShape();
+		const shapeDrawable = new android.graphics.drawable.ShapeDrawable(shape);
+
+		// We need to set the bounds and shader in a custom callback since the drawable
+		// doesn't have intrinsic dimensions
+		const width = nativeView.getWidth() || 1000; // Default width if not yet measured
+		const height = nativeView.getHeight() || 50; // Default height for progress drawable
+
+		const linearGradient = new android.graphics.LinearGradient(startX * width, startY * height, endX * width, endY * height, colors, hasPositions ? positions : null, android.graphics.Shader.TileMode.CLAMP);
+
+		shapeDrawable.getPaint().setShader(linearGradient);
+		shapeDrawable.setBounds(0, 0, width, height);
+
+		// Create a layer drawable that wraps the gradient for progress
+		const progressDrawable = nativeView.getProgressDrawable();
+
+		if (progressDrawable instanceof android.graphics.drawable.LayerDrawable) {
+			// The SeekBar progress drawable is typically a LayerDrawable with 3 layers:
+			// 0 - background track
+			// 1 - secondary progress (buffer)
+			// 2 - progress (filled portion)
+			const layerDrawable = progressDrawable as android.graphics.drawable.LayerDrawable;
+
+			// Create a clip drawable for the progress layer so it clips based on progress
+			const clipDrawable = new android.graphics.drawable.ClipDrawable(shapeDrawable, android.view.Gravity.LEFT, android.graphics.drawable.ClipDrawable.HORIZONTAL);
+
+			// Set the gradient drawable as the progress layer
+			layerDrawable.setDrawableByLayerId(android.R.id.progress, clipDrawable);
+
+			// Also set it as the background track for full gradient visibility
+			const backgroundShape = new android.graphics.drawable.ShapeDrawable(new android.graphics.drawable.shapes.RectShape());
+			const bgGradient = new android.graphics.LinearGradient(startX * width, startY * height, endX * width, endY * height, colors, hasPositions ? positions : null, android.graphics.Shader.TileMode.CLAMP);
+			backgroundShape.getPaint().setShader(bgGradient);
+			backgroundShape.getPaint().setAlpha(77); // ~30% opacity for background
+			backgroundShape.setBounds(0, 0, width, height);
+			layerDrawable.setDrawableByLayerId(android.R.id.background, backgroundShape);
+
+			nativeView.setProgressDrawable(layerDrawable);
+		} else {
+			// Fallback: just set the shape drawable directly
+			nativeView.setProgressDrawable(shapeDrawable);
+		}
 	}
 }
diff --git a/packages/core/ui/slider/index.ios.ts b/packages/core/ui/slider/index.ios.ts
index 95ccd106ed..8ea3a727a2 100644
--- a/packages/core/ui/slider/index.ios.ts
+++ b/packages/core/ui/slider/index.ios.ts
@@ -4,6 +4,8 @@ import { SliderBase, valueProperty, minValueProperty, maxValueProperty } from '.
 import { colorProperty, backgroundColorProperty, backgroundInternalProperty } from '../styling/style-properties';
 import { Color } from '../../color';
 import { AccessibilityDecrementEventData, AccessibilityIncrementEventData } from '.';
+import { LinearGradient } from '../styling/linear-gradient';
+import { Screen } from '../../platform';
 
 export * from './slider-common';
 
@@ -131,7 +133,106 @@ export class Slider extends SliderBase {
 		return null;
 	}
 	[backgroundInternalProperty.setNative](value: Background) {
-		//
+		if (value && value.image instanceof LinearGradient) {
+			this._applyGradientToTrack(value.image);
+		}
+	}
+
+	private _applyGradientToTrack(gradient: LinearGradient): void {
+		const nativeView = this.nativeViewProtected;
+		if (!nativeView) {
+			return;
+		}
+
+		// Create a gradient layer
+		const gradientLayer = CAGradientLayer.new();
+
+		// Set up colors from the gradient stops
+		const iosColors = NSMutableArray.alloc().initWithCapacity(gradient.colorStops.length);
+		const iosStops = NSMutableArray.alloc<number>().initWithCapacity(gradient.colorStops.length);
+		let hasStops = false;
+
+		gradient.colorStops.forEach((stop, index) => {
+			iosColors.addObject(stop.color.ios.CGColor);
+			if (stop.offset) {
+				iosStops.addObject(stop.offset.value);
+				hasStops = true;
+			} else {
+				// Default evenly distributed positions
+				iosStops.addObject(index / (gradient.colorStops.length - 1));
+			}
+		});
+
+		gradientLayer.colors = iosColors;
+		if (hasStops) {
+			gradientLayer.locations = iosStops;
+		}
+
+		// Calculate gradient direction based on angle
+		const alpha = gradient.angle / (Math.PI * 2);
+		const startX = Math.pow(Math.sin(Math.PI * (alpha + 0.75)), 2);
+		const startY = Math.pow(Math.sin(Math.PI * (alpha + 0.5)), 2);
+		const endX = Math.pow(Math.sin(Math.PI * (alpha + 0.25)), 2);
+		const endY = Math.pow(Math.sin(Math.PI * alpha), 2);
+
+		gradientLayer.startPoint = { x: startX, y: startY };
+		gradientLayer.endPoint = { x: endX, y: endY };
+
+		// Create track image from gradient
+		// Use a reasonable default size for the track
+		const trackWidth = 200;
+		const trackHeight = 4;
+
+		gradientLayer.frame = CGRectMake(0, 0, trackWidth, trackHeight);
+		gradientLayer.cornerRadius = trackHeight / 2;
+
+		// Render gradient to image
+		UIGraphicsBeginImageContextWithOptions(CGSizeMake(trackWidth, trackHeight), false, Screen.mainScreen.scale);
+		const context = UIGraphicsGetCurrentContext();
+		if (context) {
+			gradientLayer.renderInContext(context);
+			const gradientImage = UIGraphicsGetImageFromCurrentImageContext();
+			UIGraphicsEndImageContext();
+
+			if (gradientImage) {
+				// Create stretchable image for the track
+				const capInsets = new UIEdgeInsets({
+					top: 0,
+					left: trackHeight / 2,
+					bottom: 0,
+					right: trackHeight / 2,
+				});
+				const stretchableImage = gradientImage.resizableImageWithCapInsetsResizingMode(capInsets, UIImageResizingMode.Stretch);
+
+				// Set the gradient image for minimum track (filled portion)
+				nativeView.setMinimumTrackImageForState(stretchableImage, UIControlState.Normal);
+
+				// For maximum track, create a semi-transparent version
+				UIGraphicsBeginImageContextWithOptions(CGSizeMake(trackWidth, trackHeight), false, Screen.mainScreen.scale);
+				const maxContext = UIGraphicsGetCurrentContext();
+				if (maxContext) {
+					CGContextSetAlpha(maxContext, 0.3);
+					gradientLayer.renderInContext(maxContext);
+					const maxTrackImage = UIGraphicsGetImageFromCurrentImageContext();
+					UIGraphicsEndImageContext();
+
+					if (maxTrackImage) {
+						const maxCapInsets = new UIEdgeInsets({
+							top: 0,
+							left: trackHeight / 2,
+							bottom: 0,
+							right: trackHeight / 2,
+						});
+						const maxStretchableImage = maxTrackImage.resizableImageWithCapInsetsResizingMode(maxCapInsets, UIImageResizingMode.Stretch);
+						nativeView.setMaximumTrackImageForState(maxStretchableImage, UIControlState.Normal);
+					}
+				} else {
+					UIGraphicsEndImageContext();
+				}
+			}
+		} else {
+			UIGraphicsEndImageContext();
+		}
 	}
 
 	private getAccessibilityStep(): number {

From 561cd5097cccdc1ce39cdca3ca9686af3d22e1a0 Mon Sep 17 00:00:00 2001
From: "Q. Omair Ahmed" <me@omairahmed.me>
Date: Mon, 22 Dec 2025 19:52:52 -0500
Subject: [PATCH 02/26] docs(toolbox): add sliders demo page for
 linear-gradient feature

Add sample page to toolbox demonstrating gradient slider backgrounds:
- Default slider for comparison
- Various gradient styles (rainbow, sunset, ocean, purple)
- Gradient with explicit color stops
- Disabled gradient slider example
---
 apps/toolbox/src/app.css           | 29 ++++++++++++++++++
 apps/toolbox/src/main-page.xml     |  1 +
 apps/toolbox/src/pages/sliders.ts  | 14 +++++++++
 apps/toolbox/src/pages/sliders.xml | 48 ++++++++++++++++++++++++++++++
 4 files changed, 92 insertions(+)
 create mode 100644 apps/toolbox/src/pages/sliders.ts
 create mode 100644 apps/toolbox/src/pages/sliders.xml

diff --git a/apps/toolbox/src/app.css b/apps/toolbox/src/app.css
index 82f893d56b..21ad68b04e 100644
--- a/apps/toolbox/src/app.css
+++ b/apps/toolbox/src/app.css
@@ -339,3 +339,32 @@ Button {
 .text-center {
     text-align: center;
 }
+
+/* Sliders Demo Page Styles */
+.sliders-demo-page Slider.gradient-slider {
+    background: linear-gradient(to right, orangered, green, lightblue);
+}
+
+.sliders-demo-page Slider.rainbow-slider {
+    background: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet);
+}
+
+.sliders-demo-page Slider.two-color-slider {
+    background: linear-gradient(to right, #ff6b6b, #4ecdc4);
+}
+
+.sliders-demo-page Slider.sunset-slider {
+    background: linear-gradient(to right, #f12711, #f5af19);
+}
+
+.sliders-demo-page Slider.ocean-slider {
+    background: linear-gradient(to right, #2193b0, #6dd5ed);
+}
+
+.sliders-demo-page Slider.purple-slider {
+    background: linear-gradient(to right, #8e2de2, #4a00e0);
+}
+
+.sliders-demo-page Slider.stops-slider {
+    background: linear-gradient(to right, red 0%, yellow 50%, green 100%);
+}
diff --git a/apps/toolbox/src/main-page.xml b/apps/toolbox/src/main-page.xml
index 3c72d0b392..43efde9f2c 100644
--- a/apps/toolbox/src/main-page.xml
+++ b/apps/toolbox/src/main-page.xml
@@ -22,6 +22,7 @@
         <Button text="multiple-scenes" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
         <Button text="root-layout" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
         <Button text="scroll-view" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
+        <Button text="sliders" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
         <Button text="status-bar" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
         <Button text="switch" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
         <Button text="tabview" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
diff --git a/apps/toolbox/src/pages/sliders.ts b/apps/toolbox/src/pages/sliders.ts
new file mode 100644
index 0000000000..2244e249f6
--- /dev/null
+++ b/apps/toolbox/src/pages/sliders.ts
@@ -0,0 +1,14 @@
+import { Observable, EventData, Page } from '@nativescript/core';
+
+let page: Page;
+
+export function navigatingTo(args: EventData) {
+	page = <Page>args.object;
+	page.bindingContext = new SlidersModel();
+}
+
+export class SlidersModel extends Observable {
+	constructor() {
+		super();
+	}
+}
diff --git a/apps/toolbox/src/pages/sliders.xml b/apps/toolbox/src/pages/sliders.xml
new file mode 100644
index 0000000000..cc0b404239
--- /dev/null
+++ b/apps/toolbox/src/pages/sliders.xml
@@ -0,0 +1,48 @@
+<Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="navigatingTo" class="page">
+    <Page.actionBar>
+        <ActionBar title="Sliders" icon="" class="action-bar">
+        </ActionBar>
+    </Page.actionBar>
+
+    <GridLayout class="sliders-demo-page">
+      <ScrollView>
+          <StackLayout ios:padding="20" visionos:padding="40">
+
+            <Label text="Default Slider" class="h3" marginTop="24" />
+            <Slider minValue="0" maxValue="100" value="50" marginTop="12" />
+
+            <Label text="Gradient Slider (CSS)" class="h3" marginTop="24" />
+            <Label text="background: linear-gradient(to right, orangered, green, lightblue)" class="caption" />
+            <Slider class="gradient-slider" minValue="0" maxValue="100" value="50" marginTop="12" />
+
+            <Label text="Rainbow Gradient" class="h3" marginTop="24" />
+            <Label text="background: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet)" class="caption" />
+            <Slider class="rainbow-slider" minValue="0" maxValue="100" value="70" marginTop="12" />
+
+            <Label text="Two-Color Gradient" class="h3" marginTop="24" />
+            <Label text="background: linear-gradient(to right, #ff6b6b, #4ecdc4)" class="caption" />
+            <Slider class="two-color-slider" minValue="0" maxValue="100" value="30" marginTop="12" />
+
+            <Label text="Sunset Gradient" class="h3" marginTop="24" />
+            <Label text="background: linear-gradient(to right, #f12711, #f5af19)" class="caption" />
+            <Slider class="sunset-slider" minValue="0" maxValue="100" value="60" marginTop="12" />
+
+            <Label text="Ocean Gradient" class="h3" marginTop="24" />
+            <Label text="background: linear-gradient(to right, #2193b0, #6dd5ed)" class="caption" />
+            <Slider class="ocean-slider" minValue="0" maxValue="100" value="40" marginTop="12" />
+
+            <Label text="Purple Gradient" class="h3" marginTop="24" />
+            <Label text="background: linear-gradient(to right, #8e2de2, #4a00e0)" class="caption" />
+            <Slider class="purple-slider" minValue="0" maxValue="100" value="80" marginTop="12" />
+
+            <Label text="Gradient with Color Stops" class="h3" marginTop="24" />
+            <Label text="background: linear-gradient(to right, red 0%, yellow 50%, green 100%)" class="caption" />
+            <Slider class="stops-slider" minValue="0" maxValue="100" value="50" marginTop="12" />
+
+            <Label text="Disabled Gradient Slider" class="h3" marginTop="24" />
+            <Slider class="gradient-slider" minValue="0" maxValue="100" value="50" isEnabled="false" marginTop="12" />
+
+          </StackLayout>
+      </ScrollView>
+    </GridLayout>
+</Page>

From 430fd8d8c89f3736dce6616a274066dc1d272d75 Mon Sep 17 00:00:00 2001
From: Nathan Walker <walkerrunpdx@gmail.com>
Date: Fri, 26 Dec 2025 15:32:59 -0800
Subject: [PATCH 03/26] chore: use preferred newer memory optimized
 UIGraphicsImageRenderer api

---
 packages/core/ui/slider/index.ios.ts | 76 +++++++++++++---------------
 1 file changed, 36 insertions(+), 40 deletions(-)

diff --git a/packages/core/ui/slider/index.ios.ts b/packages/core/ui/slider/index.ios.ts
index 8ea3a727a2..357758b4c4 100644
--- a/packages/core/ui/slider/index.ios.ts
+++ b/packages/core/ui/slider/index.ios.ts
@@ -5,7 +5,7 @@ import { colorProperty, backgroundColorProperty, backgroundInternalProperty } fr
 import { Color } from '../../color';
 import { AccessibilityDecrementEventData, AccessibilityIncrementEventData } from '.';
 import { LinearGradient } from '../styling/linear-gradient';
-import { Screen } from '../../platform';
+import { Screen } from '../../platform/screen';
 
 export * from './slider-common';
 
@@ -186,52 +186,48 @@ export class Slider extends SliderBase {
 		gradientLayer.frame = CGRectMake(0, 0, trackWidth, trackHeight);
 		gradientLayer.cornerRadius = trackHeight / 2;
 
+		// Create renderer format with proper scale
+		const format = UIGraphicsImageRendererFormat.defaultFormat();
+		format.scale = Screen.mainScreen.scale;
+		format.opaque = false;
+
+		const size = CGSizeMake(trackWidth, trackHeight);
+		const renderer = UIGraphicsImageRenderer.alloc().initWithSizeFormat(size, format);
+
 		// Render gradient to image
-		UIGraphicsBeginImageContextWithOptions(CGSizeMake(trackWidth, trackHeight), false, Screen.mainScreen.scale);
-		const context = UIGraphicsGetCurrentContext();
-		if (context) {
-			gradientLayer.renderInContext(context);
-			const gradientImage = UIGraphicsGetImageFromCurrentImageContext();
-			UIGraphicsEndImageContext();
-
-			if (gradientImage) {
-				// Create stretchable image for the track
-				const capInsets = new UIEdgeInsets({
+		const gradientImage = renderer.imageWithActions((rendererContext) => {
+			gradientLayer.renderInContext(rendererContext.CGContext);
+		});
+
+		if (gradientImage) {
+			// Create stretchable image for the track
+			const capInsets = new UIEdgeInsets({
+				top: 0,
+				left: trackHeight / 2,
+				bottom: 0,
+				right: trackHeight / 2,
+			});
+			const stretchableImage = gradientImage.resizableImageWithCapInsetsResizingMode(capInsets, UIImageResizingMode.Stretch);
+
+			// Set the gradient image for minimum track (filled portion)
+			nativeView.setMinimumTrackImageForState(stretchableImage, UIControlState.Normal);
+
+			// For maximum track, create a semi-transparent version
+			const maxTrackImage = renderer.imageWithActions((rendererContext) => {
+				CGContextSetAlpha(rendererContext.CGContext, 0.3);
+				gradientLayer.renderInContext(rendererContext.CGContext);
+			});
+
+			if (maxTrackImage) {
+				const maxCapInsets = new UIEdgeInsets({
 					top: 0,
 					left: trackHeight / 2,
 					bottom: 0,
 					right: trackHeight / 2,
 				});
-				const stretchableImage = gradientImage.resizableImageWithCapInsetsResizingMode(capInsets, UIImageResizingMode.Stretch);
-
-				// Set the gradient image for minimum track (filled portion)
-				nativeView.setMinimumTrackImageForState(stretchableImage, UIControlState.Normal);
-
-				// For maximum track, create a semi-transparent version
-				UIGraphicsBeginImageContextWithOptions(CGSizeMake(trackWidth, trackHeight), false, Screen.mainScreen.scale);
-				const maxContext = UIGraphicsGetCurrentContext();
-				if (maxContext) {
-					CGContextSetAlpha(maxContext, 0.3);
-					gradientLayer.renderInContext(maxContext);
-					const maxTrackImage = UIGraphicsGetImageFromCurrentImageContext();
-					UIGraphicsEndImageContext();
-
-					if (maxTrackImage) {
-						const maxCapInsets = new UIEdgeInsets({
-							top: 0,
-							left: trackHeight / 2,
-							bottom: 0,
-							right: trackHeight / 2,
-						});
-						const maxStretchableImage = maxTrackImage.resizableImageWithCapInsetsResizingMode(maxCapInsets, UIImageResizingMode.Stretch);
-						nativeView.setMaximumTrackImageForState(maxStretchableImage, UIControlState.Normal);
-					}
-				} else {
-					UIGraphicsEndImageContext();
-				}
+				const maxStretchableImage = maxTrackImage.resizableImageWithCapInsetsResizingMode(maxCapInsets, UIImageResizingMode.Stretch);
+				nativeView.setMaximumTrackImageForState(maxStretchableImage, UIControlState.Normal);
 			}
-		} else {
-			UIGraphicsEndImageContext();
 		}
 	}
 

From 181995e7535a4ca971ba455d90cf9528ac71705e Mon Sep 17 00:00:00 2001
From: "Q. Omair Ahmed" <me@omairahmed.me>
Date: Fri, 26 Dec 2025 19:52:13 -0500
Subject: [PATCH 04/26] fix(android): implement gradient slider using
 ShapeDrawable with LinearGradient

---
 packages/core/ui/slider/index.android.ts | 66 ++++--------------------
 1 file changed, 9 insertions(+), 57 deletions(-)

diff --git a/packages/core/ui/slider/index.android.ts b/packages/core/ui/slider/index.android.ts
index 0f3c9977ff..fac82af614 100644
--- a/packages/core/ui/slider/index.android.ts
+++ b/packages/core/ui/slider/index.android.ts
@@ -156,69 +156,21 @@ export class Slider extends SliderBase {
 
 		// Create colors array from gradient stops
 		const colors = Array.create('int', gradient.colorStops.length);
-		const positions = Array.create('float', gradient.colorStops.length);
-		let hasPositions = false;
-
 		gradient.colorStops.forEach((stop, index) => {
 			colors[index] = stop.color.android;
-			if (stop.offset) {
-				positions[index] = stop.offset.value;
-				hasPositions = true;
-			} else {
-				// Default evenly distributed positions
-				positions[index] = index / (gradient.colorStops.length - 1);
-			}
 		});
 
-		// Calculate gradient direction based on angle
-		const alpha = gradient.angle / (Math.PI * 2);
-		const startX = Math.pow(Math.sin(Math.PI * (alpha + 0.75)), 2);
-		const startY = Math.pow(Math.sin(Math.PI * (alpha + 0.5)), 2);
-		const endX = Math.pow(Math.sin(Math.PI * (alpha + 0.25)), 2);
-		const endY = Math.pow(Math.sin(Math.PI * alpha), 2);
-
-		// Create the shape drawable with gradient
-		const shape = new android.graphics.drawable.shapes.RectShape();
-		const shapeDrawable = new android.graphics.drawable.ShapeDrawable(shape);
-
-		// We need to set the bounds and shader in a custom callback since the drawable
-		// doesn't have intrinsic dimensions
-		const width = nativeView.getWidth() || 1000; // Default width if not yet measured
-		const height = nativeView.getHeight() || 50; // Default height for progress drawable
-
-		const linearGradient = new android.graphics.LinearGradient(startX * width, startY * height, endX * width, endY * height, colors, hasPositions ? positions : null, android.graphics.Shader.TileMode.CLAMP);
-
-		shapeDrawable.getPaint().setShader(linearGradient);
-		shapeDrawable.setBounds(0, 0, width, height);
+		// Get width for gradient
+		const width = nativeView.getWidth() || 1000;
 
-		// Create a layer drawable that wraps the gradient for progress
-		const progressDrawable = nativeView.getProgressDrawable();
+		// Create LinearGradient shader (left to right)
+		const shader = new android.graphics.LinearGradient(0, 0, width, 0, colors, null, android.graphics.Shader.TileMode.CLAMP);
 
-		if (progressDrawable instanceof android.graphics.drawable.LayerDrawable) {
-			// The SeekBar progress drawable is typically a LayerDrawable with 3 layers:
-			// 0 - background track
-			// 1 - secondary progress (buffer)
-			// 2 - progress (filled portion)
-			const layerDrawable = progressDrawable as android.graphics.drawable.LayerDrawable;
+		// Create ShapeDrawable with the gradient
+		const shape = new android.graphics.drawable.ShapeDrawable(new android.graphics.drawable.shapes.RectShape());
+		shape.getPaint().setShader(shader);
 
-			// Create a clip drawable for the progress layer so it clips based on progress
-			const clipDrawable = new android.graphics.drawable.ClipDrawable(shapeDrawable, android.view.Gravity.LEFT, android.graphics.drawable.ClipDrawable.HORIZONTAL);
-
-			// Set the gradient drawable as the progress layer
-			layerDrawable.setDrawableByLayerId(android.R.id.progress, clipDrawable);
-
-			// Also set it as the background track for full gradient visibility
-			const backgroundShape = new android.graphics.drawable.ShapeDrawable(new android.graphics.drawable.shapes.RectShape());
-			const bgGradient = new android.graphics.LinearGradient(startX * width, startY * height, endX * width, endY * height, colors, hasPositions ? positions : null, android.graphics.Shader.TileMode.CLAMP);
-			backgroundShape.getPaint().setShader(bgGradient);
-			backgroundShape.getPaint().setAlpha(77); // ~30% opacity for background
-			backgroundShape.setBounds(0, 0, width, height);
-			layerDrawable.setDrawableByLayerId(android.R.id.background, backgroundShape);
-
-			nativeView.setProgressDrawable(layerDrawable);
-		} else {
-			// Fallback: just set the shape drawable directly
-			nativeView.setProgressDrawable(shapeDrawable);
-		}
+		// Apply to slider
+		nativeView.setProgressDrawable(shape);
 	}
 }

From 8805f91bb8037e503921472860dc17f7f36812ed Mon Sep 17 00:00:00 2001
From: "Q. Omair Ahmed" <me@omairahmed.me>
Date: Fri, 26 Dec 2025 20:00:01 -0500
Subject: [PATCH 05/26] fix(android/slider): use ClipDrawable for proper
 gradient progress clipping

---
 package-lock.json                        | 78 +++++++++++-------------
 packages/core/ui/slider/index.android.ts | 37 +++++++++--
 2 files changed, 67 insertions(+), 48 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index b7fc273315..ab79d59288 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -242,6 +242,24 @@
 				}
 			}
 		},
+		"node_modules/@angular-devkit/architect/node_modules/chokidar": {
+			"version": "4.0.3",
+			"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-4.0.3.tgz",
+			"integrity": "sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==",
+			"dev": true,
+			"license": "MIT",
+			"optional": true,
+			"peer": true,
+			"dependencies": {
+				"readdirp": "^4.0.1"
+			},
+			"engines": {
+				"node": ">= 14.16.0"
+			},
+			"funding": {
+				"url": "https://paulmillr.com/funding/"
+			}
+		},
 		"node_modules/@angular-devkit/architect/node_modules/jsonc-parser": {
 			"version": "3.3.1",
 			"resolved": "https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.3.1.tgz",
@@ -269,6 +287,7 @@
 			"dev": true,
 			"license": "MIT",
 			"optional": true,
+			"peer": true,
 			"engines": {
 				"node": ">= 14.18.0"
 			},
@@ -377,7 +396,6 @@
 			"integrity": "sha512-Ulimvg6twPSCraaZECEmENfKBlD4M1yqeHlg6dCzFNM4xcwaGUnuG6O3cIQD59DaEvaG73ceM2y8ftYdxAwFow==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"@ampproject/remapping": "2.3.0",
 				"@angular-devkit/architect": "0.2003.9",
@@ -789,7 +807,6 @@
 			"integrity": "sha512-9BemvpFxA26yIVdu8ROffadMkEdlk/AQQ2Jb486w7RPkrvUQ0pbEJukhv9aryJvhbMopT66S5H/j4ipOUMzmzQ==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"@babel/core": "7.28.3",
 				"@jridgewell/sourcemap-codec": "^1.4.14",
@@ -1027,7 +1044,6 @@
 			"integrity": "sha512-yDBHV9kQNcr2/sUr9jghVyz9C3Y5G2zUM2H2lo+9mKv4sFgbA8s8Z9t8D1jiTkGoO/NoIfKMyKWr4s6CN23ZwQ==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"@ampproject/remapping": "^2.2.0",
 				"@babel/code-frame": "^7.27.1",
@@ -3065,7 +3081,6 @@
 				}
 			],
 			"license": "MIT",
-			"peer": true,
 			"engines": {
 				"node": ">=18"
 			},
@@ -3089,7 +3104,6 @@
 				}
 			],
 			"license": "MIT",
-			"peer": true,
 			"engines": {
 				"node": ">=18"
 			}
@@ -7301,7 +7315,6 @@
 			"integrity": "sha512-/tD7z8Q3CPPKtH/LTZGaihzJio5Ve3yFk9LWpUa8DmFHdEg1rFeI9rvSM8FeuEsGp9yGosWH6/KpZCwHv2fhVA==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"@zkochan/js-yaml": "0.0.7",
 				"ejs": "^3.1.7",
@@ -7359,7 +7372,6 @@
 			"integrity": "sha512-u88WFtfU13+yJ3yj/ccWvicone16j57bSh9a7I7sX3NVCaKXCFku9/kLpxj1CwKC6LxNlmJhhzup2fcymCWzPQ==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"@nx/devkit": "22.0.2",
 				"@nx/js": "22.0.2",
@@ -7512,7 +7524,6 @@
 			"integrity": "sha512-Q1TUY0saymli4HLF2neRUDEzrzLC6PmFtRDR6lykmN3uq7wVyG6aycLQGXd3xM0IWA/cJ5ZOWa8FfogKDWhc3g==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"@babel/core": "^7.23.2",
 				"@babel/plugin-proposal-decorators": "^7.22.7",
@@ -7879,7 +7890,6 @@
 			"integrity": "sha512-wfVE0X5auqVrQus/S3EiZkheX59aR+FAwXGFCFCYGTGakhykcya4/N+tUZCCpDSUziFXR7F8n8cw4ZLBM5zWlA==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"@nx/devkit": "22.0.2",
 				"@zkochan/js-yaml": "0.0.7",
@@ -8626,7 +8636,6 @@
 			"integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"engines": {
 				"node": ">=12"
 			},
@@ -9298,7 +9307,6 @@
 			"integrity": "sha512-jYWaI2WNEKz8KZL3sExd2KVL1JMma1/J7z+9iTpv0+fRN7LGMF8VTGGuHI2bug/ztpdZU1G44FG/Kk6ElXL9CQ==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"@swc-node/core": "^1.13.3",
 				"@swc-node/sourcemap-support": "^0.5.1",
@@ -9356,7 +9364,6 @@
 			"dev": true,
 			"hasInstallScript": true,
 			"license": "Apache-2.0",
-			"peer": true,
 			"dependencies": {
 				"@swc/counter": "^0.1.3",
 				"@swc/types": "^0.1.23"
@@ -9572,7 +9579,6 @@
 			"integrity": "sha512-5IKx/Y13RsYd+sauPb2x+U/xZikHjolzfuDgTAl/Tdf3Q8rslRvC19NKDLgAJQ6wsqADk10ntlv08nPFw/gO/A==",
 			"dev": true,
 			"license": "Apache-2.0",
-			"peer": true,
 			"dependencies": {
 				"tslib": "^2.8.0"
 			}
@@ -9583,7 +9589,6 @@
 			"integrity": "sha512-u1iIVZV9Q0jxY+yM2vw/hZGDNudsN85bBpTqzAQ9rzkxW9D+e3aEM4Han+ow518gSewkXgjmEK0BD79ZcNVgPw==",
 			"dev": true,
 			"license": "Apache-2.0",
-			"peer": true,
 			"dependencies": {
 				"@swc/counter": "^0.1.3"
 			}
@@ -9903,7 +9908,6 @@
 			"integrity": "sha512-FE5u0ezmi6y9OZEzlJfg37mqqf6ZDSF2V/NLjUyGrR9uTZ7Sb9F7bLNZ03S4XVUNRWGA7Ck4c1kK+YnuWjl+DA==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"undici-types": "~6.21.0"
 			}
@@ -10006,7 +10010,6 @@
 			"integrity": "sha512-tK3GPFWbirvNgsNKto+UmB/cRtn6TZfyw0D6IKrW55n6Vbs7KJoZtI//kpTKzE/DUmmnAFD8/Ca46s7Obs92/w==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"@typescript-eslint/scope-manager": "8.46.4",
 				"@typescript-eslint/types": "8.46.4",
@@ -11066,6 +11069,7 @@
 			"integrity": "sha512-BM8kBhtlkkbnyl4q+HiF5R5BL0ycDPfihowulm02q3WYp2vxgPcJuZO866qa/0u3idbMntKEtVNuAUp5bw4teg==",
 			"dev": true,
 			"license": "MIT",
+			"peer": true,
 			"dependencies": {
 				"@vue/shared": "3.5.24"
 			}
@@ -11076,6 +11080,7 @@
 			"integrity": "sha512-RYP/byyKDgNIqfX/gNb2PB55dJmM97jc9wyF3jK7QUInYKypK2exmZMNwnjueWwGceEkP6NChd3D2ZVEp9undQ==",
 			"dev": true,
 			"license": "MIT",
+			"peer": true,
 			"dependencies": {
 				"@vue/reactivity": "3.5.24",
 				"@vue/shared": "3.5.24"
@@ -11087,6 +11092,7 @@
 			"integrity": "sha512-Z8ANhr/i0XIluonHVjbUkjvn+CyrxbXRIxR7wn7+X7xlcb7dJsfITZbkVOeJZdP8VZwfrWRsWdShH6pngMxRjw==",
 			"dev": true,
 			"license": "MIT",
+			"peer": true,
 			"dependencies": {
 				"@vue/reactivity": "3.5.24",
 				"@vue/runtime-core": "3.5.24",
@@ -11100,6 +11106,7 @@
 			"integrity": "sha512-Yh2j2Y4G/0/4z/xJ1Bad4mxaAk++C2v4kaa8oSYTMJBJ00/ndPuxCnWeot0/7/qafQFLh5pr6xeV6SdMcE/G1w==",
 			"dev": true,
 			"license": "MIT",
+			"peer": true,
 			"dependencies": {
 				"@vue/compiler-ssr": "3.5.24",
 				"@vue/shared": "3.5.24"
@@ -11376,7 +11383,6 @@
 			"integrity": "sha512-nrUSn7hzt7J6JWgWGz78ZYI8wj+gdIJdk0Ynjpp8l+trkn58Uqsf6RYrYkEK+3X18EX+TNdtJI0WxAtc+L84SQ==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"argparse": "^2.0.1"
 			},
@@ -11421,7 +11427,6 @@
 			"integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"bin": {
 				"acorn": "bin/acorn"
 			},
@@ -11560,7 +11565,6 @@
 			"integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"fast-deep-equal": "^3.1.3",
 				"fast-uri": "^3.0.1",
@@ -12574,7 +12578,6 @@
 				}
 			],
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"caniuse-lite": "^1.0.30001669",
 				"electron-to-chromium": "^1.5.41",
@@ -12935,7 +12938,6 @@
 			"integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"anymatch": "~3.1.2",
 				"braces": "~3.0.2",
@@ -14154,7 +14156,8 @@
 			"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
 			"integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
 			"dev": true,
-			"license": "MIT"
+			"license": "MIT",
+			"peer": true
 		},
 		"node_modules/data-urls": {
 			"version": "4.0.0",
@@ -14866,7 +14869,6 @@
 			"deprecated": "This version is no longer supported. Please see https://eslint.org/version-support for other options.",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"@eslint-community/eslint-utils": "^4.2.0",
 				"@eslint-community/regexpp": "^4.6.1",
@@ -14923,7 +14925,6 @@
 			"integrity": "sha512-zc1UmCpNltmVY34vuLRV61r1K27sWuX39E+uyUnY8xS2Bex88VV9cugG+UZbRSRGtGyFboj+D8JODyme1plMpw==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"bin": {
 				"eslint-config-prettier": "bin/cli.js"
 			},
@@ -16723,6 +16724,7 @@
 			"integrity": "sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==",
 			"dev": true,
 			"license": "ISC",
+			"peer": true,
 			"engines": {
 				"node": "^10 || ^12 || >= 14"
 			},
@@ -17843,7 +17845,6 @@
 			"integrity": "sha512-y2mfcJywuTUkvLm2Lp1/pFX8kTgMO5yyQGq/Sk/n2mN7XWYp4JsCZ/QXW34M8YScgk8bPZlREH04f6blPnoHnQ==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"@jest/core": "30.0.5",
 				"@jest/types": "30.0.5",
@@ -19997,7 +19998,6 @@
 			"integrity": "sha512-rg9zJN+G4n2nfJl5MW3BMygZX56zKPNVEYYqq7adpmMh4Jn2QNEwhvQlFy6jPVdcod7txZtKHWnyZiA3a0zP7A==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"bin": {
 				"jiti": "lib/jiti-cli.mjs"
 			}
@@ -20053,7 +20053,6 @@
 			"integrity": "sha512-/9AVW7xNbsBv6GfWho4TTNjEo9fe6Zhf9O7s0Fhhr3u+awPwAJMKwAMXnkk5vBxflqLW9hTHX/0cs+P3gW+cQw==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"abab": "^2.0.6",
 				"cssstyle": "^3.0.0",
@@ -21231,7 +21230,6 @@
 			"integrity": "sha512-8dD6FusOQSrpv9Z1rdNMdlSgQOIP880DHqnohobOmYLElGEqAL/JvxvuxZO16r4HtjTlfPRDC1hbvxC9dPN2nA==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"bin": {
 				"marked": "bin/marked.js"
 			},
@@ -22641,7 +22639,6 @@
 			"dev": true,
 			"hasInstallScript": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"@napi-rs/wasm-runtime": "0.2.4",
 				"@yarnpkg/lockfile": "^1.1.0",
@@ -23938,7 +23935,6 @@
 				}
 			],
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"nanoid": "^3.3.11",
 				"picocolors": "^1.1.1",
@@ -24071,6 +24067,7 @@
 			"integrity": "sha512-k3kNe0aNFQDAZGbin48pL2VNidTF0w4/eASDsxlyspobzU3wZQLOGj7L9gfRe0Jo9/4uud09DsjFNH7winGv8Q==",
 			"dev": true,
 			"license": "ISC",
+			"peer": true,
 			"engines": {
 				"node": "^10 || ^12 || >= 14"
 			},
@@ -24084,6 +24081,7 @@
 			"integrity": "sha512-5kcJm/zk+GJDSfw+V/42fJ5fhjL5YbFDl8nVdXkJPLLW+Vf9mTD5Xe0wqIaDnLuL2U6cDNpTr+UQ+v2HWIBhzw==",
 			"dev": true,
 			"license": "MIT",
+			"peer": true,
 			"dependencies": {
 				"icss-utils": "^5.0.0",
 				"postcss-selector-parser": "^7.0.0",
@@ -24102,6 +24100,7 @@
 			"integrity": "sha512-8sLjZwK0R+JlxlYcTuVnyT2v+htpdrjDOKuMcOVdYjt52Lh8hWRYpxBPoKx/Zg+bcjc3wx6fmQevMmUztS/ccA==",
 			"dev": true,
 			"license": "MIT",
+			"peer": true,
 			"dependencies": {
 				"cssesc": "^3.0.0",
 				"util-deprecate": "^1.0.2"
@@ -24116,6 +24115,7 @@
 			"integrity": "sha512-m9jZstCVaqGjTAuny8MdgE88scJnCiQSlSrOWcTQgM2t32UBe+MUmFSO5t7VMSfAf/FJKImAxBav8ooCHJXCJA==",
 			"dev": true,
 			"license": "ISC",
+			"peer": true,
 			"dependencies": {
 				"postcss-selector-parser": "^7.0.0"
 			},
@@ -24132,6 +24132,7 @@
 			"integrity": "sha512-8sLjZwK0R+JlxlYcTuVnyT2v+htpdrjDOKuMcOVdYjt52Lh8hWRYpxBPoKx/Zg+bcjc3wx6fmQevMmUztS/ccA==",
 			"dev": true,
 			"license": "MIT",
+			"peer": true,
 			"dependencies": {
 				"cssesc": "^3.0.0",
 				"util-deprecate": "^1.0.2"
@@ -24146,6 +24147,7 @@
 			"integrity": "sha512-RDxHkAiEGI78gS2ofyvCsu7iycRv7oqw5xMWn9iMoR0N/7mf9D50ecQqUo5BZ9Zh2vH4bCUR/ktCqbB9m8vJjQ==",
 			"dev": true,
 			"license": "ISC",
+			"peer": true,
 			"dependencies": {
 				"icss-utils": "^5.0.0"
 			},
@@ -24204,7 +24206,6 @@
 			"integrity": "sha512-lc6npv5PH7hVqozBR7lkBNOGXV9vMwROAPlumdBkX0wTbbzPu/U1hk5yL8p2pt4Xoc+2mkT8t/sow2YrV/M5qg==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"bin": {
 				"prettier": "bin/prettier.cjs"
 			},
@@ -25259,7 +25260,6 @@
 			"integrity": "sha512-9GUyuksjw70uNpb1MTYWsH9MQHOHY6kwfnkafC24+7aOMZn9+rVMBxRbLvw756mrBFbIsFg6Xw9IkR2Fnn3k+Q==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"chokidar": "^4.0.0",
 				"immutable": "^5.0.2",
@@ -25398,7 +25398,6 @@
 			"integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"fast-deep-equal": "^3.1.1",
 				"fast-json-stable-stringify": "^2.0.0",
@@ -25474,6 +25473,7 @@
 			"integrity": "sha512-16OL3NnUBw8JG1jBLUoZJsLnQq0n5Ua6aHalhJK4fMQkz1lqR7Osz1sA30trBtd9VUDc2NgkuRCn8+/pBwqZ+w==",
 			"dev": true,
 			"license": "MIT",
+			"peer": true,
 			"engines": {
 				"node": ">=10"
 			},
@@ -26632,7 +26632,6 @@
 			"integrity": "sha512-LBAhFyLho16harJoWMg/nZsQYgTrg5jXOn2nCYjRUcZZEdE3qa2zb8QEDRUGVZBW4rlazf2fxkg8tztybTaqWw==",
 			"dev": true,
 			"license": "BSD-2-Clause",
-			"peer": true,
 			"dependencies": {
 				"@jridgewell/source-map": "^0.3.3",
 				"acorn": "^8.8.2",
@@ -26980,7 +26979,6 @@
 			"integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"engines": {
 				"node": ">=12"
 			},
@@ -27544,8 +27542,7 @@
 			"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
 			"integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
 			"dev": true,
-			"license": "0BSD",
-			"peer": true
+			"license": "0BSD"
 		},
 		"node_modules/tuf-js": {
 			"version": "4.0.0",
@@ -27760,7 +27757,6 @@
 			"integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
 			"dev": true,
 			"license": "Apache-2.0",
-			"peer": true,
 			"bin": {
 				"tsc": "bin/tsc",
 				"tsserver": "bin/tsserver"
@@ -28097,7 +28093,6 @@
 			"integrity": "sha512-BxAKBWmIbrDgrokdGZH1IgkIk/5mMHDreLDmCJ0qpyJaAteP8NvMhkwr/ZCQNqNH97bw/dANTE9PDzqwJghfMQ==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"esbuild": "^0.25.0",
 				"fdir": "^6.5.0",
@@ -28276,7 +28271,6 @@
 			"integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"engines": {
 				"node": ">=12"
 			},
@@ -28310,7 +28304,6 @@
 			"integrity": "sha512-LUCP5ev3GURDysTWiP47wRRUpLKMOfPh+yKTx3kVIEiu5KOMeqzpnYNsKyOoVrULivR8tLcks4+lga33Whn90A==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"@types/chai": "^5.2.2",
 				"@vitest/expect": "3.2.4",
@@ -28657,7 +28650,6 @@
 			"integrity": "sha512-CNqKBRMQjwcmKR0idID5va1qlhrqVUKpovi+Ec79ksW8ux7iS1+A6VqzfZXgVYCFRKl7XL5ap3ZoMpwBJxcg0w==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"@types/eslint-scope": "^3.7.7",
 				"@types/estree": "^1.0.6",
@@ -28803,7 +28795,6 @@
 			"integrity": "sha512-NLhDfH/h4O6UOy+0LSso42xvYypClINuMNBVVzX4vX98TmTaTUxwRbXdhucbFMd2qLaCTcLq/PdYrvi8onw90w==",
 			"dev": true,
 			"license": "MIT",
-			"peer": true,
 			"dependencies": {
 				"@discoveryjs/json-ext": "^0.5.0",
 				"@webpack-cli/configtest": "^1.2.0",
@@ -29401,7 +29392,6 @@
 			"integrity": "sha512-lcYcMxX2PO9XMGvAJkJ3OsNMw+/7FKes7/hgerGUYWIoWu5j/+YQqcZr5JnPZWzOsEBgMbSbiSTn/dv/69Mkpw==",
 			"dev": true,
 			"license": "ISC",
-			"peer": true,
 			"bin": {
 				"yaml": "bin.mjs"
 			},
diff --git a/packages/core/ui/slider/index.android.ts b/packages/core/ui/slider/index.android.ts
index fac82af614..4c67a882b7 100644
--- a/packages/core/ui/slider/index.android.ts
+++ b/packages/core/ui/slider/index.android.ts
@@ -166,11 +166,40 @@ export class Slider extends SliderBase {
 		// Create LinearGradient shader (left to right)
 		const shader = new android.graphics.LinearGradient(0, 0, width, 0, colors, null, android.graphics.Shader.TileMode.CLAMP);
 
-		// Create ShapeDrawable with the gradient
-		const shape = new android.graphics.drawable.ShapeDrawable(new android.graphics.drawable.shapes.RectShape());
-		shape.getPaint().setShader(shader);
+		// Create ShapeDrawable with the gradient for the progress layer
+		const progressShape = new android.graphics.drawable.ShapeDrawable(new android.graphics.drawable.shapes.RectShape());
+		progressShape.getPaint().setShader(shader);
+
+		// Wrap in ClipDrawable so it clips based on progress level
+		const progressClip = new android.graphics.drawable.ClipDrawable(progressShape, android.view.Gravity.LEFT, android.graphics.drawable.ClipDrawable.HORIZONTAL);
+
+		// Create a semi-transparent version for the background track
+		const bgColors = Array.create('int', gradient.colorStops.length);
+		gradient.colorStops.forEach((stop, index) => {
+			// Make background 30% opacity
+			const color = stop.color;
+			const alpha = Math.round(color.a * 0.3);
+			bgColors[index] = android.graphics.Color.argb(alpha, color.r, color.g, color.b);
+		});
+		const bgShader = new android.graphics.LinearGradient(0, 0, width, 0, bgColors, null, android.graphics.Shader.TileMode.CLAMP);
+		const bgShape = new android.graphics.drawable.ShapeDrawable(new android.graphics.drawable.shapes.RectShape());
+		bgShape.getPaint().setShader(bgShader);
+
+		// Create LayerDrawable with background and progress layers
+		const layers = Array.create(android.graphics.drawable.Drawable, 2);
+		layers[0] = bgShape;
+		layers[1] = progressClip;
+
+		const layerDrawable = new android.graphics.drawable.LayerDrawable(layers);
+		layerDrawable.setId(0, android.R.id.background);
+		layerDrawable.setId(1, android.R.id.progress);
 
 		// Apply to slider
-		nativeView.setProgressDrawable(shape);
+		nativeView.setProgressDrawable(layerDrawable);
+
+		// Force refresh progress to apply clipping
+		const currentProgress = nativeView.getProgress();
+		nativeView.setProgress(0);
+		nativeView.setProgress(currentProgress);
 	}
 }

From 0d3e24919bb329d9f4207d095f1ae506ab87220c Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Sat, 3 Jan 2026 11:13:19 -0800
Subject: [PATCH 06/26] chore(deps): bump step-security/harden-runner from
 2.13.1 to 2.14.0 (#11020)

[skip ci]
Bumps [step-security/harden-runner](https://github.com/step-security/harden-runner) from 2.13.1 to 2.14.0.
- [Release notes](https://github.com/step-security/harden-runner/releases)
- [Commits](https://github.com/step-security/harden-runner/compare/f4a75cfd619ee5ce8d5b864b0d183aff3c69b55a...20cf305ff2072d973412fa9b1e3a4f227bda3c76)

---
updated-dependencies:
- dependency-name: step-security/harden-runner
  dependency-version: 2.14.0
  dependency-type: direct:production
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
---
 .github/workflows/npm_release_tns_core.yml | 2 +-
 .github/workflows/npm_release_types.yml    | 2 +-
 .github/workflows/npm_release_webpack.yml  | 2 +-
 .github/workflows/secure_nx_release.yml    | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/.github/workflows/npm_release_tns_core.yml b/.github/workflows/npm_release_tns_core.yml
index 8c1cde0db0..fd9d2a9681 100644
--- a/.github/workflows/npm_release_tns_core.yml
+++ b/.github/workflows/npm_release_tns_core.yml
@@ -19,7 +19,7 @@ jobs:
 
     steps:
       - name: Harden the runner (Audit all outbound calls)
-        uses: step-security/harden-runner@f4a75cfd619ee5ce8d5b864b0d183aff3c69b55a # v2.13.1
+        uses: step-security/harden-runner@20cf305ff2072d973412fa9b1e3a4f227bda3c76 # v2.14.0
         with:
           egress-policy: audit
 
diff --git a/.github/workflows/npm_release_types.yml b/.github/workflows/npm_release_types.yml
index 1e3081722a..05f325d34d 100644
--- a/.github/workflows/npm_release_types.yml
+++ b/.github/workflows/npm_release_types.yml
@@ -19,7 +19,7 @@ jobs:
 
     steps:
       - name: Harden the runner (Audit all outbound calls)
-        uses: step-security/harden-runner@f4a75cfd619ee5ce8d5b864b0d183aff3c69b55a # v2.13.1
+        uses: step-security/harden-runner@20cf305ff2072d973412fa9b1e3a4f227bda3c76 # v2.14.0
         with:
           egress-policy: audit
 
diff --git a/.github/workflows/npm_release_webpack.yml b/.github/workflows/npm_release_webpack.yml
index f3b7bd9039..52fe661082 100644
--- a/.github/workflows/npm_release_webpack.yml
+++ b/.github/workflows/npm_release_webpack.yml
@@ -18,7 +18,7 @@ jobs:
 
     steps:
       - name: Harden the runner (Audit all outbound calls)
-        uses: step-security/harden-runner@f4a75cfd619ee5ce8d5b864b0d183aff3c69b55a # v2.13.1
+        uses: step-security/harden-runner@20cf305ff2072d973412fa9b1e3a4f227bda3c76 # v2.14.0
         with:
           egress-policy: audit
 
diff --git a/.github/workflows/secure_nx_release.yml b/.github/workflows/secure_nx_release.yml
index 31bac355a4..7380cd08d3 100644
--- a/.github/workflows/secure_nx_release.yml
+++ b/.github/workflows/secure_nx_release.yml
@@ -48,7 +48,7 @@ jobs:
 
     steps:
       - name: Harden the runner (Audit all outbound calls)
-        uses: step-security/harden-runner@f4a75cfd619ee5ce8d5b864b0d183aff3c69b55a # v2.13.1
+        uses: step-security/harden-runner@20cf305ff2072d973412fa9b1e3a4f227bda3c76 # v2.14.0
         with:
           egress-policy: audit
 

From fad7f1cc4bc595717fb9d536ab1482e3217a074a Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Sat, 3 Jan 2026 11:13:33 -0800
Subject: [PATCH 07/26] chore(deps): bump actions/setup-python from 5.6.0 to
 6.1.0 (#11021)

[skip ci]
Bumps [actions/setup-python](https://github.com/actions/setup-python) from 5.6.0 to 6.1.0.
- [Release notes](https://github.com/actions/setup-python/releases)
- [Commits](https://github.com/actions/setup-python/compare/a26af69be951a213d495a4c3e4e4022e16d87065...83679a892e2d95755f2dac6acb0bfd1e9ac5d548)

---
updated-dependencies:
- dependency-name: actions/setup-python
  dependency-version: 6.1.0
  dependency-type: direct:production
  update-type: version-update:semver-major
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
---
 .github/workflows/apps_automated_android.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/apps_automated_android.yml b/.github/workflows/apps_automated_android.yml
index 45764b9d47..ab59b9993a 100644
--- a/.github/workflows/apps_automated_android.yml
+++ b/.github/workflows/apps_automated_android.yml
@@ -41,7 +41,7 @@ jobs:
           java-version: '21'
 
       - name: Install Python
-        uses: actions/setup-python@a26af69be951a213d495a4c3e4e4022e16d87065 # v5.6.0
+        uses: actions/setup-python@83679a892e2d95755f2dac6acb0bfd1e9ac5d548 # v6.1.0
         with:
           python-version: '3'
 

From 2a327992d28930fcb8017395b815d768e09399b0 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Sat, 3 Jan 2026 11:13:45 -0800
Subject: [PATCH 08/26] chore(deps): bump actions/upload-artifact from 5.0.0 to
 6.0.0 (#11022)

[skip ci]
Bumps [actions/upload-artifact](https://github.com/actions/upload-artifact) from 5.0.0 to 6.0.0.
- [Release notes](https://github.com/actions/upload-artifact/releases)
- [Commits](https://github.com/actions/upload-artifact/compare/330a01c490aca151604b8cf639adc76d48f6c5d4...b7c566a772e6b6bfb58ed0dc250532a479d7789f)

---
updated-dependencies:
- dependency-name: actions/upload-artifact
  dependency-version: 6.0.0
  dependency-type: direct:production
  update-type: version-update:semver-major
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
---
 .github/workflows/ossf-scorecard.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/ossf-scorecard.yml b/.github/workflows/ossf-scorecard.yml
index 9ce98b852b..7e77c133e1 100644
--- a/.github/workflows/ossf-scorecard.yml
+++ b/.github/workflows/ossf-scorecard.yml
@@ -64,7 +64,7 @@ jobs:
       # Upload the results as artifacts (optional). Commenting out will disable uploads of run results in SARIF
       # format to the repository Actions tab.
       - name: "Upload artifact"
-        uses: actions/upload-artifact@330a01c490aca151604b8cf639adc76d48f6c5d4 # v5.0.0
+        uses: actions/upload-artifact@b7c566a772e6b6bfb58ed0dc250532a479d7789f # v6.0.0
         with:
           name: SARIF file
           path: results.sarif

From a661efd967009cf33b3c9bc46d12809e9eae5d85 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Sat, 3 Jan 2026 11:13:57 -0800
Subject: [PATCH 09/26] chore(deps): bump github/codeql-action from 4.31.5 to
 4.31.9 (#11023)

[skip ci]
Bumps [github/codeql-action](https://github.com/github/codeql-action) from 4.31.5 to 4.31.9.
- [Release notes](https://github.com/github/codeql-action/releases)
- [Changelog](https://github.com/github/codeql-action/blob/main/CHANGELOG.md)
- [Commits](https://github.com/github/codeql-action/compare/fdbfb4d2750291e159f0156def62b853c2798ca2...5d4e8d1aca955e8d8589aabd499c5cae939e33c7)

---
updated-dependencies:
- dependency-name: github/codeql-action
  dependency-version: 4.31.9
  dependency-type: direct:production
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
---
 .github/workflows/ossf-scorecard.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/ossf-scorecard.yml b/.github/workflows/ossf-scorecard.yml
index 7e77c133e1..f61061b811 100644
--- a/.github/workflows/ossf-scorecard.yml
+++ b/.github/workflows/ossf-scorecard.yml
@@ -73,6 +73,6 @@ jobs:
       # Upload the results to GitHub's code scanning dashboard (optional).
       # Commenting out will disable upload of results to your repo's Code Scanning dashboard
       - name: "Upload to code-scanning"
-        uses: github/codeql-action/upload-sarif@fdbfb4d2750291e159f0156def62b853c2798ca2 # v4.31.5
+        uses: github/codeql-action/upload-sarif@5d4e8d1aca955e8d8589aabd499c5cae939e33c7 # v4.31.9
         with:
           sarif_file: results.sarif

From 8e2ad26d264c9019524a7d3f4323dd78ff49123f Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Sat, 3 Jan 2026 11:14:11 -0800
Subject: [PATCH 10/26] chore(deps): bump actions/setup-java from 5.0.0 to
 5.1.0 (#11024)

[skip ci]
Bumps [actions/setup-java](https://github.com/actions/setup-java) from 5.0.0 to 5.1.0.
- [Release notes](https://github.com/actions/setup-java/releases)
- [Commits](https://github.com/actions/setup-java/compare/dded0888837ed1f317902acf8a20df0ad188d165...f2beeb24e141e01a676f977032f5a29d81c9e27e)

---
updated-dependencies:
- dependency-name: actions/setup-java
  dependency-version: 5.1.0
  dependency-type: direct:production
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
---
 .github/workflows/apps_automated_android.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/apps_automated_android.yml b/.github/workflows/apps_automated_android.yml
index ab59b9993a..abbd1fd8bf 100644
--- a/.github/workflows/apps_automated_android.yml
+++ b/.github/workflows/apps_automated_android.yml
@@ -35,7 +35,7 @@ jobs:
         with:
           main-branch-name: 'main'
           
-      - uses: actions/setup-java@dded0888837ed1f317902acf8a20df0ad188d165 # v5.0.0
+      - uses: actions/setup-java@f2beeb24e141e01a676f977032f5a29d81c9e27e # v5.1.0
         with:
           distribution: 'temurin'
           java-version: '21'

From dcb1f60af6e7667d91a00a57af4d94e8eef6ca0f Mon Sep 17 00:00:00 2001
From: Nathan Walker <walkerrunpdx@gmail.com>
Date: Sun, 4 Jan 2026 11:50:39 -0800
Subject: [PATCH 11/26] feat(config): remote module security (#11040)

[skip ci]
---
 packages/core/config/config.interface.ts | 25 ++++++++++++++++++++++++
 1 file changed, 25 insertions(+)

diff --git a/packages/core/config/config.interface.ts b/packages/core/config/config.interface.ts
index 6c64ef70b8..f5c86f8856 100644
--- a/packages/core/config/config.interface.ts
+++ b/packages/core/config/config.interface.ts
@@ -215,6 +215,26 @@ interface IConfigEmbed extends IConfigEmbedProps {
 	android?: IConfigEmbedProps;
 }
 
+interface ISecurityConfig {
+	/**
+	 * Enable remote ES module loading in production.
+	 * Default: false
+	 *
+	 * When false, any attempt to import("https://...") in production
+	 * will throw an error.
+	 */
+	allowRemoteModules: boolean;
+
+	/**
+	 * Restrict remote modules to specific URL prefixes.
+	 * Only used when allowRemoteModules is true.
+	 *
+	 * If empty or not provided, all HTTPS URLs are allowed
+	 * (not recommended for production).
+	 */
+	remoteModuleAllowlist?: string[];
+}
+
 type BundlerType = 'webpack' | 'vite';
 
 export interface NativeScriptConfig {
@@ -315,4 +335,9 @@ export interface NativeScriptConfig {
 	 * Set project persistent hooks to run
 	 */
 	hooks?: IConfigHook[];
+
+	/**
+	 * Security configurations
+	 */
+	security?: ISecurityConfig;
 }

From b817693ffb7fae3963780fd362488a993d692457 Mon Sep 17 00:00:00 2001
From: Nathan Walker <walkerrunpdx@gmail.com>
Date: Sun, 4 Jan 2026 11:56:21 -0800
Subject: [PATCH 12/26] chore: core readme

---
 packages/core/README.md | 46 ++++++++++++++++++++++++++++++++++++-----
 1 file changed, 41 insertions(+), 5 deletions(-)

diff --git a/packages/core/README.md b/packages/core/README.md
index 2d58b4327f..571298d2af 100644
--- a/packages/core/README.md
+++ b/packages/core/README.md
@@ -1,11 +1,47 @@
 <p align="center">
-  <a href="http://www.nativescript.org">
-    <img alt="NativeScript" src="https://d1lfyz5kwt8vu9.cloudfront.net/nativescript-logo-2021.png" width="100"/>
+  <a href="https://nativescript.org">
+    <img alt="NativeScript" src="https://raw.githubusercontent.com/NativeScript/artwork/main/logo/export/NativeScript_Logo_Dark_Transparent.png" width="100"/>
   </a>
 </p>
 
-## @nativescript/core
+<h1 align="center">NativeScript</h1>
 
-A JavaScript library providing an easy to use api for interacting with iOS and Android platform APIs.
+<p align="center">
+  <b>Build truly native apps with JavaScript.</b>
+</p>
+
+<p align="center">
+  <a href="https://www.npmjs.com/package/@nativescript/core"><img src="https://img.shields.io/npm/v/@nativescript/core.svg" alt="npm version"></a>
+  <a href="https://github.com/NativeScript/NativeScript/blob/main/LICENSE"><img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="license"></a>
+  <a href="https://www.npmjs.com/package/@nativescript/core"><img src="https://img.shields.io/npm/dm/@nativescript/core.svg" alt="downloads"></a>
+</p>
+
+<p align="center">
+  <a href="https://docs.nativescript.org">Getting Started</a> · 
+  <a href="https://docs.nativescript.org/setup/">Environment Setup</a> · 
+  <a href="https://nativescript.org/showcase">Showcase</a> · 
+  <a href="https://github.com/NativeScript/NativeScript/blob/main/tools/notes/CONTRIBUTING.md">Contribute</a> · 
+  <a href="https://nativescript.org/discord">Community</a>
+</p>
+
+---
+
+A JavaScript library providing an easy-to-use API for interacting with native platform APIs.
+
+- **Truly Native**: Access 100% of native platform APIs with JavaScript or TypeScript
+- **High Performance**: No bridges — direct native bindings
+- **Cross-Platform**: Share code across platforms while maintaining native look and feel
+
+## 📦 Installation
+
+```bash
+npm install @nativescript/core
+```
+
+## 📖 Documentation
+
+The full documentation for NativeScript can be found on our [website](https://docs.nativescript.org/).
+
+## 📄 License
 
-[Learn more at docs.nativescript.org](https://docs.nativescript.org/)
\ No newline at end of file
+NativeScript is [MIT licensed](https://github.com/NativeScript/NativeScript/blob/main/LICENSE).
\ No newline at end of file

From a38261a19022ce80b666cd007f4a0a8f3e67cdad Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Sun, 4 Jan 2026 19:57:36 +0000
Subject: [PATCH 13/26] chore(release): publish

- project: devtools 0.0.2-next.1

- project: webpack5 5.0.31-next.1

- project: core 9.0.11-next.2

- project: vite 1.0.4-next.1
---
 packages/core/package.json     | 2 +-
 packages/devtools/package.json | 4 ++--
 packages/vite/package.json     | 2 +-
 packages/webpack5/package.json | 2 +-
 4 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/core/package.json b/packages/core/package.json
index 6abaef6753..9534866006 100644
--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/core",
-	"version": "9.0.11-next.1",
+	"version": "9.0.11-next.2",
 	"description": "A JavaScript library providing an easy to use api for interacting with iOS and Android platform APIs.",
 	"type": "module",
 	"main": "index",
diff --git a/packages/devtools/package.json b/packages/devtools/package.json
index 91f6accab3..80f5456749 100644
--- a/packages/devtools/package.json
+++ b/packages/devtools/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/devtools",
-	"version": "0.0.2-next.0",
+	"version": "0.0.2-next.1",
 	"private": true,
 	"files": [
 		"./dist/"
@@ -10,6 +10,6 @@
 		"prepack": "tsc || echo ok"
 	},
 	"devDependencies": {
-		"@nativescript/core": "9.0.11-next.1"
+		"@nativescript/core": "9.0.11-next.2"
 	}
 }
diff --git a/packages/vite/package.json b/packages/vite/package.json
index 2286682761..bd76644c3f 100644
--- a/packages/vite/package.json
+++ b/packages/vite/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/vite",
-	"version": "1.0.4-next.0",
+	"version": "1.0.4-next.1",
 	"description": "Vite for NativeScript",
 	"main": "./index.js",
 	"module": "./index.js",
diff --git a/packages/webpack5/package.json b/packages/webpack5/package.json
index 1e7e6f53a4..2c6507b128 100644
--- a/packages/webpack5/package.json
+++ b/packages/webpack5/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/webpack",
-	"version": "5.0.31-next.0",
+	"version": "5.0.31-next.1",
 	"private": false,
 	"main": "dist/index.js",
 	"files": [

From aca87f0f1c1e1160a4b43f33170f10d56e51d359 Mon Sep 17 00:00:00 2001
From: Nathan Walker <walkerrunpdx@gmail.com>
Date: Sun, 4 Jan 2026 14:10:54 -0800
Subject: [PATCH 14/26] release(core): 9.0.11

---
 packages/core/CHANGELOG.md | 19 +++++++++++++++++++
 packages/core/package.json |  2 +-
 2 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/packages/core/CHANGELOG.md b/packages/core/CHANGELOG.md
index c9fa575eda..bb28170ee1 100644
--- a/packages/core/CHANGELOG.md
+++ b/packages/core/CHANGELOG.md
@@ -1,3 +1,22 @@
+## 9.0.11 (2026-01-04)
+
+### 🚀 Features
+
+- **config:** remote module security ([#11040](https://github.com/NativeScript/NativeScript/pull/11040))
+
+### 🩹 Fixes
+
+- **ios:** SegmentedBar update selected text color when selected background color changes ([#11016](https://github.com/NativeScript/NativeScript/pull/11016))
+
+### ❤️ Thank You
+
+- Jorge Cancino Oteíza @JorgeOteiza
+- Nathan Walker
+
+## 9.0.10 (2025-12-21)
+
+- CI workflow adjustments, same changes as 9.0.9
+
 ## 9.0.9 (2025-12-21)
 
 ### 🚀 Features
diff --git a/packages/core/package.json b/packages/core/package.json
index 9534866006..3a953feb21 100644
--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/core",
-	"version": "9.0.11-next.2",
+	"version": "9.0.11",
 	"description": "A JavaScript library providing an easy to use api for interacting with iOS and Android platform APIs.",
 	"type": "module",
 	"main": "index",

From e29e44f7beccf9f7c3ba65e050de78ae327f6346 Mon Sep 17 00:00:00 2001
From: Nathan Walker <walkerrunpdx@gmail.com>
Date: Sun, 4 Jan 2026 14:23:05 -0800
Subject: [PATCH 15/26] release(core): 9.0.11

---
 .github/workflows/secure_nx_release.yml | 21 +++++++++++++++++++++
 nx.json                                 |  6 ++++++
 2 files changed, 27 insertions(+)

diff --git a/.github/workflows/secure_nx_release.yml b/.github/workflows/secure_nx_release.yml
index 7380cd08d3..8fedd6f361 100644
--- a/.github/workflows/secure_nx_release.yml
+++ b/.github/workflows/secure_nx_release.yml
@@ -233,6 +233,23 @@ jobs:
             --verbose \
             --dry-run
 
+      # BUILD: Ensure projects are built before publishing
+      - name: Build affected projects (main)
+        if: ${{ steps.ctx.outputs.mode == 'main' && steps.affected.outputs.count != '0' }}
+        run: npx nx run-many -t build --projects "${{ steps.affected.outputs.projects }}" --verbose
+
+      - name: Build projects (dispatch)
+        if: ${{ steps.ctx.outputs.mode == 'dispatch' }}
+        shell: bash
+        run: |
+          set -euo pipefail
+          scope="${{ steps.ctx.outputs.scope }}"
+          if [[ -n "$scope" ]]; then
+            npx nx run-many -t build --projects "$scope" --verbose
+          else
+            npx nx run-many -t build --all --verbose
+          fi
+
       # PUBLISH: OIDC trusted publishing (default). Avoid any lingering token auth.
       - name: nx release publish (OIDC)
         if: ${{ steps.ctx.outputs.mode != 'tag' && steps.ctx.outputs.dry_run != 'true' && vars.USE_NPM_TOKEN != 'true' && (steps.ctx.outputs.mode != 'main' || steps.affected.outputs.count != '0') }}
@@ -291,6 +308,10 @@ jobs:
           npx nx release publish --tag "${{ steps.ctx.outputs.dist_tag }}" --access public --verbose --dry-run
 
       # Tag-triggered publishing: publish the single package referenced by the tag.
+      - name: Build project before publish (tag)
+        if: ${{ steps.ctx.outputs.mode == 'tag' }}
+        run: npx nx build "${{ steps.taginfo.outputs.project }}" --verbose
+
       - name: nx release publish (tag)
         if: ${{ steps.ctx.outputs.mode == 'tag' && vars.USE_NPM_TOKEN != 'true' }}
         shell: bash
diff --git a/nx.json b/nx.json
index e34c90e8fc..89545862b9 100644
--- a/nx.json
+++ b/nx.json
@@ -110,6 +110,12 @@
 		"@nx/vite:test": {
 			"cache": true,
 			"inputs": ["default", "^production"]
+		},
+		"nx-release-publish": {
+			"dependsOn": ["build"],
+			"options": {
+				"packageRoot": "{workspaceRoot}/dist/packages/{projectName}"
+			}
 		}
 	},
 	"useDaemonProcess": false,

From 621b2ae321f149b86c3fc7686b5328f1be87af4f Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Sun, 4 Jan 2026 22:37:57 +0000
Subject: [PATCH 16/26] chore(release): publish

- project: devtools 0.0.2-next.2

- project: webpack5 5.0.31-next.2

- project: core 9.0.12-next.0

- project: vite 1.0.4-next.2
---
 packages/core/package.json     | 2 +-
 packages/devtools/package.json | 4 ++--
 packages/vite/package.json     | 2 +-
 packages/webpack5/package.json | 2 +-
 4 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/core/package.json b/packages/core/package.json
index 3a953feb21..0501ba6d81 100644
--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/core",
-	"version": "9.0.11",
+	"version": "9.0.12-next.0",
 	"description": "A JavaScript library providing an easy to use api for interacting with iOS and Android platform APIs.",
 	"type": "module",
 	"main": "index",
diff --git a/packages/devtools/package.json b/packages/devtools/package.json
index 80f5456749..c475070360 100644
--- a/packages/devtools/package.json
+++ b/packages/devtools/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/devtools",
-	"version": "0.0.2-next.1",
+	"version": "0.0.2-next.2",
 	"private": true,
 	"files": [
 		"./dist/"
@@ -10,6 +10,6 @@
 		"prepack": "tsc || echo ok"
 	},
 	"devDependencies": {
-		"@nativescript/core": "9.0.11-next.2"
+		"@nativescript/core": "9.0.12-next.0"
 	}
 }
diff --git a/packages/vite/package.json b/packages/vite/package.json
index bd76644c3f..f7e035e0ed 100644
--- a/packages/vite/package.json
+++ b/packages/vite/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/vite",
-	"version": "1.0.4-next.1",
+	"version": "1.0.4-next.2",
 	"description": "Vite for NativeScript",
 	"main": "./index.js",
 	"module": "./index.js",
diff --git a/packages/webpack5/package.json b/packages/webpack5/package.json
index 2c6507b128..62aac70267 100644
--- a/packages/webpack5/package.json
+++ b/packages/webpack5/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/webpack",
-	"version": "5.0.31-next.1",
+	"version": "5.0.31-next.2",
 	"private": false,
 	"main": "dist/index.js",
 	"files": [

From e871f168ffcb481b76fd4266ba3cd8547e3936ba Mon Sep 17 00:00:00 2001
From: Eduardo Speroni <edusperoni@users.noreply.github.com>
Date: Mon, 5 Jan 2026 12:29:36 -0300
Subject: [PATCH 17/26] fix(webpack): ts-patch transform (#11041)

---
 .../src/transformers/NativeClass/index.ts     | 28 +++++--------------
 1 file changed, 7 insertions(+), 21 deletions(-)

diff --git a/packages/webpack5/src/transformers/NativeClass/index.ts b/packages/webpack5/src/transformers/NativeClass/index.ts
index 3610190a35..e3f36114f4 100644
--- a/packages/webpack5/src/transformers/NativeClass/index.ts
+++ b/packages/webpack5/src/transformers/NativeClass/index.ts
@@ -19,7 +19,7 @@ export default function (context: ts.TransformationContext, ...args) {
 	return (sourceFile: ts.SourceFile) => {
 		if (sourceFile.isDeclarationFile) return sourceFile;
 		let mutated = false;
-		
+
 		// Minimal mutable shape
 		type MutableNode = ts.Node & {
 			flags?: ts.NodeFlags;
@@ -182,8 +182,8 @@ export default function (context: ts.TransformationContext, ...args) {
 		}
 
 		function visitNode(node: ts.Node): ts.Node {
-		// Do not traverse synthesized helper trees; leave them intact
-	if (((node as MutableNode).flags ?? 0) & ts.NodeFlags.Synthesized ) {
+			// Do not traverse synthesized helper trees; leave them intact
+			if (((node as MutableNode).flags ?? 0) & ts.NodeFlags.Synthesized) {
 				return node;
 			}
 			if (ts.isSourceFile(node)) {
@@ -223,7 +223,9 @@ export default function (context: ts.TransformationContext, ...args) {
 			}
 			const result: ts.Statement[] = [];
 			for (const statement of statements) {
-				if (((statement as MutableNode).flags ?? 0) & ts.NodeFlags.Synthesized) {
+				if (
+					((statement as MutableNode).flags ?? 0) & ts.NodeFlags.Synthesized
+				) {
 					result.push(statement);
 					continue;
 				}
@@ -282,22 +284,6 @@ export default function (context: ts.TransformationContext, ...args) {
 			}
 			return [changed ? factory.createNodeArray(result) : statements, changed];
 		}
-
-
-		// we detect ts-patch
-		if (args.length) {
-			const statements= ts.visitNodes(sourceFile.statements, visitNode) as unknown as ts.Statement[];
-				if (!mutated) {
-					return sourceFile;
-				}
-			const updatedSource = factory.updateSourceFile(sourceFile, statements as unknown as ts.Statement[]);
-			// Do NOT clear or rebind the entire SourceFile here. Doing so can break TS's
-			// import usage analysis and lead to import elision. The factory/update API
-			// preserves parents/bindings for original nodes (like imports). We only
-			// synthesize/bind the newly inserted class replacement statements.
-			return updatedSource;
-		}
-		
 		const updated = ts.visitNode(sourceFile, visitNode) as ts.SourceFile;
 		if (!mutated) return sourceFile;
 		return updated;
@@ -339,4 +325,4 @@ function setSynthesizedRangeRecursive(node: ts.Node): void {
 function setOriginalRecursive(node: ts.Node, original: ts.Node): void {
 	ts.setOriginalNode(node, original);
 	ts.forEachChild(node, (child) => setOriginalRecursive(child, original));
-}
\ No newline at end of file
+}

From a6c0a7683734a8483fd5f94f94e1572b125ecda2 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Mon, 5 Jan 2026 15:30:46 +0000
Subject: [PATCH 18/26] ci: build

---
 nx.json                        |  2 +-
 packages/core/package.json     |  2 +-
 packages/devtools/package.json |  4 ++--
 packages/vite/package.json     | 11 ++++++++++-
 packages/webpack5/package.json | 14 +++++++++++---
 5 files changed, 25 insertions(+), 8 deletions(-)

diff --git a/nx.json b/nx.json
index 89545862b9..43061bbfe3 100644
--- a/nx.json
+++ b/nx.json
@@ -123,7 +123,7 @@
 	"useInferencePlugins": false,
 	"defaultBase": "master",
 	"release": {
-		"projects": ["packages/*", "!packages/ui-mobile-base", "!packages/types-minimal", "!packages/winter-tc"],
+		"projects": ["packages/*", "!packages/ui-mobile-base", "!packages/types-minimal", "!packages/winter-tc", "!packages/types", "!packages/types-ios", "!packages/types-android"],
 		"projectsRelationship": "independent",
 		"changelog": {
 			"workspaceChangelog": false,
diff --git a/packages/core/package.json b/packages/core/package.json
index 0501ba6d81..2ac9c3a08c 100644
--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/core",
-	"version": "9.0.12-next.0",
+	"version": "9.0.12-next.1",
 	"description": "A JavaScript library providing an easy to use api for interacting with iOS and Android platform APIs.",
 	"type": "module",
 	"main": "index",
diff --git a/packages/devtools/package.json b/packages/devtools/package.json
index c475070360..dc5f35adfc 100644
--- a/packages/devtools/package.json
+++ b/packages/devtools/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/devtools",
-	"version": "0.0.2-next.2",
+	"version": "0.0.2-next.3",
 	"private": true,
 	"files": [
 		"./dist/"
@@ -10,6 +10,6 @@
 		"prepack": "tsc || echo ok"
 	},
 	"devDependencies": {
-		"@nativescript/core": "9.0.12-next.0"
+		"@nativescript/core": "9.0.12-next.1"
 	}
 }
diff --git a/packages/vite/package.json b/packages/vite/package.json
index f7e035e0ed..09a1231801 100644
--- a/packages/vite/package.json
+++ b/packages/vite/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/vite",
-	"version": "1.0.4-next.2",
+	"version": "1.0.6-next.0",
 	"description": "Vite for NativeScript",
 	"main": "./index.js",
 	"module": "./index.js",
@@ -39,5 +39,14 @@
 	"devDependencies": {
 		"@types/node": "^24.9.1",
 		"vitest": "^3.2.4"
+	},
+	"homepage": "https://docs.nativescript.org/configuration/vite",
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/NativeScript/NativeScript"
+	},
+	"author": {
+		"name": "NativeScript",
+		"email": "oss@nativescript.org"
 	}
 }
diff --git a/packages/webpack5/package.json b/packages/webpack5/package.json
index 62aac70267..b9514ad10f 100644
--- a/packages/webpack5/package.json
+++ b/packages/webpack5/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/webpack",
-	"version": "5.0.31-next.2",
+	"version": "5.0.30-next.0",
 	"private": false,
 	"main": "dist/index.js",
 	"files": [
@@ -12,8 +12,7 @@
 	"license": "Apache-2.0",
 	"scripts": {
 		"test": "jest",
-		"copy-stubs": "mkdirp dist/stubs && cp -R src/stubs/* dist/stubs",
-		"prepack": "npm run test && npm run build && npm run copy-stubs && chmod +x dist/bin/index.js"
+		"copy-stubs": "mkdirp dist/stubs && cp -R src/stubs/* dist/stubs"
 	},
 	"dependencies": {
 		"@babel/core": "^7.0.0",
@@ -79,5 +78,14 @@
 		"nativescript-vue-template-compiler": {
 			"optional": true
 		}
+	},
+	"homepage": "https://docs.nativescript.org/configuration/webpack",
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/NativeScript/NativeScript"
+	},
+	"author": {
+		"name": "NativeScript",
+		"email": "oss@nativescript.org"
 	}
 }

From 9aac0d4ea63a704f820fe7b18a53fca266be887c Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 6 Jan 2026 01:18:37 +0000
Subject: [PATCH 19/26] chore(release): publish

- project: devtools 0.0.2-next.4

- project: webpack5 5.0.30-next.1

- project: core 9.0.12-next.2

- project: vite 1.0.6-next.1
---
 packages/core/package.json     | 2 +-
 packages/devtools/package.json | 4 ++--
 packages/vite/package.json     | 2 +-
 packages/webpack5/package.json | 2 +-
 4 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/core/package.json b/packages/core/package.json
index 2ac9c3a08c..b853ee7123 100644
--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/core",
-	"version": "9.0.12-next.1",
+	"version": "9.0.12-next.2",
 	"description": "A JavaScript library providing an easy to use api for interacting with iOS and Android platform APIs.",
 	"type": "module",
 	"main": "index",
diff --git a/packages/devtools/package.json b/packages/devtools/package.json
index dc5f35adfc..2fc13e6fb8 100644
--- a/packages/devtools/package.json
+++ b/packages/devtools/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/devtools",
-	"version": "0.0.2-next.3",
+	"version": "0.0.2-next.4",
 	"private": true,
 	"files": [
 		"./dist/"
@@ -10,6 +10,6 @@
 		"prepack": "tsc || echo ok"
 	},
 	"devDependencies": {
-		"@nativescript/core": "9.0.12-next.1"
+		"@nativescript/core": "9.0.12-next.2"
 	}
 }
diff --git a/packages/vite/package.json b/packages/vite/package.json
index 09a1231801..0b1843baa4 100644
--- a/packages/vite/package.json
+++ b/packages/vite/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/vite",
-	"version": "1.0.6-next.0",
+	"version": "1.0.6-next.1",
 	"description": "Vite for NativeScript",
 	"main": "./index.js",
 	"module": "./index.js",
diff --git a/packages/webpack5/package.json b/packages/webpack5/package.json
index b9514ad10f..35c45e54bb 100644
--- a/packages/webpack5/package.json
+++ b/packages/webpack5/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/webpack",
-	"version": "5.0.30-next.0",
+	"version": "5.0.30-next.1",
 	"private": false,
 	"main": "dist/index.js",
 	"files": [

From 25beb18411147d38cf21fb9619ebae4f77022f93 Mon Sep 17 00:00:00 2001
From: Nathan Walker <walkerrunpdx@gmail.com>
Date: Mon, 5 Jan 2026 17:46:21 -0800
Subject: [PATCH 20/26] release(webpack): 5.0.30

---
 packages/webpack5/CHANGELOG.md | 10 ++++++++++
 packages/webpack5/package.json |  2 +-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/packages/webpack5/CHANGELOG.md b/packages/webpack5/CHANGELOG.md
index a2442a47ca..ef17990ac6 100644
--- a/packages/webpack5/CHANGELOG.md
+++ b/packages/webpack5/CHANGELOG.md
@@ -1,3 +1,13 @@
+## 5.0.30 (2026-01-06)
+
+### 🩹 Fixes
+
+- **webpack:** ts-patch transform ([#11041](https://github.com/NativeScript/NativeScript/pull/11041))
+
+### ❤️ Thank You
+
+- Eduardo Speroni @edusperoni
+
 ## 5.0.29 (2025-12-19)
 
 ### 🩹 Fixes
diff --git a/packages/webpack5/package.json b/packages/webpack5/package.json
index 35c45e54bb..e96b979b04 100644
--- a/packages/webpack5/package.json
+++ b/packages/webpack5/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/webpack",
-	"version": "5.0.30-next.1",
+	"version": "5.0.30",
 	"private": false,
 	"main": "dist/index.js",
 	"files": [

From 5b8f806d925b3598e5ab1d8da7b555448bad97b8 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 6 Jan 2026 01:49:07 +0000
Subject: [PATCH 21/26] chore(release): publish

- project: webpack5 5.0.31-next.0
---
 packages/webpack5/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/webpack5/package.json b/packages/webpack5/package.json
index e96b979b04..12448d572a 100644
--- a/packages/webpack5/package.json
+++ b/packages/webpack5/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/webpack",
-	"version": "5.0.30",
+	"version": "5.0.31-next.0",
 	"private": false,
 	"main": "dist/index.js",
 	"files": [

From 1752481a4cc16df2dc325797525fe5e916d32ac2 Mon Sep 17 00:00:00 2001
From: Nathan Walker <walkerrunpdx@gmail.com>
Date: Mon, 5 Jan 2026 19:06:22 -0800
Subject: [PATCH 22/26] chore: workflow next affected

---
 .github/workflows/secure_nx_release.yml |  76 ++++++++++++--
 packages/vite/README.md                 |  28 ++++-
 packages/webpack5/README.md             | 130 ++++++++++++++++++------
 packages/webpack5/package.json          |  14 ++-
 packages/webpack5/project.json          |  10 ++
 5 files changed, 213 insertions(+), 45 deletions(-)

diff --git a/.github/workflows/secure_nx_release.yml b/.github/workflows/secure_nx_release.yml
index 8fedd6f361..35b7fe5e8f 100644
--- a/.github/workflows/secure_nx_release.yml
+++ b/.github/workflows/secure_nx_release.yml
@@ -251,8 +251,8 @@ jobs:
           fi
 
       # PUBLISH: OIDC trusted publishing (default). Avoid any lingering token auth.
-      - name: nx release publish (OIDC)
-        if: ${{ steps.ctx.outputs.mode != 'tag' && steps.ctx.outputs.dry_run != 'true' && vars.USE_NPM_TOKEN != 'true' && (steps.ctx.outputs.mode != 'main' || steps.affected.outputs.count != '0') }}
+      - name: nx release publish (OIDC, main)
+        if: ${{ steps.ctx.outputs.mode == 'main' && steps.affected.outputs.count != '0' && vars.USE_NPM_TOKEN != 'true' }}
         shell: bash
         env:
           NPM_CONFIG_PROVENANCE: true
@@ -266,11 +266,39 @@ jobs:
           fi
 
           npx nx release publish \
+            --projects "${{ steps.affected.outputs.projects }}" \
+            --tag "${{ steps.ctx.outputs.dist_tag }}" \
+            --access public \
+            --verbose
+
+      - name: nx release publish (OIDC, dispatch)
+        if: ${{ steps.ctx.outputs.mode == 'dispatch' && steps.ctx.outputs.dry_run != 'true' && vars.USE_NPM_TOKEN != 'true' }}
+        shell: bash
+        env:
+          NPM_CONFIG_PROVENANCE: true
+          NODE_AUTH_TOKEN: ""
+        run: |
+          set -euo pipefail
+          unset NODE_AUTH_TOKEN
+          rm -f ~/.npmrc || true
+          if [[ -n "${NPM_CONFIG_USERCONFIG:-}" ]]; then
+            rm -f "$NPM_CONFIG_USERCONFIG" || true
+          fi
+
+          scope="${{ steps.ctx.outputs.scope }}"
+          if [[ -n "$scope" ]]; then
+            projects_arg="--projects $scope"
+          else
+            projects_arg=""
+          fi
+
+          npx nx release publish \
+            $projects_arg \
             --tag "${{ steps.ctx.outputs.dist_tag }}" \
             --access public \
             --verbose
 
-      - name: nx release publish (OIDC, dry-run)
+      - name: nx release publish (OIDC, dispatch dry-run)
         if: ${{ steps.ctx.outputs.mode == 'dispatch' && inputs.dry-run && vars.USE_NPM_TOKEN != 'true' }}
         shell: bash
         env:
@@ -284,28 +312,60 @@ jobs:
             rm -f "$NPM_CONFIG_USERCONFIG" || true
           fi
 
+          scope="${{ steps.ctx.outputs.scope }}"
+          if [[ -n "$scope" ]]; then
+            projects_arg="--projects $scope"
+          else
+            projects_arg=""
+          fi
+
           npx nx release publish \
+            $projects_arg \
             --tag "${{ steps.ctx.outputs.dist_tag }}" \
             --access public \
             --verbose \
             --dry-run
 
       # PUBLISH: token fallback (only when explicitly enabled via repo/environment variable USE_NPM_TOKEN=true).
-      - name: nx release publish (token)
-        if: ${{ steps.ctx.outputs.mode != 'tag' && steps.ctx.outputs.dry_run != 'true' && vars.USE_NPM_TOKEN == 'true' && (steps.ctx.outputs.mode != 'main' || steps.affected.outputs.count != '0') }}
+      - name: nx release publish (token, main)
+        if: ${{ steps.ctx.outputs.mode == 'main' && steps.affected.outputs.count != '0' && vars.USE_NPM_TOKEN == 'true' }}
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_PUBLISH_TOKEN }}
+          NPM_CONFIG_PROVENANCE: true
+        run: |
+          npx nx release publish --projects "${{ steps.affected.outputs.projects }}" --tag "${{ steps.ctx.outputs.dist_tag }}" --access public --verbose
+
+      - name: nx release publish (token, dispatch)
+        if: ${{ steps.ctx.outputs.mode == 'dispatch' && steps.ctx.outputs.dry_run != 'true' && vars.USE_NPM_TOKEN == 'true' }}
+        shell: bash
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_PUBLISH_TOKEN }}
           NPM_CONFIG_PROVENANCE: true
         run: |
-          npx nx release publish --tag "${{ steps.ctx.outputs.dist_tag }}" --access public --verbose
+          set -euo pipefail
+          scope="${{ steps.ctx.outputs.scope }}"
+          if [[ -n "$scope" ]]; then
+            projects_arg="--projects $scope"
+          else
+            projects_arg=""
+          fi
+          npx nx release publish $projects_arg --tag "${{ steps.ctx.outputs.dist_tag }}" --access public --verbose
 
-      - name: nx release publish (token, dry-run)
+      - name: nx release publish (token, dispatch dry-run)
         if: ${{ steps.ctx.outputs.mode == 'dispatch' && inputs.dry-run && vars.USE_NPM_TOKEN == 'true' }}
+        shell: bash
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_PUBLISH_TOKEN }}
           NPM_CONFIG_PROVENANCE: true
         run: |
-          npx nx release publish --tag "${{ steps.ctx.outputs.dist_tag }}" --access public --verbose --dry-run
+          set -euo pipefail
+          scope="${{ steps.ctx.outputs.scope }}"
+          if [[ -n "$scope" ]]; then
+            projects_arg="--projects $scope"
+          else
+            projects_arg=""
+          fi
+          npx nx release publish $projects_arg --tag "${{ steps.ctx.outputs.dist_tag }}" --access public --verbose --dry-run
 
       # Tag-triggered publishing: publish the single package referenced by the tag.
       - name: Build project before publish (tag)
diff --git a/packages/vite/README.md b/packages/vite/README.md
index 968f906c5c..67ed0cb366 100644
--- a/packages/vite/README.md
+++ b/packages/vite/README.md
@@ -1,6 +1,28 @@
-# @nativescript/vite
-
-Vite bundler integration for NativeScript apps. Provides a minimal setup for fast dev and build.
+<p align="center">
+  <a href="https://nativescript.org">
+    <img alt="NativeScript" src="https://raw.githubusercontent.com/NativeScript/artwork/main/logo/export/NativeScript_Logo_Dark_Transparent.png" width="100"/>
+  </a>
+</p>
+
+<h1 align="center">@nativescript/vite</h1>
+
+<p align="center">
+  <b>Vite integration for NativeScript apps.</b>
+</p>
+
+<p align="center">
+  <a href="https://www.npmjs.com/package/@nativescript/vite"><img src="https://img.shields.io/npm/v/@nativescript/vite.svg" alt="npm version"></a>
+  <a href="https://github.com/NativeScript/NativeScript/blob/main/LICENSE"><img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="license"></a>
+</p>
+
+<p align="center">
+  <a href="https://docs.nativescript.org/configuration/vite">Documentation</a> · 
+  <a href="https://docs.nativescript.org/setup/">Environment Setup</a> · 
+  <a href="https://github.com/NativeScript/NativeScript/blob/main/tools/notes/CONTRIBUTING.md">Contribute</a> · 
+  <a href="https://nativescript.org/discord">Community</a>
+</p>
+
+---
 
 ## Prerequisites
 
diff --git a/packages/webpack5/README.md b/packages/webpack5/README.md
index 73e509ce2f..7324ff08d1 100644
--- a/packages/webpack5/README.md
+++ b/packages/webpack5/README.md
@@ -1,30 +1,100 @@
-@nativescript/webpack rewrite
-
-The rewrite allows us to simplify things, and introduce some breaking changes.
-Listing them here, so we can keep track of them - will be in the merge commit, and the release notes once we are ready.
-
-BREAKING CHANGES:
- - `package.json` main should now use a relative path to the package.json instead of the app directory
-   
-   For example (given we have a `src` directory where our app is):
-   
-   `"main": "app.js"` becomes `"main": "src/app.js"`  **OR** `"main": "src/app.ts"` (whether using JS or TS)
-   
-   This simplifies things, and will allow ctrl/cmd + clicking on the filename in some editors.
- 
- - `postinstall` scripts have been removed.
- 
-   The configuration will not need to change in the user projects between updates.
- 
-   For existing projects we will provide an easy upgrade path, through `ns migrate` and a binary in the package.
-   
-   For new projects `ns create` should create the config file by invoking a binary in the package. 
-
- - removed resolutions for short imports - use full imports instead.
- 
-   For example:
-   ```
-   import http from 'http'
-   // becomes
-   import { http } from '@nativescript/core'
-   ```
+<p align="center">
+  <a href="https://nativescript.org">
+    <img alt="NativeScript" src="https://raw.githubusercontent.com/NativeScript/artwork/main/logo/export/NativeScript_Logo_Dark_Transparent.png" width="100"/>
+  </a>
+</p>
+
+<h1 align="center">@nativescript/webpack</h1>
+
+<p align="center">
+  <b>Webpack configuration for NativeScript apps.</b>
+</p>
+
+<p align="center">
+  <a href="https://www.npmjs.com/package/@nativescript/webpack"><img src="https://img.shields.io/npm/v/@nativescript/webpack.svg" alt="npm version"></a>
+  <a href="https://github.com/NativeScript/NativeScript/blob/main/LICENSE"><img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="license"></a>
+  <a href="https://www.npmjs.com/package/@nativescript/webpack"><img src="https://img.shields.io/npm/dm/@nativescript/webpack.svg" alt="downloads"></a>
+</p>
+
+<p align="center">
+  <a href="https://docs.nativescript.org/configuration/webpack">Documentation</a> · 
+  <a href="https://docs.nativescript.org/setup/">Environment Setup</a> · 
+  <a href="https://github.com/NativeScript/NativeScript/blob/main/tools/notes/CONTRIBUTING.md">Contribute</a> · 
+  <a href="https://nativescript.org/discord">Community</a>
+</p>
+
+---
+
+All NativeScript applications are bundled using webpack. This package provides the required configuration to build NativeScript apps with flexibility to customize as needed.
+
+## 📦 Installation
+
+```bash
+npm install @nativescript/webpack --save-dev
+```
+
+## 🚀 Quick Start
+
+All new projects come with a base `webpack.config.js` that's pre-configured:
+
+```js
+const webpack = require('@nativescript/webpack')
+
+module.exports = (env) => {
+  webpack.init(env)
+
+  // Learn how to customize:
+  // https://docs.nativescript.org/webpack
+
+  return webpack.resolveConfig()
+}
+```
+
+## ✨ Features
+
+- **Auto-discovery**: Automatically detects your project type (TypeScript, Angular, Vue, React, Svelte)
+- **Hot Module Replacement**: HMR enabled by default for faster development
+- **DotEnv Support**: Built-in support for `.env` files to manage environment variables
+- **Bundle Analysis**: Generate bundle reports with `--env.report`
+- **Production Optimization**: Minification with Terser in production mode
+
+## 🔧 Global Variables
+
+Useful globally available variables in your app:
+
+| Variable | Description |
+|----------|-------------|
+| `__DEV__` | `true` when building in development mode |
+| `global.isAndroid` / `__ANDROID__` | `true` when platform is Android |
+| `global.isIOS` / `__IOS__` | `true` when platform is iOS |
+| `global.isVisionOS` / `__VISIONOS__` | `true` when platform is visionOS |
+| `global.__APPLE__` | `true` when platform is iOS or visionOS |
+
+## 📚 API
+
+### Core Methods
+
+| Method | Description |
+|--------|-------------|
+| `webpack.init(env)` | Initialize the internal env object (required) |
+| `webpack.chainWebpack(chainFn)` | Add chain functions to modify config |
+| `webpack.mergeWebpack(obj)` | Merge objects into the final config |
+| `webpack.resolveConfig()` | Resolve the final webpack configuration |
+
+## 🎛️ CLI Flags
+
+| Flag | Description |
+|------|-------------|
+| `--no-hmr` | Disable Hot Module Replacement |
+| `--env.production` | Enable production mode with minification |
+| `--env.report` | Generate bundle analysis report |
+| `--env.verbose` | Print verbose logs and internal config |
+| `--env.e2e` | Enable E2E mode (enables `testID` property) |
+
+## 📖 Documentation
+
+For complete documentation including configuration examples, visit the [webpack configuration guide](https://docs.nativescript.org/configuration/webpack).
+
+## 📄 License
+
+[MIT licensed](https://github.com/NativeScript/NativeScript/blob/main/LICENSE).
diff --git a/packages/webpack5/package.json b/packages/webpack5/package.json
index 12448d572a..834eaaa2b0 100644
--- a/packages/webpack5/package.json
+++ b/packages/webpack5/package.json
@@ -85,7 +85,13 @@
 		"url": "https://github.com/NativeScript/NativeScript"
 	},
 	"author": {
-		"name": "NativeScript",
-		"email": "oss@nativescript.org"
-	}
-}
+		"name": "Igor Randjelovic",
+		"email": "rigor789@gmail.com"
+	},
+	"contributors": [
+		{
+			"name": "NativeScript",
+			"email": "oss@nativescript.org"
+		}
+	]
+}
\ No newline at end of file
diff --git a/packages/webpack5/project.json b/packages/webpack5/project.json
index 81e44bac31..976ba26943 100644
--- a/packages/webpack5/project.json
+++ b/packages/webpack5/project.json
@@ -21,6 +21,16 @@
 				"rootDir": "{projectRoot}/src",
 				"main": "{projectRoot}/src/index.ts",
 				"assets": [
+					{
+						"input": "{projectRoot}",
+						"glob": "README.md",
+						"output": ".."
+					},
+					{
+						"input": "{workspaceRoot}",
+						"glob": "LICENSE",
+						"output": ".."
+					},
 					{
 						"input": "{projectRoot}/src/stubs",
 						"glob": "*.{js,mjs}",

From 3b221de2aac174867bc5ca3ce951335632a68227 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 6 Jan 2026 03:07:45 +0000
Subject: [PATCH 23/26] chore(release): publish

- project: webpack5 5.0.31-next.1

- project: vite 1.0.6-next.2
---
 packages/vite/package.json     | 2 +-
 packages/webpack5/package.json | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/vite/package.json b/packages/vite/package.json
index 0b1843baa4..71c5f62f81 100644
--- a/packages/vite/package.json
+++ b/packages/vite/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/vite",
-	"version": "1.0.6-next.1",
+	"version": "1.0.6-next.2",
 	"description": "Vite for NativeScript",
 	"main": "./index.js",
 	"module": "./index.js",
diff --git a/packages/webpack5/package.json b/packages/webpack5/package.json
index 834eaaa2b0..ae78625e01 100644
--- a/packages/webpack5/package.json
+++ b/packages/webpack5/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/webpack",
-	"version": "5.0.31-next.0",
+	"version": "5.0.31-next.1",
 	"private": false,
 	"main": "dist/index.js",
 	"files": [
@@ -94,4 +94,4 @@
 			"email": "oss@nativescript.org"
 		}
 	]
-}
\ No newline at end of file
+}

From fce5ecf2ef22f041dc14a91e0fbcaf8ac231860c Mon Sep 17 00:00:00 2001
From: Nathan Walker <walkerrunpdx@gmail.com>
Date: Mon, 5 Jan 2026 19:19:38 -0800
Subject: [PATCH 24/26] release(webpack): 5.0.31

---
 packages/webpack5/CHANGELOG.md |  4 ++++
 packages/webpack5/package.json | 10 +++++++++-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/packages/webpack5/CHANGELOG.md b/packages/webpack5/CHANGELOG.md
index ef17990ac6..73e3848bde 100644
--- a/packages/webpack5/CHANGELOG.md
+++ b/packages/webpack5/CHANGELOG.md
@@ -1,3 +1,7 @@
+## 5.0.31 (2026-01-06)
+
+- LICENSE and README.md are now included in the package assets.
+
 ## 5.0.30 (2026-01-06)
 
 ### 🩹 Fixes
diff --git a/packages/webpack5/package.json b/packages/webpack5/package.json
index ae78625e01..99b3bb919f 100644
--- a/packages/webpack5/package.json
+++ b/packages/webpack5/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/webpack",
-	"version": "5.0.31-next.1",
+	"version": "5.0.31",
 	"private": false,
 	"main": "dist/index.js",
 	"files": [
@@ -93,5 +93,13 @@
 			"name": "NativeScript",
 			"email": "oss@nativescript.org"
 		}
+	],
+	"keywords": [
+		"NativeScript",
+		"JavaScript",
+		"Android",
+		"iOS",
+		"TypeScript",
+		"webpack"
 	]
 }

From 4f03ea956ee838dcf30c692a991d48813aa88b3c Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 6 Jan 2026 03:23:28 +0000
Subject: [PATCH 25/26] chore(release): publish

- project: webpack5 5.0.32-next.0
---
 packages/webpack5/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/webpack5/package.json b/packages/webpack5/package.json
index 99b3bb919f..3634a96518 100644
--- a/packages/webpack5/package.json
+++ b/packages/webpack5/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/webpack",
-	"version": "5.0.31",
+	"version": "5.0.32-next.0",
 	"private": false,
 	"main": "dist/index.js",
 	"files": [

From 160302750b6674066bd3768b2021b451f8aa8bb7 Mon Sep 17 00:00:00 2001
From: Nathan Walker <walkerrunpdx@gmail.com>
Date: Mon, 5 Jan 2026 20:42:36 -0800
Subject: [PATCH 26/26] feat: improve android

---
 apps/toolbox/nativescript.config.ts      |  4 +-
 apps/toolbox/src/pages/sliders.xml       |  2 +-
 packages/core/ui/slider/index.android.ts | 69 ++++++++++++++++--------
 3 files changed, 51 insertions(+), 24 deletions(-)

diff --git a/apps/toolbox/nativescript.config.ts b/apps/toolbox/nativescript.config.ts
index 5eb9475ee3..6eeb31439f 100644
--- a/apps/toolbox/nativescript.config.ts
+++ b/apps/toolbox/nativescript.config.ts
@@ -12,6 +12,6 @@ export default {
 		packageManager: 'npm',
 		additionalPathsToClean: ['.ns-vite-build'],
 	},
-	bundler: 'vite',
-	bundlerConfigPath: 'vite.config.ts',
+	// bundler: 'vite',
+	// bundlerConfigPath: 'vite.config.ts',
 } as NativeScriptConfig;
diff --git a/apps/toolbox/src/pages/sliders.xml b/apps/toolbox/src/pages/sliders.xml
index cc0b404239..2ba0bc44c9 100644
--- a/apps/toolbox/src/pages/sliders.xml
+++ b/apps/toolbox/src/pages/sliders.xml
@@ -6,7 +6,7 @@
 
     <GridLayout class="sliders-demo-page">
       <ScrollView>
-          <StackLayout ios:padding="20" visionos:padding="40">
+          <StackLayout padding="20" visionos:padding="40">
 
             <Label text="Default Slider" class="h3" marginTop="24" />
             <Slider minValue="0" maxValue="100" value="50" marginTop="12" />
diff --git a/packages/core/ui/slider/index.android.ts b/packages/core/ui/slider/index.android.ts
index 4c67a882b7..9f10000f3f 100644
--- a/packages/core/ui/slider/index.android.ts
+++ b/packages/core/ui/slider/index.android.ts
@@ -154,50 +154,77 @@ export class Slider extends SliderBase {
 			return;
 		}
 
+		// Get dimensions
+		const density = nativeView.getContext().getResources().getDisplayMetrics().density;
+		const width = nativeView.getWidth() || 1000;
+		const trackHeight = Math.round(3 * density); // 3dp track height to match iOS
+		const cornerRadius = trackHeight / 2;
+
 		// Create colors array from gradient stops
 		const colors = Array.create('int', gradient.colorStops.length);
 		gradient.colorStops.forEach((stop, index) => {
 			colors[index] = stop.color.android;
 		});
 
-		// Get width for gradient
-		const width = nativeView.getWidth() || 1000;
-
-		// Create LinearGradient shader (left to right)
-		const shader = new android.graphics.LinearGradient(0, 0, width, 0, colors, null, android.graphics.Shader.TileMode.CLAMP);
-
-		// Create ShapeDrawable with the gradient for the progress layer
-		const progressShape = new android.graphics.drawable.ShapeDrawable(new android.graphics.drawable.shapes.RectShape());
-		progressShape.getPaint().setShader(shader);
-
-		// Wrap in ClipDrawable so it clips based on progress level
-		const progressClip = new android.graphics.drawable.ClipDrawable(progressShape, android.view.Gravity.LEFT, android.graphics.drawable.ClipDrawable.HORIZONTAL);
-
-		// Create a semi-transparent version for the background track
+		// Create semi-transparent colors for background
 		const bgColors = Array.create('int', gradient.colorStops.length);
 		gradient.colorStops.forEach((stop, index) => {
-			// Make background 30% opacity
 			const color = stop.color;
 			const alpha = Math.round(color.a * 0.3);
 			bgColors[index] = android.graphics.Color.argb(alpha, color.r, color.g, color.b);
 		});
-		const bgShader = new android.graphics.LinearGradient(0, 0, width, 0, bgColors, null, android.graphics.Shader.TileMode.CLAMP);
-		const bgShape = new android.graphics.drawable.ShapeDrawable(new android.graphics.drawable.shapes.RectShape());
-		bgShape.getPaint().setShader(bgShader);
 
-		// Create LayerDrawable with background and progress layers
+		// Create rounded corner radii
+		const radii = Array.create('float', 8);
+		for (let i = 0; i < 8; i++) {
+			radii[i] = cornerRadius;
+		}
+
+		// Background track - use GradientDrawable for proper sizing
+		const bgDrawable = new android.graphics.drawable.GradientDrawable();
+		bgDrawable.setOrientation(android.graphics.drawable.GradientDrawable.Orientation.LEFT_RIGHT);
+		bgDrawable.setColors(bgColors);
+		bgDrawable.setCornerRadius(cornerRadius);
+		bgDrawable.setShape(android.graphics.drawable.GradientDrawable.RECTANGLE);
+
+		// Progress track - use GradientDrawable
+		const progressDrawable = new android.graphics.drawable.GradientDrawable();
+		progressDrawable.setOrientation(android.graphics.drawable.GradientDrawable.Orientation.LEFT_RIGHT);
+		progressDrawable.setColors(colors);
+		progressDrawable.setCornerRadius(cornerRadius);
+		progressDrawable.setShape(android.graphics.drawable.GradientDrawable.RECTANGLE);
+
+		// Wrap progress in ClipDrawable for clipping based on progress
+		const progressClip = new android.graphics.drawable.ClipDrawable(progressDrawable, android.view.Gravity.LEFT, android.graphics.drawable.ClipDrawable.HORIZONTAL);
+
+		// Create LayerDrawable with both layers
 		const layers = Array.create(android.graphics.drawable.Drawable, 2);
-		layers[0] = bgShape;
+		layers[0] = bgDrawable;
 		layers[1] = progressClip;
 
 		const layerDrawable = new android.graphics.drawable.LayerDrawable(layers);
 		layerDrawable.setId(0, android.R.id.background);
 		layerDrawable.setId(1, android.R.id.progress);
 
+		// Set layer height using setLayerSize (API 23+) or setLayerInset
+		// Use setLayerHeight to constrain the actual drawable height
+		const thumbHeight = Math.round(20 * density); // Approximate thumb size
+		const verticalInset = Math.round((thumbHeight - trackHeight) / 2);
+
+		layerDrawable.setLayerInset(0, 0, verticalInset, 0, verticalInset);
+		layerDrawable.setLayerInset(1, 0, verticalInset, 0, verticalInset);
+
 		// Apply to slider
 		nativeView.setProgressDrawable(layerDrawable);
 
-		// Force refresh progress to apply clipping
+		// Disable split track to remove the gap behind thumb
+		nativeView.setSplitTrack(false);
+
+		// Set max height to constrain the SeekBar
+		nativeView.setMaxHeight(thumbHeight);
+		nativeView.setMinHeight(thumbHeight);
+
+		// Force refresh progress
 		const currentProgress = nativeView.getProgress();
 		nativeView.setProgress(0);
 		nativeView.setProgress(currentProgress);