Skip to content
fayeuiStatic / 0.1.0
LLMs
Advanced / Static edition

Extension packages

Share system contracts without pulling data engines into the core.

Extension seam

An extension declares its namespaced component identity, tokens, parts, variants, compatibility and stylesheet assets. It can consume core components but core cannot import it.

The activity panel below is loaded only by this example route. It consumes the public extension and core APIs. There is no special private theme provider for extension components.

Non-CSS renderers

A canvas or other non-CSS renderer may need a resolved browser value, not a var expression. The provider's computed-token utilities are an explicit browser seam. Their availability and updates must be handled by the extension.

Data-engine exclusions

Data grids, chart engines, advanced date/time pickers, rich-text editors and remote data caches remain separate work. A UI table and pagination control are not a data-grid engine.

Explicit deferred delivery

Ordinary extension imports bring their CSS automatically. Dynamic JavaScript imports alone do not guarantee deferred CSS in a bundler.

For managed delivery, use @fayegram-ai/faye-ui/example-extension/unstyled and @fayegram-ai/faye-ui/integrations/deferred-assets. The public assets entry lists required CSS specifiers. Build tooling must translate those specifiers into deployed URLs. Normal core primitives retain automatic styles; the @fayegram-ai/faye-ui/core/unstyled entry is available for this explicit boundary.

loadDeferredModule stages owned links, waits for successful stylesheet loading, imports the module, then activates styles before the caller renders. Its lease has an idempotent release method. Shared consumers keep styles until their last release. Failure/cancellation removes owned resources and allows retry. Module evaluation cannot be undone by cancellation.

Supply a live Document or ShadowRoot, exact allowed origins, optional nonce and canonical SHA-256/384/512 integrity. Initial URL validation uses the owner document's origin even when a base URL points elsewhere. Redirect destination restrictions are the host's CSP responsibility; this adapter does not intercept browser redirects. A deployment must protect asset URLs and preserve the compiled content hashes.

The packed gate records the initial JavaScript/CSS closure, emitted assets, network requests and a real Chromium activation, invalid-integrity rejection and shared-lease cleanup. The playground demonstrates Vite URL assets with loading, retry and unload controls. Those profiles do not establish support for every bundler.

Live examples

Try the controls below, then read or copy the complete example to adapt it for your application.

Independently bundled extension

  1. Theme contract updated
  2. Custom component reviewed
Read the complete example
import { ActivityPanel } from '@fayegram-ai/faye-ui/example-extension';
import { Section } from '../example';
export default function Extensions() { return <Section title="Independently bundled extension"><ActivityPanel entries={[{ id: 'a', label: 'Theme contract updated', dateTime: '2026-10-01T10:00:00Z', displayTime: '10:00 UTC' }, { id: 'b', label: 'Custom component reviewed', dateTime: '2026-10-01T10:30:00Z', displayTime: '10:30 UTC' }]}/></Section>; }