Brik — Live Activities, Widgets & Dynamic Island with React

v0.3.0 - BETA ⚠️ Ready for testing - Core features complete, comprehensive testing in progress

Build native iOS/Android widgets and Live Activities from a single React codebase. No Swift/Kotlin, no Xcode/Android Studio, and no extra JS runtime.

⚡ Live Activities: Real-time updates on lock screen & Dynamic Island
🏠 Native widgets: iOS WidgetKit + Android Glance
🔗 Deep linking: Open app/screens with parameters from any widget tap
📱 Full platform support: Home screen, lock screen, Dynamic Island
✻ AI-agent friendly: Deterministic codegen, typed IR, simple APIs
🚀 @Expo + React Native ready: Works in managed and bare projects

Supported surfaces

iOS (Fully Supported):

✅ Home Screen Widgets (WidgetKit) - iOS 14+
✅ Lock Screen Widgets (WidgetKit) - iOS 16+
✅ Live Activities (ActivityKit) - iOS 16.1+
✅ Dynamic Island - iPhone 14 Pro+
🔜 watchOS Widgets - Coming in v0.4.0

Android (Fully Supported):

✅ Home Screen Widgets (Glance) - Android 12+

Development:

✅ React Native preview components for testing

How it works

JSX/TSX → IR → platform code

IR validated with Zod, compiled to SwiftUI (iOS) and Glance/Compose (Android)
CLI + Expo plugin run codegen and wire platform projects

Installation

Prerequisites

Brik uses mise to ensure consistent tool versions across all developers:

# Install mise (if not already installed)
curl https://mise.run | sh

# Clone the repository
git clone https://github.com/mukulchugh/brik.git
cd brik

# Install all tools (Node.js, Java, Ruby, pnpm)
mise install

# One-command setup (installs deps, builds packages, generates widgets, installs pods)
mise run setup

Required Versions (automatically managed by mise):

Node.js: 18.20.8
Java (OpenJDK): zulu-17.60.17.0
Ruby: 3.3.5
pnpm: 9.6.0

Manual Installation (Without mise)

# Ensure you have the correct versions installed
node --version  # Should be 18.20.8
java --version  # Should be 17.0.12
ruby --version  # Should be 3.3.5

# Install packages
pnpm install

# Build all packages
pnpm build

# Build widgets
cd packages/brik-example-shared
node ../brik-cli/dist/index.js build --platform all --as-widget ./src/widgets

# iOS: Install CocoaPods dependencies
cd examples/brik-rn-arch/ios && pod install && cd ../../..

# Android: Auto-linked (no additional setup)

For complete installation instructions, see docs/guides/installation.md.

Quick Start

# Set up iOS widget
npx brik ios-setup --name WeatherWidget

# Set up Android widget
npx brik android-setup --name WeatherWidget

# Generate native code from React components
npx brik build --platform all --as-widget

Live Activities Example

/** @brik-activity */
export function OrderTrackingActivity() {
  return {
    activityType: 'OrderTracking',
    attributes: {
      static: { orderId: 'string', merchantName: 'string' },
      dynamic: { status: 'string', eta: 'number', progress: 'number' }
    },
    regions: {
      lockScreen: (
        <BrikView style={{ padding: 16 }}>
          <BrikText>Order #{orderId} from {merchantName}</BrikText>
          <BrikProgressBar progress={progress} />
          <BrikText>{status} • ETA: {eta} min</BrikText>
        </BrikView>
      ),
      dynamicIsland: {
        compact: <BrikProgressBar progress={progress} />,
        minimal: <BrikText>🍕</BrikText>,
        expanded: <BrikView>{/* Full UI */}</BrikView>
      }
    }
  };
}

Control from JavaScript:

import { Brik } from '@brik/react-native';

// Start activity
const activity = await Brik.startActivity({
  activityType: 'OrderTracking',
  attributes: {
    static: { orderId: '12345', merchantName: 'Acme Pizza' },
    dynamic: { status: 'preparing', eta: 20, progress: 0.2 }
  }
});

// Update in real-time
await Brik.updateActivity(activity.id, {
  dynamic: { status: 'delivering', eta: 5, progress: 0.9 }
});

// End activity
await Brik.endActivity(activity.id);

Home Screen Widgets Example

Update iOS and Android home screen widgets from React Native with a unified API:

import { widgetManager } from '@brik/react-native';

// Update widget data (works on both iOS and Android)
await widgetManager.updateWidget('WeatherWidget', {
  temperature: 72,
  condition: 'Sunny',
  location: 'San Francisco',
  humidity: 65
});

Setup Commands:

# iOS Widget Setup (WidgetKit + App Groups)
pnpm brik ios-setup --name WeatherWidget

# Android Widget Setup (Jetpack Glance)
pnpm brik android-setup --name WeatherWidget

React Hook:

function WeatherScreen() {
  const { updateWidget, isUpdating } = useWidgetManager('WeatherWidget');

  return (
    <Button
      onPress={() => updateWidget({ temperature: 75, condition: 'Cloudy' })}
      disabled={isUpdating}
    />
  );
}

See docs/guides/widget-setup-guide.md for complete setup instructions.

Deep links and actions

<BrikButton label="Open details" action={{ type: 'deeplink', url: 'myapp://details/42' }} />

⚠️ Current Limitations (Beta Status)

Brik is in active development. While the core features are fully implemented, please be aware:

What Works ✅

Code generation (JSX → SwiftUI/Glance) - Production ready
Widget compilation and building - Complete for iOS and Android
Live Activities - FULLY IMPLEMENTED with ActivityKit integration
- BrikActivityRegistry pattern for type-safe activity management
- Auto-generated activity handlers with push token support
- Lock screen and Dynamic Island support
- Complete error handling and validation
JavaScript APIs - Type-safe with TypeScript
CLI tools - ios-setup, android-setup, build commands

Known Limitations ⚠️

Test Coverage: Limited automated tests (in progress). Core functionality validated.
Device Testing: Physical device testing in progress. Simulator testing complete.
Manual Setup Steps:
- iOS Widget Extension target must be added to Xcode project
- Live Activities require Info.plist configuration
- Android ProGuard rules for release builds
- See setup guides for detailed instructions
Documentation: API reference and migration guides being finalized.

Recommended Use

✅ Experimentation and prototyping
✅ Learning widget/Live Activities development
✅ Beta testing with non-critical applications
✅ Internal tools and demos
⚠️ Production applications:
- Test thoroughly on physical devices
- Monitor for edge cases
- Have fallback strategies for critical features
- See FINAL_RELEASE_VERIFICATION.md for technical readiness assessment

Support & Bug Reporting

Response Time: 24-48 hours for critical bugs
Report Issues: GitHub Issues
Ask Questions: GitHub Discussions
Weekly Updates: Bug fix releases (v0.2.1, v0.2.2, etc.)

See docs/internal/release-readiness-assessment.md for detailed assessment and validation checklist.

How Live Activities Work

Brik's Live Activities implementation is fully production-ready with complete ActivityKit integration:

Architecture

JSX Component (@brik-activity)
    ↓
Compiler (extracts activity config)
    ↓
Code Generator (Swift)
    ↓
Generated Files:
  - {ActivityType}Attributes.swift
  - {ActivityType}ActivityWidget.swift
  - {ActivityType}Handler.swift (auto-registered)
    ↓
BrikActivityRegistry (type-erased registry)
    ↓
BrikLiveActivities native module
    ↓
ActivityKit (iOS 16.1+)

Key Features

✅ Type-Safe Activity Attributes: Static and dynamic attributes with full type safety ✅ Auto-Registration: Handlers register automatically on app startup ✅ Push Token Support: Full support for remote updates via APNs ✅ Complete UI Regions: Lock screen, Dynamic Island (compact/expanded/minimal) ✅ Error Handling: Comprehensive error codes and validation

See docs/guides/live-activities-guide.md for complete usage guide.

Packages

Brik is a monorepo containing 10 publishable npm packages:

Package	Version	Description
@brik/react-native	0.3.0	React Native bridge, Live Activities & widget APIs
@brik/cli	0.3.0	CLI tools for building and setting up widgets
@brik/core	0.3.0	Core compiler and type system
@brik/compiler	0.3.0	JSX/TSX to native code compiler
@brik/target-swiftui	0.3.0	SwiftUI code generation
@brik/target-compose	0.3.0	Jetpack Compose code generation
@brik/schemas	0.3.0	Shared type definitions and schemas
@brik/babel-plugin	0.3.0	Babel transform plugin
@brik/metro-plugin	0.3.0	Metro bundler integration
@brik/expo-plugin	0.3.0	Expo config plugin

Example Apps:

examples/brik-expo-app - Expo + Weather widget demo (ready to run)
examples/brik-example-app - React Native CLI example

Documentation

User Guides

Getting Started: docs/getting-started.md
Live Activities Guide: docs/guides/live-activities-guide.md - Complete implementation guide
Widget Setup Guide: docs/guides/widget-setup-guide.md
Installation Guide: docs/guides/installation.md
Architecture: docs/architecture.md

Package Management & Publishing

Setup Guide: docs/setup/setup-complete.md - Complete npm publishing guide
Package Analysis: docs/setup/package-management-analysis.md - Monorepo strategy & recommendations
Quick Reference: docs/setup/README.md - Publishing commands & status

Project Status

Current Status: docs/status/current-status.md

Development

Setup

# Clone the repository
git clone https://github.com/mukulchugh/brik.git
cd brik

# Install dependencies
pnpm install

# Build all packages
pnpm build

# Run tests
pnpm test

# Type check
pnpm typecheck

Monorepo Structure

brik/
├── packages/          # 10 npm packages
│   ├── brik-core/
│   ├── brik-compiler/
│   ├── brik-react-native/
│   ├── brik-cli/
│   └── ...
├── examples/          # Example apps
│   └── brik-example-app/
├── docs/              # Documentation
│   ├── setup/        # Publishing guides
│   ├── guides/       # User guides
│   └── internal/     # Internal docs
└── .changeset/       # Version management

Publishing

# Create a changeset
pnpm changeset

# Version packages
pnpm version-packages

# Build and publish to npm
pnpm release

See docs/setup/setup-complete.md for detailed publishing instructions.

Contributing

See docs/contributing.md for contribution guidelines.

Name		Name	Last commit message	Last commit date
Latest commit History 31 Commits
.changeset		.changeset
.github/workflows		.github/workflows
docs		docs
examples		examples
packages		packages
scripts		scripts
.editorconfig		.editorconfig
.env.example		.env.example
.gitattributes		.gitattributes
.gitignore		.gitignore
.mise.toml		.mise.toml
.npmignore		.npmignore
.prettierrc		.prettierrc
.tool-versions		.tool-versions
CHANGELOG.md		CHANGELOG.md
LICENSE		LICENSE
README.md		README.md
jest.config.js		jest.config.js
package.json		package.json
pnpm-lock.yaml		pnpm-lock.yaml
pnpm-workspace.yaml		pnpm-workspace.yaml
tsconfig.base.json		tsconfig.base.json
turbo.json		turbo.json
vitest.config.ts		vitest.config.ts

Folders and files

Latest commit

History

Repository files navigation

Brik — Live Activities, Widgets & Dynamic Island with React

Supported surfaces

How it works

Installation

Prerequisites

Manual Installation (Without mise)

Quick Start

Live Activities Example

Home Screen Widgets Example

Deep links and actions

⚠️ Current Limitations (Beta Status)

What Works ✅

Known Limitations ⚠️

Recommended Use

Support & Bug Reporting

How Live Activities Work

Architecture

Key Features

Packages

Documentation

User Guides

Package Management & Publishing

Project Status

Development

Setup

Monorepo Structure

Publishing

Contributing

About

Topics

Resources

License

Contributing

Security policy

Uh oh!

Stars

Watchers

Forks

Releases

Packages 0

Uh oh!

Uh oh!

Contributors

Uh oh!

Languages

Packages