@copilotkit/react-core 2.0.0-rc.1 → 2.0.0-rc.10
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/{MarkdownRendererContext-B4Us6mwL.d.cts → MarkdownRendererContext-CS35epe1.d.mts} +17 -33
- package/dist/MarkdownRendererContext-CS35epe1.d.mts.map +1 -0
- package/dist/{MarkdownRendererContext-CRKFzsEB.d.mts → MarkdownRendererContext-CfTh92vk.d.cts} +17 -33
- package/dist/MarkdownRendererContext-CfTh92vk.d.cts.map +1 -0
- package/dist/{MarkdownSurfaces-ChSlVYOk.mjs → MarkdownSurfaces-CimUSR3Y.mjs} +153 -76
- package/dist/MarkdownSurfaces-CimUSR3Y.mjs.map +1 -0
- package/dist/{MarkdownSurfaces-C2XZISKn.cjs → MarkdownSurfaces-DGDeUhbX.cjs} +175 -85
- package/dist/MarkdownSurfaces-DGDeUhbX.cjs.map +1 -0
- package/dist/context.cjs +20 -17
- package/dist/context.cjs.map +1 -1
- package/dist/context.d.cts +38 -98
- package/dist/context.d.cts.map +1 -1
- package/dist/context.d.mts +38 -98
- package/dist/context.d.mts.map +1 -1
- package/dist/context.mjs +20 -17
- package/dist/context.mjs.map +1 -1
- package/dist/generative-ui.cjs +564 -564
- package/dist/generative-ui.cjs.map +1 -1
- package/dist/generative-ui.d.cts +2137 -4178
- package/dist/generative-ui.d.cts.map +1 -1
- package/dist/generative-ui.d.mts +2137 -4178
- package/dist/generative-ui.d.mts.map +1 -1
- package/dist/generative-ui.mjs +69 -70
- package/dist/generative-ui.mjs.map +1 -1
- package/dist/headless.cjs +50 -76
- package/dist/headless.cjs.map +1 -1
- package/dist/headless.d.cts +78 -253
- package/dist/headless.d.cts.map +1 -1
- package/dist/headless.d.mts +56 -202
- package/dist/headless.d.mts.map +1 -1
- package/dist/headless.mjs +43 -74
- package/dist/headless.mjs.map +1 -1
- package/dist/index.cjs +1383 -1958
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +213 -538
- package/dist/index.d.cts.map +1 -1
- package/dist/index.d.mts +212 -537
- package/dist/index.d.mts.map +1 -1
- package/dist/index.mjs +1089 -1920
- package/dist/index.mjs.map +1 -1
- package/dist/index.umd.js +1549 -2039
- package/dist/index.umd.js.map +1 -1
- package/package.json +20 -35
- package/dist/MarkdownRendererContext-B4Us6mwL.d.cts.map +0 -1
- package/dist/MarkdownRendererContext-CRKFzsEB.d.mts.map +0 -1
- package/dist/MarkdownSurfaces-C2XZISKn.cjs.map +0 -1
- package/dist/MarkdownSurfaces-ChSlVYOk.mjs.map +0 -1
- package/dist/index.css +0 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"generative-ui.d.mts","names":[],"sources":["../src/generative-ui/refs.ts","../src/generative-ui/catalog-export.ts","../src/generative-ui/GenerativeUISurface.tsx","../src/generative-ui/markdown/MarkdownSurfaces.tsx","../src/generative-ui/hooks.ts","../src/generative-ui/standard/index.ts"],"mappings":";;;;;;;;;;;;;iBAgCgB,KAAA,CAAM,WAAA,YAAoB,CAAA,CAAA,
|
|
1
|
+
{"version":3,"file":"generative-ui.d.mts","names":[],"sources":["../src/generative-ui/refs.ts","../src/generative-ui/catalog-export.ts","../src/generative-ui/GenerativeUISurface.tsx","../src/generative-ui/markdown/MarkdownSurfaces.tsx","../src/generative-ui/hooks.ts","../src/generative-ui/standard/index.ts"],"mappings":";;;;;;;;;;;;;iBAgCgB,KAAA,CAAM,WAAA,YAAoB,CAAA,CAAA,OAAA,CAAA,CAAA,CAAA,SAAA,EAAA,CAAA,CAAA,YAAA,sCAAA,KAAA,CAAA,YAAA,mBAAA,KAAA,CAAA,qBAAA,SAAA,QAAA,CAAA,SAAA,IAAA,KAAA,CAAA,WAAA;;;AAA1C;;;;iBAcgB,SAAA,CAAU,WAAA,YAAoB,CAAA,CAAA,OAAA,CAAA,CAAA,CAAA,QAAA,WAAA,CAAA,CAAA,QAAA,CAAA,CAAA,CAAA,SAAA,GAAA,CAAA,CAAA,SAAA;;;8GAAA,KAAA,CAAA,qBAAA;;;;;;;UChB7B,wBAAA;;EAEf,KAAA;;EAEA,WAAA;;EAEA,YAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;iBA4Bc,iBAAA,CACd,EAAA,EAAI,YAAA,EACJ,OAAA,GAAS,wBAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UC1DD,4BAAA;;EAER,EAAA;;;;;EAKA,WAAA;EFiBmB;EEfnB,QAAA,GAAW,SAAA;EACX,SAAA;EFcwC;;;;;;EEPxC,UAAA;AAAA;;;;;KAqBU,wBAAA,YACC,YAAA,QAAoB,YAAA,SAC7B,4BAAA;EFhBsC;;;;EEuBlC,EAAA,EAAI,EAAA;EFvB8B;;;;;AAc1C;EEgBQ,UAAA,YAAsB,yBAAA,CAA0B,EAAA;AAAA;EAEhD,EAAA;EAAgB,UAAA;AAAA;;;;;;;;;;;;;;;iBA0CR,mBAAA,YACH,YAAA,QAAoB,YAAA,MAAA,CAAA;EAE/B,EAAA;EACA,WAAA;EACA,EAAA;EACA,UAAA;EACA,QAAA;EACA,SAAA;EACA;AAAA,GACC,wBAAA,CAAyB,EAAA,IAAG,kBAAA,CAAA,GAAA,CAAA,OAAA;;;;KCnG1B,aAAA,GAAgB,4BAAA;;;;;;AHerB;KGmDY,qBAAA,GAAwB,aAAA;EHnDM,sEGqDxC,OAAA,UHrDwC;EGuDxC,SAAA,UHvDwC;EGyDxC,WAAA;AAAA;;;;;;;;;;;;;;;;;;AH3CF;iBGsJgB,gBAAA,CAAA;EACd,OAAA;EACA,SAAA;EACA,WAAA;EAAA,GACG;AAAA,GACF,qBAAA,GAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA;;;;KC/KnB,UAAA,YACQ,YAAA,yBACO,mBAAA,CAAoB,EAAA,KACpC,WAAA,CAAY,yBAAA,CAA0B,EAAA,WAAa,GAAA;;;AJGvD;;;;;;;;;;;;;;;;iBIiBgB,oBAAA,YACH,YAAA,yBACO,mBAAA,CAAoB,EAAA,WAAA,CACtC,EAAA,EAAI,EAAA,EAAI,GAAA,EAAK,GAAA,EAAK,KAAA,EAAO,UAAA,CAAW,EAAA,EAAI,GAAA;;;;;;;;;;;AJN1C;;;;;;;;;;;;iBIgEgB,uBAAA,YACH,YAAA,oBACE,wBAAA,CAAyB,EAAA,EAAA,CAEtC,EAAA,EAAI,EAAA,EACJ,IAAA,EAAM,IAAA,EACN,OAAA,GAAU,IAAA,EAAM,wBAAA,CAAyB,EAAA,EAAI,IAAA;;;;;;;;;;;;AJpF/C;;;;;;;;;;;;;;;cKuCa,UAAA;;;;;;cAGX,CAAA,CAAA,SAAA"}
|
package/dist/generative-ui.mjs
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
|
|
3
|
-
import {
|
|
3
|
+
import { F as toJsonSchema, K as IconSvg, O as isRecord, P as createGenerativeUI, _ as GenerativeUINodeContext, b as useRequiredGenerativeUIRuntime, c as SurfaceView, d as namedRole, f as useGenerativeUIAccessibility, g as useManagerVersion, h as useGenerativeUIState, j as GenerativeUIError, l as DARK_THEME_CSS, m as useGenerativeUIFunction, n as ProviderMarkdown, p as wrapperAria, r as DefaultGenerativeUIChatCard, t as MarkdownSurfaces, u as controlAria, y as useGenerativeUIRuntime } from "./MarkdownSurfaces-CimUSR3Y.mjs";
|
|
4
4
|
import React, { Suspense, createContext, isValidElement, memo, useCallback, useContext, useEffect, useId, useInsertionEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
|
|
5
5
|
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
|
|
6
6
|
import { A2UI_CHILD_LIST_MARK, A2UI_CHILD_LIST_REF, A2UI_COMPONENT_ID_MARK, A2UI_COMPONENT_ID_REF, GENERATIVE_UI_FUNCTIONS, GENERATIVE_UI_MAX_TARGET_COMPONENTS, childRefKind, functionCallers } from "@copilotkit/shared";
|
|
7
|
-
import
|
|
7
|
+
import * as z from "zod";
|
|
8
8
|
import { createPortal } from "react-dom";
|
|
9
9
|
|
|
10
10
|
//#region src/generative-ui/refs.ts
|
|
@@ -584,27 +584,6 @@ const BORDER_COLORS = [
|
|
|
584
584
|
"danger",
|
|
585
585
|
"discovery"
|
|
586
586
|
];
|
|
587
|
-
const BACKGROUNDS = [
|
|
588
|
-
"surface",
|
|
589
|
-
"surface-secondary",
|
|
590
|
-
"surface-tertiary",
|
|
591
|
-
"surface-elevated",
|
|
592
|
-
"surface-elevated-secondary",
|
|
593
|
-
"surface-inverted",
|
|
594
|
-
"surface-soft",
|
|
595
|
-
"info",
|
|
596
|
-
"warning",
|
|
597
|
-
"caution",
|
|
598
|
-
"success",
|
|
599
|
-
"danger",
|
|
600
|
-
"discovery",
|
|
601
|
-
"info-solid",
|
|
602
|
-
"warning-solid",
|
|
603
|
-
"caution-solid",
|
|
604
|
-
"success-solid",
|
|
605
|
-
"danger-solid",
|
|
606
|
-
"discovery-solid"
|
|
607
|
-
];
|
|
608
587
|
const RADIUS_PX = {
|
|
609
588
|
"2xs": "2px",
|
|
610
589
|
xs: "4px",
|
|
@@ -995,7 +974,7 @@ const layoutProps = {
|
|
|
995
974
|
rowGap: sizeValue.optional(),
|
|
996
975
|
columnGap: sizeValue.optional(),
|
|
997
976
|
padding: sizeValue.optional().describe("4px steps when a number"),
|
|
998
|
-
background: z.string().optional().describe(
|
|
977
|
+
background: z.string().optional().describe("Leave it unset. A surface token such as surface, surface-secondary, info, success, warning, danger, discovery, or one with -solid, or a CSS color. Only one summary panel in a Card uses \"surface-secondary\""),
|
|
999
978
|
border: z.boolean().optional(),
|
|
1000
979
|
borderColor: z.enum(BORDER_COLORS).optional(),
|
|
1001
980
|
radius: radiusValue.optional(),
|
|
@@ -1863,7 +1842,7 @@ const layoutComponents = {
|
|
|
1863
1842
|
},
|
|
1864
1843
|
Row: {
|
|
1865
1844
|
component: Row,
|
|
1866
|
-
description: "A horizontal flex container.
|
|
1845
|
+
description: "A horizontal flex container. Label and value pair: justify \"spaceBetween\", a Caption left and a Text with fontWeight \"medium\" right. Buttons go in a Row at the bottom of a Card: one variant \"primary\", the others default or \"borderless\".",
|
|
1867
1846
|
props: layoutSchema,
|
|
1868
1847
|
events: VISIBLE_EVENT,
|
|
1869
1848
|
slots: CHILDREN_SLOT
|
|
@@ -1884,7 +1863,7 @@ const layoutComponents = {
|
|
|
1884
1863
|
},
|
|
1885
1864
|
Card: {
|
|
1886
1865
|
component: Card,
|
|
1887
|
-
description: "A bordered
|
|
1866
|
+
description: "A bordered panel, only for an interactive panel (controls, a form, a configurator); tables, charts and text need none. Give it a Title and a Caption. Separate groups with a Divider or the gap, never a nested Card or bordered Box. Variant \"section\": no box; \"outline\": always a box. In markdown mode, without controls it renders as \"section\" unless variant or border is set.",
|
|
1888
1867
|
props: cardSchema,
|
|
1889
1868
|
events: VISIBLE_EVENT,
|
|
1890
1869
|
slots: {
|
|
@@ -1908,7 +1887,7 @@ const layoutComponents = {
|
|
|
1908
1887
|
},
|
|
1909
1888
|
Carousel: {
|
|
1910
1889
|
component: Carousel,
|
|
1911
|
-
description: "A row that
|
|
1890
|
+
description: "A horizontally scrolling row that snaps to its CarouselItem or CarouselMediaItem children, with arrows. Bind activeIndex to read or set the slide in view.",
|
|
1912
1891
|
props: carouselSchema,
|
|
1913
1892
|
events: VISIBLE_EVENT,
|
|
1914
1893
|
slots: CHILDREN_SLOT,
|
|
@@ -1923,7 +1902,7 @@ const layoutComponents = {
|
|
|
1923
1902
|
},
|
|
1924
1903
|
CarouselMediaItem: {
|
|
1925
1904
|
component: CarouselMediaItem,
|
|
1926
|
-
description: "A
|
|
1905
|
+
description: "A Carousel slide: an image with its children (a Caption, a Text) under it. size \"sm\" 160px, \"md\" 240px (default), \"lg\" 320px wide. A click opens all slides full-screen, unless href or onClick is set.",
|
|
1927
1906
|
props: carouselMediaItemSchema,
|
|
1928
1907
|
events: {
|
|
1929
1908
|
...VISIBLE_EVENT,
|
|
@@ -2290,10 +2269,14 @@ const ICON_STROKE = {
|
|
|
2290
2269
|
function kebabToPascal(name) {
|
|
2291
2270
|
return name.split(/[-_\s]+/).filter(Boolean).map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join("");
|
|
2292
2271
|
}
|
|
2272
|
+
/** "ArrowRight" gives "arrow-right", as Lucide names its icon classes. */
|
|
2273
|
+
function pascalToKebab(name) {
|
|
2274
|
+
return name.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
|
|
2275
|
+
}
|
|
2293
2276
|
let lucidePromise = null;
|
|
2294
2277
|
let lucideIcons = null;
|
|
2295
2278
|
function loadLucideIcons() {
|
|
2296
|
-
lucidePromise ??= import("lucide
|
|
2279
|
+
lucidePromise ??= import("lucide").then((module) => {
|
|
2297
2280
|
const icons = module.icons;
|
|
2298
2281
|
lucideIcons = icons;
|
|
2299
2282
|
return icons;
|
|
@@ -2301,9 +2284,9 @@ function loadLucideIcons() {
|
|
|
2301
2284
|
return lucidePromise;
|
|
2302
2285
|
}
|
|
2303
2286
|
/**
|
|
2304
|
-
*
|
|
2305
|
-
*
|
|
2306
|
-
*
|
|
2287
|
+
* Lucide has about 1,500 icons. A static import of its `icons` map puts all
|
|
2288
|
+
* of them in every bundle and makes module load slow. So the map loads once,
|
|
2289
|
+
* on first use, and the icons show when it is there.
|
|
2307
2290
|
*/
|
|
2308
2291
|
function useLucideIcons() {
|
|
2309
2292
|
const [icons, setIcons] = useState(lucideIcons);
|
|
@@ -2319,6 +2302,20 @@ function useLucideIcons() {
|
|
|
2319
2302
|
}, []);
|
|
2320
2303
|
return icons;
|
|
2321
2304
|
}
|
|
2305
|
+
/** The icon for a kebab-case or PascalCase name, or `null` when there is none. */
|
|
2306
|
+
function findLucideIcon(icons, name) {
|
|
2307
|
+
const pascalName = kebabToPascal(name);
|
|
2308
|
+
const key = pascalName in icons ? pascalName : name in icons ? name : null;
|
|
2309
|
+
if (key === null) return null;
|
|
2310
|
+
const nodes = icons[key].map(([tag, attributes]) => ({
|
|
2311
|
+
tag,
|
|
2312
|
+
attributes
|
|
2313
|
+
}));
|
|
2314
|
+
return {
|
|
2315
|
+
lucideName: pascalToKebab(key),
|
|
2316
|
+
nodes
|
|
2317
|
+
};
|
|
2318
|
+
}
|
|
2322
2319
|
/**
|
|
2323
2320
|
* A lucide icon by kebab-case (or PascalCase) name. An unknown name renders
|
|
2324
2321
|
* nothing. Without a `label`, the icon is hidden from screen readers.
|
|
@@ -2331,18 +2328,20 @@ function useLucideIcons() {
|
|
|
2331
2328
|
function LucideIcon({ name, label, description, size = "md", color, weight, inline, style }) {
|
|
2332
2329
|
const icons = useLucideIcons();
|
|
2333
2330
|
if (!name || !icons) return null;
|
|
2334
|
-
const
|
|
2335
|
-
if (!
|
|
2331
|
+
const icon = findLucideIcon(icons, name);
|
|
2332
|
+
if (!icon) return null;
|
|
2336
2333
|
const pixels = typeof size === "number" ? size : inline ? "1em" : ICON_PX$1[size];
|
|
2337
|
-
|
|
2338
|
-
|
|
2339
|
-
|
|
2340
|
-
|
|
2341
|
-
|
|
2342
|
-
|
|
2334
|
+
const a11y = label === void 0 ? { "aria-hidden": true } : {
|
|
2335
|
+
role: "img",
|
|
2336
|
+
"aria-label": label,
|
|
2337
|
+
"aria-description": description
|
|
2338
|
+
};
|
|
2339
|
+
return /* @__PURE__ */ jsx(IconSvg, {
|
|
2340
|
+
lucideName: icon.lucideName,
|
|
2341
|
+
nodes: icon.nodes,
|
|
2342
|
+
...a11y,
|
|
2343
2343
|
focusable: "false",
|
|
2344
|
-
|
|
2345
|
-
height: pixels,
|
|
2344
|
+
size: pixels,
|
|
2346
2345
|
color: textColor(color) ?? "currentColor",
|
|
2347
2346
|
strokeWidth: weight ? ICON_STROKE[weight] : void 0,
|
|
2348
2347
|
style: {
|
|
@@ -2998,7 +2997,7 @@ const mediaComponents = {
|
|
|
2998
2997
|
},
|
|
2999
2998
|
Video: {
|
|
3000
2999
|
component: Video,
|
|
3001
|
-
description: "A video
|
|
3000
|
+
description: "A video file URL (optional captions) or a YouTube link, privacy-enhanced: the poster shows until play. Other video sites show as a link. Set title.",
|
|
3002
3001
|
props: videoSchema
|
|
3003
3002
|
},
|
|
3004
3003
|
AudioPlayer: {
|
|
@@ -3044,7 +3043,7 @@ const followUpItem = z.union([z.string(), z.object({
|
|
|
3044
3043
|
message: text("The text sent when the user clicks. Default: label")
|
|
3045
3044
|
})]);
|
|
3046
3045
|
const followUpSchema = z.object({
|
|
3047
|
-
items: z.array(followUpItem).optional()
|
|
3046
|
+
items: z.array(followUpItem).optional(),
|
|
3048
3047
|
title: text("A caption above the pills")
|
|
3049
3048
|
});
|
|
3050
3049
|
const followUpArgs = z.object({ message: z.string().describe("The message of the clicked pill") });
|
|
@@ -3092,7 +3091,7 @@ const gridImage = z.object({
|
|
|
3092
3091
|
href: text("Opens this URL instead of the full-screen view")
|
|
3093
3092
|
});
|
|
3094
3093
|
const imageGridSchema = z.object({
|
|
3095
|
-
images: z.array(gridImage).optional()
|
|
3094
|
+
images: z.array(gridImage).optional(),
|
|
3096
3095
|
columns: z.number().optional().describe("Default 3"),
|
|
3097
3096
|
aspectRatio: z.string().optional().describe("Default \"1 / 1\""),
|
|
3098
3097
|
gap: sizeValue.optional().describe("Default 2"),
|
|
@@ -3672,7 +3671,7 @@ function ImageGrid(props) {
|
|
|
3672
3671
|
const compositeComponents = {
|
|
3673
3672
|
LinkCard: {
|
|
3674
3673
|
component: LinkCard,
|
|
3675
|
-
description: "A preview
|
|
3674
|
+
description: "A preview of a URL: favicon and domain, title, description, thumbnail. A click opens it in a new tab, or sends onClick when bound. For sources, articles and products with a page.",
|
|
3676
3675
|
props: linkCardSchema,
|
|
3677
3676
|
events: { onClick: {
|
|
3678
3677
|
description: "Sent when the user clicks the card, instead of the link.",
|
|
@@ -3681,12 +3680,12 @@ const compositeComponents = {
|
|
|
3681
3680
|
},
|
|
3682
3681
|
Citation: {
|
|
3683
3682
|
component: Citation,
|
|
3684
|
-
description: "An inline source marker ([1])
|
|
3683
|
+
description: "An inline source marker ([1]) showing title, snippet and link on hover or click. Put it right after the sentence it supports, as a child of a Text or in a Row.",
|
|
3685
3684
|
props: citationSchema
|
|
3686
3685
|
},
|
|
3687
3686
|
FollowUp: {
|
|
3688
3687
|
component: FollowUp,
|
|
3689
|
-
description: "Suggested next prompts as pills
|
|
3688
|
+
description: "Suggested next prompts as pills; a click sends the pill's message as the user's next turn, no event needed. At the end of a surface, two to four short items.",
|
|
3690
3689
|
props: followUpSchema,
|
|
3691
3690
|
events: { onFollowUp: {
|
|
3692
3691
|
description: "Sent when the user clicks a pill. The args carry the message of the pill.",
|
|
@@ -3695,7 +3694,7 @@ const compositeComponents = {
|
|
|
3695
3694
|
},
|
|
3696
3695
|
EntityCard: {
|
|
3697
3696
|
component: EntityCard,
|
|
3698
|
-
description: "A card for one
|
|
3697
|
+
description: "A card for one product, place, person or listing: image, title, subtitle, description, a price or meta line, badge, rating and up to three buttons. href opens a page; onClick is sent when bound. Use a Grid of them for several things.",
|
|
3699
3698
|
props: entityCardSchema,
|
|
3700
3699
|
events: {
|
|
3701
3700
|
onClick: {
|
|
@@ -3731,9 +3730,9 @@ const chartSchema = z.object({
|
|
|
3731
3730
|
"pie",
|
|
3732
3731
|
"donut"
|
|
3733
3732
|
]).optional().describe("Default \"bar\""),
|
|
3734
|
-
data: z.array(z.record(z.string(), z.unknown())).optional()
|
|
3733
|
+
data: z.array(z.record(z.string(), z.unknown())).optional(),
|
|
3735
3734
|
xKey: z.string().optional().describe("The field of the category axis"),
|
|
3736
|
-
series: z.array(chartSeries).optional().describe("
|
|
3735
|
+
series: z.array(chartSeries).optional().describe("Default: every number field except xKey"),
|
|
3737
3736
|
stacked: z.boolean().optional(),
|
|
3738
3737
|
layout: z.enum(["vertical", "horizontal"]).optional().describe("\"horizontal\" draws the bars from left to right. Default \"vertical\""),
|
|
3739
3738
|
yAxis: z.object({
|
|
@@ -3741,7 +3740,7 @@ const chartSchema = z.object({
|
|
|
3741
3740
|
min: z.number().optional(),
|
|
3742
3741
|
max: z.number().optional(),
|
|
3743
3742
|
width: z.number().optional().describe("Pixels")
|
|
3744
|
-
}).optional().describe("
|
|
3743
|
+
}).optional().describe("Example: {label: \"Revenue (USD)\", min: 0, max: 100}. In a horizontal chart it is the horizontal axis, and width sets the category axis width"),
|
|
3745
3744
|
showDots: z.boolean().optional().describe("Point markers on a line or area"),
|
|
3746
3745
|
barRadius: z.number().optional().describe("The corner radius of a bar, in pixels"),
|
|
3747
3746
|
innerRadius: z.union([z.number(), z.string()]).optional().describe("Pie and donut"),
|
|
@@ -3760,7 +3759,7 @@ const chartSchema = z.object({
|
|
|
3760
3759
|
"number",
|
|
3761
3760
|
"currency",
|
|
3762
3761
|
"percent"
|
|
3763
|
-
]).optional().describe("
|
|
3762
|
+
]).optional().describe("With \"percent\", data values and axis min/max are fractions: 0.4 shows as 40%; for 0% to 10%, use min: 0 and max: 0.1."),
|
|
3764
3763
|
currency: z.string().optional().describe("ISO code. Default \"USD\""),
|
|
3765
3764
|
title: z.string().optional()
|
|
3766
3765
|
});
|
|
@@ -4174,7 +4173,7 @@ const mapMarker = z.object({
|
|
|
4174
4173
|
icon: z.string().optional()
|
|
4175
4174
|
});
|
|
4176
4175
|
const mapSchema = z.object({
|
|
4177
|
-
markers: z.array(mapMarker).optional()
|
|
4176
|
+
markers: z.array(mapMarker).optional(),
|
|
4178
4177
|
route: z.boolean().optional().describe("Draws a line through the markers in order"),
|
|
4179
4178
|
selected: z.string().optional().describe("The label of the selected marker. Bind it with { \"@path\": \"/x\" } to read the choice of the user"),
|
|
4180
4179
|
height: z.number().optional().describe("Pixels. Default 240"),
|
|
@@ -4502,8 +4501,8 @@ const tableColumn = z.union([
|
|
|
4502
4501
|
]);
|
|
4503
4502
|
const tableSchema = z.object({
|
|
4504
4503
|
caption: z.string().optional().describe("A short name of the table for screen readers. It is not shown"),
|
|
4505
|
-
columns: z.array(tableColumn).optional().describe("
|
|
4506
|
-
rows: z.array(z.array(z.unknown())).optional().describe("A list of row lists
|
|
4504
|
+
columns: z.array(tableColumn).optional().describe("Default []"),
|
|
4505
|
+
rows: z.array(z.array(z.unknown())).optional().describe("A list of row lists. A cell is a string, a number, or { \"componentId\": \"<id>\" } to show a component. Default []"),
|
|
4507
4506
|
columnSizing: z.enum(["auto", "equal"]).optional().describe("Default \"auto\""),
|
|
4508
4507
|
dividers: z.boolean().optional().describe("Default true"),
|
|
4509
4508
|
stickyHeader: z.boolean().optional().describe("Default false"),
|
|
@@ -4535,7 +4534,7 @@ const listItemValue = z.union([z.string(), z.object({
|
|
|
4535
4534
|
value: z.union([z.string(), z.number()]).optional().describe("Without an action: shown on the right of the label, for a key and value fact. With an action: the payload of the pick, not shown")
|
|
4536
4535
|
})]);
|
|
4537
4536
|
const listSchema = z.object({
|
|
4538
|
-
items: z.array(listItemValue).optional()
|
|
4537
|
+
items: z.array(listItemValue).optional(),
|
|
4539
4538
|
direction: z.enum(["vertical", "horizontal"]).optional().describe("Default \"vertical\". \"horizontal\" scrolls sideways"),
|
|
4540
4539
|
align: z.enum([
|
|
4541
4540
|
"start",
|
|
@@ -4989,7 +4988,7 @@ function ListItem(props) {
|
|
|
4989
4988
|
const dataComponents = {
|
|
4990
4989
|
Table: {
|
|
4991
4990
|
component: Table,
|
|
4992
|
-
description: "A data table
|
|
4991
|
+
description: "A data table, in a plain Column, not a Card. Give \"columns\" and \"rows\", or \"children\": TableSection or TableRow ids, or a template { \"componentId\", \"path\" } repeating a TableRow per item. A component in a cell or header (Badge, Button, Icon, Text): { \"componentId\": \"<id>\" }, with the id in \"cellComponents\".",
|
|
4993
4992
|
props: tableSchema,
|
|
4994
4993
|
slots: {
|
|
4995
4994
|
children: "multiple",
|
|
@@ -5019,7 +5018,7 @@ const dataComponents = {
|
|
|
5019
5018
|
},
|
|
5020
5019
|
List: {
|
|
5021
5020
|
component: List,
|
|
5022
|
-
description: "A list in a Card or next to another component
|
|
5021
|
+
description: "A list in a Card or next to another component; a plain list of text is markdown. Give \"items\": an item with a value and no action is a key-value row (Price: $1,599). Or give \"children\": ListItem ids or a template. With \"action\" the user picks an item; the event context gets its index, label and value.",
|
|
5023
5022
|
props: listSchema,
|
|
5024
5023
|
events: { action: {
|
|
5025
5024
|
description: "Runs when the user picks an item. The args are the index, label and value of the item.",
|
|
@@ -5044,7 +5043,7 @@ const dataComponents = {
|
|
|
5044
5043
|
},
|
|
5045
5044
|
Map: {
|
|
5046
5045
|
component: MapView,
|
|
5047
|
-
description: "A map with markers
|
|
5046
|
+
description: "A map with markers; with \"route\" a line connects them in order. Bind \"selected\" to get the label of the marker the user picks. Without maps it shows a list of the places.",
|
|
5048
5047
|
props: mapSchema,
|
|
5049
5048
|
writable: ["selected"]
|
|
5050
5049
|
}
|
|
@@ -5600,7 +5599,7 @@ const feedbackComponents = {
|
|
|
5600
5599
|
},
|
|
5601
5600
|
Popover: {
|
|
5602
5601
|
component: Popover,
|
|
5603
|
-
description: "A small overlay
|
|
5602
|
+
description: "A small overlay: exactly two children, one PopoverTrigger then one PopoverContent. A click on the trigger toggles it; Escape or a click outside closes it.",
|
|
5604
5603
|
props: popoverSchema,
|
|
5605
5604
|
slots: CHILDREN_SLOT,
|
|
5606
5605
|
writable: ["open"]
|
|
@@ -5648,7 +5647,7 @@ const validationResult = z.object({
|
|
|
5648
5647
|
message: z.string().optional(),
|
|
5649
5648
|
code: z.string().optional(),
|
|
5650
5649
|
severity: severity.optional()
|
|
5651
|
-
}).
|
|
5650
|
+
}).loose();
|
|
5652
5651
|
const checksProp = z.array(z.object({
|
|
5653
5652
|
condition: z.union([z.boolean(), validationResult]).optional().describe("A validator call, for example {\"@call\":\"required\",\"args\":{\"value\":{\"@path\":\"/x\"}}}, or a boolean binding"),
|
|
5654
5653
|
message: z.string().optional().describe("Shown when the check fails, instead of the default message")
|
|
@@ -5734,7 +5733,7 @@ const optionList = z.array(z.union([z.string(), z.object({
|
|
|
5734
5733
|
value: z.string(),
|
|
5735
5734
|
label: z.string().optional(),
|
|
5736
5735
|
description: z.string().optional()
|
|
5737
|
-
})])).optional()
|
|
5736
|
+
})])).optional();
|
|
5738
5737
|
const SIZES = [
|
|
5739
5738
|
"sm",
|
|
5740
5739
|
"md",
|
|
@@ -7186,7 +7185,7 @@ function Slider(props) {
|
|
|
7186
7185
|
const inputComponents = {
|
|
7187
7186
|
Button: {
|
|
7188
7187
|
component: Button,
|
|
7189
|
-
description: "
|
|
7188
|
+
description: "Sends its onClick event; with href it opens the URL, with copy it copies the text. Variant \"primary\" for the one main Button in a Row. submit true submits the Form around it. Its children render instead of the label. With checks it is disabled while a check fails.",
|
|
7190
7189
|
props: buttonSchema,
|
|
7191
7190
|
events: { onClick: {
|
|
7192
7191
|
description: "Sent when the user clicks the button.",
|
|
@@ -7212,7 +7211,7 @@ const inputComponents = {
|
|
|
7212
7211
|
},
|
|
7213
7212
|
Form: {
|
|
7214
7213
|
component: Form,
|
|
7215
|
-
description: "A layout container that is a form. It sends
|
|
7214
|
+
description: "A layout container that is a form. It sends onSubmit when the user submits (a Button with submit true, or Enter in a field). Put its field values in the event context with { \"@path\": \"/x\" }.",
|
|
7216
7215
|
props: formSchema,
|
|
7217
7216
|
events: { onSubmit: {
|
|
7218
7217
|
description: "Sent when the user submits the form.",
|
|
@@ -7269,13 +7268,13 @@ const inputComponents = {
|
|
|
7269
7268
|
},
|
|
7270
7269
|
ChoicePicker: {
|
|
7271
7270
|
component: ChoicePicker,
|
|
7272
|
-
description: "
|
|
7271
|
+
description: "Options as checkboxes or chips: pick one, or several with variant \"multipleSelection\". Its value is the list of chosen values. Give it a label.",
|
|
7273
7272
|
props: choicePickerSchema,
|
|
7274
7273
|
writable: VALUE_WRITABLE
|
|
7275
7274
|
},
|
|
7276
7275
|
DateTimeInput: {
|
|
7277
7276
|
component: DateTimeInput,
|
|
7278
|
-
description: "A date picker,
|
|
7277
|
+
description: "A date picker, a time picker with enableTime, or both. timeStep (minutes) offers fixed times, e.g. 30 for a booking. The value is ISO 8601. Give it a label.",
|
|
7279
7278
|
props: dateTimeInputSchema,
|
|
7280
7279
|
writable: VALUE_WRITABLE
|
|
7281
7280
|
}
|
|
@@ -7778,12 +7777,12 @@ function Tooltip({ trigger, content }) {
|
|
|
7778
7777
|
const textComponents = {
|
|
7779
7778
|
Title: {
|
|
7780
7779
|
component: Title,
|
|
7781
|
-
description: "A heading
|
|
7780
|
+
description: "A heading in a Card or next to another component; a heading alone is markdown. Size \"2xl\" at most once per surface, \"lg\" for sections. \"sm\" is an h4, \"md\"/\"lg\" an h3 (default \"md\"), \"xl\" and up an h2. Bold unless strong is false.",
|
|
7782
7781
|
props: titleSchema
|
|
7783
7782
|
},
|
|
7784
7783
|
Text: {
|
|
7785
7784
|
component: Text,
|
|
7786
|
-
description: "Body text
|
|
7785
|
+
description: "Body text in a Card or next to another component; a paragraph alone is markdown outside the fence. Color \"default\" or \"secondary\". `text` takes inline markdown (**bold**, *italic*, ~~strike~~, ++underline++, `code`, [link](url)). `children` ids render inline after it, e.g. a Badge.",
|
|
7787
7786
|
props: textSchema,
|
|
7788
7787
|
slots: CHILDREN_SLOT
|
|
7789
7788
|
},
|
|
@@ -7854,7 +7853,7 @@ const textComponents = {
|
|
|
7854
7853
|
},
|
|
7855
7854
|
Tooltip: {
|
|
7856
7855
|
component: Tooltip,
|
|
7857
|
-
description: "Shows `content` when the user points at
|
|
7856
|
+
description: "Shows `content` when the user points at or focuses `trigger`. `trigger`: one child id, a Text, Icon or Badge (not a Button or Link). `content`: one child id of short text, no links or buttons.",
|
|
7858
7857
|
slots: {
|
|
7859
7858
|
trigger: "single",
|
|
7860
7859
|
content: "single"
|