@epam/ai-dial-ui-kit 0.2.0-rc.19 → 0.2.0-rc.20

package/dist/dial-ui-kit.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),i=require("classnames"),g=require("@tabler/icons-react"),h=require("react"),p=require("@floating-ui/react"),M=({errorText:e})=>e&&s.jsx("span",{className:"text-error dial-tiny mt-1",children:e}),A=({fieldTitle:e,htmlFor:r,optional:t,optionalText:n,cssClass:a})=>e?s.jsxs("label",{className:i("dial-tiny text-secondary",a,!a?.includes("mb")&&"mb-2"),htmlFor:r,children:[s.jsx("span",{className:"min-h-4",children:e}),t&&s.jsx("span",{className:"ml-1",children:n??"(Optional)"})]}):null,N=({icon:e,className:r})=>e?s.jsx("span",{className:i("flex-shrink-0",r),children:e}):null;var E=(e=>(e.Primary="primary",e.Secondary="secondary",e.Tertiary="tertiary",e))(E||{});const Q={[E.Primary]:"dial-primary-button",[E.Secondary]:"dial-secondary-button",[E.Tertiary]:"dial-tertiary-button"},V=({title:e,variant:r,cssClass:t,ref:n,onClick:a,disable:o,iconAfter:l,iconBefore:c,hideTitleOnMobile:d,ariaLabel:u})=>{const x=i("dial-small-semi",l?"mr-2":"",c?"ml-2":"",d?"hidden sm:inline":"inline"),m=i(r&&Q[r],t,"focus-visible:outline outline-offset-0");return s.jsxs("button",{ref:n,type:"button",className:m,onClick:b=>a?.(b),disabled:o,"aria-label":e||u,children:[s.jsx(N,{icon:c}),e&&s.jsx("span",{className:x,children:e}),s.jsx(N,{icon:l})]})};var I=(e=>(e.Info="info",e.Success="success",e.Warning="warning",e.Error="error",e))(I||{});const Y={info:s.jsx(g.IconInfoCircle,{size:24,stroke:2}),error:s.jsx(g.IconAlertCircle,{size:24,stroke:2}),warning:s.jsx(g.IconAlertTriangle,{size:24,stroke:2}),success:s.jsx(g.IconCircleCheck,{size:24,stroke:2})},J={[I.Info]:"bg-info border-info text-info",[I.Success]:"bg-success border-success text-success",[I.Warning]:"bg-warning border-warning text-warning",[I.Error]:"bg-error border-error text-error"},ee="items-center justify-between gap-2 p-3 border border-solid dial-small-150 rounded flex",se=({variant:e=I.Info,message:r,cssClass:t,closable:n=!1,onClose:a})=>s.jsxs("div",{role:"alert",className:i(ee,J[e],t),children:[s.jsxs("div",{className:"flex items-center gap-2",children:[s.jsx(N,{icon:Y[e]}),s.jsx("div",{className:"text-primary",children:r})]}),n&&s.jsx(V,{cssClass:"ml-2 text-secondary hover:text-primary",ariaLabel:"Close alert",iconBefore:s.jsx(g.IconX,{size:16}),onClick:o=>a?.(o)})]}),re="flex items-center justify-center text-secondary",te="shrink-0 grow-0 basis-auto animate-spin-steps",ne=({size:e=18,cssClass:r,iconClass:t,fullWidth:n=!0,ariaLabel:a="Loading"})=>s.jsx("div",{role:"status","aria-label":a,className:i({[re]:!0,"w-full h-full":n,[r||""]:!!r}),children:s.jsx(N,{icon:s.jsx(g.IconLoader,{width:e,height:e,className:i(te,t)})})}),ae=7,oe=2,_=h.createContext(null),W=()=>{const e=h.useContext(_);if(e==null)throw new Error("Tooltip components must be wrapped in <Tooltip />");return e},le=({initialOpen:e=!1,placement:r="bottom",isTriggerClickable:t=!1,open:n,onOpenChange:a}={})=>{const[o,l]=h.useState(e),c=h.useRef(null),d=n??o,u=a??l,x=p.useFloating({placement:r,open:d,onOpenChange:u,whileElementsMounted:p.autoUpdate,middleware:[p.offset(ae+oe),p.flip({crossAxis:r.includes("-"),fallbackAxisSideDirection:"start",padding:5}),p.shift({padding:5}),p.arrow({element:c})]}),m=p.useHover(x.context,{move:!1,enabled:n==null,mouseOnly:t,delay:{open:500,close:0}}),b=p.useFocus(x.context,{enabled:n==null}),C=p.useDismiss(x.context),y=p.useRole(x.context,{role:"tooltip"}),f=p.useInteractions([m,b,C,y]);return h.useMemo(()=>({open:d,setOpen:u,arrowRef:c,...f,...x}),[d,u,f,x])},ie=({children:e,...r})=>{const t=le(r);return s.jsx(_.Provider,{value:t,children:e})},ce=h.forwardRef(function({style:r,...t},n){const a=W(),o=p.useMergeRefs([a.refs.setFloating,n]);return a.open?s.jsx(p.FloatingPortal,{id:"tooltip-portal",children:s.jsxs("div",{ref:o,style:{...a.floatingStyles,...r},...a.getFloatingProps(t),className:i("z-[55] whitespace-pre-wrap rounded border border-primary bg-blackout px-2 py-1 dial-tiny shadow max-w-[300px]",a.getFloatingProps(t).className),children:[t.children,s.jsx(p.FloatingArrow,{ref:a.arrowRef,context:a.context,fill:"currentColor",strokeWidth:1,className:"stroke-primary w-2 text-[var(--bg-layer-0,_#000000)]"})]})}):null}),de=h.forwardRef(function({children:r,asChild:t=!1,...n},a){const o=W(),c=r&&typeof r=="object"&&"ref"in r&&r.ref!==void 0?r.ref:void 0,d=p.useMergeRefs([o.refs.setReference,a,c]);return t&&h.isValidElement(r)?h.cloneElement(r,o.getReferenceProps({ref:d,...n,...r.props})):s.jsx("span",{ref:d,...o.getReferenceProps(n),className:n.className??"dial-tooltip-trigger text-left",children:r})}),k=({hideTooltip:e,tooltip:r,children:t,triggerClassName:n,contentClassName:a,...o})=>s.jsxs(ie,{...o,children:[s.jsx(de,{className:i(n,"truncate"),children:t}),s.jsx(ce,{className:i("text-primary",a,"max-w-[300px]",(e||!r)&&"hidden"),children:r})]}),ue=18,B={size:ue,stroke:2},xe=({label:e,id:r,checked:t,indeterminate:n,disabled:a,ariaLabel:o,onChange:l})=>{const c=h.useCallback(x=>{x.stopPropagation(),l?.(x.target.checked,r)},[l,r]),d=i("flex flex-row items-center cursor-pointer text-accent-primary small-medium flex-1 min-w-0",`${t?"":'before:content-[""] before:inline-block before:w-[18px] before:h-[18px] before:border before:border-hover before:rounded before:mr-2'}`,a?"pointer-events-none text-secondary before:border-icon-secondary before:bg-layer-4":""),u=i("mr-2 border rounded",a?"bg-layer-4 border-icon-secondary":"");return s.jsxs("label",{className:d,htmlFor:r,children:[t&&(n?s.jsx(g.IconMinus,{className:u,...B}):s.jsx(g.IconCheck,{className:u,...B})),e&&s.jsx(k,{tooltip:e,triggerClassName:"flex-1 min-w-0",children:s.jsx("p",{className:"text-primary w-full truncate",children:e})}),s.jsx("input",{type:"checkbox",onChange:c,id:r,checked:t,"aria-checked":n?"mixed":t,"aria-disabled":a||void 0,"aria-label":e?void 0:o,className:"invisible w-0 h-0"})]})};var w=(e=>(e.VALID="valid",e.ERROR="error",e))(w||{});const pe=(e,r)=>{if(r===e.id)switch(e.status){case w.VALID:return"border-accent-secondary text-primary";case w.ERROR:return"border-red-900 text-primary";default:return"border-accent-primary text-primary"}switch(e.status){case w.VALID:return"border-primary text-white";case w.ERROR:return"border-red-900 text-error";default:return"border-primary text-secondary"}},me=(e,r)=>{if(r===e.id)switch(e.status){case w.VALID:return"bg-accent-secondary";case w.ERROR:return"bg-red-400";default:return"bg-accent-primary"}switch(e.status){case w.VALID:return"bg-accent-secondary";case w.ERROR:return"bg-red-400";default:return"bg-layer-4"}},fe=({step:e,index:r,currentStep:t,onChangeStep:n})=>{const a="h-[32px] flex flex-1 min-w-[180px] items-center dial-tiny border-t-2 cursor-pointer",o="w-[22px] h-[22px] flex justify-center items-center mr-2 rounded-full text-white",l=()=>t===e.id&&e.status===w.ERROR?s.jsx(g.IconExclamationCircle,{stroke:2,size:16}):t!==e.id&&e.status===w.VALID?s.jsx(g.IconCheck,{stroke:2,size:16}):r+1;return s.jsxs("button",{className:i(a,pe(e,t)),onClick:()=>n(e.id),children:[s.jsx("span",{className:i(o,me(e,t)),children:l()}),s.jsx("span",{children:e.name})]})},he=({steps:e,currentStep:r,onChangeStep:t})=>{const n=a=>{const o=e.findIndex(c=>c.id===r),l=e.findIndex(c=>c.id===a);(a!==r&&e[o].status===w.VALID||l<o)&&t(a)};return s.jsx("div",{id:"steps",className:"flex gap-x-3",children:e.map((a,o)=>s.jsx(fe,{currentStep:r,onChangeStep:n,step:a,index:o},a.id))})},q=({name:e,value:r,title:t,description:n,checked:a=!1,inputId:o,cssClass:l,labelCssClass:c,disabled:d,onChange:u,descriptionCssClass:x})=>{const m=`${o}-desc`,b=i("dial-small cursor-pointer",d?"text-secondary":"text-primary",c),C=i("cursor-pointer dial-input-radio",t&&"mr-2",l),y=i("flex flex-col",!!n&&"mb-2"),f=i("dial-tiny mt-2 ml-[26px] text-secondary",x),v=R=>{d||R.target.checked&&u?.(r)};return s.jsxs("div",{className:y,children:[s.jsxs("div",{className:"flex flex-row items-center",children:[s.jsx("input",{type:"radio",id:o,name:e,value:r,checked:a,disabled:d,"aria-describedby":a&&n?m:void 0,className:C,onChange:v}),t?s.jsx("label",{className:b,htmlFor:o,children:t}):null]}),a&&n&&s.jsx("div",{id:m,className:f,children:n})]})};var z=(e=>(e.Row="Row",e.Column="Column",e))(z||{});const ge="flex flex-col gap-2",be="flex",je="pb-1 mt-2",Ce={[z.Column]:"flex-col gap-y-3",[z.Row]:"flex-row gap-x-6"},ye=({fieldTitle:e,radioCssClass:r,labelCssClass:t,disabled:n,elementId:a,radioButtons:o,activeRadioButton:l,orientation:c,onChange:d})=>s.jsxs("div",{className:ge,children:[e&&s.jsx(A,{fieldTitle:e,htmlFor:a}),s.jsx("div",{role:"radiogroup","aria-label":e,"aria-disabled":n||void 0,className:i(be,Ce[c]),children:o.map(u=>s.jsxs("div",{className:"flex flex-col",children:[s.jsx(q,{name:a,value:u.id,inputId:u.id,disabled:n,cssClass:r,labelCssClass:t,title:u.name,checked:u.id===l,onChange:()=>d(u.id)}),u.id===l&&u.content?s.jsx("div",{className:je,children:u.content}):null]},u.id))})]}),we=({ariaLabel:e,cssClass:r,size:t=24,onClose:n})=>s.jsx(V,{ariaLabel:e,cssClass:i("text-secondary hover:text-accent-primary",r),onClick:n,iconBefore:s.jsx(g.IconX,{size:t})}),H=({value:e,textareaId:r,placeholder:t,cssClass:n="",disabled:a,invalid:o,readonly:l,onChange:c})=>s.jsx(k,{tooltip:e,triggerClassName:"flex",children:s.jsx("textarea",{id:r,placeholder:t,value:e||"",disabled:a,className:i("dial-textarea dial-input px-3 py-2",o?"dial-input-error":"",a&&"dial-input-disable",l&&"dial-input-readonly",n),onChange:d=>!l&&c?.(d.currentTarget.value)})}),Ne=["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Backspace","Delete","Tab","Enter","Escape","Home","End"],ve=(e,r,t,n)=>{if((r==="number"||t!==void 0||n!==void 0)&&!Ne.includes(e.key)&&!(e.key==="-"&&e.currentTarget.selectionStart===0&&(t===void 0||t<0))&&!(e.key==="."&&r==="number"&&!e.currentTarget.value.includes("."))){if(!/^[0-9]$/.test(e.key)){e.preventDefault();return}if(t!==void 0||n!==void 0){const o=e.currentTarget.value,l=e.currentTarget.selectionStart||0,c=o.slice(0,l)+e.key+o.slice(l),d=parseFloat(c);if(!isNaN(d)){if(t!==void 0&&d<t){e.preventDefault();return}if(n!==void 0&&d>n){e.preventDefault();return}}}}},P=({iconBeforeInput:e,iconAfterInput:r,hideBorder:t,value:n,elementId:a,placeholder:o="",cssClass:l="",containerCssClass:c,tooltipTriggerClassName:d,type:u="text",disabled:x,readonly:m,invalid:b,onChange:C,min:y,max:f,prefix:v,suffix:R,textBeforeInput:j,textAfterInput:F})=>{const U=D=>D.target.blur(),X=u==="number"||y!==void 0||f!==void 0,K=D=>{ve(D,u,y,f)},Z=D=>{const T=D.currentTarget.value;if(X&&T!==""){const L=parseFloat(T);if(isNaN(L)&&T!=="-"&&T!=="."||!isNaN(L)&&(y!==void 0&&L<y||f!==void 0&&L>f))return}C?.(T)};return s.jsxs("div",{className:i("dial-input-field flex flex-row items-center justify-between px-3 py-2",t?"dial-input-no-border":"dial-input",b&&"dial-input-error",x&&"dial-input-disable",m&&"dial-input-readonly",!j&&"pl-1",!F&&"pr-1",c),children:[j&&s.jsx(k,{tooltip:j,children:s.jsx(P,{hideBorder:!0,containerCssClass:"rounded-r-none border-r-0",cssClass:"px-2 overflow-hidden overflow-ellipsis dial-small",value:j,disabled:!0,elementId:j+"textBefore"})}),v&&s.jsxs("p",{className:"text-secondary dial-small pl-2",children:[" ",v]}),s.jsx(N,{icon:e}),s.jsx(k,{tooltip:n,triggerClassName:d,children:s.jsx("input",{type:u,autoComplete:"off",id:a,placeholder:o,value:n??"",title:n?String(n):"",disabled:x,className:i("border-0 bg-transparent px-2",l),onChange:D=>!m&&Z?.(D),onKeyDown:K,onWheel:U,min:y,max:f})}),s.jsx(N,{icon:r}),R&&s.jsxs("p",{className:"text-secondary dial-small pr-2",children:[" ",R]}),F&&s.jsx(k,{tooltip:F,children:s.jsx(P,{hideBorder:!0,containerCssClass:"rounded-l-none border-l-0",cssClass:"px-2",value:F,disabled:!0,elementId:F+"textAfter"})})]})},De=/^0+\.(\d+)?$/,Ie=/^0+/,G=({fieldTitle:e,errorText:r,optional:t,elementCssClass:n,elementContainerCssClass:a,elementId:o,containerCssClass:l,readonly:c,defaultEmptyText:d,min:u,max:x,...m})=>s.jsxs("div",{className:i("flex flex-col",l),children:[s.jsx(A,{fieldTitle:e,optional:t,htmlFor:o}),c?s.jsx("span",{children:m.value||(d??"None")}):s.jsxs(s.Fragment,{children:[s.jsx(P,{elementId:o,cssClass:n,containerCssClass:a,invalid:r!=null,min:u,max:x,...m}),s.jsx(M,{errorText:r})]})]}),ke=({onChange:e,value:r,min:t,max:n,...a})=>{const o=l=>String(l)?.match(De)?String(l)?.replace(Ie,"0"):Number(l);return s.jsx(G,{type:"number",onChange:l=>e?.(o(l)),value:r,min:t,max:n,...a})},Re=({onChange:e,...r})=>s.jsx(G,{type:"text",onChange:t=>e?.(t),...r}),Se=({fieldTitle:e,optional:r,elementId:t,elementCssClass:n,errorText:a,...o})=>s.jsxs("div",{className:"flex flex-col",children:[s.jsx(A,{fieldTitle:e,optional:r,htmlFor:t}),s.jsx(H,{textareaId:t,cssClass:n,...o}),s.jsx(M,{errorText:a})]}),Fe=({title:e,switchId:r,isOn:t=!1,disabled:n,onChange:a})=>{const o=i("flex w-[36px] h-[18px] cursor-pointer items-center gap-1 rounded-full p-0.5 transition-all duration-200",t?"flex-row-reverse":"flex-row",n?"pointer-events-none":"",n?t?"bg-controls-disable":"bg-layer-4":t?"bg-accent-primary":"bg-layer-4"),l=h.useCallback(c=>{c.stopPropagation(),a?.(!t)},[a,t]);return s.jsxs("div",{className:"flex flex-row items-center",children:[s.jsx("input",{type:"checkbox",onChange:l,id:r,disabled:n,className:"invisible w-0 h-0",checked:t}),s.jsx("label",{htmlFor:r,className:o,children:s.jsx("span",{className:i("size-3 rounded-full",n?t?"bg-layer-4":"bg-controls-disable":"bg-controls-enable-primary")})}),e&&s.jsx("span",{className:"pl-2 dial-small text-primary",children:e})]})};var S=(e=>(e.Sm="sm",e.Md="md",e.Lg="lg",e))(S||{});const Te="z-[52] flex items-center justify-center bg-blackout md:p-4",Ee="relative max-h-full rounded bg-layer-3 flex flex-col shadow w-full h-full md:h-auto",Pe="divide-tertiary divide-y",Ae="flex flex-row justify-between py-4 px-6 items-center",Le={[S.Sm]:"max-w-full md:max-w-[400px]",[S.Md]:"max-w-full md:max-w-[800px]",[S.Lg]:"max-w-full md:max-w-[1200px]"},Be=({open:e=!1,title:r,portalId:t,cssClass:n,overlayClass:a,headingClass:o,dividers:l=!0,children:c,footer:d,onClose:u,size:x=S.Md})=>{const{refs:m,context:b}=p.useFloating({open:e,onOpenChange:j=>{j||u?.(null)}}),C=p.useRole(b,{role:"dialog"}),y=p.useDismiss(b,{outsidePress:!0}),{getFloatingProps:f}=p.useInteractions([C,y]);if(!e)return null;const v=typeof r=="string"?"dial-popup-heading":void 0,R=j=>j?typeof j=="string"?s.jsx("h3",{id:v,className:i("flex-1 min-w-0 mr-3 truncate dial-h3 text-primary",o),children:s.jsx(k,{tooltip:j,children:j})}):j:s.jsx("span",{});return s.jsx(p.FloatingPortal,{id:t,children:s.jsx(p.FloatingOverlay,{className:i(Te,a),children:s.jsx(p.FloatingFocusManager,{context:b,children:s.jsxs("div",{ref:m.setFloating,...f(),role:"dialog","aria-modal":"true","aria-labelledby":v,className:i(Ee,Le[x],l&&Pe,n),children:[s.jsxs("div",{className:Ae,children:[R(r),s.jsx(V,{cssClass:"text-secondary hover:text-accent-primary",ariaLabel:"Close dialog",iconBefore:s.jsx(g.IconX,{size:18}),onClick:j=>u?.(j)})]}),s.jsx("div",{className:"flex-grow overflow-auto",children:c}),d]})})})})},ze=({onClick:e})=>s.jsx(g.IconEyeOff,{...B,className:"text-primary",onClick:e}),Oe=({onClick:e})=>s.jsx(g.IconEye,{...B,className:"text-primary",onClick:e}),$=({...e})=>{const[r,t]=h.useState(!1),n=h.useCallback(a=>{t(a)},[]);return s.jsx(P,{type:r?"text":"password",...e,iconAfterInput:r?s.jsx(ze,{onClick:()=>n(!1)}):s.jsx(Oe,{onClick:()=>n(!0)})})},Me=({fieldTitle:e,optional:r,elementCssClass:t,elementId:n,errorText:a,...o})=>s.jsxs("div",{className:"flex flex-col",children:[s.jsx(A,{fieldTitle:e,optional:r,htmlFor:n}),s.jsx($,{cssClass:t,elementId:n,invalid:!!a,...o}),s.jsx(M,{errorText:a})]});var O=(e=>(e.Small="small",e.Base="base",e))(O||{});const Ve={[O.Small]:{textClass:"text-xs px-1",containerClass:"px-[6px] py-1 h-[22px]",iconSize:10,iconStroke:1},[O.Base]:{textClass:"text-sm px-2",containerClass:"px-3 py-2 h-[38px]",iconSize:18,iconStroke:1.5}},_e=({elementId:e,value:r,placeholder:t,disabled:n,readonly:a,invalid:o,cssClass:l,containerCssClass:c,onChange:d,size:u=O.Base})=>{const[x,m]=h.useState(r||"");h.useEffect(()=>{m(r||"")},[r]);const b=h.useCallback(f=>{m(f),d?.(f)},[d]),C=Ve[u],y=h.useCallback(()=>{b("")},[b]);return s.jsxs("div",{className:i("dial-input flex flex-row items-center justify-between",o&&"dial-input-error",n&&"dial-input-disable",a&&"dial-input-readonly",C.containerClass,c),children:[s.jsx(N,{className:i(n?"text-secondary":"text-primary"),icon:s.jsx(g.IconSearch,{size:C.iconSize,stroke:C.iconStroke})}),s.jsx("input",{id:e,type:"text",autoComplete:"off",placeholder:t,value:x??"",title:x?String(x):"",disabled:n,readOnly:a,className:i("border-0 bg-transparent w-full",l,C.textClass),onChange:f=>!a&&b(f.currentTarget.value)}),x&&!a&&!n&&s.jsx(N,{className:"text-primary cursor-pointer",icon:s.jsx(g.IconX,{size:C.iconSize,stroke:C.iconStroke,onClick:y,"aria-label":"Clear search",role:"button"})})]})};exports.AlertVariant=I;exports.ButtonVariant=E;exports.DialAlert=se;exports.DialButton=V;exports.DialCheckbox=xe;exports.DialCloseButton=we;exports.DialErrorText=M;exports.DialFieldLabel=A;exports.DialIcon=N;exports.DialInput=P;exports.DialLoader=ne;exports.DialNumberInputField=ke;exports.DialPasswordInput=$;exports.DialPasswordInputField=Me;exports.DialPopup=Be;exports.DialRadioButton=q;exports.DialRadioGroup=ye;exports.DialSearch=_e;exports.DialSteps=he;exports.DialSwitch=Fe;exports.DialTextAreaField=Se;exports.DialTextInputField=Re;exports.DialTextarea=H;exports.DialTooltip=k;exports.PopupSize=S;exports.RadioGroupOrientation=z;exports.StepStatus=w;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),i=require("classnames"),C=require("@tabler/icons-react"),b=require("react"),p=require("@floating-ui/react"),_=({errorText:e})=>e&&s.jsx("span",{className:"text-error dial-tiny mt-1",children:e}),L=({fieldTitle:e,htmlFor:r,optional:t,optionalText:n,cssClass:a})=>e?s.jsxs("label",{className:i("dial-tiny text-secondary",a,!a?.includes("mb")&&"mb-2"),htmlFor:r,children:[s.jsx("span",{className:"min-h-4",children:e}),t&&s.jsx("span",{className:"ml-1",children:n??"(Optional)"})]}):null,D=({icon:e,className:r})=>e?s.jsx("span",{className:i("flex-shrink-0",r),children:e}):null;var v=(e=>(e.Primary="primary",e.Secondary="secondary",e.Tertiary="tertiary",e.Danger="danger",e))(v||{});const se={[v.Primary]:"dial-primary-button",[v.Secondary]:"dial-secondary-button",[v.Tertiary]:"dial-tertiary-button",[v.Danger]:"dial-danger-button"},T=({title:e,variant:r,cssClass:t,ref:n,onClick:a,disable:l,iconAfter:o,iconBefore:c,hideTitleOnMobile:d,ariaLabel:u})=>{const x=i("dial-small-semi",o?"mr-2":"",c?"ml-2":"",d?"hidden sm:inline":"inline"),f=i(r&&se[r],t,"focus-visible:outline outline-offset-0");return s.jsxs("button",{ref:n,type:"button",className:f,onClick:h=>a?.(h),disabled:l,"aria-label":e||u,children:[s.jsx(D,{icon:c}),e&&s.jsx("span",{className:x,children:e}),s.jsx(D,{icon:o})]})};var S=(e=>(e.Info="info",e.Success="success",e.Warning="warning",e.Error="error",e))(S||{});const re={info:s.jsx(C.IconInfoCircle,{size:24,stroke:2}),error:s.jsx(C.IconAlertCircle,{size:24,stroke:2}),warning:s.jsx(C.IconAlertTriangle,{size:24,stroke:2}),success:s.jsx(C.IconCircleCheck,{size:24,stroke:2})},te={[S.Info]:"bg-info border-info text-info",[S.Success]:"bg-success border-success text-success",[S.Warning]:"bg-warning border-warning text-warning",[S.Error]:"bg-error border-error text-error"},ne="items-center justify-between gap-2 p-3 border border-solid dial-small-150 rounded flex",ae=({variant:e=S.Info,message:r,cssClass:t,closable:n=!1,onClose:a})=>s.jsxs("div",{role:"alert",className:i(ne,te[e],t),children:[s.jsxs("div",{className:"flex items-center gap-2",children:[s.jsx(D,{icon:re[e]}),s.jsx("div",{className:"text-primary",children:r})]}),n&&s.jsx(T,{cssClass:"ml-2 text-secondary hover:text-primary",ariaLabel:"Close alert",iconBefore:s.jsx(C.IconX,{size:16}),onClick:l=>a?.(l)})]}),le="flex items-center justify-center text-secondary",oe="shrink-0 grow-0 basis-auto animate-spin-steps",q=({size:e=18,cssClass:r,iconClass:t,fullWidth:n=!0,ariaLabel:a="Loading"})=>s.jsx("div",{role:"status","aria-label":a,className:i({[le]:!0,"w-full h-full":n,[r||""]:!!r}),children:s.jsx(D,{icon:s.jsx(C.IconLoader,{width:e,height:e,className:i(oe,t)})})}),ie=7,ce=2,H=b.createContext(null),G=()=>{const e=b.useContext(H);if(e==null)throw new Error("Tooltip components must be wrapped in <Tooltip />");return e},de=({initialOpen:e=!1,placement:r="bottom",isTriggerClickable:t=!1,open:n,onOpenChange:a}={})=>{const[l,o]=b.useState(e),c=b.useRef(null),d=n??l,u=a??o,x=p.useFloating({placement:r,open:d,onOpenChange:u,whileElementsMounted:p.autoUpdate,middleware:[p.offset(ie+ce),p.flip({crossAxis:r.includes("-"),fallbackAxisSideDirection:"start",padding:5}),p.shift({padding:5}),p.arrow({element:c})]}),f=p.useHover(x.context,{move:!1,enabled:n==null,mouseOnly:t,delay:{open:500,close:0}}),h=p.useFocus(x.context,{enabled:n==null}),g=p.useDismiss(x.context),y=p.useRole(x.context,{role:"tooltip"}),m=p.useInteractions([f,h,g,y]);return b.useMemo(()=>({open:d,setOpen:u,arrowRef:c,...m,...x}),[d,u,m,x])},ue=({children:e,...r})=>{const t=de(r);return s.jsx(H.Provider,{value:t,children:e})},xe=b.forwardRef(function({style:r,...t},n){const a=G(),l=p.useMergeRefs([a.refs.setFloating,n]);return a.open?s.jsx(p.FloatingPortal,{id:"tooltip-portal",children:s.jsxs("div",{ref:l,style:{...a.floatingStyles,...r},...a.getFloatingProps(t),className:i("z-[55] whitespace-pre-wrap rounded border border-primary bg-blackout px-2 py-1 dial-tiny shadow max-w-[300px]",a.getFloatingProps(t).className),children:[t.children,s.jsx(p.FloatingArrow,{ref:a.arrowRef,context:a.context,fill:"currentColor",strokeWidth:1,className:"stroke-primary w-2 text-[var(--bg-layer-0,_#000000)]"})]})}):null}),pe=b.forwardRef(function({children:r,asChild:t=!1,...n},a){const l=G(),c=r&&typeof r=="object"&&"ref"in r&&r.ref!==void 0?r.ref:void 0,d=p.useMergeRefs([l.refs.setReference,a,c]);return t&&b.isValidElement(r)?b.cloneElement(r,l.getReferenceProps({ref:d,...n,...r.props})):s.jsx("span",{ref:d,...l.getReferenceProps(n),className:n.className??"dial-tooltip-trigger text-left",children:r})}),R=({hideTooltip:e,tooltip:r,children:t,triggerClassName:n,contentClassName:a,...l})=>s.jsxs(ue,{...l,children:[s.jsx(pe,{className:i(n,"truncate"),children:t}),s.jsx(xe,{className:i("text-primary",a,"max-w-[300px]",(e||!r)&&"hidden"),children:r})]}),me=18,O={size:me,stroke:2},fe=({label:e,id:r,checked:t,indeterminate:n,disabled:a,ariaLabel:l,onChange:o})=>{const c=b.useCallback(x=>{x.stopPropagation(),o?.(x.target.checked,r)},[o,r]),d=i("flex flex-row items-center cursor-pointer text-accent-primary small-medium flex-1 min-w-0",`${t?"":'before:content-[""] before:inline-block before:w-[18px] before:h-[18px] before:border before:border-hover before:rounded before:mr-2'}`,a?"pointer-events-none text-secondary before:border-icon-secondary before:bg-layer-4":""),u=i("mr-2 border rounded",a?"bg-layer-4 border-icon-secondary":"");return s.jsxs("label",{className:d,htmlFor:r,children:[t&&(n?s.jsx(C.IconMinus,{className:u,...O}):s.jsx(C.IconCheck,{className:u,...O})),e&&s.jsx(R,{tooltip:e,triggerClassName:"flex-1 min-w-0",children:s.jsx("p",{className:"text-primary w-full truncate",children:e})}),s.jsx("input",{type:"checkbox",onChange:c,id:r,checked:t,"aria-checked":n?"mixed":t,"aria-disabled":a||void 0,"aria-label":e?void 0:l,className:"invisible w-0 h-0"})]})};var w=(e=>(e.VALID="valid",e.ERROR="error",e))(w||{});const he=(e,r)=>{if(r===e.id)switch(e.status){case w.VALID:return"border-accent-secondary text-primary";case w.ERROR:return"border-red-900 text-primary";default:return"border-accent-primary text-primary"}switch(e.status){case w.VALID:return"border-primary text-white";case w.ERROR:return"border-red-900 text-error";default:return"border-primary text-secondary"}},ge=(e,r)=>{if(r===e.id)switch(e.status){case w.VALID:return"bg-accent-secondary";case w.ERROR:return"bg-red-400";default:return"bg-accent-primary"}switch(e.status){case w.VALID:return"bg-accent-secondary";case w.ERROR:return"bg-red-400";default:return"bg-layer-4"}},be=({step:e,index:r,currentStep:t,onChangeStep:n})=>{const a="h-[32px] flex flex-1 min-w-[180px] items-center dial-tiny border-t-2 cursor-pointer",l="w-[22px] h-[22px] flex justify-center items-center mr-2 rounded-full text-white",o=()=>t===e.id&&e.status===w.ERROR?s.jsx(C.IconExclamationCircle,{stroke:2,size:16}):t!==e.id&&e.status===w.VALID?s.jsx(C.IconCheck,{stroke:2,size:16}):r+1;return s.jsxs("button",{className:i(a,he(e,t)),onClick:()=>n(e.id),children:[s.jsx("span",{className:i(l,ge(e,t)),children:o()}),s.jsx("span",{children:e.name})]})},je=({steps:e,currentStep:r,onChangeStep:t})=>{const n=a=>{const l=e.findIndex(c=>c.id===r),o=e.findIndex(c=>c.id===a);(a!==r&&e[l].status===w.VALID||o<l)&&t(a)};return s.jsx("div",{id:"steps",className:"flex gap-x-3",children:e.map((a,l)=>s.jsx(be,{currentStep:r,onChangeStep:n,step:a,index:l},a.id))})},$=({name:e,value:r,title:t,description:n,checked:a=!1,inputId:l,cssClass:o,labelCssClass:c,disabled:d,onChange:u,descriptionCssClass:x})=>{const f=`${l}-desc`,h=i("dial-small cursor-pointer",d?"text-secondary":"text-primary",c),g=i("cursor-pointer dial-input-radio",t&&"mr-2",o),y=i("flex flex-col",!!n&&"mb-2"),m=i("dial-tiny mt-2 ml-[26px] text-secondary",x),N=I=>{d||I.target.checked&&u?.(r)};return s.jsxs("div",{className:y,children:[s.jsxs("div",{className:"flex flex-row items-center",children:[s.jsx("input",{type:"radio",id:l,name:e,value:r,checked:a,disabled:d,"aria-describedby":a&&n?f:void 0,className:g,onChange:N}),t?s.jsx("label",{className:h,htmlFor:l,children:t}):null]}),a&&n&&s.jsx("div",{id:f,className:m,children:n})]})};var V=(e=>(e.Row="Row",e.Column="Column",e))(V||{});const Ce="flex flex-col gap-2",ye="flex",we="pb-1 mt-2",ve={[V.Column]:"flex-col gap-y-3",[V.Row]:"flex-row gap-x-6"},Ne=({fieldTitle:e,radioCssClass:r,labelCssClass:t,disabled:n,elementId:a,radioButtons:l,activeRadioButton:o,orientation:c,onChange:d})=>s.jsxs("div",{className:Ce,children:[e&&s.jsx(L,{fieldTitle:e,htmlFor:a}),s.jsx("div",{role:"radiogroup","aria-label":e,"aria-disabled":n||void 0,className:i(ye,ve[c]),children:l.map(u=>s.jsxs("div",{className:"flex flex-col",children:[s.jsx($,{name:a,value:u.id,inputId:u.id,disabled:n,cssClass:r,labelCssClass:t,title:u.name,checked:u.id===o,onChange:()=>d(u.id)}),u.id===o&&u.content?s.jsx("div",{className:we,children:u.content}):null]},u.id))})]}),De=({ariaLabel:e,cssClass:r,size:t=24,onClose:n})=>s.jsx(T,{ariaLabel:e,cssClass:i("text-secondary hover:text-accent-primary",r),onClick:n,iconBefore:s.jsx(C.IconX,{size:t})}),U=({value:e,textareaId:r,placeholder:t,cssClass:n="",disabled:a,invalid:l,readonly:o,onChange:c})=>s.jsx(R,{tooltip:e,triggerClassName:"flex",children:s.jsx("textarea",{id:r,placeholder:t,value:e||"",disabled:a,className:i("dial-textarea dial-input px-3 py-2",l?"dial-input-error":"",a&&"dial-input-disable",o&&"dial-input-readonly",n),onChange:d=>!o&&c?.(d.currentTarget.value)})}),Ie=["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Backspace","Delete","Tab","Enter","Escape","Home","End"],ke=(e,r,t,n)=>{if((r==="number"||t!==void 0||n!==void 0)&&!Ie.includes(e.key)&&!(e.key==="-"&&e.currentTarget.selectionStart===0&&(t===void 0||t<0))&&!(e.key==="."&&r==="number"&&!e.currentTarget.value.includes("."))){if(!/^[0-9]$/.test(e.key)){e.preventDefault();return}if(t!==void 0||n!==void 0){const l=e.currentTarget.value,o=e.currentTarget.selectionStart||0,c=l.slice(0,o)+e.key+l.slice(o),d=parseFloat(c);if(!isNaN(d)){if(t!==void 0&&d<t){e.preventDefault();return}if(n!==void 0&&d>n){e.preventDefault();return}}}}},A=({iconBeforeInput:e,iconAfterInput:r,hideBorder:t,value:n,elementId:a,placeholder:l="",cssClass:o="",containerCssClass:c,tooltipTriggerClassName:d,type:u="text",disabled:x,readonly:f,invalid:h,onChange:g,min:y,max:m,prefix:N,suffix:I,textBeforeInput:j,textAfterInput:P})=>{const Q=k=>k.target.blur(),Y=u==="number"||y!==void 0||m!==void 0,J=k=>{ke(k,u,y,m)},ee=k=>{const E=k.currentTarget.value;if(Y&&E!==""){const z=parseFloat(E);if(isNaN(z)&&E!=="-"&&E!=="."||!isNaN(z)&&(y!==void 0&&z<y||m!==void 0&&z>m))return}g?.(E)};return s.jsxs("div",{className:i("dial-input-field flex flex-row items-center justify-between px-3 py-2",t?"dial-input-no-border":"dial-input",h&&"dial-input-error",x&&"dial-input-disable",f&&"dial-input-readonly",!j&&"pl-1",!P&&"pr-1",c),children:[j&&s.jsx(R,{tooltip:j,children:s.jsx(A,{hideBorder:!0,containerCssClass:"rounded-r-none border-r-0",cssClass:"px-2 overflow-hidden overflow-ellipsis dial-small",value:j,disabled:!0,elementId:j+"textBefore"})}),N&&s.jsxs("p",{className:"text-secondary dial-small pl-2",children:[" ",N]}),s.jsx(D,{icon:e}),s.jsx(R,{tooltip:n,triggerClassName:d,children:s.jsx("input",{type:u,autoComplete:"off",id:a,placeholder:l,value:n??"",title:n?String(n):"",disabled:x,className:i("border-0 bg-transparent px-2",o),onChange:k=>!f&&ee?.(k),onKeyDown:J,onWheel:Q,min:y,max:m})}),s.jsx(D,{icon:r}),I&&s.jsxs("p",{className:"text-secondary dial-small pr-2",children:[" ",I]}),P&&s.jsx(R,{tooltip:P,children:s.jsx(A,{hideBorder:!0,containerCssClass:"rounded-l-none border-l-0",cssClass:"px-2",value:P,disabled:!0,elementId:P+"textAfter"})})]})},Se=/^0+\.(\d+)?$/,Re=/^0+/,X=({fieldTitle:e,errorText:r,optional:t,elementCssClass:n,elementContainerCssClass:a,elementId:l,containerCssClass:o,readonly:c,defaultEmptyText:d,min:u,max:x,...f})=>s.jsxs("div",{className:i("flex flex-col",o),children:[s.jsx(L,{fieldTitle:e,optional:t,htmlFor:l}),c?s.jsx("span",{children:f.value||(d??"None")}):s.jsxs(s.Fragment,{children:[s.jsx(A,{elementId:l,cssClass:n,containerCssClass:a,invalid:r!=null,min:u,max:x,...f}),s.jsx(_,{errorText:r})]})]}),Fe=({onChange:e,value:r,min:t,max:n,...a})=>{const l=o=>String(o)?.match(Se)?String(o)?.replace(Re,"0"):Number(o);return s.jsx(X,{type:"number",onChange:o=>e?.(l(o)),value:r,min:t,max:n,...a})},Te=({onChange:e,...r})=>s.jsx(X,{type:"text",onChange:t=>e?.(t),...r}),Pe=({fieldTitle:e,optional:r,elementId:t,elementCssClass:n,errorText:a,...l})=>s.jsxs("div",{className:"flex flex-col",children:[s.jsx(L,{fieldTitle:e,optional:r,htmlFor:t}),s.jsx(U,{textareaId:t,cssClass:n,...l}),s.jsx(_,{errorText:a})]}),Ee=({title:e,switchId:r,isOn:t=!1,disabled:n,onChange:a})=>{const l=i("flex w-[36px] h-[18px] cursor-pointer items-center gap-1 rounded-full p-0.5 transition-all duration-200",t?"flex-row-reverse":"flex-row",n?"pointer-events-none":"",n?t?"bg-controls-disable":"bg-layer-4":t?"bg-accent-primary":"bg-layer-4"),o=b.useCallback(c=>{c.stopPropagation(),a?.(!t)},[a,t]);return s.jsxs("div",{className:"flex flex-row items-center",children:[s.jsx("input",{type:"checkbox",onChange:o,id:r,disabled:n,className:"invisible w-0 h-0",checked:t}),s.jsx("label",{htmlFor:r,className:l,children:s.jsx("span",{className:i("size-3 rounded-full",n?t?"bg-layer-4":"bg-controls-disable":"bg-controls-enable-primary")})}),e&&s.jsx("span",{className:"pl-2 dial-small text-primary",children:e})]})};var F=(e=>(e.Sm="sm",e.Md="md",e.Lg="lg",e))(F||{});const Ae="z-[52] flex items-center justify-center bg-blackout md:p-4",Be="relative max-h-full rounded bg-layer-3 flex flex-col shadow w-full h-full md:h-auto",Le="divide-tertiary divide-y",ze="flex flex-row justify-between py-4 px-6 items-center",Oe={[F.Sm]:"max-w-full md:max-w-[400px]",[F.Md]:"max-w-full md:max-w-[800px]",[F.Lg]:"max-w-full md:max-w-[1200px]"},K=({open:e=!1,title:r,portalId:t,cssClass:n,overlayClass:a,headingClass:l,dividers:o=!0,children:c,footer:d,onClose:u,size:x=F.Md})=>{const{refs:f,context:h}=p.useFloating({open:e,onOpenChange:j=>{j||u?.(null)}}),g=p.useRole(h,{role:"dialog"}),y=p.useDismiss(h,{outsidePress:!0}),{getFloatingProps:m}=p.useInteractions([g,y]);if(!e)return null;const N=typeof r=="string"?"dial-popup-heading":void 0,I=j=>j?typeof j=="string"?s.jsx("h3",{id:N,className:i("flex-1 min-w-0 mr-3 truncate dial-h3 text-primary",l),children:s.jsx(R,{tooltip:j,children:j})}):j:s.jsx("span",{});return s.jsx(p.FloatingPortal,{id:t,children:s.jsx(p.FloatingOverlay,{className:i(Ae,a),children:s.jsx(p.FloatingFocusManager,{context:h,children:s.jsxs("div",{ref:f.setFloating,...m(),role:"dialog","aria-modal":"true","aria-labelledby":N,className:i(Be,Oe[x],o&&Le,n),children:[s.jsxs("div",{className:ze,children:[I(r),s.jsx(T,{cssClass:"text-secondary hover:text-accent-primary",ariaLabel:"Close dialog",iconBefore:s.jsx(C.IconX,{size:18}),onClick:j=>u?.(j)})]}),s.jsx("div",{className:"flex-grow overflow-auto",children:c}),d]})})})})};var B=(e=>(e.Info="info",e.Danger="danger",e))(B||{});const Ve="flex justify-end gap-2 px-6 py-4",Me="text-secondary dial-small-150 px-6 py-4",_e="Cancel",W={[B.Info]:{confirmVariant:v.Primary,cancelVariant:v.Secondary},[B.Danger]:{container:"border-t-4 border-error",confirmVariant:v.Danger,cancelVariant:v.Secondary}},We=({title:e,description:r,descriptionCssClass:t,open:n=!1,confirmLabel:a,cancelLabel:l=_e,isLoading:o=!1,disableConfirmButton:c=!1,cssClass:d,confirmClassName:u,onClose:x,onConfirm:f,onCancel:h,children:g,dividers:y=!1,variant:m=B.Info,size:N=F.Sm})=>{const I=o?null:s.jsxs("div",{className:Ve,children:[s.jsx(T,{variant:v.Secondary,title:l,onClick:()=>h?h():x?.()}),s.jsx(T,{variant:W[m].confirmVariant,cssClass:u,title:a,disable:c,onClick:()=>f()})]}),j=b.useCallback(()=>o?s.jsx("div",{className:"px-6 py-4 h-[120px]",children:s.jsx(q,{size:50})}):g??(r?s.jsx("div",{className:i(Me,t),children:r}):null),[g,r,o,t]);return s.jsx(K,{open:n,title:e,cssClass:i(W[m].container,d),dividers:y,onClose:()=>x?.(),footer:I,size:N,children:j()})},qe=({onClick:e})=>s.jsx(C.IconEyeOff,{...O,className:"text-primary",onClick:e}),He=({onClick:e})=>s.jsx(C.IconEye,{...O,className:"text-primary",onClick:e}),Z=({...e})=>{const[r,t]=b.useState(!1),n=b.useCallback(a=>{t(a)},[]);return s.jsx(A,{type:r?"text":"password",...e,iconAfterInput:r?s.jsx(qe,{onClick:()=>n(!1)}):s.jsx(He,{onClick:()=>n(!0)})})},Ge=({fieldTitle:e,optional:r,elementCssClass:t,elementId:n,errorText:a,...l})=>s.jsxs("div",{className:"flex flex-col",children:[s.jsx(L,{fieldTitle:e,optional:r,htmlFor:n}),s.jsx(Z,{cssClass:t,elementId:n,invalid:!!a,...l}),s.jsx(_,{errorText:a})]});var M=(e=>(e.Small="small",e.Base="base",e))(M||{});const $e={[M.Small]:{textClass:"text-xs px-1",containerClass:"px-[6px] py-1 h-[22px]",iconSize:10,iconStroke:1},[M.Base]:{textClass:"text-sm px-2",containerClass:"px-3 py-2 h-[38px]",iconSize:18,iconStroke:1.5}},Ue=({elementId:e,value:r,placeholder:t,disabled:n,readonly:a,invalid:l,cssClass:o,containerCssClass:c,onChange:d,size:u=M.Base})=>{const[x,f]=b.useState(r||"");b.useEffect(()=>{f(r||"")},[r]);const h=b.useCallback(m=>{f(m),d?.(m)},[d]),g=$e[u],y=b.useCallback(()=>{h("")},[h]);return s.jsxs("div",{className:i("dial-input flex flex-row items-center justify-between",l&&"dial-input-error",n&&"dial-input-disable",a&&"dial-input-readonly",g.containerClass,c),children:[s.jsx(D,{className:i(n?"text-secondary":"text-primary"),icon:s.jsx(C.IconSearch,{size:g.iconSize,stroke:g.iconStroke})}),s.jsx("input",{id:e,type:"text",autoComplete:"off",placeholder:t,value:x??"",title:x?String(x):"",disabled:n,readOnly:a,className:i("border-0 bg-transparent w-full",o,g.textClass),onChange:m=>!a&&h(m.currentTarget.value)}),x&&!a&&!n&&s.jsx(D,{className:"text-primary cursor-pointer",icon:s.jsx(C.IconX,{size:g.iconSize,stroke:g.iconStroke,onClick:y,"aria-label":"Clear search",role:"button"})})]})};exports.AlertVariant=S;exports.ButtonVariant=v;exports.ConfirmationPopupVariant=B;exports.DialAlert=ae;exports.DialButton=T;exports.DialCheckbox=fe;exports.DialCloseButton=De;exports.DialConfirmationPopup=We;exports.DialErrorText=_;exports.DialFieldLabel=L;exports.DialIcon=D;exports.DialInput=A;exports.DialLoader=q;exports.DialNumberInputField=Fe;exports.DialPasswordInput=Z;exports.DialPasswordInputField=Ge;exports.DialPopup=K;exports.DialRadioButton=$;exports.DialRadioGroup=Ne;exports.DialSearch=Ue;exports.DialSteps=je;exports.DialSwitch=Ee;exports.DialTextAreaField=Pe;exports.DialTextInputField=Te;exports.DialTextarea=U;exports.DialTooltip=R;exports.PopupSize=F;exports.RadioGroupOrientation=V;exports.StepStatus=w;