@flightdev/ui 2.0.0

package/dist/chunk-XTDK7ME5.js

@@ -0,0 +1,382 @@
+// src/core/types.ts
+var DEFAULT_CAPABILITIES = {
+  streaming: false,
+  partialHydration: false,
+  islands: false,
+  resumable: false,
+  ssg: true,
+  csr: true,
+  serverComponents: false
+};
+var TIER_INFO = {
+  "tier-1": {
+    tier: "tier-1",
+    name: "Full Support",
+    description: "Complete SSR, streaming, hydration, and advanced features",
+    features: ["SSR", "Streaming", "Hydration", "Islands", "DevTools"]
+  },
+  "tier-2": {
+    tier: "tier-2",
+    name: "Standard Support",
+    description: "SSR and hydration with framework-specific optimizations",
+    features: ["SSR", "Hydration", "Partial Islands"]
+  },
+  "tier-3": {
+    tier: "tier-3",
+    name: "HTML-First",
+    description: "Server-rendered HTML with minimal JavaScript enhancement",
+    features: ["SSR", "Progressive Enhancement"]
+  }
+};
+
+// src/core/registry.ts
+var AdapterRegistry = class {
+  metadata = /* @__PURE__ */ new Map();
+  instances = /* @__PURE__ */ new Map();
+  loading = /* @__PURE__ */ new Map();
+  /**
+   * Register an adapter with the registry.
+   */
+  register(metadata) {
+    if (this.metadata.has(metadata.id)) {
+      console.warn(`[AdapterRegistry] Overwriting existing adapter: ${metadata.id}`);
+    }
+    this.metadata.set(metadata.id, metadata);
+  }
+  /**
+   * Register multiple adapters at once.
+   */
+  registerAll(adapters) {
+    for (const adapter of adapters) {
+      this.register(adapter);
+    }
+  }
+  /**
+   * Unregister an adapter.
+   */
+  unregister(id) {
+    this.instances.delete(id);
+    this.loading.delete(id);
+    return this.metadata.delete(id);
+  }
+  /**
+   * Check if an adapter is registered.
+   */
+  has(id) {
+    return this.metadata.has(id);
+  }
+  /**
+   * Get an adapter by ID (lazy loads if not already loaded).
+   */
+  async get(id) {
+    const existing = this.instances.get(id);
+    if (existing) {
+      return existing;
+    }
+    const loadingPromise = this.loading.get(id);
+    if (loadingPromise) {
+      return loadingPromise;
+    }
+    const meta = this.metadata.get(id);
+    if (!meta) {
+      return void 0;
+    }
+    const promise = this.loadAdapter(meta);
+    this.loading.set(id, promise);
+    try {
+      const adapter = await promise;
+      this.instances.set(id, adapter);
+      this.loading.delete(id);
+      return adapter;
+    } catch (error) {
+      this.loading.delete(id);
+      throw error;
+    }
+  }
+  /**
+   * Get an adapter synchronously (only if already loaded).
+   */
+  getSync(id) {
+    return this.instances.get(id);
+  }
+  /**
+   * Get adapter metadata without loading.
+   */
+  getMetadata(id) {
+    return this.metadata.get(id);
+  }
+  /**
+   * List all registered adapter IDs.
+   */
+  list() {
+    return Array.from(this.metadata.keys());
+  }
+  /**
+   * List adapters matching query options.
+   */
+  query(options) {
+    const results = [];
+    for (const meta of this.metadata.values()) {
+      if (options.tier && meta.tier !== options.tier) {
+        continue;
+      }
+      if (options.capability && !meta.capabilities?.[options.capability]) {
+        continue;
+      }
+      if (options.framework) {
+        if (typeof options.framework === "string") {
+          if (!meta.framework.includes(options.framework)) {
+            continue;
+          }
+        } else if (!options.framework.test(meta.framework)) {
+          continue;
+        }
+      }
+      results.push(meta);
+    }
+    return results;
+  }
+  /**
+   * List adapters by tier.
+   */
+  listByTier(tier) {
+    return this.query({ tier }).map((m) => m.id);
+  }
+  /**
+   * List adapters by capability.
+   */
+  listByCapability(capability) {
+    return this.query({ capability }).map((m) => m.id);
+  }
+  /**
+   * Preload adapters for faster access later.
+   */
+  async preload(ids) {
+    await Promise.all(ids.map((id) => this.get(id)));
+  }
+  /**
+   * Get all loaded adapters.
+   */
+  getLoaded() {
+    return new Map(this.instances);
+  }
+  /**
+   * Clear all cached adapter instances (but keep registrations).
+   */
+  clearCache() {
+    this.instances.clear();
+    this.loading.clear();
+  }
+  /**
+   * Clear everything (registrations and cache).
+   */
+  clear() {
+    this.metadata.clear();
+    this.instances.clear();
+    this.loading.clear();
+  }
+  /**
+   * Get registry statistics.
+   */
+  stats() {
+    const byTier = {
+      "tier-1": 0,
+      "tier-2": 0,
+      "tier-3": 0
+    };
+    for (const meta of this.metadata.values()) {
+      byTier[meta.tier]++;
+    }
+    return {
+      registered: this.metadata.size,
+      loaded: this.instances.size,
+      loading: this.loading.size,
+      byTier
+    };
+  }
+  /**
+   * Load an adapter from metadata.
+   */
+  async loadAdapter(meta) {
+    try {
+      const adapter = await meta.loader();
+      if (adapter.init) {
+        await adapter.init();
+      }
+      return adapter;
+    } catch (error) {
+      const message = error instanceof Error ? error.message : String(error);
+      throw new Error(
+        `[AdapterRegistry] Failed to load adapter '${meta.id}': ${message}
+Required peer dependencies: ${meta.peerDependencies?.join(", ") ?? "none"}`
+      );
+    }
+  }
+};
+var adapterRegistry = new AdapterRegistry();
+function registerBuiltinAdapters() {
+  adapterRegistry.register({
+    id: "react",
+    name: "React",
+    framework: "react",
+    tier: "tier-1",
+    capabilities: { streaming: true, partialHydration: true, serverComponents: true },
+    peerDependencies: ["react", "react-dom"],
+    loader: () => import('./adapters/tier-1/react.js').then((m) => m.default())
+  });
+  adapterRegistry.register({
+    id: "vue",
+    name: "Vue",
+    framework: "vue",
+    tier: "tier-1",
+    capabilities: { streaming: true, partialHydration: true },
+    peerDependencies: ["vue"],
+    loader: () => import('./adapters/tier-1/vue.js').then((m) => m.default())
+  });
+  adapterRegistry.register({
+    id: "svelte",
+    name: "Svelte",
+    framework: "svelte",
+    tier: "tier-1",
+    capabilities: { streaming: false, partialHydration: true },
+    peerDependencies: ["svelte"],
+    loader: () => import('./adapters/tier-1/svelte.js').then((m) => m.default())
+  });
+  adapterRegistry.register({
+    id: "solid",
+    name: "Solid",
+    framework: "solid",
+    tier: "tier-1",
+    capabilities: { streaming: true, partialHydration: true },
+    peerDependencies: ["solid-js"],
+    loader: () => import('./adapters/tier-1/solid.js').then((m) => m.default())
+  });
+  adapterRegistry.register({
+    id: "angular",
+    name: "Angular",
+    framework: "angular",
+    tier: "tier-1",
+    capabilities: { streaming: true, partialHydration: true },
+    peerDependencies: ["@angular/core", "@angular/platform-server", "@angular/platform-browser"],
+    loader: () => import('./adapters/tier-1/angular.js').then((m) => m.default())
+  });
+  adapterRegistry.register({
+    id: "qwik",
+    name: "Qwik",
+    framework: "qwik",
+    tier: "tier-1",
+    capabilities: { streaming: true, resumable: true, partialHydration: true },
+    peerDependencies: ["@builder.io/qwik"],
+    loader: () => import('./adapters/tier-1/qwik.js').then((m) => m.default())
+  });
+  adapterRegistry.register({
+    id: "preact",
+    name: "Preact",
+    framework: "preact",
+    tier: "tier-2",
+    capabilities: { streaming: false, partialHydration: true },
+    peerDependencies: ["preact"],
+    loader: () => import('./adapters/tier-2/preact.js').then((m) => m.default())
+  });
+  adapterRegistry.register({
+    id: "lit",
+    name: "Lit",
+    framework: "lit",
+    tier: "tier-2",
+    capabilities: { islands: true },
+    peerDependencies: ["lit"],
+    loader: () => import('./adapters/tier-2/lit.js').then((m) => m.default())
+  });
+  adapterRegistry.register({
+    id: "marko",
+    name: "Marko",
+    framework: "marko",
+    tier: "tier-2",
+    capabilities: { streaming: true, partialHydration: true, islands: true },
+    peerDependencies: ["marko"],
+    loader: () => import('./adapters/tier-2/marko.js').then((m) => m.default())
+  });
+  adapterRegistry.register({
+    id: "stencil",
+    name: "Stencil",
+    framework: "stencil",
+    tier: "tier-2",
+    capabilities: { islands: true },
+    peerDependencies: ["@stencil/core"],
+    loader: () => import('./adapters/tier-2/stencil.js').then((m) => m.default())
+  });
+  adapterRegistry.register({
+    id: "mithril",
+    name: "Mithril",
+    framework: "mithril",
+    tier: "tier-2",
+    capabilities: {},
+    peerDependencies: ["mithril"],
+    loader: () => import('./adapters/tier-2/mithril.js').then((m) => m.default())
+  });
+  adapterRegistry.register({
+    id: "inferno",
+    name: "Inferno",
+    framework: "inferno",
+    tier: "tier-2",
+    capabilities: { streaming: false },
+    peerDependencies: ["inferno"],
+    loader: () => import('./adapters/tier-2/inferno.js').then((m) => m.default())
+  });
+  adapterRegistry.register({
+    id: "htmx",
+    name: "HTMX",
+    framework: "htmx",
+    tier: "tier-3",
+    capabilities: {},
+    peerDependencies: [],
+    loader: () => import('./adapters/tier-3/htmx.js').then((m) => m.default())
+  });
+  adapterRegistry.register({
+    id: "alpine",
+    name: "Alpine.js",
+    framework: "alpine",
+    tier: "tier-3",
+    capabilities: {},
+    peerDependencies: [],
+    loader: () => import('./adapters/tier-3/alpine.js').then((m) => m.default())
+  });
+  adapterRegistry.register({
+    id: "hotwire",
+    name: "Hotwire",
+    framework: "hotwire",
+    tier: "tier-3",
+    capabilities: {},
+    peerDependencies: ["@hotwired/turbo"],
+    loader: () => import('./adapters/tier-3/hotwire.js').then((m) => m.default())
+  });
+  adapterRegistry.register({
+    id: "stimulus",
+    name: "Stimulus",
+    framework: "stimulus",
+    tier: "tier-3",
+    capabilities: {},
+    peerDependencies: ["@hotwired/stimulus"],
+    loader: () => import('./adapters/tier-3/stimulus.js').then((m) => m.default())
+  });
+  adapterRegistry.register({
+    id: "petite-vue",
+    name: "Petite-vue",
+    framework: "petite-vue",
+    tier: "tier-3",
+    capabilities: {},
+    peerDependencies: ["petite-vue"],
+    loader: () => import('./adapters/tier-3/petite-vue.js').then((m) => m.default())
+  });
+  adapterRegistry.register({
+    id: "vanilla",
+    name: "Vanilla Web Components",
+    framework: "vanilla",
+    tier: "tier-3",
+    capabilities: { islands: true },
+    peerDependencies: [],
+    loader: () => import('./adapters/tier-3/vanilla.js').then((m) => m.default())
+  });
+}
+
+export { DEFAULT_CAPABILITIES, TIER_INFO, adapterRegistry, registerBuiltinAdapters };

package/dist/chunk-YFGSHW5S.js

@@ -0,0 +1,121 @@
+import { BaseUIAdapter } from './chunk-2SNQ6PTM.js';
+
+// src/adapters/tier-2/lit.ts
+var LitAdapter = class extends BaseUIAdapter {
+  constructor(options = {}) {
+    super();
+    this.options = options;
+  }
+  id = "lit";
+  name = "Lit";
+  framework = "lit";
+  frameworkVersion = "3+";
+  tier = "tier-2";
+  capabilities = {
+    streaming: false,
+    partialHydration: true,
+    islands: true,
+    resumable: false,
+    ssg: true,
+    csr: true,
+    serverComponents: false
+  };
+  async renderToString(component, _context) {
+    const startTime = performance.now();
+    try {
+      const { render } = await import('@lit-labs/ssr');
+      const { html } = await import('lit');
+      const { collectResult } = await import('@lit-labs/ssr/lib/render-result.js');
+      let template;
+      if (typeof component.component === "string") {
+        const tagName = component.component;
+        const props = component.props ?? {};
+        const attrs = Object.entries(props).map(([key, value]) => {
+          const attrName = key.replace(/([A-Z])/g, "-$1").toLowerCase();
+          return `${attrName}="${this.escapeHtml(String(value))}"`;
+        }).join(" ");
+        template = html`<${tagName} ${attrs}></${tagName}>`;
+      } else if (typeof component.component === "function") {
+        template = component.component(component.props ?? {});
+      } else {
+        template = component.component;
+      }
+      const ssrResult = render(template);
+      const htmlString = await collectResult(ssrResult);
+      return {
+        html: htmlString,
+        hydrationData: {
+          props: component.props,
+          componentId: component.id ?? this.generateId()
+        },
+        timing: this.createTiming(startTime)
+      };
+    } catch (error) {
+      const message = error instanceof Error ? error.message : String(error);
+      if (message.includes("Cannot find module '@lit-labs/ssr'")) {
+        throw new Error(
+          "[Flight/Lit] Lit SSR package not found.\nInstall required packages:\n  npm install lit @lit-labs/ssr"
+        );
+      }
+      throw error;
+    }
+  }
+  createIsland(component, props, options) {
+    const tagName = component;
+    const id = this.generateId();
+    const deferHydration = this.options.deferHydration ?? false;
+    const attrs = Object.entries(props ?? {}).map(([key, value]) => {
+      const attrName = key.replace(/([A-Z])/g, "-$1").toLowerCase();
+      return `${attrName}="${this.escapeHtml(String(value))}"`;
+    }).join(" ");
+    const placeholder = `
+<${tagName} 
+    ${attrs}
+    data-flight-island="${id}"
+    ${deferHydration ? "defer-hydration" : ""}
+></${tagName}>
+        `.trim();
+    return {
+      id,
+      component,
+      props,
+      options: options ?? { hydrate: "load" },
+      placeholder
+    };
+  }
+  getHydrationScript(result) {
+    const data = this.serializeProps(result.hydrationData);
+    return `
+<script type="module">
+window.__FLIGHT_DATA__ = ${data};
+window.__FLIGHT_ADAPTER__ = 'lit';
+
+// Lit components hydrate when their definition is loaded
+// If using defer-hydration, call removeAttribute('defer-hydration')
+document.querySelectorAll('[defer-hydration]').forEach(el => {
+    el.removeAttribute('defer-hydration');
+});
+</script>
+        `.trim();
+  }
+  getClientEntry() {
+    return `
+// Lit Client Entry
+// Lit components self-hydrate when their definitions are loaded
+
+export function hydrate() {
+    // Remove defer-hydration attributes to trigger hydration
+    document.querySelectorAll('[defer-hydration]').forEach(el => {
+        el.removeAttribute('defer-hydration');
+    });
+    console.log('[Flight/Lit] Components hydrated');
+}
+        `.trim();
+  }
+};
+function lit(options) {
+  return new LitAdapter(options);
+}
+var lit_default = lit;
+
+export { LitAdapter, lit, lit_default };

package/dist/chunk-ZAJVSE7J.js

@@ -0,0 +1,90 @@
+import { BaseUIAdapter } from './chunk-2SNQ6PTM.js';
+
+// src/adapters/tier-3/petite-vue.ts
+var PetiteVueAdapter = class extends BaseUIAdapter {
+  constructor(options = {}) {
+    super();
+    this.options = options;
+  }
+  id = "petite-vue";
+  name = "Petite-vue";
+  framework = "petite-vue";
+  frameworkVersion = "0.4+";
+  tier = "tier-3";
+  capabilities = {
+    streaming: false,
+    partialHydration: false,
+    islands: false,
+    resumable: false,
+    ssg: true,
+    csr: true,
+    serverComponents: false
+  };
+  async renderToString(component, _context) {
+    const startTime = performance.now();
+    let html;
+    if (typeof component.component === "function") {
+      html = component.component(component.props ?? {});
+    } else if (typeof component.component === "string") {
+      html = component.component;
+    } else {
+      throw new Error(
+        "[Flight/Petite-vue] Components must be HTML strings or template functions.\nUse v-scope for state and @click, v-model, etc. for interactivity."
+      );
+    }
+    return {
+      html,
+      hydrationData: component.props,
+      timing: this.createTiming(startTime)
+    };
+  }
+  getHydrationScript(_result) {
+    const {
+      version = "0.4.1",
+      autoInit = true
+    } = this.options;
+    return `
+<!-- Flight/Petite-vue -->
+<script type="module">
+import { createApp } from 'https://esm.sh/petite-vue@${version}';
+
+window.__FLIGHT_ADAPTER__ = 'petite-vue';
+${autoInit ? `createApp().mount();` : "// Manual init: createApp().mount()"}
+
+console.log('[Flight/Petite-vue] Initialized');
+</script>
+        `.trim();
+  }
+  getClientEntry() {
+    return `
+import { createApp, reactive } from 'petite-vue';
+
+export { createApp, reactive };
+
+export function hydrate() {
+    createApp().mount();
+    console.log('[Flight/Petite-vue] Application mounted');
+}
+
+export function createScope(initialState) {
+    return reactive(initialState);
+}
+        `.trim();
+  }
+};
+function vScope(state, content) {
+  const stateStr = JSON.stringify(state).replace(/"/g, "'");
+  return `<div v-scope="${stateStr}">${content}</div>`;
+}
+function vFor(items, itemName, content) {
+  return `<template v-for="${itemName} in ${items}">${content}</template>`;
+}
+function vIf(condition, content) {
+  return `<template v-if="${condition}">${content}</template>`;
+}
+function petiteVue(options) {
+  return new PetiteVueAdapter(options);
+}
+var petite_vue_default = petiteVue;
+
+export { PetiteVueAdapter, petiteVue, petite_vue_default, vFor, vIf, vScope };