@blakesteve/roster 5.11.0 → 5.12.0

package/dist/components/molecules/RangeSlider/RangeSlider.cjs

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),d=require("react"),G=require("../../../lib/utils.cjs"),ge=require("../../../lib/labels.cjs"),J=require("../../../internal/field-invalid.cjs"),l=require("../Slider/track.cjs"),h=require("../Slider/track-parts.cjs"),ve={low:"Minimum",high:"Maximum",valueText:(s,i)=>i?`${s}, ${i}`:s,range:(s,i)=>`${s} – ${i}`},he=([s,i])=>s<=i?[s,i]:[i,s];function pe({value:s,defaultValue:i,onChange:Q,onCommit:B,min:g=0,max:v=100,step:M=1,pageStep:U,snapPoints:W=[],label:P,helperText:T,errorMessage:R,disabled:a=!1,name:p,formatValue:b=String,labels:X,className:Y,trackClassName:Z,thumbClassName:_,chipClassName:V,labelClassName:ee,messageClassName:te,"aria-invalid":ne,"aria-labelledby":re,"aria-describedby":se,...C}){const j=ge.withLabels(ve,X),x=d.useId(),F=`${x}-label`,N=`${x}-message`,w=[`${x}-low`,`${x}-high`],S=re??(P?F:void 0),c=l.useScale(g,v,M,U),m=s!==void 0,[O,L]=d.useState(i??[g,v]),D=m?s:O,r=he([c.clamp(D[0]),c.clamp(D[1])]),ie=J.isFieldInvalid(!!R,{...C,"aria-invalid":ne}),K=J.withoutInvalidProps(C),f=l.useCommitted(r),[,ae]=d.useReducer(e=>e+1,0),k=(e,t,o)=>{const u=f.current,q=e===0?Math.min(t,u[1]):Math.max(t,u[0]);if(q===u[e])return;const y=e===0?[q,u[1]]:[u[0],q];f.current=y,m?ae():L(y),Q?.(y),o&&B?.(y)},z=d.useRef(null),A=d.useRef(O);l.useFormReset(z,m,()=>{f.current=A.current,L(A.current)},p);const E=d.useRef(null),H=[d.useRef(null),d.useRef(null)],{dragging:I,rtl:le,handlers:oe}=l.useTrackPress({trackRef:E,disabled:a,scale:c,min:g,max:v,values:()=>f.current,set:k,focus:e=>H[e].current?.focus({preventScroll:!0}),commit:()=>B?.(f.current),own:{down:void 0,move:void 0,up:void 0,cancel:void 0,lost:void 0}}),ce=e=>t=>{if(a)return;const o=f.current,u=l.keyTarget(t,o[e],{scale:c,step:M,start:o[e],floor:e===0?g:o[0],ceiling:e===0?o[1]:v,rtl:le()});u!==void 0&&(t.preventDefault(),k(e,u,!0))},ue=e=>{const[t,o]=f.current;k(e<=t?0:e>=o?1:e-t<=o-e?0:1,e,!0)},$=l.inRange(W,g,v),de=[T||R?N:void 0,se].filter(Boolean).join(" ")||void 0,fe="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";return n.jsxs("div",{...K,role:"group","aria-labelledby":S,className:G.cn("rst:font-ui rst:flex rst:min-w-0 rst:flex-col rst:gap-1.5",Y),"data-range-slider":"",children:[n.jsx(h.SliderHeader,{labelId:F,label:P,readout:j.range(b(r[0]),b(r[1])),empty:!1,disabled:a,labelClassName:ee}),n.jsx("span",{id:w[0],hidden:!0,children:j.low}),n.jsx("span",{id:w[1],hidden:!0,children:j.high}),n.jsxs("div",{...oe,ref:E,"data-dragging":I?"":void 0,className:G.cn(l.trackClasses(a),Z),children:[n.jsx(h.Rail,{}),n.jsx(h.Fill,{from:c.at(r[0]),to:c.at(r[1]),dragging:I}),n.jsx(h.Marks,{points:$,at:c.at,filled:e=>e>=r[0]&&e<=r[1]}),r.map((e,t)=>n.jsx("span",{ref:H[t],role:"slider",tabIndex:a?void 0:0,"aria-labelledby":[S,w[t]].filter(Boolean).join(" "),"aria-describedby":de,"aria-valuemin":t===0?g:r[0],"aria-valuemax":t===0?r[1]:v,"aria-valuenow":e,"aria-valuetext":j.valueText(b(e),l.nearestPoint($,e)?.label),"aria-orientation":"horizontal","aria-disabled":a||void 0,"aria-invalid":ie||void 0,"data-slider-thumb":t===0?"low":"high",onKeyDown:ce(t),className:l.thumbClasses(I,fe,_),style:{insetInlineStart:l.along(c.at(e))}},t))]}),n.jsx(h.SnapChips,{points:$,labelledBy:S,label:K["aria-label"],pressed:e=>e===r[0]||e===r[1],pick:ue,disabled:a,chipClassName:V}),n.jsx(h.Message,{id:N,helperText:T,errorMessage:R,disabled:a,className:te}),p&&n.jsxs(n.Fragment,{children:[n.jsx("input",{ref:z,type:"hidden",name:p,value:String(r[0]),disabled:a,readOnly:!0}),n.jsx("input",{type:"hidden",name:p,value:String(r[1]),disabled:a,readOnly:!0})]})]})}exports.RangeSlider=pe;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),d=require("react"),G=require("../../../lib/utils.cjs"),ge=require("../../../lib/labels.cjs"),J=require("../../../internal/field-invalid.cjs"),o=require("../Slider/track.cjs"),h=require("../Slider/track-parts.cjs"),ve=require("../../../internal/key-focus.cjs"),he={low:"Minimum",high:"Maximum",valueText:(r,i)=>i?`${r}, ${i}`:r,range:(r,i)=>`${r} – ${i}`},pe=([r,i])=>r<=i?[r,i]:[i,r];function ye({value:r,defaultValue:i,onChange:Q,onCommit:F,min:g=0,max:v=100,step:B=1,pageStep:U,snapPoints:W=[],label:M,helperText:P,errorMessage:R,disabled:a=!1,name:p,formatValue:b=String,labels:X,className:Y,trackClassName:Z,thumbClassName:_,chipClassName:V,labelClassName:ee,messageClassName:se,"aria-invalid":te,"aria-labelledby":ne,"aria-describedby":re,...T}){ve.useKeyFocus();const y=ge.withLabels(he,X),j=d.useId(),C=`${j}-label`,N=`${j}-message`,w=[`${j}-low`,`${j}-high`],S=ne??(M?C:void 0),c=o.useScale(g,v,B,U),m=r!==void 0,[O,K]=d.useState(i??[g,v]),L=m?r:O,n=pe([c.clamp(L[0]),c.clamp(L[1])]),ie=J.isFieldInvalid(!!R,{...T,"aria-invalid":te}),D=J.withoutInvalidProps(T),f=o.useCommitted(n),[,ae]=d.useReducer(e=>e+1,0),k=(e,s,l)=>{const u=f.current,$=e===0?Math.min(s,u[1]):Math.max(s,u[0]);if($===u[e])return;const x=e===0?[$,u[1]]:[u[0],$];f.current=x,m?ae():K(x),Q?.(x),l&&F?.(x)},z=d.useRef(null),A=d.useRef(O);o.useFormReset(z,m,()=>{f.current=A.current,K(A.current)},p);const E=d.useRef(null),H=[d.useRef(null),d.useRef(null)],{dragging:q,rtl:oe,handlers:le}=o.useTrackPress({trackRef:E,disabled:a,scale:c,min:g,max:v,values:()=>f.current,set:k,focus:e=>H[e].current?.focus({preventScroll:!0}),commit:()=>F?.(f.current),own:{down:void 0,move:void 0,up:void 0,cancel:void 0,lost:void 0}}),ce=e=>s=>{if(a)return;const l=f.current,u=o.keyTarget(s,l[e],{scale:c,step:B,start:l[e],floor:e===0?g:l[0],ceiling:e===0?l[1]:v,rtl:oe()});u!==void 0&&(s.preventDefault(),k(e,u,!0))},ue=e=>{const[s,l]=f.current;k(e<=s?0:e>=l?1:e-s<=l-e?0:1,e,!0)},I=o.inRange(W,g,v),de=[P||R?N:void 0,re].filter(Boolean).join(" ")||void 0,fe="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";return t.jsxs("div",{...D,role:"group","aria-labelledby":S,className:G.cn("rst:font-ui rst:flex rst:min-w-0 rst:flex-col rst:gap-1.5",Y),"data-range-slider":"",children:[t.jsx(h.SliderHeader,{labelId:C,label:M,readout:y.range(b(n[0]),b(n[1])),empty:!1,disabled:a,labelClassName:ee}),t.jsx("span",{id:w[0],hidden:!0,children:y.low}),t.jsx("span",{id:w[1],hidden:!0,children:y.high}),t.jsxs("div",{...le,ref:E,"data-dragging":q?"":void 0,className:G.cn(o.trackClasses(a),Z),children:[t.jsx(h.Rail,{}),t.jsx(h.Fill,{from:c.at(n[0]),to:c.at(n[1]),dragging:q}),t.jsx(h.Marks,{points:I,at:c.at,filled:e=>e>=n[0]&&e<=n[1]}),n.map((e,s)=>t.jsx("span",{ref:H[s],role:"slider",tabIndex:a?void 0:0,"aria-labelledby":[S,w[s]].filter(Boolean).join(" "),"aria-describedby":de,"aria-valuemin":s===0?g:n[0],"aria-valuemax":s===0?n[1]:v,"aria-valuenow":e,"aria-valuetext":y.valueText(b(e),o.nearestPoint(I,e)?.label),"aria-orientation":"horizontal","aria-disabled":a||void 0,"aria-invalid":ie||void 0,"data-slider-thumb":s===0?"low":"high",onKeyDown:ce(s),className:o.thumbClasses(q,fe,_),style:{insetInlineStart:o.along(c.at(e))}},s))]}),t.jsx(h.SnapChips,{points:I,labelledBy:S,label:D["aria-label"],pressed:e=>e===n[0]||e===n[1],pick:ue,disabled:a,chipClassName:V}),t.jsx(h.Message,{id:N,helperText:P,errorMessage:R,disabled:a,className:se}),p&&t.jsxs(t.Fragment,{children:[t.jsx("input",{ref:z,type:"hidden",name:p,value:String(n[0]),disabled:a,readOnly:!0}),t.jsx("input",{type:"hidden",name:p,value:String(n[1]),disabled:a,readOnly:!0})]})]})}exports.RangeSlider=ye;

package/dist/components/molecules/RangeSlider/RangeSlider.d.ts

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
 import { SliderSnapPoint } from '../Slider/track';
 /** A range's two values, low then high. */
 export type RangeValue = [number, number];
@@ -36,8 +36,13 @@ export interface RangeSliderProps extends Omit<HTMLAttributes<HTMLDivElement>, "
      * thumb there. A point outside `min` to `max` is left out.
      */
     snapPoints?: SliderSnapPoint[];
-    /** The slider's name, shown above the track. */
-    label?: string;
+    /**
+     * The slider's name, shown above the track. A node as well as a string, so
+     * it can carry markup; it names the group and each thumb by reference, so
+     * what's read is its text. A consumer's own `aria-labelledby` names it
+     * instead.
+     */
+    label?: ReactNode;
     /** Supporting text under the slider. */
     helperText?: string;
     /** The message for an invalid value. Implies the error state. */

package/dist/components/molecules/RangeSlider/RangeSlider.js

@@ -1,33 +1,34 @@
 "use client";
 import { jsxs as B, jsx as i, Fragment as ue } from "react/jsx-runtime";
-import { useId as fe, useState as ge, useReducer as ve, useRef as g } from "react";
+import { useId as fe, useState as ge, useReducer as pe, useRef as g } from "react";
 import { cn as q } from "../../../lib/utils.js";
-import { withLabels as pe } from "../../../lib/labels.js";
-import { isFieldInvalid as he, withoutInvalidProps as me } from "../../../internal/field-invalid.js";
-import { useScale as we, useCommitted as ye, useFormReset as be, useTrackPress as Se, inRange as Re, along as $e, thumbClasses as ke, nearestPoint as Ie, trackClasses as xe, keyTarget as Be } from "../Slider/track.js";
-import { SliderHeader as je, Rail as Ce, Fill as Fe, Marks as Me, SnapChips as Ne, Message as Te } from "../Slider/track-parts.js";
+import { withLabels as ve } from "../../../lib/labels.js";
+import { isFieldInvalid as me, withoutInvalidProps as he } from "../../../internal/field-invalid.js";
+import { useScale as ye, useCommitted as we, useFormReset as be, useTrackPress as Se, inRange as Re, along as $e, thumbClasses as ke, nearestPoint as Ie, trackClasses as xe, keyTarget as Be } from "../Slider/track.js";
+import { SliderHeader as Fe, Rail as je, Fill as Ce, Marks as Me, SnapChips as Ne, Message as Te } from "../Slider/track-parts.js";
+import { useKeyFocus as Ke } from "../../../internal/key-focus.js";
 const Le = {
   low: "Minimum",
   high: "Maximum",
   valueText: (n, o) => o ? `${n}, ${o}` : n,
   range: (n, o) => `${n} – ${o}`
 }, Oe = ([n, o]) => n <= o ? [n, o] : [o, n];
-function qe({
+function Je({
   value: n,
   defaultValue: o,
   onChange: G,
-  onCommit: j,
+  onCommit: F,
   min: u = 0,
   max: f = 100,
-  step: C = 1,
+  step: j = 1,
   pageStep: J,
   snapPoints: Q = [],
-  label: F,
+  label: C,
   helperText: M,
-  errorMessage: w,
+  errorMessage: y,
   disabled: s = !1,
-  name: v,
-  formatValue: y = String,
+  name: p,
+  formatValue: w = String,
   labels: U,
   className: W,
   trackClassName: X,
@@ -40,19 +41,20 @@ function qe({
   "aria-describedby": te,
   ...N
 }) {
-  const p = pe(Le, U), h = fe(), T = `${h}-label`, L = `${h}-message`, b = [`${h}-low`, `${h}-high`], S = re ?? (F ? T : void 0), l = we(u, f, C, J), R = n !== void 0, [O, P] = ge(o ?? [u, f]), D = R ? n : O, t = Oe([l.clamp(D[0]), l.clamp(D[1])]), ne = he(!!w, { ...N, "aria-invalid": ee }), K = me(N), d = ye(t), [, ie] = ve((e) => e + 1, 0), $ = (e, r, a) => {
+  Ke();
+  const v = ve(Le, U), m = fe(), T = `${m}-label`, K = `${m}-message`, b = [`${m}-low`, `${m}-high`], S = re ?? (C ? T : void 0), l = ye(u, f, j, J), R = n !== void 0, [L, O] = ge(o ?? [u, f]), P = R ? n : L, t = Oe([l.clamp(P[0]), l.clamp(P[1])]), ne = me(!!y, { ...N, "aria-invalid": ee }), D = he(N), d = we(t), [, ie] = pe((e) => e + 1, 0), $ = (e, r, a) => {
     const c = d.current, x = e === 0 ? Math.min(r, c[1]) : Math.max(r, c[0]);
     if (x === c[e]) return;
-    const m = e === 0 ? [x, c[1]] : [c[0], x];
-    d.current = m, R ? ie() : P(m), G?.(m), a && j?.(m);
-  }, z = g(null), A = g(O);
+    const h = e === 0 ? [x, c[1]] : [c[0], x];
+    d.current = h, R ? ie() : O(h), G?.(h), a && F?.(h);
+  }, z = g(null), A = g(L);
   be(
     z,
     R,
     () => {
-      d.current = A.current, P(A.current);
+      d.current = A.current, O(A.current);
     },
-    v
+    p
   );
   const E = g(null), H = [g(null), g(null)], { dragging: k, rtl: oe, handlers: se } = Se({
     trackRef: E,
@@ -63,13 +65,13 @@ function qe({
     values: () => d.current,
     set: $,
     focus: (e) => H[e].current?.focus({ preventScroll: !0 }),
-    commit: () => j?.(d.current),
+    commit: () => F?.(d.current),
     own: { down: void 0, move: void 0, up: void 0, cancel: void 0, lost: void 0 }
   }), ae = (e) => (r) => {
     if (s) return;
     const a = d.current, c = Be(r, a[e], {
       scale: l,
-      step: C,
+      step: j,
       start: a[e],
       floor: e === 0 ? u : a[0],
       ceiling: e === 0 ? a[1] : f,
@@ -79,29 +81,29 @@ function qe({
   }, le = (e) => {
     const [r, a] = d.current;
     $(e <= r ? 0 : e >= a ? 1 : e - r <= a - e ? 0 : 1, e, !0);
-  }, I = Re(Q, u, f), ce = [M || w ? L : void 0, te].filter(Boolean).join(" ") || void 0, de = "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";
+  }, I = Re(Q, u, f), ce = [M || y ? K : void 0, te].filter(Boolean).join(" ") || void 0, de = "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";
   return /* @__PURE__ */ B(
     "div",
     {
-      ...K,
+      ...D,
       role: "group",
       "aria-labelledby": S,
       className: q("rst:font-ui rst:flex rst:min-w-0 rst:flex-col rst:gap-1.5", W),
       "data-range-slider": "",
       children: [
         /* @__PURE__ */ i(
-          je,
+          Fe,
           {
             labelId: T,
-            label: F,
-            readout: p.range(y(t[0]), y(t[1])),
+            label: C,
+            readout: v.range(w(t[0]), w(t[1])),
             empty: !1,
             disabled: s,
             labelClassName: _
           }
         ),
-        /* @__PURE__ */ i("span", { id: b[0], hidden: !0, children: p.low }),
-        /* @__PURE__ */ i("span", { id: b[1], hidden: !0, children: p.high }),
+        /* @__PURE__ */ i("span", { id: b[0], hidden: !0, children: v.low }),
+        /* @__PURE__ */ i("span", { id: b[1], hidden: !0, children: v.high }),
         /* @__PURE__ */ B(
           "div",
           {
@@ -110,8 +112,8 @@ function qe({
             "data-dragging": k ? "" : void 0,
             className: q(xe(s), X),
             children: [
-              /* @__PURE__ */ i(Ce, {}),
-              /* @__PURE__ */ i(Fe, { from: l.at(t[0]), to: l.at(t[1]), dragging: k }),
+              /* @__PURE__ */ i(je, {}),
+              /* @__PURE__ */ i(Ce, { from: l.at(t[0]), to: l.at(t[1]), dragging: k }),
               /* @__PURE__ */ i(Me, { points: I, at: l.at, filled: (e) => e >= t[0] && e <= t[1] }),
               t.map((e, r) => /* @__PURE__ */ i(
                 "span",
@@ -124,7 +126,7 @@ function qe({
                   "aria-valuemin": r === 0 ? u : t[0],
                   "aria-valuemax": r === 0 ? t[1] : f,
                   "aria-valuenow": e,
-                  "aria-valuetext": p.valueText(y(e), Ie(I, e)?.label),
+                  "aria-valuetext": v.valueText(w(e), Ie(I, e)?.label),
                   "aria-orientation": "horizontal",
                   "aria-disabled": s || void 0,
                   "aria-invalid": ne || void 0,
@@ -143,22 +145,22 @@ function qe({
           {
             points: I,
             labelledBy: S,
-            label: K["aria-label"],
+            label: D["aria-label"],
             pressed: (e) => e === t[0] || e === t[1],
             pick: le,
             disabled: s,
             chipClassName: Z
           }
         ),
-        /* @__PURE__ */ i(Te, { id: L, helperText: M, errorMessage: w, disabled: s, className: V }),
-        v && /* @__PURE__ */ B(ue, { children: [
-          /* @__PURE__ */ i("input", { ref: z, type: "hidden", name: v, value: String(t[0]), disabled: s, readOnly: !0 }),
-          /* @__PURE__ */ i("input", { type: "hidden", name: v, value: String(t[1]), disabled: s, readOnly: !0 })
+        /* @__PURE__ */ i(Te, { id: K, helperText: M, errorMessage: y, disabled: s, className: V }),
+        p && /* @__PURE__ */ B(ue, { children: [
+          /* @__PURE__ */ i("input", { ref: z, type: "hidden", name: p, value: String(t[0]), disabled: s, readOnly: !0 }),
+          /* @__PURE__ */ i("input", { type: "hidden", name: p, value: String(t[1]), disabled: s, readOnly: !0 })
         ] })
       ]
     }
   );
 }
 export {
-  qe as RangeSlider
+  Je as RangeSlider
 };

package/dist/components/molecules/Slider/Slider.cjs

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),c=require("react"),z=require("../../../lib/utils.cjs"),be=require("../../../lib/labels.cjs"),A=require("../../../internal/field-invalid.cjs"),s=require("./track.cjs"),d=require("./track-parts.cjs"),pe={notSet:"Not set",valueText:(v,f)=>f?`${v}, ${f}`:v};function ye({value:v,defaultValue:f,onChange:E,onCommit:m,min:i=0,max:o=100,step:x=1,pageStep:H,startValue:M,snapPoints:_=[],label:I,helperText:q,errorMessage:g,disabled:n=!1,name:b,formatValue:G=String,labels:J,className:Q,trackClassName:U,thumbClassName:W,chipClassName:X,labelClassName:Y,messageClassName:Z,"aria-invalid":V,"aria-labelledby":ee,onKeyDown:te,onPointerDown:re,onPointerMove:se,onPointerUp:ne,onPointerCancel:ie,onLostPointerCapture:le,...p}){const y=be.withLabels(pe,J),N=c.useId(),P=`${N}-label`,B=`${N}-message`,C=ee??(I?P:void 0),l=s.useScale(i,o,x,H),T=l.snap(M??i+(o-i)/2),S=v!==void 0,[$,D]=c.useState(f===void 0?T:f),F=S?v:$,t=F===null?null:l.clamp(F),ae=A.isFieldInvalid(!!g,{...p,"aria-invalid":V}),L=A.withoutInvalidProps(p),a=s.useCommitted(t),[,oe]=c.useReducer(e=>e+1,0),j=(e,u)=>{e!==a.current&&(a.current=e,S?oe():D(e),E?.(e),u&&e!==null&&m?.(e))},O=c.useRef(null),K=c.useRef($);s.useFormReset(O,S,()=>{a.current=K.current,D(K.current)},b);const h=c.useRef(null),{dragging:R,rtl:ue,handlers:ce}=s.useTrackPress({trackRef:h,disabled:n,scale:l,min:i,max:o,values:()=>[a.current],set:(e,u,ge)=>j(u,ge),focus:()=>h.current?.focus({preventScroll:!0}),commit:()=>a.current!==null&&m?.(a.current),own:{down:re,move:se,up:ne,cancel:ie,lost:le}}),de=e=>{if(te?.(e),n)return;const u=s.keyTarget(e,a.current,{scale:l,step:x,start:T,floor:i,ceiling:o,rtl:ue()});u!==void 0&&(e.preventDefault(),j(u,!0))},w=s.inRange(_,i,o),k=t===null?null:G(t),ve=k===null?y.notSet:y.valueText(k,s.nearestPoint(w,t)?.label),fe=[q||g?B:void 0,p["aria-describedby"]].filter(Boolean).join(" ")||void 0;return r.jsxs("div",{className:z.cn("rst:font-ui rst:flex rst:min-w-0 rst:flex-col rst:gap-1.5",Q),"data-slider":"",children:[r.jsx(d.SliderHeader,{labelId:P,label:I,readout:k??y.notSet,empty:t===null,disabled:n,labelClassName:Y}),r.jsxs("div",{...L,...ce,ref:h,role:"slider",tabIndex:n?void 0:0,"aria-labelledby":C,"aria-describedby":fe,"aria-valuemin":i,"aria-valuemax":o,"aria-valuenow":t??void 0,"aria-valuetext":ve,"aria-orientation":"horizontal","aria-disabled":n||void 0,"aria-invalid":ae||void 0,"data-dragging":R?"":void 0,"data-empty":t===null?"":void 0,onKeyDown:de,className:z.cn(s.trackClasses(n),"rst:group/slider rst:focus-visible:outline-hidden",t===null&&"rst:focus-visible:ring-2 rst:focus-visible:ring-ring",U),children:[r.jsx(d.Rail,{}),t!==null&&r.jsx(d.Fill,{from:0,to:l.at(t),dragging:R}),r.jsx(d.Marks,{points:w,at:l.at,filled:e=>t!==null&&t>=e}),t!==null&&r.jsx("span",{"aria-hidden":"true","data-slider-thumb":"",className:s.thumbClasses(R,"rst:group-focus-visible/slider:ring-2 rst:group-focus-visible/slider:ring-ring rst:group-focus-visible/slider:ring-offset-2 rst:ring-offset-background",W),style:{insetInlineStart:s.along(l.at(t))}})]}),r.jsx(d.SnapChips,{points:w,labelledBy:C,label:L["aria-label"],pressed:e=>t===e,pick:e=>j(e,!0),disabled:n,chipClassName:X}),r.jsx(d.Message,{id:B,helperText:q,errorMessage:g,disabled:n,className:Z}),b&&r.jsx("input",{ref:O,type:"hidden",name:b,value:t===null?"":String(t),disabled:n,readOnly:!0})]})}exports.Slider=ye;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),c=require("react"),z=require("../../../lib/utils.cjs"),be=require("../../../lib/labels.cjs"),A=require("../../../internal/field-invalid.cjs"),r=require("./track.cjs"),d=require("./track-parts.cjs"),pe=require("../../../internal/key-focus.cjs"),ye={notSet:"Not set",valueText:(v,f)=>f?`${v}, ${f}`:v};function Se({value:v,defaultValue:f,onChange:E,onCommit:m,min:i=0,max:a=100,step:q=1,pageStep:H,startValue:M,snapPoints:_=[],label:x,helperText:I,errorMessage:g,disabled:n=!1,name:b,formatValue:G=String,labels:J,className:Q,trackClassName:U,thumbClassName:W,chipClassName:X,labelClassName:Y,messageClassName:Z,"aria-invalid":V,"aria-labelledby":ee,onKeyDown:te,onPointerDown:se,onPointerMove:re,onPointerUp:ne,onPointerCancel:ie,onLostPointerCapture:le,...p}){pe.useKeyFocus();const y=be.withLabels(ye,J),F=c.useId(),N=`${F}-label`,P=`${F}-message`,B=ee??(x?N:void 0),l=r.useScale(i,a,q,H),C=l.snap(M??i+(a-i)/2),S=v!==void 0,[T,$]=c.useState(f===void 0?C:f),D=S?v:T,t=D===null?null:l.clamp(D),oe=A.isFieldInvalid(!!g,{...p,"aria-invalid":V}),K=A.withoutInvalidProps(p),o=r.useCommitted(t),[,ae]=c.useReducer(e=>e+1,0),j=(e,u)=>{e!==o.current&&(o.current=e,S?ae():$(e),E?.(e),u&&e!==null&&m?.(e))},L=c.useRef(null),O=c.useRef(T);r.useFormReset(L,S,()=>{o.current=O.current,$(O.current)},b);const h=c.useRef(null),{dragging:R,rtl:ue,handlers:ce}=r.useTrackPress({trackRef:h,disabled:n,scale:l,min:i,max:a,values:()=>[o.current],set:(e,u,ge)=>j(u,ge),focus:()=>h.current?.focus({preventScroll:!0}),commit:()=>o.current!==null&&m?.(o.current),own:{down:se,move:re,up:ne,cancel:ie,lost:le}}),de=e=>{if(te?.(e),n)return;const u=r.keyTarget(e,o.current,{scale:l,step:q,start:C,floor:i,ceiling:a,rtl:ue()});u!==void 0&&(e.preventDefault(),j(u,!0))},k=r.inRange(_,i,a),w=t===null?null:G(t),ve=w===null?y.notSet:y.valueText(w,r.nearestPoint(k,t)?.label),fe=[I||g?P:void 0,p["aria-describedby"]].filter(Boolean).join(" ")||void 0;return s.jsxs("div",{className:z.cn("rst:font-ui rst:flex rst:min-w-0 rst:flex-col rst:gap-1.5",Q),"data-slider":"",children:[s.jsx(d.SliderHeader,{labelId:N,label:x,readout:w??y.notSet,empty:t===null,disabled:n,labelClassName:Y}),s.jsxs("div",{...K,...ce,ref:h,role:"slider",tabIndex:n?void 0:0,"aria-labelledby":B,"aria-describedby":fe,"aria-valuemin":i,"aria-valuemax":a,"aria-valuenow":t??void 0,"aria-valuetext":ve,"aria-orientation":"horizontal","aria-disabled":n||void 0,"aria-invalid":oe||void 0,"data-dragging":R?"":void 0,"data-empty":t===null?"":void 0,onKeyDown:de,className:z.cn(r.trackClasses(n),"rst:group/slider rst:focus-visible:outline-hidden",t===null&&"rst:focus-visible:ring-2 rst:focus-visible:ring-ring",U),children:[s.jsx(d.Rail,{}),t!==null&&s.jsx(d.Fill,{from:0,to:l.at(t),dragging:R}),s.jsx(d.Marks,{points:k,at:l.at,filled:e=>t!==null&&t>=e}),t!==null&&s.jsx("span",{"aria-hidden":"true","data-slider-thumb":"",className:r.thumbClasses(R,"rst:group-focus-visible/slider:ring-2 rst:group-focus-visible/slider:ring-ring rst:group-focus-visible/slider:ring-offset-2 rst:ring-offset-background",W),style:{insetInlineStart:r.along(l.at(t))}})]}),s.jsx(d.SnapChips,{points:k,labelledBy:B,label:K["aria-label"],pressed:e=>t===e,pick:e=>j(e,!0),disabled:n,chipClassName:X}),s.jsx(d.Message,{id:P,helperText:I,errorMessage:g,disabled:n,className:Z}),b&&s.jsx("input",{ref:L,type:"hidden",name:b,value:t===null?"":String(t),disabled:n,readOnly:!0})]})}exports.Slider=Se;

package/dist/components/molecules/Slider/Slider.d.ts

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
 import { SliderSnapPoint } from './track';
 export type { SliderSnapPoint };
 /** Every word Slider says. Pass any of them in `labels` to replace it. */
@@ -46,8 +46,12 @@ export interface SliderProps extends Omit<HTMLAttributes<HTMLDivElement>, "onCha
      * `max` is left out, since the track can't show it.
      */
     snapPoints?: SliderSnapPoint[];
-    /** The slider's name, shown above the track. */
-    label?: string;
+    /**
+     * The slider's name, shown above the track. A node as well as a string, so
+     * it can carry markup; it names the slider by reference, so what's read is
+     * its text. A consumer's own `aria-labelledby` names it instead.
+     */
+    label?: ReactNode;
     /** Supporting text under the slider. */
     helperText?: string;
     /** The message for an invalid value. Implies the error state. */

package/dist/components/molecules/Slider/Slider.js

@@ -4,13 +4,14 @@ import { useId as ve, useState as ge, useReducer as pe, useRef as w } from "reac
 import { cn as A } from "../../../lib/utils.js";
 import { withLabels as me } from "../../../lib/labels.js";
 import { isFieldInvalid as be, withoutInvalidProps as ye } from "../../../internal/field-invalid.js";
-import { useScale as Se, useCommitted as he, useFormReset as we, useTrackPress as ke, inRange as Re, nearestPoint as Ie, along as Ne, thumbClasses as Be, trackClasses as Ce, keyTarget as $e } from "./track.js";
-import { SliderHeader as je, Rail as De, Fill as Fe, Marks as Le, SnapChips as Pe, Message as Te } from "./track-parts.js";
-const Ke = {
+import { useScale as Se, useCommitted as he, useFormReset as we, useTrackPress as ke, inRange as Re, nearestPoint as Ie, along as Ne, thumbClasses as Be, trackClasses as Ce, keyTarget as Fe } from "./track.js";
+import { SliderHeader as $e, Rail as je, Fill as De, Marks as Ke, SnapChips as Le, Message as Pe } from "./track-parts.js";
+import { useKeyFocus as Te } from "../../../internal/key-focus.js";
+const Oe = {
   notSet: "Not set",
   valueText: (u, c) => c ? `${u}, ${c}` : u
 };
-function Ge({
+function Me({
   value: u,
   defaultValue: c,
   onChange: E,
@@ -44,44 +45,45 @@ function Ge({
   onLostPointerCapture: ne,
   ...v
 }) {
-  const g = me(Ke, G), B = ve(), C = `${B}-label`, $ = `${B}-message`, j = Z ?? (I ? C : void 0), l = Se(n, o, R, H), D = l.snap(_ ?? n + (o - n) / 2), p = u !== void 0, [F, L] = ge(c === void 0 ? D : c), P = p ? u : F, r = P === null ? null : l.clamp(P), le = be(!!d, { ...v, "aria-invalid": Y }), T = ye(v), s = he(r), [, se] = pe((e) => e + 1, 0), m = (e, a) => {
-    e !== s.current && (s.current = e, p ? se() : L(e), E?.(e), a && e !== null && k?.(e));
-  }, K = w(null), O = w(F);
+  Te();
+  const g = me(Oe, G), B = ve(), C = `${B}-label`, F = `${B}-message`, $ = Z ?? (I ? C : void 0), s = Se(n, o, R, H), j = s.snap(_ ?? n + (o - n) / 2), p = u !== void 0, [D, K] = ge(c === void 0 ? j : c), L = p ? u : D, r = L === null ? null : s.clamp(L), se = be(!!d, { ...v, "aria-invalid": Y }), P = ye(v), l = he(r), [, le] = pe((e) => e + 1, 0), m = (e, a) => {
+    e !== l.current && (l.current = e, p ? le() : K(e), E?.(e), a && e !== null && k?.(e));
+  }, T = w(null), O = w(D);
   we(
-    K,
+    T,
     p,
     () => {
-      s.current = O.current, L(O.current);
+      l.current = O.current, K(O.current);
     },
     f
   );
   const b = w(null), { dragging: y, rtl: oe, handlers: ae } = ke({
     trackRef: b,
     disabled: t,
-    scale: l,
+    scale: s,
     min: n,
     max: o,
-    values: () => [s.current],
+    values: () => [l.current],
     set: (e, a, fe) => m(a, fe),
     focus: () => b.current?.focus({ preventScroll: !0 }),
-    commit: () => s.current !== null && k?.(s.current),
+    commit: () => l.current !== null && k?.(l.current),
     own: { down: ee, move: re, up: te, cancel: ie, lost: ne }
   }), ue = (e) => {
     if (V?.(e), t) return;
-    const a = $e(e, s.current, { scale: l, step: R, start: D, floor: n, ceiling: o, rtl: oe() });
+    const a = Fe(e, l.current, { scale: s, step: R, start: j, floor: n, ceiling: o, rtl: oe() });
     a !== void 0 && (e.preventDefault(), m(a, !0));
-  }, S = Re(q, n, o), h = r === null ? null : x(r), ce = h === null ? g.notSet : g.valueText(h, Ie(S, r)?.label), de = [N || d ? $ : void 0, v["aria-describedby"]].filter(Boolean).join(" ") || void 0;
+  }, S = Re(q, n, o), h = r === null ? null : x(r), ce = h === null ? g.notSet : g.valueText(h, Ie(S, r)?.label), de = [N || d ? F : void 0, v["aria-describedby"]].filter(Boolean).join(" ") || void 0;
   return /* @__PURE__ */ z("div", { className: A("rst:font-ui rst:flex rst:min-w-0 rst:flex-col rst:gap-1.5", J), "data-slider": "", children: [
-    /* @__PURE__ */ i(je, { labelId: C, label: I, readout: h ?? g.notSet, empty: r === null, disabled: t, labelClassName: W }),
+    /* @__PURE__ */ i($e, { labelId: C, label: I, readout: h ?? g.notSet, empty: r === null, disabled: t, labelClassName: W }),
     /* @__PURE__ */ z(
       "div",
       {
-        ...T,
+        ...P,
         ...ae,
         ref: b,
         role: "slider",
         tabIndex: t ? void 0 : 0,
-        "aria-labelledby": j,
+        "aria-labelledby": $,
         "aria-describedby": de,
         "aria-valuemin": n,
         "aria-valuemax": o,
@@ -89,7 +91,7 @@ function Ge({
         "aria-valuetext": ce,
         "aria-orientation": "horizontal",
         "aria-disabled": t || void 0,
-        "aria-invalid": le || void 0,
+        "aria-invalid": se || void 0,
         "data-dragging": y ? "" : void 0,
         "data-empty": r === null ? "" : void 0,
         onKeyDown: ue,
@@ -100,29 +102,29 @@ function Ge({
           M
         ),
         children: [
-          /* @__PURE__ */ i(De, {}),
-          r !== null && /* @__PURE__ */ i(Fe, { from: 0, to: l.at(r), dragging: y }),
-          /* @__PURE__ */ i(Le, { points: S, at: l.at, filled: (e) => r !== null && r >= e }),
-          r !== null && /* @__PURE__ */ i("span", { "aria-hidden": "true", "data-slider-thumb": "", className: Be(y, "rst:group-focus-visible/slider:ring-2 rst:group-focus-visible/slider:ring-ring rst:group-focus-visible/slider:ring-offset-2 rst:ring-offset-background", Q), style: { insetInlineStart: Ne(l.at(r)) } })
+          /* @__PURE__ */ i(je, {}),
+          r !== null && /* @__PURE__ */ i(De, { from: 0, to: s.at(r), dragging: y }),
+          /* @__PURE__ */ i(Ke, { points: S, at: s.at, filled: (e) => r !== null && r >= e }),
+          r !== null && /* @__PURE__ */ i("span", { "aria-hidden": "true", "data-slider-thumb": "", className: Be(y, "rst:group-focus-visible/slider:ring-2 rst:group-focus-visible/slider:ring-ring rst:group-focus-visible/slider:ring-offset-2 rst:ring-offset-background", Q), style: { insetInlineStart: Ne(s.at(r)) } })
         ]
       }
     ),
     /* @__PURE__ */ i(
-      Pe,
+      Le,
       {
         points: S,
-        labelledBy: j,
-        label: T["aria-label"],
+        labelledBy: $,
+        label: P["aria-label"],
         pressed: (e) => r === e,
         pick: (e) => m(e, !0),
         disabled: t,
         chipClassName: U
       }
     ),
-    /* @__PURE__ */ i(Te, { id: $, helperText: N, errorMessage: d, disabled: t, className: X }),
-    f && /* @__PURE__ */ i("input", { ref: K, type: "hidden", name: f, value: r === null ? "" : String(r), disabled: t, readOnly: !0 })
+    /* @__PURE__ */ i(Pe, { id: F, helperText: N, errorMessage: d, disabled: t, className: X }),
+    f && /* @__PURE__ */ i("input", { ref: T, type: "hidden", name: f, value: r === null ? "" : String(r), disabled: t, readOnly: !0 })
   ] });
 }
 export {
-  Ge as Slider
+  Me as Slider
 };

package/dist/components/molecules/Slider/track-parts.d.ts

@@ -1,8 +1,9 @@
+import { ReactNode } from 'react';
 import { SliderSnapPoint } from './track';
 /** The label and the visible number above the track. The number is hidden from screen readers, which hear it as the value. */
 export declare function SliderHeader(props: {
     labelId: string;
-    label?: string;
+    label?: ReactNode;
     readout: string;
     empty: boolean;
     disabled: boolean;

package/dist/components/organisms/Dialog/Dialog.cjs

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),t=require("react"),j=require("../../../node_modules/@fortawesome/react-fontawesome/dist/index.cjs"),w=require("../../../node_modules/@fortawesome/free-solid-svg-icons/index.cjs"),o=require("../../../node_modules/class-variance-authority/dist/index.cjs"),s=require("../../../lib/utils.cjs"),N=require("../../../lib/labels.cjs"),_=require("../../../internal/page-inert.cjs"),a=require("../../../node_modules/@headlessui/react/dist/components/dialog/dialog.cjs"),d=require("../../../node_modules/@headlessui/react/dist/components/transition/transition.cjs"),q=o.cva("rst:relative rst:w-full rst:transform rst:overflow-hidden rst:rounded-2xl rst:p-6 rst:text-left rst:align-middle rst:elevation-overlay rst:transition-all rst:border",{variants:{size:{xs:"rst:max-w-xs",sm:"rst:max-w-sm",md:"rst:max-w-md",lg:"rst:max-w-lg",xl:"rst:max-w-xl","2xl":"rst:max-w-2xl","3xl":"rst:max-w-3xl",full:"rst:max-w-[95vw] rst:m-4"},variant:{white:"rst:bg-[var(--roster-popover-bg)] rst:border-[var(--roster-popover-border)] rst:text-[var(--roster-popover-text)]",slate:"rst:bg-gray-700 rst:border-gray-600 rst:text-gray-100 rst:dark:bg-gray-900 rst:dark:border-gray-800 rst:[--roster-ring:var(--roster-primary-400,#5ea3de)] rst:[--roster-ring-offset:var(--roster-gray-700,#44403c)] rst:dark:[--roster-ring-offset:var(--roster-gray-900,#1c1917)] rst:[--roster-control-text:var(--roster-gray-100,#f5f5f4)] rst:[--roster-control-border:var(--roster-gray-400,#a8a29e)] rst:[--roster-control-border-focus:var(--roster-primary-400,#5ea3de)]",primary:"rst:bg-primary-700 rst:border-primary-600 rst:text-primary-700-ink rst:dark:text-white rst:dark:bg-primary-950 rst:dark:border-primary-900 rst:[--roster-ring:var(--roster-primary-400,#5ea3de)] rst:[--roster-ring-offset:var(--roster-primary-700,#084063)] rst:dark:[--roster-ring-offset:var(--roster-primary-950,#021724)] rst:[--roster-control-text:var(--roster-gray-100,#f5f5f4)] rst:[--roster-control-border:var(--roster-gray-400,#a8a29e)] rst:[--roster-control-border-focus:var(--roster-primary-400,#5ea3de)]",glass:"rst:bg-white/80 rst:border-white/20 rst:backdrop-blur-xl rst:text-gray-900 rst:dark:bg-slate-900/80 rst:dark:border-slate-700/50 rst:dark:text-white"},status:{default:"",destructive:"rst:border-t-4 rst:border-t-error-500",success:"rst:border-t-4 rst:border-t-success-500"}},defaultVariants:{size:"md",variant:"white",status:"default"}}),F=o.cva("rst:text-xl rst:font-bold rst:leading-6 rst:text-inherit"),T=o.cva("rst:mt-1 rst:text-sm rst:text-inherit rst:opacity-75"),D=o.cva("rst:inline-flex rst:size-11 rst:shrink-0 rst:items-center rst:justify-center rst:-m-3 rst:cursor-pointer rst:rounded-md rst:bg-transparent rst:text-inherit rst:opacity-50 rst:hover:opacity-100 rst:focus:outline-hidden rst:focus-visible:ring-2 rst:focus-visible:ring-ring rst:focus-visible:ring-offset-2 rst:ring-offset-background rst:transition-opacity"),L={close:"Close dialog"},V=({isOpen:u,onClose:i,title:m,description:n,size:x,variant:l,status:b,children:g,className:f,onAfterClose:v,labels:p})=>{const y=N.withLabels(L,p),[h,k]=t.useState(!1);t.useLayoutEffect(()=>{k(!0)},[]);const e=u&&h,c=t.useRef(null);return t.useLayoutEffect(()=>{if(e)return _.lockPage(c.current)},[e]),r.jsxs(r.Fragment,{children:[e&&r.jsx("span",{ref:c,hidden:!0}),r.jsxs(a.Dialog,{open:e,as:"div",className:"rst:font-ui rst:relative rst:z-50",onClose:i,children:[r.jsx(d.TransitionChild,{as:t.Fragment,enter:"rst:ease-out rst:duration-300",enterFrom:"rst:opacity-0",enterTo:"rst:opacity-100",leave:"rst:ease-in rst:duration-200",leaveFrom:"rst:opacity-100",leaveTo:"rst:opacity-0",children:r.jsx(a.DialogBackdrop,{className:s.cn("rst:fixed rst:inset-0 rst:transition-opacity",l==="glass"?"rst:bg-[var(--roster-backdrop,color-mix(in_oklab,oklch(20.8%_0.042_265.755)_40%,transparent))] rst:dark:bg-[var(--roster-backdrop,color-mix(in_oklab,var(--roster-black,#1e1c1a)_60%,transparent))]":"rst:bg-[var(--roster-backdrop,color-mix(in_oklab,oklch(20.8%_0.042_265.755)_60%,transparent))] rst:dark:bg-[var(--roster-backdrop,color-mix(in_oklab,var(--roster-black,#1e1c1a)_80%,transparent))] rst:backdrop-blur-backdrop")})}),r.jsx("div",{className:"rst:fixed rst:inset-0 rst:overflow-y-auto",children:r.jsx("div",{className:"rst:flex rst:min-h-full rst:items-center rst:justify-center rst:p-4 rst:text-center",children:r.jsx(d.TransitionChild,{as:t.Fragment,enter:"rst:ease-out rst:duration-300",enterFrom:"rst:opacity-0 rst:scale-95",enterTo:"rst:opacity-100 rst:scale-100",leave:"rst:ease-in rst:duration-200",leaveFrom:"rst:opacity-100 rst:scale-100",leaveTo:"rst:opacity-0 rst:scale-95",afterLeave:v,children:r.jsxs(a.DialogPanel,{className:s.cn(q({size:x,variant:l,status:b}),f),children:[r.jsxs("div",{className:"rst:flex rst:items-start rst:justify-between",children:[r.jsxs("div",{children:[r.jsx(a.DialogTitle,{as:"h2",className:s.cn(F()),children:m}),n&&r.jsx("p",{className:s.cn(T()),children:n})]}),r.jsx("div",{className:"rst:ml-4 rst:flex rst:shrink-0",children:r.jsx("button",{type:"button",onClick:i,className:s.cn(D()),"aria-label":y.close,children:r.jsx(j.FontAwesomeIcon,{icon:w.faXmark,className:"rst:h-5 rst:w-5"})})})]}),r.jsx("div",{className:"rst:mt-6",children:g})]})})})})]})]})};exports.Dialog=V;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),t=require("react"),j=require("../../../node_modules/@fortawesome/react-fontawesome/dist/index.cjs"),w=require("../../../node_modules/@fortawesome/free-solid-svg-icons/index.cjs"),o=require("../../../node_modules/class-variance-authority/dist/index.cjs"),s=require("../../../lib/utils.cjs"),N=require("../../../lib/labels.cjs"),_=require("../../../internal/page-inert.cjs"),q=require("../../../internal/key-focus.cjs"),a=require("../../../node_modules/@headlessui/react/dist/components/dialog/dialog.cjs"),d=require("../../../node_modules/@headlessui/react/dist/components/transition/transition.cjs"),F=o.cva("rst:relative rst:w-full rst:transform rst:overflow-hidden rst:rounded-2xl rst:p-6 rst:text-left rst:align-middle rst:elevation-overlay rst:transition-all rst:border",{variants:{size:{xs:"rst:max-w-xs",sm:"rst:max-w-sm",md:"rst:max-w-md",lg:"rst:max-w-lg",xl:"rst:max-w-xl","2xl":"rst:max-w-2xl","3xl":"rst:max-w-3xl",full:"rst:max-w-[95vw] rst:m-4"},variant:{white:"rst:bg-[var(--roster-popover-bg)] rst:border-[var(--roster-popover-border)] rst:text-[var(--roster-popover-text)]",slate:"rst:bg-gray-700 rst:border-gray-600 rst:text-gray-100 rst:dark:bg-gray-900 rst:dark:border-gray-800 rst:[--roster-ring:var(--roster-primary-400,#5ea3de)] rst:[--roster-ring-offset:var(--roster-gray-700,#44403c)] rst:dark:[--roster-ring-offset:var(--roster-gray-900,#1c1917)] rst:[--roster-control-text:var(--roster-gray-100,#f5f5f4)] rst:[--roster-control-border:var(--roster-gray-400,#a8a29e)] rst:[--roster-control-border-focus:var(--roster-primary-400,#5ea3de)]",primary:"rst:bg-primary-700 rst:border-primary-600 rst:text-primary-700-ink rst:dark:text-white rst:dark:bg-primary-950 rst:dark:border-primary-900 rst:[--roster-ring:var(--roster-primary-400,#5ea3de)] rst:[--roster-ring-offset:var(--roster-primary-700,#084063)] rst:dark:[--roster-ring-offset:var(--roster-primary-950,#021724)] rst:[--roster-control-text:var(--roster-gray-100,#f5f5f4)] rst:[--roster-control-border:var(--roster-gray-400,#a8a29e)] rst:[--roster-control-border-focus:var(--roster-primary-400,#5ea3de)]",glass:"rst:bg-white/80 rst:border-white/20 rst:backdrop-blur-xl rst:text-gray-900 rst:dark:bg-slate-900/80 rst:dark:border-slate-700/50 rst:dark:text-white"},status:{default:"",destructive:"rst:border-t-4 rst:border-t-error-500",success:"rst:border-t-4 rst:border-t-success-500"}},defaultVariants:{size:"md",variant:"white",status:"default"}}),T=o.cva("rst:text-xl rst:font-bold rst:leading-6 rst:text-inherit"),D=o.cva("rst:mt-1 rst:text-sm rst:text-inherit rst:opacity-75"),L=o.cva("rst:inline-flex rst:size-11 rst:shrink-0 rst:items-center rst:justify-center rst:-m-3 rst:cursor-pointer rst:rounded-md rst:bg-transparent rst:text-inherit rst:opacity-50 rst:hover:opacity-100 rst:focus:outline-hidden rst:focus-visible:ring-2 rst:focus-visible:ring-ring rst:focus-visible:ring-offset-2 rst:ring-offset-background rst:transition-opacity"),V={close:"Close dialog"},z=({isOpen:u,onClose:i,title:m,description:n,size:x,variant:l,status:b,children:g,className:f,onAfterClose:v,labels:p})=>{q.useKeyFocus();const y=N.withLabels(V,p),[h,k]=t.useState(!1);t.useLayoutEffect(()=>{k(!0)},[]);const e=u&&h,c=t.useRef(null);return t.useLayoutEffect(()=>{if(e)return _.lockPage(c.current)},[e]),r.jsxs(r.Fragment,{children:[e&&r.jsx("span",{ref:c,hidden:!0}),r.jsxs(a.Dialog,{open:e,as:"div",className:"rst:font-ui rst:relative rst:z-50",onClose:i,children:[r.jsx(d.TransitionChild,{as:t.Fragment,enter:"rst:ease-out rst:duration-300",enterFrom:"rst:opacity-0",enterTo:"rst:opacity-100",leave:"rst:ease-in rst:duration-200",leaveFrom:"rst:opacity-100",leaveTo:"rst:opacity-0",children:r.jsx(a.DialogBackdrop,{className:s.cn("rst:fixed rst:inset-0 rst:transition-opacity",l==="glass"?"rst:bg-[var(--roster-backdrop,color-mix(in_oklab,oklch(20.8%_0.042_265.755)_40%,transparent))] rst:dark:bg-[var(--roster-backdrop,color-mix(in_oklab,var(--roster-black,#1e1c1a)_60%,transparent))]":"rst:bg-[var(--roster-backdrop,color-mix(in_oklab,oklch(20.8%_0.042_265.755)_60%,transparent))] rst:dark:bg-[var(--roster-backdrop,color-mix(in_oklab,var(--roster-black,#1e1c1a)_80%,transparent))] rst:backdrop-blur-backdrop")})}),r.jsx("div",{className:"rst:fixed rst:inset-0 rst:overflow-y-auto",children:r.jsx("div",{className:"rst:flex rst:min-h-full rst:items-center rst:justify-center rst:p-4 rst:text-center",children:r.jsx(d.TransitionChild,{as:t.Fragment,enter:"rst:ease-out rst:duration-300",enterFrom:"rst:opacity-0 rst:scale-95",enterTo:"rst:opacity-100 rst:scale-100",leave:"rst:ease-in rst:duration-200",leaveFrom:"rst:opacity-100 rst:scale-100",leaveTo:"rst:opacity-0 rst:scale-95",afterLeave:v,children:r.jsxs(a.DialogPanel,{className:s.cn(F({size:x,variant:l,status:b}),f),children:[r.jsxs("div",{className:"rst:flex rst:items-start rst:justify-between",children:[r.jsxs("div",{children:[r.jsx(a.DialogTitle,{as:"h2",className:s.cn(T()),children:m}),n&&r.jsx("p",{className:s.cn(D()),children:n})]}),r.jsx("div",{className:"rst:ml-4 rst:flex rst:shrink-0",children:r.jsx("button",{type:"button",onClick:i,className:s.cn(L()),"aria-label":y.close,children:r.jsx(j.FontAwesomeIcon,{icon:w.faXmark,className:"rst:h-5 rst:w-5"})})})]}),r.jsx("div",{className:"rst:mt-6",children:g})]})})})})]})]})};exports.Dialog=z;

package/dist/components/organisms/Dialog/Dialog.js

@@ -7,9 +7,10 @@ import { cva as a } from "../../../node_modules/class-variance-authority/dist/in
 import { cn as s } from "../../../lib/utils.js";
 import { withLabels as j } from "../../../lib/labels.js";
 import { lockPage as z } from "../../../internal/page-inert.js";
-import { Dialog as D, DialogBackdrop as V, DialogPanel as A, DialogTitle as B } from "../../../node_modules/@headlessui/react/dist/components/dialog/dialog.js";
+import { useKeyFocus as D } from "../../../internal/key-focus.js";
+import { Dialog as V, DialogBackdrop as A, DialogPanel as B, DialogTitle as C } from "../../../node_modules/@headlessui/react/dist/components/dialog/dialog.js";
 import { TransitionChild as m } from "../../../node_modules/@headlessui/react/dist/components/transition/transition.js";
-const C = /* @__PURE__ */ a(
+const E = /* @__PURE__ */ a(
   "rst:relative rst:w-full rst:transform rst:overflow-hidden rst:rounded-2xl rst:p-6 rst:text-left rst:align-middle rst:elevation-overlay rst:transition-all rst:border",
   {
     variants: {
@@ -78,9 +79,9 @@ const C = /* @__PURE__ */ a(
       status: "default"
     }
   }
-), E = /* @__PURE__ */ a("rst:text-xl rst:font-bold rst:leading-6 rst:text-inherit"), P = /* @__PURE__ */ a("rst:mt-1 rst:text-sm rst:text-inherit rst:opacity-75"), R = /* @__PURE__ */ a(
+), P = /* @__PURE__ */ a("rst:text-xl rst:font-bold rst:leading-6 rst:text-inherit"), R = /* @__PURE__ */ a("rst:mt-1 rst:text-sm rst:text-inherit rst:opacity-75"), S = /* @__PURE__ */ a(
   "rst:inline-flex rst:size-11 rst:shrink-0 rst:items-center rst:justify-center rst:-m-3 rst:cursor-pointer rst:rounded-md rst:bg-transparent rst:text-inherit rst:opacity-50 rst:hover:opacity-100 rst:focus:outline-hidden rst:focus-visible:ring-2 rst:focus-visible:ring-ring rst:focus-visible:ring-offset-2 rst:ring-offset-background rst:transition-opacity"
-), S = { close: "Close dialog" }, K = ({
+), I = { close: "Close dialog" }, W = ({
   isOpen: f,
   onClose: o,
   title: p,
@@ -88,12 +89,13 @@ const C = /* @__PURE__ */ a(
   size: b,
   variant: n,
   status: g,
-  children: v,
-  className: u,
+  children: u,
+  className: v,
   onAfterClose: x,
   labels: y
 }) => {
-  const h = j(S, y), [k, w] = _(!1);
+  D();
+  const h = j(I, y), [k, w] = _(!1);
   c(() => {
     w(!0);
   }, []);
@@ -104,7 +106,7 @@ const C = /* @__PURE__ */ a(
   }, [e]), /* @__PURE__ */ t(N, { children: [
     e && /* @__PURE__ */ r("span", { ref: l, hidden: !0 }),
     /* @__PURE__ */ t(
-      D,
+      V,
       {
         open: e,
         as: "div",
@@ -122,7 +124,7 @@ const C = /* @__PURE__ */ a(
               leaveFrom: "rst:opacity-100",
               leaveTo: "rst:opacity-0",
               children: /* @__PURE__ */ r(
-                V,
+                A,
                 {
                   className: s(
                     "rst:fixed rst:inset-0 rst:transition-opacity",
@@ -144,30 +146,30 @@ const C = /* @__PURE__ */ a(
               leaveTo: "rst:opacity-0 rst:scale-95",
               afterLeave: x,
               children: /* @__PURE__ */ t(
-                A,
+                B,
                 {
                   className: s(
-                    C({ size: b, variant: n, status: g }),
-                    u
+                    E({ size: b, variant: n, status: g }),
+                    v
                   ),
                   children: [
                     /* @__PURE__ */ t("div", { className: "rst:flex rst:items-start rst:justify-between", children: [
                       /* @__PURE__ */ t("div", { children: [
-                        /* @__PURE__ */ r(B, { as: "h2", className: s(E()), children: p }),
-                        i && /* @__PURE__ */ r("p", { className: s(P()), children: i })
+                        /* @__PURE__ */ r(C, { as: "h2", className: s(P()), children: p }),
+                        i && /* @__PURE__ */ r("p", { className: s(R()), children: i })
                       ] }),
                       /* @__PURE__ */ r("div", { className: "rst:ml-4 rst:flex rst:shrink-0", children: /* @__PURE__ */ r(
                         "button",
                         {
                           type: "button",
                           onClick: o,
-                          className: s(R()),
+                          className: s(S()),
                           "aria-label": h.close,
                           children: /* @__PURE__ */ r(L, { icon: T, className: "rst:h-5 rst:w-5" })
                         }
                       ) })
                     ] }),
-                    /* @__PURE__ */ r("div", { className: "rst:mt-6", children: v })
+                    /* @__PURE__ */ r("div", { className: "rst:mt-6", children: u })
                   ]
                 }
               )
@@ -179,5 +181,5 @@ const C = /* @__PURE__ */ a(
   ] });
 };
 export {
-  K as Dialog
+  W as Dialog
 };

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"),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;
+"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;