@epam/ai-dial-ui-kit 0.3.0-rc.4 → 0.3.0-rc.5
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/dial-ui-kit.cjs.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("classnames"),N=require("@tabler/icons-react"),f=require("react"),h=require("@floating-ui/react"),ke=require("react-dom");function De(s){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const n in s)if(n!=="default"){const r=Object.getOwnPropertyDescriptor(s,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:()=>s[n]})}}return t.default=s,Object.freeze(t)}const L=De(f),$=({errorText:s})=>s&&e.jsx("span",{className:"text-error dial-tiny mt-1",children:s}),W=({fieldTitle:s,htmlFor:t,optional:n,optionalText:r,cssClass:a})=>s?e.jsxs("label",{className:l("dial-tiny text-secondary",a,!a?.includes("mb")&&"mb-2"),htmlFor:t,children:[e.jsx("span",{className:"min-h-4",children:s}),n&&e.jsx("span",{className:"ml-1",children:r??"(Optional)"})]}):null,R=({icon:s,className:t})=>s?e.jsx("span",{className:l("flex-shrink-0",t),children:s}):null;var I=(s=>(s.Primary="primary",s.Secondary="secondary",s.Tertiary="tertiary",s.Danger="danger",s))(I||{});const Ie={[I.Primary]:"dial-primary-button",[I.Secondary]:"dial-secondary-button",[I.Tertiary]:"dial-tertiary-button",[I.Danger]:"dial-danger-button"},M=({title:s,variant:t,cssClass:n,textCssClass:r,ref:a,onClick:o,disable:c,iconAfter:u,iconBefore:d,hideTitleOnMobile:i,ariaLabel:x})=>{const p=l("dial-small-semi",u?"mr-2":"",d?"ml-2":"",i?"hidden sm:inline":"inline",r),j=l(t&&Ie[t],n,"focus-visible:outline outline-offset-0");return e.jsxs("button",{ref:a,type:"button",className:j,onClick:g=>o?.(g),disabled:c,"aria-label":s||x,children:[e.jsx(R,{icon:d}),s&&e.jsx("span",{className:p,children:s}),e.jsx(R,{icon:u})]})};var V=(s=>(s.Info="info",s.Success="success",s.Warning="warning",s.Error="error",s))(V||{});const Se={info:e.jsx(N.IconInfoCircle,{size:24,stroke:2}),error:e.jsx(N.IconAlertCircle,{size:24,stroke:2}),warning:e.jsx(N.IconAlertTriangle,{size:24,stroke:2}),success:e.jsx(N.IconCircleCheck,{size:24,stroke:2})},Re={[V.Info]:"bg-info border-info text-info",[V.Success]:"bg-success border-success text-success",[V.Warning]:"bg-warning border-warning text-warning",[V.Error]:"bg-error border-error text-error"},Fe="items-center justify-between gap-2 p-3 border border-solid dial-small-150 rounded flex",Ee=({variant:s=V.Info,message:t,cssClass:n,closable:r=!1,onClose:a})=>e.jsxs("div",{role:"alert",className:l(Fe,Re[s],n),children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(R,{icon:Se[s]}),e.jsx("div",{className:"text-primary",children:t})]}),r&&e.jsx(M,{cssClass:"ml-2 text-secondary hover:text-primary",ariaLabel:"Close alert",iconBefore:e.jsx(N.IconX,{size:16}),onClick:o=>a?.(o)})]}),Le="flex items-center justify-center text-secondary",Pe="shrink-0 grow-0 basis-auto animate-spin-steps",Te=s=>L.createElement("svg",{viewBox:"0 0 48 48",fill:"none",xmlns:"http://www.w3.org/2000/svg",...s},L.createElement("path",{d:"M24 39V46.5",stroke:"currentColor",strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round"}),L.createElement("path",{opacity:.4,d:"M9 24H1.5",stroke:"currentColor",strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round"}),L.createElement("path",{opacity:.5,d:"M8.0918 8.0918L13.3994 13.3994",stroke:"currentColor",strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round"}),L.createElement("path",{opacity:.6,d:"M24 1.5V9",stroke:"currentColor",strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round"}),L.createElement("path",{opacity:.7,d:"M39.9121 8.08594L37.2607 10.7373L34.6094 13.3887",stroke:"currentColor",strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round"}),L.createElement("path",{opacity:.8,d:"M46.5 24H39",stroke:"currentColor",strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round"}),L.createElement("path",{opacity:.9,d:"M34.6055 34.6055L39.9082 39.9082",stroke:"currentColor",strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round"}),L.createElement("path",{opacity:.3,d:"M13.3936 34.6055L8.08594 39.9131",stroke:"currentColor",strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round"})),re=({size:s=18,cssClass:t,iconClass:n,fullWidth:r=!0,ariaLabel:a="Loading"})=>e.jsx("div",{role:"status","aria-label":a,className:l({[Le]:!0,"w-full h-full":r,[t||""]:!!t}),children:e.jsx(R,{icon:e.jsx(Te,{width:s,height:s,className:l(Pe,n),role:"img"})})}),Ae=7,Me=2,ae=f.createContext(null),oe=()=>{const s=f.useContext(ae);if(s==null)throw new Error("Tooltip components must be wrapped in <Tooltip />");return s},Oe=({initialOpen:s=!1,placement:t="bottom",isTriggerClickable:n=!1,open:r,onOpenChange:a}={})=>{const[o,c]=f.useState(s),u=f.useRef(null),d=r??o,i=a??c,x=h.useFloating({placement:t,open:d,onOpenChange:i,whileElementsMounted:h.autoUpdate,middleware:[h.offset(Ae+Me),h.flip({crossAxis:t.includes("-"),fallbackAxisSideDirection:"start",padding:5}),h.shift({padding:5}),h.arrow({element:u})]}),p=h.useHover(x.context,{move:!1,enabled:r==null,mouseOnly:n,delay:{open:500,close:0}}),j=h.useFocus(x.context,{enabled:r==null}),g=h.useDismiss(x.context),v=h.useRole(x.context,{role:"tooltip"}),b=h.useInteractions([p,j,g,v]);return f.useMemo(()=>({open:d,setOpen:i,arrowRef:u,...b,...x}),[d,i,b,x])},Ve=({children:s,...t})=>{const n=Oe(t);return e.jsx(ae.Provider,{value:n,children:s})},Be=f.forwardRef(function({style:t,...n},r){const a=oe(),o=h.useMergeRefs([a.refs.setFloating,r]);return a.open?e.jsx(h.FloatingPortal,{id:"tooltip-portal",children:e.jsxs("div",{ref:o,style:{...a.floatingStyles,...t},...a.getFloatingProps(n),className:l("z-[55] whitespace-pre-wrap break-words rounded border border-primary bg-blackout px-2 py-1 dial-tiny shadow max-w-[300px]",a.getFloatingProps(n).className),children:[n.children,e.jsx(h.FloatingArrow,{ref:a.arrowRef,context:a.context,fill:"currentColor",strokeWidth:1,className:"stroke-primary w-2 text-[var(--bg-layer-0,_#000000)]"})]})}):null}),We=f.forwardRef(function({children:t,asChild:n=!1,...r},a){const o=oe(),u=t&&typeof t=="object"&&"ref"in t&&t.ref!==void 0?t.ref:void 0,d=h.useMergeRefs([o.refs.setReference,a,u]);return n&&f.isValidElement(t)?f.cloneElement(t,o.getReferenceProps({ref:d,...r,...t.props})):e.jsx("span",{ref:d,...o.getReferenceProps(r),className:r.className??"dial-tooltip-trigger text-left",children:t})}),O=({hideTooltip:s,tooltip:t,children:n,triggerClassName:r,contentClassName:a,...o})=>e.jsxs(Ve,{...o,children:[e.jsx(We,{className:l(r,"truncate"),children:n}),e.jsx(Be,{className:l("text-primary",a,"max-w-[300px]",(s||!t)&&"hidden"),children:t})]}),_=18,G={size:_,stroke:2},ze=({label:s,id:t,checked:n,indeterminate:r,disabled:a,ariaLabel:o,onChange:c})=>{const u=f.useCallback(p=>{c?.(p.target.checked,t)},[c,t]),d=l("flex flex-row items-center cursor-pointer text-accent-primary small-medium flex-1 min-w-0",`${n||r?"":'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":""),i=l("mr-2 border rounded",a?"bg-layer-4 border-icon-secondary":""),x=()=>r?e.jsx(N.IconMinus,{className:i,...G}):n?e.jsx(N.IconCheck,{className:i,...G}):null;return e.jsxs("label",{className:d,htmlFor:t,children:[x(),s&&e.jsx(O,{tooltip:s,triggerClassName:"flex-1 min-w-0",children:e.jsx("p",{className:"text-primary w-full truncate",children:s})}),e.jsx("input",{type:"checkbox",role:"checkbox",name:t,onChange:u,id:t,checked:n,"aria-checked":r?"mixed":n,"aria-disabled":a||void 0,"aria-label":s?void 0:o,className:"invisible w-0 h-0"})]})};var S=(s=>(s.VALID="valid",s.ERROR="error",s))(S||{});const He=(s,t)=>{if(t===s.id)switch(s.status){case S.VALID:return"border-accent-secondary text-primary";case S.ERROR:return"border-red-900 text-primary";default:return"border-accent-primary text-primary"}switch(s.status){case S.VALID:return"border-primary text-white";case S.ERROR:return"border-red-900 text-error";default:return"border-primary text-secondary"}},_e=(s,t)=>{if(t===s.id)switch(s.status){case S.VALID:return"bg-accent-secondary";case S.ERROR:return"bg-red-400";default:return"bg-accent-primary"}switch(s.status){case S.VALID:return"bg-accent-secondary";case S.ERROR:return"bg-red-400";default:return"bg-layer-4"}},Ge=({step:s,index:t,currentStep:n,onChangeStep:r})=>{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",c=()=>n===s.id&&s.status===S.ERROR?e.jsx(N.IconExclamationCircle,{stroke:2,size:16}):n!==s.id&&s.status===S.VALID?e.jsx(N.IconCheck,{stroke:2,size:16}):t+1;return e.jsxs("button",{className:l(a,He(s,n)),onClick:()=>r(s.id),children:[e.jsx("span",{className:l(o,_e(s,n)),children:c()}),e.jsx("span",{children:s.name})]})},$e=({steps:s,currentStep:t,onChangeStep:n})=>{const r=a=>{const o=s.findIndex(u=>u.id===t),c=s.findIndex(u=>u.id===a);(a!==t&&s[o].status===S.VALID||c<o)&&n(a)};return e.jsx("div",{id:"steps",className:"flex gap-x-3",children:s.map((a,o)=>e.jsx(Ge,{currentStep:t,onChangeStep:r,step:a,index:o},a.id))})},le=({name:s,value:t,title:n,description:r,checked:a=!1,inputId:o,cssClass:c,labelCssClass:u,disabled:d,onChange:i,descriptionCssClass:x})=>{const p=`${o}-desc`,j=l("dial-small cursor-pointer",d?"text-secondary":"text-primary",u),g=l("cursor-pointer dial-input-radio",n&&"mr-2",c),v=l("flex flex-col",!!r&&"mb-2"),b=l("dial-tiny mt-2 ml-[26px] text-secondary",x),D=k=>{d||k.target.checked&&i?.(t)};return e.jsxs("div",{className:v,children:[e.jsxs("div",{className:"flex flex-row items-center",children:[e.jsx("input",{type:"radio",id:o,name:s,value:t,checked:a,disabled:d,"aria-describedby":a&&r?p:void 0,className:g,onChange:D}),n?e.jsx("label",{className:j,htmlFor:o,children:n}):null]}),a&&r&&e.jsx("div",{id:p,className:b,children:r})]})};var K=(s=>(s.Row="Row",s.Column="Column",s))(K||{});const qe="flex flex-col gap-2",Ke="flex",Ue="pb-1 mt-2",Xe={[K.Column]:"flex-col gap-y-3",[K.Row]:"flex-row gap-x-6"},ie=({fieldTitle:s,radioCssClass:t,labelCssClass:n,disabled:r,elementId:a,radioButtons:o,activeRadioButton:c,orientation:u,onChange:d})=>e.jsxs("div",{className:qe,children:[s&&e.jsx(W,{fieldTitle:s,htmlFor:a}),e.jsx("div",{role:"radiogroup","aria-label":s,"aria-disabled":r||void 0,className:l(Ke,Xe[u]),children:o.map(i=>e.jsxs("div",{className:"flex flex-col",children:[e.jsx(le,{name:a,value:i.id,inputId:i.id,disabled:r,cssClass:t,labelCssClass:n,title:i.name,checked:i.id===c,onChange:()=>d(i.id)}),i.id===c&&i.content?e.jsx("div",{className:Ue,children:i.content}):null]},i.id))})]}),Ze=({icon:s,title:t,description:n})=>e.jsxs("div",{className:"h-full w-full flex flex-col items-center justify-center text-secondary",children:[s||e.jsx(N.IconClipboardX,{width:60,height:60}),e.jsx("span",{className:"small mt-2 text-primary",children:t}),n&&e.jsx("span",{className:"mt-1 text-primary",children:n})]}),Qe=60,Ye=({containerCssClass:s,children:t,width:n,title:r,iconSize:a=_,titleCssClass:o,additionalButtons:c})=>{const[u,d]=f.useState(n),[i,x]=f.useState(!0),p=l(["transform rotate-180 [writing-mode:tb-rl]",i&&"hidden",o]),j=l(["flex flex-row gap-2 cursor-pointer text-secondary",i?"justify-end":"justify-center"]),g=()=>{d(i?Qe:n),x(!i)};return e.jsxs("div",{className:l(["rounded p-4 flex flex-col justify-between overflow-y-auto flex-shrink-0",s]),style:{width:`${u}px`},children:[e.jsx("div",{className:l(["flex-1 min-h-0 overflow-auto",!i&&"hidden"]),children:t}),e.jsx("div",{className:p,children:r}),e.jsxs("div",{className:j,children:[i&&c,e.jsx(M,{cssClass:"hover:text-icon-accent-primary",onClick:g,iconBefore:i?e.jsx(N.IconChevronsLeft,{size:a,stroke:G.stroke}):e.jsx(N.IconChevronsRight,{size:a,stroke:G.stroke})})]})]})},Je=({label:s,text:t,children:n,postfix:r})=>e.jsxs("div",{className:l("flex flex-col",n?"":"max-w-[200px]"),children:[e.jsx("label",{className:"dial-tiny mb-2 text-secondary",children:s}),n||e.jsxs("div",{className:"flex flex-row items-center",children:[e.jsx(O,{triggerClassName:"text-primary",tooltip:t,children:t}),r||null]})]});var Y=(s=>(s.Default="default",s))(Y||{});const es={[Y.Default]:"border-icon-secondary bg-layer-3"},ce=({tag:s,cssClass:t,remove:n,variant:r=Y.Default})=>{const a=es[r],o=l("flex items-center gap-1 tiny border rounded p-1 h-[22px] text-primary",t,a);return e.jsxs("div",{className:o,children:[e.jsx("span",{children:s}),n&&e.jsx(M,{iconAfter:e.jsx(N.IconX,{size:16}),onClick:n})]},s)},J=({ariaLabel:s,cssClass:t,size:n=24,onClose:r})=>e.jsx(M,{ariaLabel:s,cssClass:l("text-secondary hover:text-accent-primary",t),onClick:r,iconBefore:e.jsx(N.IconX,{size:n})}),de=({value:s,textareaId:t,placeholder:n,cssClass:r="",disabled:a,invalid:o,readonly:c,onChange:u})=>e.jsx(O,{tooltip:s,triggerClassName:"flex",children:e.jsx("textarea",{id:t,placeholder:n,value:s||"",disabled:a,className:l("dial-textarea dial-input px-3 py-2",o?"dial-input-error":"",a&&"dial-input-disable",c&&"dial-input-readonly",r),onChange:d=>!c&&u?.(d.currentTarget.value)})}),ss=["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Backspace","Delete","Tab","Enter","Escape","Home","End"],ts=(s,t,n,r)=>{if((t==="number"||n!==void 0||r!==void 0)&&!ss.includes(s.key)&&!(s.key==="-"&&s.currentTarget.selectionStart===0&&(n===void 0||n<0))&&!(s.key==="."&&t==="number"&&!s.currentTarget.value.includes("."))){if(!/^[0-9]$/.test(s.key)){s.preventDefault();return}if(n!==void 0||r!==void 0){const o=s.currentTarget.value,c=s.currentTarget.selectionStart||0,u=o.slice(0,c)+s.key+o.slice(c),d=parseFloat(u);if(!isNaN(d)){if(n!==void 0&&d<n){s.preventDefault();return}if(r!==void 0&&d>r){s.preventDefault();return}}}}},U=({iconBefore:s,iconAfter:t,hideBorder:n,value:r,elementId:a,placeholder:o="",cssClass:c="",containerCssClass:u,tooltipTriggerClassName:d,type:i="text",disabled:x,readonly:p,invalid:j,onChange:g,min:v,max:b,prefix:D,suffix:k,textBeforeInput:y,textAfterInput:C})=>{const w=F=>F.target.blur(),A=i==="number"||v!==void 0||b!==void 0,P=F=>{ts(F,i,v,b)},z=F=>{const E=F.currentTarget.value;if(A&&E!==""){const H=parseFloat(E);if(isNaN(H)&&E!=="-"&&E!=="."||!isNaN(H)&&(v!==void 0&&H<v||b!==void 0&&H>b))return}g?.(E)};return e.jsxs("div",{className:l("dial-input-field flex flex-row items-center justify-between py-2",n?"dial-input-no-border":"dial-input",j&&"dial-input-error",x&&"dial-input-disable",p&&"dial-input-readonly",!y&&"pl-3",!C&&"pr-3",u),children:[y&&e.jsx("div",{children:e.jsx(U,{hideBorder:!0,containerCssClass:"rounded-r-none border-r-0",cssClass:"overflow-hidden overflow-ellipsis dial-small",value:y,disabled:!0,elementId:y+"textBefore"})}),D&&e.jsxs("p",{className:"text-secondary dial-small",children:[" ",D]}),e.jsx(R,{icon:s}),e.jsx(O,{tooltip:r,triggerClassName:l(d,"flex-1"),children:e.jsx("input",{type:i,autoComplete:"off",id:a,placeholder:o,value:r??"",disabled:x,className:l("border-0 bg-transparent",c),onChange:F=>!p&&z?.(F),onKeyDown:P,onWheel:w,min:v,max:b})}),e.jsx(R,{icon:t}),k&&e.jsxs("p",{className:"text-secondary dial-small",children:[" ",k]}),C&&e.jsx("div",{children:e.jsx(U,{hideBorder:!0,containerCssClass:"rounded-l-none border-l-0",value:C,disabled:!0,elementId:C+"textAfter"})})]})},ns=/^0+\.(\d+)?$/,rs=/^0+/,ue=({fieldTitle:s,errorText:t,optional:n,elementCssClass:r,elementContainerCssClass:a,elementId:o,containerCssClass:c,readonly:u,defaultEmptyText:d,min:i,max:x,...p})=>e.jsxs("div",{className:l("flex flex-col",c),children:[e.jsx(W,{fieldTitle:s,optional:n,htmlFor:o}),u?e.jsx("span",{children:p.value||(d??"None")}):e.jsxs(e.Fragment,{children:[e.jsx(U,{elementId:o,cssClass:r,containerCssClass:a,invalid:t!=null,min:i,max:x,...p}),e.jsx($,{errorText:t})]})]}),as=({onChange:s,value:t,min:n,max:r,...a})=>{const o=c=>String(c)?.match(ns)?String(c)?.replace(rs,"0"):Number(c);return e.jsx(ue,{type:"number",onChange:c=>s?.(o(c)),value:t,min:n,max:r,...a})},os=({onChange:s,...t})=>e.jsx(ue,{type:"text",onChange:n=>s?.(n),...t}),ls=({fieldTitle:s,optional:t,elementId:n,elementCssClass:r,errorText:a,...o})=>e.jsxs("div",{className:"flex flex-col",children:[e.jsx(W,{fieldTitle:s,optional:t,htmlFor:n}),e.jsx(de,{textareaId:n,cssClass:r,...o}),e.jsx($,{errorText:a})]}),is=({title:s,switchId:t,isOn:n=!1,disabled:r,onChange:a})=>{const o=l("flex w-[36px] h-[18px] cursor-pointer items-center gap-1 rounded-full p-0.5 transition-all duration-200",n?"flex-row-reverse":"flex-row",r?"pointer-events-none":"",r?n?"bg-controls-disable":"bg-layer-4":n?"bg-accent-primary":"bg-layer-4"),c=f.useCallback(u=>{u.stopPropagation(),a?.(!n)},[a,n]);return e.jsxs("div",{className:"flex flex-row items-center",children:[e.jsx("input",{type:"checkbox",onChange:c,id:t,disabled:r,className:"invisible w-0 h-0",checked:n}),e.jsx("label",{htmlFor:t,className:o,children:e.jsx("span",{className:l("size-3 rounded-full",r?n?"bg-layer-4":"bg-controls-disable":"bg-controls-enable-primary")})}),s&&e.jsx("span",{className:"pl-2 dial-small text-primary",children:s})]})};var B=(s=>(s.Sm="sm",s.Md="md",s.Lg="lg",s))(B||{});const cs="z-[52] flex items-center justify-center bg-blackout md:p-4",ds="divide-tertiary divide-y",us="flex flex-row justify-between py-4 px-6 items-center",xs={[B.Sm]:"dial-sm-popup",[B.Md]:"dial-md-popup",[B.Lg]:"dial-lg-popup"},ee=({open:s=!1,title:t,portalId:n,cssClass:r,overlayClass:a,headingClass:o,dividers:c=!0,children:u,footer:d,onClose:i,size:x=B.Md})=>{const{refs:p,context:j}=h.useFloating({open:s,onOpenChange:y=>{y||i?.(null)}}),g=h.useRole(j,{role:"dialog"}),v=h.useDismiss(j,{outsidePress:!0}),{getFloatingProps:b}=h.useInteractions([g,v]);if(!s)return null;const D=typeof t=="string"?"dial-popup-heading":void 0,k=y=>y?typeof y=="string"?e.jsx("h3",{id:D,className:l("flex-1 min-w-0 mr-3 truncate dial-h3 text-primary",o),children:e.jsx(O,{tooltip:y,children:y})}):y:e.jsx("span",{});return e.jsx(h.FloatingPortal,{id:n,children:e.jsx(h.FloatingOverlay,{className:l(cs,a),children:e.jsx(h.FloatingFocusManager,{context:j,children:e.jsxs("div",{ref:p.setFloating,...b(),role:"dialog","aria-modal":"true","aria-labelledby":D,className:l("dial-popup",xs[x],c&&ds,r),children:[e.jsxs("div",{className:us,children:[k(t),e.jsx(J,{ariaLabel:"Close dialog",onClose:y=>i?.(y)})]}),e.jsx("div",{className:"flex-grow overflow-auto",children:u}),d]})})})})};var X=(s=>(s.Info="info",s.Danger="danger",s))(X||{});const ps="flex justify-end gap-2 px-6 py-4",fs="text-secondary dial-small-150 px-6 py-4",ms="Cancel",te={[X.Info]:{confirmVariant:I.Primary,cancelVariant:I.Secondary},[X.Danger]:{container:"border-t-4 border-error",confirmVariant:I.Danger,cancelVariant:I.Secondary}},hs=({title:s,description:t,descriptionCssClass:n,open:r=!1,confirmLabel:a,cancelLabel:o=ms,isLoading:c=!1,disableConfirmButton:u=!1,cssClass:d,confirmClassName:i,onClose:x,onConfirm:p,onCancel:j,children:g,dividers:v=!1,variant:b=X.Info,size:D=B.Sm})=>{const k=c?null:e.jsxs("div",{className:ps,children:[e.jsx(M,{variant:I.Secondary,title:o,onClick:()=>j?j():x?.()}),e.jsx(M,{variant:te[b].confirmVariant,cssClass:i,title:a,disable:u,onClick:()=>p()})]}),y=f.useCallback(()=>c?e.jsx("div",{className:"px-6 py-4 h-[120px]",children:e.jsx(re,{size:50})}):g??(t?e.jsx("div",{className:l(fs,n),children:t}):null),[g,t,c,n]);return e.jsx(ee,{open:r,title:s,cssClass:l(te[b].container,d),dividers:v,onClose:()=>x?.(),footer:k,size:D,children:y()})},se=({selectedItems:s,listCssClass:t,listElementCssClass:n})=>!!s?.length&&e.jsx("ul",{className:l("flex-row items-center truncate flex-wrap","flex gap-x-2 gap-y-1",t),children:s?.map(r=>e.jsx("li",{className:l(["tiny bg-layer-3 rounded p-1 border border-primary max-w-[200px] truncate",n]),children:e.jsx(O,{tooltip:r,children:e.jsx("button",{"aria-label":"autocomplete-action",type:"button",className:"truncate w-full",children:r})})},r))}),ne=s=>L.createElement("svg",{width:18,height:18,viewBox:"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg",...s},L.createElement("path",{d:"M2.25 13.5V12C2.25 11.5858 2.58579 11.25 3 11.25C3.41421 11.25 3.75 11.5858 3.75 12V13.5C3.75 13.6989 3.82907 13.8896 3.96973 14.0303C4.11038 14.1709 4.30109 14.25 4.5 14.25H6C6.41421 14.25 6.75 14.5858 6.75 15C6.75 15.4142 6.41421 15.75 6 15.75H4.5C3.90326 15.75 3.33114 15.5128 2.90918 15.0908C2.48722 14.6689 2.25 14.0967 2.25 13.5ZM14.25 6V4.5C14.25 4.30109 14.1709 4.11038 14.0303 3.96973C13.8896 3.82907 13.6989 3.75 13.5 3.75H12C11.5858 3.75 11.25 3.41421 11.25 3C11.25 2.58579 11.5858 2.25 12 2.25H13.5C14.0967 2.25 14.6689 2.48722 15.0908 2.90918C15.5128 3.33114 15.75 3.90326 15.75 4.5V6C15.75 6.41421 15.4142 6.75 15 6.75C14.5858 6.75 14.25 6.41421 14.25 6Z",fill:"currentColor"})),xe=({children:s,open:t,readonly:n,selectedValue:r,valueCssClasses:a,inputCssClasses:o,onOpen:c,elementId:u,errorText:d,emptyValueText:i})=>{const x=Array.isArray(r)&&r.length>0,p=typeof r=="string"&&!!r.trim(),j=x||p?r:i,g=n?void 0:c,v=()=>e.jsxs(e.Fragment,{children:[e.jsx("button",{type:"button",className:"w-full",onClick:g,"aria-label":"open-popup",id:u,children:e.jsxs("div",{className:l("dial-input px-3 py-2 dial-input-field flex flex-row items-center w-full justify-between",o,n&&"dial-input-disable",d&&"dial-input-error"),children:[e.jsx(O,{tooltip:String(j),children:e.jsx("span",{className:a,children:j})}),!n&&e.jsx("div",{className:"flex-shrink-0",children:e.jsx(R,{icon:e.jsx(ne,{role:"img",width:_,height:_})})})]})}),d&&e.jsx($,{errorText:d})]}),b=()=>e.jsx("div",{className:"w-full",onClick:g,children:e.jsxs("div",{className:l("dial-input px-3 py-2 flex flex-row items-center w-full justify-between",n&&"dial-input-disable"),children:[e.jsx(se,{selectedItems:j}),!n&&e.jsx("div",{className:"ml-1",children:e.jsx(R,{icon:e.jsx(ne,{role:"img",width:_,height:_})})})]})});return e.jsxs(e.Fragment,{children:[x?b():v(),t&&ke.createPortal(s,document.body)]})},gs=({fieldTitle:s,htmlFor:t,readonly:n,selectedValue:r,radioButtons:a,customInputValue:o,valueCssClasses:c,inputCssClasses:u,emptyValueText:d,onClose:i,title:x,portalId:p,onApply:j,cancelButtonTitle:g="Cancel",applyButtonTitle:v="Apply",isValid:b,selectedRadioValue:D,onChangeRadioField:k,id:y})=>{const[C,w]=f.useState(!1),A=f.useCallback(()=>{n||w(!0)},[n]),P=f.useCallback(()=>{w(!1),i?.()},[i]),z=f.useCallback(()=>{j(),P()},[j,P]);return e.jsxs("div",{className:"flex flex-col",children:[e.jsx(W,{fieldTitle:s,htmlFor:t}),e.jsx(xe,{readonly:n,open:C,selectedValue:o??a.find(F=>F.id===r)?.name,valueCssClasses:c,inputCssClasses:l(u,"py-2","px-3"),emptyValueText:d,onOpen:A,children:e.jsx(ee,{open:C,onClose:P,title:x,portalId:p,footer:e.jsxs("div",{className:"flex flex-row items-center justify-end gap-2 px-6 py-4",children:[e.jsx(M,{variant:I.Secondary,title:g,onClick:P}),e.jsx(M,{variant:I.Primary,title:v,onClick:z,disable:!b})]}),children:e.jsx("div",{className:"px-6 py-4",children:e.jsx(ie,{radioButtons:a,labelCssClass:"dial-small",activeRadioButton:D,onChange:k,elementId:y,orientation:K.Column})})})})]})},js=({onClick:s})=>e.jsx(N.IconEyeOff,{...G,className:"text-primary",onClick:s}),Cs=({onClick:s})=>e.jsx(N.IconEye,{...G,className:"text-primary",onClick:s}),pe=({...s})=>{const[t,n]=f.useState(!1),r=f.useCallback(a=>{n(a)},[]);return e.jsx(U,{type:t?"text":"password",...s,iconAfter:t?e.jsx(js,{onClick:()=>r(!1)}):e.jsx(Cs,{onClick:()=>r(!0)})})},bs=({fieldTitle:s,optional:t,elementCssClass:n,elementId:r,errorText:a,...o})=>e.jsxs("div",{className:"flex flex-col",children:[e.jsx(W,{fieldTitle:s,optional:t,htmlFor:r}),e.jsx(pe,{cssClass:n,elementId:r,invalid:!!a,...o}),e.jsx($,{errorText:a})]});var Z=(s=>(s.Small="small",s.Base="base",s))(Z||{});const ys={[Z.Small]:{textClass:"text-xs px-1",containerClass:"px-[6px] py-1 h-[22px]",iconSize:10,iconStroke:1},[Z.Base]:{textClass:"text-sm px-2",containerClass:"px-3 py-2 h-[38px]",iconSize:18,iconStroke:1.5}},vs=({elementId:s,value:t,placeholder:n,disabled:r,readonly:a,invalid:o,cssClass:c,containerCssClass:u,onChange:d,size:i=Z.Base})=>{const[x,p]=f.useState(t||"");f.useEffect(()=>{p(t||"")},[t]);const j=f.useCallback(b=>{p(b),d?.(b)},[d]),g=ys[i],v=f.useCallback(()=>{j("")},[j]);return e.jsxs("div",{className:l("dial-input flex flex-row items-center justify-between",o&&"dial-input-error",r&&"dial-input-disable",a&&"dial-input-readonly",g.containerClass,u),children:[e.jsx(R,{className:l(r?"text-secondary":"text-primary"),icon:e.jsx(N.IconSearch,{size:g.iconSize,stroke:g.iconStroke})}),e.jsx("input",{id:s,type:"text",autoComplete:"off",placeholder:n,value:x??"",disabled:r,readOnly:a,className:l("border-0 bg-transparent w-full",c,g.textClass),onChange:b=>!a&&j(b.currentTarget.value)}),x&&!a&&!r&&e.jsx(R,{className:"text-primary cursor-pointer",icon:e.jsx(N.IconX,{size:g.iconSize,stroke:g.iconStroke,onClick:v,"aria-label":"Clear search",role:"button"})})]})},ws=({placeholder:s="",selectedItems:t=[],updateSelected:n,listCssClass:r,listElementCssClass:a,containerCssClass:o,inputCssClass:c})=>{const[u,d]=f.useState(""),i=f.useCallback(p=>{p.key==="Enter"&&(n([...t,p.currentTarget.value]),d("")),(p.key==="Backspace"||p.key==="Delete")&&t.length&&!u&&n(t.slice(0,-1))},[t,n,u]),x=f.useCallback(p=>{d(p.target.value)},[d]);return e.jsxs("div",{className:l(["dial-input px-3 py-2 flex flex-row items-center flex-wrap w-fit gap-2",o]),children:[e.jsx(se,{selectedItems:t,listCssClass:r,listElementCssClass:a}),e.jsx("input",{type:"text",value:u,className:l(["border-0 bg-transparent p-0",c]),placeholder:t?.length?"":s,onKeyDown:i,onChange:x})]})},Ns=({initialTags:s=[],fieldTitle:t,optional:n,elementId:r,placeholder:a,errorText:o,invalid:c,disabled:u,onChange:d})=>{const i=f.useRef(null),[x,p]=f.useState(s),[j,g]=f.useState(""),[v,b]=f.useState(!1),D=C=>{const w=C.trim().replace(/,$/,"");if(w&&!x.includes(w)){const A=[w,...x];p(A),d?.(A)}},k=C=>{(C.key===","||C.key==="Enter")&&(C.preventDefault(),D(j),g(""))},y=C=>{const w=x.filter((A,P)=>P!==C);p(w),d?.(w)};return f.useEffect(()=>{const C=new ResizeObserver(()=>{if(i.current){const w=i.current.scrollHeight>i.current.clientHeight+10;b(w)}});return i.current&&C.observe(i.current),()=>C.disconnect()},[x]),e.jsxs("div",{className:l("flex flex-col w-full"),children:[e.jsx(W,{fieldTitle:t,optional:n,htmlFor:r}),e.jsx("div",{className:l("dial-input min-h-[38px] p-[6px]",c&&"dial-input-error",u&&"dial-input-disable"),children:e.jsxs("div",{ref:i,className:l("flex flex-wrap gap-2 items-center",v?"flex-col-reverse":"flex-row"),children:[x.map((C,w)=>e.jsx(ce,{tag:C,remove:u?void 0:()=>y(w)},C+w)),e.jsx("input",{type:"text",value:j,onChange:C=>g(C.target.value),onKeyDown:k,className:l("dial-input-no-border outline-none border-none w-full min-w-[100px] flex-1 p-1"),placeholder:a,disabled:u})]})}),e.jsx($,{errorText:o})]})};var fe=(s=>(s.Dropdown="dropdown",s.Menu="menu",s))(fe||{}),q=(s=>(s.Click="click",s.Hover="hover",s.ContextMenu="contextMenu",s))(q||{}),me=(s=>(s.Item="item",s.Divider="divider",s))(me||{});const ks=l("inline-flex items-center gap-2 align-middle","h-auto px-0 bg-transparent border-0"),Ds=l("z-[53] overflow-auto rounded bg-layer-0 text-primary shadow focus-visible:outline-none","w-max"),Is=l("flex w-full cursor-pointer items-center gap-3","focus-visible:border-none focus-visible:outline-none","hover:bg-accent-primary-alpha px-3","dial-small h-[34px] rounded text-primary"),Ss="opacity-75 !cursor-not-allowed",Rs="text-error",Fs="my-1 border-t border-hover",Q=8,Es=({children:s,menu:t,renderOverlay:n,trigger:r=[q.Click],placement:a,disabled:o=!1,open:c,defaultOpen:u=!1,onOpenChange:d,closable:i=!1,onClose:x,cssClass:p,listClassName:j,outsidePressIgnoreRef:g,outsideClosable:v=!0})=>{const[b,D]=f.useState(u),k=c!==void 0,y=k?!!c:b,C=f.useCallback(m=>{k||D(m),d?.(m)},[k,d]),w=f.useId(),A=m=>m?"clientWidth"in m?m.clientWidth:m.getBoundingClientRect?.()?.width??0:0,P=a===void 0,{refs:z,floatingStyles:F,context:E}=h.useFloating({placement:a,open:y,onOpenChange:C,whileElementsMounted:h.autoUpdate,middleware:[h.offset({mainAxis:Q,crossAxis:0}),P?h.autoPlacement({alignment:"start",crossAxis:!0,padding:Q}):h.flip({padding:Q}),h.shift({padding:Q}),h.size({apply({availableWidth:m,elements:T}){const Ne=A(T.reference);T.floating.style.setProperty("--reference-width",`${Ne}px`),T.floating.style.maxWidth=`${m}px`}})]}),H=h.useClick(E,{enabled:r.includes(q.Click)&&!o}),he=h.useHover(E,{enabled:r.includes(q.Hover)&&!o,move:!1,restMs:40,delay:{open:80,close:80}}),ge=h.useDismiss(E,{bubbles:!0,referencePress:!1,outsidePress:m=>{if(!v)return!1;const T=m.target;return!(g?.current&&T instanceof Node&&g.current.contains(T))}}),je=h.useRole(E,{role:"menu"}),{getReferenceProps:Ce,getFloatingProps:be}=h.useInteractions([H,he,ge,je]),ye=m=>{!r.includes(q.ContextMenu)||o||(m.preventDefault(),C(!0))};f.useEffect(()=>{o&&y&&C(!1)},[o,y,C]);const ve=m=>T=>{m.disabled||(m.onClick?.({key:m.key,domEvent:T}),t?.onClick?.({key:m.key,domEvent:T}),C(!1))},we=n?n():t&&e.jsx("div",{role:"none",className:"py-1",children:t.items.map(m=>m.type===me.Divider?e.jsx("div",{role:"separator",className:Fs},m.key):e.jsxs("button",{role:"menuitem",type:"button","aria-disabled":!!m.disabled,className:l(Is,m.disabled&&Ss,m.danger&&Rs),disabled:m.disabled,onClick:ve(m),children:[m.icon&&e.jsx("span",{className:l(m.danger&&"text-error",m.disabled&&"text-secondary"),children:e.jsx(R,{icon:m.icon})}),e.jsx("span",{className:l("flex-1 truncate text-left",m.danger&&"text-error",m.disabled&&"text-secondary"),children:m.label})]},m.key))});return e.jsxs(e.Fragment,{children:[e.jsx("span",{ref:z.setReference,className:l(ks,o&&"!cursor-not-allowed opacity-75",p),"aria-haspopup":"menu","aria-expanded":y,"aria-controls":w,onContextMenu:ye,...Ce(),children:s}),y&&e.jsx(h.FloatingPortal,{children:e.jsx(h.FloatingFocusManager,{context:E,modal:!1,initialFocus:-1,returnFocus:!0,children:e.jsxs("div",{id:w,ref:z.setFloating,style:F,className:l(Ds,j),...be(),children:[i&&e.jsx("div",{className:"flex items-center justify-between px-2 pt-2",children:e.jsx(J,{ariaLabel:"Close dropdown",onClose:m=>{x?.(m),C(!1)}})}),we]})})})]})};exports.AlertVariant=V;exports.ButtonVariant=I;exports.ConfirmationPopupVariant=X;exports.DialAlert=Ee;exports.DialAutocompleteInput=ws;exports.DialAutocompleteInputValue=se;exports.DialButton=M;exports.DialCheckbox=ze;exports.DialCloseButton=J;exports.DialCollapsibleSidebar=Ye;exports.DialConfirmationPopup=hs;exports.DialDropdown=Es;exports.DialErrorText=$;exports.DialFieldLabel=W;exports.DialIcon=R;exports.DialInput=U;exports.DialInputPopup=xe;exports.DialLabelledText=Je;exports.DialLoader=re;exports.DialNoDataContent=Ze;exports.DialNumberInputField=as;exports.DialPasswordInput=pe;exports.DialPasswordInputField=bs;exports.DialPopup=ee;exports.DialRadioButton=le;exports.DialRadioGroup=ie;exports.DialRadioGroupPopupField=gs;exports.DialSearch=vs;exports.DialSteps=$e;exports.DialSwitch=is;exports.DialTag=ce;exports.DialTagInput=Ns;exports.DialTextAreaField=ls;exports.DialTextInputField=os;exports.DialTextarea=de;exports.DialTooltip=O;exports.DropdownType=fe;exports.PopupSize=B;exports.RadioGroupOrientation=K;exports.SearchSize=Z;exports.StepStatus=S;exports.TagVariant=Y;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("classnames"),N=require("@tabler/icons-react"),f=require("react"),h=require("@floating-ui/react"),ke=require("react-dom");function De(s){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const n in s)if(n!=="default"){const r=Object.getOwnPropertyDescriptor(s,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:()=>s[n]})}}return t.default=s,Object.freeze(t)}const L=De(f),$=({errorText:s})=>s&&e.jsx("span",{className:"text-error dial-tiny mt-1",children:s}),W=({fieldTitle:s,htmlFor:t,optional:n,optionalText:r,cssClass:a})=>s?e.jsxs("label",{className:l("dial-tiny text-secondary",a,!a?.includes("mb")&&"mb-2"),htmlFor:t,children:[e.jsx("span",{className:"min-h-4",children:s}),n&&e.jsx("span",{className:"ml-1",children:r??"(Optional)"})]}):null,R=({icon:s,className:t})=>s?e.jsx("span",{className:l("flex-shrink-0",t),children:s}):null;var I=(s=>(s.Primary="primary",s.Secondary="secondary",s.Tertiary="tertiary",s.Danger="danger",s))(I||{});const Ie={[I.Primary]:"dial-primary-button",[I.Secondary]:"dial-secondary-button",[I.Tertiary]:"dial-tertiary-button",[I.Danger]:"dial-danger-button"},M=({title:s,variant:t,cssClass:n,textCssClass:r,ref:a,onClick:o,disable:c,iconAfter:u,iconBefore:d,hideTitleOnMobile:i,ariaLabel:x})=>{const p=l("dial-small-semi",u?"mr-2":"",d?"ml-2":"",i?"hidden sm:inline":"inline",r),j=l(t&&Ie[t],n,"focus-visible:outline outline-offset-0");return e.jsxs("button",{ref:a,type:"button",className:j,onClick:g=>o?.(g),disabled:c,"aria-label":s||x,children:[e.jsx(R,{icon:d}),s&&e.jsx("span",{className:p,children:s}),e.jsx(R,{icon:u})]})};var V=(s=>(s.Info="info",s.Success="success",s.Warning="warning",s.Error="error",s))(V||{});const Se={info:e.jsx(N.IconInfoCircle,{size:24,stroke:2}),error:e.jsx(N.IconAlertCircle,{size:24,stroke:2}),warning:e.jsx(N.IconAlertTriangle,{size:24,stroke:2}),success:e.jsx(N.IconCircleCheck,{size:24,stroke:2})},Re={[V.Info]:"bg-info border-info text-info",[V.Success]:"bg-success border-success text-success",[V.Warning]:"bg-warning border-warning text-warning",[V.Error]:"bg-error border-error text-error"},Fe="items-center justify-between gap-2 p-3 border border-solid dial-small-150 rounded flex",Ee=({variant:s=V.Info,message:t,cssClass:n,closable:r=!1,onClose:a})=>e.jsxs("div",{role:"alert",className:l(Fe,Re[s],n),children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(R,{icon:Se[s]}),e.jsx("div",{className:"text-primary",children:t})]}),r&&e.jsx(M,{cssClass:"ml-2 text-secondary hover:text-primary",ariaLabel:"Close alert",iconBefore:e.jsx(N.IconX,{size:16}),onClick:o=>a?.(o)})]}),Le="flex items-center justify-center text-secondary",Pe="shrink-0 grow-0 basis-auto animate-spin-steps",Te=s=>L.createElement("svg",{viewBox:"0 0 48 48",fill:"none",xmlns:"http://www.w3.org/2000/svg",...s},L.createElement("path",{d:"M24 39V46.5",stroke:"currentColor",strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round"}),L.createElement("path",{opacity:.4,d:"M9 24H1.5",stroke:"currentColor",strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round"}),L.createElement("path",{opacity:.5,d:"M8.0918 8.0918L13.3994 13.3994",stroke:"currentColor",strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round"}),L.createElement("path",{opacity:.6,d:"M24 1.5V9",stroke:"currentColor",strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round"}),L.createElement("path",{opacity:.7,d:"M39.9121 8.08594L37.2607 10.7373L34.6094 13.3887",stroke:"currentColor",strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round"}),L.createElement("path",{opacity:.8,d:"M46.5 24H39",stroke:"currentColor",strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round"}),L.createElement("path",{opacity:.9,d:"M34.6055 34.6055L39.9082 39.9082",stroke:"currentColor",strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round"}),L.createElement("path",{opacity:.3,d:"M13.3936 34.6055L8.08594 39.9131",stroke:"currentColor",strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round"})),re=({size:s=18,cssClass:t,iconClass:n,fullWidth:r=!0,ariaLabel:a="Loading"})=>e.jsx("div",{role:"status","aria-label":a,className:l({[Le]:!0,"w-full h-full":r,[t||""]:!!t}),children:e.jsx(R,{icon:e.jsx(Te,{width:s,height:s,className:l(Pe,n),role:"img"})})}),Ae=7,Me=2,ae=f.createContext(null),oe=()=>{const s=f.useContext(ae);if(s==null)throw new Error("Tooltip components must be wrapped in <Tooltip />");return s},Oe=({initialOpen:s=!1,placement:t="bottom",isTriggerClickable:n=!1,open:r,onOpenChange:a}={})=>{const[o,c]=f.useState(s),u=f.useRef(null),d=r??o,i=a??c,x=h.useFloating({placement:t,open:d,onOpenChange:i,whileElementsMounted:h.autoUpdate,middleware:[h.offset(Ae+Me),h.flip({crossAxis:t.includes("-"),fallbackAxisSideDirection:"start",padding:5}),h.shift({padding:5}),h.arrow({element:u})]}),p=h.useHover(x.context,{move:!1,enabled:r==null,mouseOnly:n,delay:{open:500,close:0}}),j=h.useFocus(x.context,{enabled:r==null}),g=h.useDismiss(x.context),v=h.useRole(x.context,{role:"tooltip"}),b=h.useInteractions([p,j,g,v]);return f.useMemo(()=>({open:d,setOpen:i,arrowRef:u,...b,...x}),[d,i,b,x])},Ve=({children:s,...t})=>{const n=Oe(t);return e.jsx(ae.Provider,{value:n,children:s})},Be=f.forwardRef(function({style:t,...n},r){const a=oe(),o=h.useMergeRefs([a.refs.setFloating,r]);return a.open?e.jsx(h.FloatingPortal,{id:"tooltip-portal",children:e.jsxs("div",{ref:o,style:{...a.floatingStyles,...t},...a.getFloatingProps(n),className:l("z-[55] whitespace-pre-wrap break-words rounded border border-primary bg-blackout px-2 py-1 dial-tiny shadow max-w-[300px]",a.getFloatingProps(n).className),children:[n.children,e.jsx(h.FloatingArrow,{ref:a.arrowRef,context:a.context,fill:"currentColor",strokeWidth:1,className:"stroke-primary w-2 text-[var(--bg-layer-0,_#000000)]"})]})}):null}),We=f.forwardRef(function({children:t,asChild:n=!1,...r},a){const o=oe(),u=t&&typeof t=="object"&&"ref"in t&&t.ref!==void 0?t.ref:void 0,d=h.useMergeRefs([o.refs.setReference,a,u]);return n&&f.isValidElement(t)?f.cloneElement(t,o.getReferenceProps({ref:d,...r,...t.props})):e.jsx("span",{ref:d,...o.getReferenceProps(r),className:r.className??"dial-tooltip-trigger text-left",children:t})}),O=({hideTooltip:s,tooltip:t,children:n,triggerClassName:r,contentClassName:a,...o})=>e.jsxs(Ve,{...o,children:[e.jsx(We,{className:l(r,"truncate"),children:n}),e.jsx(Be,{className:l("text-primary",a,"max-w-[300px]",(s||!t)&&"hidden"),children:t})]}),_=18,G={size:_,stroke:2},ze=({label:s,id:t,checked:n,indeterminate:r,disabled:a,ariaLabel:o,onChange:c})=>{const u=f.useCallback(p=>{c?.(p.target.checked,t)},[c,t]),d=l("flex flex-row items-center cursor-pointer text-accent-primary small-medium flex-1 min-w-0",`${n||r?"":'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":""),i=l("mr-2 border rounded",a?"bg-layer-4 border-icon-secondary":""),x=()=>r?e.jsx(N.IconMinus,{className:i,...G}):n?e.jsx(N.IconCheck,{className:i,...G}):null;return e.jsxs("label",{className:d,htmlFor:t,children:[x(),s&&e.jsx(O,{tooltip:s,triggerClassName:"flex-1 min-w-0",children:e.jsx("p",{className:"text-primary w-full truncate",children:s})}),e.jsx("input",{type:"checkbox",role:"checkbox",name:t,onChange:u,id:t,checked:n,"aria-checked":r?"mixed":n,"aria-disabled":a||void 0,"aria-label":s?void 0:o,className:"invisible w-0 h-0"})]})};var S=(s=>(s.VALID="valid",s.ERROR="error",s))(S||{});const He=(s,t)=>{if(t===s.id)switch(s.status){case S.VALID:return"border-accent-secondary text-primary";case S.ERROR:return"border-red-900 text-primary";default:return"border-accent-primary text-primary"}switch(s.status){case S.VALID:return"border-primary text-white";case S.ERROR:return"border-red-900 text-error";default:return"border-primary text-secondary"}},_e=(s,t)=>{if(t===s.id)switch(s.status){case S.VALID:return"bg-accent-secondary";case S.ERROR:return"bg-red-400";default:return"bg-accent-primary"}switch(s.status){case S.VALID:return"bg-accent-secondary";case S.ERROR:return"bg-red-400";default:return"bg-layer-4"}},Ge=({step:s,index:t,currentStep:n,onChangeStep:r})=>{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",c=()=>n===s.id&&s.status===S.ERROR?e.jsx(N.IconExclamationCircle,{stroke:2,size:16}):n!==s.id&&s.status===S.VALID?e.jsx(N.IconCheck,{stroke:2,size:16}):t+1;return e.jsxs("button",{className:l(a,He(s,n)),onClick:()=>r(s.id),children:[e.jsx("span",{className:l(o,_e(s,n)),children:c()}),e.jsx("span",{children:s.name})]})},$e=({steps:s,currentStep:t,onChangeStep:n})=>{const r=a=>{const o=s.findIndex(u=>u.id===t),c=s.findIndex(u=>u.id===a);(a!==t&&s[o].status===S.VALID||c<o)&&n(a)};return e.jsx("div",{id:"steps",className:"flex gap-x-3",children:s.map((a,o)=>e.jsx(Ge,{currentStep:t,onChangeStep:r,step:a,index:o},a.id))})},le=({name:s,value:t,title:n,description:r,checked:a=!1,inputId:o,cssClass:c,labelCssClass:u,disabled:d,onChange:i,descriptionCssClass:x})=>{const p=`${o}-desc`,j=l("dial-small cursor-pointer",d?"text-secondary":"text-primary",u),g=l("cursor-pointer dial-input-radio",n&&"mr-2",c),v=l("flex flex-col",!!r&&"mb-2"),b=l("dial-tiny mt-2 ml-[26px] text-secondary",x),D=k=>{d||k.target.checked&&i?.(t)};return e.jsxs("div",{className:v,children:[e.jsxs("div",{className:"flex flex-row items-center",children:[e.jsx("input",{type:"radio",id:o,name:s,value:t,checked:a,disabled:d,"aria-describedby":a&&r?p:void 0,className:g,onChange:D}),n?e.jsx("label",{className:j,htmlFor:o,children:n}):null]}),a&&r&&e.jsx("div",{id:p,className:b,children:r})]})};var K=(s=>(s.Row="Row",s.Column="Column",s))(K||{});const qe="flex flex-col gap-2",Ke="flex",Ue="pb-1 mt-2",Xe={[K.Column]:"flex-col gap-y-3",[K.Row]:"flex-row gap-x-6"},ie=({fieldTitle:s,radioCssClass:t,labelCssClass:n,disabled:r,elementId:a,radioButtons:o,activeRadioButton:c,orientation:u,onChange:d})=>e.jsxs("div",{className:qe,children:[s&&e.jsx(W,{fieldTitle:s,htmlFor:a}),e.jsx("div",{role:"radiogroup","aria-label":s,"aria-disabled":r||void 0,className:l(Ke,Xe[u]),children:o.map(i=>e.jsxs("div",{className:"flex flex-col",children:[e.jsx(le,{name:a,value:i.id,inputId:i.id,disabled:r,cssClass:t,labelCssClass:n,title:i.name,checked:i.id===c,onChange:()=>d(i.id)}),i.id===c&&i.content?e.jsx("div",{className:Ue,children:i.content}):null]},i.id))})]}),Ze=({icon:s,title:t,description:n})=>e.jsxs("div",{className:"h-full w-full flex flex-col items-center justify-center text-secondary",children:[s||e.jsx(N.IconClipboardX,{width:60,height:60}),e.jsx("span",{className:"small mt-2 text-primary",children:t}),n&&e.jsx("span",{className:"mt-1 text-primary",children:n})]}),Qe=60,Ye=({containerCssClass:s,children:t,width:n,title:r,iconSize:a=_,titleCssClass:o,additionalButtons:c})=>{const[u,d]=f.useState(n),[i,x]=f.useState(!0),p=l(["transform rotate-180 [writing-mode:tb-rl]",i&&"hidden",o]),j=l(["flex flex-row gap-2 cursor-pointer text-secondary",i?"justify-end":"justify-center"]),g=()=>{d(i?Qe:n),x(!i)};return e.jsxs("div",{className:l(["rounded p-4 flex flex-col justify-between overflow-y-auto flex-shrink-0",s]),style:{width:`${u}px`},children:[e.jsx("div",{className:l(["flex-1 min-h-0 overflow-auto",!i&&"hidden"]),children:t}),e.jsx("div",{className:p,children:r}),e.jsxs("div",{className:j,children:[i&&c,e.jsx(M,{cssClass:"hover:text-icon-accent-primary",onClick:g,iconBefore:i?e.jsx(N.IconChevronsLeft,{size:a,stroke:G.stroke}):e.jsx(N.IconChevronsRight,{size:a,stroke:G.stroke})})]})]})},Je=({label:s,text:t,children:n,postfix:r})=>e.jsxs("div",{className:l("flex flex-col",n?"":"max-w-[200px]"),children:[e.jsx("label",{className:"dial-tiny mb-2 text-secondary",children:s}),n||e.jsxs("div",{className:"flex flex-row items-center",children:[e.jsx(O,{triggerClassName:"text-primary",tooltip:t,children:t}),r||null]})]});var Y=(s=>(s.Default="default",s))(Y||{});const es={[Y.Default]:"border-icon-secondary bg-layer-3"},ce=({tag:s,cssClass:t,remove:n,variant:r=Y.Default})=>{const a=es[r],o=l("flex items-center gap-1 dial-tiny border rounded p-1 h-[22px] text-primary",t,a);return e.jsxs("div",{className:o,children:[e.jsx("span",{children:s}),n&&e.jsx(M,{iconAfter:e.jsx(N.IconX,{size:16}),onClick:n})]},s)},J=({ariaLabel:s,cssClass:t,size:n=24,onClose:r})=>e.jsx(M,{ariaLabel:s,cssClass:l("text-secondary hover:text-accent-primary",t),onClick:r,iconBefore:e.jsx(N.IconX,{size:n})}),de=({value:s,textareaId:t,placeholder:n,cssClass:r="",disabled:a,invalid:o,readonly:c,onChange:u})=>e.jsx(O,{tooltip:s,triggerClassName:"flex",children:e.jsx("textarea",{id:t,placeholder:n,value:s||"",disabled:a,className:l("dial-textarea dial-input px-3 py-2",o?"dial-input-error":"",a&&"dial-input-disable",c&&"dial-input-readonly",r),onChange:d=>!c&&u?.(d.currentTarget.value)})}),ss=["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Backspace","Delete","Tab","Enter","Escape","Home","End"],ts=(s,t,n,r)=>{if((t==="number"||n!==void 0||r!==void 0)&&!ss.includes(s.key)&&!(s.key==="-"&&s.currentTarget.selectionStart===0&&(n===void 0||n<0))&&!(s.key==="."&&t==="number"&&!s.currentTarget.value.includes("."))){if(!/^[0-9]$/.test(s.key)){s.preventDefault();return}if(n!==void 0||r!==void 0){const o=s.currentTarget.value,c=s.currentTarget.selectionStart||0,u=o.slice(0,c)+s.key+o.slice(c),d=parseFloat(u);if(!isNaN(d)){if(n!==void 0&&d<n){s.preventDefault();return}if(r!==void 0&&d>r){s.preventDefault();return}}}}},U=({iconBefore:s,iconAfter:t,hideBorder:n,value:r,elementId:a,placeholder:o="",cssClass:c="",containerCssClass:u,tooltipTriggerClassName:d,type:i="text",disabled:x,readonly:p,invalid:j,onChange:g,min:v,max:b,prefix:D,suffix:k,textBeforeInput:y,textAfterInput:C})=>{const w=F=>F.target.blur(),A=i==="number"||v!==void 0||b!==void 0,P=F=>{ts(F,i,v,b)},z=F=>{const E=F.currentTarget.value;if(A&&E!==""){const H=parseFloat(E);if(isNaN(H)&&E!=="-"&&E!=="."||!isNaN(H)&&(v!==void 0&&H<v||b!==void 0&&H>b))return}g?.(E)};return e.jsxs("div",{className:l("dial-input-field flex flex-row items-center justify-between py-2",n?"dial-input-no-border":"dial-input",j&&"dial-input-error",x&&"dial-input-disable",p&&"dial-input-readonly",!y&&"pl-3",!C&&"pr-3",u),children:[y&&e.jsx("div",{children:e.jsx(U,{hideBorder:!0,containerCssClass:"rounded-r-none border-r-0",cssClass:"overflow-hidden overflow-ellipsis dial-small",value:y,disabled:!0,elementId:y+"textBefore"})}),D&&e.jsxs("p",{className:"text-secondary dial-small",children:[" ",D]}),e.jsx(R,{icon:s}),e.jsx(O,{tooltip:r,triggerClassName:l(d,"flex-1"),children:e.jsx("input",{type:i,autoComplete:"off",id:a,placeholder:o,value:r??"",disabled:x,className:l("border-0 bg-transparent",c),onChange:F=>!p&&z?.(F),onKeyDown:P,onWheel:w,min:v,max:b})}),e.jsx(R,{icon:t}),k&&e.jsxs("p",{className:"text-secondary dial-small",children:[" ",k]}),C&&e.jsx("div",{children:e.jsx(U,{hideBorder:!0,containerCssClass:"rounded-l-none border-l-0",value:C,disabled:!0,elementId:C+"textAfter"})})]})},ns=/^0+\.(\d+)?$/,rs=/^0+/,ue=({fieldTitle:s,errorText:t,optional:n,elementCssClass:r,elementContainerCssClass:a,elementId:o,containerCssClass:c,readonly:u,defaultEmptyText:d,min:i,max:x,...p})=>e.jsxs("div",{className:l("flex flex-col",c),children:[e.jsx(W,{fieldTitle:s,optional:n,htmlFor:o}),u?e.jsx("span",{children:p.value||(d??"None")}):e.jsxs(e.Fragment,{children:[e.jsx(U,{elementId:o,cssClass:r,containerCssClass:a,invalid:t!=null,min:i,max:x,...p}),e.jsx($,{errorText:t})]})]}),as=({onChange:s,value:t,min:n,max:r,...a})=>{const o=c=>String(c)?.match(ns)?String(c)?.replace(rs,"0"):Number(c);return e.jsx(ue,{type:"number",onChange:c=>s?.(o(c)),value:t,min:n,max:r,...a})},os=({onChange:s,...t})=>e.jsx(ue,{type:"text",onChange:n=>s?.(n),...t}),ls=({fieldTitle:s,optional:t,elementId:n,elementCssClass:r,errorText:a,...o})=>e.jsxs("div",{className:"flex flex-col",children:[e.jsx(W,{fieldTitle:s,optional:t,htmlFor:n}),e.jsx(de,{textareaId:n,cssClass:r,...o}),e.jsx($,{errorText:a})]}),is=({title:s,switchId:t,isOn:n=!1,disabled:r,onChange:a})=>{const o=l("flex w-[36px] h-[18px] cursor-pointer items-center gap-1 rounded-full p-0.5 transition-all duration-200",n?"flex-row-reverse":"flex-row",r?"pointer-events-none":"",r?n?"bg-controls-disable":"bg-layer-4":n?"bg-accent-primary":"bg-layer-4"),c=f.useCallback(u=>{u.stopPropagation(),a?.(!n)},[a,n]);return e.jsxs("div",{className:"flex flex-row items-center",children:[e.jsx("input",{type:"checkbox",onChange:c,id:t,disabled:r,className:"invisible w-0 h-0",checked:n}),e.jsx("label",{htmlFor:t,className:o,children:e.jsx("span",{className:l("size-3 rounded-full",r?n?"bg-layer-4":"bg-controls-disable":"bg-controls-enable-primary")})}),s&&e.jsx("span",{className:"pl-2 dial-small text-primary",children:s})]})};var B=(s=>(s.Sm="sm",s.Md="md",s.Lg="lg",s))(B||{});const cs="z-[52] flex items-center justify-center bg-blackout md:p-4",ds="divide-tertiary divide-y",us="flex flex-row justify-between py-4 px-6 items-center",xs={[B.Sm]:"dial-sm-popup",[B.Md]:"dial-md-popup",[B.Lg]:"dial-lg-popup"},ee=({open:s=!1,title:t,portalId:n,cssClass:r,overlayClass:a,headingClass:o,dividers:c=!0,children:u,footer:d,onClose:i,size:x=B.Md})=>{const{refs:p,context:j}=h.useFloating({open:s,onOpenChange:y=>{y||i?.(null)}}),g=h.useRole(j,{role:"dialog"}),v=h.useDismiss(j,{outsidePress:!0}),{getFloatingProps:b}=h.useInteractions([g,v]);if(!s)return null;const D=typeof t=="string"?"dial-popup-heading":void 0,k=y=>y?typeof y=="string"?e.jsx("h3",{id:D,className:l("flex-1 min-w-0 mr-3 truncate dial-h3 text-primary",o),children:e.jsx(O,{tooltip:y,children:y})}):y:e.jsx("span",{});return e.jsx(h.FloatingPortal,{id:n,children:e.jsx(h.FloatingOverlay,{className:l(cs,a),children:e.jsx(h.FloatingFocusManager,{context:j,children:e.jsxs("div",{ref:p.setFloating,...b(),role:"dialog","aria-modal":"true","aria-labelledby":D,className:l("dial-popup",xs[x],c&&ds,r),children:[e.jsxs("div",{className:us,children:[k(t),e.jsx(J,{ariaLabel:"Close dialog",onClose:y=>i?.(y)})]}),e.jsx("div",{className:"flex-grow overflow-auto",children:u}),d]})})})})};var X=(s=>(s.Info="info",s.Danger="danger",s))(X||{});const ps="flex justify-end gap-2 px-6 py-4",fs="text-secondary dial-small-150 px-6 py-4",ms="Cancel",te={[X.Info]:{confirmVariant:I.Primary,cancelVariant:I.Secondary},[X.Danger]:{container:"border-t-4 border-error",confirmVariant:I.Danger,cancelVariant:I.Secondary}},hs=({title:s,description:t,descriptionCssClass:n,open:r=!1,confirmLabel:a,cancelLabel:o=ms,isLoading:c=!1,disableConfirmButton:u=!1,cssClass:d,confirmClassName:i,onClose:x,onConfirm:p,onCancel:j,children:g,dividers:v=!1,variant:b=X.Info,size:D=B.Sm})=>{const k=c?null:e.jsxs("div",{className:ps,children:[e.jsx(M,{variant:I.Secondary,title:o,onClick:()=>j?j():x?.()}),e.jsx(M,{variant:te[b].confirmVariant,cssClass:i,title:a,disable:u,onClick:()=>p()})]}),y=f.useCallback(()=>c?e.jsx("div",{className:"px-6 py-4 h-[120px]",children:e.jsx(re,{size:50})}):g??(t?e.jsx("div",{className:l(fs,n),children:t}):null),[g,t,c,n]);return e.jsx(ee,{open:r,title:s,cssClass:l(te[b].container,d),dividers:v,onClose:()=>x?.(),footer:k,size:D,children:y()})},se=({selectedItems:s,listCssClass:t,listElementCssClass:n})=>!!s?.length&&e.jsx("ul",{className:l("flex-row items-center truncate flex-wrap","flex gap-x-2 gap-y-1",t),children:s?.map(r=>e.jsx("li",{className:l(["tiny bg-layer-3 rounded p-1 border border-primary max-w-[200px] truncate",n]),children:e.jsx(O,{tooltip:r,children:e.jsx("button",{"aria-label":"autocomplete-action",type:"button",className:"truncate w-full",children:r})})},r))}),ne=s=>L.createElement("svg",{width:18,height:18,viewBox:"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg",...s},L.createElement("path",{d:"M2.25 13.5V12C2.25 11.5858 2.58579 11.25 3 11.25C3.41421 11.25 3.75 11.5858 3.75 12V13.5C3.75 13.6989 3.82907 13.8896 3.96973 14.0303C4.11038 14.1709 4.30109 14.25 4.5 14.25H6C6.41421 14.25 6.75 14.5858 6.75 15C6.75 15.4142 6.41421 15.75 6 15.75H4.5C3.90326 15.75 3.33114 15.5128 2.90918 15.0908C2.48722 14.6689 2.25 14.0967 2.25 13.5ZM14.25 6V4.5C14.25 4.30109 14.1709 4.11038 14.0303 3.96973C13.8896 3.82907 13.6989 3.75 13.5 3.75H12C11.5858 3.75 11.25 3.41421 11.25 3C11.25 2.58579 11.5858 2.25 12 2.25H13.5C14.0967 2.25 14.6689 2.48722 15.0908 2.90918C15.5128 3.33114 15.75 3.90326 15.75 4.5V6C15.75 6.41421 15.4142 6.75 15 6.75C14.5858 6.75 14.25 6.41421 14.25 6Z",fill:"currentColor"})),xe=({children:s,open:t,readonly:n,selectedValue:r,valueCssClasses:a,inputCssClasses:o,onOpen:c,elementId:u,errorText:d,emptyValueText:i})=>{const x=Array.isArray(r)&&r.length>0,p=typeof r=="string"&&!!r.trim(),j=x||p?r:i,g=n?void 0:c,v=()=>e.jsxs(e.Fragment,{children:[e.jsx("button",{type:"button",className:"w-full",onClick:g,"aria-label":"open-popup",id:u,children:e.jsxs("div",{className:l("dial-input px-3 py-2 dial-input-field flex flex-row items-center w-full justify-between",o,n&&"dial-input-disable",d&&"dial-input-error"),children:[e.jsx(O,{tooltip:String(j),children:e.jsx("span",{className:a,children:j})}),!n&&e.jsx("div",{className:"flex-shrink-0",children:e.jsx(R,{icon:e.jsx(ne,{role:"img",width:_,height:_})})})]})}),d&&e.jsx($,{errorText:d})]}),b=()=>e.jsx("div",{className:"w-full",onClick:g,children:e.jsxs("div",{className:l("dial-input px-3 py-2 flex flex-row items-center w-full justify-between",n&&"dial-input-disable"),children:[e.jsx(se,{selectedItems:j}),!n&&e.jsx("div",{className:"ml-1",children:e.jsx(R,{icon:e.jsx(ne,{role:"img",width:_,height:_})})})]})});return e.jsxs(e.Fragment,{children:[x?b():v(),t&&ke.createPortal(s,document.body)]})},gs=({fieldTitle:s,htmlFor:t,readonly:n,selectedValue:r,radioButtons:a,customInputValue:o,valueCssClasses:c,inputCssClasses:u,emptyValueText:d,onClose:i,title:x,portalId:p,onApply:j,cancelButtonTitle:g="Cancel",applyButtonTitle:v="Apply",isValid:b,selectedRadioValue:D,onChangeRadioField:k,id:y})=>{const[C,w]=f.useState(!1),A=f.useCallback(()=>{n||w(!0)},[n]),P=f.useCallback(()=>{w(!1),i?.()},[i]),z=f.useCallback(()=>{j(),P()},[j,P]);return e.jsxs("div",{className:"flex flex-col",children:[e.jsx(W,{fieldTitle:s,htmlFor:t}),e.jsx(xe,{readonly:n,open:C,selectedValue:o??a.find(F=>F.id===r)?.name,valueCssClasses:c,inputCssClasses:l(u,"py-2","px-3"),emptyValueText:d,onOpen:A,children:e.jsx(ee,{open:C,onClose:P,title:x,portalId:p,footer:e.jsxs("div",{className:"flex flex-row items-center justify-end gap-2 px-6 py-4",children:[e.jsx(M,{variant:I.Secondary,title:g,onClick:P}),e.jsx(M,{variant:I.Primary,title:v,onClick:z,disable:!b})]}),children:e.jsx("div",{className:"px-6 py-4",children:e.jsx(ie,{radioButtons:a,labelCssClass:"dial-small",activeRadioButton:D,onChange:k,elementId:y,orientation:K.Column})})})})]})},js=({onClick:s})=>e.jsx(N.IconEyeOff,{...G,className:"text-primary",onClick:s}),Cs=({onClick:s})=>e.jsx(N.IconEye,{...G,className:"text-primary",onClick:s}),pe=({...s})=>{const[t,n]=f.useState(!1),r=f.useCallback(a=>{n(a)},[]);return e.jsx(U,{type:t?"text":"password",...s,iconAfter:t?e.jsx(js,{onClick:()=>r(!1)}):e.jsx(Cs,{onClick:()=>r(!0)})})},bs=({fieldTitle:s,optional:t,elementCssClass:n,elementId:r,errorText:a,...o})=>e.jsxs("div",{className:"flex flex-col",children:[e.jsx(W,{fieldTitle:s,optional:t,htmlFor:r}),e.jsx(pe,{cssClass:n,elementId:r,invalid:!!a,...o}),e.jsx($,{errorText:a})]});var Z=(s=>(s.Small="small",s.Base="base",s))(Z||{});const ys={[Z.Small]:{textClass:"text-xs px-1",containerClass:"px-[6px] py-1 h-[22px]",iconSize:10,iconStroke:1},[Z.Base]:{textClass:"text-sm px-2",containerClass:"px-3 py-2 h-[38px]",iconSize:18,iconStroke:1.5}},vs=({elementId:s,value:t,placeholder:n,disabled:r,readonly:a,invalid:o,cssClass:c,containerCssClass:u,onChange:d,size:i=Z.Base})=>{const[x,p]=f.useState(t||"");f.useEffect(()=>{p(t||"")},[t]);const j=f.useCallback(b=>{p(b),d?.(b)},[d]),g=ys[i],v=f.useCallback(()=>{j("")},[j]);return e.jsxs("div",{className:l("dial-input flex flex-row items-center justify-between",o&&"dial-input-error",r&&"dial-input-disable",a&&"dial-input-readonly",g.containerClass,u),children:[e.jsx(R,{className:l(r?"text-secondary":"text-primary"),icon:e.jsx(N.IconSearch,{size:g.iconSize,stroke:g.iconStroke})}),e.jsx("input",{id:s,type:"text",autoComplete:"off",placeholder:n,value:x??"",disabled:r,readOnly:a,className:l("border-0 bg-transparent w-full",c,g.textClass),onChange:b=>!a&&j(b.currentTarget.value)}),x&&!a&&!r&&e.jsx(R,{className:"text-primary cursor-pointer",icon:e.jsx(N.IconX,{size:g.iconSize,stroke:g.iconStroke,onClick:v,"aria-label":"Clear search",role:"button"})})]})},ws=({placeholder:s="",selectedItems:t=[],updateSelected:n,listCssClass:r,listElementCssClass:a,containerCssClass:o,inputCssClass:c})=>{const[u,d]=f.useState(""),i=f.useCallback(p=>{p.key==="Enter"&&(n([...t,p.currentTarget.value]),d("")),(p.key==="Backspace"||p.key==="Delete")&&t.length&&!u&&n(t.slice(0,-1))},[t,n,u]),x=f.useCallback(p=>{d(p.target.value)},[d]);return e.jsxs("div",{className:l(["dial-input px-3 py-2 flex flex-row items-center flex-wrap w-fit gap-2",o]),children:[e.jsx(se,{selectedItems:t,listCssClass:r,listElementCssClass:a}),e.jsx("input",{type:"text",value:u,className:l(["border-0 bg-transparent p-0",c]),placeholder:t?.length?"":s,onKeyDown:i,onChange:x})]})},Ns=({initialTags:s=[],fieldTitle:t,optional:n,elementId:r,placeholder:a,errorText:o,invalid:c,disabled:u,onChange:d})=>{const i=f.useRef(null),[x,p]=f.useState(s),[j,g]=f.useState(""),[v,b]=f.useState(!1),D=C=>{const w=C.trim().replace(/,$/,"");if(w&&!x.includes(w)){const A=[w,...x];p(A),d?.(A)}},k=C=>{(C.key===","||C.key==="Enter")&&(C.preventDefault(),D(j),g(""))},y=C=>{const w=x.filter((A,P)=>P!==C);p(w),d?.(w)};return f.useEffect(()=>{const C=new ResizeObserver(()=>{if(i.current){const w=i.current.scrollHeight>i.current.clientHeight+10;b(w)}});return i.current&&C.observe(i.current),()=>C.disconnect()},[x]),e.jsxs("div",{className:l("flex flex-col w-full"),children:[e.jsx(W,{fieldTitle:t,optional:n,htmlFor:r}),e.jsx("div",{className:l("dial-input min-h-[38px] p-[6px]",c&&"dial-input-error",u&&"dial-input-disable"),children:e.jsxs("div",{ref:i,className:l("flex flex-wrap gap-2 items-center",v?"flex-col-reverse":"flex-row"),children:[x.map((C,w)=>e.jsx(ce,{tag:C,remove:u?void 0:()=>y(w)},C+w)),e.jsx("input",{type:"text",value:j,onChange:C=>g(C.target.value),onKeyDown:k,className:l("dial-input-no-border outline-none border-none w-full min-w-[100px] flex-1 p-1"),placeholder:a,disabled:u})]})}),e.jsx($,{errorText:o})]})};var fe=(s=>(s.Dropdown="dropdown",s.Menu="menu",s))(fe||{}),q=(s=>(s.Click="click",s.Hover="hover",s.ContextMenu="contextMenu",s))(q||{}),me=(s=>(s.Item="item",s.Divider="divider",s))(me||{});const ks=l("inline-flex items-center gap-2 align-middle","h-auto px-0 bg-transparent border-0"),Ds=l("z-[53] overflow-auto rounded bg-layer-0 text-primary shadow focus-visible:outline-none","w-max"),Is=l("flex w-full cursor-pointer items-center gap-3","focus-visible:border-none focus-visible:outline-none","hover:bg-accent-primary-alpha px-3","dial-small h-[34px] rounded text-primary"),Ss="opacity-75 !cursor-not-allowed",Rs="text-error",Fs="my-1 border-t border-hover",Q=8,Es=({children:s,menu:t,renderOverlay:n,trigger:r=[q.Click],placement:a,disabled:o=!1,open:c,defaultOpen:u=!1,onOpenChange:d,closable:i=!1,onClose:x,cssClass:p,listClassName:j,outsidePressIgnoreRef:g,outsideClosable:v=!0})=>{const[b,D]=f.useState(u),k=c!==void 0,y=k?!!c:b,C=f.useCallback(m=>{k||D(m),d?.(m)},[k,d]),w=f.useId(),A=m=>m?"clientWidth"in m?m.clientWidth:m.getBoundingClientRect?.()?.width??0:0,P=a===void 0,{refs:z,floatingStyles:F,context:E}=h.useFloating({placement:a,open:y,onOpenChange:C,whileElementsMounted:h.autoUpdate,middleware:[h.offset({mainAxis:Q,crossAxis:0}),P?h.autoPlacement({alignment:"start",crossAxis:!0,padding:Q}):h.flip({padding:Q}),h.shift({padding:Q}),h.size({apply({availableWidth:m,elements:T}){const Ne=A(T.reference);T.floating.style.setProperty("--reference-width",`${Ne}px`),T.floating.style.maxWidth=`${m}px`}})]}),H=h.useClick(E,{enabled:r.includes(q.Click)&&!o}),he=h.useHover(E,{enabled:r.includes(q.Hover)&&!o,move:!1,restMs:40,delay:{open:80,close:80}}),ge=h.useDismiss(E,{bubbles:!0,referencePress:!1,outsidePress:m=>{if(!v)return!1;const T=m.target;return!(g?.current&&T instanceof Node&&g.current.contains(T))}}),je=h.useRole(E,{role:"menu"}),{getReferenceProps:Ce,getFloatingProps:be}=h.useInteractions([H,he,ge,je]),ye=m=>{!r.includes(q.ContextMenu)||o||(m.preventDefault(),C(!0))};f.useEffect(()=>{o&&y&&C(!1)},[o,y,C]);const ve=m=>T=>{m.disabled||(m.onClick?.({key:m.key,domEvent:T}),t?.onClick?.({key:m.key,domEvent:T}),C(!1))},we=n?n():t&&e.jsx("div",{role:"none",className:"py-1",children:t.items.map(m=>m.type===me.Divider?e.jsx("div",{role:"separator",className:Fs},m.key):e.jsxs("button",{role:"menuitem",type:"button","aria-disabled":!!m.disabled,className:l(Is,m.disabled&&Ss,m.danger&&Rs),disabled:m.disabled,onClick:ve(m),children:[m.icon&&e.jsx("span",{className:l(m.danger&&"text-error",m.disabled&&"text-secondary"),children:e.jsx(R,{icon:m.icon})}),e.jsx("span",{className:l("flex-1 truncate text-left",m.danger&&"text-error",m.disabled&&"text-secondary"),children:m.label})]},m.key))});return e.jsxs(e.Fragment,{children:[e.jsx("span",{ref:z.setReference,className:l(ks,o&&"!cursor-not-allowed opacity-75",p),"aria-haspopup":"menu","aria-expanded":y,"aria-controls":w,onContextMenu:ye,...Ce(),children:s}),y&&e.jsx(h.FloatingPortal,{children:e.jsx(h.FloatingFocusManager,{context:E,modal:!1,initialFocus:-1,returnFocus:!0,children:e.jsxs("div",{id:w,ref:z.setFloating,style:F,className:l(Ds,j),...be(),children:[i&&e.jsx("div",{className:"flex items-center justify-between px-2 pt-2",children:e.jsx(J,{ariaLabel:"Close dropdown",onClose:m=>{x?.(m),C(!1)}})}),we]})})})]})};exports.AlertVariant=V;exports.ButtonVariant=I;exports.ConfirmationPopupVariant=X;exports.DialAlert=Ee;exports.DialAutocompleteInput=ws;exports.DialAutocompleteInputValue=se;exports.DialButton=M;exports.DialCheckbox=ze;exports.DialCloseButton=J;exports.DialCollapsibleSidebar=Ye;exports.DialConfirmationPopup=hs;exports.DialDropdown=Es;exports.DialErrorText=$;exports.DialFieldLabel=W;exports.DialIcon=R;exports.DialInput=U;exports.DialInputPopup=xe;exports.DialLabelledText=Je;exports.DialLoader=re;exports.DialNoDataContent=Ze;exports.DialNumberInputField=as;exports.DialPasswordInput=pe;exports.DialPasswordInputField=bs;exports.DialPopup=ee;exports.DialRadioButton=le;exports.DialRadioGroup=ie;exports.DialRadioGroupPopupField=gs;exports.DialSearch=vs;exports.DialSteps=$e;exports.DialSwitch=is;exports.DialTag=ce;exports.DialTagInput=Ns;exports.DialTextAreaField=ls;exports.DialTextInputField=os;exports.DialTextarea=de;exports.DialTooltip=O;exports.DropdownType=fe;exports.PopupSize=B;exports.RadioGroupOrientation=K;exports.SearchSize=Z;exports.StepStatus=S;exports.TagVariant=Y;
|
package/dist/dial-ui-kit.es.js
CHANGED
|
@@ -588,7 +588,7 @@ const Fr = {
|
|
|
588
588
|
variant: s = oe.Default
|
|
589
589
|
}) => {
|
|
590
590
|
const a = Fr[s], o = l(
|
|
591
|
-
"flex items-center gap-1 tiny border rounded p-1 h-[22px] text-primary",
|
|
591
|
+
"flex items-center gap-1 dial-tiny border rounded p-1 h-[22px] text-primary",
|
|
592
592
|
n,
|
|
593
593
|
a
|
|
594
594
|
);
|