@epam/ai-dial-ui-kit 0.16.0-dev.25 → 0.16.0-dev.32
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 +9 -0
- package/dist/{DateCellRenderer-BmgQYPuv.cjs → DateCellRenderer-ZFBZsJdH.cjs} +24 -24
- package/dist/{IconButton-B1Hx0Y3y.cjs → IconButton-CsePS6PY.cjs} +1 -1
- package/dist/{JsonEditor-Bxui5wJH.cjs → JsonEditor-DQhHSm93.cjs} +1 -1
- package/dist/{MarkdownEditor-BKtFs714.cjs → MarkdownEditor-CvIPIbPq.cjs} +1 -1
- package/dist/{MarkdownEditor-Bapd1ycU.cjs → MarkdownEditor-TR6X_gdl.cjs} +1 -1
- package/dist/{MarkdownEditorContainer-DLPODjar.cjs → MarkdownEditorContainer-JIn_VNUX.cjs} +1 -1
- package/dist/{Switch-DAaAOaIu.cjs → Switch-HEL_aq23.cjs} +1 -1
- package/dist/components/New/CaptionText/CaptionText.js +3 -4
- package/dist/components/New/Dropdown/Dropdown.js +208 -197
- package/dist/components/New/Input/Input.js +121 -107
- package/dist/components/New/SchemaRenderer/components/SchemaField.js +45 -44
- package/dist/components/New/SchemaRenderer/components/SchemaFieldContent.js +41 -38
- package/dist/components/New/SchemaRenderer/components/SchemaPrimitiveField.js +45 -39
- package/dist/components/New/Select/Select.js +201 -198
- package/dist/components/New/Textarea/Textarea.js +37 -33
- package/dist/components-manifest.json +10 -4
- package/dist/dial-ui-kit.cjs +3 -3
- package/dist/editors.cjs +1 -1
- package/dist/grid.cjs +1 -1
- package/dist/lazy-kq-xfXXv.cjs +1 -0
- package/dist/{merge-classes-BEJXjzkx.cjs → merge-classes-B0SnCG4i.cjs} +1 -1
- package/dist/migration-guides/0.16.0/caption-text-no-alert-role.md +90 -0
- package/dist/migration-guides/README.md +1 -0
- package/dist/src/components/New/CaptionText/CaptionText.d.ts +8 -1
- package/dist/src/components/New/SchemaRenderer/components/SchemaFieldContent.d.ts +1 -0
- package/dist/src/components/New/SchemaRenderer/components/SchemaPrimitiveField.d.ts +2 -0
- package/dist/src/components/New/SchemaRenderer/types.d.ts +3 -1
- package/dist/src/components/New/Select/Select.d.ts +2 -0
- package/dist/utils/merge-classes.js +36 -7
- package/package.json +1 -1
- package/dist/lazy-_W6FYhKg.cjs +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";const u=require("react/jsx-runtime"),s=require("@floating-ui/react"),c=require("react"),x=require("classnames"),F=require("./merge-classes-
|
|
1
|
+
"use strict";const u=require("react/jsx-runtime"),s=require("@floating-ui/react"),c=require("react"),x=require("classnames"),F=require("./merge-classes-B0SnCG4i.cjs");var l=(e=>(e.Primary="primary",e.Neutral="neutral",e.Danger="danger",e.Static="static",e.Starter="starter",e.Success="success",e.Secondary="secondary",e.Tertiary="tertiary",e))(l||{}),r=(e=>(e.Solid="solid",e.Outlined="outlined",e.Ghost="ghost",e.Link="link",e))(r||{});const v={[l.Primary]:{[r.Solid]:"dial-primary-solid-button",[r.Ghost]:"dial-primary-ghost-button",[r.Link]:"dial-primary-link-button"},[l.Neutral]:{[r.Outlined]:"dial-neutral-outlined-button"},[l.Danger]:{[r.Solid]:"dial-danger-solid-button",[r.Ghost]:"dial-danger-ghost-button",[r.Outlined]:"dial-danger-outlined-button"},[l.Success]:{[r.Ghost]:"dial-success-ghost-button"},[l.Secondary]:{[r.Ghost]:"dial-secondary-ghost-button"},[l.Tertiary]:{[r.Ghost]:"dial-tertiary-ghost-button"},[l.Static]:{},[l.Starter]:{}},S=(e=l.Primary,o=r.Solid)=>{const t=v[e]?.[o];return t||(console.warn(`Could not find Button styles for variant: ${e} and appearance: ${o}. Using default primary solid button styles.`),v[l.Primary][r.Solid])};var h=(e=>(e.Small="small",e.Standard="standard",e.Large="large",e))(h||{});const I=7,A=2,C=c.createContext(null),N=()=>{const e=c.useContext(C);if(e==null)throw new Error("Tooltip components must be wrapped in <Tooltip />");return e},q=({initialOpen:e=!1,placement:o="bottom",isTriggerClickable:t=!1,open:n,onOpenChange:a}={})=>{const[i,p]=c.useState(e),g=c.useRef(null),m=n??i,d=a??p,f=s.useFloating({placement:o,open:m,onOpenChange:d,whileElementsMounted:s.autoUpdate,middleware:[s.offset(I+A),s.flip({crossAxis:o.includes("-"),fallbackAxisSideDirection:"start",padding:5}),s.shift({padding:5}),s.arrow({element:g})]}),M=s.useHover(f.context,{move:!1,enabled:n==null,mouseOnly:t,delay:{open:500,close:0}}),k=s.useFocus(f.context,{enabled:n==null}),P=s.useDismiss(f.context),G=s.useRole(f.context,{role:"tooltip"}),y=s.useInteractions([M,k,P,G]);return c.useEffect(()=>{if(!m)return;const b=f.refs.reference.current;if(!(b instanceof Element))return;const w=new IntersectionObserver(([L])=>{L.isIntersecting||d(!1)},{root:null,threshold:0});return w.observe(b),()=>w.disconnect()},[m,f.refs.reference,d]),c.useMemo(()=>({open:m,setOpen:d,arrowRef:g,...y,...f}),[m,d,y,f])},R=({children:e,...o})=>{const t=q(o);return u.jsx(C.Provider,{value:t,children:e})},T="(hover: none)",_=()=>typeof window>"u"||typeof window.matchMedia!="function"?!1:window.matchMedia(T).matches,D=()=>{const[e,o]=c.useState(()=>!_());return c.useEffect(()=>{if(typeof window>"u"||typeof window.matchMedia!="function")return;const t=window.matchMedia(T);if(o(!t.matches),typeof t.addEventListener!="function")return;const n=a=>o(!a.matches);return t.addEventListener("change",n),()=>t.removeEventListener("change",n)},[]),e},E=({style:e,...o})=>{const t=N(),n=D(),a=c.useRef(null),i=s.useMergeRefs([t.refs.setFloating,a]);return!t.open||!n?null:u.jsx(s.FloatingPortal,{id:"tooltip-portal",children:u.jsxs("div",{ref:i,style:{...t.floatingStyles,...e},...t.getFloatingProps(o),className:x("z-tooltip whitespace-pre-wrap break-words rounded border border-primary bg-layer-0 px-2 py-1 dial-tiny-text shadow max-w-[300px]",t.getFloatingProps(o).className),children:[o.children,u.jsx(s.FloatingArrow,{ref:t.arrowRef,context:t.context,fill:"currentColor",strokeWidth:1,className:"stroke-primary text-[var(--bg-layer-0,_#000000)]"})]})})},H=({children:e,asChild:o=!1,...t})=>{const n=N(),a=o&&c.isValidElement(e),i=a?e.props?.ref:null,p=s.useMergeRefs([n.refs.setReference,...i?[i]:[]]);return a?c.cloneElement(e,n.getReferenceProps({...e.props,...t,ref:p})):u.jsx("span",{ref:p,...n.getReferenceProps(t),className:t.className??"dial-tooltip-trigger text-start",children:e})},j=({hideTooltip:e,tooltip:o,children:t,triggerClassName:n,contentClassName:a,...i})=>u.jsxs(R,{...i,children:[u.jsx(H,{className:x(n,"truncate"),children:t}),u.jsx(E,{className:x("text-primary",a,"max-w-[300px]",(e||!o)&&"hidden"),children:o})]}),O=(...e)=>e.find(o=>typeof o=="string"&&o.length>0),U=({variant:e,appearance:o=r.Solid,size:t=h.Standard,className:n,icon:a,tooltipProps:i,type:p="button",...g})=>{const m=F.mergeClasses(e&&S(e,o),t===h.Small?"h-[24px] w-[24px]":"h-[40px] w-[40px] dial-kit-enhanced-target","dial-icon-button disabled:cursor-not-allowed focus-visible:outline focus-visible:outline-focus outline-offset-0",n),d=u.jsx("button",{...g,type:p,className:m,"aria-label":O(g["aria-label"],i?.tooltip),children:a});return i?u.jsx(j,{...i,children:d}):d};exports.ButtonAppearance=r;exports.ButtonVariant=l;exports.DialIconButton=U;exports.DialTooltip=j;exports.DialTooltipContainer=R;exports.DialTooltipContent=E;exports.DialTooltipTrigger=H;exports.ElementSize=h;exports.getButtonClassNames=S;exports.resolveAccessibleName=O;exports.useHasHover=D;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),a=require("./lazy-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),a=require("./lazy-kq-xfXXv.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-kq-xfXXv.cjs"),k=require("./merge-classes-B0SnCG4i.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-kq-xfXXv.cjs"),x=require("./merge-classes-B0SnCG4i.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;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("react"),m=require("./Switch-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("react"),m=require("./Switch-HEL_aq23.cjs"),N=require("./lazy-kq-xfXXv.cjs"),b=require("./MarkdownEditor-TR6X_gdl.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-DQhHSm93.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 +1 @@
|
|
|
1
|
-
"use strict";const e=require("react/jsx-runtime"),p=require("./merge-classes-
|
|
1
|
+
"use strict";const e=require("react/jsx-runtime"),p=require("./merge-classes-B0SnCG4i.cjs"),d=require("@tabler/icons-react"),i=require("./IconButton-CsePS6PY.cjs"),f=require("./icon-CrGVkVpG.cjs"),l=require("classnames"),h=require("react"),y="w-[24px] h-[24px] border border-solid rounded-[6px] border-transparent flex items-center justify-center text-secondary hover:text-controls-accent-primary-hover active:text-controls-accent-primary-active",o=({caption:t,onClick:a})=>{if(!t)return null;const s=e.jsx(i.DialIconButton,{"aria-label":t,className:y,icon:e.jsx(d.IconInfoCircle,{size:f.DIAL_ICON_SIZE.SM}),onClick:a});return t?e.jsx(i.DialTooltip,{tooltip:t,triggerClassName:"flex justify-center items-center",children:s}):s},j=({label:t,required:a,className:s,caption:r,...n})=>t?e.jsxs("label",{...n,className:p.mergeClasses("dial-tiny-text text-secondary flex items-center gap-1",s),children:[typeof t=="string"?e.jsx("span",{className:"min-h-4",children:t}):t,a&&e.jsx("span",{className:"text-accent-primary",children:"*"}),e.jsx(o,{caption:r})]}):null,N=({label:t,switchId:a,isOn:s=!1,disabled:r,onChange:n,caption:c})=>{const x=l("flex shrink-0 w-[36px] h-[18px] cursor-pointer items-center gap-1 rounded-full p-0.5 transition-all duration-200",s?"flex-row-reverse":"flex-row",r?"pointer-events-none":"",r?s?"bg-controls-disable":"bg-layer-4":s?"bg-accent-primary":"bg-layer-4"),m=h.useCallback(u=>{u.stopPropagation(),n?.(!s)},[n,s]);return e.jsxs("div",{className:"flex flex-row items-start",role:"switch",children:[e.jsx("input",{type:"checkbox",onChange:m,id:a,disabled:r,className:"invisible size-0",checked:s}),e.jsx("label",{htmlFor:a,className:x,"aria-describedby":c&&"caption",children:e.jsx("span",{className:l("size-3 rounded-full",r?"bg-controls-disable-accent":"bg-controls-enable-primary")})}),(t||c)&&e.jsxs("div",{className:"flex flex-col gap-1 ml-2",children:[t&&e.jsx("span",{className:l("dial-small-text py-[1px]",r?"text-secondary":"text-primary"),"aria-label":"switch-title",children:t}),c&&e.jsx("span",{id:"caption",className:"dial-tiny-text text-secondary",children:c})]})]})};exports.DialInfoButton=o;exports.DialLabel=j;exports.DialSwitch=N;
|
|
@@ -2,7 +2,7 @@ import { jsx as n } from "react/jsx-runtime";
|
|
|
2
2
|
import { mergeClasses as s } from "../../../utils/merge-classes.js";
|
|
3
3
|
import { CaptionType as t } from "../../../types/caption.js";
|
|
4
4
|
import { DIAL_KIT_CLASS as e } from "../../../constants/public-class-names.js";
|
|
5
|
-
const
|
|
5
|
+
const m = ({
|
|
6
6
|
text: r,
|
|
7
7
|
className: i,
|
|
8
8
|
variant: o = t.Description,
|
|
@@ -11,7 +11,6 @@ const a = ({
|
|
|
11
11
|
"span",
|
|
12
12
|
{
|
|
13
13
|
...p,
|
|
14
|
-
role: "alert",
|
|
15
14
|
className: s(
|
|
16
15
|
"dial-tiny-text",
|
|
17
16
|
o === t.Error ? "text-error" : "text-secondary",
|
|
@@ -23,8 +22,8 @@ const a = ({
|
|
|
23
22
|
}
|
|
24
23
|
) : null, T = ({
|
|
25
24
|
...r
|
|
26
|
-
}) => /* @__PURE__ */ n(
|
|
25
|
+
}) => /* @__PURE__ */ n(m, { ...r, variant: t.Error });
|
|
27
26
|
export {
|
|
28
|
-
|
|
27
|
+
m as CaptionText,
|
|
29
28
|
T as ErrorText
|
|
30
29
|
};
|