@stacksjs/stx 0.1.16 → 0.2.3

package/dist/craft-bridge.d.ts

@@ -0,0 +1,319 @@
+/**
+ * Generate the Craft bridge script with custom configuration
+ */
+export declare function generateCraftBridgeScript(config?: CraftBridgeConfig): string;
+/**
+ * Check if the current environment supports Craft
+ * This is for server-side detection
+ */
+export declare function isCraftEnvironment(): boolean;
+/**
+ * Craft directive for stx templates
+ * Injects the Craft bridge script when the template is processed
+ *
+ * Usage in template:
+ * @craft
+ * or
+ * @craft({ debug: true })
+ */
+export declare function processCraftDirective(content: string, _context?: Record<string, unknown>): string;
+/**
+ * Auto-inject Craft bridge into head if not already present
+ */
+export declare function injectCraftBridge(html: string, config?: CraftBridgeConfig): string;
+/**
+ * Client-side Craft bridge script
+ * This gets injected into stx templates when running in a Craft webview
+ */
+export declare const CRAFT_BRIDGE_SCRIPT: `
+<script>
+(function() {
+  'use strict';
+
+  // Skip if already initialized or not in Craft environment
+  if (window.__craftBridgeInitialized) return;
+  window.__craftBridgeInitialized = true;
+
+  // Message ID counter
+  let messageId = 0;
+  const generateId = () => 'msg_' + Date.now() + '_' + (++messageId);
+
+  // Pending requests
+  const pending = new Map();
+
+  // Event listeners
+  const eventListeners = new Map();
+
+  // Configuration
+  const config = {
+    debug: false,
+    timeout: 30000
+  };
+
+  // Send message to native
+  function send(message) {
+    const json = JSON.stringify(message);
+
+    if (config.debug) {
+      console.log('[Craft Bridge] Sending:', message.method, message.params);
+    }
+
+    // iOS WKWebView
+    if (window.webkit?.messageHandlers?.craft) {
+      window.webkit.messageHandlers.craft.postMessage(message);
+      return true;
+    }
+
+    // Android WebView
+    if (window.CraftBridge) {
+      window.CraftBridge.postMessage(json);
+      return true;
+    }
+
+    // Electron IPC
+    if (window.craftIPC) {
+      window.craftIPC.send('bridge-message', message);
+      return true;
+    }
+
+    return false;
+  }
+
+  // Make a request and wait for response
+  function request(method, params) {
+    return new Promise((resolve, reject) => {
+      const id = generateId();
+      const timeout = setTimeout(() => {
+        pending.delete(id);
+        reject(new Error('Request timeout: ' + method));
+      }, config.timeout);
+
+      pending.set(id, { resolve, reject, timeout });
+
+      const sent = send({
+        id,
+        type: 'request',
+        method,
+        params
+      });
+
+      if (!sent) {
+        clearTimeout(timeout);
+        pending.delete(id);
+        // Return gracefully if not in Craft environment
+        resolve(undefined);
+      }
+    });
+  }
+
+  // Handle incoming messages
+  function handleMessage(event) {
+    let data;
+    try {
+      data = event.detail || (typeof event.data === 'string' ? JSON.parse(event.data) : event.data);
+    } catch (e) {
+      return;
+    }
+
+    if (!data || !data.id) return;
+
+    if (config.debug) {
+      console.log('[Craft Bridge] Received:', data);
+    }
+
+    if (data.type === 'response') {
+      const req = pending.get(data.id);
+      if (req) {
+        clearTimeout(req.timeout);
+        pending.delete(data.id);
+        if (data.error) {
+          req.reject(new Error(data.error.message));
+        } else {
+          req.resolve(data.result);
+        }
+      }
+    } else if (data.type === 'event' && data.method) {
+      const listeners = eventListeners.get(data.method) || [];
+      listeners.forEach(fn => fn(data.params));
+    }
+  }
+
+  // Listen for messages
+  window.addEventListener('message', handleMessage);
+  window.addEventListener('craft-bridge-message', handleMessage);
+
+  // Check if running in Craft
+  function isCraft() {
+    return !!(
+      window.webkit?.messageHandlers?.craft ||
+      window.CraftBridge ||
+      window.craftIPC
+    );
+  }
+
+  // Subscribe to events
+  function on(event, callback) {
+    if (!eventListeners.has(event)) {
+      eventListeners.set(event, []);
+    }
+    eventListeners.get(event).push(callback);
+    return () => {
+      const listeners = eventListeners.get(event);
+      const idx = listeners.indexOf(callback);
+      if (idx > -1) listeners.splice(idx, 1);
+    };
+  }
+
+  // Build the craft API object
+  window.craft = {
+    // Meta
+    isCraft,
+    on,
+    config,
+
+    // Window API
+    window: {
+      show: () => request('window.show'),
+      hide: () => request('window.hide'),
+      close: () => request('window.close'),
+      minimize: () => request('window.minimize'),
+      maximize: () => request('window.maximize'),
+      restore: () => request('window.restore'),
+      focus: () => request('window.focus'),
+      blur: () => request('window.blur'),
+      setTitle: (title) => request('window.setTitle', { title }),
+      setSize: (width, height) => request('window.setSize', { width, height }),
+      setPosition: (x, y) => request('window.setPosition', { x, y }),
+      setFullscreen: (fullscreen) => request('window.setFullscreen', { fullscreen }),
+      setAlwaysOnTop: (alwaysOnTop) => request('window.setAlwaysOnTop', { alwaysOnTop }),
+      getSize: () => request('window.getSize'),
+      getPosition: () => request('window.getPosition'),
+      isFullscreen: () => request('window.isFullscreen'),
+      isMaximized: () => request('window.isMaximized'),
+      isMinimized: () => request('window.isMinimized'),
+      isVisible: () => request('window.isVisible'),
+      center: () => request('window.center'),
+      toggleFullscreen: () => request('window.toggleFullscreen'),
+      startDrag: () => request('window.startDrag'),
+    },
+
+    // System Tray/Menubar API
+    tray: {
+      setTitle: (title) => request('tray.setTitle', { title }),
+      setTooltip: (tooltip) => request('tray.setTooltip', { tooltip }),
+      setIcon: (icon) => request('tray.setIcon', { icon }),
+      setMenu: (menu) => request('tray.setMenu', { menu }),
+      show: () => request('tray.show'),
+      hide: () => request('tray.hide'),
+      onClick: (callback) => on('tray.click', callback),
+      onDoubleClick: (callback) => on('tray.doubleClick', callback),
+      onRightClick: (callback) => on('tray.rightClick', callback),
+    },
+
+    // App API
+    app: {
+      quit: () => request('app.quit'),
+      hide: () => request('app.hide'),
+      show: () => request('app.show'),
+      focus: () => request('app.focus'),
+      getInfo: () => request('app.getInfo'),
+      getVersion: () => request('app.getVersion'),
+      getName: () => request('app.getName'),
+      getPath: (name) => request('app.getPath', { name }),
+      isDarkMode: () => request('app.isDarkMode'),
+      getLocale: () => request('app.getLocale'),
+      setBadge: (badge) => request('app.setBadge', { badge }),
+      hideDockIcon: () => request('app.hideDockIcon'),
+      showDockIcon: () => request('app.showDockIcon'),
+      notify: (options) => request('app.notify', options),
+      registerShortcut: (accelerator, callback) => {
+        const id = generateId();
+        on('shortcut.' + id, callback);
+        return request('app.registerShortcut', { accelerator, id });
+      },
+      unregisterShortcut: (accelerator) => request('app.unregisterShortcut', { accelerator }),
+    },
+
+    // Dialog API
+    dialog: {
+      openFile: (options) => request('dialog.openFile', options),
+      openFolder: (options) => request('dialog.openFolder', options),
+      saveFile: (options) => request('dialog.saveFile', options),
+      showAlert: (options) => request('dialog.showAlert', options),
+      showConfirm: (options) => request('dialog.showConfirm', options),
+      showPrompt: (options) => request('dialog.showPrompt', options),
+      showColorPicker: (options) => request('dialog.showColorPicker', options),
+    },
+
+    // Clipboard API
+    clipboard: {
+      writeText: (text) => request('clipboard.writeText', { text }),
+      readText: () => request('clipboard.readText'),
+      writeHTML: (html) => request('clipboard.writeHTML', { html }),
+      readHTML: () => request('clipboard.readHTML'),
+      clear: () => request('clipboard.clear'),
+    },
+
+    // File System API (limited for security)
+    fs: {
+      readFile: (path, encoding) => request('fs.readFile', { path, encoding }),
+      writeFile: (path, content, encoding) => request('fs.writeFile', { path, content, encoding }),
+      exists: (path) => request('fs.exists', { path }),
+      stat: (path) => request('fs.stat', { path }),
+      readDir: (path) => request('fs.readDir', { path }),
+      createDir: (path, recursive) => request('fs.createDir', { path, recursive }),
+      remove: (path, recursive) => request('fs.remove', { path, recursive }),
+    },
+
+    // Process/Shell API (limited for security)
+    process: {
+      exec: (command, options) => request('process.exec', { command, ...options }),
+      spawn: (command, args, options) => request('process.spawn', { command, args, ...options }),
+      env: () => request('process.env'),
+      cwd: () => request('process.cwd'),
+      platform: () => request('process.platform'),
+    },
+
+    // Native component helpers
+    components: {
+      createSidebar: (config) => request('component.createSidebar', config),
+      createFileBrowser: (config) => request('component.createFileBrowser', config),
+      createSplitView: (config) => request('component.createSplitView', config),
+      updateComponent: (id, props) => request('component.update', { componentId: id, props }),
+      destroyComponent: (id) => request('component.destroy', { componentId: id }),
+    }
+  };
+
+  // Dispatch ready event
+  window.dispatchEvent(new CustomEvent('craft:ready', { detail: { isCraft: isCraft() } }));
+
+  if (config.debug) {
+    console.log('[Craft Bridge] Initialized, isCraft:', isCraft());
+  }
+})();
+</script>
+`;
+/**
+ * Craft Bridge Integration for stx
+ *
+ * Provides native desktop/mobile APIs when running in a Craft webview.
+ * This module generates client-side JavaScript that can be injected into stx templates
+ * to enable access to Craft's native capabilities.
+ *
+ * @example
+ * ```html
+ * <script>
+ *   // In your stx template
+ *   if (window.craft) {
+ *     await window.craft.tray.setTitle('🎙️ Listening...')
+ *     await window.craft.app.notify({ title: 'Ready', body: 'App is ready' })
+ *   }
+ * </script>
+ * ```
+ */
+export declare interface CraftBridgeConfig {
+  debug?: boolean
+  timeout?: number
+  enableOfflineQueue?: boolean
+}
+export default craftBridge;

package/dist/craft-compiler.d.ts

@@ -0,0 +1,229 @@
+import type { CompiledTemplate } from './craft-ssr';
+/**
+ * Compile stx template to native Craft code
+ */
+export declare function compileToNative(template: string | CompiledTemplate, config?: Partial<CompilerConfig>): Promise<CompiledNativeCode>;
+/**
+ * Create hot reload server
+ */
+export declare function createHotReloadServer(_config: HotReloadConfig): {
+  start: () => Promise<void>
+  stop: () => Promise<void>
+  notifyChange: (path: string) => void
+};
+/**
+ * Compiler configuration
+ */
+export declare interface CompilerConfig {
+  target: CompilationTarget
+  format: CompilationFormat
+  optimize: boolean
+  treeShake: boolean
+  hotReload: boolean
+  debug: boolean
+  sourceMaps: boolean
+  bundle: boolean
+  minify: boolean
+  components?: Map<string, NativeComponentDefinition>
+}
+/**
+ * Native component definition
+ */
+export declare interface NativeComponentDefinition {
+  name: string
+  zigType: string
+  props: NativePropDefinition[]
+  children?: 'single' | 'multiple' | 'none'
+  platform?: CompilationTarget[]
+  fallback?: string
+}
+/**
+ * Property definition for native components
+ */
+export declare interface NativePropDefinition {
+  name: string
+  type: 'string' | 'number' | 'boolean' | 'color' | 'callback' | 'object' | 'array'
+  required: boolean
+  default?: unknown
+  zigType?: string
+}
+/**
+ * Compiled native code output
+ */
+export declare interface CompiledNativeCode {
+  code: string
+  platformCode: Map<CompilationTarget, string>
+  dependencies: CompilerDependencyNode[]
+  manifest: ComponentManifest
+  sourceMaps?: string
+  stats: CompilationStats
+}
+/**
+ * Dependency node in the graph
+ */
+export declare interface CompilerDependencyNode {
+  id: string
+  type: 'component' | 'style' | 'script' | 'asset'
+  path: string
+  dependencies: string[]
+  size: number
+  isStatic: boolean
+}
+/**
+ * Component manifest
+ */
+export declare interface ComponentManifest {
+  version: string
+  components: ManifestComponent[]
+  entry: string
+  assets: ManifestAsset[]
+  styles: string[]
+}
+/**
+ * Component entry in manifest
+ */
+export declare interface ManifestComponent {
+  name: string
+  hash: string
+  props: string[]
+  events: string[]
+  slots: string[]
+  isNative: boolean
+}
+/**
+ * Asset entry in manifest
+ */
+export declare interface ManifestAsset {
+  path: string
+  type: 'image' | 'font' | 'icon' | 'other'
+  hash: string
+  size: number
+}
+/**
+ * Compilation statistics
+ */
+export declare interface CompilationStats {
+  compilationTime: number
+  totalComponents: number
+  nativeComponents: number
+  webComponents: number
+  bundleSize: number
+  treeShakenSize: number
+  warnings: CompilationWarning[]
+  errors: CompilationError[]
+}
+/**
+ * Compilation warning
+ */
+export declare interface CompilationWarning {
+  code: string
+  message: string
+  file?: string
+  line?: number
+  column?: number
+}
+/**
+ * Compilation error
+ */
+export declare interface CompilationError extends CompilationWarning {
+  fatal: boolean
+}
+/**
+ * Native IR (Intermediate Representation) node
+ */
+export declare interface NativeIRNode {
+  type: 'view' | 'text' | 'image' | 'button' | 'input' | 'scroll' | 'list' | 'custom'
+  zigType: string
+  props: Record<string, IRValue>
+  children: NativeIRNode[]
+  events: Map<string, string>
+  styles: IRStyle
+  id?: string
+  key?: string
+}
+/**
+ * IR style definition
+ */
+export declare interface IRStyle {
+  layout: LayoutStyle
+  appearance: AppearanceStyle
+  text?: TextStyle
+}
+/**
+ * Layout style properties
+ */
+export declare interface LayoutStyle {
+  display?: 'flex' | 'grid' | 'block' | 'none'
+  flexDirection?: 'row' | 'column'
+  justifyContent?: 'start' | 'center' | 'end' | 'between' | 'around'
+  alignItems?: 'start' | 'center' | 'end' | 'stretch'
+  gap?: number
+  padding?: number | [number, number, number, number]
+  margin?: number | [number, number, number, number]
+  width?: number | 'auto' | string
+  height?: number | 'auto' | string
+  minWidth?: number
+  maxWidth?: number
+  minHeight?: number
+  maxHeight?: number
+}
+/**
+ * Appearance style properties
+ */
+export declare interface AppearanceStyle {
+  backgroundColor?: string
+  borderColor?: string
+  borderWidth?: number
+  borderRadius?: number
+  opacity?: number
+  shadow?: ShadowStyle
+}
+/**
+ * Shadow style
+ */
+export declare interface ShadowStyle {
+  color: string
+  offsetX: number
+  offsetY: number
+  blur: number
+  spread: number
+}
+/**
+ * Text style properties
+ */
+export declare interface TextStyle {
+  fontFamily?: string
+  fontSize?: number
+  fontWeight?: 'normal' | 'bold' | 'light' | number
+  color?: string
+  textAlign?: 'left' | 'center' | 'right'
+  lineHeight?: number
+  letterSpacing?: number
+}
+/**
+ * Hot reload configuration
+ */
+export declare interface HotReloadConfig {
+  port: number
+  watchPaths: string[]
+  debounceMs: number
+}
+/**
+ * Target platform for compilation
+ */
+export type CompilationTarget = 'macos' | 'windows' | 'linux' | 'ios' | 'android' | 'universal'
+/**
+ * Output format for compiled code
+ */
+export type CompilationFormat = 'zig' | 'typescript' | 'json' | 'binary'
+/**
+ * IR value types
+ */
+export type IRValue = | { type: 'literal'; value: string | number | boolean }
+  | { type: 'binding'; path: string }
+  | { type: 'expression'; code: string }
+  | { type: 'callback'; handler: string }
+export {
+  NATIVE_COMPONENTS,
+};
+export default craftCompiler;