@blakesteve/roster 5.6.0 → 5.8.0

package/dist/components/organisms/ModerationQueue/ModerationQueue.cjs

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),a=require("react"),P=require("../../../lib/utils.cjs"),ge=require("../../atoms/Button/Button.cjs"),Le=require("../../atoms/Card/Card.cjs"),Oe=require("../../atoms/Spinner/Spinner.cjs"),Pe=require("../../atoms/Textarea/Textarea.cjs"),Y=require("../../molecules/Alert/Alert.cjs"),ze=require("../../molecules/EmptyState/EmptyState.cjs"),De=require("../../molecules/RadioGroup/RadioGroup.cjs"),He=require("./queue-actions.cjs"),me={primary:{colorScheme:"primary",variant:"solid"},success:{colorScheme:"success",variant:"solid"},danger:{colorScheme:"error",variant:"soft"},neutral:{colorScheme:"neutral",variant:"outline"}},Ke={edit:He.editAction},R=c=>c.edit?c:null,Qe=c=>c===0?"None left.":`${c} left.`,Ge=c=>Math.min(6,Math.max(1,c)),We=c=>c instanceof Error&&c.message?c.message:"Something went wrong.";function B(c,d){const p={...c};return delete p[d],p}function Z({busy:c=!1,blocked:d=!1,onClick:p,children:j,className:v,...y}){return n.jsx(ge.Button,{size:"lg",...y,isLoading:c,"aria-disabled":d||void 0,className:P.cn(d&&!c&&"rst:cursor-not-allowed rst:opacity-50",v),onClick:g=>{if(d){g.preventDefault();return}p?.(g)},children:j})}function Je({label:c,hideLabel:d=!1,headingLevel:p=2,itemHeadingLevel:j,items:v,getKey:y,itemLabel:g,renderMeta:xe,renderContent:he,actions:z,status:_="ready",error:ve,onRetry:ee,empty:te={title:"Nothing waiting"},density:re="comfortable",footer:be,className:ye}){const Se=typeof z=="function"?z(Ke):z,N=a.useId(),q=a.useRef(null),k=v.map(y),T=a.useRef(new Map);T.current=new Map(v.map((e,t)=>[k[t],e]));const[D,je]=a.useState({}),$=a.useRef({}),ne=e=>{$.current=e($.current),je($.current)},[se,E]=a.useState({}),[oe,qe]=a.useState({}),x=a.useRef({}),h=(e,t)=>{x.current=t?{...x.current,[e]:t}:B(x.current,e),qe(x.current)},[H,ke]=a.useState({text:"",n:0}),K=a.useRef([]),w=a.useRef(null),ce=a.useCallback(e=>{K.current.push(e),!w.current&&(w.current=setTimeout(()=>{w.current=null;const t=K.current.join(" ");K.current=[],ke(r=>({text:t,n:r.n+1}))},0))},[]);a.useLayoutEffect(()=>()=>{w.current&&clearTimeout(w.current)},[]);const[$e,Re]=a.useState(0),Q=a.useRef(null),S=a.useCallback(e=>{Q.current=e,Re(t=>t+1)},[]),ie=a.useCallback(e=>{const t=q.current;if(!t)return null;const r="key"in e?CSS.escape(e.key):"";switch(e.kind){case"item":return t.querySelector(`[data-queue-item="${r}"]`);case"empty":return t.querySelector("[data-queue-empty]");case"trigger":return t.querySelector(`[data-queue-item="${r}"] [data-queue-action="${CSS.escape(e.actionId)}"]`);case"step":return t.querySelector(`[data-queue-item="${r}"] [data-queue-step]`)}},[]);a.useLayoutEffect(()=>{const e=Q.current;if(!e)return;Q.current=null,(ie(e)??q.current?.querySelector("[data-queue-item]")??q.current?.querySelector("[data-queue-empty]"))?.focus()},[$e,ie]);const G=a.useRef(null),Ne=e=>()=>{G.current=e},we=e=>{e.relatedTarget&&!q.current?.contains(e.relatedTarget)&&(G.current=null)},F=e=>{if(G.current!==e)return!1;const t=document.activeElement;return!t||t===document.body?!0:q.current?.contains(t)?!!t.closest(`[data-queue-item="${CSS.escape(e)}"]`):!1},C=a.useRef(null),A=(e,t)=>{C.current=t,h(e.key,{...e,open:!1})},ae=a.useRef(k),W=a.useRef(new Map),[,Ce]=a.useState(0),J=a.useRef(new Set),ue=(e,t,r)=>{const o=t.indexOf(e),f=t.slice(o+1).find(i=>r.has(i));if(f)return{kind:"item",key:f};const s=t.slice(0,o).reverse().find(i=>r.has(i));return s?{kind:"item",key:s}:{kind:"empty"}};a.useLayoutEffect(()=>{const e=ae.current;ae.current=k;const t=new Set(k),r=W.current;W.current=new Map;const o=[];let f=!1;for(const[s,i]of r){const u=t.has(s);o.push(i.announce??i.sentence),u||(f=!0),J.current.delete(s);const l=u?{kind:"trigger",key:s,actionId:i.actionId}:e.includes(s)?ue(s,e,t):null,m=x.current[s];if(m?.surface)A(m,l??{kind:"empty"});else{const I=F(s);m&&h(s,null),l&&I&&S(l)}}for(const s of e.filter(i=>!t.has(i))){if(r.has(s))continue;E(m=>s in m?B(m,s):m);const i=ue(s,e,t),u=C.current;if(u&&"key"in u&&u.key===s&&(C.current=i),$.current[s]){J.current.add(s),F(s)&&S(i);continue}const l=x.current[s];if(l&&!(l.surface&&!l.open))if(o.push(`${l.label} was decided elsewhere.`),f=!0,l.surface)A(l,i);else{const m=F(s);h(s,null),m&&S(i)}else!l&&F(s)&&S(i)}o.length&&ce(`${o.join(" ")}${f?` ${Qe(k.length)}`:""}`)});const M=async(e,t,r,o)=>{const f=T.current.get(e)??t,s=g(f),i=r.edit?R(r).run:r.run;ne(u=>({...u,[e]:r.id})),E(u=>B(u,e));try{const u=await i(f,o);W.current.set(e,{actionId:r.id,sentence:`${r.done??r.label}: ${s}.`,announce:u?u.announce:void 0}),Ce(l=>l+1)}catch(u){const l=We(u);ce(`${r.label} didn't go through for ${s}. ${l}`);const m=x.current[e];J.current.delete(e)?m?.surface?A(m,{kind:"empty"}):m&&h(e,null):m?h(e,{...m,error:l}):E(I=>({...I,[e]:l}))}finally{ne(u=>B(u,e))}},Ie=(e,t)=>{const r=y(e),o=R(t);if(!t.confirm&&!t.reason&&!o){M(r,e,t,{});return}E(f=>B(f,r)),h(r,{key:r,label:g(e),item:e,action:t,draft:o?o.edit.initial(e):void 0,reason:{},surface:!!o?.edit.surface,open:!0}),o?.edit.surface||S({kind:"step",key:r})},U=e=>{const t=x.current[e];if(!t||$.current[e])return;const r={kind:"trigger",key:e,actionId:t.action.id};t.surface?A(t,r):(h(e,null),S(r))},Be=e=>{const t=x.current[e];!t||$.current[e]||pe(t,T.current.get(e)??t.item)||(t.action.edit?M(e,t.item,t.action,{draft:t.draft}):t.action.reason?M(e,t.item,t.action,{reason:Ue(t.reason)}):M(e,t.item,t.action,{}))},Te=e=>{const t=C.current;C.current=null,h(e,null),t&&S(t)},Ee=`h${p}`,le=j??Ge(p+1),Fe=`h${le}`,V=`${N}-label`,de=(e,t)=>{const{action:r}=e,o=R(r),f=T.current.get(e.key)??e.item,s=!!D[e.key],i=pe(e,f),u=`${N}-step-${t}-message`,l=n.jsx(Z,{...me[r.tone??"neutral"],busy:s,blocked:!!i,"aria-describedby":i?u:void 0,onClick:()=>Be(e.key),"data-queue-submit":"",children:o?o.edit.submitLabel:r.label}),m=n.jsx(Z,{variant:"ghost",colorScheme:"neutral",blocked:s,onClick:()=>U(e.key),children:"Cancel"}),I=n.jsxs(n.Fragment,{children:[r.reason&&n.jsx(Ve,{id:`${N}-step-${t}`,step:r.reason,value:e.reason,disabled:s,onChange:X=>h(e.key,{...x.current[e.key],reason:X})}),o&&n.jsx(o.edit.Form,{item:f,value:e.draft,onChange:X=>h(e.key,{...x.current[e.key],draft:X})}),i&&n.jsx("p",{id:u,className:"rst:text-sm rst:text-error-600 rst:dark:text-error-400","data-queue-validation":"",children:i}),e.error&&n.jsx(Y.Alert,{colorScheme:"error",role:"group","aria-live":"off",children:e.error})]});return{submitButton:l,cancelButton:m,fields:I}},Ae=(e,t)=>{const{submitButton:r,cancelButton:o,fields:f}=de(e,t),s=`${N}-step-${t}-prompt`,i=R(e.action),u=e.action.confirm?.prompt??e.action.reason?.prompt??i?.edit.title;return n.jsxs("div",{role:"group","aria-labelledby":s,tabIndex:-1,"data-queue-step":"",onKeyDown:l=>{l.key==="Escape"&&(l.stopPropagation(),U(e.key))},className:"rst:flex rst:flex-col rst:gap-3 rst:rounded-lg rst:border rst:border-[var(--roster-card-border)] rst:p-4 rst:focus-visible:outline-hidden rst:focus-visible:ring-2 rst:focus-visible:ring-ring",children:[n.jsx("p",{id:s,className:"rst:text-sm rst:font-medium rst:text-[var(--roster-control-text)]",children:u}),i?.edit.description&&n.jsx("p",{className:"rst:text-sm rst:text-gray-600 rst:dark:text-gray-300",children:i.edit.description}),f,n.jsxs("div",{className:"rst:flex rst:flex-wrap rst:gap-2",children:[r,o]})]})},Me=(e,t)=>{const r=D[t];return n.jsx("div",{role:"group","aria-label":`Decide: ${g(e)}`,className:"rst:flex rst:flex-wrap rst:gap-2",children:Se.filter(o=>!o.hidden?.(e)).map(o=>n.jsx(Z,{...me[o.tone??"neutral"],"data-queue-action":o.id,busy:r===o.id,blocked:!!r&&r!==o.id,onClick:()=>Ie(e,o),children:o.label},o.id))})},b=Object.values(oe).find(e=>e.surface)??null,L=b?R(b.action):null,fe=L?.edit.surface,O=b?de(b,-1):null;return n.jsxs("section",{ref:q,"aria-labelledby":V,onBlur:we,className:P.cn("rst:font-ui rst:flex rst:flex-col rst:gap-4",ye),children:[n.jsx(Ee,{id:V,className:P.cn("rst:text-lg rst:font-semibold rst:text-[var(--roster-control-text)]",d&&"rst:sr-only"),children:c}),n.jsxs("div",{role:"status","aria-live":"polite","aria-atomic":"true",className:"rst:sr-only","data-queue-live":"","data-queue-live-n":H.n,children:[H.text,H.n%2?" ":""]}),_==="loading"?n.jsx("div",{className:"rst:flex rst:justify-center rst:py-12","aria-busy":"true",children:n.jsx(Oe.Spinner,{size:"lg",label:`Loading ${c}`})}):_==="error"?n.jsx(Y.Alert,{colorScheme:"error",children:n.jsxs("div",{className:"rst:flex rst:flex-col rst:items-start rst:gap-3",children:[n.jsx("div",{children:ve??"The queue couldn't load."}),ee&&n.jsx(ge.Button,{size:"lg",variant:"outline",colorScheme:"neutral",onClick:ee,children:"Retry"})]})}):v.length===0?n.jsx(ze.EmptyState,{title:te.title,description:te.description,headingLevel:le,tabIndex:-1,"data-queue-empty":"",className:"rst:focus-visible:outline-hidden rst:focus-visible:ring-2 rst:focus-visible:ring-ring"}):n.jsx("ul",{role:"list","aria-labelledby":V,className:"rst:m-0 rst:flex rst:list-none rst:flex-col rst:gap-3 rst:p-0",children:v.map((e,t)=>{const r=k[t],o=`${N}-item-${t}`,f=xe?.(e),s=oe[r];return n.jsx("li",{children:n.jsx("article",{"data-queue-item":r,tabIndex:-1,"aria-labelledby":o,onFocus:Ne(r),className:"rst:rounded-xl rst:focus-visible:outline-hidden rst:focus-visible:ring-2 rst:focus-visible:ring-ring rst:focus-visible:ring-offset-2 rst:ring-offset-background",children:n.jsx(Le.Card,{padding:re==="compact"?"sm":"md",children:n.jsxs("div",{className:P.cn("rst:flex rst:flex-col",re==="compact"?"rst:gap-3":"rst:gap-4"),children:[n.jsxs("div",{className:"rst:flex rst:flex-wrap rst:items-baseline rst:gap-x-3 rst:gap-y-1",children:[n.jsx(Fe,{id:o,className:"rst:text-base rst:font-semibold",children:g(e)}),f&&n.jsx("div",{className:"rst:flex rst:flex-wrap rst:items-center rst:gap-2 rst:text-sm rst:text-gray-600 rst:dark:text-gray-300",children:f})]}),n.jsx("div",{className:"rst:min-w-0",children:he(e)}),se[r]&&n.jsx(Y.Alert,{colorScheme:"error",role:"group","aria-live":"off",children:se[r]}),s&&!s.surface?Ae(s,t):Me(e,r)]})})})},r)})}),be,fe&&b&&L&&O&&n.jsx(fe,{open:b.open,title:L.edit.title,description:L.edit.description,busy:!!D[b.key],onCancel:()=>U(b.key),onAfterClose:()=>Te(b.key),submitButton:O.submitButton,cancelButton:O.cancelButton,children:n.jsx("div",{className:"rst:flex rst:flex-col rst:gap-4",children:O.fields})})]})}function pe(c,d){const p=R(c.action);if(p)return p.edit.validate?.(c.draft,d);if(c.action.reason){if(c.action.reason.required&&!c.reason.value)return"Pick a reason.";if(c.action.reason.note==="required"&&!c.reason.note?.trim())return"Add a note."}}function Ue(c){const d=c.note?.trim();return{...c.value?{value:c.value}:{},...d?{note:d}:{}}}function Ve({id:c,step:d,value:p,disabled:j,onChange:v}){const y=d.note??"optional";return n.jsxs(n.Fragment,{children:[d.options&&d.options.length>0&&n.jsx(De.RadioGroup,{label:d.required?"Reason":"Reason (optional)",options:d.options,value:p.value??"",onChange:g=>v({...p,value:g}),disabled:j}),y!=="none"&&n.jsx(Pe.Textarea,{id:`${c}-note`,label:d.noteLabel??(y==="required"?"Note":"Note (optional)"),rows:3,value:p.note??"",onChange:g=>v({...p,note:g.target.value}),disabled:j})]})}exports.ModerationQueue=Je;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),l=require("react"),D=require("../../../lib/utils.cjs"),Pe=require("../../../lib/labels.cjs"),he=require("../../atoms/Button/Button.cjs"),ze=require("../../atoms/Card/Card.cjs"),De=require("../../atoms/Spinner/Spinner.cjs"),He=require("../../atoms/Textarea/Textarea.cjs"),_=require("../../molecules/Alert/Alert.cjs"),Ke=require("../../molecules/EmptyState/EmptyState.cjs"),Qe=require("../../molecules/RadioGroup/RadioGroup.cjs"),Ge=require("./queue-actions.cjs"),We={loading:n=>`Loading ${n}`,loadFailed:"The queue couldn't load.",retry:"Retry",busy:"loading",cancel:"Cancel",decide:n=>`Decide: ${n}`,decided:(n,a)=>`${n}: ${a}.`,failed:(n,a,p)=>`${n} didn't go through for ${a}. ${p}`,unknownError:"Something went wrong.",decidedElsewhere:n=>`${n} was decided elsewhere.`,left:n=>n===0?"None left.":`${n} left.`,pickReason:"Pick a reason.",addNote:"Add a note.",reason:"Reason",reasonOptional:"Reason (optional)",note:"Note",noteOptional:"Note (optional)"},ge={primary:{colorScheme:"primary",variant:"solid"},success:{colorScheme:"success",variant:"solid"},danger:{colorScheme:"error",variant:"soft"},neutral:{colorScheme:"neutral",variant:"outline"}},Je={edit:Ge.editAction},N=n=>n.edit?n:null,Ue=n=>Math.min(6,Math.max(1,n)),Ve=(n,a)=>n instanceof Error&&n.message?n.message:a;function T(n,a){const p={...n};return delete p[a],p}function ee({busy:n=!1,blocked:a=!1,onClick:p,children:v,className:y,...S}){return s.jsx(he.Button,{size:"lg",...S,isLoading:n,"aria-disabled":a||void 0,className:D.cn(a&&!n&&"rst:cursor-not-allowed rst:opacity-50",y),onClick:h=>{if(a){h.preventDefault();return}p?.(h)},children:v})}function Xe({label:n,hideLabel:a=!1,headingLevel:p=2,itemHeadingLevel:v,items:y,getKey:S,itemLabel:h,renderMeta:w,renderContent:be,actions:H,status:te="ready",error:ve,onRetry:re,empty:ne={title:"Nothing waiting"},density:se="comfortable",footer:ye,labels:Se,className:je}){const g=Pe.withLabels(We,Se),qe=typeof H=="function"?H(Je):H,C=l.useId(),k=l.useRef(null),R=y.map(S),F=l.useRef(new Map);F.current=new Map(y.map((e,t)=>[R[t],e]));const[K,ke]=l.useState({}),$=l.useRef({}),oe=e=>{$.current=e($.current),ke($.current)},[ce,L]=l.useState({}),[ie,Re]=l.useState({}),x=l.useRef({}),b=(e,t)=>{x.current=t?{...x.current,[e]:t}:T(x.current,e),Re(x.current)},[Q,$e]=l.useState({text:"",n:0}),G=l.useRef([]),B=l.useRef(null),ae=l.useCallback(e=>{G.current.push(e),!B.current&&(B.current=setTimeout(()=>{B.current=null;const t=G.current.join(" ");G.current=[],$e(r=>({text:t,n:r.n+1}))},0))},[]);l.useLayoutEffect(()=>()=>{B.current&&clearTimeout(B.current)},[]);const[Ne,we]=l.useState(0),W=l.useRef(null),q=l.useCallback(e=>{W.current=e,we(t=>t+1)},[]),le=l.useCallback(e=>{const t=k.current;if(!t)return null;const r="key"in e?CSS.escape(e.key):"";switch(e.kind){case"item":return t.querySelector(`[data-queue-item="${r}"]`);case"empty":return t.querySelector("[data-queue-empty]");case"trigger":return t.querySelector(`[data-queue-item="${r}"] [data-queue-action="${CSS.escape(e.actionId)}"]`);case"step":return t.querySelector(`[data-queue-item="${r}"] [data-queue-step]`)}},[]);l.useLayoutEffect(()=>{const e=W.current;if(!e)return;W.current=null,(le(e)??k.current?.querySelector("[data-queue-item]")??k.current?.querySelector("[data-queue-empty]"))?.focus()},[Ne,le]);const J=l.useRef(null),Ce=e=>()=>{J.current=e},Be=e=>{e.relatedTarget&&!k.current?.contains(e.relatedTarget)&&(J.current=null)},A=e=>{if(J.current!==e)return!1;const t=document.activeElement;return!t||t===document.body?!0:k.current?.contains(t)?!!t.closest(`[data-queue-item="${CSS.escape(e)}"]`):!1},E=l.useRef(null),O=(e,t)=>{E.current=t,b(e.key,{...e,open:!1})},ue=l.useRef(R),U=l.useRef(new Map),[,Ee]=l.useState(0),V=l.useRef(new Set),de=(e,t,r)=>{const c=t.indexOf(e),f=t.slice(c+1).find(i=>r.has(i));if(f)return{kind:"item",key:f};const o=t.slice(0,c).reverse().find(i=>r.has(i));return o?{kind:"item",key:o}:{kind:"empty"}};l.useLayoutEffect(()=>{const e=ue.current;ue.current=R;const t=new Set(R),r=U.current;U.current=new Map;const c=[];let f=!1;for(const[o,i]of r){const u=t.has(o);c.push(i.announce??i.sentence),u||(f=!0),V.current.delete(o);const d=u?{kind:"trigger",key:o,actionId:i.actionId}:e.includes(o)?de(o,e,t):null,m=x.current[o];if(m?.surface)O(m,d??{kind:"empty"});else{const I=A(o);m&&b(o,null),d&&I&&q(d)}}for(const o of e.filter(i=>!t.has(i))){if(r.has(o))continue;L(m=>o in m?T(m,o):m);const i=de(o,e,t),u=E.current;if(u&&"key"in u&&u.key===o&&(E.current=i),$.current[o]){V.current.add(o),A(o)&&q(i);continue}const d=x.current[o];if(d&&!(d.surface&&!d.open))if(c.push(g.decidedElsewhere(d.label)),f=!0,d.surface)O(d,i);else{const m=A(o);b(o,null),m&&q(i)}else!d&&A(o)&&q(i)}c.length&&ae(`${c.join(" ")}${f?` ${g.left(R.length)}`:""}`)});const M=async(e,t,r,c)=>{const f=F.current.get(e)??t,o=h(f),i=r.edit?N(r).run:r.run;oe(u=>({...u,[e]:r.id})),L(u=>T(u,e));try{const u=await i(f,c);U.current.set(e,{actionId:r.id,sentence:g.decided(r.done??r.label,o),announce:u?u.announce:void 0}),Ee(d=>d+1)}catch(u){const d=Ve(u,g.unknownError);ae(g.failed(r.label,o,d));const m=x.current[e];V.current.delete(e)?m?.surface?O(m,{kind:"empty"}):m&&b(e,null):m?b(e,{...m,error:d}):L(I=>({...I,[e]:d}))}finally{oe(u=>T(u,e))}},Ie=(e,t)=>{const r=S(e),c=N(t);if(!t.confirm&&!t.reason&&!c){M(r,e,t,{});return}L(f=>T(f,r)),b(r,{key:r,label:h(e),item:e,action:t,draft:c?c.edit.initial(e):void 0,reason:{},surface:!!c?.edit.surface,open:!0}),c?.edit.surface||q({kind:"step",key:r})},X=e=>{const t=x.current[e];if(!t||$.current[e])return;const r={kind:"trigger",key:e,actionId:t.action.id};t.surface?O(t,r):(b(e,null),q(r))},Te=e=>{const t=x.current[e];!t||$.current[e]||xe(t,F.current.get(e)??t.item,g)||(t.action.edit?M(e,t.item,t.action,{draft:t.draft}):t.action.reason?M(e,t.item,t.action,{reason:Ye(t.reason)}):M(e,t.item,t.action,{}))},Fe=e=>{const t=E.current;E.current=null,b(e,null),t&&q(t)},Le=`h${p}`,fe=v??Ue(p+1),Ae=`h${fe}`,Y=`${C}-label`,pe=(e,t)=>{const{action:r}=e,c=N(r),f=F.current.get(e.key)??e.item,o=!!K[e.key],i=xe(e,f,g),u=`${C}-step-${t}-message`,d=s.jsx(ee,{...ge[r.tone??"neutral"],busy:o,loadingLabel:g.busy,blocked:!!i,"aria-describedby":i?u:void 0,onClick:()=>Te(e.key),"data-queue-submit":"",children:c?c.edit.submitLabel:r.label}),m=s.jsx(ee,{variant:"ghost",colorScheme:"neutral",blocked:o,onClick:()=>X(e.key),children:g.cancel}),I=s.jsxs(s.Fragment,{children:[r.reason&&s.jsx(Ze,{id:`${C}-step-${t}`,step:r.reason,labels:g,value:e.reason,disabled:o,onChange:Z=>b(e.key,{...x.current[e.key],reason:Z})}),c&&s.jsx(c.edit.Form,{item:f,value:e.draft,onChange:Z=>b(e.key,{...x.current[e.key],draft:Z})}),i&&s.jsx("p",{id:u,className:"rst:text-sm rst:text-error-600 rst:dark:text-error-400","data-queue-validation":"",children:i}),e.error&&s.jsx(_.Alert,{colorScheme:"error",role:"group","aria-live":"off",children:e.error})]});return{submitButton:d,cancelButton:m,fields:I}},Oe=(e,t)=>{const{submitButton:r,cancelButton:c,fields:f}=pe(e,t),o=`${C}-step-${t}-prompt`,i=N(e.action),u=e.action.reason?.prompt??e.action.confirm?.prompt??i?.edit.title;return s.jsxs("div",{role:"group","aria-labelledby":o,tabIndex:-1,"data-queue-step":"",onKeyDown:d=>{d.key==="Escape"&&(d.stopPropagation(),X(e.key))},className:"rst:flex rst:flex-col rst:gap-3 rst:rounded-lg rst:border rst:border-[var(--roster-card-border)] rst:p-4 rst:focus-visible:outline-hidden rst:focus-visible:ring-2 rst:focus-visible:ring-ring",children:[s.jsx("p",{id:o,className:"rst:text-sm rst:font-medium rst:text-[var(--roster-control-text)]",children:u}),i?.edit.description&&s.jsx("p",{className:"rst:text-sm rst:text-gray-600 rst:dark:text-gray-300",children:i.edit.description}),f,s.jsxs("div",{className:"rst:flex rst:flex-wrap rst:gap-2",children:[r,c]})]})},Me=(e,t)=>{const r=K[t];return s.jsx("div",{role:"group","aria-label":g.decide(h(e)),className:"rst:flex rst:flex-wrap rst:gap-2",children:qe.filter(c=>!c.hidden?.(e)).map(c=>s.jsx(ee,{...ge[c.tone??"neutral"],"data-queue-action":c.id,busy:r===c.id,loadingLabel:g.busy,blocked:!!r&&r!==c.id,onClick:()=>Ie(e,c),children:c.label},c.id))})},j=Object.values(ie).find(e=>e.surface)??null,P=j?N(j.action):null,me=P?.edit.surface,z=j?pe(j,-1):null;return s.jsxs("section",{ref:k,"aria-labelledby":Y,onBlur:Be,className:D.cn("rst:font-ui rst:flex rst:flex-col rst:gap-4",je),children:[s.jsx(Le,{id:Y,className:D.cn("rst:text-lg rst:font-semibold rst:text-[var(--roster-control-text)]",a&&"rst:sr-only"),children:n}),s.jsxs("div",{role:"status","aria-live":"polite","aria-atomic":"true",className:"rst:sr-only","data-queue-live":"","data-queue-live-n":Q.n,children:[Q.text,Q.n%2?" ":""]}),te==="loading"?s.jsx("div",{className:"rst:flex rst:justify-center rst:py-12","aria-busy":"true",children:s.jsx(De.Spinner,{size:"lg",label:g.loading(n)})}):te==="error"?s.jsx(_.Alert,{colorScheme:"error",children:s.jsxs("div",{className:"rst:flex rst:flex-col rst:items-start rst:gap-3",children:[s.jsx("div",{children:ve??g.loadFailed}),re&&s.jsx(he.Button,{size:"lg",variant:"outline",colorScheme:"neutral",onClick:re,children:g.retry})]})}):y.length===0?s.jsx(Ke.EmptyState,{title:ne.title,description:ne.description,headingLevel:fe,tabIndex:-1,"data-queue-empty":"",className:"rst:focus-visible:outline-hidden rst:focus-visible:ring-2 rst:focus-visible:ring-ring"}):s.jsx("ul",{role:"list","aria-labelledby":Y,className:"rst:m-0 rst:flex rst:list-none rst:flex-col rst:gap-3 rst:p-0",children:y.map((e,t)=>{const r=R[t],c=`${C}-item-${t}`,f=w?.(e),o=ie[r];return s.jsx("li",{children:s.jsx("article",{"data-queue-item":r,tabIndex:-1,"aria-labelledby":c,onFocus:Ce(r),className:"rst:rounded-xl rst:focus-visible:outline-hidden rst:focus-visible:ring-2 rst:focus-visible:ring-ring rst:focus-visible:ring-offset-2 rst:ring-offset-background",children:s.jsx(ze.Card,{padding:se==="compact"?"sm":"md",children:s.jsxs("div",{className:D.cn("rst:flex rst:flex-col",se==="compact"?"rst:gap-3":"rst:gap-4"),children:[s.jsxs("div",{className:"rst:flex rst:flex-wrap rst:items-baseline rst:gap-x-3 rst:gap-y-1",children:[s.jsx(Ae,{id:c,className:"rst:text-base rst:font-semibold",children:h(e)}),f&&s.jsx("div",{className:"rst:flex rst:flex-wrap rst:items-center rst:gap-2 rst:text-sm rst:text-gray-600 rst:dark:text-gray-300",children:f})]}),s.jsx("div",{className:"rst:min-w-0",children:be(e)}),ce[r]&&s.jsx(_.Alert,{colorScheme:"error",role:"group","aria-live":"off",children:ce[r]}),o&&!o.surface?Oe(o,t):Me(e,r)]})})})},r)})}),ye,me&&j&&P&&z&&s.jsx(me,{open:j.open,title:P.edit.title,description:P.edit.description,busy:!!K[j.key],onCancel:()=>X(j.key),onAfterClose:()=>Fe(j.key),submitButton:z.submitButton,cancelButton:z.cancelButton,closeLabel:g.close,children:s.jsx("div",{className:"rst:flex rst:flex-col rst:gap-4",children:z.fields})})]})}function xe(n,a,p){const v=N(n.action);if(v)return v.edit.validate?.(n.draft,a);if(n.action.reason){if(n.action.reason.required&&n.action.reason.options?.length&&!n.reason.value)return p.pickReason;if(n.action.reason.note==="required"&&!n.reason.note?.trim())return p.addNote}}function Ye(n){const a=n.note?.trim();return{...n.value?{value:n.value}:{},...a?{note:a}:{}}}function Ze({id:n,step:a,value:p,disabled:v,onChange:y,labels:S}){const h=a.note??"optional";return s.jsxs(s.Fragment,{children:[a.options&&a.options.length>0&&s.jsx(Qe.RadioGroup,{label:a.required?S.reason:S.reasonOptional,options:a.options,value:p.value??"",onChange:w=>y({...p,value:w}),disabled:v}),h!=="none"&&s.jsx(He.Textarea,{id:`${n}-note`,label:a.noteLabel??(h==="required"?S.note:S.noteOptional),rows:3,value:p.note??"",onChange:w=>y({...p,note:w.target.value}),disabled:v})]})}exports.ModerationQueue=Xe;

package/dist/components/organisms/ModerationQueue/ModerationQueue.d.ts

@@ -1,5 +1,42 @@
 import { ReactNode } from 'react';
 import { QueueAction, QueueActionKit, QueueCheckedEditAction, QueueHeadingLevel } from './queue-actions';
+/** Every word ModerationQueue shows or says of its own. Pass any of them in `labels` to replace it. */
+export interface ModerationQueueLabels {
+    /** The spinner's name while the queue loads, from its `label`. */
+    loading: (label: string) => string;
+    /** The whole-queue error when `error` gives none. */
+    loadFailed: string;
+    /** The whole-queue error's retry button. */
+    retry: string;
+    /** A button's spinner while its decision is in flight. */
+    busy: string;
+    /** A step's cancel button. */
+    cancel: string;
+    /** An item's action bar's name, from `itemLabel`. */
+    decide: (item: string) => string;
+    /** Said when a decision lands: the action's `done` (or `label`) and the item. */
+    decided: (action: string, item: string) => string;
+    /** Said when a decision fails, with the error's message. */
+    failed: (action: string, item: string, message: string) => string;
+    /** The message when a failed `run` throws without one. */
+    unknownError: string;
+    /** Said when an item with its step open leaves without a decision of ours. */
+    decidedElsewhere: (item: string) => string;
+    /** Said after an item leaves: how many are left. */
+    left: (count: number) => string;
+    /** Why a step with a required reason can't be submitted yet. */
+    pickReason: string;
+    /** Why a step with a required note can't be submitted yet. */
+    addNote: string;
+    /** The reason choices' label, required and optional. */
+    reason: string;
+    reasonOptional: string;
+    /** The note's label, required and optional, unless the step sets `noteLabel`. */
+    note: string;
+    noteOptional: string;
+    /** The close button of an edit's Dialog or Sheet. Unset, each keeps its own. */
+    close?: string;
+}
 export interface ModerationQueueProps<T> {
     /** The queue's heading, and the list's accessible name. */
     label: string;
@@ -42,6 +79,8 @@ export interface ModerationQueueProps<T> {
     density?: "comfortable" | "compact";
     /** After the list: "Load more", if the app pages. */
     footer?: ReactNode;
+    /** The component's own words, replaced; any left out stay English. */
+    labels?: Partial<ModerationQueueLabels>;
     className?: string;
 }
 /**
@@ -68,6 +107,6 @@ export interface ModerationQueueProps<T> {
  *     elsewhere. Focus moves only if it was inside the item.
  *   - Several outcomes in one render are said in one sentence.
  */
-declare function ModerationQueue<T>({ label, hideLabel, headingLevel, itemHeadingLevel, items, getKey, itemLabel, renderMeta, renderContent, actions: actionsProp, status, error, onRetry, empty, density, footer, className, }: ModerationQueueProps<T>): import("react/jsx-runtime").JSX.Element;
+declare function ModerationQueue<T>({ label, hideLabel, headingLevel, itemHeadingLevel, items, getKey, itemLabel, renderMeta, renderContent, actions: actionsProp, status, error, onRetry, empty, density, footer, labels, className, }: ModerationQueueProps<T>): import("react/jsx-runtime").JSX.Element;
 export type { QueueCheckedEditAction };
 export { ModerationQueue };