design-guidelines/assets/NielsenHeuristics-d7HCIgJi.js

import{A as u,j as e,r as f,R as k}from"./index-mUEXKEer.js";const $=({status:a,message:d,symbolName:m="osiadan",showProgress:l=!1,progress:n=0,className:s=""})=>{const r={idle:{color:"var(--muted-foreground)",bg:"var(--muted)",icon:m,defaultMessage:"Ready"},loading:{color:"var(--primary)",bg:"var(--accent)",icon:"nkyinkyim",defaultMessage:"Processing...",animate:!0},success:{color:"var(--success)",bg:"rgba(0, 107, 63, 0.1)",icon:"dwennimmen",defaultMessage:"Success!"},error:{color:"var(--destructive)",bg:"rgba(212, 24, 61, 0.1)",icon:"fihankra",defaultMessage:"Error occurred"},warning:{color:"var(--warning)",bg:"rgba(255, 158, 27, 0.1)",icon:"mpatapo",defaultMessage:"Warning"}}[a],i=u[r.icon].component;return e.jsxs("div",{className:`p-4 rounded-lg flex items-center gap-3 transition-all ${s}`,style:{backgroundColor:r.bg},role:"status","aria-live":"polite",children:[e.jsx(i,{size:24,color:r.color,className:r.hasOwnProperty("animate")?"animate-pulse":""}),e.jsxs("div",{className:"flex-1",children:[e.jsx("p",{style:{color:r.color},className:"font-[weight:var(--font-weight-medium)]",children:d||r.defaultMessage}),l&&a==="loading"&&e.jsx("div",{className:"mt-2 h-2 bg-border rounded-full overflow-hidden",children:e.jsx("div",{className:"h-full bg-primary transition-all duration-300",style:{width:`${n}%`},role:"progressbar","aria-valuenow":n,"aria-valuemin":0,"aria-valuemax":100})})]})]})},z=({title:a,description:d,actionLabel:m,symbolName:l,onAction:n,secondaryActionLabel:s,onSecondaryAction:t,disabled:r=!1,className:i=""})=>{const o=u[l].component,c=u[l];return e.jsxs("div",{className:`bg-card p-6 rounded-xl border border-border ${i}`,children:[e.jsxs("div",{className:"flex items-start gap-4 mb-4",children:[e.jsx("div",{className:"flex-shrink-0",children:e.jsx(o,{size:48,color:"var(--primary)"})}),e.jsxs("div",{className:"flex-1",children:[e.jsx("h4",{className:"mb-2",children:a}),e.jsx("p",{className:"text-muted-foreground text-sm mb-1",children:d}),e.jsxs("p",{className:"text-sm text-muted-foreground italic",children:[c.name,": ",c.meaning]})]})]}),e.jsxs("div",{className:"flex gap-3",children:[e.jsx("button",{onClick:n,disabled:r,className:"flex-1 bg-primary text-primary-foreground px-4 py-2 rounded-lg hover:bg-primary-hover disabled:opacity-50 disabled:cursor-not-allowed transition-colors",children:m}),s&&t&&e.jsx("button",{onClick:t,disabled:r,className:"px-4 py-2 bg-secondary text-secondary-foreground rounded-lg hover:bg-secondary-hover disabled:opacity-50 disabled:cursor-not-allowed transition-colors",children:s})]})]})},L=({actionLabel:a,onConfirm:d,onCancel:m,confirmMessage:l,showUndo:n=!0,undoTimeoutMs:s=5e3,symbolName:t="nkyinkyim",variant:r="primary",className:i=""})=>{const[o,c]=f.useState("ready"),[g,h]=f.useState(s/1e3),x=u[t].component;f.useEffect(()=>{if(o==="completed"&&n){const p=setInterval(()=>{h(S=>S<=.1?(clearInterval(p),0):S-.1)},100),j=setTimeout(()=>{c("ready"),h(s/1e3)},s);return()=>{clearInterval(p),clearTimeout(j)}}},[o,n,s]);const y=()=>{n?(c("completed"),d()):c("confirming")},N=()=>{c("completed"),d()},w=()=>{c("ready"),m&&m()},v=()=>{c("ready"),h(s/1e3),m&&m()},b={primary:"bg-primary text-primary-foreground hover:bg-primary-hover",destructive:"bg-destructive text-destructive-foreground hover:opacity-90",warning:"bg-warning text-warning-foreground hover:opacity-90"};return o==="completed"&&n?e.jsxs("div",{className:`bg-success/10 p-4 rounded-lg flex items-center justify-between ${i}`,children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx(x,{size:24,color:"var(--success)"}),e.jsxs("div",{children:[e.jsx("p",{className:"text-success font-[weight:var(--font-weight-medium)]",children:l}),e.jsxs("p",{className:"text-sm text-muted-foreground",children:["Reverting in ",Math.ceil(g),"s"]})]})]}),e.jsx("button",{onClick:v,className:"px-4 py-2 bg-secondary text-secondary-foreground rounded-lg hover:bg-secondary-hover transition-colors",children:"Undo"})]}):o==="confirming"?e.jsxs("div",{className:`bg-card p-4 rounded-lg border-2 border-warning ${i}`,children:[e.jsx("p",{className:"text-warning font-[weight:var(--font-weight-medium)] mb-3",children:"Are you sure you want to proceed?"}),e.jsxs("div",{className:"flex gap-3",children:[e.jsx("button",{onClick:N,className:`flex-1 px-4 py-2 rounded-lg transition-colors ${b[r]}`,children:"Yes, Continue"}),e.jsx("button",{onClick:w,className:"px-4 py-2 bg-secondary text-secondary-foreground rounded-lg hover:bg-secondary-hover transition-colors",children:"Cancel"})]})]}):e.jsxs("button",{onClick:y,className:`px-6 py-3 rounded-lg transition-colors flex items-center gap-2 ${b[r]} ${i}`,children:[e.jsx(x,{size:24,color:"currentColor"}),e.jsx("span",{children:a})]})},E=({children:a,variant:d="primary",size:m="md",symbolName:l,symbolPosition:n="left",onClick:s,disabled:t=!1,loading:r=!1,fullWidth:i=!1,className:o=""})=>{const c=l?u[l].component:null,g={primary:"bg-primary text-primary-foreground hover:bg-primary-hover",secondary:"bg-secondary text-secondary-foreground hover:bg-secondary-hover",success:"bg-success text-success-foreground hover:opacity-90",warning:"bg-warning text-warning-foreground hover:opacity-90",destructive:"bg-destructive text-destructive-foreground hover:opacity-90",ghost:"bg-transparent text-foreground hover:bg-accent"},x={sm:{padding:"px-3 py-1.5",text:"text-sm",iconSize:16},md:{padding:"px-6 py-3",text:"text-base",iconSize:20},lg:{padding:"px-8 py-4",text:"text-lg",iconSize:24}}[m],y=u.nkyinkyim.component;return e.jsx("button",{onClick:s,disabled:t||r,className:`
        ${g[d]}
        ${x.padding}
        ${x.text}
        ${i?"w-full":""}
        rounded-lg
        font-[weight:var(--font-weight-semibold)]
        transition-all
        flex items-center justify-center gap-2
        disabled:opacity-50 disabled:cursor-not-allowed
        ${o}
      `,"aria-busy":r,children:r?e.jsxs(e.Fragment,{children:[e.jsx(y,{size:x.iconSize,color:"currentColor",className:"animate-pulse"}),e.jsx("span",{children:"Loading..."})]}):e.jsxs(e.Fragment,{children:[c&&n==="left"&&e.jsx(c,{size:x.iconSize,color:"currentColor"}),e.jsx("span",{children:a}),c&&n==="right"&&e.jsx(c,{size:x.iconSize,color:"currentColor"})]})})},M=({label:a,value:d,onChange:m,placeholder:l,helpText:n,validation:s,showCharCount:t=!1,symbolName:r="nyansapo",className:i=""})=>{const[o,c]=f.useState(null),[g,h]=f.useState(!1),x=u[r].component,y=p=>s?s.required&&!p.trim()?"This field is required":s.minLength&&p.length<s.minLength?`Minimum ${s.minLength} characters required`:s.maxLength&&p.length>s.maxLength?`Maximum ${s.maxLength} characters allowed`:s.pattern&&!s.pattern.test(p)?"Invalid format":s.custom?s.custom(p):null:null,N=p=>{const j=p.target.value;m(j),g&&c(y(j))},w=()=>{h(!0),c(y(d))},v=!o&&g&&d,b=o&&g;return e.jsxs("div",{className:`space-y-2 ${i}`,children:[e.jsxs("label",{className:"flex items-center gap-2 font-[weight:var(--font-weight-medium)]",children:[e.jsx(x,{size:20,color:"var(--foreground)"}),e.jsx("span",{children:a}),s?.required&&e.jsx("span",{className:"text-destructive",children:"*"})]}),e.jsxs("div",{className:"relative",children:[e.jsx("input",{type:"text",value:d,onChange:N,onBlur:w,placeholder:l,className:`
            w-full px-4 py-3 rounded-lg
            bg-input-background border-2
            transition-colors
            focus:outline-none focus:ring-2 focus:ring-ring
            ${b?"border-destructive":v?"border-success":"border-border"}
          `,"aria-invalid":b?"true":"false","aria-describedby":`${a}-help ${a}-error`}),v&&e.jsx("div",{className:"absolute right-3 top-1/2 -translate-y-1/2",children:k.createElement(u.dwennimmen.component,{size:20,color:"var(--success)"})})]}),e.jsxs("div",{className:"flex justify-between items-start gap-2",children:[e.jsxs("div",{className:"flex-1",children:[n&&!b&&e.jsx("p",{id:`${a}-help`,className:"text-sm text-muted-foreground",children:n}),b&&e.jsx("p",{id:`${a}-error`,className:"text-sm text-destructive",role:"alert",children:o})]}),t&&s?.maxLength&&e.jsxs("p",{className:"text-sm text-muted-foreground",children:[d.length,"/",s.maxLength]})]})]})},A=({content:a,symbolName:d,children:m,position:l="top",className:n=""})=>{const[s,t]=f.useState(!1),r=d?u[d].component:null,i={top:"bottom-full left-1/2 -translate-x-1/2 mb-2",bottom:"top-full left-1/2 -translate-x-1/2 mt-2",left:"right-full top-1/2 -translate-y-1/2 mr-2",right:"left-full top-1/2 -translate-y-1/2 ml-2"};return e.jsxs("div",{className:`relative inline-block ${n}`,onMouseEnter:()=>t(!0),onMouseLeave:()=>t(!1),onFocus:()=>t(!0),onBlur:()=>t(!1),children:[m,s&&e.jsx("div",{className:`
            absolute ${i[l]}
            bg-popover text-popover-foreground
            px-3 py-2 rounded-lg
            text-sm
            shadow-lg border border-border
            z-50
            whitespace-nowrap
            animate-fade-in
          `,role:"tooltip",children:e.jsxs("div",{className:"flex items-center gap-2",children:[r&&e.jsx(r,{size:16,color:"currentColor"}),e.jsx("span",{children:a})]})})]})},I=({actions:a,trigger:d,className:m="",alignment:l="left"})=>{const[n,s]=f.useState(!1);return f.useEffect(()=>{const t=r=>{a.forEach(i=>{if(i.shortcut){const o=i.shortcut.toLowerCase().split("+"),c=o.includes("ctrl")&&(r.ctrlKey||r.metaKey),g=o.includes("shift")&&r.shiftKey,h=o.includes("alt")&&r.altKey,x=o[o.length-1];r.key.toLowerCase()===x&&(!o.includes("ctrl")||c)&&(!o.includes("shift")||g)&&(!o.includes("alt")||h)&&(r.preventDefault(),i.onClick(),s(!1))}})};return window.addEventListener("keydown",t),()=>window.removeEventListener("keydown",t)},[a]),e.jsxs("div",{className:`relative ${m}`,children:[e.jsx("div",{onClick:()=>s(!n),children:d||e.jsx("button",{className:"px-4 py-2 bg-secondary text-secondary-foreground rounded-lg hover:bg-secondary-hover",children:"Quick Actions"})}),n&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"fixed inset-0 z-40",onClick:()=>s(!1)}),e.jsx("div",{className:`absolute top-full mt-2 ${l==="left"?"left-0":"right-0"} bg-popover border border-border rounded-lg shadow-xl z-50 min-w-[300px]`,children:a.map((t,r)=>{const i=u[t.symbolName].component;return e.jsxs("button",{onClick:()=>{t.onClick(),s(!1)},className:"w-full px-4 py-3 flex items-center gap-3 hover:bg-accent transition-colors text-left first:rounded-t-lg last:rounded-b-lg",children:[e.jsx(i,{size:20,color:"var(--primary)"}),e.jsxs("div",{className:"flex-1",children:[e.jsx("div",{className:"font-[weight:var(--font-weight-medium)]",children:t.label}),t.description&&e.jsx("div",{className:"text-sm text-muted-foreground",children:t.description})]}),t.shortcut&&e.jsx("kbd",{className:"px-2 py-1 bg-muted rounded text-sm font-mono",children:t.shortcut})]},r)})})]})]})},R=({title:a,value:d,symbolName:m,trend:l,onClick:n,className:s=""})=>{const t=u[m].component;return e.jsxs("div",{onClick:n,className:`
        bg-card p-6 rounded-xl border border-border
        ${n?"cursor-pointer hover:shadow-lg hover:scale-105":""}
        transition-all
        ${s}
      `,children:[e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsx(t,{size:32,color:"var(--primary)"}),l&&e.jsxs("div",{className:`font-[weight:var(--font-weight-semibold)] ${l.isPositive?"text-success":"text-destructive"}`,children:[l.isPositive?"↑":"↓"," ",Math.abs(l.value),"%"]})]}),e.jsx("div",{className:"text-[length:var(--text-2xl)] font-[weight:var(--font-weight-bold)] mb-1",children:d}),e.jsx("div",{className:"text-muted-foreground text-sm",children:a})]})},K=({title:a,message:d,technicalDetails:m,onRetry:l,onSupport:n,onDismiss:s,showTechnicalDetails:t=!1,className:r=""})=>{const[i,o]=f.useState(!1),c=u.mpatapo.component,g=u.nkyinkyim.component,h=u.nkonsonkonson.component;return e.jsxs("div",{className:`bg-destructive/10 border-2 border-destructive rounded-xl p-6 ${r}`,role:"alert",children:[e.jsxs("div",{className:"flex items-start gap-4 mb-4",children:[e.jsx(c,{size:32,color:"var(--destructive)"}),e.jsxs("div",{className:"flex-1",children:[e.jsx("h4",{className:"text-destructive mb-2",children:a}),e.jsx("p",{className:"text-foreground mb-3",children:d}),t&&m&&e.jsxs("div",{className:"mt-3",children:[e.jsxs("button",{onClick:()=>o(!i),className:"text-sm text-muted-foreground hover:text-foreground transition-colors underline",children:[i?"Hide":"Show"," technical details"]}),i&&e.jsx("pre",{className:"mt-2 p-3 bg-muted rounded text-sm overflow-x-auto",children:m})]})]})]}),e.jsxs("div",{className:"flex flex-wrap gap-3",children:[l&&e.jsxs("button",{onClick:l,className:"px-4 py-2 bg-primary text-primary-foreground rounded-lg hover:bg-primary-hover transition-colors flex items-center gap-2",children:[e.jsx(g,{size:20,color:"currentColor"}),e.jsx("span",{children:"Try Again"})]}),n&&e.jsxs("button",{onClick:n,className:"px-4 py-2 bg-secondary text-secondary-foreground rounded-lg hover:bg-secondary-hover transition-colors flex items-center gap-2",children:[e.jsx(h,{size:20,color:"currentColor"}),e.jsx("span",{children:"Contact Support"})]}),s&&e.jsx("button",{onClick:s,className:"px-4 py-2 bg-transparent text-muted-foreground rounded-lg hover:bg-muted transition-colors",children:"Dismiss"})]})]})},V=({title:a,content:d,learnMoreUrl:m,symbolName:l="nyansapo",steps:n,tips:s,className:t=""})=>{const r=u[l].component,i=u[l];return e.jsxs("div",{className:`bg-accent/50 border border-accent rounded-xl p-6 ${t}`,children:[e.jsxs("div",{className:"flex items-start gap-4 mb-4",children:[e.jsx(r,{size:40,color:"var(--primary)"}),e.jsxs("div",{className:"flex-1",children:[e.jsx("h4",{className:"mb-2",children:a}),e.jsxs("p",{className:"text-sm text-muted-foreground italic mb-3",children:[i.name,": ",i.meaning]}),e.jsx("p",{className:"text-foreground",children:d})]})]}),n&&n.length>0&&e.jsxs("div",{className:"mt-4",children:[e.jsx("h6",{className:"mb-2",children:"Steps:"}),e.jsx("ol",{className:"space-y-2 list-decimal list-inside",children:n.map((o,c)=>e.jsx("li",{className:"text-sm text-foreground",children:o},c))})]}),s&&s.length>0&&e.jsxs("div",{className:"mt-4",children:[e.jsx("h6",{className:"mb-2",children:"Tips:"}),e.jsx("ul",{className:"space-y-2",children:s.map((o,c)=>e.jsxs("li",{className:"text-sm text-muted-foreground flex items-start gap-2",children:[e.jsx("span",{className:"text-success",children:"•"}),e.jsx("span",{children:o})]},c))})]}),m&&e.jsxs("a",{href:"#",target:"_blank",rel:"noopener noreferrer",className:"inline-flex items-center gap-2 mt-4 text-primary hover:underline",children:[e.jsx("span",{children:"Learn more"}),e.jsx("span",{children:"→"})]})]})};export{z as A,E as C,K as E,R as M,I as Q,$ as S,A as T,L as U,M as V,V as a};