@a2ui-sdk/react 0.1.1 → 0.2.1

package/dist/0.8/contexts/DataModelContext.js

@@ -1,7 +1,7 @@
 import { jsx as C } from "react/jsx-runtime";
-import { createContext as P, useContext as f, useState as V, useCallback as a, useMemo as v } from "react";
+import { useContext as P, createContext as f, useState as V, useCallback as a, useMemo as v } from "react";
 import { mergeAtPath as b, getValueByPath as y, setValueByPath as B } from "@a2ui-sdk/utils/0.8";
-const g = P(
+const g = f(
   null
 );
 function E({ children: u }) {
@@ -72,7 +72,7 @@ function E({ children: u }) {
   return /* @__PURE__ */ C(g.Provider, { value: h, children: u });
 }
 function S() {
-  const u = f(g);
+  const u = P(g);
   if (!u)
     throw new Error(
       "useDataModelContext must be used within a DataModelProvider"

package/dist/0.8/index.d.ts

@@ -33,11 +33,13 @@
  * ```
  */
 export type { A2UIMessage, ActionPayload as A2UIAction, Action, ValueSource, } from '@a2ui-sdk/types/0.8';
-export type { A2UIProviderProps, ComponentsMap } from './contexts/A2UIProvider';
+export type { A2UIProviderProps } from './contexts/A2UIProvider';
 export type { A2UIRendererProps } from './A2UIRenderer';
+export type { Catalog, CatalogComponent, CatalogComponents, CatalogFunctions, } from './standard-catalog';
 export { A2UIProvider } from './contexts/A2UIProvider';
 export { A2UIRenderer } from './A2UIRenderer';
 export { ComponentRenderer } from './components/ComponentRenderer';
+export { standardCatalog } from './standard-catalog';
 export { useDispatchAction } from './hooks/useDispatchAction';
 export { useDataBinding, useFormBinding } from './hooks/useDataBinding';
 export { useSurfaceContext } from './contexts/SurfaceContext';

package/dist/0.8/index.js

@@ -1,17 +1,19 @@
 import { A2UIProvider as r } from "./contexts/A2UIProvider.js";
 import { A2UIRenderer as n } from "./A2UIRenderer.js";
-import { ComponentRenderer as p } from "./components/ComponentRenderer.js";
-import { useDispatchAction as f } from "./hooks/useDispatchAction.js";
-import { useDataBinding as a, useFormBinding as d } from "./hooks/useDataBinding.js";
-import { useSurfaceContext as u } from "./contexts/SurfaceContext.js";
+import { ComponentRenderer as m } from "./components/ComponentRenderer.js";
+import { standardCatalog as x } from "./standard-catalog/index.js";
+import { useDispatchAction as d } from "./hooks/useDispatchAction.js";
+import { useDataBinding as s, useFormBinding as u } from "./hooks/useDataBinding.js";
+import { useSurfaceContext as c } from "./contexts/SurfaceContext.js";
 import { useDataModelContext as A } from "./contexts/DataModelContext.js";
 export {
   r as A2UIProvider,
   n as A2UIRenderer,
-  p as ComponentRenderer,
-  a as useDataBinding,
+  m as ComponentRenderer,
+  x as standardCatalog,
+  s as useDataBinding,
   A as useDataModelContext,
-  f as useDispatchAction,
-  d as useFormBinding,
-  u as useSurfaceContext
+  d as useDispatchAction,
+  u as useFormBinding,
+  c as useSurfaceContext
 };

package/dist/0.8/standard-catalog/index.d.ts

@@ -0,0 +1,57 @@
+import { ComponentType } from 'react';
+import { TextComponent, ImageComponent, IconComponent, VideoComponent, AudioPlayerComponent, DividerComponent } from '../components/display';
+import { RowComponent, ColumnComponent, ListComponent, CardComponent, TabsComponent, ModalComponent } from '../components/layout';
+import { ButtonComponent, CheckBoxComponent, TextFieldComponent, DateTimeInputComponent, MultipleChoiceComponent, SliderComponent } from '../components/interactive';
+import { A2UIComponentProps } from '../components/types';
+/**
+ * Type for a component in the catalog.
+ */
+export type CatalogComponent = ComponentType<A2UIComponentProps>;
+/**
+ * Type for the components registry in a catalog.
+ */
+export type CatalogComponents = Record<string, CatalogComponent>;
+/**
+ * Type for functions in a catalog (reserved for future use).
+ */
+export type CatalogFunctions = Record<string, unknown>;
+/**
+ * Type for a catalog containing components and functions.
+ */
+export interface Catalog {
+    /** Component registry mapping type names to React components */
+    components: CatalogComponents;
+    /** Function registry (reserved for future use) */
+    functions?: CatalogFunctions;
+}
+/**
+ * Standard components included in the default catalog.
+ */
+export declare const standardComponents: CatalogComponents;
+/**
+ * Standard functions included in the default catalog (reserved for future use).
+ */
+/**
+ * The standard catalog containing all built-in A2UI v0.8 components and functions.
+ *
+ * This is the default catalog used when no custom catalog is provided to A2UIProvider.
+ *
+ * @example
+ * ```tsx
+ * // Use as-is
+ * <A2UIProvider messages={messages} catalog={standardCatalog}>
+ *   <A2UIRenderer />
+ * </A2UIProvider>
+ *
+ * // Extend with custom components
+ * const myCatalog = {
+ *   ...standardCatalog,
+ *   components: {
+ *     ...standardCatalog.components,
+ *     MyComponent: MyComponentImpl,
+ *   },
+ * }
+ * ```
+ */
+export declare const standardCatalog: Catalog;
+export { TextComponent, ImageComponent, IconComponent, VideoComponent, AudioPlayerComponent, DividerComponent, RowComponent, ColumnComponent, ListComponent, CardComponent, TabsComponent, ModalComponent, ButtonComponent, CheckBoxComponent, TextFieldComponent, DateTimeInputComponent, MultipleChoiceComponent, SliderComponent, };

package/dist/0.8/standard-catalog/index.js

@@ -0,0 +1,66 @@
+import { SliderComponent as o } from "../components/interactive/SliderComponent.js";
+import { MultipleChoiceComponent as m } from "../components/interactive/MultipleChoiceComponent.js";
+import { DateTimeInputComponent as t } from "../components/interactive/DateTimeInputComponent.js";
+import { TextFieldComponent as n } from "../components/interactive/TextFieldComponent.js";
+import { CheckBoxComponent as e } from "../components/interactive/CheckBoxComponent.js";
+import { ButtonComponent as r } from "../components/interactive/ButtonComponent.js";
+import { ModalComponent as p } from "../components/layout/ModalComponent.js";
+import { TabsComponent as i } from "../components/layout/TabsComponent.js";
+import { CardComponent as C } from "../components/layout/CardComponent.js";
+import { ListComponent as a } from "../components/layout/ListComponent.js";
+import { ColumnComponent as d } from "../components/layout/ColumnComponent.js";
+import { RowComponent as f } from "../components/layout/RowComponent.js";
+import { DividerComponent as l } from "../components/display/DividerComponent.js";
+import { AudioPlayerComponent as s } from "../components/display/AudioPlayerComponent.js";
+import { VideoComponent as u } from "../components/display/VideoComponent.js";
+import { IconComponent as c } from "../components/display/IconComponent.js";
+import { ImageComponent as T } from "../components/display/ImageComponent.js";
+import { TextComponent as x } from "../components/display/TextComponent.js";
+const I = {
+  // Display components
+  Text: x,
+  Image: T,
+  Icon: c,
+  Video: u,
+  AudioPlayer: s,
+  Divider: l,
+  // Layout components
+  Row: f,
+  Column: d,
+  List: a,
+  Card: C,
+  Tabs: i,
+  Modal: p,
+  // Interactive components
+  Button: r,
+  CheckBox: e,
+  TextField: n,
+  DateTimeInput: t,
+  MultipleChoice: m,
+  Slider: o
+}, q = {
+  components: I
+  // functions: standardFunctions,
+};
+export {
+  s as AudioPlayerComponent,
+  r as ButtonComponent,
+  C as CardComponent,
+  e as CheckBoxComponent,
+  d as ColumnComponent,
+  t as DateTimeInputComponent,
+  l as DividerComponent,
+  c as IconComponent,
+  T as ImageComponent,
+  a as ListComponent,
+  p as ModalComponent,
+  m as MultipleChoiceComponent,
+  f as RowComponent,
+  o as SliderComponent,
+  i as TabsComponent,
+  x as TextComponent,
+  n as TextFieldComponent,
+  u as VideoComponent,
+  q as standardCatalog,
+  I as standardComponents
+};

package/dist/0.9/A2UIRenderer.d.ts

@@ -1,32 +1,12 @@
-/**
- * A2UIRenderer - Component for rendering A2UI 0.9 surfaces.
- *
- * This component renders the surfaces from the A2UI context.
- * It must be used within an A2UIProvider.
- *
- * @example
- * ```tsx
- * import { A2UIProvider, A2UIRenderer, A2UIMessage, A2UIAction } from '@a2ui-sdk/react/0.9'
- *
- * function App() {
- *   const messages: A2UIMessage[] = [...]
- *   const handleAction = (action: A2UIAction) => {
- *     console.log('Action:', action)
- *   }
- *   return (
- *     <A2UIProvider messages={messages} onAction={handleAction}>
- *       <A2UIRenderer />
- *     </A2UIProvider>
- *   )
- * }
- * ```
- */
+import { ActionHandler } from '@a2ui-sdk/types/0.9';
 /**
  * Props for A2UIRenderer.
  */
 export interface A2UIRendererProps {
     /** Optional surface ID to render a specific surface (renders all if not provided) */
     surfaceId?: string;
+    /** Callback when an action is dispatched */
+    onAction?: ActionHandler;
 }
 /**
  * Component for rendering A2UI 0.9 surfaces.
@@ -37,18 +17,18 @@ export interface A2UIRendererProps {
  * @example
  * ```tsx
  * // Render all surfaces
- * <A2UIProvider messages={messages} onAction={handleAction}>
- *   <A2UIRenderer />
+ * <A2UIProvider messages={messages}>
+ *   <A2UIRenderer onAction={handleAction} />
  * </A2UIProvider>
  *
  * // Render specific surface
- * <A2UIProvider messages={messages} onAction={handleAction}>
- *   <A2UIRenderer surfaceId="sidebar" />
- *   <A2UIRenderer surfaceId="main" />
+ * <A2UIProvider messages={messages}>
+ *   <A2UIRenderer surfaceId="sidebar" onAction={handleAction} />
+ *   <A2UIRenderer surfaceId="main" onAction={handleAction} />
  * </A2UIProvider>
  * ```
  */
-export declare function A2UIRenderer({ surfaceId }: A2UIRendererProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function A2UIRenderer({ surfaceId, onAction }: A2UIRendererProps): import("react/jsx-runtime").JSX.Element | null;
 export declare namespace A2UIRenderer {
     var displayName: string;
 }

package/dist/0.9/A2UIRenderer.js

@@ -1,41 +1,42 @@
-import { jsx as i, Fragment as s } from "react/jsx-runtime";
+import { jsx as d } from "react/jsx-runtime";
 import { useSurfaceContext as a } from "./contexts/SurfaceContext.js";
-import { ComponentRenderer as f } from "./components/ComponentRenderer.js";
-function c(e) {
-  if (e.has("root"))
+import { ActionProvider as c } from "./contexts/ActionContext.js";
+import { ComponentRenderer as s } from "./components/ComponentRenderer.js";
+function l(o) {
+  if (o.has("root"))
     return "root";
-  const t = /* @__PURE__ */ new Set();
-  for (const r of e.values()) {
+  const n = /* @__PURE__ */ new Set();
+  for (const r of o.values()) {
     if ("children" in r) {
-      const n = r.children;
-      Array.isArray(n) && n.forEach((o) => t.add(o));
+      const t = r.children;
+      Array.isArray(t) && t.forEach((e) => n.add(e));
     }
-    "child" in r && typeof r.child == "string" && t.add(r.child), "trigger" in r && typeof r.trigger == "string" && t.add(r.trigger), "content" in r && typeof r.content == "string" && t.add(r.content), "tabs" in r && Array.isArray(r.tabs) && r.tabs.forEach((n) => {
-      n.child && t.add(n.child);
+    "child" in r && typeof r.child == "string" && n.add(r.child), "trigger" in r && typeof r.trigger == "string" && n.add(r.trigger), "content" in r && typeof r.content == "string" && n.add(r.content), "tabs" in r && Array.isArray(r.tabs) && r.tabs.forEach((t) => {
+      t.child && n.add(t.child);
     });
   }
-  for (const [r] of e)
-    if (!t.has(r))
+  for (const [r] of o)
+    if (!n.has(r))
       return r;
 }
-function l({ surfaceId: e }) {
-  const { surfaces: t } = a();
-  if (e) {
-    const n = t.get(e);
-    if (!n || !n.created)
+function u({ surfaceId: o, onAction: n }) {
+  const { surfaces: r } = a();
+  if (o) {
+    const e = r.get(o);
+    if (!e || !e.created)
       return null;
-    const o = c(n.components);
-    return o ? /* @__PURE__ */ i(f, { surfaceId: e, componentId: o }) : null;
+    const i = l(e.components);
+    return i ? /* @__PURE__ */ d(c, { onAction: n, children: /* @__PURE__ */ d(s, { surfaceId: o, componentId: i }) }) : null;
   }
-  const r = Array.from(t.entries());
-  return r.length === 0 ? null : /* @__PURE__ */ i(s, { children: r.map(([n, o]) => {
-    if (!o.created)
+  const t = Array.from(r.entries());
+  return t.length === 0 ? null : /* @__PURE__ */ d(c, { onAction: n, children: t.map(([e, i]) => {
+    if (!i.created)
       return null;
-    const d = c(o.components);
-    return d ? /* @__PURE__ */ i(f, { surfaceId: n, componentId: d }, n) : null;
+    const f = l(i.components);
+    return f ? /* @__PURE__ */ d(s, { surfaceId: e, componentId: f }, e) : null;
   }) });
 }
-l.displayName = "A2UI.Renderer";
+u.displayName = "A2UI.Renderer";
 export {
-  l as A2UIRenderer
+  u as A2UIRenderer
 };

package/dist/0.9/components/ComponentRenderer.d.ts

@@ -1,10 +1,10 @@
-import { ComponentType } from 'react';
-import { A2UIComponentProps } from '../contexts/ComponentsMapContext';
 /**
- * Component registry mapping component type names to React components.
- * This will be populated with actual components.
+ * ComponentRenderer - Routes component rendering based on type.
+ *
+ * Uses the flat discriminator format from 0.9 protocol where
+ * the component type is a property on the component itself.
+ * Props are spread directly to components like in v0.8.
  */
-export declare const componentRegistry: Record<string, ComponentType<A2UIComponentProps>>;
 /**
  * Props for ComponentRenderer.
  */
@@ -23,17 +23,3 @@ export interface ComponentRendererProps {
  * ```
  */
 export declare const ComponentRenderer: import('react').NamedExoticComponent<ComponentRendererProps>;
-/**
- * Registers a component type in the default registry.
- *
- * @param type - The component type name
- * @param component - The React component to register
- *
- * @example
- * ```tsx
- * registerComponent('CustomChart', ({ surfaceId, component }) => {
- *   return <Chart data={component.data} />;
- * });
- * ```
- */
-export declare function registerComponent(type: string, component: ComponentType<A2UIComponentProps>): void;

package/dist/0.9/components/ComponentRenderer.js

@@ -1,14 +1,14 @@
-import { jsx as s } from "react/jsx-runtime";
-import { memo as l, useContext as C } from "react";
-import { useComponent as c } from "../hooks/useComponent.js";
-import { ComponentsMapContext as f } from "../contexts/ComponentsMapContext.js";
-import { UnknownComponent as u } from "./UnknownComponent.js";
-const a = {}, m = /* @__PURE__ */ new Set(), y = l(function({
+import { jsx as i } from "react/jsx-runtime";
+import { memo as c, useContext as l } from "react";
+import { useComponent as f } from "../hooks/useComponent.js";
+import { ComponentsMapContext as u } from "../contexts/ComponentsMapContext.js";
+import { UnknownComponent as a } from "./UnknownComponent.js";
+const r = /* @__PURE__ */ new Set(), y = c(function({
   surfaceId: n,
   componentId: o
 }) {
-  const e = c(n, o), p = C(f), r = `${n}:${o}`;
-  if (m.has(r))
+  const e = f(n, o), s = l(u), t = `${n}:${o}`;
+  if (r.has(t))
     return console.error(
       `[A2UI 0.9] Circular reference detected for component "${o}" on surface "${n}". Skipping render.`
     ), null;
@@ -16,19 +16,32 @@ const a = {}, m = /* @__PURE__ */ new Set(), y = l(function({
     return console.warn(
       `[A2UI 0.9] Component not found: ${o} on surface ${n}`
     ), null;
-  const i = e.component;
-  let t;
-  if (p ? t = p.getComponent(i) : t = a[i], !t)
-    return /* @__PURE__ */ s(u, { surfaceId: n, component: e });
-  m.add(r);
+  const p = e.component, m = s?.getComponent(p);
+  if (!m)
+    return /* @__PURE__ */ i(
+      a,
+      {
+        surfaceId: n,
+        componentId: o,
+        componentType: p
+      }
+    );
+  r.add(t);
+  const { component: d, id: x, ...C } = e;
   try {
-    return /* @__PURE__ */ s(t, { surfaceId: n, component: e });
+    return /* @__PURE__ */ i(
+      m,
+      {
+        surfaceId: n,
+        componentId: o,
+        ...C
+      }
+    );
   } finally {
-    m.delete(r);
+    r.delete(t);
   }
 });
 y.displayName = "A2UI.ComponentRenderer";
 export {
-  y as ComponentRenderer,
-  a as componentRegistry
+  y as ComponentRenderer
 };

package/dist/0.9/components/UnknownComponent.d.ts

@@ -1,11 +1,17 @@
-import { A2UIComponentProps } from '../contexts/ComponentsMapContext';
+import { A2UIComponentProps } from './types';
+/**
+ * Props for UnknownComponent.
+ */
+export interface UnknownComponentProps {
+    componentType: string;
+}
 /**
  * Fallback component for unknown types.
  *
  * Displays a warning box with the unknown component type name
  * to help developers identify configuration issues.
  */
-export declare function UnknownComponent({ component }: A2UIComponentProps): import("react/jsx-runtime").JSX.Element;
+export declare function UnknownComponent({ componentId, componentType, }: A2UIComponentProps<UnknownComponentProps>): import("react/jsx-runtime").JSX.Element;
 export declare namespace UnknownComponent {
     var displayName: string;
 }

package/dist/0.9/components/UnknownComponent.js

@@ -1,9 +1,11 @@
-import { jsxs as p, jsx as t } from "react/jsx-runtime";
-function r({ component: n }) {
-  const o = n.component, e = n.id;
+import { jsxs as e, jsx as r } from "react/jsx-runtime";
+function p({
+  componentId: n,
+  componentType: o
+}) {
   return process.env.NODE_ENV === "development" && console.warn(
-    `[A2UI 0.9] Unknown component type "${o}" (id: ${e}). Make sure the component type is correct or provide a custom component.`
-  ), /* @__PURE__ */ p(
+    `[A2UI 0.9] Unknown component type "${o}" (id: ${n}). Make sure the component type is correct or provide a custom component.`
+  ), /* @__PURE__ */ e(
     "div",
     {
       style: {
@@ -17,19 +19,19 @@ function r({ component: n }) {
         fontFamily: "monospace"
       },
       children: [
-        /* @__PURE__ */ t("strong", { children: "Unknown component:" }),
+        /* @__PURE__ */ r("strong", { children: "Unknown component:" }),
         " ",
         o,
-        /* @__PURE__ */ t("br", {}),
-        /* @__PURE__ */ p("span", { style: { opacity: 0.7 }, children: [
+        /* @__PURE__ */ r("br", {}),
+        /* @__PURE__ */ e("span", { style: { opacity: 0.7 }, children: [
           "ID: ",
-          e
+          n
         ] })
       ]
     }
   );
 }
-r.displayName = "A2UI.UnknownComponent";
+p.displayName = "A2UI.UnknownComponent";
 export {
-  r as UnknownComponent
+  p as UnknownComponent
 };

package/dist/0.9/components/display/AudioPlayerComponent.d.ts

@@ -1,5 +1,6 @@
-import { A2UIComponentProps } from '../../contexts/ComponentsMapContext';
+import { AudioPlayerComponentProps } from '@a2ui-sdk/types/0.9/standard-catalog';
+import { A2UIComponentProps } from '../types';
 /**
  * AudioPlayer component for playing audio content.
  */
-export declare const AudioPlayerComponent: import('react').NamedExoticComponent<A2UIComponentProps>;
+export declare const AudioPlayerComponent: import('react').NamedExoticComponent<A2UIComponentProps<AudioPlayerComponentProps>>;

package/dist/0.9/components/display/AudioPlayerComponent.js

@@ -1,21 +1,23 @@
-import { jsxs as m, jsx as i } from "react/jsx-runtime";
-import { memo as d } from "react";
-import { useStringBinding as n } from "../../hooks/useDataBinding.js";
-import { cn as u } from "../../../lib/utils.js";
-const c = d(function({
-  surfaceId: e,
-  component: s
+import { jsxs as d, jsx as n } from "react/jsx-runtime";
+import { memo as u } from "react";
+import { useStringBinding as i } from "../../hooks/useDataBinding.js";
+import { cn as c } from "../../../lib/utils.js";
+const a = u(function({
+  surfaceId: o,
+  url: l,
+  description: s,
+  weight: e
 }) {
-  const o = s, r = n(e, o.url, ""), t = n(e, o.description, "");
+  const r = i(o, l, ""), t = i(o, s, "");
   if (!r)
     return null;
-  const l = o.weight ? { flexGrow: o.weight } : void 0;
-  return /* @__PURE__ */ m("div", { className: u("flex flex-col gap-2"), style: l, children: [
-    t && /* @__PURE__ */ i("p", { className: "text-sm text-muted-foreground", children: t }),
-    /* @__PURE__ */ i("audio", { src: r, controls: !0, className: "w-full", children: "Your browser does not support the audio element." })
+  const m = e ? { flexGrow: e } : void 0;
+  return /* @__PURE__ */ d("div", { className: c("flex flex-col gap-2"), style: m, children: [
+    t && /* @__PURE__ */ n("p", { className: "text-sm text-muted-foreground", children: t }),
+    /* @__PURE__ */ n("audio", { src: r, controls: !0, className: "w-full", children: "Your browser does not support the audio element." })
   ] });
 });
-c.displayName = "A2UI.AudioPlayer";
+a.displayName = "A2UI.AudioPlayer";
 export {
-  c as AudioPlayerComponent
+  a as AudioPlayerComponent
 };

package/dist/0.9/components/display/DividerComponent.d.ts

@@ -1,5 +1,6 @@
-import { A2UIComponentProps } from '../../contexts/ComponentsMapContext';
+import { DividerComponentProps } from '@a2ui-sdk/types/0.9/standard-catalog';
+import { A2UIComponentProps } from '../types';
 /**
  * Divider component for visual separation.
  */
-export declare const DividerComponent: import('react').NamedExoticComponent<A2UIComponentProps>;
+export declare const DividerComponent: import('react').NamedExoticComponent<A2UIComponentProps<DividerComponentProps>>;

package/dist/0.9/components/display/DividerComponent.js

@@ -1,10 +1,9 @@
 import { jsx as r } from "react/jsx-runtime";
 import { memo as t } from "react";
 import { Separator as e } from "../../../components/ui/separator.js";
-const m = t(function({
-  component: i
+const i = t(function({
+  axis: o = "horizontal"
 }) {
-  const o = i.axis ?? "horizontal";
   return /* @__PURE__ */ r(
     e,
     {
@@ -13,7 +12,7 @@ const m = t(function({
     }
   );
 });
-m.displayName = "A2UI.Divider";
+i.displayName = "A2UI.Divider";
 export {
-  m as DividerComponent
+  i as DividerComponent
 };

package/dist/0.9/components/display/IconComponent.d.ts

@@ -1,5 +1,6 @@
-import { A2UIComponentProps } from '../../contexts/ComponentsMapContext';
+import { IconComponentProps } from '@a2ui-sdk/types/0.9/standard-catalog';
+import { A2UIComponentProps } from '../types';
 /**
  * Icon component for displaying icons from the A2UI icon set.
  */
-export declare const IconComponent: import('react').NamedExoticComponent<A2UIComponentProps>;
+export declare const IconComponent: import('react').NamedExoticComponent<A2UIComponentProps<IconComponentProps>>;

package/dist/0.9/components/display/IconComponent.js

@@ -1,9 +1,9 @@
-import { jsx as i } from "react/jsx-runtime";
-import { memo as t } from "react";
+import { jsx as t } from "react/jsx-runtime";
+import { memo as i } from "react";
 import { useStringBinding as l } from "../../hooks/useDataBinding.js";
 import { AlertTriangle as c, EyeOff as f, Eye as s, Upload as m, StarOff as p, StarHalf as d, Star as h, ShoppingCart as C, Share2 as u, Settings as w, Send as g, Search as O, RefreshCw as S, Printer as k, Image as y, Phone as o, User as H, CreditCard as I, Bell as U, BellOff as A, MoreHorizontal as M, MoreVertical as P, Menu as v, Mail as B, Unlock as F, Lock as N, MapPin as T, Info as b, Home as x, HelpCircle as z, Folder as D, HeartOff as E, Heart as L, AlertCircle as R, CalendarDays as V, Pencil as j, Download as X, Trash2 as $, X as q, Check as G, Camera as J, Calendar as K, Paperclip as Q, ArrowRight as W, ArrowLeft as Y, Plus as Z, UserCircle as _ } from "lucide-react";
-import { cn as ee } from "../../../lib/utils.js";
-const re = {
+import { cn as rr } from "../../../lib/utils.js";
+const er = {
   accountCircle: _,
   add: Z,
   arrowBack: Y,
@@ -52,17 +52,17 @@ const re = {
   visibility: s,
   visibilityOff: f,
   warning: c
-}, oe = t(function({
+}, or = i(function({
   surfaceId: n,
-  component: a
+  name: a
 }) {
-  const e = l(n, a.name, "");
-  if (!e)
+  const r = l(n, a, "");
+  if (!r)
     return null;
-  const r = re[e];
-  return r ? /* @__PURE__ */ i(r, { className: ee("w-5 h-5") }) : (console.warn(`[A2UI 0.9] Unknown icon name: ${e}`), null);
+  const e = er[r];
+  return e ? /* @__PURE__ */ t(e, { className: rr("w-5 h-5") }) : (console.warn(`[A2UI 0.9] Unknown icon name: ${r}`), null);
 });
-oe.displayName = "A2UI.Icon";
+or.displayName = "A2UI.Icon";
 export {
-  oe as IconComponent
+  or as IconComponent
 };

package/dist/0.9/components/display/ImageComponent.d.ts

@@ -1,6 +1,7 @@
-import { A2UIComponentProps } from '../../contexts/ComponentsMapContext';
+import { ImageComponentProps } from '@a2ui-sdk/types/0.9/standard-catalog';
+import { A2UIComponentProps } from '../types';
 /**
  * Image component for displaying images.
  * Supports different sizes via variant and object-fit via fit property.
  */
-export declare const ImageComponent: import('react').NamedExoticComponent<A2UIComponentProps>;
+export declare const ImageComponent: import('react').NamedExoticComponent<A2UIComponentProps<ImageComponentProps>>;