@blakesteve/roster 5.11.0 → 5.13.0

package/dist/components/molecules/LiquidTabs/LiquidNav.d.ts

@@ -1,6 +1,7 @@
 import { ComponentType, MouseEvent, ReactNode } from 'react';
 import { LiquidSize, LiquidVariant } from './liquid-pill';
 import { TabItem } from './LiquidTabs';
+import { LiquidTabsLabels } from './liquid-count';
 export interface LiquidNavItem extends Omit<TabItem, "panelId"> {
     href: string;
 }
@@ -19,6 +20,12 @@ export interface LiquidNavLinkProps {
     className: string;
     children: ReactNode;
     "aria-current"?: "page";
+    /**
+     * The link's whole name when it has a count and a string label: "Inbox, 3
+     * items". Forward it to the `<a>`; a component that doesn't still gets a
+     * name with the count in it, from text hidden beside the label.
+     */
+    "aria-label"?: string;
     onClick: (event: MouseEvent<HTMLAnchorElement>) => void;
     "data-tab-id": string;
 }
@@ -49,6 +56,8 @@ export interface LiquidNavProps {
     "aria-label"?: string;
     "aria-labelledby"?: string;
     className?: string;
+    /** Every word a count says, with English defaults: see `TabItem.count`. */
+    labels?: Partial<LiquidTabsLabels>;
 }
 /**
  * `LiquidTabs`' look, for navigation between routes: a `nav` of links rather
@@ -58,5 +67,7 @@ export interface LiquidNavProps {
  * things to assistive technology. Tabs switch panels on the same page and take
  * one tab stop with arrow keys between them; links go somewhere, and each is
  * its own tab stop, as in any nav.
+ *
+ * An item can carry a `count`, as a tab does: see `TabItem.count`.
  */
-export declare function LiquidNav({ items, activeTab, onChange, linkComponent, variant, fullWidth, size, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, className, }: LiquidNavProps): import("react/jsx-runtime").JSX.Element;
+export declare function LiquidNav({ items, activeTab, onChange, linkComponent, variant, fullWidth, size, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, className, labels, }: LiquidNavProps): import("react/jsx-runtime").JSX.Element;

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

@@ -1,70 +1,76 @@
 "use client";
-import { jsxs as q, jsx as u } from "react/jsx-runtime";
-import { useRef as c } from "react";
-import { useLiquidPill as I, LIQUID_STRIP_STYLE as N, LIQUID_PILL_STYLE as h, liquidPillClassName as P, liquidItemClassName as j, liquidStripClassName as x } from "./liquid-pill.js";
-import { cn as C } from "../../../lib/utils.js";
-function K({
-  href: e,
-  className: r,
-  children: n,
-  onClick: d,
-  "aria-current": l,
-  "data-tab-id": t
+import { jsxs as q, jsx as o } from "react/jsx-runtime";
+import { useRef as m } from "react";
+import { useLiquidPill as C, LIQUID_STRIP_STYLE as _, LIQUID_PILL_STYLE as P, liquidPillClassName as S, liquidItemClassName as j, liquidStripClassName as x } from "./liquid-pill.js";
+import { LiquidCount as D } from "./LiquidCount.js";
+import { shownCount as K, countName as R, LIQUID_COUNT_LABELS as U } from "./liquid-count.js";
+import { withLabels as k } from "../../../lib/labels.js";
+import { cn as E } from "../../../lib/utils.js";
+function Q({
+  href: r,
+  className: e,
+  children: s,
+  onClick: u,
+  "aria-current": i,
+  "aria-label": t,
+  "data-tab-id": d
 }) {
-  return /* @__PURE__ */ u("a", { href: e, className: r, onClick: d, "aria-current": l, "data-tab-id": t, children: n });
+  return /* @__PURE__ */ o("a", { href: r, className: e, onClick: u, "aria-current": i, "aria-label": t, "data-tab-id": d, children: s });
 }
-function D({
-  items: e,
-  activeTab: r,
-  onChange: n,
-  linkComponent: d,
-  variant: l = "pill",
+function z({
+  items: r,
+  activeTab: e,
+  onChange: s,
+  linkComponent: u,
+  variant: i = "pill",
   fullWidth: t = !1,
-  size: b = "md",
-  "aria-label": p,
-  "aria-labelledby": m,
-  className: y
+  size: d = "md",
+  "aria-label": L,
+  "aria-labelledby": y,
+  className: I,
+  labels: N
 }) {
-  const o = c(null), f = c(null), L = d ?? K;
-  return I(o, f, r, e.map((a) => a.id).join("\0")), /* @__PURE__ */ q(
+  const f = k(U, N), b = m(null), p = m(null), h = u ?? Q;
+  return C(b, p, e, r.map((a) => a.id).join("\0")), /* @__PURE__ */ q(
     "nav",
     {
-      ref: o,
-      "aria-label": p,
-      "aria-labelledby": m,
+      ref: b,
+      "aria-label": L,
+      "aria-labelledby": y,
       "data-testid": "liquid-nav",
-      style: N,
-      className: x(l, t, y),
+      style: _,
+      className: x(i, t, I),
       children: [
-        /* @__PURE__ */ u(
+        /* @__PURE__ */ o(
           "div",
           {
-            ref: f,
+            ref: p,
             "aria-hidden": !0,
             "data-testid": "liquid-tabs-pill",
-            className: P(l),
-            style: h
+            className: S(i),
+            style: P
           }
         ),
-        e.map((a) => {
-          const s = a.id === r;
-          return /* @__PURE__ */ u(
-            L,
+        r.map((a) => {
+          const n = a.id === e, c = typeof a.label == "function" ? a.label(n) : a.label;
+          return /* @__PURE__ */ o(
+            h,
             {
               href: a.href,
               to: a.href,
-              "aria-current": s ? "page" : void 0,
+              "aria-current": n ? "page" : void 0,
+              "aria-label": R(c, a.count, f),
               "data-tab-id": a.id,
-              onClick: (i) => {
-                i.defaultPrevented || i.button !== 0 || i.metaKey || i.ctrlKey || i.shiftKey || i.altKey || s || n?.(a.id);
+              onClick: (l) => {
+                l.defaultPrevented || l.button !== 0 || l.metaKey || l.ctrlKey || l.shiftKey || l.altKey || n || s?.(a.id);
               },
-              className: C(
-                j({ variant: l, fullWidth: t, size: b, isActive: s }),
+              className: E(
+                j({ variant: i, fullWidth: t, size: d, isActive: n }),
                 /* A button centers its label and draws no underline on its own;
                    a link does neither, and a host stylesheet may underline it. */
                 "rst:inline-flex rst:items-center rst:justify-center rst:no-underline"
               ),
-              children: typeof a.label == "function" ? a.label(s) : a.label
+              children: K(a.count) ? /* @__PURE__ */ o(D, { label: c, count: a.count, labels: f }) : c
             },
             a.id
           );
@@ -74,5 +80,5 @@ function D({
   );
 }
 export {
-  D as LiquidNav
+  z as LiquidNav
 };

package/dist/components/molecules/LiquidTabs/LiquidTabPanel.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const v=require("react/jsx-runtime"),t=require("react"),y=require("./liquid-tab-id.cjs"),p='a[href], area[href], button:not([disabled]), input:not([disabled]):not([type="hidden"]), select:not([disabled]), textarea:not([disabled]), iframe, summary, audio[controls], video[controls], [contenteditable]:not([contenteditable="false"]), [tabindex]:not([tabindex="-1"])';function x({tabsId:d,id:l,tab:n,activeTab:a,keepMounted:u=!1,tabIndex:b,children:c,...f}){const i=t.useRef(null),r=a===void 0||a===n,[h,q]=t.useState(!1);return t.useLayoutEffect(()=>{const e=i.current;if(!e)return;const o=()=>q(!!e.querySelector(p));if(o(),typeof MutationObserver>"u")return;const s=new MutationObserver(o);return s.observe(e,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["disabled","tabindex","href","contenteditable"]}),()=>s.disconnect()},[]),v.jsx("div",{...f,ref:i,role:"tabpanel",id:l,"aria-labelledby":y.liquidTabId(d,n),hidden:!r,tabIndex:b??(h?void 0:0),"data-tab-panel":"",children:r||u?c:null})}exports.LiquidTabPanel=x;

package/dist/components/molecules/LiquidTabs/LiquidTabPanel.d.ts

@@ -0,0 +1,52 @@
+import { HTMLAttributes, ReactNode } from 'react';
+export interface LiquidTabPanelProps extends Omit<HTMLAttributes<HTMLDivElement>, "id" | "role" | "hidden" | "children"> {
+    /** The `id` of the `LiquidTabs` this panel belongs to (its `id` prop). */
+    tabsId: string;
+    /** This panel's `id`: the `panelId` its tab carries, or every tab, for one panel that swaps its content. */
+    id: string;
+    /**
+     * The tab that names this panel. For one panel that swaps its content, the
+     * selected tab: the panel's name follows the selection. For a panel per tab,
+     * its own tab.
+     */
+    tab: string;
+    /**
+     * For a panel per tab: the selected tab. The panel shows when it is `tab`,
+     * and is hidden otherwise. Leave it out for one panel that swaps its
+     * content, which always shows.
+     */
+    activeTab?: string;
+    /**
+     * For a panel per tab: keep the content mounted while the panel is hidden,
+     * so what's in it (a half-filled form, a scroll position) survives a switch
+     * away and back. By default a hidden panel renders no content. The panel
+     * element itself always stays, hidden, so its tab's `aria-controls` points
+     * at something.
+     */
+    keepMounted?: boolean;
+    children?: ReactNode;
+}
+/**
+ * The panel a `LiquidTabs` tab controls, paired with it by construction:
+ * `role="tabpanel"`, its `id` the tab's `panelId`, and `aria-labelledby`
+ * pointing at the tab through `liquidTabId`, so it's named for its tab.
+ *
+ * ```tsx
+ * <LiquidTabs id="views" tabs={[{ id: "open", label: "Open", panelId: "views-panel" }, …]} … />
+ * <LiquidTabPanel tabsId="views" id="views-panel" tab={view}>…</LiquidTabPanel>
+ * ```
+ *
+ * Two ways to lay it out. **One panel that swaps its content:** every tab
+ * carries the same `panelId`, and `tab` is the selected tab. **A panel per
+ * tab:** each tab has its own `panelId`, each panel its own `tab`, and every
+ * panel gets `activeTab`, so only the selected one shows.
+ *
+ * The WAI tabs pattern puts the panel in the tab order when nothing inside it
+ * can take focus, so a keyboard user can reach and scroll what was just
+ * selected. Whether the content holds anything focusable isn't known until it
+ * renders, and it can change as content loads, so the panel starts reachable
+ * (`tabIndex={0}`) and leaves the tab order once its content holds something
+ * that can be Tabbed to, rechecking as the content changes. Pass `tabIndex`
+ * to decide it yourself.
+ */
+export declare function LiquidTabPanel({ tabsId, id, tab, activeTab, keepMounted, tabIndex, children, ...rest }: LiquidTabPanelProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,32 @@
+"use client";
+import { jsx as p } from "react/jsx-runtime";
+import { useRef as m, useState as v, useLayoutEffect as x } from "react";
+import { liquidTabId as y } from "./liquid-tab-id.js";
+const L = 'a[href], area[href], button:not([disabled]), input:not([disabled]):not([type="hidden"]), select:not([disabled]), textarea:not([disabled]), iframe, summary, audio[controls], video[controls], [contenteditable]:not([contenteditable="false"]), [tabindex]:not([tabindex="-1"])';
+function w({ tabsId: d, id: s, tab: t, activeTab: n, keepMounted: l = !1, tabIndex: b, children: u, ...c }) {
+  const r = m(null), a = n === void 0 || n === t, [f, h] = v(!1);
+  return x(() => {
+    const e = r.current;
+    if (!e) return;
+    const o = () => h(!!e.querySelector(L));
+    if (o(), typeof MutationObserver > "u") return;
+    const i = new MutationObserver(o);
+    return i.observe(e, { childList: !0, subtree: !0, attributes: !0, attributeFilter: ["disabled", "tabindex", "href", "contenteditable"] }), () => i.disconnect();
+  }, []), /* @__PURE__ */ p(
+    "div",
+    {
+      ...c,
+      ref: r,
+      role: "tabpanel",
+      id: s,
+      "aria-labelledby": y(d, t),
+      hidden: !a,
+      tabIndex: b ?? (f ? void 0 : 0),
+      "data-tab-panel": "",
+      children: a || l ? u : null
+    }
+  );
+}
+export {
+  w as LiquidTabPanel
+};

package/dist/components/molecules/LiquidTabs/LiquidTabs.cjs

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

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

@@ -1,5 +1,7 @@
 import { ReactNode } from 'react';
 import { LiquidSize, LiquidVariant } from './liquid-pill';
+import { LiquidTabsLabels } from './liquid-count';
+export type { LiquidTabsLabels };
 export interface TabItem {
     id: string;
     /** Static label, or a render function that receives whether this tab is active. */
@@ -9,6 +11,18 @@ export interface TabItem {
      * every tab the same id when one panel swaps its content.
      */
     panelId?: string;
+    /**
+     * A number in a small mark beside the label, read as part of the tab's
+     * name: "Open, 12 items" (`labels.count` says it).
+     *
+     * **Zero shows**, as "0" and "0 items": a count that vanished at zero would
+     * change the tab's width and move every tab after it, and an empty list is
+     * worth saying. To hide it, pass `undefined` for zero. `undefined` means no
+     * count and no mark. A negative or fractional count isn't shown at all,
+     * never rounded or clamped. Large counts aren't abbreviated: 12,345 shows
+     * as "12,345" unless `labels.countMark` writes it shorter.
+     */
+    count?: number;
 }
 export interface LiquidTabsProps {
     tabs: TabItem[];
@@ -49,6 +63,8 @@ export interface LiquidTabsProps {
     "aria-labelledby"?: string;
     /** Extra classes applied to the outer container. */
     className?: string;
+    /** Every word a count says, with English defaults: see `TabItem.count`. */
+    labels?: Partial<LiquidTabsLabels>;
 }
 /**
  * A controlled tab strip with a liquid sliding indicator.
@@ -64,6 +80,9 @@ export interface LiquidTabsProps {
  * The pill follows `activeTab`, never the click, so a change the consumer
  * vetoes, or one that waits on navigation, never leaves it on the wrong tab.
  *
+ * A tab can carry a `count`, and a panel pairs with its tab by construction
+ * through `LiquidTabPanel`.
+ *
  * For navigation between routes, use `LiquidNav`, which renders links.
  */
-export declare function LiquidTabs({ tabs, activeTab, onChange, variant, fullWidth, size, activation, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, className, }: LiquidTabsProps): import("react/jsx-runtime").JSX.Element;
+export declare function LiquidTabs({ tabs, activeTab, onChange, variant, fullWidth, size, activation, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, className, labels, }: LiquidTabsProps): import("react/jsx-runtime").JSX.Element;

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

@@ -1,84 +1,91 @@
 "use client";
-import { jsxs as j, jsx as q } from "react/jsx-runtime";
-import { useRef as L, useId as E, useState as T } from "react";
-import { useLiquidPill as F, LIQUID_STRIP_STYLE as Q, LIQUID_PILL_STYLE as U, liquidPillClassName as Y, liquidItemClassName as B, liquidStripClassName as H } from "./liquid-pill.js";
-import { liquidTabId as K } from "./liquid-tab-id.js";
-function J({
+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: r,
-  onChange: g,
-  variant: s = "pill",
-  fullWidth: u = !1,
-  size: A = "md",
-  activation: S = "automatic",
-  id: h,
-  "aria-label": k,
-  "aria-labelledby": w,
-  className: N
+  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
 }) {
-  const d = L(null), f = L(null), R = E(), m = h ?? R;
-  F(d, f, r, l.map((e) => e.id).join("\0"));
-  const p = (e) => {
-    e !== r && g(e);
-  }, [n, y] = T(null), x = l.some((e) => e.id === r), C = n !== null && l.some((e) => e.id === n) ? n : x ? r : 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"]')
-    ), o = a.indexOf(e.target);
-    if (o === -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 = o === c ? 0 : o + 1;
-    else if (e.key === _) t = o === 0 ? c : o - 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: Q,
-      className: H(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: Y(s),
-            style: U
+            className: O(n),
+            style: K
           }
         ),
         l.map((e) => {
-          const i = e.id === r;
-          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: K(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: B({ 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
           );
@@ -88,5 +95,5 @@ function J({
   );
 }
 export {
-  J 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/molecules/Menu/Menu.cjs

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),ge=require("react"),W=require("../../../node_modules/@headlessui/react/dist/components/portal/portal.cjs"),C=require("../../../node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.cjs"),S=require("../../../lib/utils.cjs"),he=require("../../../internal/popup.cjs"),be=require("../../atoms/Button/Button.cjs"),xe=require("./menu-typeahead.cjs"),ye=require("../../../node_modules/@floating-ui/dom/dist/floating-ui.dom.cjs");function ve(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const o=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,o.get?o:{enumerable:!0,get:()=>e[n]})}}return r.default=e,Object.freeze(r)}const i=ve(ge);function we({href:e,to:r,children:n,...o}){return c.jsx("a",{href:e,...o,children:n})}const G=i.createContext(null),_=i.createContext(null),V=i.createContext(null);function A(e){const r=i.useContext(G);if(!r)throw new Error(`<${e}> must be inside a <Menu>.`);return r}function K(e){const r=i.useContext(_);if(!r)throw new Error(`<${e}> must be inside <MenuItems> or a <MenuSubmenu>.`);return r}const ke="[data-menu-item]",Y=100,Ie=75,Ee='a[href], button:not([disabled]), input:not([disabled]):not([type="hidden"]), select:not([disabled]), textarea:not([disabled]), summary, [tabindex]:not([tabindex="-1"]), [contenteditable]:not([contenteditable="false"])';function L(e){return e?[...e.querySelectorAll(ke)].filter(r=>r.closest("[data-menu-panel]")===e):[]}function E(e){e&&(e.setAttribute("data-key-focus",""),e.addEventListener("blur",()=>e.removeAttribute("data-key-focus"),{once:!0}),e.focus({preventScroll:!0}),e.scrollIntoView?.({block:"nearest"}))}function $(e){return!!e&&getComputedStyle(e).direction==="rtl"}function Se(e,r){const n=[...document.querySelectorAll(Ee)].filter(t=>t===e||t.tabIndex>=0&&!t.matches(":disabled")&&!t.closest("[data-menu-panel], [inert]")&&t.getClientRects().length>0&&getComputedStyle(t).visibility!=="hidden"&&!Me(t,r)),o=n.indexOf(e);((r?n[o-1]:n[o+1])??e).focus()}function Me(e,r){if(!(e instanceof HTMLInputElement)||e.type!=="radio"||!e.name)return!1;const n=[...e.ownerDocument.querySelectorAll(`input[type="radio"][name="${CSS.escape(e.name)}"]`)].filter(a=>a.form===e.form&&!a.disabled);return(n.find(a=>a.checked)??(r?n[n.length-1]:n[0]))!==e}const D={x:Number.NaN,y:Number.NaN};let H=!1;function je(){H||typeof window>"u"||(H=!0,window.addEventListener("pointermove",e=>{D.x=e.clientX,D.y=e.clientY},{passive:!0}))}function X(e){return!Number.isNaN(D.x)&&(e.clientX!==D.x||e.clientY!==D.y)}const U=e=>`radial-gradient(farthest-side at 50% ${e==="top"?"0":"100%"}, var(--menu-edge), transparent)`,J={backgroundImage:"var(--menu-edge-top, none), var(--menu-edge-bottom, none)",backgroundPosition:"top, bottom",backgroundSize:"100% 0.5rem",backgroundRepeat:"no-repeat"};function Pe(e){i.useLayoutEffect(()=>{if(!e)return;const r=()=>{const o=e.scrollTop>8,a=e.scrollTop+e.clientHeight<e.scrollHeight-8;e.toggleAttribute("data-more-above",o),e.toggleAttribute("data-more-below",a),e.style.setProperty("--menu-edge-top",o?U("top"):"none"),e.style.setProperty("--menu-edge-bottom",a?U("bottom"):"none")};r(),e.addEventListener("scroll",r,{passive:!0});const n=typeof ResizeObserver>"u"?null:new ResizeObserver(r);return n?.observe(e),()=>{e.removeEventListener("scroll",r),n?.disconnect()}},[e])}function Q(e,r){const[n,o]=e.split("-"),a=r?"right":"left",t=r?"left":"right";return n==="top"||n==="bottom"?`${n==="bottom"?"top":"bottom"} ${o==="end"?t:o==="start"?a:"center"}`:`${o==="end"?"bottom":"top"} ${n==="right"?"left":"right"}`}const Z=S.cn("rst:font-ui",he.POPUP_PANEL,"rst:w-max rst:min-w-48 rst:max-w-[min(20rem,calc(100vw-1rem))] rst:overflow-y-auto rst:overscroll-contain rst:custom-scrollbar","rst:[--menu-edge:rgb(0_0_0/0.18)] rst:dark:[--menu-edge:rgb(0_0_0/0.6)]","rst:transition-[opacity,scale] rst:duration-100 rst:ease-out rst:data-closed:opacity-0 rst:data-closed:scale-95 rst:data-leaving:duration-75 rst:data-leaving:ease-in rst:data-closed:pointer-events-none rst:motion-reduce:transition-none");function ee(e){const[r,n]=i.useState(e),[o,a]=i.useState(!0);return i.useLayoutEffect(()=>{if(e){n(!0);const s=requestAnimationFrame(()=>a(!1));return()=>cancelAnimationFrame(s)}a(!0);const t=window.matchMedia?.("(prefers-reduced-motion: reduce)").matches,d=window.setTimeout(()=>n(!1),t?0:Ie);return()=>window.clearTimeout(d)},[e]),{mounted:r,closed:o,leaving:r&&!e}}function te(e,r,n,o,a,t=!1){const[d,s]=i.useState(null),u=C.useFloating({open:r,strategy:"fixed",transform:!1,placement:n,elements:{reference:e},whileElementsMounted:ye.autoUpdate,middleware:[C.offset(o),C.flip({padding:8}),C.shift({padding:8,crossAxis:t}),C.size({padding:8,apply({availableHeight:f,elements:l}){l.floating.style.maxHeight=`min(var(--anchor-max-height, 100vh), ${Math.max(f,96)}px)`}})]}),{setFloating:p}=u.refs,m=i.useCallback(f=>{a.current=f,s(f),p(f)},[a,p]);return Pe(d),{...u,setPanel:m,panelEl:d}}const re=500;function ne(){const e=i.useRef({text:"",at:0}),r=i.useCallback(()=>e.current.text!==""&&performance.now()-e.current.at<=re,[]);return{typedRef:e,typingAhead:r}}function oe({panelRef:e,typedRef:r,onEscape:n,onBack:o}){const a=A("MenuItems");return t=>{const d=e.current;if(!d||!d.contains(t.target)||(!t.ctrlKey&&!t.metaKey&&!t.altKey&&t.stopPropagation(),t.defaultPrevented))return;const s=L(d),u=s.indexOf(document.activeElement),p=$(d);switch(t.key){case"ArrowDown":t.preventDefault(),t.stopPropagation(),E(s[(u+1)%s.length]);return;case"ArrowUp":t.preventDefault(),t.stopPropagation(),E(s[u<=0?s.length-1:u-1]);return;case"Home":case"PageUp":t.preventDefault(),t.stopPropagation(),E(s[0]);return;case"End":case"PageDown":t.preventDefault(),t.stopPropagation(),E(s[s.length-1]);return;case"Escape":t.preventDefault(),t.stopPropagation(),n();return;case"Tab":{t.preventDefault(),t.stopPropagation();const m=a.triggerRef.current;a.close(!1),m&&Se(m,t.shiftKey);return}case"ArrowLeft":case"ArrowRight":o&&t.key===(p?"ArrowRight":"ArrowLeft")&&(t.preventDefault(),t.stopPropagation(),o());return}if(t.key.length===1&&!t.ctrlKey&&!t.metaKey&&!t.altKey){const m=performance.now(),f=r.current.text!==""&&m-r.current.at<=re;if(t.key===" "&&!f)return;t.preventDefault(),r.current={text:f?r.current.text+t.key:t.key,at:m};const l=s.map(w=>w.dataset.menuText??w.textContent??""),b=xe.nextByTypeahead(l,u,r.current.text);b!==-1&&E(s[b])}}}function Te({children:e,open:r,onOpenChange:n,linkComponent:o=we}){const[a,t]=i.useState(!1),d=r??a,s=i.useId(),u=i.useRef(null),[p,m]=i.useState(null),f=i.useCallback(g=>{u.current=g,m(g)},[]),l=i.useRef("panel"),b=i.useCallback(g=>{r===void 0&&t(g),n?.(g)},[r,n]),w=i.useMemo(()=>({treeId:s,open:d,openWith:g=>{l.current=g,b(!0)},close:g=>{b(!1),g&&u.current?.focus()},triggerRef:u,triggerEl:p,registerTrigger:f,triggerId:`${s}-button`,panelId:`${s}-menu`,focusOnOpen:l,linkComponent:o}),[s,d,b,o,p,f]);return i.useEffect(()=>{if(!d)return;je();const g=I=>{I.target?.closest?.(`[data-menu-tree="${s}"]`)||(b(!1),requestAnimationFrame(()=>{(document.activeElement===document.body||!document.activeElement)&&u.current?.focus({preventScroll:!0})}))};return document.addEventListener("pointerdown",g,!0),()=>document.removeEventListener("pointerdown",g,!0)},[d,s,b]),c.jsx(G.Provider,{value:w,children:e})}const Ae=i.forwardRef(function({plain:r=!1,className:n,onClick:o,onKeyDown:a,children:t,...d},s){const{variant:u,colorScheme:p,size:m,isLoading:f,loadingLabel:l,startIcon:b,endIcon:w,surface:g,...I}=d,h=A("MenuButton"),{registerTrigger:M}=h,j=i.useCallback(x=>{M(x),typeof s=="function"?s(x):s&&(s.current=x)},[M,s]),P={id:h.triggerId,"aria-haspopup":"menu","aria-expanded":h.open,"aria-controls":h.open?h.panelId:void 0,"data-menu-tree":h.treeId,onClick:x=>{o?.(x),!x.defaultPrevented&&(h.open?h.close(!1):h.openWith("panel"))},onKeyDown:x=>{if(a?.(x),x.defaultPrevented)return;const y=x.key==="Enter"||x.key===" "||x.key==="ArrowDown"?"first":x.key==="ArrowUp"?"last":null;if(!y)return;x.preventDefault();const k=h.open?document.getElementById(h.panelId):null;if(k){const R=L(k);E(y==="last"?R[R.length-1]:R[0]);return}h.openWith(y)}};return r?c.jsx("button",{ref:j,type:"button",className:n,...I,...P,children:t}):c.jsx(be.Button,{ref:j,className:S.cn("rst:min-h-11 rst:min-w-11",n),variant:u,colorScheme:p,size:m,isLoading:f,loadingLabel:l,startIcon:b,endIcon:w,surface:g,...I,...P,children:t})});function Re({children:e,align:r="start",offset:n=4,className:o,...a}){const t=A("MenuItems"),{mounted:d,closed:s,leaving:u}=ee(t.open),p=i.useRef(null),m=$(t.triggerEl),{setPanel:f,panelEl:l,floatingStyles:b,placement:w,isPositioned:g}=te(t.triggerEl,d,`bottom-${r}`,n,p),I=se(),{typedRef:h,typingAhead:M}=ne(),j=oe({panelRef:p,typedRef:h,onEscape:()=>t.close(!0)});i.useLayoutEffect(()=>{if(!t.open||!l)return;const y=L(l),k=t.focusOnOpen.current;k==="first"&&y[0]?E(y[0]):k==="last"&&y.length?E(y[y.length-1]):l.focus({preventScroll:!0})},[t.open,l,t.focusOnOpen]),i.useLayoutEffect(()=>{if(!g||!l)return;const y=document.activeElement;y&&y!==l&&l.contains(y)&&y.scrollIntoView?.({block:"nearest"})},[g,l]),i.useLayoutEffect(()=>{!t.open&&l?.contains(document.activeElement)&&t.triggerRef.current?.focus({preventScroll:!0})},[t.open,l,t.triggerRef]);const P=y=>{const k=y.relatedTarget;k&&!k.closest(`[data-menu-tree="${t.treeId}"]`)&&t.close(!1)};if(!d)return null;const x=!!t.triggerEl?.closest(".dark");return c.jsx(W.Portal,{children:c.jsx(_.Provider,{value:{...I,panelRef:p,typingAhead:M},children:c.jsx("div",{ref:f,id:t.panelId,dir:m?"rtl":"ltr",role:"menu","aria-labelledby":a["aria-label"]?void 0:t.triggerId,"aria-label":a["aria-label"],tabIndex:-1,"data-menu-panel":"","data-menu-tree":t.treeId,"data-closed":s?"":void 0,"data-leaving":u?"":void 0,onKeyDown:j,onBlur:P,style:{...b,...J,transformOrigin:Q(w,m)},className:S.cn(x&&"dark",Z,o),children:e})})})}function se(){const[e,r]=i.useState(null),n=i.useRef(!1),o=i.useRef(void 0);return i.useEffect(()=>()=>window.clearTimeout(o.current),[]),{openSubmenu:e,focusFirstInSubmenu:n,setOpenSubmenu:(a,t=!1)=>{window.clearTimeout(o.current),n.current=t,r(a)},hoverItem:a=>{window.clearTimeout(o.current),a===null&&(o.current=window.setTimeout(()=>r(null),Y))}}}const O=S.cn("rst:relative rst:flex rst:w-full rst:min-h-11 rst:items-center rst:gap-2.5 rst:border-0 rst:bg-transparent rst:px-3 rst:py-2 rst:text-start rst:text-sm rst:text-inherit rst:no-underline rst:[font-family:inherit] rst:cursor-pointer rst:select-none rst:outline-none rst:transition-colors","rst:focus:bg-primary-100 rst:focus:text-primary-900 rst:dark:focus:bg-primary-900/30 rst:dark:focus:text-primary-100 rst:forced-colors:focus:outline-solid rst:forced-colors:focus:outline-2 rst:forced-colors:focus:-outline-offset-2","rst:data-key-focus:ring-2 rst:data-key-focus:ring-inset rst:data-key-focus:ring-ring","rst:aria-disabled:opacity-50 rst:aria-disabled:cursor-not-allowed"),q="rst:text-error-600 rst:dark:text-error-400 rst:focus:bg-error-50 rst:focus:text-error-700 rst:dark:focus:bg-error-900/30 rst:dark:focus:text-error-300",Ce=()=>c.jsx("svg",{viewBox:"0 0 16 16",width:"16",height:"16",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",children:c.jsx("path",{d:"M3.5 8.5 6.5 11.5 12.5 4.5"})}),De=()=>c.jsx("svg",{viewBox:"0 0 16 16",width:"16",height:"16","aria-hidden":"true",children:c.jsx("circle",{cx:"8",cy:"8",r:"3.5",fill:"currentColor"})}),Le=()=>c.jsx("svg",{viewBox:"0 0 16 16",width:"16",height:"16",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",className:"rst:rtl:rotate-180",children:c.jsx("path",{d:"M6 3.5 10.5 8 6 12.5"})});function T({icon:e,shortcut:r,description:n,badge:o,children:a},t,d,s){const u=t??e;return c.jsxs(c.Fragment,{children:[u!=null&&c.jsx("span",{"aria-hidden":"true",className:S.cn("rst:flex rst:size-4 rst:shrink-0 rst:items-center rst:justify-center",n!=null&&"rst:self-start rst:mt-0.5"),"data-menu-lead":"",children:u}),c.jsxs("span",{className:"rst:min-w-0 rst:flex-1 rst:break-words","data-menu-label":"",children:[a,n!=null&&c.jsx("span",{id:s,"aria-hidden":"true",className:"rst:block rst:text-xs rst:opacity-75","data-menu-description":"",children:n})]}),o!=null&&c.jsx("span",{className:"rst:flex rst:shrink-0 rst:items-center","data-menu-badge":"",children:o}),r&&c.jsx("span",{"aria-hidden":"true",className:"rst:ms-auto rst:shrink-0 rst:ps-4 rst:text-xs rst:tracking-wide rst:opacity-70","data-menu-shortcut":"",children:r}),d]})}function z({disabled:e,closeOnSelect:r,onChoose:n,spaceKeepsOpen:o}){const a=A("MenuItem"),t=K("MenuItem"),d=(s,u)=>{if(e){s.preventDefault();return}n(s),u&&a.close(!0)};return{onClick:s=>d(s,r),onKeyDown:s=>{if(s.key===" "){if(t.typingAhead())return;s.preventDefault(),d(s,r&&!o)}},onPointerMove:s=>{X(s)&&(t.hoverItem(null),document.activeElement!==s.currentTarget&&s.currentTarget.focus({preventScroll:!0}))}}}function Oe({onSelect:e,href:r,closeOnSelect:n=!0,disabled:o,destructive:a,keyshortcuts:t,textValue:d,className:s,...u}){const p=A("MenuItem"),m=K("MenuItem"),f=i.useId(),l=z({disabled:o,closeOnSelect:n,onChoose:g=>e?.(g)}),b=S.cn(O,a&&q,s),w={role:"menuitem",tabIndex:-1,"aria-disabled":o?!0:void 0,"aria-keyshortcuts":t,"aria-describedby":u.description!=null?f:void 0,"data-menu-item":"","data-menu-text":d,"data-destructive":a?"":void 0};if(r!==void 0){const g=p.linkComponent;return c.jsx(g,{href:r,to:r,className:b,...w,onClick:l.onClick,onPointerMove:l.onPointerMove,onKeyDown:I=>{if(I.key===" "){if(m.typingAhead())return;I.preventDefault(),o||I.currentTarget.click()}},children:T(u,void 0,void 0,f)})}return c.jsx("button",{type:"button",className:b,...w,...l,children:T(u,void 0,void 0,f)})}function Ne({checked:e,onCheckedChange:r,indicator:n,closeOnSelect:o=!0,disabled:a,destructive:t,keyshortcuts:d,textValue:s,className:u,...p}){const m=z({disabled:a,closeOnSelect:o,spaceKeepsOpen:!0,onChoose:()=>r(!e)}),f=i.useId();return c.jsx("button",{type:"button",role:"menuitemcheckbox","aria-checked":e,"aria-describedby":p.description!=null?f:void 0,tabIndex:-1,"aria-disabled":a||void 0,"aria-keyshortcuts":d,"data-menu-item":"","data-menu-text":s,className:S.cn(O,t&&q,u),...m,children:n===void 0?T(p,c.jsx("span",{className:e?void 0:"rst:invisible","data-menu-check":"",children:c.jsx(Ce,{})}),void 0,f):T(p,void 0,c.jsx("span",{"aria-hidden":"true",className:"rst:ms-auto rst:flex rst:shrink-0 rst:items-center",children:n}),f)})}function Be({value:e,onValueChange:r,label:n,children:o,className:a}){return c.jsx(V.Provider,{value:{value:e,onValueChange:r},children:c.jsx(ae,{label:n,className:a,children:o})})}function _e({value:e,closeOnSelect:r=!0,disabled:n,destructive:o,keyshortcuts:a,textValue:t,className:d,...s}){const u=i.useContext(V);if(!u)throw new Error("<MenuRadioItem> must be inside a <MenuRadioGroup>.");const p=u.value===e,m=z({disabled:n,closeOnSelect:r,spaceKeepsOpen:!0,onChoose:()=>u.onValueChange?.(e)}),f=i.useId();return c.jsx("button",{type:"button",role:"menuitemradio","aria-checked":p,"aria-describedby":s.description!=null?f:void 0,tabIndex:-1,"aria-disabled":n||void 0,"aria-keyshortcuts":a,"data-menu-item":"","data-menu-text":t,className:S.cn(O,o&&q,d),...m,children:T(s,c.jsx("span",{className:p?void 0:"rst:invisible","data-menu-check":"",children:c.jsx(De,{})}),void 0,f)})}function ae({label:e,children:r,className:n}){const o=i.useId();return c.jsxs("div",{role:"group","aria-labelledby":e?o:void 0,className:n,children:[e&&c.jsx("div",{id:o,className:"rst:px-3 rst:pt-2 rst:pb-1 rst:text-xs rst:font-semibold rst:text-gray-600 rst:dark:text-gray-400","data-menu-heading":"",children:e}),r]})}function Ke({className:e}){return c.jsx("div",{role:"separator",className:S.cn("rst:my-1 rst:h-[var(--roster-border-width,1px)] rst:bg-[var(--roster-popover-border)]",e)})}function $e({label:e,children:r,icon:n,disabled:o,textValue:a,className:t,panelClassName:d}){const s=A("MenuSubmenu"),u=K("MenuSubmenu"),p=i.useId(),m=`${p}-item`,f=`${p}-menu`,l=u.openSubmenu===m,b=i.useRef(null),[w,g]=i.useState(null),I=i.useCallback(v=>{b.current=v,g(v)},[]),h=i.useRef(null),M=i.useRef(void 0),j=i.useRef("mouse"),{mounted:P,closed:x,leaving:y}=ee(l),k=$(w),{setPanel:R,panelEl:N,floatingStyles:ie,placement:ue}=te(w,P,k?"left-start":"right-start",{mainAxis:0,alignmentAxis:-4},h,!0),ce=se();i.useEffect(()=>()=>window.clearTimeout(M.current),[]);const F=()=>{u.setOpenSubmenu(null),E(b.current)},{typedRef:le,typingAhead:de}=ne(),fe=oe({panelRef:h,typedRef:le,onEscape:F,onBack:F});i.useLayoutEffect(()=>{!l||!N||u.focusFirstInSubmenu.current&&E(L(N)[0])},[l,N,u.focusFirstInSubmenu]);const B=v=>{if(!o){if(l&&v&&h.current){E(L(h.current)[0]);return}u.setOpenSubmenu(m,v)}},me=!!s.triggerEl?.closest(".dark");return c.jsxs(c.Fragment,{children:[c.jsx("button",{ref:I,id:m,type:"button",role:"menuitem",tabIndex:-1,"aria-haspopup":"menu","aria-expanded":l,"aria-controls":l?f:void 0,"aria-disabled":o||void 0,"data-menu-item":"","data-menu-text":a,"data-menu-tree":s.treeId,className:S.cn(O,l&&"rst:bg-gray-100 rst:dark:bg-gray-700/50",t),onPointerDown:v=>{j.current=v.pointerType},onClick:()=>l&&j.current!=="mouse"?u.setOpenSubmenu(null):B(!1),onKeyDown:v=>{const pe=k?"ArrowLeft":"ArrowRight";v.key===" "&&u.typingAhead()||(v.key===pe||v.key==="Enter"||v.key===" ")&&(v.preventDefault(),B(!0))},onPointerMove:v=>{X(v)&&(u.hoverItem(m),document.activeElement!==v.currentTarget&&v.currentTarget.focus({preventScroll:!0}),!l&&!o&&(window.clearTimeout(M.current),M.current=window.setTimeout(()=>B(!1),Y)))},onPointerLeave:()=>window.clearTimeout(M.current),children:T({icon:n,children:e},void 0,c.jsx("span",{"aria-hidden":"true",className:"rst:ms-auto rst:flex rst:shrink-0 rst:items-center rst:opacity-70","data-menu-chevron":"",children:c.jsx(Le,{})}))}),P&&c.jsx(W.Portal,{children:c.jsx(_.Provider,{value:{...ce,panelRef:h,typingAhead:de},children:c.jsx("div",{ref:R,id:f,dir:k?"rtl":"ltr",role:"menu","aria-labelledby":m,tabIndex:-1,"data-menu-panel":"","data-menu-tree":s.treeId,"data-closed":x?"":void 0,"data-leaving":y?"":void 0,onKeyDown:fe,onPointerEnter:()=>u.hoverItem(m),style:{...ie,...J,transformOrigin:Q(ue,k)},className:S.cn(me&&"dark",Z,d),children:r})})})]})}exports.Menu=Te;exports.MenuButton=Ae;exports.MenuCheckboxItem=Ne;exports.MenuGroup=ae;exports.MenuItem=Oe;exports.MenuItems=Re;exports.MenuRadioGroup=Be;exports.MenuRadioItem=_e;exports.MenuSeparator=Ke;exports.MenuSubmenu=$e;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),he=require("react"),G=require("../../../node_modules/@headlessui/react/dist/components/portal/portal.cjs"),R=require("../../../node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.cjs"),S=require("../../../lib/utils.cjs"),K=require("../../../internal/popup.cjs"),be=require("../../atoms/Button/Button.cjs"),xe=require("./menu-typeahead.cjs"),ye=require("../../../internal/key-focus.cjs"),ve=require("../../../node_modules/@floating-ui/dom/dist/floating-ui.dom.cjs");function we(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const o=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,o.get?o:{enumerable:!0,get:()=>e[n]})}}return r.default=e,Object.freeze(r)}const i=we(he);function ke({href:e,to:r,children:n,...o}){return c.jsx("a",{href:e,...o,children:n})}const V=i.createContext(null),_=i.createContext(null),Y=i.createContext(null);function A(e){const r=i.useContext(V);if(!r)throw new Error(`<${e}> must be inside a <Menu>.`);return r}function $(e){const r=i.useContext(_);if(!r)throw new Error(`<${e}> must be inside <MenuItems> or a <MenuSubmenu>.`);return r}const Ie="[data-menu-item]",X=100,Ee=75,Se='a[href], button:not([disabled]), input:not([disabled]):not([type="hidden"]), select:not([disabled]), textarea:not([disabled]), summary, [tabindex]:not([tabindex="-1"]), [contenteditable]:not([contenteditable="false"])';function L(e){return e?[...e.querySelectorAll(Ie)].filter(r=>r.closest("[data-menu-panel]")===e):[]}function E(e){e&&(e.setAttribute("data-key-focus",""),e.addEventListener("blur",()=>e.removeAttribute("data-key-focus"),{once:!0}),e.focus({preventScroll:!0}),e.scrollIntoView?.({block:"nearest"}))}function q(e){return!!e&&getComputedStyle(e).direction==="rtl"}function Me(e,r){const n=[...document.querySelectorAll(Se)].filter(t=>t===e||t.tabIndex>=0&&!t.matches(":disabled")&&!t.closest("[data-menu-panel], [inert]")&&t.getClientRects().length>0&&getComputedStyle(t).visibility!=="hidden"&&!je(t,r)),o=n.indexOf(e);((r?n[o-1]:n[o+1])??e).focus()}function je(e,r){if(!(e instanceof HTMLInputElement)||e.type!=="radio"||!e.name)return!1;const n=[...e.ownerDocument.querySelectorAll(`input[type="radio"][name="${CSS.escape(e.name)}"]`)].filter(a=>a.form===e.form&&!a.disabled);return(n.find(a=>a.checked)??(r?n[n.length-1]:n[0]))!==e}const C={x:Number.NaN,y:Number.NaN};let U=!1;function Pe(){U||typeof window>"u"||(U=!0,window.addEventListener("pointermove",e=>{C.x=e.clientX,C.y=e.clientY},{passive:!0}))}function J(e){return!Number.isNaN(C.x)&&(e.clientX!==C.x||e.clientY!==C.y)}const W=e=>`radial-gradient(farthest-side at 50% ${e==="top"?"0":"100%"}, var(--menu-edge), transparent)`,Q={backgroundImage:"var(--menu-edge-top, none), var(--menu-edge-bottom, none)",backgroundPosition:"top, bottom",backgroundSize:"100% 0.5rem",backgroundRepeat:"no-repeat"};function Te(e){i.useLayoutEffect(()=>{if(!e)return;const r=()=>{const o=e.scrollTop>8,a=e.scrollTop+e.clientHeight<e.scrollHeight-8;e.toggleAttribute("data-more-above",o),e.toggleAttribute("data-more-below",a),e.style.setProperty("--menu-edge-top",o?W("top"):"none"),e.style.setProperty("--menu-edge-bottom",a?W("bottom"):"none")};r(),e.addEventListener("scroll",r,{passive:!0});const n=typeof ResizeObserver>"u"?null:new ResizeObserver(r);return n?.observe(e),()=>{e.removeEventListener("scroll",r),n?.disconnect()}},[e])}function Z(e,r){const[n,o]=e.split("-"),a=r?"right":"left",t=r?"left":"right";return n==="top"||n==="bottom"?`${n==="bottom"?"top":"bottom"} ${o==="end"?t:o==="start"?a:"center"}`:`${o==="end"?"bottom":"top"} ${n==="right"?"left":"right"}`}const ee=S.cn("rst:font-ui",K.POPUP_PANEL,"rst:w-max rst:min-w-48 rst:max-w-[min(20rem,calc(100vw-1rem))] rst:overflow-y-auto rst:overscroll-contain rst:custom-scrollbar","rst:[--menu-edge:rgb(0_0_0/0.18)] rst:dark:[--menu-edge:rgb(0_0_0/0.6)]","rst:transition-[opacity,scale] rst:duration-100 rst:ease-out rst:data-closed:opacity-0 rst:data-closed:scale-95 rst:data-leaving:duration-75 rst:data-leaving:ease-in rst:data-closed:pointer-events-none rst:motion-reduce:transition-none");function te(e){const[r,n]=i.useState(e),[o,a]=i.useState(!0);return i.useLayoutEffect(()=>{if(e){n(!0);const s=requestAnimationFrame(()=>a(!1));return()=>cancelAnimationFrame(s)}a(!0);const t=window.matchMedia?.("(prefers-reduced-motion: reduce)").matches,d=window.setTimeout(()=>n(!1),t?0:Ee);return()=>window.clearTimeout(d)},[e]),{mounted:r,closed:o,leaving:r&&!e}}function re(e,r,n,o,a,t=!1){const[d,s]=i.useState(null),u=R.useFloating({open:r,strategy:"fixed",transform:!1,placement:n,elements:{reference:e},whileElementsMounted:ve.autoUpdate,middleware:[R.offset(o),R.flip({padding:8}),R.shift({padding:8,crossAxis:t}),R.size({padding:8,apply({availableHeight:f,elements:l}){l.floating.style.maxHeight=`min(var(--anchor-max-height, 100vh), ${Math.max(f,96)}px)`}})]}),{setFloating:p}=u.refs,m=i.useCallback(f=>{a.current=f,s(f),p(f)},[a,p]);return Te(d),{...u,setPanel:m,panelEl:d}}const ne=500;function oe(){const e=i.useRef({text:"",at:0}),r=i.useCallback(()=>e.current.text!==""&&performance.now()-e.current.at<=ne,[]);return{typedRef:e,typingAhead:r}}function se({panelRef:e,typedRef:r,onEscape:n,onBack:o}){const a=A("MenuItems");return t=>{const d=e.current;if(!d||!d.contains(t.target)||(!t.ctrlKey&&!t.metaKey&&!t.altKey&&t.stopPropagation(),t.defaultPrevented))return;const s=L(d),u=s.indexOf(document.activeElement),p=q(d);switch(t.key){case"ArrowDown":t.preventDefault(),t.stopPropagation(),E(s[(u+1)%s.length]);return;case"ArrowUp":t.preventDefault(),t.stopPropagation(),E(s[u<=0?s.length-1:u-1]);return;case"Home":case"PageUp":t.preventDefault(),t.stopPropagation(),E(s[0]);return;case"End":case"PageDown":t.preventDefault(),t.stopPropagation(),E(s[s.length-1]);return;case"Escape":t.preventDefault(),t.stopPropagation(),n();return;case"Tab":{t.preventDefault(),t.stopPropagation();const m=a.triggerRef.current;a.close(!1),m&&Me(m,t.shiftKey);return}case"ArrowLeft":case"ArrowRight":o&&t.key===(p?"ArrowRight":"ArrowLeft")&&(t.preventDefault(),t.stopPropagation(),o());return}if(t.key.length===1&&!t.ctrlKey&&!t.metaKey&&!t.altKey){const m=performance.now(),f=r.current.text!==""&&m-r.current.at<=ne;if(t.key===" "&&!f)return;t.preventDefault(),r.current={text:f?r.current.text+t.key:t.key,at:m};const l=s.map(w=>w.dataset.menuText??w.textContent??""),b=xe.nextByTypeahead(l,u,r.current.text);b!==-1&&E(s[b])}}}function Ae({children:e,open:r,onOpenChange:n,linkComponent:o=ke}){ye.useKeyFocus();const[a,t]=i.useState(!1),d=r??a,s=i.useId(),u=i.useRef(null),[p,m]=i.useState(null),f=i.useCallback(g=>{u.current=g,m(g)},[]),l=i.useRef("panel"),b=i.useCallback(g=>{r===void 0&&t(g),n?.(g)},[r,n]),w=i.useMemo(()=>({treeId:s,open:d,openWith:g=>{l.current=g,b(!0)},close:g=>{b(!1),g&&u.current?.focus()},triggerRef:u,triggerEl:p,registerTrigger:f,triggerId:`${s}-button`,panelId:`${s}-menu`,focusOnOpen:l,linkComponent:o}),[s,d,b,o,p,f]);return i.useEffect(()=>{if(!d)return;Pe();const g=I=>{I.target?.closest?.(`[data-menu-tree="${s}"]`)||(b(!1),requestAnimationFrame(()=>{(document.activeElement===document.body||!document.activeElement)&&u.current?.focus({preventScroll:!0})}))};return document.addEventListener("pointerdown",g,!0),()=>document.removeEventListener("pointerdown",g,!0)},[d,s,b]),c.jsx(V.Provider,{value:w,children:e})}const De=i.forwardRef(function({plain:r=!1,className:n,onClick:o,onKeyDown:a,children:t,...d},s){const{variant:u,colorScheme:p,size:m,isLoading:f,loadingLabel:l,startIcon:b,endIcon:w,surface:g,...I}=d,h=A("MenuButton"),{registerTrigger:M}=h,j=i.useCallback(x=>{M(x),typeof s=="function"?s(x):s&&(s.current=x)},[M,s]),P={id:h.triggerId,"aria-haspopup":"menu","aria-expanded":h.open,"aria-controls":h.open?h.panelId:void 0,"data-menu-tree":h.treeId,onClick:x=>{o?.(x),!x.defaultPrevented&&(h.open?h.close(!1):h.openWith("panel"))},onKeyDown:x=>{if(a?.(x),x.defaultPrevented)return;const y=x.key==="Enter"||x.key===" "||x.key==="ArrowDown"?"first":x.key==="ArrowUp"?"last":null;if(!y)return;x.preventDefault();const k=h.open?document.getElementById(h.panelId):null;if(k){const D=L(k);E(y==="last"?D[D.length-1]:D[0]);return}h.openWith(y)}};return r?c.jsx("button",{ref:j,type:"button",className:n,...I,...P,children:t}):c.jsx(be.Button,{ref:j,className:S.cn("rst:min-h-11 rst:min-w-11",n),variant:u,colorScheme:p,size:m,isLoading:f,loadingLabel:l,startIcon:b,endIcon:w,surface:g,...I,...P,children:t})});function Re({children:e,align:r="start",offset:n=4,className:o,...a}){const t=A("MenuItems"),{mounted:d,closed:s,leaving:u}=te(t.open),p=i.useRef(null),m=q(t.triggerEl),{setPanel:f,panelEl:l,floatingStyles:b,placement:w,isPositioned:g}=re(t.triggerEl,d,`bottom-${r}`,n,p),I=ae(),{typedRef:h,typingAhead:M}=oe(),j=se({panelRef:p,typedRef:h,onEscape:()=>t.close(!0)});i.useLayoutEffect(()=>{if(!t.open||!l)return;const y=L(l),k=t.focusOnOpen.current;k==="first"&&y[0]?E(y[0]):k==="last"&&y.length?E(y[y.length-1]):l.focus({preventScroll:!0})},[t.open,l,t.focusOnOpen]),i.useLayoutEffect(()=>{if(!g||!l)return;const y=document.activeElement;y&&y!==l&&l.contains(y)&&y.scrollIntoView?.({block:"nearest"})},[g,l]),i.useLayoutEffect(()=>{!t.open&&l?.contains(document.activeElement)&&t.triggerRef.current?.focus({preventScroll:!0})},[t.open,l,t.triggerRef]);const P=y=>{const k=y.relatedTarget;k&&!k.closest(`[data-menu-tree="${t.treeId}"]`)&&t.close(!1)};if(!d)return null;const x=K.carriesDark(t.triggerEl);return c.jsx(G.Portal,{children:c.jsx(_.Provider,{value:{...I,panelRef:p,typingAhead:M},children:c.jsx("div",{ref:f,id:t.panelId,dir:m?"rtl":"ltr",role:"menu","aria-labelledby":a["aria-label"]?void 0:t.triggerId,"aria-label":a["aria-label"],tabIndex:-1,"data-menu-panel":"","data-menu-tree":t.treeId,"data-closed":s?"":void 0,"data-leaving":u?"":void 0,onKeyDown:j,onBlur:P,style:{...b,...Q,transformOrigin:Z(w,m)},className:S.cn(x&&"dark",ee,o),children:e})})})}function ae(){const[e,r]=i.useState(null),n=i.useRef(!1),o=i.useRef(void 0);return i.useEffect(()=>()=>window.clearTimeout(o.current),[]),{openSubmenu:e,focusFirstInSubmenu:n,setOpenSubmenu:(a,t=!1)=>{window.clearTimeout(o.current),n.current=t,r(a)},hoverItem:a=>{window.clearTimeout(o.current),a===null&&(o.current=window.setTimeout(()=>r(null),X))}}}const O=S.cn("rst:relative rst:flex rst:w-full rst:min-h-11 rst:items-center rst:gap-2.5 rst:border-0 rst:bg-transparent rst:px-3 rst:py-2 rst:text-start rst:text-sm rst:text-inherit rst:no-underline rst:[font-family:inherit] rst:cursor-pointer rst:select-none rst:outline-none rst:transition-colors","rst:focus:bg-primary-100 rst:focus:text-primary-900 rst:dark:focus:bg-primary-900/30 rst:dark:focus:text-primary-100 rst:forced-colors:focus:outline-solid rst:forced-colors:focus:outline-2 rst:forced-colors:focus:-outline-offset-2","rst:data-key-focus:ring-2 rst:data-key-focus:ring-inset rst:data-key-focus:ring-ring","rst:aria-disabled:opacity-50 rst:aria-disabled:cursor-not-allowed"),F="rst:text-error-600 rst:dark:text-error-400 rst:focus:bg-error-50 rst:focus:text-error-700 rst:dark:focus:bg-error-900/30 rst:dark:focus:text-error-300",Ce=()=>c.jsx("svg",{viewBox:"0 0 16 16",width:"16",height:"16",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",children:c.jsx("path",{d:"M3.5 8.5 6.5 11.5 12.5 4.5"})}),Le=()=>c.jsx("svg",{viewBox:"0 0 16 16",width:"16",height:"16","aria-hidden":"true",children:c.jsx("circle",{cx:"8",cy:"8",r:"3.5",fill:"currentColor"})}),Oe=()=>c.jsx("svg",{viewBox:"0 0 16 16",width:"16",height:"16",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",className:"rst:rtl:rotate-180",children:c.jsx("path",{d:"M6 3.5 10.5 8 6 12.5"})});function T({icon:e,shortcut:r,description:n,badge:o,children:a},t,d,s){const u=t??e;return c.jsxs(c.Fragment,{children:[u!=null&&c.jsx("span",{"aria-hidden":"true",className:S.cn("rst:flex rst:size-4 rst:shrink-0 rst:items-center rst:justify-center",n!=null&&"rst:self-start rst:mt-0.5"),"data-menu-lead":"",children:u}),c.jsxs("span",{className:"rst:min-w-0 rst:flex-1 rst:break-words","data-menu-label":"",children:[a,n!=null&&c.jsx("span",{id:s,"aria-hidden":"true",className:"rst:block rst:text-xs rst:opacity-75","data-menu-description":"",children:n})]}),o!=null&&c.jsx("span",{className:"rst:flex rst:shrink-0 rst:items-center","data-menu-badge":"",children:o}),r&&c.jsx("span",{"aria-hidden":"true",className:"rst:ms-auto rst:shrink-0 rst:ps-4 rst:text-xs rst:tracking-wide rst:opacity-70","data-menu-shortcut":"",children:r}),d]})}function z({disabled:e,closeOnSelect:r,onChoose:n,spaceKeepsOpen:o}){const a=A("MenuItem"),t=$("MenuItem"),d=(s,u)=>{if(e){s.preventDefault();return}n(s),u&&a.close(!0)};return{onClick:s=>d(s,r),onKeyDown:s=>{if(s.key===" "){if(t.typingAhead())return;s.preventDefault(),d(s,r&&!o)}},onPointerMove:s=>{J(s)&&(t.hoverItem(null),document.activeElement!==s.currentTarget&&s.currentTarget.focus({preventScroll:!0}))}}}function Ne({onSelect:e,href:r,closeOnSelect:n=!0,disabled:o,destructive:a,keyshortcuts:t,textValue:d,className:s,...u}){const p=A("MenuItem"),m=$("MenuItem"),f=i.useId(),l=z({disabled:o,closeOnSelect:n,onChoose:g=>e?.(g)}),b=S.cn(O,a&&F,s),w={role:"menuitem",tabIndex:-1,"aria-disabled":o?!0:void 0,"aria-keyshortcuts":t,"aria-describedby":u.description!=null?f:void 0,"data-menu-item":"","data-menu-text":d,"data-destructive":a?"":void 0};if(r!==void 0){const g=p.linkComponent;return c.jsx(g,{href:r,to:r,className:b,...w,onClick:l.onClick,onPointerMove:l.onPointerMove,onKeyDown:I=>{if(I.key===" "){if(m.typingAhead())return;I.preventDefault(),o||I.currentTarget.click()}},children:T(u,void 0,void 0,f)})}return c.jsx("button",{type:"button",className:b,...w,...l,children:T(u,void 0,void 0,f)})}function Be({checked:e,onCheckedChange:r,indicator:n,closeOnSelect:o=!0,disabled:a,destructive:t,keyshortcuts:d,textValue:s,className:u,...p}){const m=z({disabled:a,closeOnSelect:o,spaceKeepsOpen:!0,onChoose:()=>r(!e)}),f=i.useId();return c.jsx("button",{type:"button",role:"menuitemcheckbox","aria-checked":e,"aria-describedby":p.description!=null?f:void 0,tabIndex:-1,"aria-disabled":a||void 0,"aria-keyshortcuts":d,"data-menu-item":"","data-menu-text":s,className:S.cn(O,t&&F,u),...m,children:n===void 0?T(p,c.jsx("span",{className:e?void 0:"rst:invisible","data-menu-check":"",children:c.jsx(Ce,{})}),void 0,f):T(p,void 0,c.jsx("span",{"aria-hidden":"true",className:"rst:ms-auto rst:flex rst:shrink-0 rst:items-center",children:n}),f)})}function Ke({value:e,onValueChange:r,label:n,children:o,className:a}){return c.jsx(Y.Provider,{value:{value:e,onValueChange:r},children:c.jsx(ie,{label:n,className:a,children:o})})}function _e({value:e,closeOnSelect:r=!0,disabled:n,destructive:o,keyshortcuts:a,textValue:t,className:d,...s}){const u=i.useContext(Y);if(!u)throw new Error("<MenuRadioItem> must be inside a <MenuRadioGroup>.");const p=u.value===e,m=z({disabled:n,closeOnSelect:r,spaceKeepsOpen:!0,onChoose:()=>u.onValueChange?.(e)}),f=i.useId();return c.jsx("button",{type:"button",role:"menuitemradio","aria-checked":p,"aria-describedby":s.description!=null?f:void 0,tabIndex:-1,"aria-disabled":n||void 0,"aria-keyshortcuts":a,"data-menu-item":"","data-menu-text":t,className:S.cn(O,o&&F,d),...m,children:T(s,c.jsx("span",{className:p?void 0:"rst:invisible","data-menu-check":"",children:c.jsx(Le,{})}),void 0,f)})}function ie({label:e,children:r,className:n}){const o=i.useId();return c.jsxs("div",{role:"group","aria-labelledby":e?o:void 0,className:n,children:[e&&c.jsx("div",{id:o,className:"rst:px-3 rst:pt-2 rst:pb-1 rst:text-xs rst:font-semibold rst:text-gray-600 rst:dark:text-gray-400","data-menu-heading":"",children:e}),r]})}function $e({className:e}){return c.jsx("div",{role:"separator",className:S.cn("rst:my-1 rst:h-[var(--roster-border-width,1px)] rst:bg-[var(--roster-popover-border)]",e)})}function qe({label:e,children:r,icon:n,disabled:o,textValue:a,className:t,panelClassName:d}){const s=A("MenuSubmenu"),u=$("MenuSubmenu"),p=i.useId(),m=`${p}-item`,f=`${p}-menu`,l=u.openSubmenu===m,b=i.useRef(null),[w,g]=i.useState(null),I=i.useCallback(v=>{b.current=v,g(v)},[]),h=i.useRef(null),M=i.useRef(void 0),j=i.useRef("mouse"),{mounted:P,closed:x,leaving:y}=te(l),k=q(w),{setPanel:D,panelEl:N,floatingStyles:ue,placement:ce}=re(w,P,k?"left-start":"right-start",{mainAxis:0,alignmentAxis:-4},h,!0),le=ae();i.useEffect(()=>()=>window.clearTimeout(M.current),[]);const H=()=>{u.setOpenSubmenu(null),E(b.current)},{typedRef:de,typingAhead:fe}=oe(),me=se({panelRef:h,typedRef:de,onEscape:H,onBack:H});i.useLayoutEffect(()=>{!l||!N||u.focusFirstInSubmenu.current&&E(L(N)[0])},[l,N,u.focusFirstInSubmenu]);const B=v=>{if(!o){if(l&&v&&h.current){E(L(h.current)[0]);return}u.setOpenSubmenu(m,v)}},pe=K.carriesDark(s.triggerEl);return c.jsxs(c.Fragment,{children:[c.jsx("button",{ref:I,id:m,type:"button",role:"menuitem",tabIndex:-1,"aria-haspopup":"menu","aria-expanded":l,"aria-controls":l?f:void 0,"aria-disabled":o||void 0,"data-menu-item":"","data-menu-text":a,"data-menu-tree":s.treeId,className:S.cn(O,l&&"rst:bg-gray-100 rst:dark:bg-gray-700/50",t),onPointerDown:v=>{j.current=v.pointerType},onClick:()=>l&&j.current!=="mouse"?u.setOpenSubmenu(null):B(!1),onKeyDown:v=>{const ge=k?"ArrowLeft":"ArrowRight";v.key===" "&&u.typingAhead()||(v.key===ge||v.key==="Enter"||v.key===" ")&&(v.preventDefault(),B(!0))},onPointerMove:v=>{J(v)&&(u.hoverItem(m),document.activeElement!==v.currentTarget&&v.currentTarget.focus({preventScroll:!0}),!l&&!o&&(window.clearTimeout(M.current),M.current=window.setTimeout(()=>B(!1),X)))},onPointerLeave:()=>window.clearTimeout(M.current),children:T({icon:n,children:e},void 0,c.jsx("span",{"aria-hidden":"true",className:"rst:ms-auto rst:flex rst:shrink-0 rst:items-center rst:opacity-70","data-menu-chevron":"",children:c.jsx(Oe,{})}))}),P&&c.jsx(G.Portal,{children:c.jsx(_.Provider,{value:{...le,panelRef:h,typingAhead:fe},children:c.jsx("div",{ref:D,id:f,dir:k?"rtl":"ltr",role:"menu","aria-labelledby":m,tabIndex:-1,"data-menu-panel":"","data-menu-tree":s.treeId,"data-closed":x?"":void 0,"data-leaving":y?"":void 0,onKeyDown:me,onPointerEnter:()=>u.hoverItem(m),style:{...ue,...Q,transformOrigin:Z(ce,k)},className:S.cn(pe&&"dark",ee,d),children:r})})})]})}exports.Menu=Ae;exports.MenuButton=De;exports.MenuCheckboxItem=Be;exports.MenuGroup=ie;exports.MenuItem=Ne;exports.MenuItems=Re;exports.MenuRadioGroup=Ke;exports.MenuRadioItem=_e;exports.MenuSeparator=$e;exports.MenuSubmenu=qe;