@a2ui-sdk/react 0.1.1 → 0.2.0

package/dist/0.9/components/interactive/SliderComponent.js

@@ -1,47 +1,53 @@
-import { jsxs as c, jsx as i } from "react/jsx-runtime";
-import { memo as g, useCallback as v } from "react";
-import { useStringBinding as S, useFormBinding as b } from "../../hooks/useDataBinding.js";
-import { useValidation as C } from "../../hooks/useValidation.js";
-import { Slider as N } from "../../../components/ui/slider.js";
-import { Label as w } from "../../../components/ui/label.js";
-import { cn as y } from "../../../lib/utils.js";
-const V = g(function({
-  surfaceId: n,
-  component: p
+import { jsxs as c, jsx as e } from "react/jsx-runtime";
+import { memo as C, useCallback as N } from "react";
+import { useStringBinding as b, useFormBinding as y } from "../../hooks/useDataBinding.js";
+import { useValidation as V } from "../../hooks/useValidation.js";
+import { Slider as j } from "../../../components/ui/slider.js";
+import { Label as B } from "../../../components/ui/label.js";
+import { cn as F } from "../../../lib/utils.js";
+const k = C(function({
+  surfaceId: t,
+  componentId: p,
+  label: f,
+  min: l = 0,
+  max: i = 100,
+  value: u,
+  checks: h,
+  weight: n
 }) {
-  const e = p, o = S(n, e.label, ""), l = e.min ?? 0, r = e.max ?? 100, { valid: h, errors: s } = C(n, e.checks), [m, a] = b(
-    n,
-    e.value,
+  const o = b(t, f, ""), { valid: x, errors: s } = V(t, h), [d, a] = y(
+    t,
+    u,
     l
-  ), f = v(
-    (t) => {
-      t.length > 0 && a(t[0]);
+  ), g = N(
+    (r) => {
+      r.length > 0 && a(r[0]);
     },
     [a]
-  ), d = `slider-${e.id}`, x = e.weight ? { flexGrow: e.weight } : void 0;
-  return /* @__PURE__ */ c("div", { className: y("flex flex-col gap-2 py-2"), style: x, children: [
-    o && /* @__PURE__ */ i(w, { htmlFor: d, children: o }),
-    /* @__PURE__ */ i(
-      N,
+  ), m = `slider-${p}`, v = n ? { flexGrow: n } : void 0;
+  return /* @__PURE__ */ c("div", { className: F("flex flex-col gap-2 py-2"), style: v, children: [
+    o && /* @__PURE__ */ e(B, { htmlFor: m, children: o }),
+    /* @__PURE__ */ e(
+      j,
       {
-        id: d,
-        value: [m],
-        onValueChange: f,
+        id: m,
+        value: [d],
+        onValueChange: g,
         min: l,
-        max: r,
+        max: i,
         step: 1,
-        "aria-invalid": !h
+        "aria-invalid": !x
       }
     ),
     /* @__PURE__ */ c("div", { className: "flex justify-between text-sm text-muted-foreground", children: [
-      /* @__PURE__ */ i("span", { children: l }),
-      /* @__PURE__ */ i("span", { className: "font-medium text-foreground", children: m }),
-      /* @__PURE__ */ i("span", { children: r })
+      /* @__PURE__ */ e("span", { children: l }),
+      /* @__PURE__ */ e("span", { className: "font-medium text-foreground", children: d }),
+      /* @__PURE__ */ e("span", { children: i })
     ] }),
-    s.length > 0 && /* @__PURE__ */ i("div", { className: "text-sm text-destructive", children: s.map((t, u) => /* @__PURE__ */ i("p", { children: t }, u)) })
+    s.length > 0 && /* @__PURE__ */ e("div", { className: "text-sm text-destructive", children: s.map((r, S) => /* @__PURE__ */ e("p", { children: r }, S)) })
   ] });
 });
-V.displayName = "A2UI.Slider";
+k.displayName = "A2UI.Slider";
 export {
-  V as SliderComponent
+  k as SliderComponent
 };

package/dist/0.9/components/interactive/TextFieldComponent.d.ts

@@ -1,5 +1,6 @@
-import { A2UIComponentProps } from '../../contexts/ComponentsMapContext';
+import { TextFieldComponentProps } from '@a2ui-sdk/types/0.9/standard-catalog';
+import { A2UIComponentProps } from '../types';
 /**
  * TextField component - text input with label.
  */
-export declare const TextFieldComponent: import('react').NamedExoticComponent<A2UIComponentProps>;
+export declare const TextFieldComponent: import('react').NamedExoticComponent<A2UIComponentProps<TextFieldComponentProps>>;

package/dist/0.9/components/interactive/TextFieldComponent.js

@@ -1,57 +1,58 @@
-import { jsxs as T, jsx as t } from "react/jsx-runtime";
-import { memo as f, useCallback as b } from "react";
-import { useStringBinding as C, useFormBinding as F } from "../../hooks/useDataBinding.js";
-import { useValidation as y } from "../../hooks/useValidation.js";
-import { Input as N } from "../../../components/ui/input.js";
-import { Textarea as w } from "../../../components/ui/textarea.js";
-import { Label as j } from "../../../components/ui/label.js";
-import { cn as a } from "../../../lib/utils.js";
-const k = {
+import { jsxs as C, jsx as e } from "react/jsx-runtime";
+import { memo as y, useCallback as F } from "react";
+import { useStringBinding as N, useFormBinding as j } from "../../hooks/useDataBinding.js";
+import { useValidation as B } from "../../hooks/useValidation.js";
+import { Input as L } from "../../../components/ui/input.js";
+import { Textarea as V } from "../../../components/ui/textarea.js";
+import { Label as k } from "../../../components/ui/label.js";
+import { cn as i } from "../../../lib/utils.js";
+const w = {
   shortText: "text",
   longText: "text",
   // Uses textarea
   number: "number",
   obscured: "password"
-}, B = f(function({
-  surfaceId: n,
-  component: x
+}, A = y(function({
+  surfaceId: o,
+  componentId: x,
+  label: u,
+  value: h,
+  variant: s = "shortText",
+  checks: T,
+  weight: l
 }) {
-  const e = x, s = C(n, e.label, ""), [l, m] = F(
-    n,
-    e.value,
-    ""
-  ), { valid: o, errors: c } = y(n, e.checks), d = b(
+  const a = N(o, u, ""), [m, d] = j(o, h, ""), { valid: t, errors: c } = B(o, T), p = F(
     (r) => {
-      m(r.target.value);
+      d(r.target.value);
     },
-    [m]
-  ), i = `textfield-${e.id}`, p = e.variant ?? "shortText", u = k[p] || "text", h = p === "longText", g = e.weight ? { flexGrow: e.weight } : void 0;
-  return /* @__PURE__ */ T("div", { className: a("flex flex-col gap-2"), style: g, children: [
-    s && /* @__PURE__ */ t(j, { htmlFor: i, children: s }),
-    h ? /* @__PURE__ */ t(
-      w,
+    [d]
+  ), n = `textfield-${x}`, f = w[s] || "text", g = s === "longText", v = l ? { flexGrow: l } : void 0;
+  return /* @__PURE__ */ C("div", { className: i("flex flex-col gap-2"), style: v, children: [
+    a && /* @__PURE__ */ e(k, { htmlFor: n, children: a }),
+    g ? /* @__PURE__ */ e(
+      V,
       {
-        id: i,
-        value: l,
-        onChange: d,
-        className: a("min-h-[100px]", !o && "border-destructive"),
-        "aria-invalid": !o
+        id: n,
+        value: m,
+        onChange: p,
+        className: i("min-h-[100px]", !t && "border-destructive"),
+        "aria-invalid": !t
       }
-    ) : /* @__PURE__ */ t(
-      N,
+    ) : /* @__PURE__ */ e(
+      L,
       {
-        id: i,
-        type: u,
-        value: l,
-        onChange: d,
-        className: a(!o && "border-destructive"),
-        "aria-invalid": !o
+        id: n,
+        type: f,
+        value: m,
+        onChange: p,
+        className: i(!t && "border-destructive"),
+        "aria-invalid": !t
       }
     ),
-    c.length > 0 && /* @__PURE__ */ t("div", { className: "text-sm text-destructive", children: c.map((r, v) => /* @__PURE__ */ t("p", { children: r }, v)) })
+    c.length > 0 && /* @__PURE__ */ e("div", { className: "text-sm text-destructive", children: c.map((r, b) => /* @__PURE__ */ e("p", { children: r }, b)) })
   ] });
 });
-B.displayName = "A2UI.TextField";
+A.displayName = "A2UI.TextField";
 export {
-  B as TextFieldComponent
+  A as TextFieldComponent
 };

package/dist/0.9/components/layout/CardComponent.d.ts

@@ -1,5 +1,6 @@
-import { A2UIComponentProps } from '../../contexts/ComponentsMapContext';
+import { CardComponentProps } from '@a2ui-sdk/types/0.9/standard-catalog';
+import { A2UIComponentProps } from '../types';
 /**
  * Card component - container with card styling.
  */
-export declare const CardComponent: import('react').NamedExoticComponent<A2UIComponentProps>;
+export declare const CardComponent: import('react').NamedExoticComponent<A2UIComponentProps<CardComponentProps>>;

package/dist/0.9/components/layout/CardComponent.js

@@ -1,15 +1,16 @@
-import { jsx as r } from "react/jsx-runtime";
-import { memo as d } from "react";
-import { Card as n, CardContent as i } from "../../../components/ui/card.js";
-import { ComponentRenderer as p } from "../ComponentRenderer.js";
-const c = d(function({
+import { jsx as o } from "react/jsx-runtime";
+import { memo as p } from "react";
+import { Card as m, CardContent as d } from "../../../components/ui/card.js";
+import { ComponentRenderer as a } from "../ComponentRenderer.js";
+const C = p(function({
   surfaceId: t,
-  component: m
+  child: r,
+  weight: n
 }) {
-  const o = m, e = o.weight ? { flexGrow: o.weight } : void 0;
-  return o.child ? /* @__PURE__ */ r(n, { style: e, children: /* @__PURE__ */ r(i, { className: "p-4", children: /* @__PURE__ */ r(p, { surfaceId: t, componentId: o.child }) }) }) : /* @__PURE__ */ r(n, { style: e });
+  const e = n ? { flexGrow: n } : void 0;
+  return r ? /* @__PURE__ */ o(m, { style: e, children: /* @__PURE__ */ o(d, { className: "p-4", children: /* @__PURE__ */ o(a, { surfaceId: t, componentId: r }) }) }) : /* @__PURE__ */ o(m, { style: e });
 });
-c.displayName = "A2UI.Card";
+C.displayName = "A2UI.Card";
 export {
-  c as CardComponent
+  C as CardComponent
 };

package/dist/0.9/components/layout/ColumnComponent.d.ts

@@ -1,6 +1,7 @@
-import { A2UIComponentProps } from '../../contexts/ComponentsMapContext';
+import { ColumnComponentProps } from '@a2ui-sdk/types/0.9/standard-catalog';
+import { A2UIComponentProps } from '../types';
 /**
  * Column component - vertical flex container.
  * Supports both static children and template binding for dynamic children.
  */
-export declare const ColumnComponent: import('react').NamedExoticComponent<A2UIComponentProps>;
+export declare const ColumnComponent: import('react').NamedExoticComponent<A2UIComponentProps<ColumnComponentProps>>;

package/dist/0.9/components/layout/ColumnComponent.js

@@ -1,11 +1,11 @@
-import { jsx as n } from "react/jsx-runtime";
+import { jsx as e } from "react/jsx-runtime";
 import { memo as f } from "react";
 import { useDataModel as u } from "../../hooks/useDataBinding.js";
 import { useScope as y } from "../../contexts/ScopeContext.js";
-import { cn as d } from "../../../lib/utils.js";
-import { ComponentRenderer as j } from "../ComponentRenderer.js";
-import { TemplateRenderer as h } from "./TemplateRenderer.js";
-const C = {
+import { cn as l } from "../../../lib/utils.js";
+import { ComponentRenderer as d } from "../ComponentRenderer.js";
+import { TemplateRenderer as j } from "./TemplateRenderer.js";
+const v = {
   start: "justify-start",
   center: "justify-center",
   end: "justify-end",
@@ -13,38 +13,41 @@ const C = {
   spaceAround: "justify-around",
   spaceEvenly: "justify-evenly",
   stretch: "justify-stretch"
-}, g = {
+}, C = {
   start: "items-start",
   center: "items-center",
   end: "items-end",
   stretch: "items-stretch"
-}, v = f(function({
+}, x = f(function({
   surfaceId: o,
-  component: m
+  children: t,
+  justify: i = "start",
+  align: a = "stretch",
+  weight: s
 }) {
-  const e = m, c = u(o), { basePath: a } = y(), l = e.justify ?? "start", p = e.align ?? "stretch", r = d(
+  const p = u(o), { basePath: c } = y(), n = l(
     "flex flex-col gap-4",
-    C[l],
-    g[p]
-  ), s = e.weight ? { flexGrow: e.weight } : void 0, t = e.children;
-  return Array.isArray(t) ? /* @__PURE__ */ n("div", { className: r, style: s, children: t.map((i) => /* @__PURE__ */ n(
-    j,
+    v[i],
+    C[a]
+  ), r = s ? { flexGrow: s } : void 0;
+  return Array.isArray(t) ? /* @__PURE__ */ e("div", { className: n, style: r, children: t.map((m) => /* @__PURE__ */ e(
+    d,
     {
       surfaceId: o,
-      componentId: i
+      componentId: m
     },
-    i
-  )) }) : t && typeof t == "object" && "componentId" in t ? /* @__PURE__ */ n("div", { className: r, style: s, children: /* @__PURE__ */ n(
-    h,
+    m
+  )) }) : t && typeof t == "object" && "componentId" in t ? /* @__PURE__ */ e("div", { className: n, style: r, children: /* @__PURE__ */ e(
+    j,
     {
       surfaceId: o,
       template: t,
-      dataModel: c,
-      basePath: a
+      dataModel: p,
+      basePath: c
     }
-  ) }) : /* @__PURE__ */ n("div", { className: r, style: s });
+  ) }) : /* @__PURE__ */ e("div", { className: n, style: r });
 });
-v.displayName = "A2UI.Column";
+x.displayName = "A2UI.Column";
 export {
-  v as ColumnComponent
+  x as ColumnComponent
 };

package/dist/0.9/components/layout/ListComponent.d.ts

@@ -1,4 +1,5 @@
-import { A2UIComponentProps } from '../../contexts/ComponentsMapContext';
+import { ListComponentProps } from '@a2ui-sdk/types/0.9/standard-catalog';
+import { A2UIComponentProps } from '../types';
 /**
  * List component - displays children in a list layout.
  * Supports both static children and template binding for dynamic children.
@@ -14,4 +15,4 @@ import { A2UIComponentProps } from '../../contexts/ComponentsMapContext';
  *   children: { componentId: "item-template", path: "/items" }
  * }
  */
-export declare const ListComponent: import('react').NamedExoticComponent<A2UIComponentProps>;
+export declare const ListComponent: import('react').NamedExoticComponent<A2UIComponentProps<ListComponentProps>>;

package/dist/0.9/components/layout/ListComponent.js

@@ -1,42 +1,45 @@
-import { jsx as o } from "react/jsx-runtime";
-import { memo as d } from "react";
-import { useDataModel as f } from "../../hooks/useDataBinding.js";
-import { useScope as h } from "../../contexts/ScopeContext.js";
+import { jsx as e } from "react/jsx-runtime";
+import { memo as f } from "react";
+import { useDataModel as l } from "../../hooks/useDataBinding.js";
+import { useScope as d } from "../../contexts/ScopeContext.js";
 import { cn as x } from "../../../lib/utils.js";
-import { ComponentRenderer as g } from "../ComponentRenderer.js";
-import { TemplateRenderer as v } from "./TemplateRenderer.js";
-const y = {
+import { ComponentRenderer as v } from "../ComponentRenderer.js";
+import { TemplateRenderer as y } from "./TemplateRenderer.js";
+const u = {
   start: "items-start",
   center: "items-center",
   end: "items-end",
   stretch: "items-stretch"
-}, w = d(function({
-  surfaceId: r,
-  component: s
+}, A = f(function({
+  surfaceId: o,
+  children: t,
+  direction: i = "vertical",
+  align: p = "stretch",
+  weight: n
 }) {
-  const e = s, c = f(r), { basePath: l } = h(), a = e.direction ?? "vertical", p = e.align ?? "stretch", n = x(
+  const a = l(o), { basePath: c } = d(), r = x(
     "flex gap-3",
-    a === "vertical" ? "flex-col" : "flex-row flex-wrap",
-    y[p]
-  ), i = e.weight ? { flexGrow: e.weight } : void 0, t = e.children;
-  return Array.isArray(t) ? /* @__PURE__ */ o("div", { className: n, style: i, children: t.map((m) => /* @__PURE__ */ o(
-    g,
+    i === "vertical" ? "flex-col" : "flex-row flex-wrap",
+    u[p]
+  ), m = n ? { flexGrow: n } : void 0;
+  return Array.isArray(t) ? /* @__PURE__ */ e("div", { className: r, style: m, children: t.map((s) => /* @__PURE__ */ e(
+    v,
     {
-      surfaceId: r,
-      componentId: m
+      surfaceId: o,
+      componentId: s
     },
-    m
-  )) }) : t && typeof t == "object" && "componentId" in t ? /* @__PURE__ */ o("div", { className: n, style: i, children: /* @__PURE__ */ o(
-    v,
+    s
+  )) }) : t && typeof t == "object" && "componentId" in t ? /* @__PURE__ */ e("div", { className: r, style: m, children: /* @__PURE__ */ e(
+    y,
     {
-      surfaceId: r,
+      surfaceId: o,
       template: t,
-      dataModel: c,
-      basePath: l
+      dataModel: a,
+      basePath: c
     }
-  ) }) : /* @__PURE__ */ o("div", { className: n, style: i });
+  ) }) : /* @__PURE__ */ e("div", { className: r, style: m });
 });
-w.displayName = "A2UI.List";
+A.displayName = "A2UI.List";
 export {
-  w as ListComponent
+  A as ListComponent
 };

package/dist/0.9/components/layout/ModalComponent.d.ts

@@ -1,5 +1,6 @@
-import { A2UIComponentProps } from '../../contexts/ComponentsMapContext';
+import { ModalComponentProps } from '@a2ui-sdk/types/0.9/standard-catalog';
+import { A2UIComponentProps } from '../types';
 /**
  * Modal component - dialog container with trigger.
  */
-export declare const ModalComponent: import('react').NamedExoticComponent<A2UIComponentProps>;
+export declare const ModalComponent: import('react').NamedExoticComponent<A2UIComponentProps<ModalComponentProps>>;

package/dist/0.9/components/layout/ModalComponent.js

@@ -1,30 +1,19 @@
 import { jsxs as l, jsx as o } from "react/jsx-runtime";
 import { memo as p, useState as a } from "react";
-import { Dialog as c, DialogTrigger as d, DialogContent as s } from "../../../components/ui/dialog.js";
+import { Dialog as d, DialogTrigger as s, DialogContent as c } from "../../../components/ui/dialog.js";
 import { ComponentRenderer as t } from "../ComponentRenderer.js";
-const g = p(function({
-  surfaceId: e,
-  component: r
+const f = p(function({
+  surfaceId: n,
+  trigger: e,
+  content: r
 }) {
-  const n = r, [i, m] = a(!1);
-  return !n.trigger || !n.content ? null : /* @__PURE__ */ l(c, { open: i, onOpenChange: m, children: [
-    /* @__PURE__ */ o(d, { asChild: !0, children: /* @__PURE__ */ o("div", { className: "cursor-pointer", children: /* @__PURE__ */ o(
-      t,
-      {
-        surfaceId: e,
-        componentId: n.trigger
-      }
-    ) }) }),
-    /* @__PURE__ */ o(s, { children: /* @__PURE__ */ o(
-      t,
-      {
-        surfaceId: e,
-        componentId: n.content
-      }
-    ) })
+  const [i, m] = a(!1);
+  return !e || !r ? null : /* @__PURE__ */ l(d, { open: i, onOpenChange: m, children: [
+    /* @__PURE__ */ o(s, { asChild: !0, children: /* @__PURE__ */ o("div", { className: "cursor-pointer", children: /* @__PURE__ */ o(t, { surfaceId: n, componentId: e }) }) }),
+    /* @__PURE__ */ o(c, { children: /* @__PURE__ */ o(t, { surfaceId: n, componentId: r }) })
   ] });
 });
-g.displayName = "A2UI.Modal";
+f.displayName = "A2UI.Modal";
 export {
-  g as ModalComponent
+  f as ModalComponent
 };

package/dist/0.9/components/layout/RowComponent.d.ts

@@ -1,6 +1,7 @@
-import { A2UIComponentProps } from '../../contexts/ComponentsMapContext';
+import { RowComponentProps } from '@a2ui-sdk/types/0.9/standard-catalog';
+import { A2UIComponentProps } from '../types';
 /**
  * Row component - horizontal flex container.
  * Supports both static children and template binding for dynamic children.
  */
-export declare const RowComponent: import('react').NamedExoticComponent<A2UIComponentProps>;
+export declare const RowComponent: import('react').NamedExoticComponent<A2UIComponentProps<RowComponentProps>>;

package/dist/0.9/components/layout/RowComponent.js

@@ -1,11 +1,11 @@
-import { jsx as o } from "react/jsx-runtime";
-import { memo as l } from "react";
+import { jsx as e } from "react/jsx-runtime";
+import { memo as f } from "react";
 import { useDataModel as y } from "../../hooks/useDataBinding.js";
-import { useScope as d } from "../../contexts/ScopeContext.js";
-import { cn as u } from "../../../lib/utils.js";
-import { ComponentRenderer as j } from "../ComponentRenderer.js";
-import { TemplateRenderer as h } from "./TemplateRenderer.js";
-const w = {
+import { useScope as u } from "../../contexts/ScopeContext.js";
+import { cn as d } from "../../../lib/utils.js";
+import { ComponentRenderer as l } from "../ComponentRenderer.js";
+import { TemplateRenderer as j } from "./TemplateRenderer.js";
+const v = {
   start: "justify-start",
   center: "justify-center",
   end: "justify-end",
@@ -13,38 +13,41 @@ const w = {
   spaceAround: "justify-around",
   spaceEvenly: "justify-evenly",
   stretch: "justify-stretch"
-}, g = {
+}, w = {
   start: "items-start",
   center: "items-center",
   end: "items-end",
   stretch: "items-stretch"
-}, v = l(function({
-  surfaceId: n,
-  component: c
+}, x = f(function({
+  surfaceId: o,
+  children: t,
+  justify: i = "start",
+  align: a = "stretch",
+  weight: n
 }) {
-  const e = c, m = y(n), { basePath: a } = d(), p = e.justify ?? "start", f = e.align ?? "stretch", r = u(
+  const p = y(o), { basePath: c } = u(), r = d(
     "flex flex-row gap-3",
-    w[p],
-    g[f]
-  ), s = e.weight ? { flexGrow: e.weight } : void 0, t = e.children;
-  return Array.isArray(t) ? /* @__PURE__ */ o("div", { className: r, style: s, children: t.map((i) => /* @__PURE__ */ o(
-    j,
+    v[i],
+    w[a]
+  ), s = n ? { flexGrow: n } : void 0;
+  return Array.isArray(t) ? /* @__PURE__ */ e("div", { className: r, style: s, children: t.map((m) => /* @__PURE__ */ e(
+    l,
     {
-      surfaceId: n,
-      componentId: i
+      surfaceId: o,
+      componentId: m
     },
-    i
-  )) }) : t && typeof t == "object" && "componentId" in t ? /* @__PURE__ */ o("div", { className: r, style: s, children: /* @__PURE__ */ o(
-    h,
+    m
+  )) }) : t && typeof t == "object" && "componentId" in t ? /* @__PURE__ */ e("div", { className: r, style: s, children: /* @__PURE__ */ e(
+    j,
     {
-      surfaceId: n,
+      surfaceId: o,
       template: t,
-      dataModel: m,
-      basePath: a
+      dataModel: p,
+      basePath: c
     }
-  ) }) : /* @__PURE__ */ o("div", { className: r, style: s });
+  ) }) : /* @__PURE__ */ e("div", { className: r, style: s });
 });
-v.displayName = "A2UI.Row";
+x.displayName = "A2UI.Row";
 export {
-  v as RowComponent
+  x as RowComponent
 };

package/dist/0.9/components/layout/TabsComponent.d.ts

@@ -1,5 +1,6 @@
-import { A2UIComponentProps } from '../../contexts/ComponentsMapContext';
+import { TabsComponentProps } from '@a2ui-sdk/types/0.9/standard-catalog';
+import { A2UIComponentProps } from '../types';
 /**
  * Tabs component - tabbed content container.
  */
-export declare const TabsComponent: import('react').NamedExoticComponent<A2UIComponentProps>;
+export declare const TabsComponent: import('react').NamedExoticComponent<A2UIComponentProps<TabsComponentProps>>;

package/dist/0.9/components/layout/TabsComponent.js

@@ -1,30 +1,30 @@
-import { jsxs as m, jsx as n, Fragment as d } from "react/jsx-runtime";
-import { memo as h } from "react";
+import { jsxs as d, jsx as l, Fragment as m } from "react/jsx-runtime";
+import { memo as s } from "react";
 import { useStringBinding as p } from "../../hooks/useDataBinding.js";
-import { Tabs as b, TabsList as T, TabsTrigger as u, TabsContent as f } from "../../../components/ui/tabs.js";
-import { ComponentRenderer as g } from "../ComponentRenderer.js";
-function x({
-  surfaceId: r,
-  title: l,
-  index: i
+import { Tabs as T, TabsList as u, TabsTrigger as f, TabsContent as h } from "../../../components/ui/tabs.js";
+import { ComponentRenderer as b } from "../ComponentRenderer.js";
+function g({
+  surfaceId: t,
+  title: o,
+  index: n
 }) {
-  const e = p(r, l, `Tab ${i + 1}`);
-  return /* @__PURE__ */ n(d, { children: e });
+  const r = p(t, o, `Tab ${n + 1}`);
+  return /* @__PURE__ */ l(m, { children: r });
 }
-const C = h(function({
-  surfaceId: l,
-  component: i
+const x = s(function({
+  surfaceId: o,
+  tabs: n,
+  weight: r
 }) {
-  const e = i, o = e.tabs;
-  if (!o || o.length === 0)
+  if (!n || n.length === 0)
     return null;
-  const a = e.weight ? { flexGrow: e.weight } : void 0, s = o[0].child;
-  return /* @__PURE__ */ m(b, { defaultValue: s, className: "w-full", style: a, children: [
-    /* @__PURE__ */ n(T, { children: o.map((t, c) => /* @__PURE__ */ n(u, { value: t.child, children: /* @__PURE__ */ n(x, { surfaceId: l, title: t.title, index: c }) }, t.child)) }),
-    o.map((t) => /* @__PURE__ */ n(f, { value: t.child, children: /* @__PURE__ */ n(g, { surfaceId: l, componentId: t.child }) }, t.child))
+  const i = r ? { flexGrow: r } : void 0, c = n[0].child;
+  return /* @__PURE__ */ d(T, { defaultValue: c, className: "w-full", style: i, children: [
+    /* @__PURE__ */ l(u, { children: n.map((e, a) => /* @__PURE__ */ l(f, { value: e.child, children: /* @__PURE__ */ l(g, { surfaceId: o, title: e.title, index: a }) }, e.child)) }),
+    n.map((e) => /* @__PURE__ */ l(h, { value: e.child, children: /* @__PURE__ */ l(b, { surfaceId: o, componentId: e.child }) }, e.child))
   ] });
 });
-C.displayName = "A2UI.Tabs";
+x.displayName = "A2UI.Tabs";
 export {
-  C as TabsComponent
+  x as TabsComponent
 };

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

@@ -0,0 +1,8 @@
+/**
+ * Base props shared by all A2UI components.
+ */
+export type A2UIComponentProps<T = unknown> = T & {
+    surfaceId: string;
+    componentId: string;
+    weight?: number;
+};