@a2ui-sdk/react 0.1.1 → 0.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/0.8/components/ComponentRenderer.d.ts +1 -19
- package/dist/0.8/components/ComponentRenderer.js +21 -63
- package/dist/0.8/components/UnknownComponent.d.ts +3 -3
- package/dist/0.8/components/display/AudioPlayerComponent.d.ts +3 -2
- package/dist/0.8/components/display/DividerComponent.d.ts +3 -2
- package/dist/0.8/components/display/IconComponent.d.ts +3 -2
- package/dist/0.8/components/display/ImageComponent.d.ts +3 -2
- package/dist/0.8/components/display/TextComponent.d.ts +3 -2
- package/dist/0.8/components/display/VideoComponent.d.ts +3 -2
- package/dist/0.8/components/index.d.ts +1 -1
- package/dist/0.8/components/interactive/ButtonComponent.d.ts +3 -2
- package/dist/0.8/components/interactive/CheckBoxComponent.d.ts +3 -2
- package/dist/0.8/components/interactive/DateTimeInputComponent.d.ts +3 -2
- package/dist/0.8/components/interactive/MultipleChoiceComponent.d.ts +3 -2
- package/dist/0.8/components/interactive/SliderComponent.d.ts +3 -2
- package/dist/0.8/components/interactive/TextFieldComponent.d.ts +3 -2
- package/dist/0.8/components/layout/CardComponent.d.ts +3 -2
- package/dist/0.8/components/layout/ColumnComponent.d.ts +3 -2
- package/dist/0.8/components/layout/ListComponent.d.ts +3 -2
- package/dist/0.8/components/layout/ModalComponent.d.ts +3 -2
- package/dist/0.8/components/layout/RowComponent.d.ts +3 -2
- package/dist/0.8/components/layout/TabsComponent.d.ts +3 -2
- package/dist/0.8/components/types.d.ts +8 -0
- package/dist/0.8/contexts/A2UIProvider.d.ts +37 -23
- package/dist/0.8/contexts/A2UIProvider.js +16 -22
- package/dist/0.8/contexts/ActionContext.js +5 -5
- package/dist/0.8/contexts/ComponentsMapContext.d.ts +8 -21
- package/dist/0.8/contexts/ComponentsMapContext.js +12 -16
- package/dist/0.8/contexts/DataModelContext.js +3 -3
- package/dist/0.8/index.d.ts +3 -1
- package/dist/0.8/index.js +11 -9
- package/dist/0.8/standard-catalog/index.d.ts +57 -0
- package/dist/0.8/standard-catalog/index.js +66 -0
- package/dist/0.9/A2UIRenderer.d.ts +9 -29
- package/dist/0.9/A2UIRenderer.js +27 -26
- package/dist/0.9/components/ComponentRenderer.d.ts +5 -19
- package/dist/0.9/components/ComponentRenderer.js +30 -17
- package/dist/0.9/components/UnknownComponent.d.ts +8 -2
- package/dist/0.9/components/UnknownComponent.js +13 -11
- package/dist/0.9/components/display/AudioPlayerComponent.d.ts +3 -2
- package/dist/0.9/components/display/AudioPlayerComponent.js +16 -14
- package/dist/0.9/components/display/DividerComponent.d.ts +3 -2
- package/dist/0.9/components/display/DividerComponent.js +4 -5
- package/dist/0.9/components/display/IconComponent.d.ts +3 -2
- package/dist/0.9/components/display/IconComponent.js +12 -12
- package/dist/0.9/components/display/ImageComponent.d.ts +3 -2
- package/dist/0.9/components/display/ImageComponent.js +18 -15
- package/dist/0.9/components/display/TextComponent.d.ts +3 -2
- package/dist/0.9/components/display/TextComponent.js +10 -8
- package/dist/0.9/components/display/VideoComponent.d.ts +3 -2
- package/dist/0.9/components/display/VideoComponent.js +7 -6
- package/dist/0.9/components/index.d.ts +4 -8
- package/dist/0.9/components/interactive/ButtonComponent.d.ts +3 -2
- package/dist/0.9/components/interactive/ButtonComponent.js +25 -20
- package/dist/0.9/components/interactive/CheckBoxComponent.d.ts +3 -2
- package/dist/0.9/components/interactive/CheckBoxComponent.js +33 -29
- package/dist/0.9/components/interactive/ChoicePickerComponent.d.ts +3 -2
- package/dist/0.9/components/interactive/ChoicePickerComponent.js +59 -53
- package/dist/0.9/components/interactive/DateTimeInputComponent.d.ts +3 -2
- package/dist/0.9/components/interactive/DateTimeInputComponent.js +32 -26
- package/dist/0.9/components/interactive/SliderComponent.d.ts +3 -2
- package/dist/0.9/components/interactive/SliderComponent.js +38 -32
- package/dist/0.9/components/interactive/TextFieldComponent.d.ts +3 -2
- package/dist/0.9/components/interactive/TextFieldComponent.js +41 -40
- package/dist/0.9/components/layout/CardComponent.d.ts +3 -2
- package/dist/0.9/components/layout/CardComponent.js +11 -10
- package/dist/0.9/components/layout/ColumnComponent.d.ts +3 -2
- package/dist/0.9/components/layout/ColumnComponent.js +26 -23
- package/dist/0.9/components/layout/ListComponent.d.ts +3 -2
- package/dist/0.9/components/layout/ListComponent.js +30 -27
- package/dist/0.9/components/layout/ModalComponent.d.ts +3 -2
- package/dist/0.9/components/layout/ModalComponent.js +11 -22
- package/dist/0.9/components/layout/RowComponent.d.ts +3 -2
- package/dist/0.9/components/layout/RowComponent.js +31 -28
- package/dist/0.9/components/layout/TabsComponent.d.ts +3 -2
- package/dist/0.9/components/layout/TabsComponent.js +21 -21
- package/dist/0.9/components/types.d.ts +8 -0
- package/dist/0.9/contexts/A2UIProvider.d.ts +45 -28
- package/dist/0.9/contexts/A2UIProvider.js +18 -26
- package/dist/0.9/contexts/ActionContext.js +5 -5
- package/dist/0.9/contexts/ComponentsMapContext.d.ts +8 -31
- package/dist/0.9/contexts/ComponentsMapContext.js +12 -16
- package/dist/0.9/contexts/ScopeContext.js +3 -3
- package/dist/0.9/contexts/SurfaceContext.d.ts +3 -3
- package/dist/0.9/contexts/SurfaceContext.js +3 -3
- package/dist/0.9/hooks/useComponent.d.ts +2 -2
- package/dist/0.9/hooks/useDataBinding.js +3 -3
- package/dist/0.9/index.d.ts +6 -4
- package/dist/0.9/index.js +12 -10
- package/dist/0.9/standard-catalog/index.d.ts +61 -0
- package/dist/0.9/standard-catalog/index.js +69 -0
- package/dist/components/ui/button.d.ts +1 -1
- package/dist/lib/utils.d.ts +5 -0
- package/dist/lib/utils.js +6 -4
- package/package.json +13 -4
- package/dist/0.9/components/index.js +0 -68
|
@@ -1,9 +1,6 @@
|
|
|
1
|
-
import { ComponentType } from 'react';
|
|
2
|
-
import { BaseComponentProps } from '@a2ui-sdk/types/0.8';
|
|
3
1
|
/**
|
|
4
|
-
*
|
|
2
|
+
* ComponentRenderer - Routes component rendering based on type.
|
|
5
3
|
*/
|
|
6
|
-
export declare const componentRegistry: Record<string, ComponentType<BaseComponentProps & Record<string, unknown>>>;
|
|
7
4
|
/**
|
|
8
5
|
* Props for ComponentRenderer.
|
|
9
6
|
*/
|
|
@@ -22,18 +19,3 @@ export interface ComponentRendererProps {
|
|
|
22
19
|
* ```
|
|
23
20
|
*/
|
|
24
21
|
export declare const ComponentRenderer: import('react').NamedExoticComponent<ComponentRendererProps>;
|
|
25
|
-
/**
|
|
26
|
-
* Registers a custom component type.
|
|
27
|
-
*
|
|
28
|
-
* @param type - The component type name
|
|
29
|
-
* @param component - The React component to register
|
|
30
|
-
*
|
|
31
|
-
* @example
|
|
32
|
-
* ```tsx
|
|
33
|
-
* registerComponent('CustomChart', ({ surfaceId, data }) => {
|
|
34
|
-
* const chartData = useDataBinding(surfaceId, data, []);
|
|
35
|
-
* return <Chart data={chartData} />;
|
|
36
|
-
* });
|
|
37
|
-
* ```
|
|
38
|
-
*/
|
|
39
|
-
export declare function registerComponent(type: string, component: ComponentType<BaseComponentProps & Record<string, unknown>>): void;
|
|
@@ -1,76 +1,34 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { memo as
|
|
3
|
-
import { useComponent as
|
|
1
|
+
import { jsx as i } from "react/jsx-runtime";
|
|
2
|
+
import { memo as c, useContext as C } from "react";
|
|
3
|
+
import { useComponent as l } from "../hooks/useComponent.js";
|
|
4
4
|
import { ComponentsMapContext as u } from "../contexts/ComponentsMapContext.js";
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
import { VideoComponent as x } from "./display/VideoComponent.js";
|
|
9
|
-
import { AudioPlayerComponent as T } from "./display/AudioPlayerComponent.js";
|
|
10
|
-
import { DividerComponent as h } from "./display/DividerComponent.js";
|
|
11
|
-
import { RowComponent as w } from "./layout/RowComponent.js";
|
|
12
|
-
import { ColumnComponent as g } from "./layout/ColumnComponent.js";
|
|
13
|
-
import { ListComponent as y } from "./layout/ListComponent.js";
|
|
14
|
-
import { CardComponent as A } from "./layout/CardComponent.js";
|
|
15
|
-
import { TabsComponent as M } from "./layout/TabsComponent.js";
|
|
16
|
-
import { ModalComponent as R } from "./layout/ModalComponent.js";
|
|
17
|
-
import { ButtonComponent as I } from "./interactive/ButtonComponent.js";
|
|
18
|
-
import { CheckBoxComponent as U } from "./interactive/CheckBoxComponent.js";
|
|
19
|
-
import { TextFieldComponent as B } from "./interactive/TextFieldComponent.js";
|
|
20
|
-
import { DateTimeInputComponent as D } from "./interactive/DateTimeInputComponent.js";
|
|
21
|
-
import { MultipleChoiceComponent as $ } from "./interactive/MultipleChoiceComponent.js";
|
|
22
|
-
import { SliderComponent as b } from "./interactive/SliderComponent.js";
|
|
23
|
-
const k = {
|
|
24
|
-
// Display components
|
|
25
|
-
Text: a,
|
|
26
|
-
Image: c,
|
|
27
|
-
Icon: d,
|
|
28
|
-
Video: x,
|
|
29
|
-
AudioPlayer: T,
|
|
30
|
-
Divider: h,
|
|
31
|
-
// Layout components
|
|
32
|
-
Row: w,
|
|
33
|
-
Column: g,
|
|
34
|
-
List: y,
|
|
35
|
-
Card: A,
|
|
36
|
-
Tabs: M,
|
|
37
|
-
Modal: R,
|
|
38
|
-
// Interactive components
|
|
39
|
-
Button: I,
|
|
40
|
-
CheckBox: U,
|
|
41
|
-
TextField: B,
|
|
42
|
-
DateTimeInput: D,
|
|
43
|
-
MultipleChoice: $,
|
|
44
|
-
Slider: b
|
|
45
|
-
}, j = f(function({
|
|
46
|
-
surfaceId: t,
|
|
47
|
-
componentId: o
|
|
5
|
+
const f = c(function({
|
|
6
|
+
surfaceId: o,
|
|
7
|
+
componentId: n
|
|
48
8
|
}) {
|
|
49
|
-
const e =
|
|
9
|
+
const e = l(o, n), m = C(u);
|
|
50
10
|
if (!e)
|
|
51
11
|
return console.warn(
|
|
52
|
-
`A2UI: Component not found: ${
|
|
12
|
+
`A2UI: Component not found: ${n} on surface ${o}`
|
|
53
13
|
), null;
|
|
54
|
-
const
|
|
55
|
-
if (
|
|
56
|
-
return console.warn(`A2UI: Component ${
|
|
57
|
-
const [
|
|
58
|
-
|
|
59
|
-
return r ? n = r.getComponent(m) : n = k[m], n ? (
|
|
14
|
+
const t = Object.entries(e.component);
|
|
15
|
+
if (t.length === 0)
|
|
16
|
+
return console.warn(`A2UI: Component ${n} has no type definition`), null;
|
|
17
|
+
const [r, s] = t[0], p = m?.getComponent(r);
|
|
18
|
+
return p ? (
|
|
60
19
|
// eslint-disable-next-line react-hooks/static-components
|
|
61
|
-
/* @__PURE__ */
|
|
62
|
-
|
|
20
|
+
/* @__PURE__ */ i(
|
|
21
|
+
p,
|
|
63
22
|
{
|
|
64
|
-
surfaceId:
|
|
65
|
-
componentId:
|
|
23
|
+
surfaceId: o,
|
|
24
|
+
componentId: n,
|
|
66
25
|
weight: e.weight,
|
|
67
|
-
...
|
|
26
|
+
...s
|
|
68
27
|
}
|
|
69
28
|
)
|
|
70
|
-
) : (console.warn(`A2UI: Unknown component type: ${
|
|
29
|
+
) : (console.warn(`A2UI: Unknown component type: ${r}`), null);
|
|
71
30
|
});
|
|
72
|
-
|
|
31
|
+
f.displayName = "A2UI.ComponentRenderer";
|
|
73
32
|
export {
|
|
74
|
-
|
|
75
|
-
k as componentRegistry
|
|
33
|
+
f as ComponentRenderer
|
|
76
34
|
};
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { A2UIComponentProps } from './types';
|
|
2
2
|
/**
|
|
3
3
|
* Props for UnknownComponent.
|
|
4
4
|
*/
|
|
5
|
-
export interface UnknownComponentProps
|
|
5
|
+
export interface UnknownComponentProps {
|
|
6
6
|
/** The unknown component type name */
|
|
7
7
|
componentType: string;
|
|
8
8
|
}
|
|
@@ -12,7 +12,7 @@ export interface UnknownComponentProps extends BaseComponentProps {
|
|
|
12
12
|
* Displays a warning box with the unknown component type name
|
|
13
13
|
* to help developers identify configuration issues.
|
|
14
14
|
*/
|
|
15
|
-
export declare function UnknownComponent({ componentId, componentType, }: UnknownComponentProps): import("react/jsx-runtime").JSX.Element;
|
|
15
|
+
export declare function UnknownComponent({ componentId, componentType, }: A2UIComponentProps<UnknownComponentProps>): import("react/jsx-runtime").JSX.Element;
|
|
16
16
|
export declare namespace UnknownComponent {
|
|
17
17
|
var displayName: string;
|
|
18
18
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { AudioPlayerComponentProps } from '@a2ui-sdk/types/0.8';
|
|
1
|
+
import { AudioPlayerComponentProps } from '@a2ui-sdk/types/0.8/standard-catalog';
|
|
2
|
+
import { A2UIComponentProps } from '../types';
|
|
2
3
|
/**
|
|
3
4
|
* AudioPlayer component for playing audio content.
|
|
4
5
|
*/
|
|
5
|
-
export declare const AudioPlayerComponent: import('react').NamedExoticComponent<AudioPlayerComponentProps
|
|
6
|
+
export declare const AudioPlayerComponent: import('react').NamedExoticComponent<A2UIComponentProps<AudioPlayerComponentProps>>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { DividerComponentProps } from '@a2ui-sdk/types/0.8';
|
|
1
|
+
import { DividerComponentProps } from '@a2ui-sdk/types/0.8/standard-catalog';
|
|
2
|
+
import { A2UIComponentProps } from '../types';
|
|
2
3
|
/**
|
|
3
4
|
* Divider component for visual separation.
|
|
4
5
|
*/
|
|
5
|
-
export declare const DividerComponent: import('react').NamedExoticComponent<DividerComponentProps
|
|
6
|
+
export declare const DividerComponent: import('react').NamedExoticComponent<A2UIComponentProps<DividerComponentProps>>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { IconComponentProps } from '@a2ui-sdk/types/0.8';
|
|
1
|
+
import { IconComponentProps } from '@a2ui-sdk/types/0.8/standard-catalog';
|
|
2
|
+
import { A2UIComponentProps } from '../types';
|
|
2
3
|
/**
|
|
3
4
|
* Icon component for displaying icons from the A2UI icon set.
|
|
4
5
|
*/
|
|
5
|
-
export declare const IconComponent: import('react').NamedExoticComponent<IconComponentProps
|
|
6
|
+
export declare const IconComponent: import('react').NamedExoticComponent<A2UIComponentProps<IconComponentProps>>;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
import { ImageComponentProps } from '@a2ui-sdk/types/0.8';
|
|
1
|
+
import { ImageComponentProps } from '@a2ui-sdk/types/0.8/standard-catalog';
|
|
2
|
+
import { A2UIComponentProps } from '../types';
|
|
2
3
|
/**
|
|
3
4
|
* Image component for displaying images.
|
|
4
5
|
* Supports different sizes via usageHint and object-fit via fit property.
|
|
5
6
|
*/
|
|
6
|
-
export declare const ImageComponent: import('react').NamedExoticComponent<ImageComponentProps
|
|
7
|
+
export declare const ImageComponent: import('react').NamedExoticComponent<A2UIComponentProps<ImageComponentProps>>;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
import { TextComponentProps } from '@a2ui-sdk/types/0.8';
|
|
1
|
+
import { TextComponentProps } from '@a2ui-sdk/types/0.8/standard-catalog';
|
|
2
|
+
import { A2UIComponentProps } from '../types';
|
|
2
3
|
/**
|
|
3
4
|
* Text component for displaying text content.
|
|
4
5
|
* Supports basic Markdown formatting and different text styles via usageHint.
|
|
5
6
|
*/
|
|
6
|
-
export declare const TextComponent: import('react').NamedExoticComponent<TextComponentProps
|
|
7
|
+
export declare const TextComponent: import('react').NamedExoticComponent<A2UIComponentProps<TextComponentProps>>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { VideoComponentProps } from '@a2ui-sdk/types/0.8';
|
|
1
|
+
import { VideoComponentProps } from '@a2ui-sdk/types/0.8/standard-catalog';
|
|
2
|
+
import { A2UIComponentProps } from '../types';
|
|
2
3
|
/**
|
|
3
4
|
* Video component for displaying video content.
|
|
4
5
|
*/
|
|
5
|
-
export declare const VideoComponent: import('react').NamedExoticComponent<VideoComponentProps
|
|
6
|
+
export declare const VideoComponent: import('react').NamedExoticComponent<A2UIComponentProps<VideoComponentProps>>;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* A2UI SDK for React - Components Exports
|
|
3
3
|
*/
|
|
4
|
-
export { ComponentRenderer
|
|
4
|
+
export { ComponentRenderer } from './ComponentRenderer';
|
|
5
5
|
export * from './display';
|
|
6
6
|
export * from './layout';
|
|
7
7
|
export * from './interactive';
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { ButtonComponentProps } from '@a2ui-sdk/types/0.8';
|
|
1
|
+
import { ButtonComponentProps } from '@a2ui-sdk/types/0.8/standard-catalog';
|
|
2
|
+
import { A2UIComponentProps } from '../types';
|
|
2
3
|
/**
|
|
3
4
|
* Button component - triggers actions on click.
|
|
4
5
|
*/
|
|
5
|
-
export declare const ButtonComponent: import('react').NamedExoticComponent<ButtonComponentProps
|
|
6
|
+
export declare const ButtonComponent: import('react').NamedExoticComponent<A2UIComponentProps<ButtonComponentProps>>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { CheckBoxComponentProps } from '@a2ui-sdk/types/0.8';
|
|
1
|
+
import { CheckBoxComponentProps } from '@a2ui-sdk/types/0.8/standard-catalog';
|
|
2
|
+
import { A2UIComponentProps } from '../types';
|
|
2
3
|
/**
|
|
3
4
|
* CheckBox component - checkbox input with label.
|
|
4
5
|
*/
|
|
5
|
-
export declare const CheckBoxComponent: import('react').NamedExoticComponent<CheckBoxComponentProps
|
|
6
|
+
export declare const CheckBoxComponent: import('react').NamedExoticComponent<A2UIComponentProps<CheckBoxComponentProps>>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { DateTimeInputComponentProps } from '@a2ui-sdk/types/0.8';
|
|
1
|
+
import { DateTimeInputComponentProps } from '@a2ui-sdk/types/0.8/standard-catalog';
|
|
2
|
+
import { A2UIComponentProps } from '../types';
|
|
2
3
|
/**
|
|
3
4
|
* DateTimeInput component - date/time picker using native HTML5 inputs.
|
|
4
5
|
*/
|
|
5
|
-
export declare const DateTimeInputComponent: import('react').NamedExoticComponent<DateTimeInputComponentProps
|
|
6
|
+
export declare const DateTimeInputComponent: import('react').NamedExoticComponent<A2UIComponentProps<DateTimeInputComponentProps>>;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import { MultipleChoiceComponentProps } from '@a2ui-sdk/types/0.8';
|
|
1
|
+
import { MultipleChoiceComponentProps } from '@a2ui-sdk/types/0.8/standard-catalog';
|
|
2
|
+
import { A2UIComponentProps } from '../types';
|
|
2
3
|
/**
|
|
3
4
|
* MultipleChoice component - dropdown/select input.
|
|
4
5
|
* When maxAllowedSelections === 1, renders as a dropdown.
|
|
5
6
|
* When maxAllowedSelections > 1 or undefined, renders as checkboxes for multi-select.
|
|
6
7
|
*/
|
|
7
|
-
export declare const MultipleChoiceComponent: import('react').NamedExoticComponent<MultipleChoiceComponentProps
|
|
8
|
+
export declare const MultipleChoiceComponent: import('react').NamedExoticComponent<A2UIComponentProps<MultipleChoiceComponentProps>>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { SliderComponentProps } from '@a2ui-sdk/types/0.8';
|
|
1
|
+
import { SliderComponentProps } from '@a2ui-sdk/types/0.8/standard-catalog';
|
|
2
|
+
import { A2UIComponentProps } from '../types';
|
|
2
3
|
/**
|
|
3
4
|
* Slider component - range slider input.
|
|
4
5
|
*/
|
|
5
|
-
export declare const SliderComponent: import('react').NamedExoticComponent<SliderComponentProps
|
|
6
|
+
export declare const SliderComponent: import('react').NamedExoticComponent<A2UIComponentProps<SliderComponentProps>>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { TextFieldComponentProps } from '@a2ui-sdk/types/0.8';
|
|
1
|
+
import { TextFieldComponentProps } from '@a2ui-sdk/types/0.8/standard-catalog';
|
|
2
|
+
import { A2UIComponentProps } from '../types';
|
|
2
3
|
/**
|
|
3
4
|
* TextField component - text input with label.
|
|
4
5
|
*/
|
|
5
|
-
export declare const TextFieldComponent: import('react').NamedExoticComponent<TextFieldComponentProps
|
|
6
|
+
export declare const TextFieldComponent: import('react').NamedExoticComponent<A2UIComponentProps<TextFieldComponentProps>>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { CardComponentProps } from '@a2ui-sdk/types/0.8';
|
|
1
|
+
import { CardComponentProps } from '@a2ui-sdk/types/0.8/standard-catalog';
|
|
2
|
+
import { A2UIComponentProps } from '../types';
|
|
2
3
|
/**
|
|
3
4
|
* Card component - container with card styling.
|
|
4
5
|
*/
|
|
5
|
-
export declare const CardComponent: import('react').NamedExoticComponent<CardComponentProps
|
|
6
|
+
export declare const CardComponent: import('react').NamedExoticComponent<A2UIComponentProps<CardComponentProps>>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { ColumnComponentProps } from '@a2ui-sdk/types/0.8';
|
|
1
|
+
import { ColumnComponentProps } from '@a2ui-sdk/types/0.8/standard-catalog';
|
|
2
|
+
import { A2UIComponentProps } from '../types';
|
|
2
3
|
/**
|
|
3
4
|
* Column component - vertical flex container.
|
|
4
5
|
*/
|
|
5
|
-
export declare const ColumnComponent: import('react').NamedExoticComponent<ColumnComponentProps
|
|
6
|
+
export declare const ColumnComponent: import('react').NamedExoticComponent<A2UIComponentProps<ColumnComponentProps>>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { ListComponentProps } from '@a2ui-sdk/types/0.8';
|
|
1
|
+
import { ListComponentProps } from '@a2ui-sdk/types/0.8/standard-catalog';
|
|
2
|
+
import { A2UIComponentProps } from '../types';
|
|
2
3
|
/**
|
|
3
4
|
* List component - container for list items.
|
|
4
5
|
*/
|
|
5
|
-
export declare const ListComponent: import('react').NamedExoticComponent<ListComponentProps
|
|
6
|
+
export declare const ListComponent: import('react').NamedExoticComponent<A2UIComponentProps<ListComponentProps>>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { ModalComponentProps } from '@a2ui-sdk/types/0.8';
|
|
1
|
+
import { ModalComponentProps } from '@a2ui-sdk/types/0.8/standard-catalog';
|
|
2
|
+
import { A2UIComponentProps } from '../types';
|
|
2
3
|
/**
|
|
3
4
|
* Modal component - dialog container with trigger.
|
|
4
5
|
*/
|
|
5
|
-
export declare const ModalComponent: import('react').NamedExoticComponent<ModalComponentProps
|
|
6
|
+
export declare const ModalComponent: import('react').NamedExoticComponent<A2UIComponentProps<ModalComponentProps>>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { RowComponentProps } from '@a2ui-sdk/types/0.8';
|
|
1
|
+
import { RowComponentProps } from '@a2ui-sdk/types/0.8/standard-catalog';
|
|
2
|
+
import { A2UIComponentProps } from '../types';
|
|
2
3
|
/**
|
|
3
4
|
* Row component - horizontal flex container.
|
|
4
5
|
*/
|
|
5
|
-
export declare const RowComponent: import('react').NamedExoticComponent<RowComponentProps
|
|
6
|
+
export declare const RowComponent: import('react').NamedExoticComponent<A2UIComponentProps<RowComponentProps>>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { TabsComponentProps } from '@a2ui-sdk/types/0.8';
|
|
1
|
+
import { TabsComponentProps } from '@a2ui-sdk/types/0.8/standard-catalog';
|
|
2
|
+
import { A2UIComponentProps } from '../types';
|
|
2
3
|
/**
|
|
3
4
|
* Tabs component - tabbed content container.
|
|
4
5
|
*/
|
|
5
|
-
export declare const TabsComponent: import('react').NamedExoticComponent<TabsComponentProps
|
|
6
|
+
export declare const TabsComponent: import('react').NamedExoticComponent<A2UIComponentProps<TabsComponentProps>>;
|
|
@@ -1,17 +1,26 @@
|
|
|
1
|
-
import { ReactNode
|
|
2
|
-
import { A2UIMessage
|
|
3
|
-
|
|
4
|
-
* Type for custom component map.
|
|
5
|
-
*/
|
|
6
|
-
export type ComponentsMap = Map<string, ComponentType<BaseComponentProps & Record<string, unknown>>>;
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { A2UIMessage } from '@a2ui-sdk/types/0.8';
|
|
3
|
+
import { Catalog } from '../standard-catalog';
|
|
7
4
|
/**
|
|
8
5
|
* Props for A2UIProvider.
|
|
9
6
|
*/
|
|
10
7
|
export interface A2UIProviderProps {
|
|
11
8
|
/** Array of A2UI messages to render */
|
|
12
9
|
messages: A2UIMessage[];
|
|
13
|
-
/**
|
|
14
|
-
|
|
10
|
+
/**
|
|
11
|
+
* Catalog containing components and functions.
|
|
12
|
+
* Use `standardCatalog` from '@a2ui-sdk/react/0.8/standard-catalog' as base.
|
|
13
|
+
*
|
|
14
|
+
* @example
|
|
15
|
+
* ```tsx
|
|
16
|
+
* // Extend standard catalog
|
|
17
|
+
* const catalog = {
|
|
18
|
+
* ...standardCatalog,
|
|
19
|
+
* components: { ...standardCatalog.components, Custom: MyComponent },
|
|
20
|
+
* }
|
|
21
|
+
* ```
|
|
22
|
+
*/
|
|
23
|
+
catalog?: Catalog;
|
|
15
24
|
children: ReactNode;
|
|
16
25
|
}
|
|
17
26
|
/**
|
|
@@ -24,33 +33,38 @@ export interface A2UIProviderProps {
|
|
|
24
33
|
*
|
|
25
34
|
* @param props - Component props
|
|
26
35
|
* @param props.messages - Array of A2UI messages to render
|
|
27
|
-
* @param props.
|
|
36
|
+
* @param props.catalog - Catalog containing components and functions
|
|
28
37
|
* @param props.children - Child components (typically A2UIRenderer)
|
|
29
38
|
*
|
|
30
39
|
* @example
|
|
31
40
|
* ```tsx
|
|
32
|
-
*
|
|
41
|
+
* import { standardCatalog } from '@a2ui-sdk/react/0.8/standard-catalog'
|
|
42
|
+
*
|
|
43
|
+
* // Basic usage (uses standard catalog by default)
|
|
33
44
|
* <A2UIProvider messages={messages}>
|
|
34
45
|
* <A2UIRenderer onAction={handleAction} />
|
|
35
46
|
* </A2UIProvider>
|
|
36
47
|
*
|
|
37
|
-
* // With
|
|
38
|
-
* const
|
|
39
|
-
*
|
|
40
|
-
*
|
|
41
|
-
*
|
|
42
|
-
*
|
|
43
|
-
*
|
|
44
|
-
*
|
|
45
|
-
* >
|
|
48
|
+
* // With extended catalog
|
|
49
|
+
* const extendedCatalog = {
|
|
50
|
+
* ...standardCatalog,
|
|
51
|
+
* components: {
|
|
52
|
+
* ...standardCatalog.components,
|
|
53
|
+
* CustomChart: MyChartComponent,
|
|
54
|
+
* },
|
|
55
|
+
* }
|
|
56
|
+
* <A2UIProvider messages={messages} catalog={extendedCatalog}>
|
|
46
57
|
* <A2UIRenderer onAction={handleAction} />
|
|
47
58
|
* </A2UIProvider>
|
|
48
59
|
*
|
|
49
|
-
* // With custom
|
|
50
|
-
*
|
|
51
|
-
*
|
|
60
|
+
* // With completely custom catalog
|
|
61
|
+
* const customCatalog = {
|
|
62
|
+
* components: { Text: MyTextComponent },
|
|
63
|
+
* functions: {},
|
|
64
|
+
* }
|
|
65
|
+
* <A2UIProvider messages={messages} catalog={customCatalog}>
|
|
52
66
|
* <A2UIRenderer onAction={handleAction} />
|
|
53
67
|
* </A2UIProvider>
|
|
54
68
|
* ```
|
|
55
69
|
*/
|
|
56
|
-
export declare function A2UIProvider({ messages,
|
|
70
|
+
export declare function A2UIProvider({ messages, catalog, children, }: A2UIProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,32 +1,26 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { useEffect as
|
|
3
|
-
import { SurfaceProvider as
|
|
4
|
-
import { DataModelProvider as
|
|
5
|
-
import { ComponentsMapProvider as
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
1
|
+
import { jsx as o, Fragment as i } from "react/jsx-runtime";
|
|
2
|
+
import { useEffect as s } from "react";
|
|
3
|
+
import { SurfaceProvider as a } from "./SurfaceContext.js";
|
|
4
|
+
import { DataModelProvider as f } from "./DataModelContext.js";
|
|
5
|
+
import { ComponentsMapProvider as c } from "./ComponentsMapContext.js";
|
|
6
|
+
import { useA2UIMessageHandler as m } from "../hooks/useA2UIMessageHandler.js";
|
|
7
|
+
import { standardCatalog as p } from "../standard-catalog/index.js";
|
|
8
8
|
function d({
|
|
9
9
|
messages: r,
|
|
10
|
-
children:
|
|
10
|
+
children: n
|
|
11
11
|
}) {
|
|
12
|
-
const { processMessages:
|
|
13
|
-
return
|
|
14
|
-
|
|
15
|
-
}, [r,
|
|
12
|
+
const { processMessages: e, clear: t } = m();
|
|
13
|
+
return s(() => {
|
|
14
|
+
t(), r && r.length > 0 && e(r);
|
|
15
|
+
}, [r, e, t]), /* @__PURE__ */ o(i, { children: n });
|
|
16
16
|
}
|
|
17
17
|
function A({
|
|
18
18
|
messages: r,
|
|
19
|
-
|
|
20
|
-
children:
|
|
19
|
+
catalog: n,
|
|
20
|
+
children: e
|
|
21
21
|
}) {
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
{
|
|
25
|
-
components: t,
|
|
26
|
-
defaultComponents: c,
|
|
27
|
-
children: /* @__PURE__ */ e(d, { messages: r ?? [], children: o })
|
|
28
|
-
}
|
|
29
|
-
) }) });
|
|
22
|
+
const t = r ?? [];
|
|
23
|
+
return /* @__PURE__ */ o(a, { children: /* @__PURE__ */ o(f, { children: /* @__PURE__ */ o(c, { components: (n ?? p).components, children: /* @__PURE__ */ o(d, { messages: t, children: e }) }) }) });
|
|
30
24
|
}
|
|
31
25
|
export {
|
|
32
26
|
A as A2UIProvider
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { jsx as m } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
2
|
+
import { useCallback as x, useMemo as C, createContext as p, useContext as f } from "react";
|
|
3
3
|
import { useDataModelContext as v } from "./DataModelContext.js";
|
|
4
4
|
import { resolveActionContext as A } from "@a2ui-sdk/utils/0.8";
|
|
5
|
-
const s =
|
|
5
|
+
const s = p(null);
|
|
6
6
|
function P({ onAction: t, children: c }) {
|
|
7
|
-
const { getDataModel: o } = v(), e =
|
|
7
|
+
const { getDataModel: o } = v(), e = x(
|
|
8
8
|
(n, a, r) => {
|
|
9
9
|
if (!t) {
|
|
10
10
|
console.warn("A2UI: Action dispatched but no handler is registered");
|
|
@@ -19,7 +19,7 @@ function P({ onAction: t, children: c }) {
|
|
|
19
19
|
t(l);
|
|
20
20
|
},
|
|
21
21
|
[t, o]
|
|
22
|
-
), i =
|
|
22
|
+
), i = C(
|
|
23
23
|
() => ({
|
|
24
24
|
dispatchAction: e,
|
|
25
25
|
onAction: t ?? null
|
|
@@ -29,7 +29,7 @@ function P({ onAction: t, children: c }) {
|
|
|
29
29
|
return /* @__PURE__ */ m(s.Provider, { value: i, children: c });
|
|
30
30
|
}
|
|
31
31
|
function g() {
|
|
32
|
-
const t =
|
|
32
|
+
const t = f(s);
|
|
33
33
|
if (!t)
|
|
34
34
|
throw new Error("useActionContext must be used within an ActionProvider");
|
|
35
35
|
return t;
|
|
@@ -1,20 +1,14 @@
|
|
|
1
1
|
import { ReactNode, ComponentType } from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { A2UIComponentProps } from '../components/types';
|
|
3
3
|
/**
|
|
4
4
|
* Type for a component in the components map.
|
|
5
5
|
*/
|
|
6
|
-
export type A2UIComponent = ComponentType<
|
|
7
|
-
/**
|
|
8
|
-
* Map of component type names to React components.
|
|
9
|
-
*/
|
|
10
|
-
export type ComponentsMap = Map<string, A2UIComponent>;
|
|
6
|
+
export type A2UIComponent = ComponentType<A2UIComponentProps & any>;
|
|
11
7
|
/**
|
|
12
8
|
* Context value for ComponentsMapContext.
|
|
13
9
|
*/
|
|
14
10
|
export interface ComponentsMapContextValue {
|
|
15
|
-
/**
|
|
16
|
-
customComponents: ComponentsMap;
|
|
17
|
-
/** Get a component by type name (custom first, then default) */
|
|
11
|
+
/** Get a component by type name */
|
|
18
12
|
getComponent: (type: string) => A2UIComponent | undefined;
|
|
19
13
|
}
|
|
20
14
|
/**
|
|
@@ -25,28 +19,21 @@ export declare const ComponentsMapContext: import('react').Context<ComponentsMap
|
|
|
25
19
|
* Props for ComponentsMapProvider.
|
|
26
20
|
*/
|
|
27
21
|
export interface ComponentsMapProviderProps {
|
|
28
|
-
/**
|
|
29
|
-
components
|
|
30
|
-
/** Default component registry */
|
|
31
|
-
defaultComponents: Record<string, A2UIComponent>;
|
|
22
|
+
/** Component registry */
|
|
23
|
+
components: Record<string, A2UIComponent>;
|
|
32
24
|
children: ReactNode;
|
|
33
25
|
}
|
|
34
26
|
/**
|
|
35
|
-
* Provider for
|
|
27
|
+
* Provider for component registry.
|
|
36
28
|
*
|
|
37
29
|
* @example
|
|
38
30
|
* ```tsx
|
|
39
|
-
*
|
|
40
|
-
* ['Button', CustomButton],
|
|
41
|
-
* ['Switch', CustomSwitch],
|
|
42
|
-
* ])
|
|
43
|
-
*
|
|
44
|
-
* <ComponentsMapProvider components={customComponents} defaultComponents={defaultRegistry}>
|
|
31
|
+
* <ComponentsMapProvider components={catalog.components}>
|
|
45
32
|
* <App />
|
|
46
33
|
* </ComponentsMapProvider>
|
|
47
34
|
* ```
|
|
48
35
|
*/
|
|
49
|
-
export declare function ComponentsMapProvider({ components,
|
|
36
|
+
export declare function ComponentsMapProvider({ components, children, }: ComponentsMapProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
50
37
|
/**
|
|
51
38
|
* Hook to access the ComponentsMap context.
|
|
52
39
|
*
|
|
@@ -1,21 +1,17 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { createContext as
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
import { jsx as n } from "react/jsx-runtime";
|
|
2
|
+
import { createContext as m, useMemo as i } from "react";
|
|
3
|
+
import { hasOwn as p } from "../../lib/utils.js";
|
|
4
|
+
const u = m(null);
|
|
5
|
+
function v({
|
|
6
|
+
components: o,
|
|
7
7
|
children: r
|
|
8
8
|
}) {
|
|
9
|
-
const
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
getComponent: (t) => o.has(t) ? o.get(t) : e[t]
|
|
14
|
-
};
|
|
15
|
-
}, [n, e]);
|
|
16
|
-
return /* @__PURE__ */ s(c.Provider, { value: m, children: r });
|
|
9
|
+
const e = i(() => ({
|
|
10
|
+
getComponent: (t) => p(o, t) ? o[t] : void 0
|
|
11
|
+
}), [o]);
|
|
12
|
+
return /* @__PURE__ */ n(u.Provider, { value: e, children: r });
|
|
17
13
|
}
|
|
18
14
|
export {
|
|
19
|
-
|
|
20
|
-
|
|
15
|
+
u as ComponentsMapContext,
|
|
16
|
+
v as ComponentsMapProvider
|
|
21
17
|
};
|