@ukiahinsure/a2ui-react-adapter 0.1.13 → 0.1.14
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/index.js +73 -17
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -13,9 +13,65 @@ import {
|
|
|
13
13
|
import { basicCatalog } from "@a2ui/react/v0_9";
|
|
14
14
|
import {
|
|
15
15
|
A2uiError,
|
|
16
|
+
Catalog,
|
|
16
17
|
A2uiMessageListSchema,
|
|
17
18
|
MessageProcessor
|
|
18
19
|
} from "@a2ui/web_core/v0_9";
|
|
20
|
+
|
|
21
|
+
// src/DateTimeInput.tsx
|
|
22
|
+
import { useId, useLayoutEffect, useRef } from "react";
|
|
23
|
+
import { createComponentImplementation } from "@a2ui/react/v0_9";
|
|
24
|
+
import { DateTimeInputApi } from "@a2ui/web_core/v0_9/basic_catalog";
|
|
25
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
26
|
+
var DateTimeInput = createComponentImplementation(
|
|
27
|
+
DateTimeInputApi,
|
|
28
|
+
({ props }) => {
|
|
29
|
+
const id = useId();
|
|
30
|
+
const inputRef = useRef(null);
|
|
31
|
+
const initialValue = useRef(props.value || "");
|
|
32
|
+
const type = props.enableDate && !props.enableTime ? "date" : !props.enableDate && props.enableTime ? "time" : "datetime-local";
|
|
33
|
+
useLayoutEffect(() => {
|
|
34
|
+
const input = inputRef.current;
|
|
35
|
+
if (input && input.ownerDocument.activeElement !== input && input.value !== (props.value || "")) {
|
|
36
|
+
input.value = props.value || "";
|
|
37
|
+
}
|
|
38
|
+
}, [props.value]);
|
|
39
|
+
return /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "var(--a2ui-spacing-xs, 0.25rem)" }, children: [
|
|
40
|
+
props.label && /* @__PURE__ */ jsx("label", { htmlFor: id, style: { fontSize: "var(--a2ui-label-font-size, var(--a2ui-font-size-s))", fontWeight: "bold" }, children: props.label }),
|
|
41
|
+
/* @__PURE__ */ jsx(
|
|
42
|
+
"input",
|
|
43
|
+
{
|
|
44
|
+
ref: inputRef,
|
|
45
|
+
id,
|
|
46
|
+
type,
|
|
47
|
+
"data-a2ui-native-date-draft": "true",
|
|
48
|
+
defaultValue: initialValue.current,
|
|
49
|
+
onChange: (event) => props.setValue(event.currentTarget.value),
|
|
50
|
+
min: typeof props.min === "string" ? props.min : void 0,
|
|
51
|
+
max: typeof props.max === "string" ? props.max : void 0,
|
|
52
|
+
style: {
|
|
53
|
+
backgroundColor: "var(--a2ui-datetimeinput-background, var(--a2ui-color-input, #fff))",
|
|
54
|
+
color: "var(--a2ui-datetimeinput-color, var(--a2ui-color-on-input, #333))",
|
|
55
|
+
border: "var(--a2ui-datetimeinput-border, var(--a2ui-border))",
|
|
56
|
+
borderRadius: "var(--a2ui-datetimeinput-border-radius, var(--a2ui-border-radius))",
|
|
57
|
+
padding: "var(--a2ui-datetimeinput-padding, var(--a2ui-spacing-s))",
|
|
58
|
+
boxSizing: "border-box"
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
)
|
|
62
|
+
] });
|
|
63
|
+
}
|
|
64
|
+
);
|
|
65
|
+
|
|
66
|
+
// src/adapter.ts
|
|
67
|
+
var editableDateCatalog = new Catalog(
|
|
68
|
+
basicCatalog.id,
|
|
69
|
+
[...basicCatalog.components.values()].map(
|
|
70
|
+
(component) => component.name === DateTimeInput.name ? DateTimeInput : component
|
|
71
|
+
),
|
|
72
|
+
[...basicCatalog.functions.values()],
|
|
73
|
+
basicCatalog.themeSchema
|
|
74
|
+
);
|
|
19
75
|
var RENDERER_NAME = "a2ui_react_adapter";
|
|
20
76
|
var RENDERER_VERSION = "0.1.0";
|
|
21
77
|
var A2UIClientAdapter = class {
|
|
@@ -328,7 +384,7 @@ var A2UIClientAdapter = class {
|
|
|
328
384
|
}
|
|
329
385
|
#createProcessor() {
|
|
330
386
|
return new MessageProcessor(
|
|
331
|
-
[
|
|
387
|
+
[editableDateCatalog],
|
|
332
388
|
(action) => this.#emitAction(action)
|
|
333
389
|
);
|
|
334
390
|
}
|
|
@@ -1569,13 +1625,13 @@ function classifyProcessingError(error) {
|
|
|
1569
1625
|
// src/SurfaceHost.tsx
|
|
1570
1626
|
import {
|
|
1571
1627
|
Component,
|
|
1572
|
-
useId,
|
|
1573
|
-
useLayoutEffect,
|
|
1574
|
-
useRef,
|
|
1628
|
+
useId as useId2,
|
|
1629
|
+
useLayoutEffect as useLayoutEffect2,
|
|
1630
|
+
useRef as useRef2,
|
|
1575
1631
|
useSyncExternalStore
|
|
1576
1632
|
} from "react";
|
|
1577
1633
|
import { A2uiSurface } from "@a2ui/react/v0_9";
|
|
1578
|
-
import { jsx } from "react/jsx-runtime";
|
|
1634
|
+
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
1579
1635
|
function A2UISurfaceHost({
|
|
1580
1636
|
adapter,
|
|
1581
1637
|
surfaceId,
|
|
@@ -1602,18 +1658,18 @@ function A2UISurfaceHost({
|
|
|
1602
1658
|
readSessionSnapshot,
|
|
1603
1659
|
readSessionSnapshot
|
|
1604
1660
|
);
|
|
1605
|
-
const generatedId =
|
|
1606
|
-
const rootRef =
|
|
1607
|
-
const lastFocusedState =
|
|
1608
|
-
const lastViewedSection =
|
|
1609
|
-
const lastValidationKey =
|
|
1661
|
+
const generatedId = useId2().replaceAll(":", "");
|
|
1662
|
+
const rootRef = useRef2(null);
|
|
1663
|
+
const lastFocusedState = useRef2(void 0);
|
|
1664
|
+
const lastViewedSection = useRef2(void 0);
|
|
1665
|
+
const lastValidationKey = useRef2("");
|
|
1610
1666
|
const resolvedSurfaceMetadata = surfaceMetadata ?? controllerSnapshot?.surface ?? null;
|
|
1611
1667
|
const editing = controllerSnapshot?.editing ?? editingForSurface(resolvedSurfaceMetadata);
|
|
1612
1668
|
const surface = surfaceId === void 0 ? adapter.currentSurface : adapter.getSurface(surfaceId);
|
|
1613
1669
|
const structure = surface === void 0 ? EMPTY_STRUCTURE : adapter.getSurfaceStructure(surface.id);
|
|
1614
1670
|
const focusKey = surface === void 0 ? void 0 : `${surface.id}:${resolvedSurfaceMetadata?.activeStateId ?? "surface"}`;
|
|
1615
1671
|
const frameId = hostId ?? `a2ui-surface-${generatedId}`;
|
|
1616
|
-
|
|
1672
|
+
useLayoutEffect2(() => {
|
|
1617
1673
|
const root = rootRef.current;
|
|
1618
1674
|
if (root === null || surface === void 0) {
|
|
1619
1675
|
return;
|
|
@@ -1715,9 +1771,9 @@ function A2UISurfaceHost({
|
|
|
1715
1771
|
version
|
|
1716
1772
|
]);
|
|
1717
1773
|
if (surface === void 0) {
|
|
1718
|
-
return noSurfaceFallback ?? /* @__PURE__ */
|
|
1774
|
+
return noSurfaceFallback ?? /* @__PURE__ */ jsx2("div", { "data-a2ui-host": "no-surface", role: "status", "aria-live": "polite", children: "Your conversation continues by voice." });
|
|
1719
1775
|
}
|
|
1720
|
-
return /* @__PURE__ */
|
|
1776
|
+
return /* @__PURE__ */ jsx2(
|
|
1721
1777
|
"div",
|
|
1722
1778
|
{
|
|
1723
1779
|
ref: rootRef,
|
|
@@ -1730,13 +1786,13 @@ function A2UISurfaceHost({
|
|
|
1730
1786
|
"aria-busy": busy || void 0,
|
|
1731
1787
|
"aria-disabled": disabled || busy || void 0,
|
|
1732
1788
|
tabIndex: -1,
|
|
1733
|
-
children: /* @__PURE__ */
|
|
1789
|
+
children: /* @__PURE__ */ jsx2(
|
|
1734
1790
|
SurfaceErrorBoundary,
|
|
1735
1791
|
{
|
|
1736
1792
|
adapter,
|
|
1737
1793
|
surface,
|
|
1738
|
-
fallback: errorFallback ?? /* @__PURE__ */
|
|
1739
|
-
children: /* @__PURE__ */
|
|
1794
|
+
fallback: errorFallback ?? /* @__PURE__ */ jsx2("div", { "data-a2ui-host": "render-error", role: "alert", children: "This step can't be shown right now. Please continue by voice." }),
|
|
1795
|
+
children: /* @__PURE__ */ jsx2(A2uiSurface, { surface })
|
|
1740
1796
|
},
|
|
1741
1797
|
surface.id
|
|
1742
1798
|
)
|
|
@@ -2022,7 +2078,7 @@ var SurfaceErrorBoundary = class extends Component {
|
|
|
2022
2078
|
}
|
|
2023
2079
|
render() {
|
|
2024
2080
|
if (this.state.failedSurfaceId !== void 0) {
|
|
2025
|
-
return /* @__PURE__ */
|
|
2081
|
+
return /* @__PURE__ */ jsx2(
|
|
2026
2082
|
"div",
|
|
2027
2083
|
{
|
|
2028
2084
|
"data-a2ui-error-boundary": "true",
|