@blakesteve/roster 5.12.0 → 5.14.0

package/dist/components/molecules/LiquidTabs/LiquidTabs.js

@@ -1,86 +1,91 @@
 "use client";
-import { jsxs as j, jsx as q } from "react/jsx-runtime";
-import { useRef as L, useId as E, useState as F } from "react";
-import { useLiquidPill as T, LIQUID_STRIP_STYLE as K, LIQUID_PILL_STYLE as Q, liquidPillClassName as U, liquidItemClassName as Y, liquidStripClassName as B } from "./liquid-pill.js";
-import { liquidTabId as H } from "./liquid-tab-id.js";
-import { useKeyFocus as O } from "../../../internal/key-focus.js";
-function V({
+import { jsxs as U, jsx as c } from "react/jsx-runtime";
+import { useRef as A, useId as j, useState as F } from "react";
+import { useLiquidPill as Q, LIQUID_STRIP_STYLE as B, LIQUID_PILL_STYLE as K, liquidPillClassName as O, liquidItemClassName as Y, liquidStripClassName as H } from "./liquid-pill.js";
+import { liquidTabId as $ } from "./liquid-tab-id.js";
+import { LiquidCount as z } from "./LiquidCount.js";
+import { shownCount as G, countName as J, LIQUID_COUNT_LABELS as M } from "./liquid-count.js";
+import { withLabels as V } from "../../../lib/labels.js";
+import { useKeyFocus as X } from "../../../internal/key-focus.js";
+function re({
   tabs: l,
-  activeTab: o,
-  onChange: g,
-  variant: s = "pill",
-  fullWidth: u = !1,
-  size: A = "md",
-  activation: S = "automatic",
-  id: h,
-  "aria-label": k,
-  "aria-labelledby": w,
-  className: N
+  activeTab: r,
+  onChange: S,
+  variant: n = "pill",
+  fullWidth: m = !1,
+  size: g = "md",
+  activation: h = "automatic",
+  id: w,
+  "aria-label": C,
+  "aria-labelledby": N,
+  className: k,
+  labels: R
 }) {
-  O();
-  const d = L(null), f = L(null), R = E(), m = h ?? R;
-  T(d, f, o, l.map((e) => e.id).join("\0"));
-  const p = (e) => {
-    e !== o && g(e);
-  }, [n, y] = F(null), x = l.some((e) => e.id === o), C = n !== null && l.some((e) => e.id === n) ? n : x ? o : l[0]?.id, b = (e) => {
-    e.currentTarget.contains(e.relatedTarget) || y(null);
-  }, D = (e) => {
+  X();
+  const f = V(M, R), d = A(null), p = A(null), _ = j(), y = w ?? _;
+  Q(d, p, r, l.map((e) => e.id).join("\0"));
+  const I = (e) => {
+    e !== r && S(e);
+  }, [u, L] = F(null), b = l.some((e) => e.id === r), x = u !== null && l.some((e) => e.id === u) ? u : b ? r : l[0]?.id, D = (e) => {
+    e.currentTarget.contains(e.relatedTarget) || L(null);
+  }, E = (e) => {
     const i = d.current;
     if (!i) return;
-    const a = Array.from(
+    const t = Array.from(
       i.querySelectorAll('[role="tab"]')
-    ), r = a.indexOf(e.target);
-    if (r === -1) return;
-    const c = a.length - 1, I = getComputedStyle(i).direction === "rtl", P = I ? "ArrowLeft" : "ArrowRight", _ = I ? "ArrowRight" : "ArrowLeft";
-    let t;
-    if (e.key === P) t = r === c ? 0 : r + 1;
-    else if (e.key === _) t = r === 0 ? c : r - 1;
-    else if (e.key === "Home") t = 0;
-    else if (e.key === "End") t = c;
+    ), s = t.indexOf(e.target);
+    if (s === -1) return;
+    const a = t.length - 1, q = getComputedStyle(i).direction === "rtl", P = q ? "ArrowLeft" : "ArrowRight", T = q ? "ArrowRight" : "ArrowLeft";
+    let o;
+    if (e.key === P) o = s === a ? 0 : s + 1;
+    else if (e.key === T) o = s === 0 ? a : s - 1;
+    else if (e.key === "Home") o = 0;
+    else if (e.key === "End") o = a;
     else return;
-    e.preventDefault(), a[t].focus(), S === "automatic" && p(l[t].id);
+    e.preventDefault(), t[o].focus(), h === "automatic" && I(l[o].id);
   };
-  return /* @__PURE__ */ j(
+  return /* @__PURE__ */ U(
     "div",
     {
       ref: d,
-      id: m,
+      id: y,
       role: "tablist",
-      "aria-label": k,
-      "aria-labelledby": w,
+      "aria-label": C,
+      "aria-labelledby": N,
       "data-testid": "liquid-tabs",
-      style: K,
-      className: B(s, u, N),
-      onKeyDown: D,
-      onBlur: b,
+      style: B,
+      className: H(n, m, k),
+      onKeyDown: E,
+      onBlur: D,
       children: [
-        /* @__PURE__ */ q(
+        /* @__PURE__ */ c(
           "div",
           {
-            ref: f,
+            ref: p,
             "aria-hidden": !0,
             "data-testid": "liquid-tabs-pill",
-            className: U(s),
-            style: Q
+            className: O(n),
+            style: K
           }
         ),
         l.map((e) => {
-          const i = e.id === o;
-          return /* @__PURE__ */ q(
+          const i = e.id === r, t = typeof e.label == "function" ? e.label(i) : e.label;
+          return /* @__PURE__ */ c(
             "button",
             {
               type: "button",
               role: "tab",
-              id: H(m, e.id),
+              id: $(y, e.id),
               "aria-selected": i,
               "aria-controls": e.panelId,
-              tabIndex: e.id === C ? 0 : -1,
+              "aria-label": J(t, e.count, f),
+              tabIndex: e.id === x ? 0 : -1,
               "data-tab-id": e.id,
               "data-testid": `liquid-tab-${e.id}`,
-              onClick: () => p(e.id),
-              onFocus: () => y(e.id),
-              className: Y({ variant: s, fullWidth: u, size: A, isActive: i }),
-              children: typeof e.label == "function" ? e.label(i) : e.label
+              onClick: () => I(e.id),
+              onFocus: () => L(e.id),
+              className: Y({ variant: n, fullWidth: m, size: g, isActive: i }),
+              children: G(e.count) ? /* @__PURE__ */ c(z, { label: t, count: e.count, labels: f }) : t
             },
             e.id
           );
@@ -90,5 +95,5 @@ function V({
   );
 }
 export {
-  V as LiquidTabs
+  re as LiquidTabs
 };

package/dist/components/molecules/LiquidTabs/liquid-count.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r={count:t=>`${t.toLocaleString("en-US")} ${t===1?"item":"items"}`,countMark:t=>t.toLocaleString("en-US")},o=t=>typeof t=="number"&&Number.isInteger(t)&&t>=0,i=(t,e,n)=>typeof t=="string"&&o(e)?`${t}, ${n.count(e)}`:void 0;exports.LIQUID_COUNT_LABELS=r;exports.countName=i;exports.shownCount=o;

package/dist/components/molecules/LiquidTabs/liquid-count.d.ts

@@ -0,0 +1,37 @@
+/**
+ * Counts on a tab or a nav link: what `LiquidTabs` and `LiquidNav` share
+ * about them. Internal; the type is exported from `LiquidTabs`.
+ */
+/** Every word a count says. Pass any of them in `labels` to replace it. */
+export interface LiquidTabsLabels {
+    /**
+     * What a count says after the label, as part of the tab's accessible name:
+     * "12 items", so the tab reads "Open, 12 items". Name your own noun, with
+     * its plural, `(n) => (n === 1 ? "1 game" : n.toLocaleString() + " games")`,
+     * or use `Intl.PluralRules` for a language with more forms than two. Never
+     * abbreviated, whatever the mark shows.
+     */
+    count: (count: number) => string;
+    /**
+     * How a count is written in the mark beside the label: "1,000", "12,345".
+     * Not abbreviated by default, so a mark never hides a number; replace it to
+     * write "12K" if a tab can't afford the width.
+     */
+    countMark: (count: number) => string;
+}
+export declare const LIQUID_COUNT_LABELS: LiquidTabsLabels;
+/**
+ * Whether a count gets a mark: a whole number, zero or more. `undefined`
+ * means no count. A negative or fractional count, or `NaN`, isn't shown at
+ * all, rather than rounded or clamped into a number nobody passed.
+ */
+export declare const shownCount: (count: number | undefined) => count is number;
+/**
+ * The item's whole name, "Open, 12 items", when its label is a string and it
+ * has a count to show; otherwise `undefined`, and the name comes from the
+ * content. Set as `aria-label` because hidden text alone can't make it
+ * exact: Chromium names an element from its content with a space before any
+ * visually hidden part, so the hidden ", 12 items" reads "Open , 12 items".
+ * A label that's a node keeps that content name, which is spoken the same.
+ */
+export declare const countName: (label: unknown, count: number | undefined, labels: LiquidTabsLabels) => string | undefined;

package/dist/components/molecules/LiquidTabs/liquid-count.js

@@ -0,0 +1,9 @@
+const r = {
+  count: (t) => `${t.toLocaleString("en-US")} ${t === 1 ? "item" : "items"}`,
+  countMark: (t) => t.toLocaleString("en-US")
+}, n = (t) => typeof t == "number" && Number.isInteger(t) && t >= 0, i = (t, e, o) => typeof t == "string" && n(e) ? `${t}, ${o.count(e)}` : void 0;
+export {
+  r as LIQUID_COUNT_LABELS,
+  i as countName,
+  n as shownCount
+};

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

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