@epam/ai-dial-ui-kit 0.16.0-dev.22 → 0.16.0-dev.25
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/README.md +1 -0
- package/dist/{DateCellRenderer-BEZLnOm0.cjs → DateCellRenderer-BmgQYPuv.cjs} +1 -1
- package/dist/JsonEditor-Bxui5wJH.cjs +1 -0
- package/dist/{MarkdownEditor-Cp-KX6-T.cjs → MarkdownEditor-BKtFs714.cjs} +1 -1
- package/dist/{MarkdownEditor-Dav_pp0T.cjs → MarkdownEditor-Bapd1ycU.cjs} +1 -1
- package/dist/MarkdownEditorContainer-DLPODjar.cjs +1 -0
- package/dist/components/MarkdownEditor/MarkdownEditorContainer.js +16 -18
- package/dist/components/New/StateScreen/StateScreen.js +61 -0
- package/dist/components-manifest.json +57 -3
- package/dist/constants/public-class-names.js +2 -0
- package/dist/dial-ui-kit.cjs +2 -2
- package/dist/dial-ui-kit.js +49 -47
- package/dist/editors.cjs +1 -1
- package/dist/grid.cjs +1 -1
- package/dist/index.css +1 -1
- package/dist/lazy-_W6FYhKg.cjs +1 -0
- package/dist/src/components/New/StateScreen/StateScreen.d.ts +47 -0
- package/dist/src/constants/public-class-names.d.ts +2 -0
- package/dist/src/index.d.ts +2 -0
- package/package.json +1 -1
- package/dist/JsonEditor-eAV7SaKu.cjs +0 -1
- package/dist/MarkdownEditorContainer-D8YTX8EM.cjs +0 -1
- package/dist/editor-BH6_A1k2.cjs +0 -1
- package/dist/lazy-DMVYJhUR.cjs +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),a=require("./lazy-_W6FYhKg.cjs"),c=require("@monaco-editor/react");function g(e){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const t=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(o,r,t.get?t:{enumerable:!0,get:()=>e[r]})}}return o.default=e,Object.freeze(o)}const f=g(c),b={[a.EditorThemes.dark]:{base:"vs-dark",inherit:!1,rules:[{token:"string.key.json",foreground:"#37BABC"},{token:"string.value.json",foreground:"#5C8DEA"},{token:"number",foreground:"#D97C27"},{token:"keyword.json",foreground:"#F4CE46"},{token:"delimiter",foreground:"#EEF1F7"},{token:"delimiter.bracket.json",foreground:"#A972FF"},{token:"delimiter.parenthesis",foreground:"#A972FF"}],colors:{"editor.foreground":"#F76464","editor.background":"#161B2D","editorCursor.foreground":"#EEF1F7","editor.selectionBackground":"#5C8DEA2B","editorLineNumber.foreground":"#242C42","scrollbarSlider.background":"#242C42","scrollbarSlider.hoverBackground":"#242C42","scrollbarSlider.activeBackground":"#242C42"}},[a.EditorThemes.light]:{base:"vs",inherit:!1,rules:[{token:"string.key.json",foreground:"#009D9F"},{token:"string.value.json",foreground:"#2764D9"},{token:"number",foreground:"#B25500"},{token:"keyword.json",foreground:"#3F3D25"},{token:"delimiter",foreground:"#161B2D"},{token:"delimiter.bracket.json",foreground:"#7E39EC"},{token:"delimiter.parenthesis",foreground:"#7E39EC"}],colors:{"editor.foreground":"#AE2F2F","editor.background":"#EEF1F7","editorCursor.foreground":"#161B2D","editor.selectionBackground":"#5C8DEA2B","editorLineNumber.foreground":"#242C42","scrollbarSlider.background":"#242C42","scrollbarSlider.hoverBackground":"#242C42","scrollbarSlider.activeBackground":"#242C42"}}},k=({value:e,onChange:o,onValidateJSON:r,options:t,currentTheme:n,themesConfig:s=b})=>{function d(i){i?.editor?.defineTheme(n,s[n]),i.languages.json.jsonDefaults.setDiagnosticsOptions({validate:!0,enableSchemaRequest:!1,schemas:[{uri:"http://custom-schema/object-required.json",fileMatch:["*"],schema:{type:"object",description:"Top-level value must be an object",additionalProperties:!0}}]})}const{Editor:l}=f;return u.jsx(l,{beforeMount:d,height:"100%",defaultLanguage:"json",value:e,onChange:o,theme:n,onValidate:r,options:{minimap:{enabled:!1},formatOnType:!0,formatOnPaste:!0,selectOnLineNumbers:!1,automaticLayout:!0,scrollBeyondLastLine:!1,wordWrap:"on",smoothScrolling:!0,overviewRulerLanes:0,scrollbar:{horizontal:"hidden",verticalScrollbarSize:4,verticalSliderSize:4},...t??{}}})};exports.DialJsonEditor=k;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),b=require("react"),O=require("@uiw/react-md-editor"),_=require("./lazy-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),b=require("react"),O=require("@uiw/react-md-editor"),_=require("./lazy-_W6FYhKg.cjs"),k=require("./merge-classes-BEJXjzkx.cjs"),o=require("@tabler/icons-react"),p=require("./icon-DhjrDQ8I.cjs"),f=require("./icon-CrGVkVpG.cjs");function E(n){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const r in n)if(r!=="default"){const c=Object.getOwnPropertyDescriptor(n,r);Object.defineProperty(i,r,c.get?c:{enumerable:!0,get:()=>n[r]})}}return i.default=n,Object.freeze(i)}const h=E(O),L=f.DIAL_ICON_SIZE.SM,t={size:L,stroke:p.DIAL_KIT_ICON_STROKE},s=(n,i)=>({...n,icon:i}),M=()=>{const{bold:n,code:i,divider:r,group:c,heading1:a,heading2:d,heading3:u,italic:l,link:m,orderedListCommand:I,quote:g,strikethrough:x,table:j,unorderedListCommand:C}=h;return[s(n,e.jsx(o.IconBold,{...t})),s(l,e.jsx(o.IconItalic,{...t})),s(x,e.jsx(o.IconStrikethrough,{...t})),r,c([a,d,u],{name:"heading",groupName:"heading",icon:e.jsx(o.IconTextSize,{...t}),buttonProps:{"aria-label":"Text style",title:"Text style"}}),r,s(C,e.jsx(o.IconList,{...t})),s(I,e.jsx(o.IconListNumbers,{...t})),r,s(g,e.jsx(o.IconQuote,{...t})),s(m,e.jsx(o.IconLink,{...t})),s(i,e.jsx(o.IconCode,{...t})),r,s(j,e.jsx(o.IconTable,{...t}))]},S=()=>{const{codeEdit:n,codeLive:i,codePreview:r,divider:c,fullscreen:a}=h;return[s(n,e.jsx(o.IconPencil,{...t})),s(i,e.jsx(o.IconLayoutColumns,{...t})),s(r,e.jsx(o.IconEye,{...t})),c,s(a,e.jsx(o.IconMaximize,{...t}))]},T=({value:n,onChange:i,height:r=300,theme:c=_.EditorThemes.light,className:a,placeholder:d,defaultPreview:u="edit",id:l,ariaLabel:m,showDragbar:I=!0})=>{const g=b.useMemo(()=>M(),[]),x=b.useMemo(()=>S(),[]);return e.jsx("div",{"data-color-mode":c,className:k.mergeClasses("dial-kit-markdown-editor",a),children:e.jsx(O,{value:n,onChange:j=>i?.(j||""),height:r,preview:u,visibleDragbar:I,commands:g,extraCommands:x,textareaProps:{placeholder:d,id:l,"aria-label":m}})})};exports.MarkdownEditor=T;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),m=require("@uiw/react-md-editor"),u=require("./lazy-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),m=require("@uiw/react-md-editor"),u=require("./lazy-_W6FYhKg.cjs"),x=require("./merge-classes-BEJXjzkx.cjs"),g=({value:r,onChange:s,height:o=300,preview:i="edit",theme:a=u.EditorThemes.dark,className:n,placeholder:t,showDragbar:d=!0})=>{const l=t!==void 0&&!r;return e.jsxs("div",{"data-color-mode":a,className:x.mergeClasses("relative",n),children:[e.jsx(m,{value:r,onChange:c=>s?.(c||""),height:o,preview:i,visibleDragbar:d}),l&&e.jsx("div",{className:"pointer-events-none absolute left-0 top-8 px-2 dial-small-text text-secondary opacity-40",children:t})]})};exports.DialMarkdownEditor=g;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("react"),m=require("./Switch-DAaAOaIu.cjs"),N=require("./lazy-_W6FYhKg.cjs"),b=require("./MarkdownEditor-Bapd1ycU.cjs"),g=({value:r,onChangeValue:l,label:i,headerContent:a,switcherLabel:d,height:c=300,theme:u=N.EditorThemes.dark,onValidateJSON:x,preview:j="edit",showDragbar:w=!0})=>{const C=n.useId(),[t,p]=n.useState(!1),[f,S]=n.useState(null);n.useEffect(()=>{t&&typeof window<"u"&&Promise.resolve().then(()=>require("./JsonEditor-Bxui5wJH.cjs")).then(s=>{S(()=>s.DialJsonEditor)})},[t]);const h=n.useCallback(s=>{l?.(s)},[l]),E=n.useCallback(s=>{x?.(s)},[x]),o=!!d;return e.jsx("div",{className:"size-full flex flex-col",children:e.jsx("div",{className:"flex flex-col gap-8",children:e.jsxs("div",{children:[(i||a||o)&&e.jsxs("div",{className:"flex justify-between items-center mb-2",children:[i&&e.jsx(m.DialLabel,{label:i}),e.jsxs("div",{className:"flex items-center gap-2 flex-1 justify-end",children:[a,o&&e.jsx("label",{className:"flex items-center gap-2 cursor-pointer",children:e.jsx(m.DialSwitch,{isOn:t,label:d,switchId:C,onChange:s=>p(s)})})]})]}),o&&t?e.jsx("div",{className:"border border-primary rounded",style:{height:`${c}px`},children:f&&e.jsx(f,{value:r,onChange:h,onValidateJSON:E,currentTheme:u})}):e.jsx(b.DialMarkdownEditor,{value:r,onChange:h,height:c,preview:j,showDragbar:w,theme:u})]})})})};exports.DialMarkdownEditorContainer=g;
|
|
@@ -1,29 +1,27 @@
|
|
|
1
1
|
import { jsx as e, jsxs as r } from "react/jsx-runtime";
|
|
2
2
|
import { useId as J, useState as u, useEffect as S, useCallback as x } from "react";
|
|
3
|
-
import "
|
|
4
|
-
import { EditorThemes as
|
|
5
|
-
import "@monaco-editor/react";
|
|
6
|
-
import { DialSwitch as v } from "../Switch/Switch.js";
|
|
3
|
+
import { DialSwitch as b } from "../Switch/Switch.js";
|
|
4
|
+
import { EditorThemes as v } from "../../types/editor.js";
|
|
7
5
|
import { DialMarkdownEditor as y } from "./MarkdownEditor.js";
|
|
8
6
|
import { DialLabel as j } from "../Label/Label.js";
|
|
9
|
-
const
|
|
7
|
+
const B = ({
|
|
10
8
|
value: s,
|
|
11
9
|
onChangeValue: l,
|
|
12
|
-
label:
|
|
10
|
+
label: t,
|
|
13
11
|
headerContent: d,
|
|
14
12
|
switcherLabel: a,
|
|
15
13
|
height: c = 300,
|
|
16
|
-
theme: m =
|
|
14
|
+
theme: m = v.dark,
|
|
17
15
|
onValidateJSON: f,
|
|
18
16
|
preview: C = "edit",
|
|
19
17
|
showDragbar: N = !0
|
|
20
18
|
}) => {
|
|
21
|
-
const w = J(), [
|
|
19
|
+
const w = J(), [n, D] = u(!1), [p, E] = u(null);
|
|
22
20
|
S(() => {
|
|
23
|
-
|
|
21
|
+
n && typeof window < "u" && import("../JsonEditor/JsonEditor.js").then((o) => {
|
|
24
22
|
E(() => o.DialJsonEditor);
|
|
25
23
|
});
|
|
26
|
-
}, [
|
|
24
|
+
}, [n]);
|
|
27
25
|
const h = x(
|
|
28
26
|
(o) => {
|
|
29
27
|
l?.(o);
|
|
@@ -34,16 +32,16 @@ const q = ({
|
|
|
34
32
|
f?.(o);
|
|
35
33
|
},
|
|
36
34
|
[f]
|
|
37
|
-
),
|
|
35
|
+
), i = !!a;
|
|
38
36
|
return /* @__PURE__ */ e("div", { className: "size-full flex flex-col", children: /* @__PURE__ */ e("div", { className: "flex flex-col gap-8", children: /* @__PURE__ */ r("div", { children: [
|
|
39
|
-
(
|
|
40
|
-
|
|
37
|
+
(t || d || i) && /* @__PURE__ */ r("div", { className: "flex justify-between items-center mb-2", children: [
|
|
38
|
+
t && /* @__PURE__ */ e(j, { label: t }),
|
|
41
39
|
/* @__PURE__ */ r("div", { className: "flex items-center gap-2 flex-1 justify-end", children: [
|
|
42
40
|
d,
|
|
43
|
-
|
|
44
|
-
|
|
41
|
+
i && /* @__PURE__ */ e("label", { className: "flex items-center gap-2 cursor-pointer", children: /* @__PURE__ */ e(
|
|
42
|
+
b,
|
|
45
43
|
{
|
|
46
|
-
isOn:
|
|
44
|
+
isOn: n,
|
|
47
45
|
label: a,
|
|
48
46
|
switchId: w,
|
|
49
47
|
onChange: (o) => D(o)
|
|
@@ -51,7 +49,7 @@ const q = ({
|
|
|
51
49
|
) })
|
|
52
50
|
] })
|
|
53
51
|
] }),
|
|
54
|
-
|
|
52
|
+
i && n ? /* @__PURE__ */ e(
|
|
55
53
|
"div",
|
|
56
54
|
{
|
|
57
55
|
className: "border border-primary rounded",
|
|
@@ -80,5 +78,5 @@ const q = ({
|
|
|
80
78
|
] }) }) });
|
|
81
79
|
};
|
|
82
80
|
export {
|
|
83
|
-
|
|
81
|
+
B as DialMarkdownEditorContainer
|
|
84
82
|
};
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
import { jsxs as d, jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import { useId as o } from "react";
|
|
3
|
+
import { mergeClasses as t } from "../../../utils/merge-classes.js";
|
|
4
|
+
import { DIAL_KIT_CLASS as x } from "../../../constants/public-class-names.js";
|
|
5
|
+
const h = ({
|
|
6
|
+
title: i,
|
|
7
|
+
description: r,
|
|
8
|
+
icon: l,
|
|
9
|
+
action: s,
|
|
10
|
+
className: m,
|
|
11
|
+
titleClassName: n,
|
|
12
|
+
descriptionClassName: c
|
|
13
|
+
}) => {
|
|
14
|
+
const a = o();
|
|
15
|
+
return /* @__PURE__ */ d(
|
|
16
|
+
"section",
|
|
17
|
+
{
|
|
18
|
+
"aria-labelledby": a,
|
|
19
|
+
className: t(
|
|
20
|
+
"flex size-full flex-col items-center justify-center px-4 text-center",
|
|
21
|
+
m,
|
|
22
|
+
x.stateScreen
|
|
23
|
+
),
|
|
24
|
+
children: [
|
|
25
|
+
l != null && /* @__PURE__ */ e(
|
|
26
|
+
"span",
|
|
27
|
+
{
|
|
28
|
+
"aria-hidden": "true",
|
|
29
|
+
className: "mb-4 flex size-14 items-center justify-center rounded-full border border-secondary text-secondary",
|
|
30
|
+
children: l
|
|
31
|
+
}
|
|
32
|
+
),
|
|
33
|
+
/* @__PURE__ */ e(
|
|
34
|
+
"h1",
|
|
35
|
+
{
|
|
36
|
+
id: a,
|
|
37
|
+
className: t(
|
|
38
|
+
"dial-body-semi-text text-primary",
|
|
39
|
+
n
|
|
40
|
+
),
|
|
41
|
+
children: i
|
|
42
|
+
}
|
|
43
|
+
),
|
|
44
|
+
r != null && /* @__PURE__ */ e(
|
|
45
|
+
"p",
|
|
46
|
+
{
|
|
47
|
+
className: t(
|
|
48
|
+
"dial-small-text mt-2 text-secondary",
|
|
49
|
+
c
|
|
50
|
+
),
|
|
51
|
+
children: r
|
|
52
|
+
}
|
|
53
|
+
),
|
|
54
|
+
s != null && /* @__PURE__ */ e("div", { className: "mt-4", children: s })
|
|
55
|
+
]
|
|
56
|
+
}
|
|
57
|
+
);
|
|
58
|
+
};
|
|
59
|
+
export {
|
|
60
|
+
h as StateScreen
|
|
61
|
+
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
|
-
"version": "0.16.0-dev.
|
|
3
|
-
"generatedAt": "2026-10-
|
|
2
|
+
"version": "0.16.0-dev.25",
|
|
3
|
+
"generatedAt": "2026-10-21T16:36:58.089Z",
|
|
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",
|
|
@@ -5115,6 +5115,60 @@
|
|
|
5115
5115
|
],
|
|
5116
5116
|
"sourceFile": "components/New/NoDataContent/NoDataContent.tsx"
|
|
5117
5117
|
},
|
|
5118
|
+
{
|
|
5119
|
+
"name": "StateScreen",
|
|
5120
|
+
"category": "Components_2_0",
|
|
5121
|
+
"generation": "2.0",
|
|
5122
|
+
"description": "A whole screen given over to one state the app cannot work past: signed out,\naccess denied, a misconfigured provider.\naliases: AuthScreen|LoginScreen|ForbiddenPage|AccessDenied|ErrorPage|FullPageState\nDesign system 2.0\n\nFills its container and centres a round icon badge, an `h1`, an optional\ndescription and an optional action. The root is a `section` named by its\ntitle, so the state is a landmark of its own. For an empty list or grid\ninside a page, use `NoDataContent` instead.",
|
|
5123
|
+
"props": [
|
|
5124
|
+
{
|
|
5125
|
+
"name": "title",
|
|
5126
|
+
"type": "ReactNode",
|
|
5127
|
+
"required": true,
|
|
5128
|
+
"description": "Headline of the state, rendered as the page's `h1`."
|
|
5129
|
+
},
|
|
5130
|
+
{
|
|
5131
|
+
"name": "description",
|
|
5132
|
+
"type": "ReactNode",
|
|
5133
|
+
"required": false,
|
|
5134
|
+
"description": "Optional line under the title."
|
|
5135
|
+
},
|
|
5136
|
+
{
|
|
5137
|
+
"name": "icon",
|
|
5138
|
+
"type": "ReactNode",
|
|
5139
|
+
"required": false,
|
|
5140
|
+
"description": "Glyph drawn in the round badge; the badge is omitted without one."
|
|
5141
|
+
},
|
|
5142
|
+
{
|
|
5143
|
+
"name": "action",
|
|
5144
|
+
"type": "ReactNode",
|
|
5145
|
+
"required": false,
|
|
5146
|
+
"description": "The way out of the state, rendered under the text."
|
|
5147
|
+
},
|
|
5148
|
+
{
|
|
5149
|
+
"name": "className",
|
|
5150
|
+
"type": "string",
|
|
5151
|
+
"required": false,
|
|
5152
|
+
"description": "Additional CSS classes for the container."
|
|
5153
|
+
},
|
|
5154
|
+
{
|
|
5155
|
+
"name": "titleClassName",
|
|
5156
|
+
"type": "string",
|
|
5157
|
+
"required": false,
|
|
5158
|
+
"description": "Additional CSS classes for the title."
|
|
5159
|
+
},
|
|
5160
|
+
{
|
|
5161
|
+
"name": "descriptionClassName",
|
|
5162
|
+
"type": "string",
|
|
5163
|
+
"required": false,
|
|
5164
|
+
"description": "Additional CSS classes for the description."
|
|
5165
|
+
}
|
|
5166
|
+
],
|
|
5167
|
+
"examples": [
|
|
5168
|
+
"<StateScreen\n icon={<IconLock size={DIAL_ICON_SIZE.LG} stroke={DIAL_KIT_ICON_STROKE} />}\n title=\"Log in to configure your QuickApp\"\n description=\"Set up instructions, add-ons and settings.\"\n action={<NeutralButton label=\"Log in\" onClick={openLogin} />}\n/>"
|
|
5169
|
+
],
|
|
5170
|
+
"sourceFile": "components/New/StateScreen/StateScreen.tsx"
|
|
5171
|
+
},
|
|
5118
5172
|
{
|
|
5119
5173
|
"name": "TransferQueue",
|
|
5120
5174
|
"category": "Components_2_0",
|
|
@@ -11745,7 +11799,7 @@
|
|
|
11745
11799
|
{
|
|
11746
11800
|
"name": "DIAL_KIT_CLASS",
|
|
11747
11801
|
"sourceFile": "constants/public-class-names.ts",
|
|
11748
|
-
"signature": "DIAL_KIT_CLASS = {\n /* ── Feedback and status ───────────────────────────────────────────────── */\n /** The `role=\"status\"` root of a `Spinner`. */\n spinner: 'dial-kit-spinner',\n /**\n * The outermost element of a `ProgressBar`: the box wrapping its label,\n * track and readout — or the track itself, which is the root when the bar\n * has neither.\n */\n progressBar: 'dial-kit-progress-bar',\n /** The root of a `Skeleton`, wrapping its avatar and text rows. */\n skeleton: 'dial-kit-skeleton',\n /**\n * The `Notification` surface. Present on every wrapper too — the toast and\n * section-message variants of error, info, success, warning, loading and\n * general all render this component.\n */\n notification: 'dial-kit-notification',\n /** The empty-state root of `NoDataContent`. */\n noDataContent: 'dial-kit-no-data-content',\n /** The `role=\"status\"` panel of a `TransferQueue`: header, rows and aggregate bar. */\n transferQueue: 'dial-kit-transfer-queue',\n\n /* ── Text ──────────────────────────────────────────────────────────────── */\n /** The text element of a `Highlight`, which renders the matched query. */\n highlight: 'dial-kit-highlight',\n /** The caption line under a field, rendered by `CaptionText`. */\n captionText: 'dial-kit-caption-text',\n /**\n * A caption in its error variant — what `ErrorText` renders. Additive to\n * `captionText`, since one component draws both.\n */\n errorText: 'dial-kit-error-text',\n /** The `Label` root, which wraps the `label` element and its info button. */\n label: 'dial-kit-label',\n\n /* ── Containers ────────────────────────────────────────────────────────── */\n /** The `article` element of a `CardShell`. */\n cardShell: 'dial-kit-card-shell',\n /** The `aside` element of a `CollapsibleSidebar`. */\n collapsibleSidebar: 'dial-kit-collapsible-sidebar',\n /** The content box inside a `ResizableContainer`'s resize frame. */\n resizableContainer: 'dial-kit-resizable-container',\n /** The `role=\"separator\"` element of a `ResizeHandle`. */\n resizeHandle: 'dial-kit-resize-handle',\n /**\n * The `role=\"dialog\"` panel of a `Popup`. Its backdrop is reached through\n * `overlayClassName`.\n */\n popup: 'dial-kit-popup',\n /** The `role=\"dialog\"` panel of a `BottomSheet`. */\n bottomSheet: 'dial-kit-bottom-sheet',\n /**\n * The backdrop of a `BottomSheet`: the portalled, scroll-locking layer on\n * `z-popup` that holds the panel.\n */\n bottomSheetOverlay: 'dial-kit-bottom-sheet-overlay',\n /** The `role=\"dialog\"` panel of a `SideDrawer`, open or closed. */\n sideDrawer: 'dial-kit-side-drawer',\n /** The `Popup` panel of a `ConfirmationPopup`, additive to `popup`. */\n confirmationPopup: 'dial-kit-confirmation-popup',\n /** The root of an `Accordion`. */\n accordion: 'dial-kit-accordion',\n /** The breadcrumb root of a `FolderPath`. */\n folderPath: 'dial-kit-folder-path',\n /** The `nav` element of a `Breadcrumbs` trail. */\n breadcrumbs: 'dial-kit-breadcrumbs',\n /**\n * One segment of a `Breadcrumbs` trail: the link, button or plain span that\n * draws the label — not the `li`, which also holds the separator after it.\n */\n breadcrumbsItem: 'dial-kit-breadcrumbs-item',\n\n /* ── Menus and overlays ────────────────────────────────────────────────── */\n /**\n * The trigger wrapper of a `Dropdown`. Its floating panel is reached through\n * `listClassName`.\n */\n dropdown: 'dial-kit-dropdown',\n /**\n * The `role=\"none\"` item list inside a dropdown overlay — the box that holds\n * the rows and owns their vertical padding. Present in both generations, and\n * on a submenu's own list. It is *not* the floating panel.\n */\n dropdownList: 'dial-kit-dropdown-list',\n /** The search row above the item list of a `searchable` `Dropdown`. */\n dropdownSearch: 'dial-kit-dropdown-search',\n /**\n * One row of a floating overlay: a dropdown item, a `Select` option, a\n * submenu trigger, or a submenu child. It sits on the element that draws the\n * row box — so on the wrapper, not the inner button, for a row that has a\n * `rightControl` beside it.\n */\n menuItem: 'dial-kit-menuitem',\n /**\n * The trailing check of a chosen `MenuItemMark.Check` row. Decorative, like\n * the glyph itself — the row's `aria-checked` / `aria-selected` carries the\n * state.\n */\n menuItemCheck: 'dial-kit-menuitem-check',\n /** The primary icon of a `DialDropdownIcon` trigger. */\n dropdownIcon: 'dial-kit-dropdown-icon',\n /**\n * The caret badge of a `DialDropdownIcon` trigger — the round plate the\n * chevron sits on. Absent when `showCaret` is `false`.\n */\n dropdownIconCaret: 'dial-kit-dropdown-icon-caret',\n /** The bubble of a `Tooltip`, rendered by `TooltipContent` into a portal. */\n tooltip: 'dial-kit-tooltip',\n /** The panel of an `InteractiveTooltip` — the one whose content takes focus. */\n interactiveTooltip: 'dial-kit-interactive-tooltip',\n /** The text element of an `EllipsisTooltip`, which is also its trigger. */\n ellipsisTooltip: 'dial-kit-ellipsis-tooltip',\n\n /* ── Fields ────────────────────────────────────────────────────────────── */\n /** The `Search` field, additive to the `dial-kit-input` its `Input` carries. */\n search: 'dial-kit-search',\n /** The `PasswordInput` field, additive to `dial-kit-input`. */\n passwordInput: 'dial-kit-password-input',\n /** The `NumberInput` field, additive to `dial-kit-input`. */\n numberInput: 'dial-kit-number-input',\n /** The `TagInput` field, additive to `dial-kit-input`. */\n tagInput: 'dial-kit-tag-input',\n /** The `AutocompleteTagInput` field, additive to `dial-kit-input`. */\n autocompleteTagInput: 'dial-kit-autocomplete-tag-input',\n /** The root of a `Select`, wrapping its label, field and caption. */\n select: 'dial-kit-select',\n /** The trigger button of an `InlineSelect`. */\n inlineSelect: 'dial-kit-inline-select',\n /** The root of a `Calendar`, wrapping its label and date field. */\n calendar: 'dial-kit-calendar',\n /** The root of a `SchemaRenderer`, wrapping its top-level sections or fields. */\n schemaRenderer: 'dial-kit-schema-renderer',\n /**\n * The card of one collapsible `SchemaRenderer` section, at any depth: a\n * top-level property, a nested object or array, an array item, or a\n * key-value entry holding an object.\n */\n schemaRendererSection: 'dial-kit-schema-renderer-section',\n /** The drop area of a `FileDropzone`. */\n fileDropzone: 'dial-kit-file-dropzone',\n /**\n * The root of a `FileIcon`, wrapping the file or folder glyph (or\n * its spinner while loading) and the shared badge.\n */\n fileIcon: 'dial-kit-file-icon',\n /** The row of a `FileName`: its type icon, the name and any details. */\n fileName: 'dial-kit-file-name',\n /** The `FileName` row of a `FolderName`, additive to `fileName`. */\n folderName: 'dial-kit-folder-name',\n /**\n * The `role=\"img\"` badge of a `SharedEntityIndicator` — standalone, or the\n * shared badge a `FileIcon` draws over its glyph.\n */\n sharedEntityIndicator: 'dial-kit-shared-entity-indicator',\n /** The root of a `Badge`: the label box, with its icon when it has one. */\n badge: 'dial-kit-badge',\n /** The root of an `Avatar`: the image, or the initials box that replaces it. */\n avatar: 'dial-kit-avatar',\n /** The root row of an `EntityIdentity`: its icon, type label, name and version. */\n entityIdentity: 'dial-kit-entity-identity',\n\n /* ── Controls ──────────────────────────────────────────────────────────── */\n /** The row of a `Switch`: the control and its label. */\n switch: 'dial-kit-switch',\n /** The row of a `Checkbox`: the box and its label. */\n checkbox: 'dial-kit-checkbox',\n /** The decorative box a `CheckboxBox` draws, in a checkbox or a menu row. */\n checkboxBox: 'dial-kit-checkbox-box',\n /** The row of a `Radio`: the circle and its label. */\n radio: 'dial-kit-radio',\n /** The root of a `RadioGroup`, wrapping its label and its radios. */\n radioGroup: 'dial-kit-radio-group',\n /**\n * The root of a `RadioGroupPopupField`, wrapping its label and the collapsed\n * field that opens the group.\n */\n radioGroupPopupField: 'dial-kit-radio-group-popup-field',\n /** The `role=\"radiogroup\"` track of a `SegmentedControl`. */\n segmentedControl: 'dial-kit-segmented-control',\n /** One segment of a `SegmentedControl`. */\n segmentedControlItem: 'dial-kit-segmented-control-item',\n /**\n * The outermost element of a `Tabs`: the box wrapping its heading and tab\n * list — or the `role=\"tablist\"` itself, which is the root when the tabs\n * carry no `sectionLabel`.\n */\n tabs: 'dial-kit-tabs',\n /**\n * The `role=\"tablist\"` holding the tabs, in either orientation. Additive to\n * `tabs` when there is no heading above it, since one element is then both.\n */\n tabList: 'dial-kit-tab-list',\n /**\n * One tab inside `Tabs`, in either orientation. The selected tab of a\n * horizontal row keeps its own `dial-kit-tab-selected-underline`.\n */\n tab: 'dial-kit-tab',\n /**\n * The selected tab, additive to `tab`. A horizontal row draws its selection\n * with `dial-kit-tab-selected-underline`, which carries the gradient rule;\n * this one carries no declarations and marks the selected tab in either\n * orientation.\n */\n tabSelected: 'dial-kit-tab-selected',\n /** The `sectionLabel` heading above a `Tabs`. Absent when there is none. */\n tabsSectionLabel: 'dial-kit-tabs-section-label',\n /**\n * The `role=\"group\"` row of a `FilterChips`. Its chips are `Tag` pills, so\n * they carry `dial-kit-tag` and have no entry of their own.\n */\n filterChips: 'dial-kit-filter-chips',\n /** A `Tag` pill, wherever it is rendered — including a `TagInput`'s rows. */\n tag: 'dial-kit-tag',\n /**\n * A `ToggleIconButton`, additive to the `dial-kit-base-icon-button` it\n * already carries.\n */\n toggleIconButton: 'dial-kit-toggle-icon-button',\n /** A `CloseButton`, additive to `dial-kit-base-icon-button`. */\n closeButton: 'dial-kit-close-button',\n /** An `InfoButton`, additive to `dial-kit-base-icon-button`. */\n infoButton: 'dial-kit-info-button',\n /**\n * The wrapper of a `ButtonDropdown` — its trigger carries\n * `dial-kit-base-button`.\n */\n buttonDropdown: 'dial-kit-button-dropdown',\n} as const"
|
|
11802
|
+
"signature": "DIAL_KIT_CLASS = {\n /* ── Feedback and status ───────────────────────────────────────────────── */\n /** The `role=\"status\"` root of a `Spinner`. */\n spinner: 'dial-kit-spinner',\n /**\n * The outermost element of a `ProgressBar`: the box wrapping its label,\n * track and readout — or the track itself, which is the root when the bar\n * has neither.\n */\n progressBar: 'dial-kit-progress-bar',\n /** The root of a `Skeleton`, wrapping its avatar and text rows. */\n skeleton: 'dial-kit-skeleton',\n /**\n * The `Notification` surface. Present on every wrapper too — the toast and\n * section-message variants of error, info, success, warning, loading and\n * general all render this component.\n */\n notification: 'dial-kit-notification',\n /** The empty-state root of `NoDataContent`. */\n noDataContent: 'dial-kit-no-data-content',\n /** The `section` root of a `StateScreen`. */\n stateScreen: 'dial-kit-state-screen',\n /** The `role=\"status\"` panel of a `TransferQueue`: header, rows and aggregate bar. */\n transferQueue: 'dial-kit-transfer-queue',\n\n /* ── Text ──────────────────────────────────────────────────────────────── */\n /** The text element of a `Highlight`, which renders the matched query. */\n highlight: 'dial-kit-highlight',\n /** The caption line under a field, rendered by `CaptionText`. */\n captionText: 'dial-kit-caption-text',\n /**\n * A caption in its error variant — what `ErrorText` renders. Additive to\n * `captionText`, since one component draws both.\n */\n errorText: 'dial-kit-error-text',\n /** The `Label` root, which wraps the `label` element and its info button. */\n label: 'dial-kit-label',\n\n /* ── Containers ────────────────────────────────────────────────────────── */\n /** The `article` element of a `CardShell`. */\n cardShell: 'dial-kit-card-shell',\n /** The `aside` element of a `CollapsibleSidebar`. */\n collapsibleSidebar: 'dial-kit-collapsible-sidebar',\n /** The content box inside a `ResizableContainer`'s resize frame. */\n resizableContainer: 'dial-kit-resizable-container',\n /** The `role=\"separator\"` element of a `ResizeHandle`. */\n resizeHandle: 'dial-kit-resize-handle',\n /**\n * The `role=\"dialog\"` panel of a `Popup`. Its backdrop is reached through\n * `overlayClassName`.\n */\n popup: 'dial-kit-popup',\n /** The `role=\"dialog\"` panel of a `BottomSheet`. */\n bottomSheet: 'dial-kit-bottom-sheet',\n /**\n * The backdrop of a `BottomSheet`: the portalled, scroll-locking layer on\n * `z-popup` that holds the panel.\n */\n bottomSheetOverlay: 'dial-kit-bottom-sheet-overlay',\n /** The `role=\"dialog\"` panel of a `SideDrawer`, open or closed. */\n sideDrawer: 'dial-kit-side-drawer',\n /** The `Popup` panel of a `ConfirmationPopup`, additive to `popup`. */\n confirmationPopup: 'dial-kit-confirmation-popup',\n /** The root of an `Accordion`. */\n accordion: 'dial-kit-accordion',\n /** The breadcrumb root of a `FolderPath`. */\n folderPath: 'dial-kit-folder-path',\n /** The `nav` element of a `Breadcrumbs` trail. */\n breadcrumbs: 'dial-kit-breadcrumbs',\n /**\n * One segment of a `Breadcrumbs` trail: the link, button or plain span that\n * draws the label — not the `li`, which also holds the separator after it.\n */\n breadcrumbsItem: 'dial-kit-breadcrumbs-item',\n\n /* ── Menus and overlays ────────────────────────────────────────────────── */\n /**\n * The trigger wrapper of a `Dropdown`. Its floating panel is reached through\n * `listClassName`.\n */\n dropdown: 'dial-kit-dropdown',\n /**\n * The `role=\"none\"` item list inside a dropdown overlay — the box that holds\n * the rows and owns their vertical padding. Present in both generations, and\n * on a submenu's own list. It is *not* the floating panel.\n */\n dropdownList: 'dial-kit-dropdown-list',\n /** The search row above the item list of a `searchable` `Dropdown`. */\n dropdownSearch: 'dial-kit-dropdown-search',\n /**\n * One row of a floating overlay: a dropdown item, a `Select` option, a\n * submenu trigger, or a submenu child. It sits on the element that draws the\n * row box — so on the wrapper, not the inner button, for a row that has a\n * `rightControl` beside it.\n */\n menuItem: 'dial-kit-menuitem',\n /**\n * The trailing check of a chosen `MenuItemMark.Check` row. Decorative, like\n * the glyph itself — the row's `aria-checked` / `aria-selected` carries the\n * state.\n */\n menuItemCheck: 'dial-kit-menuitem-check',\n /** The primary icon of a `DialDropdownIcon` trigger. */\n dropdownIcon: 'dial-kit-dropdown-icon',\n /**\n * The caret badge of a `DialDropdownIcon` trigger — the round plate the\n * chevron sits on. Absent when `showCaret` is `false`.\n */\n dropdownIconCaret: 'dial-kit-dropdown-icon-caret',\n /** The bubble of a `Tooltip`, rendered by `TooltipContent` into a portal. */\n tooltip: 'dial-kit-tooltip',\n /** The panel of an `InteractiveTooltip` — the one whose content takes focus. */\n interactiveTooltip: 'dial-kit-interactive-tooltip',\n /** The text element of an `EllipsisTooltip`, which is also its trigger. */\n ellipsisTooltip: 'dial-kit-ellipsis-tooltip',\n\n /* ── Fields ────────────────────────────────────────────────────────────── */\n /** The `Search` field, additive to the `dial-kit-input` its `Input` carries. */\n search: 'dial-kit-search',\n /** The `PasswordInput` field, additive to `dial-kit-input`. */\n passwordInput: 'dial-kit-password-input',\n /** The `NumberInput` field, additive to `dial-kit-input`. */\n numberInput: 'dial-kit-number-input',\n /** The `TagInput` field, additive to `dial-kit-input`. */\n tagInput: 'dial-kit-tag-input',\n /** The `AutocompleteTagInput` field, additive to `dial-kit-input`. */\n autocompleteTagInput: 'dial-kit-autocomplete-tag-input',\n /** The root of a `Select`, wrapping its label, field and caption. */\n select: 'dial-kit-select',\n /** The trigger button of an `InlineSelect`. */\n inlineSelect: 'dial-kit-inline-select',\n /** The root of a `Calendar`, wrapping its label and date field. */\n calendar: 'dial-kit-calendar',\n /** The root of a `SchemaRenderer`, wrapping its top-level sections or fields. */\n schemaRenderer: 'dial-kit-schema-renderer',\n /**\n * The card of one collapsible `SchemaRenderer` section, at any depth: a\n * top-level property, a nested object or array, an array item, or a\n * key-value entry holding an object.\n */\n schemaRendererSection: 'dial-kit-schema-renderer-section',\n /** The drop area of a `FileDropzone`. */\n fileDropzone: 'dial-kit-file-dropzone',\n /**\n * The root of a `FileIcon`, wrapping the file or folder glyph (or\n * its spinner while loading) and the shared badge.\n */\n fileIcon: 'dial-kit-file-icon',\n /** The row of a `FileName`: its type icon, the name and any details. */\n fileName: 'dial-kit-file-name',\n /** The `FileName` row of a `FolderName`, additive to `fileName`. */\n folderName: 'dial-kit-folder-name',\n /**\n * The `role=\"img\"` badge of a `SharedEntityIndicator` — standalone, or the\n * shared badge a `FileIcon` draws over its glyph.\n */\n sharedEntityIndicator: 'dial-kit-shared-entity-indicator',\n /** The root of a `Badge`: the label box, with its icon when it has one. */\n badge: 'dial-kit-badge',\n /** The root of an `Avatar`: the image, or the initials box that replaces it. */\n avatar: 'dial-kit-avatar',\n /** The root row of an `EntityIdentity`: its icon, type label, name and version. */\n entityIdentity: 'dial-kit-entity-identity',\n\n /* ── Controls ──────────────────────────────────────────────────────────── */\n /** The row of a `Switch`: the control and its label. */\n switch: 'dial-kit-switch',\n /** The row of a `Checkbox`: the box and its label. */\n checkbox: 'dial-kit-checkbox',\n /** The decorative box a `CheckboxBox` draws, in a checkbox or a menu row. */\n checkboxBox: 'dial-kit-checkbox-box',\n /** The row of a `Radio`: the circle and its label. */\n radio: 'dial-kit-radio',\n /** The root of a `RadioGroup`, wrapping its label and its radios. */\n radioGroup: 'dial-kit-radio-group',\n /**\n * The root of a `RadioGroupPopupField`, wrapping its label and the collapsed\n * field that opens the group.\n */\n radioGroupPopupField: 'dial-kit-radio-group-popup-field',\n /** The `role=\"radiogroup\"` track of a `SegmentedControl`. */\n segmentedControl: 'dial-kit-segmented-control',\n /** One segment of a `SegmentedControl`. */\n segmentedControlItem: 'dial-kit-segmented-control-item',\n /**\n * The outermost element of a `Tabs`: the box wrapping its heading and tab\n * list — or the `role=\"tablist\"` itself, which is the root when the tabs\n * carry no `sectionLabel`.\n */\n tabs: 'dial-kit-tabs',\n /**\n * The `role=\"tablist\"` holding the tabs, in either orientation. Additive to\n * `tabs` when there is no heading above it, since one element is then both.\n */\n tabList: 'dial-kit-tab-list',\n /**\n * One tab inside `Tabs`, in either orientation. The selected tab of a\n * horizontal row keeps its own `dial-kit-tab-selected-underline`.\n */\n tab: 'dial-kit-tab',\n /**\n * The selected tab, additive to `tab`. A horizontal row draws its selection\n * with `dial-kit-tab-selected-underline`, which carries the gradient rule;\n * this one carries no declarations and marks the selected tab in either\n * orientation.\n */\n tabSelected: 'dial-kit-tab-selected',\n /** The `sectionLabel` heading above a `Tabs`. Absent when there is none. */\n tabsSectionLabel: 'dial-kit-tabs-section-label',\n /**\n * The `role=\"group\"` row of a `FilterChips`. Its chips are `Tag` pills, so\n * they carry `dial-kit-tag` and have no entry of their own.\n */\n filterChips: 'dial-kit-filter-chips',\n /** A `Tag` pill, wherever it is rendered — including a `TagInput`'s rows. */\n tag: 'dial-kit-tag',\n /**\n * A `ToggleIconButton`, additive to the `dial-kit-base-icon-button` it\n * already carries.\n */\n toggleIconButton: 'dial-kit-toggle-icon-button',\n /** A `CloseButton`, additive to `dial-kit-base-icon-button`. */\n closeButton: 'dial-kit-close-button',\n /** An `InfoButton`, additive to `dial-kit-base-icon-button`. */\n infoButton: 'dial-kit-info-button',\n /**\n * The wrapper of a `ButtonDropdown` — its trigger carries\n * `dial-kit-base-button`.\n */\n buttonDropdown: 'dial-kit-button-dropdown',\n} as const"
|
|
11749
11803
|
}
|
|
11750
11804
|
]
|
|
11751
11805
|
}
|
|
@@ -18,6 +18,8 @@ const i = {
|
|
|
18
18
|
notification: "dial-kit-notification",
|
|
19
19
|
/** The empty-state root of `NoDataContent`. */
|
|
20
20
|
noDataContent: "dial-kit-no-data-content",
|
|
21
|
+
/** The `section` root of a `StateScreen`. */
|
|
22
|
+
stateScreen: "dial-kit-state-screen",
|
|
21
23
|
/** The `role="status"` panel of a `TransferQueue`: header, rows and aggregate bar. */
|
|
22
24
|
transferQueue: "dial-kit-transfer-queue",
|
|
23
25
|
/* ── Text ──────────────────────────────────────────────────────────────── */
|