@telemetryos/cli 1.10.0 → 1.11.0

package/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @telemetryos/cli
 
+## 1.11.0
+
+### Minor Changes
+
+- Added media select component, improved tos init tos publish and tos auth commands, add new store hook
+
+### Patch Changes
+
+- Updated dependencies
+  - @telemetryos/development-application-host-ui@1.11.0
+
 ## 1.10.0
 
 ### Minor Changes

package/dist/commands/auth.js

@@ -1,6 +1,6 @@
 import { Command } from 'commander';
 import inquirer from 'inquirer';
-import { loadCliConfig, saveCliConfig } from '../services/cli-config.js';
+import { apiTokenSchema, loadCliConfig, saveCliConfig } from '../services/cli-config.js';
 export const authCommand = new Command('auth')
     .description('Authenticate with TelemetryOS by saving your API token')
     .option('-t, --token <string>', 'API token (skip interactive prompt)')
@@ -12,22 +12,15 @@ function maskToken(token) {
     return `${token.slice(0, 4)}...${token.slice(-4)}`;
 }
 function validateToken(input) {
-    if (!input || input.trim().length === 0) {
-        return 'Token cannot be empty';
-    }
-    const trimmed = input.trim();
-    if (!/^[a-f0-9-]+$/i.test(trimmed)) {
-        return 'Token must be a valid string';
-    }
-    if (trimmed.length < 24) {
-        return 'Token must be at least 24 characters';
-    }
-    return true;
+    const result = apiTokenSchema.safeParse(input.trim());
+    if (result.success)
+        return true;
+    return result.error.issues[0].message;
 }
 async function handleAuthCommand(options) {
     let token = options.token;
     const existingCliConfig = await loadCliConfig();
-    const existingToken = existingCliConfig === null || existingCliConfig === void 0 ? void 0 : existingCliConfig.apiToken;
+    const existingToken = existingCliConfig.apiToken;
     if (existingToken && !options.force) {
         const { confirm } = await inquirer.prompt([
             {

package/dist/commands/init.js

@@ -27,6 +27,7 @@ export const initCommand = new Command('init')
     .option('-a, --author <string>', 'The author of the application', '')
     .option('-v, --version <string>', 'The version of the application', '0.1.0')
     .option('-t, --template <string>', 'The template to use (vite-react-typescript)', '')
+    .option('-y, --yes', 'Skip all prompts and use defaults', false)
     .action(handleInitCommand);
 async function handleInitCommand(projectPathArg, options) {
     // Step 1: Resolve path and derive name
@@ -79,60 +80,74 @@ async function handleInitCommand(projectPathArg, options) {
     let author = options.author;
     let version = options.version;
     let template = options.template;
-    // Step 5: Build prompt questions
-    const questions = [];
-    // Always show the derived name with option to override
-    // This provides transparency and control
-    questions.push({
-        type: 'input',
-        name: 'name',
-        message: 'Project name:',
-        default: derivedName,
-        validate: (input) => {
-            const result = validateProjectName(input);
-            return result === true ? true : result;
-        },
-    });
-    if (!description)
-        questions.push({
-            type: 'input',
-            name: 'description',
-            message: 'What is the description of your application?',
-            default: 'A telemetryOS application',
-        });
-    if (!author)
-        questions.push({
-            type: 'input',
-            name: 'author',
-            message: 'Who is the author of your application?',
-            default: '',
-        });
-    if (!version)
+    // Step 5: Build prompt questions (skipped with --yes)
+    if (options.yes) {
+        if (!name) {
+            console.error('Project name is required when using --yes');
+            process.exit(1);
+        }
+        if (!description)
+            description = 'A telemetryOS application';
+        if (!template)
+            template = 'vite-react-typescript';
+        if (!version)
+            version = '0.1.0';
+    }
+    else {
+        const questions = [];
+        // Always show the derived name with option to override
+        // This provides transparency and control
         questions.push({
             type: 'input',
-            name: 'version',
-            message: 'What is the version of your application?',
-            default: '0.1.0',
+            name: 'name',
+            message: 'Project name:',
+            default: derivedName,
             validate: (input) => {
-                if (/^\d+\.\d+\.\d+(-.+)?$/.test(input))
-                    return true;
-                return 'Version must be in semver format (e.g. 1.0.0)';
+                const result = validateProjectName(input);
+                return result === true ? true : result;
             },
         });
-    if (!template)
-        questions.push({
-            type: 'list',
-            name: 'template',
-            message: 'Which template would you like to use?',
-            choices: [{ name: 'Vite + React + TypeScript', value: 'vite-react-typescript' }],
-        });
-    // Step 6: Prompt user
-    const answers = await inquirer.prompt(questions);
-    name = answers.name || name;
-    version = answers.version || version;
-    description = answers.description || description;
-    author = answers.author || author;
-    template = answers.template || template;
+        if (!description)
+            questions.push({
+                type: 'input',
+                name: 'description',
+                message: 'What is the description of your application?',
+                default: 'A telemetryOS application',
+            });
+        if (!author)
+            questions.push({
+                type: 'input',
+                name: 'author',
+                message: 'Who is the author of your application?',
+                default: '',
+            });
+        if (!version)
+            questions.push({
+                type: 'input',
+                name: 'version',
+                message: 'What is the version of your application?',
+                default: '0.1.0',
+                validate: (input) => {
+                    if (/^\d+\.\d+\.\d+(-.+)?$/.test(input))
+                        return true;
+                    return 'Version must be in semver format (e.g. 1.0.0)';
+                },
+            });
+        if (!template)
+            questions.push({
+                type: 'list',
+                name: 'template',
+                message: 'Which template would you like to use?',
+                choices: [{ name: 'Vite + React + TypeScript', value: 'vite-react-typescript' }],
+            });
+        // Step 6: Prompt user
+        const answers = await inquirer.prompt(questions);
+        name = answers.name || name;
+        version = answers.version || version;
+        description = answers.description || description;
+        author = answers.author || author;
+        template = answers.template || template;
+    }
     // Step 7: Generate application
     await generateApplication({
         name,

package/dist/commands/publish.d.ts

@@ -1,2 +1,22 @@
 import { Command } from 'commander';
 export declare const publishCommand: Command;
+type PublishOptions = {
+    interactive?: boolean;
+    name?: string;
+    baseImage?: string;
+    buildScript?: string;
+    buildOutput?: string;
+    workingPath?: string;
+};
+type PublishCallbacks = {
+    onLog?: (line: string) => void;
+    onStateChange?: (state: string) => void;
+    onComplete?: (data: {
+        success: boolean;
+        buildIndex?: number;
+        duration?: string;
+    }) => void;
+    onError?: (error: Error) => void;
+};
+declare function handlePublishCommand(projectPath: string, options: PublishOptions, callbacks?: PublishCallbacks): Promise<void>;
+export { handlePublishCommand, type PublishCallbacks, type PublishOptions };

package/dist/commands/publish.js

@@ -35,12 +35,14 @@ function getSpecifiedBuildOptions(options) {
         specified.push('--working-path');
     return specified;
 }
-async function handlePublishCommand(projectPath, options) {
-    var _a, _b, _c, _d;
+async function handlePublishCommand(projectPath, options, callbacks) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
     projectPath = path.resolve(process.cwd(), projectPath);
+    const logMessage = (callbacks === null || callbacks === void 0 ? void 0 : callbacks.onLog) || ((msg) => console.log(msg));
     try {
         // Step 1: Load project config
-        console.log(`\n${ansi.cyan}Loading project configuration...${ansi.reset}`);
+        (_a = callbacks === null || callbacks === void 0 ? void 0 : callbacks.onStateChange) === null || _a === void 0 ? void 0 : _a.call(callbacks, 'loading');
+        logMessage(`\n${ansi.cyan}Loading project configuration...${ansi.reset}`);
         const config = await loadProjectConfig(projectPath);
         // Step 2: Resolve build configuration
         let buildConfig = {
@@ -67,93 +69,121 @@ async function handlePublishCommand(projectPath, options) {
             buildConfig.name = answers.name.trim();
         }
         if (!buildConfig.name) {
-            console.error(`${ansi.red}Error: Application name is required${ansi.reset}`);
-            process.exit(1);
+            const error = new Error('Application name is required');
+            logMessage(`${ansi.red}Error: Application name is required${ansi.reset}`);
+            (_b = callbacks === null || callbacks === void 0 ? void 0 : callbacks.onError) === null || _b === void 0 ? void 0 : _b.call(callbacks, error);
+            if (!callbacks)
+                process.exit(1);
+            return;
         }
-        console.log(`  Project: ${ansi.bold}${buildConfig.name}${ansi.reset}`);
+        logMessage(`  Project: ${ansi.bold}${buildConfig.name}${ansi.reset}`);
         if (config.version) {
-            console.log(`  Version: ${config.version}`);
+            logMessage(`  Version: ${config.version}`);
         }
         // Step 3: Initialize API client
-        console.log(`\n${ansi.cyan}Authenticating...${ansi.reset}`);
+        (_c = callbacks === null || callbacks === void 0 ? void 0 : callbacks.onStateChange) === null || _c === void 0 ? void 0 : _c.call(callbacks, 'authenticating');
+        logMessage(`\n${ansi.cyan}Authenticating...${ansi.reset}`);
         const apiClient = await ApiClient.create();
-        console.log(`  ${ansi.green}Authenticated${ansi.reset}`);
+        logMessage(`  ${ansi.green}Authenticated${ansi.reset}`);
         // Step 4: Create archive
-        console.log(`\n${ansi.cyan}Archiving project...${ansi.reset}`);
+        (_d = callbacks === null || callbacks === void 0 ? void 0 : callbacks.onStateChange) === null || _d === void 0 ? void 0 : _d.call(callbacks, 'archiving');
+        logMessage(`\n${ansi.cyan}Archiving project...${ansi.reset}`);
         const { buffer, filename } = await createArchive(projectPath, (msg) => {
-            console.log(`  ${ansi.dim}${msg}${ansi.reset}`);
+            logMessage(`  ${ansi.dim}${msg}${ansi.reset}`);
         });
         // Step 5: Find or create application
-        console.log(`\n${ansi.cyan}Checking for existing application...${ansi.reset}`);
+        logMessage(`\n${ansi.cyan}Checking for existing application...${ansi.reset}`);
         const appsRes = await apiClient.get('/application');
         const apps = (await appsRes.json());
         let app = apps.find((a) => a.title === buildConfig.name) || null;
         if (app) {
-            console.log(`  Found existing application: ${ansi.dim}${app.id}${ansi.reset}`);
+            logMessage(`  Found existing application: ${ansi.dim}${app.id}${ansi.reset}`);
             const specifiedOptions = getSpecifiedBuildOptions(options);
             if (specifiedOptions.length > 0) {
-                console.log(`  ${ansi.yellow}Warning: ${specifiedOptions.join(', ')} ignored for existing application${ansi.reset}`);
+                logMessage(`  ${ansi.yellow}Warning: ${specifiedOptions.join(', ')} ignored for existing application${ansi.reset}`);
             }
         }
         else {
-            console.log(`  Creating new application...`);
+            logMessage(`  Creating new application...`);
             const createRequest = {
                 kind: 'uploaded',
                 title: buildConfig.name,
-                baseImage: (_a = buildConfig.baseImage) !== null && _a !== void 0 ? _a : APP_BUILD_DEFAULTS.baseImage,
+                baseImage: (_e = buildConfig.baseImage) !== null && _e !== void 0 ? _e : APP_BUILD_DEFAULTS.baseImage,
                 baseImageRegistryAuth: '',
-                buildWorkingPath: (_b = buildConfig.workingPath) !== null && _b !== void 0 ? _b : APP_BUILD_DEFAULTS.workingPath,
-                buildScript: (_c = buildConfig.buildScript) !== null && _c !== void 0 ? _c : APP_BUILD_DEFAULTS.buildScript,
-                buildOutputPath: (_d = buildConfig.buildOutput) !== null && _d !== void 0 ? _d : APP_BUILD_DEFAULTS.buildOutput,
+                buildWorkingPath: (_f = buildConfig.workingPath) !== null && _f !== void 0 ? _f : APP_BUILD_DEFAULTS.workingPath,
+                buildScript: (_g = buildConfig.buildScript) !== null && _g !== void 0 ? _g : APP_BUILD_DEFAULTS.buildScript,
+                buildOutputPath: (_h = buildConfig.buildOutput) !== null && _h !== void 0 ? _h : APP_BUILD_DEFAULTS.buildOutput,
             };
             const createRes = await apiClient.post('/application', { body: createRequest });
             app = (await createRes.json());
-            console.log(`  ${ansi.green}Created application:${ansi.reset} ${ansi.dim}${app.id}${ansi.reset}`);
+            logMessage(`  ${ansi.green}Created application:${ansi.reset} ${ansi.dim}${app.id}${ansi.reset}`);
         }
         // Step 6: Upload archive
-        console.log(`\n${ansi.cyan}Uploading archive...${ansi.reset}`);
+        (_j = callbacks === null || callbacks === void 0 ? void 0 : callbacks.onStateChange) === null || _j === void 0 ? void 0 : _j.call(callbacks, 'uploading');
+        logMessage(`\n${ansi.cyan}Uploading archive...${ansi.reset}`);
         const formData = new FormData();
         const arrayBuffer = buffer.buffer.slice(buffer.byteOffset, buffer.byteOffset + buffer.byteLength);
         const blob = new Blob([arrayBuffer], { type: 'application/gzip' });
         formData.append('file', blob, filename);
         await apiClient.post(`/application/${app.id}/archive`, { body: formData });
-        console.log(`  ${ansi.green}Upload complete${ansi.reset}`);
+        logMessage(`  ${ansi.green}Upload complete${ansi.reset}`);
         // Step 7: Poll for build status and stream logs
-        console.log(`\n${ansi.cyan}Building...${ansi.reset}`);
-        console.log(`${ansi.white}Build Logs${ansi.reset}`);
+        (_k = callbacks === null || callbacks === void 0 ? void 0 : callbacks.onStateChange) === null || _k === void 0 ? void 0 : _k.call(callbacks, 'building');
+        logMessage(`\n${ansi.cyan}Building...${ansi.reset}`);
+        logMessage(`${ansi.white}Build Logs${ansi.reset}`);
         const build = await pollBuild(apiClient, app.id, {
             onLog: (line) => {
-                console.log(`  ${ansi.dim}${line}${ansi.reset}`);
+                logMessage(`  ${ansi.dim}${line}${ansi.reset}`);
             },
             onStateChange: () => { },
             onComplete: () => { },
             onError: (error) => {
-                console.error(`${ansi.red}Polling error: ${error.message}${ansi.reset}`);
+                var _a;
+                logMessage(`${ansi.red}Polling error: ${error.message}${ansi.reset}`);
+                (_a = callbacks === null || callbacks === void 0 ? void 0 : callbacks.onError) === null || _a === void 0 ? void 0 : _a.call(callbacks, error);
             },
         });
         // Step 8: Report result
         if (build.state === 'success') {
-            console.log(`\n${ansi.green}${ansi.bold}Build successful!${ansi.reset}`);
-            console.log(`\n  Application: ${buildConfig.name}`);
-            console.log(`  Build: #${build.index}`);
+            (_l = callbacks === null || callbacks === void 0 ? void 0 : callbacks.onStateChange) === null || _l === void 0 ? void 0 : _l.call(callbacks, 'success');
+            logMessage(`\n${ansi.green}${ansi.bold}Build successful!${ansi.reset}`);
+            logMessage(`\n  Application: ${buildConfig.name}`);
+            logMessage(`  Build: #${build.index}`);
+            let duration = '';
             if (build.finishedAt && build.startedAt) {
-                const duration = calculateDuration(build.startedAt, build.finishedAt);
-                console.log(`  Duration: ${duration}`);
+                duration = calculateDuration(build.startedAt, build.finishedAt);
+                logMessage(`  Duration: ${duration}`);
             }
-            console.log('');
+            logMessage('');
+            (_m = callbacks === null || callbacks === void 0 ? void 0 : callbacks.onComplete) === null || _m === void 0 ? void 0 : _m.call(callbacks, {
+                success: true,
+                buildIndex: build.index,
+                duration,
+            });
         }
         else {
-            console.log(`\n${ansi.red}${ansi.bold}Build failed${ansi.reset}`);
-            console.log(`\n  State: ${build.state}`);
-            console.log('');
-            process.exit(1);
+            (_o = callbacks === null || callbacks === void 0 ? void 0 : callbacks.onStateChange) === null || _o === void 0 ? void 0 : _o.call(callbacks, 'failure');
+            logMessage(`\n${ansi.red}${ansi.bold}Build failed${ansi.reset}`);
+            logMessage(`\n  State: ${build.state}`);
+            logMessage('');
+            const error = new Error(`Build failed with state: ${build.state}`);
+            (_p = callbacks === null || callbacks === void 0 ? void 0 : callbacks.onError) === null || _p === void 0 ? void 0 : _p.call(callbacks, error);
+            if (!callbacks) {
+                process.exit(1);
+            }
         }
     }
     catch (error) {
-        console.error(`\n${ansi.red}Error: ${error.message}${ansi.reset}\n`);
-        process.exit(1);
+        const err = error;
+        logMessage(`\n${ansi.red}Error: ${err.message}${ansi.reset}\n`);
+        (_q = callbacks === null || callbacks === void 0 ? void 0 : callbacks.onError) === null || _q === void 0 ? void 0 : _q.call(callbacks, err);
+        if (!callbacks) {
+            process.exit(1);
+        }
     }
 }
+// Export for use by server
+export { handlePublishCommand };
 async function promptBuildConfig(defaults) {
     var _a, _b, _c, _d;
     const answers = await inquirer.prompt([

package/dist/services/api-client.js

@@ -7,7 +7,7 @@ export class ApiClient {
     }
     static async create() {
         const config = await loadCliConfig();
-        if (!(config === null || config === void 0 ? void 0 : config.apiToken)) {
+        if (!config.apiToken) {
             throw new Error('Not authenticated. Run `tos auth` first.');
         }
         const baseUrl = process.env.TOS_API_URL || config.apiUrl || DEFAULT_API_URL;

package/dist/services/cli-config.d.ts

@@ -1,6 +1,10 @@
-export type CliConfig = {
-    apiToken?: string;
-    apiUrl?: string;
-};
-export declare function loadCliConfig(): Promise<CliConfig | null>;
+import z from 'zod';
+export declare const apiTokenSchema: z.ZodString;
+declare const cliConfigSchema: z.ZodObject<{
+    apiToken: z.ZodOptional<z.ZodString>;
+    apiUrl: z.ZodOptional<z.ZodURL>;
+}, z.z.core.$strip>;
+export type CliConfig = z.infer<typeof cliConfigSchema>;
+export declare function loadCliConfig(): Promise<CliConfig>;
 export declare function saveCliConfig(config: CliConfig): Promise<void>;
+export {};

package/dist/services/cli-config.js

@@ -1,23 +1,45 @@
 import { mkdir, readFile, writeFile } from 'fs/promises';
 import { homedir } from 'os';
 import path from 'path';
+import z from 'zod';
 function getCliConfigDir() {
     const xdgConfig = process.env.XDG_CONFIG_HOME || path.join(homedir(), '.config');
-    return path.join(xdgConfig, 'telemetryos-cli');
+    return path.join(xdgConfig, 'telemetryos', 'cli');
 }
 function getCliConfigPath() {
     return path.join(getCliConfigDir(), 'config.json');
 }
+export const apiTokenSchema = z
+    .string()
+    .regex(/^u[a-f0-9]{32}$/i, 'Token must start with "u" followed by 32 hex characters');
+const cliConfigSchema = z.object({
+    apiToken: z.string().optional(),
+    apiUrl: z.url().optional(),
+});
 export async function loadCliConfig() {
     try {
-        const content = await readFile(getCliConfigPath(), 'utf-8');
-        return JSON.parse(content);
+        const configPath = getCliConfigPath();
+        const content = await readFile(configPath, 'utf-8');
+        const parsed = JSON.parse(content);
+        return cliConfigSchema.parse(parsed);
     }
-    catch {
-        return null;
+    catch (error) {
+        if (error.code === 'ENOENT') {
+            return cliConfigSchema.parse({});
+        }
+        const configPath = getCliConfigPath();
+        if (error instanceof SyntaxError) {
+            throw new Error(`Invalid JSON in CLI config file (${configPath}):\n  ${error.message}`);
+        }
+        if (error instanceof z.ZodError) {
+            const issues = error.issues.map((i) => `  ${i.path.join('.')}: ${i.message}`).join('\n');
+            throw new Error(`Invalid CLI config file (${configPath}):\n${issues}`);
+        }
+        throw error;
     }
 }
 export async function saveCliConfig(config) {
+    const validated = cliConfigSchema.parse(config);
     await mkdir(getCliConfigDir(), { recursive: true });
-    await writeFile(getCliConfigPath(), JSON.stringify(config, null, 2));
+    await writeFile(getCliConfigPath(), JSON.stringify(validated, null, 2));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@telemetryos/cli",
-  "version": "1.10.0",
+  "version": "1.11.0",
   "description": "The official TelemetryOS application CLI package. Use it to build applications that run on the TelemetryOS platform",
   "type": "module",
   "bin": {
@@ -25,7 +25,7 @@
   "license": "",
   "repository": "github:TelemetryTV/Application-API",
   "dependencies": {
-    "@telemetryos/development-application-host-ui": "^1.10.0",
+    "@telemetryos/development-application-host-ui": "^1.11.0",
     "@types/serve-handler": "^6.1.4",
     "commander": "^14.0.0",
     "ignore": "^6.0.2",

package/templates/vite-react-typescript/CLAUDE.md

@@ -15,7 +15,9 @@ tos serve          # Start dev server (or: npm run dev)
 **Development Host:** http://localhost:2026
 Both the render and settings mounts points are visible in the development host.
 The Render mount point is presented in a resizable pane.
-The Settings mount point shows in the settings tab of the right sidebar.
+The Settings mount point shows in the right sidebar.
+
+**The development host is already running!** The user has already started it and the agent doesn't need to run it
 
 ## Architecture
 
@@ -100,12 +102,17 @@ const response = await proxy().fetch('https://api.example.com/data')
 
 **IMPORTANT:** You MUST invoke the relevant skill BEFORE writing code for these tasks:
 
+**For Render views:** ALWAYS read `tos-render-ui-design` first, then the appropriate specialized skill.
+
 | Task | Required Skill | Why |
 |------|----------------|-----|
 | Starting new project | `tos-requirements` | Gather requirements before coding MUST USE |
-| Building Render views | `tos-render-design` | Digital signage constraints, UI scaling, no hover/scroll |
+| Building ANY Render view | `tos-render-ui-design` | UI scaling foundation - ALWAYS read first |
+| Building digital signage | `tos-render-signage-design` | Display-only patterns (no interaction) |
+| Building interactive kiosk | `tos-render-kiosk-design` | Touch interaction, idle timeout, navigation |
 | Adding ANY Settings UI | `tos-settings-ui` | SDK components are required - raw HTML won't work |
 | Adding store keys | `tos-store-sync` | Hook patterns ensure Settings↔Render sync |
+| Building multi-mode apps | `tos-multi-mode` | Entity-scoped data, mode switching, namespace patterns |
 | Calling external APIs | `tos-proxy-fetch` | Proxy patterns prevent CORS errors |
 | Media library access | `tos-media-api` | SDK media methods and types |
 | Weather integration | `tos-weather-api` | API-specific patterns and credentials |

package/templates/vite-react-typescript/_claude/skills/tos-architecture/SKILL.md

@@ -232,15 +232,11 @@ export function App() {
 
 ### Local Development
 
-```bash
-# Start dev server
-tos serve
-# Or: npm run dev
+**Development Host:** http://localhost:2026
+Both the render and settings mounts points are visible in the development host.
+The Render mount point is presented in a resizable pane.
+The Settings mount point shows in the right sidebar.
 
-# Access locally:
-# Settings: http://localhost:3000/settings
-# Render:   http://localhost:3000/render
-```
 
 ### Build & Deploy
 
@@ -255,26 +251,6 @@ git add . && git commit -m "Update" && git push
 
 ## Common Patterns
 
-### Check Mount Point
-
-```typescript
-const isSettings = window.location.pathname === '/settings'
-const isRender = window.location.pathname === '/render'
-```
-
-### Conditional Features
-
-```typescript
-// In a shared component
-const isRender = window.location.pathname === '/render'
-
-// Only fetch external data in Render
-useEffect(() => {
-  if (!isRender) return
-  fetchExternalData()
-}, [isRender])
-```
-
 ### Handle Missing Config
 
 ```typescript