@stackable-labs/sdk-extension-react 1.21.0 → 1.22.1

package/dist/context.js

@@ -1,8 +0,0 @@
-/**
- * React contexts for the extension runtime.
- */
-import { createContext } from 'react';
-/** Context for surface-level data (provided by host per surface) */
-export const SurfaceContext = createContext(null);
-export const ExtensionContext = createContext(null);
-//# sourceMappingURL=context.js.map

package/dist/context.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"context.js","sourceRoot":"","sources":["../src/context.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAErC,oEAAoE;AACpE,MAAM,CAAC,MAAM,cAAc,GAAG,aAAa,CAAiC,IAAI,CAAC,CAAA;AAOjF,MAAM,CAAC,MAAM,gBAAgB,GAAG,aAAa,CAA+B,IAAI,CAAC,CAAA"}

package/dist/createExtension.d.ts

@@ -1,21 +0,0 @@
-/**
- * createExtension — bootstraps the extension runtime in the iframe sandbox.
- * Sets up Remote DOM, RPC listener, and renders the extension's React tree.
- */
-import React from 'react';
-interface CreateExtensionOptions {
-    extensionId?: string;
-}
-/**
- * Bootstrap an extension. Call this as the entry point of your extension bundle.
- *
- * @example
- * export default createExtension(() => (
- *   <>
- *     <Surface id="slot.header"><Header /></Surface>
- *     <Surface id="slot.content"><Content /></Surface>
- *   </>
- * ));
- */
-export declare const createExtension: (factory: () => React.ReactElement, options?: CreateExtensionOptions) => void;
-export {};

package/dist/createExtension.js

@@ -1,35 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createRoot } from 'react-dom/client';
-import { ExtensionContext } from './context';
-import { initRpcListener } from './rpc-client';
-/**
- * Bootstrap an extension. Call this as the entry point of your extension bundle.
- *
- * @example
- * export default createExtension(() => (
- *   <>
- *     <Surface id="slot.header"><Header /></Surface>
- *     <Surface id="slot.content"><Content /></Surface>
- *   </>
- * ));
- */
-export const createExtension = (factory, options) => {
-    // Resolve extensionId: prefer host-injected value, then options, then fallback
-    const injectedId = window.__STACKABLE_EXTENSION_ID__ ??
-        new URLSearchParams(window.location.search).get('__extensionId') ??
-        undefined;
-    const extensionId = injectedId ?? options?.extensionId ?? 'unknown';
-    console.debug(`[createExtension] extensionId resolved: "${extensionId}" (injected: ${injectedId ?? 'none'}, options: ${options?.extensionId ?? 'none'})`);
-    // Initialize RPC listener for capability responses
-    initRpcListener(extensionId);
-    const contextValue = {
-        extensionId,
-    };
-    // Mount the extension React tree
-    const container = document.getElementById('extension-root') ?? document.body;
-    const root = createRoot(container);
-    root.render(_jsx(ExtensionContext.Provider, { value: contextValue, children: factory() }));
-    // Notify host that the extension is ready
-    window.parent.postMessage({ type: 'extension-ready', extensionId }, '*');
-};
-//# sourceMappingURL=createExtension.js.map

package/dist/createExtension.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"createExtension.js","sourceRoot":"","sources":["../src/createExtension.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAC7C,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAA;AAE5C,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAM9C;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,OAAiC,EAAE,OAAgC,EAAQ,EAAE;IAC3G,+EAA+E;IAC/E,MAAM,UAAU,GACb,MAA6C,CAAC,0BAAgD;QAC/F,IAAI,eAAe,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,eAAe,CAAC;QAChE,SAAS,CAAA;IACX,MAAM,WAAW,GAAG,UAAU,IAAI,OAAO,EAAE,WAAW,IAAI,SAAS,CAAA;IACnE,OAAO,CAAC,KAAK,CAAC,4CAA4C,WAAW,gBAAgB,UAAU,IAAI,MAAM,cAAc,OAAO,EAAE,WAAW,IAAI,MAAM,GAAG,CAAC,CAAA;IAEzJ,mDAAmD;IACnD,eAAe,CAAC,WAAW,CAAC,CAAA;IAE5B,MAAM,YAAY,GAA0B;QAC1C,WAAW;KACZ,CAAA;IAED,iCAAiC;IACjC,MAAM,SAAS,GAAG,QAAQ,CAAC,cAAc,CAAC,gBAAgB,CAAC,IAAI,QAAQ,CAAC,IAAI,CAAA;IAC5E,MAAM,IAAI,GAAG,UAAU,CAAC,SAAS,CAAC,CAAA;IAElC,IAAI,CAAC,MAAM,CACT,KAAC,gBAAgB,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY,YAC3C,OAAO,EAAE,GACgB,CAC7B,CAAA;IAED,0CAA0C;IAC1C,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,IAAI,EAAE,iBAAiB,EAAE,WAAW,EAAE,EAAE,GAAG,CAAC,CAAA;AAC1E,CAAC,CAAA"}

package/dist/hooks.d.ts

@@ -1,33 +0,0 @@
-/**
- * React hooks for extension developers.
- */
-import type { ContextData, ApiRequest, FetchRequestInit, FetchResponse, ToastPayload } from '@stackable-labs/sdk-extension-contracts';
-import type { Store } from './store';
-/**
- * Read the host-provided context for the current surface.
- */
-export declare const useSurfaceContext: () => Record<string, unknown>;
-/**
- * Access host-mediated capabilities (data, actions, context).
- */
-export declare const useCapabilities: () => {
-    data: {
-        query: <T = unknown>(payload: ApiRequest) => Promise<T>;
-        fetch: (url: string, init?: FetchRequestInit) => Promise<FetchResponse>;
-    };
-    actions: {
-        toast: (payload: ToastPayload) => Promise<void>;
-        invoke: <T = unknown>(action: string, payload?: Record<string, unknown>) => Promise<T>;
-    };
-    context: {
-        read: () => Promise<ContextData>;
-    };
-};
-/**
- * Subscribe to a shared store with an optional selector.
- */
-export declare const useStore: <T, S = T>(store: Store<T>, selector?: (state: T) => S) => S;
-/**
- * Access the extension-level context (extension ID, manifest, etc.)
- */
-export declare const useExtension: () => import("./context").ExtensionContextValue;

package/dist/hooks.js

@@ -1,52 +0,0 @@
-/**
- * React hooks for extension developers.
- */
-import { useContext, useSyncExternalStore, useCallback } from 'react';
-import { ExtensionContext, SurfaceContext } from './context';
-import { callCapability } from './rpc-client';
-/**
- * Read the host-provided context for the current surface.
- */
-export const useSurfaceContext = () => {
-    const ctx = useContext(SurfaceContext);
-    if (!ctx) {
-        throw new Error('useSurfaceContext must be used inside a <Surface> component');
-    }
-    return ctx;
-};
-/**
- * Access host-mediated capabilities (data, actions, context).
- */
-export const useCapabilities = () => ({
-    data: {
-        query: (payload) => callCapability('data.query', payload),
-        fetch: (url, init) => callCapability('data.fetch', { url, ...init }),
-    },
-    actions: {
-        toast: (payload) => callCapability('actions.toast', payload),
-        invoke: (action, payload) => callCapability('actions.invoke', { action, payload }),
-    },
-    context: {
-        read: () => callCapability('context.read'),
-    },
-});
-/**
- * Subscribe to a shared store with an optional selector.
- */
-export const useStore = (store, selector) => {
-    const select = selector ?? ((s) => s);
-    const getSnapshot = useCallback(() => select(store.get()), [store, select]);
-    const subscribe = useCallback((onStoreChange) => store.subscribe(onStoreChange), [store]);
-    return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
-};
-/**
- * Access the extension-level context (extension ID, manifest, etc.)
- */
-export const useExtension = () => {
-    const ctx = useContext(ExtensionContext);
-    if (!ctx) {
-        throw new Error('useExtension must be used inside a createExtension() tree');
-    }
-    return ctx;
-};
-//# sourceMappingURL=hooks.js.map

package/dist/hooks.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"hooks.js","sourceRoot":"","sources":["../src/hooks.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,UAAU,EAAE,oBAAoB,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AASrE,OAAO,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,WAAW,CAAA;AAC5D,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAG7C;;GAEG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAA4B,EAAE;IAC7D,MAAM,GAAG,GAAG,UAAU,CAAC,cAAc,CAAC,CAAA;IACtC,IAAI,CAAC,GAAG,EAAE,CAAC;QACT,MAAM,IAAI,KAAK,CAAC,6DAA6D,CAAC,CAAA;IAChF,CAAC;IACD,OAAO,GAAG,CAAA;AACZ,CAAC,CAAA;AAED;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,EAAE,CAAC,CAAC;IAClC,IAAI,EAAE;QACJ,KAAK,EAAE,CAAc,OAAmB,EAAc,EAAE,CACtD,cAAc,CAAI,YAAY,EAAE,OAAO,CAAC;QAC1C,KAAK,EAAE,CAAC,GAAW,EAAE,IAAuB,EAA0B,EAAE,CACtE,cAAc,CAAgB,YAAY,EAAE,EAAE,GAAG,EAAE,GAAG,IAAI,EAAE,CAAC;KAChE;IACD,OAAO,EAAE;QACP,KAAK,EAAE,CAAC,OAAqB,EAAiB,EAAE,CAC9C,cAAc,CAAO,eAAe,EAAE,OAAO,CAAC;QAChD,MAAM,EAAE,CAAc,MAAc,EAAE,OAAiC,EAAc,EAAE,CACrF,cAAc,CAAI,gBAAgB,EAAE,EAAE,MAAM,EAAE,OAAO,EAAgC,CAAC;KACzF;IACD,OAAO,EAAE;QACP,IAAI,EAAE,GAAyB,EAAE,CAC/B,cAAc,CAAc,cAAc,CAAC;KAC9C;CACF,CAAC,CAAA;AAEJ;;GAEG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAW,KAAe,EAAE,QAA0B,EAAK,EAAE;IACnF,MAAM,MAAM,GAAG,QAAQ,IAAI,CAAC,CAAC,CAAI,EAAE,EAAE,CAAC,CAAiB,CAAC,CAAA;IAExD,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,CAAA;IAE3E,MAAM,SAAS,GAAG,WAAW,CAC3B,CAAC,aAAyB,EAAE,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC,EAC7D,CAAC,KAAK,CAAC,CACR,CAAA;IAED,OAAO,oBAAoB,CAAC,SAAS,EAAE,WAAW,EAAE,WAAW,CAAC,CAAA;AAClE,CAAC,CAAA;AAED;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,EAAE;IAC/B,MAAM,GAAG,GAAG,UAAU,CAAC,gBAAgB,CAAC,CAAA;IACxC,IAAI,CAAC,GAAG,EAAE,CAAC;QACT,MAAM,IAAI,KAAK,CAAC,2DAA2D,CAAC,CAAA;IAC9E,CAAC;IACD,OAAO,GAAG,CAAA;AACZ,CAAC,CAAA"}

package/dist/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AACrC,OAAO,EACL,iBAAiB,EACjB,eAAe,EACf,QAAQ,EACR,YAAY,GACb,MAAM,SAAS,CAAA;AAEhB,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AACnC,OAAO,KAAK,EAAE,MAAM,MAAM,CAAA;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA"}

package/dist/rpc-client.d.ts

@@ -1,12 +0,0 @@
-/**
- * RPC Client — sends capability requests from sandbox to host via postMessage.
- */
-import type { CapabilityType } from '@stackable-labs/sdk-extension-contracts';
-/**
- * Initialize the RPC listener for responses from the host.
- */
-export declare const initRpcListener: (extensionId: string) => void;
-/**
- * Send a capability request to the host and await the response.
- */
-export declare const callCapability: <T = unknown>(capability: CapabilityType, payload?: unknown) => Promise<T>;

package/dist/rpc-client.js

@@ -1,56 +0,0 @@
-/**
- * RPC Client — sends capability requests from sandbox to host via postMessage.
- */
-let requestCounter = 0;
-let registeredExtensionId = 'unknown';
-const pendingRequests = new Map();
-const generateRequestId = () => `req_${++requestCounter}_${Date.now()}`;
-/**
- * Initialize the RPC listener for responses from the host.
- */
-export const initRpcListener = (extensionId) => {
-    registeredExtensionId = extensionId;
-    window.addEventListener('message', (event) => {
-        const msg = event.data;
-        if (msg?.type === 'capability-response') {
-            const response = msg;
-            const pending = pendingRequests.get(response.id);
-            if (pending) {
-                pendingRequests.delete(response.id);
-                if (response.success) {
-                    pending.resolve(response.data);
-                }
-                else {
-                    pending.reject(new Error(response.error || 'Capability call failed'));
-                }
-            }
-        }
-    });
-};
-/**
- * Send a capability request to the host and await the response.
- */
-export const callCapability = (capability, payload) => (new Promise((resolve, reject) => {
-    const id = generateRequestId();
-    pendingRequests.set(id, {
-        resolve: resolve,
-        reject,
-    });
-    const request = {
-        type: 'capability-request',
-        id,
-        extensionId: registeredExtensionId,
-        capability,
-        payload,
-    };
-    // Post to parent (host) window
-    window.parent.postMessage(request, '*');
-    // Timeout after 30 seconds
-    setTimeout(() => {
-        if (pendingRequests.has(id)) {
-            pendingRequests.delete(id);
-            reject(new Error(`Capability call '${capability}' timed out`));
-        }
-    }, 30000);
-}));
-//# sourceMappingURL=rpc-client.js.map

package/dist/rpc-client.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"rpc-client.js","sourceRoot":"","sources":["../src/rpc-client.ts"],"names":[],"mappings":"AAAA;;GAEG;AAIH,IAAI,cAAc,GAAG,CAAC,CAAA;AACtB,IAAI,qBAAqB,GAAG,SAAS,CAAA;AACrC,MAAM,eAAe,GAAG,IAAI,GAAG,EAG3B,CAAA;AAEJ,MAAM,iBAAiB,GAAG,GAAW,EAAE,CAAC,OAAO,EAAE,cAAc,IAAI,IAAI,CAAC,GAAG,EAAE,EAAE,CAAA;AAE/E;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,WAAmB,EAAQ,EAAE;IAC3D,qBAAqB,GAAG,WAAW,CAAA;IACnC,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,CAAC,KAAmB,EAAE,EAAE;QACzD,MAAM,GAAG,GAAG,KAAK,CAAC,IAAI,CAAA;QACtB,IAAI,GAAG,EAAE,IAAI,KAAK,qBAAqB,EAAE,CAAC;YACxC,MAAM,QAAQ,GAAG,GAAyB,CAAA;YAC1C,MAAM,OAAO,GAAG,eAAe,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAA;YAChD,IAAI,OAAO,EAAE,CAAC;gBACZ,eAAe,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAA;gBACnC,IAAI,QAAQ,CAAC,OAAO,EAAE,CAAC;oBACrB,OAAO,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAA;gBAChC,CAAC;qBAAM,CAAC;oBACN,OAAO,CAAC,MAAM,CAAC,IAAI,KAAK,CAAC,QAAQ,CAAC,KAAK,IAAI,wBAAwB,CAAC,CAAC,CAAA;gBACvE,CAAC;YACH,CAAC;QACH,CAAC;IACH,CAAC,CAAC,CAAA;AACJ,CAAC,CAAA;AAED;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAc,UAA0B,EAAE,OAAiB,EAAc,EAAE,CAAC,CACxG,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;IAC9B,MAAM,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAC9B,eAAe,CAAC,GAAG,CAAC,EAAE,EAAE;QACtB,OAAO,EAAE,OAAkC;QAC3C,MAAM;KACP,CAAC,CAAA;IAEF,MAAM,OAAO,GAAsB;QACjC,IAAI,EAAE,oBAAoB;QAC1B,EAAE;QACF,WAAW,EAAE,qBAAqB;QAClC,UAAU;QACV,OAAO;KACR,CAAA;IAED,+BAA+B;IAC/B,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,OAAO,EAAE,GAAG,CAAC,CAAA;IAEvC,2BAA2B;IAC3B,UAAU,CAAC,GAAG,EAAE;QACd,IAAI,eAAe,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC;YAC5B,eAAe,CAAC,MAAM,CAAC,EAAE,CAAC,CAAA;YAC1B,MAAM,CAAC,IAAI,KAAK,CAAC,oBAAoB,UAAU,aAAa,CAAC,CAAC,CAAA;QAChE,CAAC;IACH,CAAC,EAAE,KAAK,CAAC,CAAA;AACX,CAAC,CAAC,CACH,CAAA"}

package/dist/store.d.ts

@@ -1,20 +0,0 @@
-/**
- * Shared Store — cross-surface state coordination.
- * All surfaces in the same extension runtime share a store instance.
- */
-type Listener<T> = (state: T) => void;
-export interface Store<T> {
-    get(): T;
-    set(partial: Partial<T>): void;
-    subscribe(listener: Listener<T>): () => void;
-}
-/**
- * Create a shared store for cross-surface coordination.
- *
- * @example
- * const store = createStore({ mode: 'account', selectedId: null });
- * store.set({ mode: 'conversations' });
- * store.subscribe((state) => console.log(state));
- */
-export declare const createStore: <T extends object>(initialState: T) => Store<T>;
-export {};

package/dist/store.js

@@ -1,30 +0,0 @@
-/**
- * Shared Store — cross-surface state coordination.
- * All surfaces in the same extension runtime share a store instance.
- */
-/**
- * Create a shared store for cross-surface coordination.
- *
- * @example
- * const store = createStore({ mode: 'account', selectedId: null });
- * store.set({ mode: 'conversations' });
- * store.subscribe((state) => console.log(state));
- */
-export const createStore = (initialState) => {
-    let state = { ...initialState };
-    const listeners = new Set();
-    return {
-        get: () => state,
-        set: (partial) => {
-            state = { ...state, ...partial };
-            listeners.forEach((listener) => listener(state));
-        },
-        subscribe: (listener) => {
-            listeners.add(listener);
-            return () => {
-                listeners.delete(listener);
-            };
-        },
-    };
-};
-//# sourceMappingURL=store.js.map

package/dist/store.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"store.js","sourceRoot":"","sources":["../src/store.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAUH;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,CAAmB,YAAe,EAAY,EAAE;IACzE,IAAI,KAAK,GAAG,EAAE,GAAG,YAAY,EAAE,CAAA;IAC/B,MAAM,SAAS,GAAG,IAAI,GAAG,EAAe,CAAA;IAExC,OAAO;QACL,GAAG,EAAE,GAAG,EAAE,CAAC,KAAK;QAEhB,GAAG,EAAE,CAAC,OAAmB,EAAE,EAAE;YAC3B,KAAK,GAAG,EAAE,GAAG,KAAK,EAAE,GAAG,OAAO,EAAE,CAAA;YAChC,SAAS,CAAC,OAAO,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAA;QAClD,CAAC;QAED,SAAS,EAAE,CAAC,QAAqB,EAAE,EAAE;YACnC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAA;YACvB,OAAO,GAAG,EAAE;gBACV,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAA;YAC5B,CAAC,CAAA;QACH,CAAC;KACF,CAAA;AACH,CAAC,CAAA"}

package/dist/ui.d.ts

@@ -1,366 +0,0 @@
-/**
- * UI Component Wrappers for Extensions
- *
- * These are thin React components that render Remote DOM custom elements.
- * The host maps these custom elements to real React components (e.g., shadcn/ui).
- *
- * Extension developers use these as: <ui.Card>, <ui.Button>, etc.
- */
-import React from 'react';
-import type { AllowedIconName } from '@stackable-labs/sdk-extension-contracts';
-type RemoteInputChangeEvent = {
-    target: {
-        value: string;
-    };
-};
-export declare const Card: (props: {
-    className?: string;
-    onClick?: () => void;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const CardContent: (props: {
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const CardHeader: (props: {
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Stack: (props: {
-    gap?: string;
-    direction?: "row" | "column";
-    align?: string;
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Inline: (props: {
-    gap?: string;
-    align?: string;
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Text: (props: {
-    className?: string;
-    tone?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Heading: (props: {
-    level?: "1" | "2" | "3" | "4" | "5" | "6";
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Badge: (props: {
-    variant?: string;
-    tone?: string;
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Button: (props: {
-    variant?: string;
-    size?: string;
-    disabled?: boolean;
-    onClick?: () => void;
-    type?: string;
-    className?: string;
-    title?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Input: (props: {
-    type?: string;
-    placeholder?: string;
-    value?: string;
-    onChange?: (e: RemoteInputChangeEvent) => void;
-    disabled?: boolean;
-    className?: string;
-    id?: string;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Textarea: (props: {
-    placeholder?: string;
-    value?: string;
-    onChange?: (e: RemoteInputChangeEvent) => void;
-    disabled?: boolean;
-    rows?: string;
-    className?: string;
-    id?: string;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Select: (props: {
-    value?: string;
-    defaultValue?: string;
-    onChange?: (e: RemoteInputChangeEvent) => void;
-    placeholder?: string;
-    disabled?: boolean;
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const SelectOption: (props: {
-    value: string;
-    disabled?: boolean;
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Checkbox: (props: {
-    checked?: boolean;
-    onChange?: (e: RemoteInputChangeEvent) => void;
-    disabled?: boolean;
-    className?: string;
-    id?: string;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Switch: (props: {
-    checked?: boolean;
-    onChange?: (e: RemoteInputChangeEvent) => void;
-    disabled?: boolean;
-    size?: string;
-    className?: string;
-    id?: string;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Label: (props: {
-    htmlFor?: string;
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const RadioGroup: (props: {
-    value?: string;
-    defaultValue?: string;
-    onChange?: (e: RemoteInputChangeEvent) => void;
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const RadioGroupItem: (props: {
-    value: string;
-    disabled?: boolean;
-    className?: string;
-    id?: string;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Separator: (props: {
-    className?: string;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Tabs: (props: {
-    defaultValue?: string;
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const TabsList: (props: {
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const TabsTrigger: (props: {
-    value: string;
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const TabsContent: (props: {
-    value: string;
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const ScrollArea: (props: {
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Skeleton: (props: {
-    width?: string;
-    height?: string;
-    className?: string;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Tooltip: (props: {
-    content: string;
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Progress: (props: {
-    value?: string;
-    className?: string;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Alert: (props: {
-    variant?: string;
-    title?: string;
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Collapsible: (props: {
-    defaultOpen?: boolean;
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const CollapsibleTrigger: (props: {
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const CollapsibleContent: (props: {
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Avatar: (props: {
-    src?: string;
-    alt?: string;
-    className?: string;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Icon: (props: {
-    name: AllowedIconName;
-    size?: string;
-    className?: string;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Link: (props: {
-    href?: string;
-    target?: string;
-    rel?: string;
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const FooterLink: (props: {
-    href?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const Menu: (props: {
-    title?: string;
-    className?: string;
-    children?: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export declare const MenuItem: (props: {
-    icon?: AllowedIconName;
-    label: string;
-    description?: string;
-    onClick?: () => void;
-    className?: string;
-}) => import("react/jsx-runtime").JSX.Element;
-declare global {
-    namespace JSX {
-        interface IntrinsicElements {
-            'ui-card': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
-            'ui-card-content': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
-            'ui-card-header': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
-            'ui-button': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                variant?: string;
-                size?: string;
-                disabled?: boolean;
-                type?: string;
-                title?: string;
-            }, HTMLElement>;
-            'ui-text': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                tone?: string;
-            }, HTMLElement>;
-            'ui-heading': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                level?: string;
-            }, HTMLElement>;
-            'ui-badge': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                variant?: string;
-                tone?: string;
-            }, HTMLElement>;
-            'ui-input': Omit<React.HTMLAttributes<HTMLElement>, 'onChange'> & {
-                type?: string;
-                placeholder?: string;
-                value?: string;
-                onChange?: (e: RemoteInputChangeEvent) => void;
-                disabled?: boolean;
-                id?: string;
-            };
-            'ui-textarea': Omit<React.HTMLAttributes<HTMLElement>, 'onChange'> & {
-                placeholder?: string;
-                value?: string;
-                onChange?: (e: RemoteInputChangeEvent) => void;
-                disabled?: boolean;
-                rows?: string;
-                id?: string;
-            };
-            'ui-select': Omit<React.HTMLAttributes<HTMLElement>, 'onChange'> & {
-                value?: string;
-                defaultValue?: string;
-                onChange?: (e: RemoteInputChangeEvent) => void;
-                placeholder?: string;
-                disabled?: boolean;
-            };
-            'ui-select-option': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                value?: string;
-                disabled?: boolean;
-            }, HTMLElement>;
-            'ui-checkbox': Omit<React.HTMLAttributes<HTMLElement>, 'onChange'> & {
-                checked?: boolean;
-                onChange?: (e: RemoteInputChangeEvent) => void;
-                disabled?: boolean;
-                id?: string;
-            };
-            'ui-switch': Omit<React.HTMLAttributes<HTMLElement>, 'onChange'> & {
-                checked?: boolean;
-                onChange?: (e: RemoteInputChangeEvent) => void;
-                disabled?: boolean;
-                size?: string;
-                id?: string;
-            };
-            'ui-label': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                htmlFor?: string;
-            }, HTMLElement>;
-            'ui-radio-group': Omit<React.HTMLAttributes<HTMLElement>, 'onChange'> & {
-                value?: string;
-                defaultValue?: string;
-                onChange?: (e: RemoteInputChangeEvent) => void;
-            };
-            'ui-radio-group-item': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                value?: string;
-                disabled?: boolean;
-                id?: string;
-            }, HTMLElement>;
-            'ui-stack': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                gap?: string;
-                direction?: string;
-                align?: string;
-            }, HTMLElement>;
-            'ui-inline': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                gap?: string;
-                align?: string;
-            }, HTMLElement>;
-            'ui-separator': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
-            'ui-tabs': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                defaultValue?: string;
-            }, HTMLElement>;
-            'ui-tabs-list': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
-            'ui-tabs-trigger': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                value?: string;
-            }, HTMLElement>;
-            'ui-tabs-content': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                value?: string;
-            }, HTMLElement>;
-            'ui-scroll-area': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
-            'ui-avatar': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                src?: string;
-                alt?: string;
-            }, HTMLElement>;
-            'ui-icon': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                name?: string;
-                size?: string;
-            }, HTMLElement>;
-            'ui-link': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                href?: string;
-                target?: string;
-                rel?: string;
-            }, HTMLElement>;
-            'ui-menu-item': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                icon?: string;
-                label?: string;
-                description?: string;
-            }, HTMLElement>;
-            'ui-menu': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                title?: string;
-            }, HTMLElement>;
-            'ui-skeleton': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                width?: string;
-                height?: string;
-            }, HTMLElement>;
-            'ui-tooltip': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                content?: string;
-            }, HTMLElement>;
-            'ui-progress': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                value?: string;
-            }, HTMLElement>;
-            'ui-alert': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                variant?: string;
-                title?: string;
-            }, HTMLElement>;
-            'ui-collapsible': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
-                defaultOpen?: boolean;
-            }, HTMLElement>;
-            'ui-collapsible-trigger': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
-            'ui-collapsible-content': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
-        }
-    }
-}
-export {};