@epam/ai-dial-ui-kit 0.15.0-dev.23 → 0.15.0-dev.24
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/CHANGELOG.md +1 -0
- package/dist/components/SchemaRenderer/components/SchemaField.js +19 -19
- package/dist/components/SchemaRenderer/components/SchemaFieldContent.js +18 -18
- package/dist/components/SchemaRenderer/utils.js +21 -19
- package/dist/components-manifest.json +2 -2
- package/dist/dial-ui-kit.cjs +2 -2
- package/dist/src/components/SchemaRenderer/utils.d.ts +5 -0
- package/package.json +1 -1
package/dist/CHANGELOG.md
CHANGED
|
@@ -43,6 +43,7 @@ Versions match the git tags on the `development` branch.
|
|
|
43
43
|
|
|
44
44
|
- **`MarkdownEditor` (2.0) — the live preview is part of the card now, instead of a sheet of GitHub's own CSS laid over it** — the 2.0 restyle covered the card and the toolbar and stopped at the split: everything right of it was still `@uiw/react-md-editor`'s default stylesheet. Three things came out of that. The pane divider was the library's `inset` box-shadow in a hardcoded `#d0d7de`, drawn on the preview and then painted over by the markdown body's opaque white — and since that body is only as tall as its content, the divider survived as a hairline starting halfway down the pane, under the last rendered block. The white itself was the second: a `#ffffff` patch over the card's `bg-layer-raised`, which a dark theme would have kept white. And Tailwind's preflight, which the kit ships, had stripped the list markers and the task-list checkbox out of the rendered markdown — a bulleted list came out as indented lines, a `- [ ]` as a 0×0 box. The divider is now a real border on `border-secondary`, the body and its table rows are transparent, code, quotes, tables and headings take kit tokens, and lists and task boxes render again. The preview also inherits the host's font and `text-primary` instead of the library's `-apple-system` stack and `#24292f`; the edit pane keeps its monospace face. Both panes gained a 16px gutter beside the divider, so text no longer butts against it.
|
|
45
45
|
- **`MarkdownEditor` (2.0) — the two panes no longer sit on top of each other in RTL** — live mode pins the preview with a physical `right: 0` while the edit pane is a plain block at the inline start, so under `dir="rtl"` both landed on the right unless the host knew to add the library's own `w-md-editor-rtl` class. The preview is now placed with logical insets and the panes' text aligns to `start`, so the edit pane and the preview swap sides with the document direction — divider, gutters and the quote bar included — with no class for the host to remember.
|
|
46
|
+
- **`DialSchemaRenderer` — required-field errors quote the field label** — the message was `${label} is required`, so with a long schema `title` the reader could not tell where the field name ended and "is required" began. The label is now wrapped in double quotes (`"API key" is required`) wherever the renderer builds the message — the inline field error and the `validateRequired` result alike. The label is still the schema `title` (or the label derived from the property key), never the entered value. Consumers asserting the old text in their tests need to add the quotes. Requested in [ai-dial-admin-frontend#4731](https://github.com/epam/ai-dial-admin-frontend/issues/4731).
|
|
46
47
|
|
|
47
48
|
---
|
|
48
49
|
|
|
@@ -1,71 +1,71 @@
|
|
|
1
|
-
import { jsx as
|
|
1
|
+
import { jsx as s } from "react/jsx-runtime";
|
|
2
2
|
import { DialFormItem as g } from "../../FormItem/FormItem.js";
|
|
3
3
|
import { JsonSchemaType as A } from "../types.js";
|
|
4
4
|
import { useSchemaContext as C } from "../context.js";
|
|
5
|
-
import { resolveRef as E, isObjectType as I, buildSummary as
|
|
5
|
+
import { resolveRef as E, isObjectType as I, buildSummary as M, validateRequired as O, isMissingRequiredValue as b, toRequiredMessage as k } from "../utils.js";
|
|
6
6
|
import { SchemaSection as w } from "./SchemaSection.js";
|
|
7
7
|
import { SchemaFieldContent as u } from "./SchemaFieldContent.js";
|
|
8
|
-
const
|
|
9
|
-
schema:
|
|
8
|
+
const B = ({
|
|
9
|
+
schema: a,
|
|
10
10
|
value: t,
|
|
11
11
|
onChange: d,
|
|
12
12
|
path: e,
|
|
13
|
-
level:
|
|
13
|
+
level: i = 0,
|
|
14
14
|
required: r,
|
|
15
15
|
label: n
|
|
16
16
|
}) => {
|
|
17
17
|
const {
|
|
18
18
|
rootSchema: c,
|
|
19
|
-
defaultExpanded:
|
|
19
|
+
defaultExpanded: f = !0,
|
|
20
20
|
touchedPaths: m = /* @__PURE__ */ new Set(),
|
|
21
21
|
skipUntouched: h = !1
|
|
22
|
-
} = C(), o = E(
|
|
23
|
-
if (
|
|
24
|
-
const j =
|
|
22
|
+
} = C(), o = E(a, c), S = I(o), l = o.type === A.Array;
|
|
23
|
+
if (S || l) {
|
|
24
|
+
const j = M(t, o, c), x = O(
|
|
25
25
|
t,
|
|
26
26
|
o,
|
|
27
27
|
c,
|
|
28
28
|
e.join(".")
|
|
29
29
|
), p = e.join("."), T = p + ".", F = !h || m.has(p) || [...m].some((R) => R.startsWith(T));
|
|
30
|
-
return /* @__PURE__ */
|
|
30
|
+
return /* @__PURE__ */ s(
|
|
31
31
|
w,
|
|
32
32
|
{
|
|
33
33
|
title: n ?? o.title ?? e[e.length - 1] ?? "Section",
|
|
34
34
|
description: o.description,
|
|
35
|
-
level:
|
|
35
|
+
level: i,
|
|
36
36
|
summary: j,
|
|
37
37
|
errorCount: F ? x.length : 0,
|
|
38
|
-
defaultExpanded:
|
|
39
|
-
children: /* @__PURE__ */
|
|
38
|
+
defaultExpanded: f,
|
|
39
|
+
children: /* @__PURE__ */ s(
|
|
40
40
|
u,
|
|
41
41
|
{
|
|
42
42
|
schema: o,
|
|
43
43
|
value: t,
|
|
44
44
|
onChange: d,
|
|
45
45
|
path: e,
|
|
46
|
-
level:
|
|
46
|
+
level: i + 1,
|
|
47
47
|
required: r
|
|
48
48
|
}
|
|
49
49
|
)
|
|
50
50
|
}
|
|
51
51
|
);
|
|
52
52
|
}
|
|
53
|
-
const y = (!h || m.has(e.join("."))) && r &&
|
|
54
|
-
return /* @__PURE__ */
|
|
53
|
+
const y = (!h || m.has(e.join("."))) && r && b(t) ? k(n ?? "Field") : void 0;
|
|
54
|
+
return /* @__PURE__ */ s(
|
|
55
55
|
g,
|
|
56
56
|
{
|
|
57
57
|
label: n,
|
|
58
58
|
required: r,
|
|
59
59
|
description: o.description,
|
|
60
60
|
error: y,
|
|
61
|
-
children: /* @__PURE__ */
|
|
61
|
+
children: /* @__PURE__ */ s(
|
|
62
62
|
u,
|
|
63
63
|
{
|
|
64
64
|
schema: o,
|
|
65
65
|
value: t,
|
|
66
66
|
onChange: d,
|
|
67
67
|
path: e,
|
|
68
|
-
level:
|
|
68
|
+
level: i,
|
|
69
69
|
required: r,
|
|
70
70
|
suppressInlineError: !0
|
|
71
71
|
}
|
|
@@ -74,5 +74,5 @@ const q = ({
|
|
|
74
74
|
);
|
|
75
75
|
};
|
|
76
76
|
export {
|
|
77
|
-
|
|
77
|
+
B as SchemaField
|
|
78
78
|
};
|
|
@@ -2,15 +2,15 @@ import { jsx as t, jsxs as O, Fragment as P } from "react/jsx-runtime";
|
|
|
2
2
|
import { DialErrorText as x } from "../../CaptionText/CaptionText.js";
|
|
3
3
|
import { JsonSchemaType as c } from "../types.js";
|
|
4
4
|
import { useSchemaContext as F } from "../context.js";
|
|
5
|
-
import { resolveRef as T, isObjectType as u,
|
|
6
|
-
import { SchemaObjectEditor as
|
|
7
|
-
import { SchemaArrayEditor as
|
|
8
|
-
import { SchemaOneOfEditor as
|
|
9
|
-
import { SchemaAnyOfEditor as
|
|
10
|
-
import { SchemaKeyValueEditor as
|
|
11
|
-
import { SchemaPrimitiveField as
|
|
12
|
-
import { SchemaAdditionalPropertiesEditor as
|
|
13
|
-
const
|
|
5
|
+
import { resolveRef as T, isObjectType as u, toRequiredMessage as A, isMissingRequiredValue as b } from "../utils.js";
|
|
6
|
+
import { SchemaObjectEditor as k } from "./SchemaObjectEditor.js";
|
|
7
|
+
import { SchemaArrayEditor as M } from "./SchemaArrayEditor.js";
|
|
8
|
+
import { SchemaOneOfEditor as R } from "./SchemaOneOfEditor.js";
|
|
9
|
+
import { SchemaAnyOfEditor as q } from "./SchemaAnyOfEditor.js";
|
|
10
|
+
import { SchemaKeyValueEditor as V } from "./SchemaKeyValueEditor.js";
|
|
11
|
+
import { SchemaPrimitiveField as w } from "./SchemaPrimitiveField.js";
|
|
12
|
+
import { SchemaAdditionalPropertiesEditor as D } from "./SchemaAdditionalPropertiesEditor.js";
|
|
13
|
+
const X = ({
|
|
14
14
|
schema: h,
|
|
15
15
|
value: i,
|
|
16
16
|
onChange: f,
|
|
@@ -33,7 +33,7 @@ const Q = ({
|
|
|
33
33
|
let o;
|
|
34
34
|
if (e.oneOf)
|
|
35
35
|
o = /* @__PURE__ */ t(
|
|
36
|
-
|
|
36
|
+
R,
|
|
37
37
|
{
|
|
38
38
|
schema: e,
|
|
39
39
|
value: i,
|
|
@@ -44,7 +44,7 @@ const Q = ({
|
|
|
44
44
|
);
|
|
45
45
|
else if (e.anyOf && e.type !== c.Object)
|
|
46
46
|
o = /* @__PURE__ */ t(
|
|
47
|
-
|
|
47
|
+
q,
|
|
48
48
|
{
|
|
49
49
|
schema: e,
|
|
50
50
|
value: i,
|
|
@@ -56,7 +56,7 @@ const Q = ({
|
|
|
56
56
|
else if (u(e)) {
|
|
57
57
|
const n = e.additionalProperties != null && e.additionalProperties !== !1, a = !e.properties || Object.keys(e.properties).length === 0;
|
|
58
58
|
n && a ? o = /* @__PURE__ */ t(
|
|
59
|
-
|
|
59
|
+
V,
|
|
60
60
|
{
|
|
61
61
|
schema: e,
|
|
62
62
|
value: i,
|
|
@@ -65,14 +65,14 @@ const Q = ({
|
|
|
65
65
|
level: m
|
|
66
66
|
}
|
|
67
67
|
) : a && e.additionalProperties !== !1 ? o = /* @__PURE__ */ t(
|
|
68
|
-
|
|
68
|
+
D,
|
|
69
69
|
{
|
|
70
70
|
value: i,
|
|
71
71
|
onChange: s,
|
|
72
72
|
theme: E
|
|
73
73
|
}
|
|
74
74
|
) : o = /* @__PURE__ */ t(
|
|
75
|
-
|
|
75
|
+
k,
|
|
76
76
|
{
|
|
77
77
|
schema: e,
|
|
78
78
|
value: i,
|
|
@@ -83,7 +83,7 @@ const Q = ({
|
|
|
83
83
|
);
|
|
84
84
|
} else if (e.type === c.Array)
|
|
85
85
|
o = /* @__PURE__ */ t(
|
|
86
|
-
|
|
86
|
+
M,
|
|
87
87
|
{
|
|
88
88
|
schema: e,
|
|
89
89
|
value: i,
|
|
@@ -93,10 +93,10 @@ const Q = ({
|
|
|
93
93
|
}
|
|
94
94
|
);
|
|
95
95
|
else {
|
|
96
|
-
const n = j && p &&
|
|
96
|
+
const n = j && p && b(i), a = !l && n ? A(e.title ?? "Field") : void 0;
|
|
97
97
|
o = /* @__PURE__ */ O(P, { children: [
|
|
98
98
|
/* @__PURE__ */ t(
|
|
99
|
-
|
|
99
|
+
w,
|
|
100
100
|
{
|
|
101
101
|
schema: e,
|
|
102
102
|
value: i,
|
|
@@ -110,5 +110,5 @@ const Q = ({
|
|
|
110
110
|
return d ? d(r, e, o) : o;
|
|
111
111
|
};
|
|
112
112
|
export {
|
|
113
|
-
|
|
113
|
+
X as SchemaFieldContent
|
|
114
114
|
};
|
|
@@ -26,7 +26,7 @@ function p(r, n, i = 0) {
|
|
|
26
26
|
}
|
|
27
27
|
return t;
|
|
28
28
|
}
|
|
29
|
-
function
|
|
29
|
+
function T(r) {
|
|
30
30
|
return r.map((n, i) => ({ entry: n, index: i })).sort((n, i) => {
|
|
31
31
|
const t = n.entry[1]["dial:meta"]?.["dial:propertyOrder"] ?? 1 / 0, e = i.entry[1]["dial:meta"]?.["dial:propertyOrder"] ?? 1 / 0;
|
|
32
32
|
return t !== e ? t - e : n.index - i.index;
|
|
@@ -41,7 +41,8 @@ function O(r) {
|
|
|
41
41
|
function N(r) {
|
|
42
42
|
return r.replace(/_/g, " ").replace(/([a-z])([A-Z])/g, "$1 $2").replace(/\b\w/g, (n) => n.toUpperCase());
|
|
43
43
|
}
|
|
44
|
-
|
|
44
|
+
const I = (r) => `"${r}" is required`;
|
|
45
|
+
function q(r, n) {
|
|
45
46
|
return r.type === f.Null ? "null" : r.$ref ? p(r, n).title ?? r.$ref.split("/").pop() ?? "Option" : r.title ? r.title : r.type ? Array.isArray(r.type) ? r.type.join(" | ") : r.type : r.discriminator ? Object.keys(r.discriminator.mapping).join(" | ") : r.const != null ? String(r.const) : r.oneOf ? "One of options" : "Option";
|
|
46
47
|
}
|
|
47
48
|
function A(r, n, i = 0) {
|
|
@@ -128,7 +129,7 @@ function b(r, n, i, t = "", e = 0) {
|
|
|
128
129
|
const a = t ? `${t}.${l}` : l, c = d?.[l];
|
|
129
130
|
if (j(c)) {
|
|
130
131
|
const g = u?.title ?? N(l);
|
|
131
|
-
o.push({ path: a, message:
|
|
132
|
+
o.push({ path: a, message: I(g) });
|
|
132
133
|
}
|
|
133
134
|
}
|
|
134
135
|
if (d && s.properties)
|
|
@@ -177,7 +178,7 @@ function E(r, n, i) {
|
|
|
177
178
|
}
|
|
178
179
|
return "";
|
|
179
180
|
}
|
|
180
|
-
function
|
|
181
|
+
function R(r, n, i) {
|
|
181
182
|
if (r == null) {
|
|
182
183
|
const t = n.findIndex((e) => e.type === f.Null);
|
|
183
184
|
return t >= 0 ? t : 0;
|
|
@@ -216,7 +217,7 @@ function q(r, n, i) {
|
|
|
216
217
|
}
|
|
217
218
|
return 0;
|
|
218
219
|
}
|
|
219
|
-
function
|
|
220
|
+
function B(r, n, i) {
|
|
220
221
|
if (n && typeof r == "object" && r !== null) {
|
|
221
222
|
const t = r[n];
|
|
222
223
|
if (t) return `Item ${i + 1}: ${t}`;
|
|
@@ -227,7 +228,7 @@ function R(r, n, i) {
|
|
|
227
228
|
}
|
|
228
229
|
return `Item ${i + 1}`;
|
|
229
230
|
}
|
|
230
|
-
function
|
|
231
|
+
function D(r) {
|
|
231
232
|
switch (Array.isArray(r.type) ? r.type[0] : r.type) {
|
|
232
233
|
case f.String:
|
|
233
234
|
return "";
|
|
@@ -242,7 +243,7 @@ function B(r) {
|
|
|
242
243
|
return {};
|
|
243
244
|
}
|
|
244
245
|
}
|
|
245
|
-
const
|
|
246
|
+
const V = [
|
|
246
247
|
f.String,
|
|
247
248
|
f.Number,
|
|
248
249
|
f.Boolean,
|
|
@@ -250,10 +251,10 @@ const D = [
|
|
|
250
251
|
f.Object,
|
|
251
252
|
f.Array
|
|
252
253
|
];
|
|
253
|
-
function
|
|
254
|
+
function k(r) {
|
|
254
255
|
return Array.isArray(r) ? f.Array : typeof r == "object" && r !== null ? f.Object : typeof r == "boolean" ? f.Boolean : typeof r == "number" ? f.Number : r === null ? f.Null : f.String;
|
|
255
256
|
}
|
|
256
|
-
const
|
|
257
|
+
const P = {
|
|
257
258
|
[f.String]: "",
|
|
258
259
|
[f.Number]: 0,
|
|
259
260
|
[f.Boolean]: !1,
|
|
@@ -261,23 +262,24 @@ const I = {
|
|
|
261
262
|
[f.Object]: {},
|
|
262
263
|
[f.Array]: []
|
|
263
264
|
};
|
|
264
|
-
function
|
|
265
|
-
return
|
|
265
|
+
function _(r) {
|
|
266
|
+
return P[r];
|
|
266
267
|
}
|
|
267
268
|
export {
|
|
268
|
-
|
|
269
|
+
V as ENTRY_TYPE_OPTIONS,
|
|
269
270
|
E as buildSummary,
|
|
270
|
-
|
|
271
|
+
R as detectAnyOfVariant,
|
|
271
272
|
A as extractDefaults,
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
273
|
+
_ as getEntryTypeDefault,
|
|
274
|
+
B as getItemTitle,
|
|
275
|
+
q as getOptionLabel,
|
|
276
|
+
D as getSchemaDefault,
|
|
277
|
+
k as inferEntryType,
|
|
277
278
|
j as isMissingRequiredValue,
|
|
278
279
|
O as isObjectType,
|
|
279
280
|
p as resolveRef,
|
|
280
|
-
|
|
281
|
+
T as sortByPropertyOrder,
|
|
281
282
|
N as toFieldLabel,
|
|
283
|
+
I as toRequiredMessage,
|
|
282
284
|
b as validateRequired
|
|
283
285
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
|
-
"version": "0.15.0-dev.
|
|
3
|
-
"generatedAt": "2026-09-
|
|
2
|
+
"version": "0.15.0-dev.24",
|
|
3
|
+
"generatedAt": "2026-09-29T08:48:09.588Z",
|
|
4
4
|
"kit": {
|
|
5
5
|
"name": "@epam/ai-dial-ui-kit",
|
|
6
6
|
"description": "A modern UI kit for building AI DIAL interfaces with React",
|