Bundled Apps
12 apps ship with zOS by default. All apps are v4.2.0.
🧮
Calculator
Standard and scientific modes with keyboard support.
utilities
⬛
Terminal
Command-line interface with zsh-like shell.
developer
📝
Notes
Elegant note-taking with rich text support.
productivity
📄
TextPad
Simple text editor for quick edits.
productivity
🕐
Clock
World clock with multiple timezones.
utilities
📅
Calendar
Beautiful calendar with event support.
productivity
🌤️
Weather
Real-time weather forecasts.
utilities
🖼️
Photos
Photo viewer and gallery.
entertainment
🎵
Music
Music player with playlist support.
entertainment
📌
Stickies
Desktop sticky notes.
productivity
⚙️
System Preferences
Customize your zOS experience.
system
🏪
App Store
Discover and install apps from GitHub.
systemApp Registry
The App Registry manages installed apps and handles installation from GitHub.
Using the Registry
import { getAppRegistry, BUNDLED_APPS } from '@z-os/apps';
// Get the singleton registry instance
const registry = getAppRegistry();
// List all installed apps
const installed = registry.getInstalledApps();
// Install an app from GitHub
await registry.install({
id: 'ai.hanzo.newapp',
name: 'New App',
version: '1.0.0',
// ... other manifest fields
});
// Check for updates
const updates = await registry.checkForUpdates();
// Update an app
await registry.update('ai.hanzo.newapp', '1.1.0');
// Uninstall an app
registry.uninstall('ai.hanzo.newapp');
App Manifest Interface
interface AppManifest {
id: string; // e.g., "ai.hanzo.calculator"
name: string; // Display name
version: string; // Semantic version
description: string; // Short description
icon: string; // Emoji or URL
category: 'productivity' | 'utilities' | 'entertainment' | 'developer' | 'system';
author: string;
repository: string; // GitHub repo URL
minSdkVersion: string;
permissions: string[];
screenshots?: string[];
releaseNotes?: string;
}
Listening to Events
// Listen for app installation
window.addEventListener('zos:app-installed', (e: CustomEvent) => {
console.log('App installed:', e.detail.app);
});
// Listen for app updates
window.addEventListener('zos:app-updated', (e: CustomEvent) => {
console.log('App updated:', e.detail.app);
});
// Listen for app removal
window.addEventListener('zos:app-uninstalled', (e: CustomEvent) => {
console.log('App removed:', e.detail.appId);
});
Building Your Own App
Quick Start
import React, { useState } from 'react';
// 1. Define your manifest
export const manifest = {
id: 'com.yourname.myapp',
name: 'My App',
version: '1.0.0',
description: 'A custom zOS app',
icon: '🚀',
category: 'utilities' as const,
author: 'Your Name',
repository: 'https://github.com/yourusername/myapp',
minSdkVersion: '4.0.0',
permissions: ['storage']
};
// 2. Create your component
interface MyAppProps {
onClose?: () => void;
}
export function MyApp({ onClose }: MyAppProps) {
const [data, setData] = useState('');
return (
<div className="h-full bg-gray-900 text-white p-4">
<h1 className="text-2xl font-bold mb-4">My App</h1>
<input
value={data}
onChange={e => setData(e.target.value)}
className="w-full bg-gray-800 rounded px-3 py-2"
placeholder="Enter something..."
/>
</div>
);
}
export default MyApp;