Build widgets with JavaScript + JSX

1 min read Original article ↗

SwiftUI runtime for JavaScript widgets

ScriptWidget lets you author widgets in a familiar JS + JSX workflow, then renders them with a native SwiftUI runtime across iOS, iPadOS, and macOS.

iOS, iPadOS, macOSLive Activities + Dynamic IslandJSX to SwiftUI

Example

// ScriptWidget
// https://xnu.app/scriptwidget

$render(
  <vstack frame="max" padding="12" background="#0f172a">
    <text font="caption" color="#94a3b8">Hello ScriptWidget</text>
    <text font="title3" color="#e2e8f0">Widgets with JavaScript + JSX</text>
  </vstack>
);

Edit scripts in the app and preview instantly. Widgets refresh automatically on device.

Composable UI

Build layouts with JSX components mapped to native SwiftUI views, including stacks, charts, gauges, and custom shapes.

Powerful runtime APIs

Access system info, device state, networking, storage, and read-only HealthKit plus Location data through a curated JavaScript API surface.

Widgets everywhere

Ship the same script to Home Screen widgets, Live Activities, and Dynamic Island surfaces with adaptive layouts.

Build flow

A quick overview of the ScriptWidget workflow from idea to widget.

1. Author in JavaScript

Write JSX layouts and scripts with $render, $system, $device, and $storage.

2. Preview on device

Use the in-app editor to preview widgets, Live Activities, and Dynamic Island layouts.

3. Ship everywhere

Sync scripts via iCloud/app group and deploy to all ScriptWidget surfaces.

Ready to build your first widget?

Download ScriptWidget and start scripting your own widgets today.

Get ScriptWidget