@lovable-widgets/core 0.1.0

package/dist/context.d.ts

@@ -0,0 +1,3 @@
+import type { WidgetContextValue } from './types';
+export declare const WidgetContext: import("react").Context<WidgetContextValue | null>;
+export declare function useWidgetContext(): WidgetContextValue | null;

package/dist/createWidget.d.ts

@@ -0,0 +1,7 @@
+import type { CreateWidgetConfig, WidgetDefinition } from './types';
+declare global {
+    interface Window {
+        __LOVABLE_WIDGET_SECRETS__?: Record<string, string>;
+    }
+}
+export declare function createWidget<P extends Record<string, any>>(config: CreateWidgetConfig<P>): WidgetDefinition<P>;

package/dist/errorBoundary.d.ts

@@ -0,0 +1,19 @@
+import React, { Component, ErrorInfo, ReactNode } from 'react';
+interface Props {
+    widgetName: string;
+    onError?: (error: Error, errorInfo?: {
+        componentStack?: string;
+    }) => void;
+    children: ReactNode;
+}
+interface State {
+    hasError: boolean;
+    error: Error | null;
+}
+export declare class WidgetErrorBoundary extends Component<Props, State> {
+    state: State;
+    static getDerivedStateFromError(error: Error): State;
+    componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
+    render(): string | number | boolean | Iterable<React.ReactNode> | import("react/jsx-runtime").JSX.Element | null | undefined;
+}
+export {};

package/dist/events.d.ts

@@ -0,0 +1,3 @@
+import type { WidgetEventType, WidgetEvent } from './types';
+export declare function emitWidgetEvent<T = any>(widgetName: string, type: WidgetEventType, payload?: T): void;
+export declare function onWidgetEvent<T = any>(type: WidgetEventType | '*', callback: (event: WidgetEvent<T>) => void): () => void;

package/dist/hooks.d.ts

@@ -0,0 +1,7 @@
+import type { ThemeTokens, WidgetEventType, WidgetEvent } from './types';
+export declare function useWidgetTheme(): ThemeTokens;
+export declare function useWidgetId(prefix?: string): string;
+export declare function useWidgetSecrets(): Record<string, string>;
+export declare function useWidgetStatus(): 'initializing' | 'ready' | 'missing-secrets' | 'unknown';
+export declare function useWidgetEmit(): (type: WidgetEventType, payload?: any) => void;
+export declare function useWidgetListener<T = any>(type: WidgetEventType | '*', callback: (event: WidgetEvent<T>) => void): void;

package/dist/index.d.ts

@@ -0,0 +1,9 @@
+export { createWidget } from './createWidget';
+export { useWidgetContext } from './context';
+export { useWidgetTheme, useWidgetId, useWidgetSecrets, useWidgetStatus, useWidgetEmit, useWidgetListener } from './hooks';
+export { registerWidget, getWidget, listWidgets, unregisterWidget, clearRegistry } from './registry';
+export { emitWidgetEvent, onWidgetEvent } from './events';
+export { WidgetErrorBoundary } from './errorBoundary';
+export { provideSecrets } from './provideSecrets';
+export { mountWidget, unmountWidget } from './mount';
+export type { WidgetSecretDef, WidgetMeta, WidgetConfig, WidgetPropDef, WidgetDefinition, CreateWidgetConfig, WidgetLifecycle, ThemeTokens, WidgetContextValue, WidgetEventType, WidgetEvent } from './types';

package/dist/lovable-widgets-core.cjs

@@ -0,0 +1 @@
+var ie=Object.create;var p=Object.defineProperty;var de=Object.getOwnPropertyDescriptor;var se=Object.getOwnPropertyNames;var ae=Object.getPrototypeOf,ge=Object.prototype.hasOwnProperty;var ce=(e,t,r)=>t in e?p(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r;var ue=(e,t)=>{for(var r in t)p(e,r,{get:t[r],enumerable:!0})},b=(e,t,r,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of se(t))!ge.call(e,o)&&o!==r&&p(e,o,{get:()=>t[o],enumerable:!(n=de(t,o))||n.enumerable});return e};var me=(e,t,r)=>(r=e!=null?ie(ae(e)):{},b(t||!e||!e.__esModule?p(r,"default",{value:e,enumerable:!0}):r,e)),fe=e=>b(p({},"__esModule",{value:!0}),e);var M=(e,t,r)=>ce(e,typeof t!="symbol"?t+"":t,r);var We={};ue(We,{WidgetErrorBoundary:()=>c,clearRegistry:()=>X,createWidget:()=>B,emitWidgetEvent:()=>d,getWidget:()=>w,listWidgets:()=>q,mountWidget:()=>Z,onWidgetEvent:()=>y,provideSecrets:()=>J,registerWidget:()=>K,unmountWidget:()=>h,unregisterWidget:()=>U,useWidgetContext:()=>g,useWidgetEmit:()=>H,useWidgetId:()=>$,useWidgetListener:()=>z,useWidgetSecrets:()=>G,useWidgetStatus:()=>O,useWidgetTheme:()=>A});module.exports=fe(We);var i=require("react");var v=require("react"),_=(0,v.createContext)(null);function g(){return(0,v.useContext)(_)}var I=require("react");var C="lovable-widget:";function d(e,t,r){if(typeof window>"u")return;let n={widget:e,type:t,payload:r,timestamp:Date.now()};window.dispatchEvent(new CustomEvent(`${C}${t}`,{detail:n})),window.dispatchEvent(new CustomEvent(`${C}*`,{detail:n}))}function y(e,t){if(typeof window>"u")return()=>{};let r=`${C}${e}`,n=o=>{t(o.detail)};return window.addEventListener(r,n),()=>window.removeEventListener(r,n)}var P=require("react/jsx-runtime"),c=class extends I.Component{constructor(){super(...arguments);M(this,"state",{hasError:!1,error:null})}static getDerivedStateFromError(r){return{hasError:!0,error:r}}componentDidCatch(r,n){let{widgetName:o,onError:l}=this.props;d(o,"error",{message:r.message,stack:r.stack,componentStack:n.componentStack}),l?.(r,{componentStack:n.componentStack??void 0})}render(){return this.state.hasError?(0,P.jsxs)("div",{"data-lw-error":this.props.widgetName,children:['Widget "',this.props.widgetName,'" encountered an error.']}):this.props.children}};var s=require("react/jsx-runtime");function pe({lifecycle:e,widgetName:t}){return(0,i.useEffect)(()=>(e.onMount?.(),d(t,"ready"),()=>{e.onUnmount?.()}),[]),null}function B(e){let{meta:t,component:r,propDefs:n,secrets:o=[],config:l={},lifecycle:x={}}=e,L=(0,i.forwardRef)((j,R)=>{let{className:D="",...ee}=j,[te,re]=(0,i.useState)(o.filter(()=>!1)),[T,ne]=(0,i.useState)({}),[E,k]=(0,i.useState)("initializing");(0,i.useEffect)(()=>{if(o.length===0){k("ready");return}let u=typeof window<"u"&&window.__LOVABLE_WIDGET_SECRETS__||{},m=[],N={};for(let f of o){let V=f.envKey||f.name;u[V]?N[f.name]=u[V]:f.required!==!1&&m.push(f)}ne(N),re(m),k(m.length>0?"missing-secrets":"ready"),m.length>0&&d(t.name,"missing-secrets",{secrets:m})},[]);let oe=(0,i.useMemo)(()=>({meta:t,secrets:T,config:l,status:E}),[T,E]);return E==="missing-secrets"?(0,s.jsxs)("div",{ref:R,className:D||void 0,"data-lw-widget":t.name,"data-lw-version":t.version,"data-lw-status":"missing-secrets",children:['Widget "',t.name,'" requires secrets: ',te.map(u=>u.envKey||u.name).join(", ")]}):(0,s.jsx)(_.Provider,{value:oe,children:(0,s.jsx)(c,{widgetName:t.name,onError:x.onError,children:(0,s.jsxs)("div",{ref:R,className:D||void 0,"data-lw-widget":t.name,"data-lw-version":t.version,"data-lw-status":E,children:[(0,s.jsx)(pe,{lifecycle:x,widgetName:t.name}),(0,s.jsx)(r,{...ee,__widgetSecrets:T})]})})})});return L.displayName=`LovableWidget(${t.name})`,{component:L,meta:t,propDefs:n,secrets:o,config:l,lifecycle:x,__LOVABLE_WIDGET__:!0}}var a=require("react");function A(){return(0,a.useMemo)(()=>{let e=t=>typeof window>"u"?"":getComputedStyle(document.documentElement).getPropertyValue("--"+t).trim();return{background:e("background"),foreground:e("foreground"),card:e("card"),cardForeground:e("card-foreground"),primary:e("primary"),primaryForeground:e("primary-foreground"),secondary:e("secondary"),secondaryForeground:e("secondary-foreground"),muted:e("muted"),mutedForeground:e("muted-foreground"),accent:e("accent"),accentForeground:e("accent-foreground"),destructive:e("destructive"),destructiveForeground:e("destructive-foreground"),border:e("border"),ring:e("ring"),radius:e("radius")}},[])}var F=0;function $(e){return(0,a.useMemo)(()=>(F+=1,(e||"lw")+"-"+F),[e])}function G(){let e=g();return e?e.secrets:{}}function O(){let e=g();return e?e.status:"unknown"}function H(){let t=g()?.meta.name??"unknown";return(0,a.useCallback)((r,n)=>{d(t,r,n)},[t])}function z(e,t){(0,a.useEffect)(()=>y(e,t),[e,t])}var W=new Map;function K(e){if(!e.__LOVABLE_WIDGET__)throw new Error("registerWidget: argument must be a WidgetDefinition created by createWidget()");W.set(e.meta.name,e)}function w(e){return W.get(e)}function q(){return Array.from(W.values())}function U(e){return W.delete(e)}function X(){W.clear()}function J(e){typeof window<"u"&&(window.__LOVABLE_WIDGET_SECRETS__={...window.__LOVABLE_WIDGET_SECRETS__||{},...e})}var Q=me(require("react"),1),Y=require("react-dom/client");var S=new WeakMap;function Z(e,t,r={}){let n=w(t);if(!n)throw new Error(`mountWidget: widget "${t}" is not registered.`);h(e);let o=(0,Y.createRoot)(e);o.render(Q.default.createElement(n.component,r)),S.set(e,o)}function h(e){let t=S.get(e);t&&(t.unmount(),S.delete(e))}

package/dist/lovable-widgets-core.js

@@ -0,0 +1 @@
+var G=Object.defineProperty;var O=(e,t,r)=>t in e?G(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r;var D=(e,t,r)=>O(e,typeof t!="symbol"?t+"":t,r);import{forwardRef as U,useState as w,useEffect as N,useMemo as X}from"react";import{createContext as H,useContext as z}from"react";var E=H(null);function g(){return z(E)}import{Component as K}from"react";var v="lovable-widget:";function i(e,t,r){if(typeof window>"u")return;let n={widget:e,type:t,payload:r,timestamp:Date.now()};window.dispatchEvent(new CustomEvent(`${v}${t}`,{detail:n})),window.dispatchEvent(new CustomEvent(`${v}*`,{detail:n}))}function y(e,t){if(typeof window>"u")return()=>{};let r=`${v}${e}`,n=o=>{t(o.detail)};return window.addEventListener(r,n),()=>window.removeEventListener(r,n)}import{jsxs as q}from"react/jsx-runtime";var c=class extends K{constructor(){super(...arguments);D(this,"state",{hasError:!1,error:null})}static getDerivedStateFromError(r){return{hasError:!0,error:r}}componentDidCatch(r,n){let{widgetName:o,onError:m}=this.props;i(o,"error",{message:r.message,stack:r.stack,componentStack:n.componentStack}),m?.(r,{componentStack:n.componentStack??void 0})}render(){return this.state.hasError?q("div",{"data-lw-error":this.props.widgetName,children:['Widget "',this.props.widgetName,'" encountered an error.']}):this.props.children}};import{jsx as p,jsxs as k}from"react/jsx-runtime";function J({lifecycle:e,widgetName:t}){return N(()=>(e.onMount?.(),i(t,"ready"),()=>{e.onUnmount?.()}),[]),null}function Q(e){let{meta:t,component:r,propDefs:n,secrets:o=[],config:m={},lifecycle:W={}}=e,_=U((I,C)=>{let{className:S="",...P}=I,[B,F]=w(o.filter(()=>!1)),[l,A]=w({}),[f,h]=w("initializing");N(()=>{if(o.length===0){h("ready");return}let d=typeof window<"u"&&window.__LOVABLE_WIDGET_SECRETS__||{},s=[],L={};for(let a of o){let R=a.envKey||a.name;d[R]?L[a.name]=d[R]:a.required!==!1&&s.push(a)}A(L),F(s),h(s.length>0?"missing-secrets":"ready"),s.length>0&&i(t.name,"missing-secrets",{secrets:s})},[]);let $=X(()=>({meta:t,secrets:l,config:m,status:f}),[l,f]);return f==="missing-secrets"?k("div",{ref:C,className:S||void 0,"data-lw-widget":t.name,"data-lw-version":t.version,"data-lw-status":"missing-secrets",children:['Widget "',t.name,'" requires secrets: ',B.map(d=>d.envKey||d.name).join(", ")]}):p(E.Provider,{value:$,children:p(c,{widgetName:t.name,onError:W.onError,children:k("div",{ref:C,className:S||void 0,"data-lw-widget":t.name,"data-lw-version":t.version,"data-lw-status":f,children:[p(J,{lifecycle:W,widgetName:t.name}),p(r,{...P,__widgetSecrets:l})]})})})});return _.displayName=`LovableWidget(${t.name})`,{component:_,meta:t,propDefs:n,secrets:o,config:m,lifecycle:W,__LOVABLE_WIDGET__:!0}}import{useMemo as b,useEffect as Y,useCallback as Z}from"react";function j(){return b(()=>{let e=t=>typeof window>"u"?"":getComputedStyle(document.documentElement).getPropertyValue("--"+t).trim();return{background:e("background"),foreground:e("foreground"),card:e("card"),cardForeground:e("card-foreground"),primary:e("primary"),primaryForeground:e("primary-foreground"),secondary:e("secondary"),secondaryForeground:e("secondary-foreground"),muted:e("muted"),mutedForeground:e("muted-foreground"),accent:e("accent"),accentForeground:e("accent-foreground"),destructive:e("destructive"),destructiveForeground:e("destructive-foreground"),border:e("border"),ring:e("ring"),radius:e("radius")}},[])}var V=0;function ee(e){return b(()=>(V+=1,(e||"lw")+"-"+V),[e])}function te(){let e=g();return e?e.secrets:{}}function re(){let e=g();return e?e.status:"unknown"}function ne(){let t=g()?.meta.name??"unknown";return Z((r,n)=>{i(t,r,n)},[t])}function oe(e,t){Y(()=>y(e,t),[e,t])}var u=new Map;function ie(e){if(!e.__LOVABLE_WIDGET__)throw new Error("registerWidget: argument must be a WidgetDefinition created by createWidget()");u.set(e.meta.name,e)}function x(e){return u.get(e)}function de(){return Array.from(u.values())}function se(e){return u.delete(e)}function ae(){u.clear()}function ge(e){typeof window<"u"&&(window.__LOVABLE_WIDGET_SECRETS__={...window.__LOVABLE_WIDGET_SECRETS__||{},...e})}import ce from"react";import{createRoot as ue}from"react-dom/client";var T=new WeakMap;function me(e,t,r={}){let n=x(t);if(!n)throw new Error(`mountWidget: widget "${t}" is not registered.`);M(e);let o=ue(e);o.render(ce.createElement(n.component,r)),T.set(e,o)}function M(e){let t=T.get(e);t&&(t.unmount(),T.delete(e))}export{c as WidgetErrorBoundary,ae as clearRegistry,Q as createWidget,i as emitWidgetEvent,x as getWidget,de as listWidgets,me as mountWidget,y as onWidgetEvent,ge as provideSecrets,ie as registerWidget,M as unmountWidget,se as unregisterWidget,g as useWidgetContext,ne as useWidgetEmit,ee as useWidgetId,oe as useWidgetListener,te as useWidgetSecrets,re as useWidgetStatus,j as useWidgetTheme};

package/dist/mount.d.ts

@@ -0,0 +1,2 @@
+export declare function mountWidget(container: HTMLElement, widgetName: string, props?: Record<string, any>): void;
+export declare function unmountWidget(container: HTMLElement): void;

package/dist/provideSecrets.d.ts

@@ -0,0 +1 @@
+export declare function provideSecrets(secretMap: Record<string, string>): void;

package/dist/registry.d.ts

@@ -0,0 +1,6 @@
+import type { WidgetDefinition } from './types';
+export declare function registerWidget(definition: WidgetDefinition): void;
+export declare function getWidget(name: string): WidgetDefinition | undefined;
+export declare function listWidgets(): WidgetDefinition[];
+export declare function unregisterWidget(name: string): boolean;
+export declare function clearRegistry(): void;

package/dist/types.d.ts

@@ -0,0 +1,91 @@
+import { ComponentType } from 'react';
+export interface WidgetSecretDef {
+    name: string;
+    envKey: string;
+    description: string;
+    required?: boolean;
+    acquireUrl?: string;
+    service?: string;
+}
+export interface WidgetMeta {
+    name: string;
+    version: string;
+    description: string;
+    author: string;
+    category: 'ui' | 'commerce' | 'navigation' | 'social-proof' | 'data' | 'forms' | 'media' | 'layout' | 'ai' | 'analytics' | 'communication';
+    tags: string[];
+    icon?: string;
+    license?: string;
+    repository?: string;
+    homepage?: string;
+}
+export interface WidgetConfig {
+    ssr?: boolean;
+    minCoreVersion?: string;
+    sandbox?: 'strict' | 'permissive';
+    cssPrefix?: string;
+}
+export interface WidgetPropDef {
+    name: string;
+    type: string;
+    required: boolean;
+    default?: string;
+    description: string;
+    options?: string[];
+}
+export interface WidgetLifecycle {
+    onMount?: () => void;
+    onUnmount?: () => void;
+    onError?: (error: Error, errorInfo?: {
+        componentStack?: string;
+    }) => void;
+}
+export interface WidgetDefinition<P = any> {
+    component: ComponentType<P>;
+    meta: WidgetMeta;
+    propDefs: WidgetPropDef[];
+    secrets: WidgetSecretDef[];
+    config: WidgetConfig;
+    lifecycle: WidgetLifecycle;
+    __LOVABLE_WIDGET__: true;
+}
+export interface CreateWidgetConfig<P> {
+    meta: WidgetMeta;
+    component: ComponentType<P>;
+    propDefs: WidgetPropDef[];
+    secrets?: WidgetSecretDef[];
+    config?: WidgetConfig;
+    lifecycle?: WidgetLifecycle;
+}
+export interface ThemeTokens {
+    background: string;
+    foreground: string;
+    card: string;
+    cardForeground: string;
+    primary: string;
+    primaryForeground: string;
+    secondary: string;
+    secondaryForeground: string;
+    muted: string;
+    mutedForeground: string;
+    accent: string;
+    accentForeground: string;
+    destructive: string;
+    destructiveForeground: string;
+    border: string;
+    ring: string;
+    radius: string;
+}
+export interface WidgetContextValue {
+    meta: WidgetMeta;
+    secrets: Record<string, string>;
+    config: WidgetConfig;
+    status: 'initializing' | 'ready' | 'missing-secrets';
+}
+export type WidgetEventType = 'ready' | 'error' | 'state-change' | 'action' | 'missing-secrets' | 'resize';
+export interface WidgetEvent<T = any> {
+    widget: string;
+    type: WidgetEventType;
+    payload: T;
+    timestamp: number;
+}

package/package.json

@@ -0,0 +1,22 @@
+{
+  "name": "@lovable-widgets/core",
+  "version": "0.1.0",
+  "description": "Pure integration SDK for building Lovable-compatible widgets",
+  "main": "dist/index.js",
+  "module": "dist/index.mjs",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    },
+    "./styles.css": "./dist/style.css"
+  },
+  "peerDependencies": {
+    "react": ">=18.0.0",
+    "react-dom": ">=18.0.0"
+  },
+  "license": "MIT",
+  "author": "Lovable Widgets"
+}