@ngrok/mantle 0.83.6 → 0.83.8

package/dist/hover-card.d.ts

@@ -5,9 +5,12 @@ import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
  * A floating card that appears when a user hovers over a trigger element.
  * This is the root, stateful component that manages the open/closed state of the hover card.
  *
- * `HoverCard.Content` renders at Tailwind `z-50`, Mantle's shared floating
- * z-index. When multiple shared layers are open, the most recently mounted
- * layer renders on top.
+ * `HoverCard.Content` renders at Tailwind `z-50`, Mantle's float tier. When
+ * composed inside an open `Dialog`, `AlertDialog`, or `Sheet`, it portals into
+ * that overlay's positioner and paints above the overlay that owns it. Outside
+ * every overlay, it portals to `document.body`, below the overlay tier
+ * (`z-60`). When sibling floats share a container, the most recently mounted
+ * float paints on top.
  *
  * @see https://mantle.ngrok.com/components/overlays/hover-card#hovercardroot
  *
@@ -46,12 +49,44 @@ declare const Root: ({ closeDelay, openDelay, ...props }: ComponentProps<typeof
  * ```
  */
 declare const Trigger: (props: ComponentProps<typeof HoverCardPrimitive.Trigger>) => import("react").JSX.Element;
+/**
+ * The portal container for rendering hover card content outside the normal DOM tree.
+ * `HoverCard.Content` already renders inside this portal internally, so you typically
+ * do not need to use `HoverCard.Portal` directly. Use it only when you need to
+ * customize portal placement (e.g., pass a `container` prop) or wrap multiple
+ * `HoverCard.Content` instances in a shared portal.
+ *
+ * When `container` is omitted, content mounts into the nearest layer container —
+ * an enclosing overlay's positioner when one is open, else `document.body`.
+ *
+ * @see https://mantle.ngrok.com/components/overlays/hover-card#hovercardportal
+ *
+ * @example
+ * ```tsx
+ * <HoverCard.Root>
+ *   <HoverCard.Trigger asChild>
+ *     <Button type="button" appearance="outlined" intent="neutral">
+ *       Hover me
+ *     </Button>
+ *   </HoverCard.Trigger>
+ *   <HoverCard.Portal>
+ *     <HoverCard.Content>
+ *       <p>This is the hover card content.</p>
+ *     </HoverCard.Content>
+ *   </HoverCard.Portal>
+ * </HoverCard.Root>
+ * ```
+ */
+declare const Portal: ({ container, ...props }: ComponentProps<typeof HoverCardPrimitive.Portal>) => import("react").JSX.Element;
 /**
  * The content to render inside the hover card.
  *
- * `HoverCard.Content` renders at Tailwind `z-50`, Mantle's shared floating
- * z-index. When multiple shared layers are open, the most recently mounted
- * layer renders on top.
+ * `HoverCard.Content` renders at Tailwind `z-50`, Mantle's float tier. When
+ * composed inside an open `Dialog`, `AlertDialog`, or `Sheet`, it portals into
+ * that overlay's positioner and paints above the overlay that owns it. Outside
+ * every overlay, it portals to `document.body`, below the overlay tier
+ * (`z-60`). When sibling floats share a container, the most recently mounted
+ * float paints on top.
  *
  * It sets `position: relative`, so `HoverCard.Arrow`'s absolutely-positioned
  * wrapper keeps one containing block through the open animation. An
@@ -110,9 +145,12 @@ declare const Arrow: ({ className, height, width, ...props }: HoverCardArrowProp
  * For short, non-interactive labels or hints, use `Tooltip`. For
  * interactive overlays the user opens deliberately, use `Popover`.
  *
- * `HoverCard.Content` renders at Tailwind `z-50`, Mantle's shared floating
- * z-index. When multiple shared layers are open, the most recently mounted
- * layer renders on top.
+ * `HoverCard.Content` renders at Tailwind `z-50`, Mantle's float tier. When
+ * composed inside an open `Dialog`, `AlertDialog`, or `Sheet`, it portals into
+ * that overlay's positioner and paints above the overlay that owns it. Outside
+ * every overlay, it portals to `document.body`, below the overlay tier
+ * (`z-60`). When sibling floats share a container, the most recently mounted
+ * float paints on top.
  *
  * @see https://mantle.ngrok.com/components/overlays/hover-card
  *
@@ -143,9 +181,12 @@ declare const HoverCard: {
   /**
    * The root, stateful component that manages the open/closed state of the hover card.
    *
-   * `HoverCard.Content` renders at Tailwind `z-50`, Mantle's shared floating
-   * z-index. When multiple shared layers are open, the most recently mounted
-   * layer renders on top.
+   * `HoverCard.Content` renders at Tailwind `z-50`, Mantle's float tier. When
+   * composed inside an open `Dialog`, `AlertDialog`, or `Sheet`, it portals into
+   * that overlay's positioner and paints above the overlay that owns it. Outside
+   * every overlay, it portals to `document.body`, below the overlay tier
+   * (`z-60`). When sibling floats share a container, the most recently mounted
+   * float paints on top.
    *
    * @see https://mantle.ngrok.com/components/overlays/hover-card#hovercardroot
    *
@@ -191,9 +232,12 @@ declare const HoverCard: {
   /**
    * The content to render inside the hover card. Appears in a portal with rich styling and animations.
    *
-   * `HoverCard.Content` renders at Tailwind `z-50`, Mantle's shared floating
-   * z-index. When multiple shared layers are open, the most recently mounted
-   * layer renders on top.
+   * `HoverCard.Content` renders at Tailwind `z-50`, Mantle's float tier. When
+   * composed inside an open `Dialog`, `AlertDialog`, or `Sheet`, it portals into
+   * that overlay's positioner and paints above the overlay that owns it. Outside
+   * every overlay, it portals to `document.body`, below the overlay tier
+   * (`z-60`). When sibling floats share a container, the most recently mounted
+   * float paints on top.
    *
    * @see https://mantle.ngrok.com/components/overlays/hover-card#hovercardcontent
    *
@@ -238,7 +282,7 @@ declare const HoverCard: {
    * </HoverCard.Root>
    * ```
    */
-  readonly Portal: import("react").FC<HoverCardPrimitive.HoverCardPortalProps>;
+  readonly Portal: typeof Portal;
   /**
    * The trigger element that opens the hover card when hovered.
    *

package/dist/hover-card.js

@@ -1 +1 @@
-import{t as e}from"./cx-IiQEAKf5.js";import{jsx as t,jsxs as n}from"react/jsx-runtime";import*as r from"@radix-ui/react-hover-card";const i=({closeDelay:e=300,openDelay:n=100,...i})=>t(r.Root,{closeDelay:e,openDelay:n,...i}),a=e=>t(r.Trigger,{"data-slot":`hover-card-trigger`,...e}),o=r.Portal,s={Root:i,Arrow:({className:i,height:a=7,width:o=14,...s})=>t(r.Arrow,{"aria-hidden":`true`,asChild:!0,"data-slot":`hover-card-arrow`,height:a,width:o,...s,children:n(`svg`,{className:e(`fill-[var(--background-color-popover)]`,`[clip-path:inset(0_-200%_-200%_-200%)]`,`[filter:drop-shadow(0_0_4px_color-mix(in_oklab,var(--shadow-color)_var(--shadow-first-opacity),transparent))]`,i),children:[t(`polygon`,{points:`0,0 30,0 15,10`}),t(`polyline`,{className:`stroke-[color:var(--border-color-popover)]`,fill:`none`,points:`0,0 15,10 30,0`,strokeWidth:1.5,vectorEffect:`non-scaling-stroke`})]})}),Content:({className:n,onClick:i,align:a=`center`,sideOffset:s=4,...c})=>t(o,{children:t(r.Content,{"data-slot":`hover-card-content`,align:a,sideOffset:s,className:e(`relative`,`bg-popover border-popover z-50 w-64 rounded-md border p-4 shadow-md outline-hidden`,`data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 data-state-closed:zoom-out-95 data-state-open:zoom-in-95 data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2`,n),onClick:e=>{e.stopPropagation(),i?.(e)},...c})}),Portal:o,Trigger:a};export{s as HoverCard};
+import{t as e}from"./cx-IiQEAKf5.js";import{n as t,r as n}from"./layer-container-CglTh9-6.js";import{jsx as r,jsxs as i}from"react/jsx-runtime";import*as a from"@radix-ui/react-hover-card";const o=({closeDelay:e=300,openDelay:t=100,...n})=>r(a.Root,{closeDelay:e,openDelay:t,...n}),s=e=>r(a.Trigger,{"data-slot":`hover-card-trigger`,...e}),c=({container:e,...i})=>{let o=n(),s=e??o;return r(t.Provider,{value:s,children:r(a.Portal,{container:s,...i})})},l={Root:o,Arrow:({className:t,height:n=7,width:o=14,...s})=>r(a.Arrow,{"aria-hidden":`true`,asChild:!0,"data-slot":`hover-card-arrow`,height:n,width:o,...s,children:i(`svg`,{className:e(`fill-[var(--background-color-popover)]`,`[clip-path:inset(0_-200%_-200%_-200%)]`,`[filter:drop-shadow(0_0_4px_color-mix(in_oklab,var(--shadow-color)_var(--shadow-first-opacity),transparent))]`,t),children:[r(`polygon`,{points:`0,0 30,0 15,10`}),r(`polyline`,{className:`stroke-[color:var(--border-color-popover)]`,fill:`none`,points:`0,0 15,10 30,0`,strokeWidth:1.5,vectorEffect:`non-scaling-stroke`})]})}),Content:({className:t,onClick:n,align:i=`center`,sideOffset:o=4,...s})=>r(c,{children:r(a.Content,{"data-slot":`hover-card-content`,align:i,sideOffset:o,className:e(`relative`,`bg-popover border-popover z-50 w-64 rounded-md border p-4 shadow-md outline-hidden`,`data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 data-state-closed:zoom-out-95 data-state-open:zoom-in-95 data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2`,t),onClick:e=>{e.stopPropagation(),n?.(e)},...s})}),Portal:c,Trigger:s};export{l as HoverCard};

package/dist/layer-container-CglTh9-6.js

@@ -0,0 +1 @@
+import{t as e}from"./compose-refs-BdBMM9ga.js";import{createContext as t,useContext as n,useState as r}from"react";import{jsx as i}from"react/jsx-runtime";const a=t(null);function o(){return n(a)}function s({children:t,ref:n,...o}){let[s,c]=r(null);return i(`div`,{ref:e(n,c),...o,children:i(a.Provider,{value:s,children:t})})}export{a as n,o as r,s as t};

package/dist/layer-container.d.ts

@@ -0,0 +1,57 @@
+import { ComponentProps } from "react";
+//#region src/utils/layer-container/layer-container.d.ts
+/**
+ * The portal target for floating layers composed inside an overlay.
+ *
+ * Mantle stacks floating UI in two tiers: overlays (`Dialog`, `AlertDialog`,
+ * `Sheet`) render at `z-60`, floats (`Popover`, `Tooltip`, `Select`,
+ * `DropdownMenu`, `HoverCard`) at `z-50`. An overlay's content provides its
+ * positioner element through this context. A float composed inside the overlay
+ * portals into that positioner instead of `document.body`, so it paints above
+ * the overlay that owns it. A float outside every overlay reads `null`,
+ * portals to `document.body`, and stays below the overlay tier no matter when
+ * it opens.
+ *
+ * Why the positioner and not a sibling element: Radix marks the portal's
+ * other children `aria-hidden` when a modal overlay opens, so a float portaled
+ * into a sibling would be hidden from screen readers. The positioner is on the
+ * overlay content's ancestor chain, which the marking skips.
+ */
+declare const LayerContainerContext: import("react").Context<DocumentFragment | Element | null>;
+/**
+ * The nearest overlay's layer container, or `null` outside every overlay.
+ * Pass the result to a portal's `container` prop — `null` falls back to
+ * `document.body`.
+ *
+ * @example
+ * ```tsx
+ * const layerContainer = useLayerContainer();
+ * return (
+ *   <PopoverPrimitive.Portal container={layerContainer}>
+ *     <PopoverPrimitive.Content>…</PopoverPrimitive.Content>
+ *   </PopoverPrimitive.Portal>
+ * );
+ * ```
+ */
+declare function useLayerContainer(): Element | DocumentFragment | null;
+/**
+ * The provider half of {@link LayerContainerContext}: a `div` that registers
+ * itself as the layer container for every float composed inside it. An overlay
+ * renders it as its positioner — the fixed element that lays out its content —
+ * so floats portaled into it later land on the content's ancestor chain and
+ * paint above the content. The caller passes the positioning classes and the
+ * `data-slot`; this component carries none of its own.
+ *
+ * @example
+ * ```tsx
+ * <Portal>
+ *   <Overlay />
+ *   <LayerContainer data-slot="dialog-positioner" className="fixed inset-4 z-60 flex items-center justify-center">
+ *     <DialogPrimitive.Content>…</DialogPrimitive.Content>
+ *   </LayerContainer>
+ * </Portal>
+ * ```
+ */
+declare function LayerContainer({ children, ref, ...props }: ComponentProps<"div">): import("react").JSX.Element;
+//#endregion
+export { LayerContainer, LayerContainerContext, useLayerContainer };

package/dist/layer-container.js

@@ -0,0 +1 @@
+import{n as e,r as t,t as n}from"./layer-container-CglTh9-6.js";export{n as LayerContainer,e as LayerContainerContext,t as useLayerContainer};

package/dist/llms.txt

@@ -1,4 +1,4 @@
-# @ngrok/mantle (0.83.6)
+# @ngrok/mantle (0.83.8)
 
 > Offline discovery hint shipped inside the @ngrok/mantle npm package. Authoritative metadata lives at https://mantle.ngrok.com/for-ai-agents.
 

package/dist/mantle.css

@@ -717,7 +717,7 @@ MARK: COMPONENT GEOMETRY
    `--sidebar-width-mobile` with it, or the floor outgrows the sheet's row),
    or set `--sidebar-row-width` on the outside surface itself. */
 :root {
-	--sidebar-row-width: calc(var(--sidebar-width, 16rem) - 1rem);
+	--sidebar-row-width: calc(var(--sidebar-width, 13rem) - 1rem);
 }
 
 /**
@@ -1284,7 +1284,6 @@ at `:root` (same reason as the palette-alias rule in MARK: INVERT THEME).
 	align-items: flex-start;
 	min-width: 100%;
 	box-sizing: border-box;
-	padding-right: 3.5rem; /* space for the copy button overlay */
 }
 
 .mantle-code-line[data-fold-hidden="true"] {
@@ -1295,7 +1294,16 @@ at `:root` (same reason as the palette-alias rule in MARK: INVERT THEME).
 	background-color: var(--mantle-code-line-highlight-bg);
 }
 
+/*
+ * Why sticky: only the code scrolls; the line numbers stay pinned to the
+ * inline-start edge of the scrollport. `z-index: 1` also scopes the
+ * backdrop pseudo-element below, so its `z-index: -1` stays inside this
+ * stacking context instead of dropping under the code text.
+ */
 .mantle-code-line-number {
+	position: sticky;
+	left: 0;
+	z-index: 1;
 	display: block;
 	flex-shrink: 0;
 	width: var(--mantle-code-line-number-width);
@@ -1305,6 +1313,51 @@ at `:root` (same reason as the palette-alias rule in MARK: INVERT THEME).
 	color: var(--mantle-code-line-number-color);
 }
 
+/*
+ * The opaque gutter backdrop. Scrolled code slides under the pinned numbers,
+ * so this masks it across the whole gutter band — the number column plus its
+ * gap, and the fold gutter on fold-enabled blocks (`--_gutter-overhang`).
+ */
+.mantle-code-line-number::before {
+	content: "";
+	position: absolute;
+	inset: 0 calc(-1 * var(--_gutter-overhang, var(--mantle-code-line-number-gap))) 0 0;
+	z-index: -1;
+	background-color: var(--background-color-base);
+}
+
+pre[data-slot="code-block-code"]:has(.mantle-code-fold-toggle) .mantle-code-line-number::before {
+	--_gutter-overhang: calc(
+		var(--mantle-code-line-number-gap) + var(--mantle-code-fold-gutter-width) +
+			var(--mantle-code-fold-gutter-gap)
+	);
+}
+
+/*
+ * Re-add the line-highlight tint over the opaque backdrop, so a highlighted
+ * line's gutter matches its content — the same look the translucent line
+ * background painted before the backdrop covered it.
+ */
+.mantle-code-line-highlighted .mantle-code-line-number::before {
+	background-image: linear-gradient(
+		var(--mantle-code-line-highlight-bg),
+		var(--mantle-code-line-highlight-bg)
+	);
+}
+
+/*
+ * Why sticky only with line numbers: the toggle is gutter furniture and pins
+ * with the numbers, whose backdrop masks the code scrolling under it. With
+ * numbers off there is no backdrop, so the toggle scrolls with the code.
+ * `left` matches the toggle's resting offset after the number column, and
+ * `z-index: 1` paints this later sibling above the numbers' backdrop.
+ */
+pre[data-mantle-line-numbers="true"] .mantle-code-fold-toggle {
+	position: sticky;
+	left: calc(var(--mantle-code-line-number-width) + var(--mantle-code-line-number-gap));
+	z-index: 1;
+}
+
 .mantle-code-fold-toggle {
 	flex-shrink: 0;
 	display: inline-flex;

package/dist/multi-select.d.ts

@@ -21,9 +21,11 @@ type MultiSelectProps = Primitive.ComboboxProviderProps<string[]>;
  * combobox input — so a native form submit sends the selected values, not the
  * typeahead filter text.
  *
- * `MultiSelect.Content` renders at Tailwind `z-50`, Mantle's shared floating
- * z-index. When multiple shared layers are open, the most recently mounted
- * layer renders on top.
+ * `MultiSelect.Content` renders at Tailwind `z-50` and portals into the closest
+ * `data-mantle-modal-content` element — an enclosing overlay's content — else
+ * the nearest overlay's positioner, else `document.body`. Inside an overlay it
+ * paints above the content that contains
+ * it. Outside one, an open overlay (`z-60`) covers it.
  *
  * @see https://mantle.ngrok.com/components/forms/multi-select#multiselectroot
  *
@@ -206,9 +208,11 @@ type MultiSelectContentProps = Omit<Primitive.ComboboxPopoverProps, "render"> &
  * Renders a popover that contains multi-select content, such as items, groups,
  * and separators. Opens below the trigger.
  *
- * `MultiSelect.Content` renders at Tailwind `z-50`, Mantle's shared floating
- * z-index. When multiple shared layers are open, the most recently mounted
- * layer renders on top.
+ * `MultiSelect.Content` renders at Tailwind `z-50` and portals into the closest
+ * `data-mantle-modal-content` element — an enclosing overlay's content — else
+ * the nearest overlay's positioner, else `document.body`. Inside an overlay it
+ * paints above the content that contains
+ * it. Outside one, an open overlay (`z-60`) covers it.
  *
  * By default, mantle disables Ariakit's body scroll lock when the trigger is
  * inside a mantle modal (`Dialog`, `Sheet`, `AlertDialog`) — the modal already
@@ -411,9 +415,11 @@ declare const ContentFooter: ({ className, children, ref, ...props }: MultiSelec
  * items rendered as removable tags/chips. For single selection, use Combobox (with search)
  * or Select (without).
  *
- * `MultiSelect.Content` renders at Tailwind `z-50`, Mantle's shared floating
- * z-index. When multiple shared layers are open, the most recently mounted
- * layer renders on top.
+ * `MultiSelect.Content` renders at Tailwind `z-50` and portals into the closest
+ * `data-mantle-modal-content` element — an enclosing overlay's content — else
+ * the nearest overlay's positioner, else `document.body`. Inside an overlay it
+ * paints above the content that contains
+ * it. Outside one, an open overlay (`z-60`) covers it.
  *
  * @see https://mantle.ngrok.com/components/forms/multi-select
  * @see https://www.w3.org/WAI/ARIA/apg/patterns/combobox/
@@ -460,9 +466,11 @@ declare const MultiSelect: {
    * items rendered as removable tags/chips. For single selection, use Combobox (with search)
    * or Select (without).
    *
-   * `MultiSelect.Content` renders at Tailwind `z-50`, Mantle's shared
-   * floating z-index. When multiple shared layers are open, the most recently
-   * mounted layer renders on top.
+   * `MultiSelect.Content` renders at Tailwind `z-50` and portals into the
+   * closest `data-mantle-modal-content` element — an enclosing overlay's content
+   * — else the nearest overlay's positioner, else `document.body`. Inside an
+   * overlay it paints above the content that contains it. Outside one, an open
+   * overlay (`z-60`) covers it.
    *
    * @see https://mantle.ngrok.com/components/forms/multi-select#multiselectroot
    *
@@ -584,9 +592,11 @@ declare const MultiSelect: {
   /**
    * Renders a popover that contains multi-select content.
    *
-   * `MultiSelect.Content` renders at Tailwind `z-50`, Mantle's shared
-   * floating z-index. When multiple shared layers are open, the most recently
-   * mounted layer renders on top.
+   * `MultiSelect.Content` renders at Tailwind `z-50` and portals into the
+   * closest `data-mantle-modal-content` element — an enclosing overlay's content
+   * — else the nearest overlay's positioner, else `document.body`. Inside an
+   * overlay it paints above the content that contains it. Outside one, an open
+   * overlay (`z-60`) covers it.
    *
    * @see https://mantle.ngrok.com/components/forms/multi-select#multiselectcontent
    *

package/dist/multi-select.js

@@ -1 +1 @@
-import{t as e}from"./compose-refs-BdBMM9ga.js";import{t}from"./cx-IiQEAKf5.js";import{t as n}from"./icon-lZ48P8Nn.js";import{t as r}from"./slot-DpNWVci8.js";import{a as i,r as a}from"./field-Bpptk_9t.js";import{t as o}from"./field-B1wqeZr4.js";import{n as s}from"./separator-D0D6VyyM.js";import{t as c}from"./use-prefers-reduced-motion-Bk5zAfHY.js";import{createContext as l,useCallback as u,useContext as d,useEffect as f,useMemo as p,useRef as m,useState as h}from"react";import{Fragment as g,jsx as _,jsxs as v}from"react/jsx-runtime";import{XIcon as y}from"@phosphor-icons/react/X";import{CheckIcon as b}from"@phosphor-icons/react/Check";import*as x from"@ariakit/react";import{LockIcon as S}from"@phosphor-icons/react/Lock";const C=e=>Array.isArray(e)&&e.every(e=>typeof e==`string`),w=[],T=l({current:null}),E=l({current:[]}),D=l({onInputKeyDownRef:{current:void 0},inputRef:{current:null}}),O=({children:e,defaultSelectedValue:t=w,...n})=>{let r=m(null),i=m(void 0),a=m(null),o=m([]),s=p(()=>({onInputKeyDownRef:i,inputRef:a}),[]);return _(T.Provider,{value:r,children:_(D.Provider,{value:s,children:_(E.Provider,{value:o,children:_(x.ComboboxProvider,{defaultSelectedValue:t,...n,children:e})})})})},k=({"aria-invalid":n,className:r,children:o,onKeyDown:s,onMouseDown:c,ref:l,validation:u,...f})=>{let p=d(T),{inputRef:m}=d(D),h=x.useComboboxContext(),g=i(),{validation:v}=a({"aria-invalid":n,validation:u??g});return _(`div`,{role:`group`,"data-slot":`multi-select-trigger`,className:t(`cursor-text select-none font-sans text-sm`,`border-form bg-form text-strong flex min-h-9 w-full flex-wrap items-center gap-1 rounded-md border px-3 py-1 has-[[data-slot=multi-select-tag]]:px-1`,`has-focus:outline-hidden has-focus-within:ring-4 has-aria-expanded:ring-4`,`has-focus-within:border-accent-600 has-focus-within:ring-focus-accent has-aria-expanded:border-accent-600 has-aria-expanded:ring-focus-accent`,`data-validation-success:border-success-600 data-validation-success:has-focus-within:border-success-600 data-validation-success:has-focus-within:ring-focus-success data-validation-success:has-aria-expanded:border-success-600 data-validation-success:has-aria-expanded:ring-focus-success`,`data-validation-warning:border-warning-600 data-validation-warning:has-focus-within:border-warning-600 data-validation-warning:has-focus-within:ring-focus-warning data-validation-warning:has-aria-expanded:border-warning-600 data-validation-warning:has-aria-expanded:ring-focus-warning`,`data-validation-error:border-danger-600 data-validation-error:has-focus-within:border-danger-600 data-validation-error:has-focus-within:ring-focus-danger data-validation-error:has-aria-expanded:border-danger-600 data-validation-error:has-aria-expanded:ring-focus-danger`,r),"data-validation":v||void 0,onKeyDown:e=>{e.key===`Escape`&&h?.getState().open&&(e.preventDefault(),h.hide()),s?.(e)},onMouseDown:e=>{e.target instanceof HTMLElement&&!e.target.closest(`button, input, [role='option']`)&&(e.preventDefault(),m.current?.focus()),c?.(e)},ref:e(p,l),...f,children:o})},A=({className:r,value:i,onRemove:a,locked:o=!1,onKeyDown:s,ref:c,...l})=>{let u=m(null);return v(`span`,{ref:e(u,c),role:`option`,"aria-selected":!0,tabIndex:-1,"data-slot":`multi-select-tag`,"data-locked":o||void 0,className:t(`cursor-default bg-neutral-500/10 border border-neutral-500/20 rounded-xs text-strong inline-flex items-center gap-1 pl-2 pr-0.5 py-0.5 text-sm font-normal`,`focus-visible:outline-hidden focus-visible:border-accent-600/50 focus-visible:ring-3 focus-visible:ring-focus-accent`,r),onKeyDown:e=>{if(o&&(e.key===`Backspace`||e.key===`Delete`)){e.preventDefault(),M(e.currentTarget);return}s?.(e)},...l,children:[i,_(`button`,{type:`button`,"aria-label":`Remove ${i}`,tabIndex:-1,"aria-disabled":o||void 0,className:t(`cursor-pointer text-strong/40 hover:bg-neutral-500/15 hover:text-strong rounded-xs p-0.5`,`aria-disabled:cursor-default aria-disabled:hover:bg-transparent aria-disabled:hover:text-strong/40`),onClick:e=>{if(e.stopPropagation(),o){let e=u.current;e&&M(e);return}a?.()},onMouseDown:e=>{e.preventDefault()},children:_(n,{svg:o?_(S,{}):_(y,{weight:`bold`}),className:`size-4`})})]})},j={Root:O,Trigger:k,TagValues:({children:e,lockedValues:t=w})=>{let n=x.useComboboxContext(),r=x.useStoreState(n,`selectedValue`),i=(C(r)?r:void 0)??w,a=m(i);a.current=i;let o=d(E);o.current=t;let s=p(()=>new Set(t),[t]),c=m(new Map),{onInputKeyDownRef:l,inputRef:u}=d(D),h=m(new Set);f(()=>()=>{h.current.forEach(cancelAnimationFrame)},[]);let v=e=>{let t=requestAnimationFrame(()=>{h.current.delete(t),e()});h.current.add(t)},y=e=>{if(n){let t=n.getState().selectedValue;if(!C(t))return;n.setSelectedValue(t.filter(t=>t!==e))}},b=e=>{let t=a.current[e];if(t==null)return;let r=c.current.get(t);r&&(r.focus(),n?.show())},S=()=>{u.current?.focus()},T=(e,t)=>{let n=i[t];switch(e.key){case`ArrowLeft`:e.preventDefault(),t>0&&b(t-1);break;case`ArrowRight`:e.preventDefault(),t<i.length-1?b(t+1):S();break;case`Backspace`:case`Delete`:if(e.preventDefault(),n!=null){if(s.has(n)){let e=c.current.get(n);e&&M(e);break}if(y(n),e.key===`Backspace`)if(t>0){let e=t-1;v(()=>b(e))}else v(()=>{a.current.length>0?b(0):S()});else v(()=>{t<a.current.length?b(t):S()})}break;case`ArrowUp`:case`ArrowDown`:e.preventDefault(),S(),u.current?.dispatchEvent(new KeyboardEvent(`keydown`,{key:e.key,bubbles:!0,cancelable:!0,shiftKey:e.shiftKey,ctrlKey:e.ctrlKey,metaKey:e.metaKey,altKey:e.altKey}));break;default:e.key.length===1&&!e.ctrlKey&&!e.metaKey&&S()}};return l.current=e=>{if(e.key===`ArrowLeft`&&e.currentTarget.selectionStart===0&&e.currentTarget.selectionEnd===0&&i.length>0){e.preventDefault(),b(i.length-1);return}if(e.key===`Backspace`&&e.currentTarget.value===``&&i.length>0){let e=i[i.length-1];if(e!=null)if(o.current.includes(e)){let t=c.current.get(e);t&&M(t)}else y(e)}},_(g,{children:i.map((t,n)=>{let r={value:t,locked:s.has(t),onRemove:()=>{if(s.has(t)){let e=c.current.get(t);e&&M(e);return}y(t)},ref:e=>{e?c.current.set(t,e):c.current.delete(t)},onKeyDown:e=>T(e,n),onClick:()=>b(n)};return e?e(r):_(A,{...r},t)})})},Input:({className:n,onBlur:r,onChange:i,onFocus:a,onKeyDown:s,onValueChange:c,placeholder:l,ref:u,...f})=>{let p=x.useComboboxContext(),{onInputKeyDownRef:m,inputRef:h}=d(D),g=d(o),v=x.useStoreState(p,`selectedValue`),y=((C(v)?v:void 0)?.length??0)>0;return _(x.Combobox,{autoSelect:!0,"data-slot":`multi-select-input`,className:t(`pointer-coarse:text-base min-w-20 flex-1 select-text border-0 bg-transparent text-sm outline-hidden`,`placeholder:select-none placeholder:text-placeholder`,n),onChange:e=>{c?.(e.target.value),i?.(e)},onKeyDown:e=>{m.current?.(e),s?.(e)},onBlur:e=>{e.relatedTarget instanceof HTMLElement&&e.relatedTarget.closest(`[data-slot="multi-select-tag"]`)&&p?.show(),r?.(e)},onFocus:e=>{p?.show(),a?.(e)},placeholder:y?void 0:l,ref:e(h,u),...f,...g?{"aria-describedby":g[`aria-describedby`],"aria-errormessage":g[`aria-errormessage`],"aria-invalid":g[`aria-invalid`],id:g.id,name:g.name}:void 0})},Tag:A,Content:({asChild:e=!1,backdrop:n=!1,children:i,className:a,modal:o=!0,portalElement:s,preventBodyScroll:c,ref:l,sameWidth:p=!0,unmountOnHide:m=!0,...g})=>{let v=d(T),[y,b]=h(!1);f(()=>{b(v.current?.closest(`[data-mantle-modal-content]`)!=null)},[v]);let S=u(()=>v.current?.getBoundingClientRect()??null,[v]),C=u(e=>typeof s==`function`?s(e):s??v.current?.closest(`[data-mantle-modal-content]`)??e.ownerDocument.body,[s,v]),w=u(e=>!(e.target instanceof Node&&v.current?.contains(e.target)),[v]);return _(x.ComboboxPopover,{"data-slot":`multi-select-content`,className:t(`border-popover bg-popover relative z-50 max-h-96 min-w-32 scrollbar overflow-y-scroll overflow-x-hidden overscroll-y-none rounded-md border shadow-md pt-1 pb-1 has-data-content-footer:pb-0 font-sans flex flex-col gap-px focus:outline-hidden`,a),backdrop:n,getAnchorRect:S,gutter:4,hideOnInteractOutside:w,modal:o,portalElement:C,preventBodyScroll:c??!y,ref:l,render:e?({ref:e,...t})=>_(r,{ref:e,...t}):void 0,sameWidth:p,unmountOnHide:m,...g,children:i})},ContentFooter:({className:e,children:n,ref:r,...i})=>_(`div`,{ref:r,"data-slot":`multi-select-content-footer`,"data-content-footer":!0,className:t(`bg-popover sticky bottom-0 border-t border-popover`,e),...i,children:n}),Item:({asChild:e=!1,children:i,className:a,focusOnHover:o=!0,value:s,onClick:c,ref:l,...u})=>{let f=d(E),p=s!=null&&f.current.includes(s);return v(x.ComboboxItem,{"data-slot":`multi-select-item`,className:t(`relative mx-1 cursor-pointer rounded-md pl-2 pr-8 py-1.5 text-strong text-sm font-normal flex min-w-0 items-center gap-2`,`[[role=option]+&]:mt-px`,`data-active-item:bg-active-menu-item`,`aria-disabled:opacity-50`,`aria-selected:bg-selected-menu-item aria-selected:data-active-item:bg-active-selected-menu-item`,a),focusOnHover:o,onClick:e=>{if(p){e.preventDefault();return}c?.(e)},ref:l,render:e?({ref:e,...t})=>_(r,{ref:e,...t}):void 0,resetValueOnSelect:!0,value:s,...u,children:[i,_(x.ComboboxItemCheck,{className:`absolute right-2 flex h-3.5 w-3.5 items-center justify-center`,children:_(n,{svg:_(b,{weight:`bold`}),className:`size-4 text-accent-600`})})]})},Group:({asChild:e=!1,children:t,ref:n,...i})=>_(x.ComboboxGroup,{"data-slot":`multi-select-group`,className:`mx-1`,ref:n,render:e?({ref:e,...t})=>_(r,{ref:e,...t}):void 0,...i,children:t}),GroupLabel:({asChild:e=!1,children:n,className:i,ref:a,...o})=>_(x.ComboboxGroupLabel,{"data-slot":`multi-select-group-label`,className:t(`text-muted px-2 py-1 text-xs font-medium`,i),ref:a,render:e?({ref:e,...t})=>_(r,{ref:e,...t}):void 0,...o,children:n}),GroupDescription:({className:e,children:n,ref:r,...i})=>_(`p`,{"data-slot":`multi-select-group-description`,className:t(`text-muted px-2 pb-1 text-xs`,e),ref:r,...i,children:n}),Separator:({className:e,ref:n,...r})=>_(s,{"data-slot":`multi-select-separator`,ref:n,className:t(`my-1 w-auto`,e),...r}),Empty:({className:e,children:n,ref:r,...i})=>_(`div`,{"data-slot":`multi-select-empty`,className:t(`mx-1 text-muted px-2 py-6 text-center text-sm`,e),ref:r,role:`presentation`,...i,children:n})};function M(e){c()||e.animate([{transform:`translateX(0)`},{transform:`translateX(-4px)`},{transform:`translateX(4px)`},{transform:`translateX(-4px)`},{transform:`translateX(4px)`},{transform:`translateX(0)`}],{duration:300,easing:`ease-in-out`})}export{j as MultiSelect};
+import{t as e}from"./compose-refs-BdBMM9ga.js";import{t}from"./cx-IiQEAKf5.js";import{t as n}from"./icon-lZ48P8Nn.js";import{t as r}from"./slot-DpNWVci8.js";import{r as i}from"./layer-container-CglTh9-6.js";import{a,r as o}from"./field-Bpptk_9t.js";import{t as s}from"./field-B1wqeZr4.js";import{n as c}from"./separator-D0D6VyyM.js";import{t as l}from"./use-prefers-reduced-motion-Bk5zAfHY.js";import{createContext as u,useCallback as d,useContext as f,useEffect as p,useMemo as m,useRef as h,useState as g}from"react";import{Fragment as _,jsx as v,jsxs as y}from"react/jsx-runtime";import{XIcon as b}from"@phosphor-icons/react/X";import{CheckIcon as x}from"@phosphor-icons/react/Check";import*as S from"@ariakit/react";import{LockIcon as C}from"@phosphor-icons/react/Lock";const w=e=>Array.isArray(e)&&e.every(e=>typeof e==`string`),T=[],E=u({current:null}),D=u({current:[]}),O=u({onInputKeyDownRef:{current:void 0},inputRef:{current:null}}),k=({children:e,defaultSelectedValue:t=T,...n})=>{let r=h(null),i=h(void 0),a=h(null),o=h([]),s=m(()=>({onInputKeyDownRef:i,inputRef:a}),[]);return v(E.Provider,{value:r,children:v(O.Provider,{value:s,children:v(D.Provider,{value:o,children:v(S.ComboboxProvider,{defaultSelectedValue:t,...n,children:e})})})})},A=({"aria-invalid":n,className:r,children:i,onKeyDown:s,onMouseDown:c,ref:l,validation:u,...d})=>{let p=f(E),{inputRef:m}=f(O),h=S.useComboboxContext(),g=a(),{validation:_}=o({"aria-invalid":n,validation:u??g});return v(`div`,{role:`group`,"data-slot":`multi-select-trigger`,className:t(`cursor-text select-none font-sans text-sm`,`border-form bg-form text-strong flex min-h-9 w-full flex-wrap items-center gap-1 rounded-md border px-3 py-1 has-[[data-slot=multi-select-tag]]:px-1`,`has-focus:outline-hidden has-focus-within:ring-4 has-aria-expanded:ring-4`,`has-focus-within:border-accent-600 has-focus-within:ring-focus-accent has-aria-expanded:border-accent-600 has-aria-expanded:ring-focus-accent`,`data-validation-success:border-success-600 data-validation-success:has-focus-within:border-success-600 data-validation-success:has-focus-within:ring-focus-success data-validation-success:has-aria-expanded:border-success-600 data-validation-success:has-aria-expanded:ring-focus-success`,`data-validation-warning:border-warning-600 data-validation-warning:has-focus-within:border-warning-600 data-validation-warning:has-focus-within:ring-focus-warning data-validation-warning:has-aria-expanded:border-warning-600 data-validation-warning:has-aria-expanded:ring-focus-warning`,`data-validation-error:border-danger-600 data-validation-error:has-focus-within:border-danger-600 data-validation-error:has-focus-within:ring-focus-danger data-validation-error:has-aria-expanded:border-danger-600 data-validation-error:has-aria-expanded:ring-focus-danger`,r),"data-validation":_||void 0,onKeyDown:e=>{e.key===`Escape`&&h?.getState().open&&(e.preventDefault(),h.hide()),s?.(e)},onMouseDown:e=>{e.target instanceof HTMLElement&&!e.target.closest(`button, input, [role='option']`)&&(e.preventDefault(),m.current?.focus()),c?.(e)},ref:e(p,l),...d,children:i})},j=({className:r,value:i,onRemove:a,locked:o=!1,onKeyDown:s,ref:c,...l})=>{let u=h(null);return y(`span`,{ref:e(u,c),role:`option`,"aria-selected":!0,tabIndex:-1,"data-slot":`multi-select-tag`,"data-locked":o||void 0,className:t(`cursor-default bg-neutral-500/10 border border-neutral-500/20 rounded-xs text-strong inline-flex items-center gap-1 pl-2 pr-0.5 py-0.5 text-sm font-normal`,`focus-visible:outline-hidden focus-visible:border-accent-600/50 focus-visible:ring-3 focus-visible:ring-focus-accent`,r),onKeyDown:e=>{if(o&&(e.key===`Backspace`||e.key===`Delete`)){e.preventDefault(),N(e.currentTarget);return}s?.(e)},...l,children:[i,v(`button`,{type:`button`,"aria-label":`Remove ${i}`,tabIndex:-1,"aria-disabled":o||void 0,className:t(`cursor-pointer text-strong/40 hover:bg-neutral-500/15 hover:text-strong rounded-xs p-0.5`,`aria-disabled:cursor-default aria-disabled:hover:bg-transparent aria-disabled:hover:text-strong/40`),onClick:e=>{if(e.stopPropagation(),o){let e=u.current;e&&N(e);return}a?.()},onMouseDown:e=>{e.preventDefault()},children:v(n,{svg:o?v(C,{}):v(b,{weight:`bold`}),className:`size-4`})})]})},M={Root:k,Trigger:A,TagValues:({children:e,lockedValues:t=T})=>{let n=S.useComboboxContext(),r=S.useStoreState(n,`selectedValue`),i=(w(r)?r:void 0)??T,a=h(i);a.current=i;let o=f(D);o.current=t;let s=m(()=>new Set(t),[t]),c=h(new Map),{onInputKeyDownRef:l,inputRef:u}=f(O),d=h(new Set);p(()=>()=>{d.current.forEach(cancelAnimationFrame)},[]);let g=e=>{let t=requestAnimationFrame(()=>{d.current.delete(t),e()});d.current.add(t)},y=e=>{if(n){let t=n.getState().selectedValue;if(!w(t))return;n.setSelectedValue(t.filter(t=>t!==e))}},b=e=>{let t=a.current[e];if(t==null)return;let r=c.current.get(t);r&&(r.focus(),n?.show())},x=()=>{u.current?.focus()},C=(e,t)=>{let n=i[t];switch(e.key){case`ArrowLeft`:e.preventDefault(),t>0&&b(t-1);break;case`ArrowRight`:e.preventDefault(),t<i.length-1?b(t+1):x();break;case`Backspace`:case`Delete`:if(e.preventDefault(),n!=null){if(s.has(n)){let e=c.current.get(n);e&&N(e);break}if(y(n),e.key===`Backspace`)if(t>0){let e=t-1;g(()=>b(e))}else g(()=>{a.current.length>0?b(0):x()});else g(()=>{t<a.current.length?b(t):x()})}break;case`ArrowUp`:case`ArrowDown`:e.preventDefault(),x(),u.current?.dispatchEvent(new KeyboardEvent(`keydown`,{key:e.key,bubbles:!0,cancelable:!0,shiftKey:e.shiftKey,ctrlKey:e.ctrlKey,metaKey:e.metaKey,altKey:e.altKey}));break;default:e.key.length===1&&!e.ctrlKey&&!e.metaKey&&x()}};return l.current=e=>{if(e.key===`ArrowLeft`&&e.currentTarget.selectionStart===0&&e.currentTarget.selectionEnd===0&&i.length>0){e.preventDefault(),b(i.length-1);return}if(e.key===`Backspace`&&e.currentTarget.value===``&&i.length>0){let e=i[i.length-1];if(e!=null)if(o.current.includes(e)){let t=c.current.get(e);t&&N(t)}else y(e)}},v(_,{children:i.map((t,n)=>{let r={value:t,locked:s.has(t),onRemove:()=>{if(s.has(t)){let e=c.current.get(t);e&&N(e);return}y(t)},ref:e=>{e?c.current.set(t,e):c.current.delete(t)},onKeyDown:e=>C(e,n),onClick:()=>b(n)};return e?e(r):v(j,{...r},t)})})},Input:({className:n,onBlur:r,onChange:i,onFocus:a,onKeyDown:o,onValueChange:c,placeholder:l,ref:u,...d})=>{let p=S.useComboboxContext(),{onInputKeyDownRef:m,inputRef:h}=f(O),g=f(s),_=S.useStoreState(p,`selectedValue`),y=((w(_)?_:void 0)?.length??0)>0;return v(S.Combobox,{autoSelect:!0,"data-slot":`multi-select-input`,className:t(`pointer-coarse:text-base min-w-20 flex-1 select-text border-0 bg-transparent text-sm outline-hidden`,`placeholder:select-none placeholder:text-placeholder`,n),onChange:e=>{c?.(e.target.value),i?.(e)},onKeyDown:e=>{m.current?.(e),o?.(e)},onBlur:e=>{e.relatedTarget instanceof HTMLElement&&e.relatedTarget.closest(`[data-slot="multi-select-tag"]`)&&p?.show(),r?.(e)},onFocus:e=>{p?.show(),a?.(e)},placeholder:y?void 0:l,ref:e(h,u),...d,...g?{"aria-describedby":g[`aria-describedby`],"aria-errormessage":g[`aria-errormessage`],"aria-invalid":g[`aria-invalid`],id:g.id,name:g.name}:void 0})},Tag:j,Content:({asChild:e=!1,backdrop:n=!1,children:a,className:o,modal:s=!0,portalElement:c,preventBodyScroll:l,ref:u,sameWidth:m=!0,unmountOnHide:h=!0,..._})=>{let y=f(E),b=i(),[x,C]=g(!1);p(()=>{C(y.current?.closest(`[data-mantle-modal-content]`)!=null)},[y]);let w=x||b!=null,T=d(()=>y.current?.getBoundingClientRect()??null,[y]),D=d(e=>typeof c==`function`?c(e):c??y.current?.closest(`[data-mantle-modal-content]`)??(b instanceof HTMLElement?b:null)??e.ownerDocument.body,[b,c,y]),O=d(e=>!(e.target instanceof Node&&y.current?.contains(e.target)),[y]);return v(S.ComboboxPopover,{"data-slot":`multi-select-content`,className:t(`border-popover bg-popover relative z-50 max-h-96 min-w-32 scrollbar overflow-y-scroll overflow-x-hidden overscroll-y-none rounded-md border shadow-md pt-1 pb-1 has-data-content-footer:pb-0 font-sans flex flex-col gap-px focus:outline-hidden`,o),backdrop:n,getAnchorRect:T,gutter:4,hideOnInteractOutside:O,modal:s,portalElement:D,preventBodyScroll:l??!w,ref:u,render:e?({ref:e,...t})=>v(r,{ref:e,...t}):void 0,sameWidth:m,unmountOnHide:h,..._,children:a})},ContentFooter:({className:e,children:n,ref:r,...i})=>v(`div`,{ref:r,"data-slot":`multi-select-content-footer`,"data-content-footer":!0,className:t(`bg-popover sticky bottom-0 border-t border-popover`,e),...i,children:n}),Item:({asChild:e=!1,children:i,className:a,focusOnHover:o=!0,value:s,onClick:c,ref:l,...u})=>{let d=f(D),p=s!=null&&d.current.includes(s);return y(S.ComboboxItem,{"data-slot":`multi-select-item`,className:t(`relative mx-1 cursor-pointer rounded-md pl-2 pr-8 py-1.5 text-strong text-sm font-normal flex min-w-0 items-center gap-2`,`[[role=option]+&]:mt-px`,`data-active-item:bg-active-menu-item`,`aria-disabled:opacity-50`,`aria-selected:bg-selected-menu-item aria-selected:data-active-item:bg-active-selected-menu-item`,a),focusOnHover:o,onClick:e=>{if(p){e.preventDefault();return}c?.(e)},ref:l,render:e?({ref:e,...t})=>v(r,{ref:e,...t}):void 0,resetValueOnSelect:!0,value:s,...u,children:[i,v(S.ComboboxItemCheck,{className:`absolute right-2 flex h-3.5 w-3.5 items-center justify-center`,children:v(n,{svg:v(x,{weight:`bold`}),className:`size-4 text-accent-600`})})]})},Group:({asChild:e=!1,children:t,ref:n,...i})=>v(S.ComboboxGroup,{"data-slot":`multi-select-group`,className:`mx-1`,ref:n,render:e?({ref:e,...t})=>v(r,{ref:e,...t}):void 0,...i,children:t}),GroupLabel:({asChild:e=!1,children:n,className:i,ref:a,...o})=>v(S.ComboboxGroupLabel,{"data-slot":`multi-select-group-label`,className:t(`text-muted px-2 py-1 text-xs font-medium`,i),ref:a,render:e?({ref:e,...t})=>v(r,{ref:e,...t}):void 0,...o,children:n}),GroupDescription:({className:e,children:n,ref:r,...i})=>v(`p`,{"data-slot":`multi-select-group-description`,className:t(`text-muted px-2 pb-1 text-xs`,e),ref:r,...i,children:n}),Separator:({className:e,ref:n,...r})=>v(c,{"data-slot":`multi-select-separator`,ref:n,className:t(`my-1 w-auto`,e),...r}),Empty:({className:e,children:n,ref:r,...i})=>v(`div`,{"data-slot":`multi-select-empty`,className:t(`mx-1 text-muted px-2 py-6 text-center text-sm`,e),ref:r,role:`presentation`,...i,children:n})};function N(e){l()||e.animate([{transform:`translateX(0)`},{transform:`translateX(-4px)`},{transform:`translateX(4px)`},{transform:`translateX(-4px)`},{transform:`translateX(4px)`},{transform:`translateX(0)`}],{duration:300,easing:`ease-in-out`})}export{M as MultiSelect};

package/dist/pagination.d.ts

@@ -1,5 +1,5 @@
 import { t as ButtonGroup } from "./button-BsfLZ42S.js";
-import { t as Select } from "./select-DVHmgih8.js";
+import { t as Select } from "./select-DkFkSYBP.js";
 import { ComponentProps } from "react";
 //#region src/components/pagination/cursor-pagination.d.ts
 type CursorPaginationProps = ComponentProps<"div"> & {

package/dist/pagination.js

@@ -1 +1 @@
-import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./button-CNg69RsV.js";import{t as n}from"./button-DmJkYfyl.js";import{n as r}from"./separator-D0D6VyyM.js";import{t as i}from"./select-LK9NX-vV.js";import{createContext as a,useContext as o,useEffect as s,useMemo as c,useState as l}from"react";import u from"tiny-invariant";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{CaretRightIcon as p}from"@phosphor-icons/react/CaretRight";import{CaretLeftIcon as m}from"@phosphor-icons/react/CaretLeft";const h=a(void 0),g=({className:t,children:n,defaultPageSize:r,ref:i,...a})=>{let[o,s]=l(r),u=c(()=>({defaultPageSize:r,pageSize:o,setPageSize:s}),[r,o]);return d(h.Provider,{value:u,children:d(`div`,{"data-slot":`cursor-pagination`,className:e(`inline-flex items-center justify-between gap-2`,t),ref:i,...a,children:n})})},_=({hasNextPage:e,hasPreviousPage:i,onNextPage:a,onPreviousPage:o,ref:s,...c})=>f(n,{"data-slot":`cursor-pagination-buttons`,appearance:`panel`,ref:s,...c,children:[d(t,{"data-slot":`cursor-pagination-previous`,appearance:`ghost`,disabled:!i,icon:d(m,{}),intent:`neutral`,label:`Previous page`,onClick:o,size:`sm`,type:`button`}),d(r,{"data-slot":`cursor-pagination-separator`,orientation:`vertical`,className:`min-h-5`}),d(t,{"data-slot":`cursor-pagination-next`,appearance:`ghost`,disabled:!e,icon:d(p,{}),intent:`neutral`,label:`Next page`,onClick:a,size:`sm`,type:`button`})]}),v=[5,10,20,50,100],y=({className:t,pageSizes:n=v,onChangePageSize:r,ref:a,...s})=>{let c=o(h);return u(c,`CursorPageSizeSelect must be used as a child of a CursorPagination component`),u(n.includes(c.defaultPageSize),`CursorPagination.defaultPageSize must be included in CursorPageSizeSelect.pageSizes`),u(n.includes(c.pageSize),`CursorPagination.pageSize must be included in CursorPageSizeSelect.pageSizes`),f(i.Root,{defaultValue:`${c.pageSize}`,onValueChange:e=>{let t=Number.parseInt(e,10);Number.isNaN(t)&&(t=c.defaultPageSize),c.setPageSize(t),r?.(t)},children:[d(i.Trigger,{ref:a,"data-slot":`cursor-pagination-page-size-select`,className:e(`w-auto min-w-36`,t),value:c.pageSize,...s,children:d(i.Value,{})}),d(i.Content,{width:`trigger`,children:n.map(e=>f(i.Item,{value:`${e}`,children:[e,` per page`]},e))})]})};function b({className:t,...n}){let r=o(h);return u(r,`CursorPageSizeValue must be used as a child of a CursorPagination component`),f(`span`,{"data-slot":`cursor-pagination-page-size-value`,className:e(`text-muted text-sm font-normal`,t),...n,children:[r.pageSize,` per page`]})}const x={Root:g,Buttons:_,PageSizeSelect:y,PageSizeValue:b};function S({listSize:e,pageSize:t}){let[n,r]=l(1),[i,a]=l(t);s(()=>{a(t),r(1)},[t]),s(()=>{r(1)},[e]);let o=Math.ceil(e/i),c=(n-1)*i,u=n>1,d=n<o;function f(e){r(Math.max(1,Math.min(e,o)))}function p(){d&&r(e=>Math.min(e+1,o))}function m(){u&&r(e=>Math.max(e-1,1))}function h(e){a(e),r(1)}function g(){r(o)}function _(){r(1)}return{currentPage:n,goToFirstPage:_,goToLastPage:g,goToPage:f,hasNextPage:d,hasPreviousPage:u,nextPage:p,offset:c,pageSize:i,previousPage:m,setPageSize:h,totalPages:o}}function C(e,t){return e.slice(t.offset,t.offset+t.pageSize)}export{x as CursorPagination,C as getOffsetPaginatedSlice,S as useOffsetPagination};
+import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./button-CNg69RsV.js";import{t as n}from"./button-DmJkYfyl.js";import{n as r}from"./separator-D0D6VyyM.js";import{t as i}from"./select-BK6n6OIK.js";import{createContext as a,useContext as o,useEffect as s,useMemo as c,useState as l}from"react";import u from"tiny-invariant";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{CaretRightIcon as p}from"@phosphor-icons/react/CaretRight";import{CaretLeftIcon as m}from"@phosphor-icons/react/CaretLeft";const h=a(void 0),g=({className:t,children:n,defaultPageSize:r,ref:i,...a})=>{let[o,s]=l(r),u=c(()=>({defaultPageSize:r,pageSize:o,setPageSize:s}),[r,o]);return d(h.Provider,{value:u,children:d(`div`,{"data-slot":`cursor-pagination`,className:e(`inline-flex items-center justify-between gap-2`,t),ref:i,...a,children:n})})},_=({hasNextPage:e,hasPreviousPage:i,onNextPage:a,onPreviousPage:o,ref:s,...c})=>f(n,{"data-slot":`cursor-pagination-buttons`,appearance:`panel`,ref:s,...c,children:[d(t,{"data-slot":`cursor-pagination-previous`,appearance:`ghost`,disabled:!i,icon:d(m,{}),intent:`neutral`,label:`Previous page`,onClick:o,size:`sm`,type:`button`}),d(r,{"data-slot":`cursor-pagination-separator`,orientation:`vertical`,className:`min-h-5`}),d(t,{"data-slot":`cursor-pagination-next`,appearance:`ghost`,disabled:!e,icon:d(p,{}),intent:`neutral`,label:`Next page`,onClick:a,size:`sm`,type:`button`})]}),v=[5,10,20,50,100],y=({className:t,pageSizes:n=v,onChangePageSize:r,ref:a,...s})=>{let c=o(h);return u(c,`CursorPageSizeSelect must be used as a child of a CursorPagination component`),u(n.includes(c.defaultPageSize),`CursorPagination.defaultPageSize must be included in CursorPageSizeSelect.pageSizes`),u(n.includes(c.pageSize),`CursorPagination.pageSize must be included in CursorPageSizeSelect.pageSizes`),f(i.Root,{defaultValue:`${c.pageSize}`,onValueChange:e=>{let t=Number.parseInt(e,10);Number.isNaN(t)&&(t=c.defaultPageSize),c.setPageSize(t),r?.(t)},children:[d(i.Trigger,{ref:a,"data-slot":`cursor-pagination-page-size-select`,className:e(`w-auto min-w-36`,t),value:c.pageSize,...s,children:d(i.Value,{})}),d(i.Content,{width:`trigger`,children:n.map(e=>f(i.Item,{value:`${e}`,children:[e,` per page`]},e))})]})};function b({className:t,...n}){let r=o(h);return u(r,`CursorPageSizeValue must be used as a child of a CursorPagination component`),f(`span`,{"data-slot":`cursor-pagination-page-size-value`,className:e(`text-muted text-sm font-normal`,t),...n,children:[r.pageSize,` per page`]})}const x={Root:g,Buttons:_,PageSizeSelect:y,PageSizeValue:b};function S({listSize:e,pageSize:t}){let[n,r]=l(1),[i,a]=l(t);s(()=>{a(t),r(1)},[t]),s(()=>{r(1)},[e]);let o=Math.ceil(e/i),c=(n-1)*i,u=n>1,d=n<o;function f(e){r(Math.max(1,Math.min(e,o)))}function p(){d&&r(e=>Math.min(e+1,o))}function m(){u&&r(e=>Math.max(e-1,1))}function h(e){a(e),r(1)}function g(){r(o)}function _(){r(1)}return{currentPage:n,goToFirstPage:_,goToLastPage:g,goToPage:f,hasNextPage:d,hasPreviousPage:u,nextPage:p,offset:c,pageSize:i,previousPage:m,setPageSize:h,totalPages:o}}function C(e,t){return e.slice(t.offset,t.offset+t.pageSize)}export{x as CursorPagination,C as getOffsetPaginatedSlice,S as useOffsetPagination};

package/dist/popover-D6x6Bq-G.js

@@ -0,0 +1 @@
+import{t as e}from"./cx-IiQEAKf5.js";import{r as t}from"./layer-container-CglTh9-6.js";import{jsx as n,jsxs as r}from"react/jsx-runtime";import*as i from"@radix-ui/react-popover";const a=i.Root,o=i.Trigger,s={Root:a,Anchor:i.Anchor,Arrow:({className:t,height:a=7,width:o=14,...s})=>n(i.Arrow,{"aria-hidden":`true`,asChild:!0,"data-slot":`popover-arrow`,height:a,width:o,...s,children:r(`svg`,{className:e(`fill-[var(--background-color-popover)]`,`[clip-path:inset(0_-200%_-200%_-200%)]`,`[filter:drop-shadow(0_0_4px_color-mix(in_oklab,var(--shadow-color)_var(--shadow-first-opacity),transparent))]`,t),children:[n(`polygon`,{points:`0,0 30,0 15,10`}),n(`polyline`,{className:`stroke-[color:var(--border-color-popover)]`,fill:`none`,points:`0,0 15,10 30,0`,strokeWidth:1.5,vectorEffect:`non-scaling-stroke`})]})}),Close:i.Close,Content:({align:r=`center`,className:a,onClick:o,preferredWidth:s=`max-w-72`,ref:c,sideOffset:l=4,...u})=>{let d=t();return n(i.Portal,{container:d,children:n(i.Content,{align:r,"data-slot":`popover-content`,className:e(`relative`,`text-popover-foreground border-popover bg-popover data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2 data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95 z-50 rounded-md border p-4 shadow-md outline-hidden`,s,a),onClick:e=>{e.stopPropagation(),o?.(e)},ref:c,sideOffset:l,...u})})},Trigger:o};export{s as t};

package/dist/{popover-C9fEVWL1.d.ts → popover-DDuw1UaJ.d.ts}

@@ -15,9 +15,12 @@ type PopoverContentProps = ComponentProps<typeof PopoverPrimitive.Content> & {
 /**
  * The content to render inside the popover.
  *
- * `Popover.Content` renders at Tailwind `z-50`, Mantle's shared floating
- * z-index. When multiple shared layers are open, the most recently mounted
- * layer renders on top.
+ * `Popover.Content` renders at Tailwind `z-50`, Mantle's float tier. When
+ * composed inside an open `Dialog`, `AlertDialog`, or `Sheet`, it portals into
+ * that overlay's positioner and paints above the overlay that owns it. Outside
+ * every overlay, it portals to `document.body`, below the overlay tier
+ * (`z-60`). When sibling floats share a container, the most recently mounted
+ * float paints on top.
  *
  * It sets `position: relative`, so `Popover.Arrow`'s absolutely-positioned
  * wrapper keeps one containing block through the open animation. An
@@ -83,9 +86,12 @@ declare const Arrow: ({ className, height, width, ...props }: PopoverArrowProps)
  * the content, block interaction with the rest of the page, and lock body
  * scroll while the popover is open.
  *
- * `Popover.Content` renders at Tailwind `z-50`, Mantle's shared floating
- * z-index. When multiple shared layers are open, the most recently mounted
- * layer renders on top.
+ * `Popover.Content` renders at Tailwind `z-50`, Mantle's float tier. When
+ * composed inside an open `Dialog`, `AlertDialog`, or `Sheet`, it portals into
+ * that overlay's positioner and paints above the overlay that owns it. Outside
+ * every overlay, it portals to `document.body`, below the overlay tier
+ * (`z-60`). When sibling floats share a container, the most recently mounted
+ * float paints on top.
  *
  * @see https://mantle.ngrok.com/components/overlays/popover
  * @see https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal/
@@ -119,9 +125,12 @@ declare const Popover: {
   /**
    * The root, stateful component that manages the open/closed state of the popover.
    *
-   * `Popover.Content` renders at Tailwind `z-50`, Mantle's shared floating
-   * z-index. When multiple shared layers are open, the most recently mounted
-   * layer renders on top.
+   * `Popover.Content` renders at Tailwind `z-50`, Mantle's float tier. When
+   * composed inside an open `Dialog`, `AlertDialog`, or `Sheet`, it portals into
+   * that overlay's positioner and paints above the overlay that owns it. Outside
+   * every overlay, it portals to `document.body`, below the overlay tier
+   * (`z-60`). When sibling floats share a container, the most recently mounted
+   * float paints on top.
    *
    * @see https://mantle.ngrok.com/components/overlays/popover#popoverroot
    *
@@ -216,9 +225,12 @@ declare const Popover: {
   /**
    * The content to render inside the popover. Appears in a portal with rich styling and animations.
    *
-   * `Popover.Content` renders at Tailwind `z-50`, Mantle's shared floating
-   * z-index. When multiple shared layers are open, the most recently mounted
-   * layer renders on top.
+   * `Popover.Content` renders at Tailwind `z-50`, Mantle's float tier. When
+   * composed inside an open `Dialog`, `AlertDialog`, or `Sheet`, it portals into
+   * that overlay's positioner and paints above the overlay that owns it. Outside
+   * every overlay, it portals to `document.body`, below the overlay tier
+   * (`z-60`). When sibling floats share a container, the most recently mounted
+   * float paints on top.
    *
    * @see https://mantle.ngrok.com/components/overlays/popover#popovercontent
    *

package/dist/popover.d.ts

@@ -1,2 +1,2 @@
-import { t as Popover } from "./popover-C9fEVWL1.js";
+import { t as Popover } from "./popover-DDuw1UaJ.js";
 export { Popover };

package/dist/popover.js

@@ -1 +1 @@
-import{t as e}from"./popover-B1ZzHCym.js";export{e as Popover};
+import{t as e}from"./popover-D6x6Bq-G.js";export{e as Popover};

package/dist/primitive-BWyxJnXn.js

@@ -0,0 +1 @@
+import{t as e}from"./slot-DpNWVci8.js";import{t}from"./booleanish-BfvnW6vy.js";import{n,r}from"./layer-container-CglTh9-6.js";import{createContext as i,useContext as a,useEffect as o,useMemo as s,useState as c}from"react";import{jsx as l}from"react/jsx-runtime";import*as u from"@radix-ui/react-dialog";function d(e){e.target instanceof Element&&e.target.closest(`.overlay-prompt`)&&e.preventDefault()}const f=i({hasDescription:!1,setHasDescription:()=>{}});function p(e){let[t,n]=c(!1),r=s(()=>({hasDescription:t,setHasDescription:n}),[t]);return l(f.Provider,{value:r,children:l(u.Root,{...e})})}const m=u.Trigger,h=({container:e,...t})=>{let i=r(),a=e??i;return l(n.Provider,{value:a,children:l(u.Portal,{container:a,...t})})},g=u.Close,_=e=>l(u.Overlay,{"data-overlay":!0,...e}),v=({onEscapeKeyDown:e,onInteractOutside:t,onPointerDownOutside:n,ref:r,...i})=>{let o=a(f);return l(u.Content,{ref:r,onEscapeKeyDown:t=>{S(t),e?.(t)},onInteractOutside:e=>{d(e),t?.(e)},onPointerDownOutside:e=>{d(e),n?.(e)},...o.hasDescription?{}:{"aria-describedby":void 0},...i})},y=u.Title,b=({asChild:t,children:n,ref:r,...i})=>{let s=a(f);o(()=>(s.setHasDescription(!0),()=>s.setHasDescription(!1)),[s]);let c=t?e:`div`;return l(u.Description,{ref:r,asChild:!0,children:l(c,{...i,children:n})})};function x(e){return e instanceof HTMLElement&&e.hasAttribute(`data-overlay`)}function S(e){if(!E(e.currentTarget))return;let n=e.currentTarget,r=n instanceof Document?n.activeElement:n.ownerDocument?.activeElement??null,i=C(e.target)??C(r),a=i?w(i):null;i!=null&&t(i.getAttribute(`aria-expanded`))&&a!=null&&n.contains(i)&&n.contains(a)&&(a.getAttribute(`data-open`)===`true`||a.getAttribute(`data-state`)===`open`)&&e.preventDefault()}function C(e){return T(e)?e.closest(`[aria-expanded='true'][aria-controls]`):null}function w(e){let t=e.getAttribute(`aria-controls`);if(!t)return null;let n=e.ownerDocument.getElementById(t);return n instanceof HTMLElement?n:null}function T(e){return e instanceof HTMLElement}function E(e){return e instanceof Node&&`querySelector`in e}export{h as a,m as c,_ as i,x as l,v as n,p as o,b as r,y as s,g as t};

package/dist/select-BK6n6OIK.js

@@ -0,0 +1 @@
+import{t as e}from"./compose-refs-BdBMM9ga.js";import{t}from"./cx-IiQEAKf5.js";import{t as n}from"./icon-lZ48P8Nn.js";import{r}from"./layer-container-CglTh9-6.js";import{a as i,r as a}from"./field-Bpptk_9t.js";import{t as o}from"./field-B1wqeZr4.js";import{n as s}from"./separator-D0D6VyyM.js";import{CaretDownIcon as c}from"@phosphor-icons/react/CaretDown";import{createContext as l,useContext as u,useMemo as d}from"react";import{jsx as f,jsxs as p}from"react/jsx-runtime";import{CheckIcon as m}from"@phosphor-icons/react/Check";import{CaretUpIcon as h}from"@phosphor-icons/react/CaretUp";import*as g from"@radix-ui/react-select";const _=l({}),v=({"aria-invalid":e,children:t,id:n,validation:r,onBlur:i,onValueChange:a,onChange:o,ref:s,...c})=>{let l=d(()=>({"aria-invalid":e,id:n,validation:r,onBlur:i,ref:s}),[e,n,r,i,s]);return f(g.Root,{...c,onValueChange:e=>{o?.(e),a?.(e)},children:f(_.Provider,{value:l,children:t})})},y=({className:e,ref:n,...r})=>f(g.Group,{ref:n,"data-slot":`select-group`,className:t(`space-y-px`,e),...r}),b=g.Value,x=({"aria-invalid":r,className:s,children:l,id:d,ref:m,validation:h,...v})=>{let y=u(_),b=u(o),x=i(),S=b?b[`aria-invalid`]:y[`aria-invalid`]??r,C=y.validation??h??x,{ariaInvalid:w,validation:T}=a({"aria-invalid":S,validation:C}),E=b?b.id:y.id??d;return p(g.Trigger,{"data-slot":`select-trigger`,className:t(`h-9 text-sm`,`border-form bg-form text-strong font-sans placeholder:text-placeholder hover:bg-form-hover hover:text-strong flex w-full items-center justify-between gap-1.5 rounded-md border px-3 py-2 disabled:pointer-events-none disabled:opacity-50 [&>span]:line-clamp-1 [&>span]:text-left`,`hover:border-neutral-400`,`focus:outline-hidden focus:ring-4 aria-expanded:ring-4`,`focus:border-accent-600 focus:ring-focus-accent aria-expanded:border-accent-600 aria-expanded:ring-focus-accent`,`data-validation-success:border-success-600 data-validation-success:focus:border-success-600 data-validation-success:focus:ring-focus-success data-validation-success:aria-expanded:border-success-600 data-validation-success:aria-expanded:ring-focus-success`,`data-validation-warning:border-warning-600 data-validation-warning:focus:border-warning-600 data-validation-warning:focus:ring-focus-warning data-validation-warning:aria-expanded:border-warning-600 data-validation-warning:aria-expanded:ring-focus-warning`,`data-validation-error:border-danger-600 data-validation-error:focus:border-danger-600 data-validation-error:focus:ring-focus-danger data-validation-error:aria-expanded:border-danger-600 data-validation-error:aria-expanded:ring-focus-danger`,s),"data-validation":T||void 0,id:E,ref:e(m,y.ref),...v,...b?{"aria-describedby":b[`aria-describedby`],"aria-errormessage":b[`aria-errormessage`]}:void 0,"aria-invalid":w,children:[l,f(g.Icon,{asChild:!0,children:f(n,{svg:f(c,{weight:`bold`}),className:`size-4`})})]})},S=({className:e,ref:r,...i})=>f(g.ScrollUpButton,{ref:r,className:t(`flex cursor-default items-center justify-center py-1`,e),...i,children:f(n,{svg:f(h,{weight:`bold`}),className:`size-4`})}),C=({className:e,ref:r,...i})=>f(g.ScrollDownButton,{ref:r,className:t(`flex cursor-default items-center justify-center py-1`,e),...i,children:f(n,{svg:f(c,{weight:`bold`}),className:`size-4`})}),w={Root:v,Content:({className:e,children:n,position:i=`popper`,ref:a,width:o=`trigger`,...s})=>{let c=r();return f(g.Portal,{container:c,children:p(g.Content,{ref:a,"data-slot":`select-content`,className:t(`border-popover data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2 data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95 relative z-50 max-h-96 min-w-32 overflow-hidden rounded-md border shadow-md`,`bg-popover font-sans`,i===`popper`&&`data-side-bottom:translate-y-2 data-side-left:-translate-x-2 data-side-right:translate-x-2 data-side-top:-translate-y-2 max-h-(--radix-select-content-available-height)`,o===`trigger`&&`w-(--radix-select-trigger-width)`,e),position:i,...s,children:[f(S,{}),f(g.Viewport,{className:t(`p-1 space-y-px`,i===`popper`&&`h-(--radix-select-trigger-height) w-full`),children:n}),f(C,{})]})})},Group:y,Item:({className:e,children:r,icon:i,ref:a,...o})=>p(g.Item,{ref:a,"data-slot":`select-item`,className:t(`relative flex gap-2 w-full cursor-pointer select-none items-center rounded-md py-1.5 pl-2 pr-8 text-strong text-sm outline-hidden`,`focus:bg-active-menu-item`,`data-disabled:pointer-events-none data-disabled:opacity-50`,`data-state-checked:bg-selected-menu-item`,`focus:data-state-checked:bg-active-selected-menu-item`,e),...o,children:[i&&f(n,{svg:i}),f(g.ItemText,{children:r}),f(g.ItemIndicator,{className:`absolute right-2 flex h-3.5 w-3.5 items-center justify-center`,children:f(n,{svg:f(m,{weight:`bold`}),className:`size-4 text-accent-600`})})]}),Label:({className:e,ref:n,...r})=>f(g.Label,{ref:n,"data-slot":`select-label`,className:t(`px-2 py-1.5 text-sm font-medium`,e),...r}),Separator:({className:e,ref:n,...r})=>f(s,{ref:n,"data-slot":`select-separator`,className:t(`-mx-1 my-1 h-px w-auto`,e),...r}),Trigger:x,Value:b};export{w as t};