@stll/ui 0.54.0 → 0.55.0

package/dist/components/alert-dialog.d.ts

@@ -1,6 +1,6 @@
-import { OverlayLayer } from "../lib/overlay-layer.js";
-import { AlertDialog as AlertDialog$1 } from "@base-ui/react/alert-dialog";
 import * as React$1 from "react";
+import { AlertDialog as AlertDialog$1 } from "@base-ui/react/alert-dialog";
+import { OverlayLayer } from "../lib/overlay-layer.js";
 //#region src/components/alert-dialog.d.ts
 declare const AlertDialogCreateHandle: typeof AlertDialog$1.createHandle;
 declare const AlertDialog: typeof AlertDialog$1.Root;

package/dist/components/button.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from "react";
-import { useRender } from "@base-ui/react/use-render";
 import { VariantProps } from "class-variance-authority";
+import { useRender } from "@base-ui/react/use-render";
 //#region src/components/button.d.ts
 /**
  * Disabled styling for a button that is only `aria-disabled`.
@@ -52,7 +52,8 @@ type ButtonProps = {
   loading?: boolean;
   icon?: ReactNode;
   tooltip?: ReactNode;
+  "data-accessible-disabled"?: "";
 } & useRender.ComponentProps<"button">;
-declare function Button({ className, variant, size, render, loading, icon, children, disabled, tooltip, ...props }: ButtonProps): import("react").JSX.Element;
+declare function Button({ className, variant, size, render, loading, icon, children, disabled, tooltip, "data-accessible-disabled": accessibleDisabled, ...props }: ButtonProps): import("react").JSX.Element;
 //#endregion
 export { BUTTON_CONTENT, BUTTON_SIZE_CONTENT, Button, buttonAccessibleDisabledClass, buttonVariants };

package/dist/components/button.js

@@ -102,7 +102,7 @@ const implicitTooltip = (size, accessibleName) => {
 		default: return panic(`Unhandled button content: ${String(content)}`);
 	}
 };
-function Button({ className, variant, size, render, loading, icon, children, disabled, tooltip, ...props }) {
+function Button({ className, variant, size, render, loading, icon, children, disabled, tooltip, "data-accessible-disabled": accessibleDisabled, ...props }) {
 	const typeValue = render ? void 0 : "button";
 	const tooltipContent = tooltip ?? implicitTooltip(size, props["aria-label"] ?? props.title);
 	const disposition = resolveButtonDisposition({
@@ -111,6 +111,7 @@ function Button({ className, variant, size, render, loading, icon, children, dis
 		tooltip: tooltipContent
 	});
 	const isAccessibleDisabled = disposition === BUTTON_DISPOSITION.accessibleDisabled;
+	const isActivationPreservingDisabled = accessibleDisabled !== void 0;
 	const defaultProps = {
 		children: /* @__PURE__ */ jsxs(Fragment, { children: [loading ? /* @__PURE__ */ jsx(Loader, {
 			animation: "none",
@@ -119,18 +120,19 @@ function Button({ className, variant, size, render, loading, icon, children, dis
 			size: "sm",
 			variant: "decorative"
 		}) : icon, children] }),
-		className: cn(disposition === BUTTON_DISPOSITION.enabled && size !== "row" && variant !== "link" && buttonPressClass, buttonVariants({
+		className: cn(disposition === BUTTON_DISPOSITION.enabled && !isActivationPreservingDisabled && size !== "row" && variant !== "link" && buttonPressClass, buttonVariants({
 			className,
 			size,
 			variant
-		}), isAccessibleDisabled && "cursor-not-allowed opacity-64"),
+		}), (isAccessibleDisabled || isActivationPreservingDisabled) && "cursor-not-allowed opacity-64"),
 		"data-slot": "button",
 		"aria-busy": loading || void 0,
-		...isAccessibleDisabled ? {
+		...isAccessibleDisabled || isActivationPreservingDisabled ? {
 			"aria-disabled": true,
 			"data-disabled": "",
 			tabIndex: 0
 		} : { disabled: disposition === BUTTON_DISPOSITION.nativeDisabled },
+		"data-accessible-disabled": accessibleDisabled,
 		type: typeValue
 	};
 	const button = useRender({

package/dist/components/combobox.d.ts

@@ -1,6 +1,6 @@
-import { ControlSize } from "../lib/control-size.js";
 import * as React$1 from "react";
 import { Combobox as Combobox$1 } from "@base-ui/react/combobox";
+import { ControlSize } from "../lib/control-size.js";
 //#region src/components/combobox.d.ts
 declare const Combobox: <Value, Multiple extends boolean | undefined = false>(props: Combobox$1.Root.Props<Value, Multiple>) => React$1.JSX.Element;
 declare const ComboboxChipsInput: ({ className, size, ...props }: Omit<Combobox$1.Input.Props, "size"> & {

package/dist/components/command.d.ts

@@ -1,9 +1,9 @@
-import { ControlSize } from "../lib/control-size.js";
-import { DialogContent as DialogPopup } from "./dialog.js";
 import * as React$1 from "react";
+import { Autocomplete } from "@base-ui/react/autocomplete";
+import { ControlSize } from "../lib/control-size.js";
 import { Dialog } from "@base-ui/react/dialog";
+import { DialogContent as DialogPopup } from "./dialog.js";
 import { VariantProps } from "class-variance-authority";
-import { Autocomplete } from "@base-ui/react/autocomplete";
 //#region src/components/command.d.ts
 type CommandProps<ItemValue> = Omit<Autocomplete.Root.Props<ItemValue>, "items"> & {
   items?: readonly ItemValue[] | undefined;

package/dist/components/composer-tokens.d.ts

@@ -0,0 +1,72 @@
+//#region src/components/composer-tokens.d.ts
+/**
+ * The tokens every composer box shares: the chat hero, the chat follow-up
+ * bar, the docked bar over documents (inspector chat, file overlay,
+ * Template Studio) and the law home's entry box all render one shell from
+ * these, so they restyle together. A surface that needs the look imports
+ * these rather than copying the classes; a copy is how the boxes drifted
+ * apart the first time (44px / `rounded-lg` / 14px in the chat, 38px /
+ * `rounded-2xl` / 13px in the inspector).
+ */
+/** Shared responsive size for the two round controls flanking a composer. */
+export declare const COMPOSER_CONTROL_BUTTON_SIZE: "icon-sm";
+/** The bordered box: background, radius, border, colour transition. The
+ *  radius is the docked bar's original `rounded-2xl`: at the compact row's
+ *  stature it reads as a soft pill, which is the shape the composers were
+ *  meant to unify on. */
+export declare const COMPOSER_BOX_CLASS = "bg-background rounded-2xl border";
+/** The box's focus ring in its default (non-anonymized) treatment. */
+export declare const COMPOSER_BOX_FOCUS_CLASS = "focus-within:border-ring";
+/**
+ * The box's "shield active" treatment when the next send is anonymized: a
+ * blue ring replaces the default focus border (both together read as a
+ * double ring on click).
+ */
+export declare const COMPOSER_BOX_ANONYMIZED_CLASS = "ring-info/40 border-info/40 focus-within:border-info/60 shadow-[0_0_0_4px_rgb(from_var(--color-info)_r_g_b_/_0.08)] ring-1";
+/**
+ * The compact (one-line) bar row: its stature, end alignment, control gap
+ * and inset. The surface supplies the layout (`grid` for the chat bar's
+ * three fixed columns, `flex` for the docked bar's variable leading
+ * controls); the row grows with the editor.
+ */
+export declare const COMPOSER_COMPACT_ROW_CLASS = "min-h-11 items-end gap-1 px-1.5 py-px";
+/**
+ * The compact text cell: one `text-sm` line at `leading-5` plus the
+ * vertical inset that makes a single line exactly as tall as the row's
+ * inner height (44px row, 1px inset each side ⇒ 42px), so text and controls
+ * share one centre. The editable element itself takes `min-h-0` so an empty
+ * composer collapses to this one line and grows from there.
+ */
+export declare const COMPOSER_COMPACT_TEXT_CELL_CLASS = "relative min-w-0 py-[11px]";
+/** Text stature of the editor and every placeholder painted over it. */
+export declare const COMPOSER_TEXT_CLASS = "text-sm leading-5";
+/**
+ * The `large` (hero) text well: the padding around the editor. The editor's
+ * own stature is `COMPOSER_LARGE_EDITOR_CLASS` (~3 lines of `text-sm` at
+ * `leading-5`), applied on the editable element by each surface because the
+ * chat editor targets its `.ProseMirror` node while a plain textarea takes
+ * it directly.
+ */
+export declare const COMPOSER_LARGE_TEXT_WELL_CLASS = "ps-3 pe-3 pt-2 pb-1";
+/** The `large` editable element's stature: three lines before it grows. */
+export declare const COMPOSER_LARGE_EDITOR_CLASS = "min-h-15";
+/** The placeholder painted over an empty editor, in either stature. */
+export declare const COMPOSER_PLACEHOLDER_CLASS = "text-foreground-placeholder pointer-events-none absolute truncate text-sm";
+/** The `large` action row under the text well: leading controls, trailing send. */
+export declare const COMPOSER_LARGE_ACTION_ROW_CLASS = "flex items-center justify-end gap-0.5 px-1.5 pb-1.5";
+/** The leading group of the action row (the (+) menu, or a scope control). */
+export declare const COMPOSER_LEADING_GROUP_CLASS = "flex min-w-0 items-center gap-0.5";
+/**
+ * The round, foreground-filled primary control at the action row's end:
+ * the chat's send/stop/retry button and the law home's submit. `size-7`
+ * pins the circle to the (+) trigger's diameter at every breakpoint
+ * (`icon-sm` alone is 32px below `sm`), so a row's two round ends match.
+ */
+export declare const COMPOSER_SEND_BUTTON_CLASS = "bg-foreground text-background hover:bg-foreground/90 size-7 shrink-0 rounded-full";
+/**
+ * A picker in the status row under the box (the chat's matter picker, the
+ * law home's scope and jurisdiction): quiet text with a hover surface, so
+ * the row stays subordinate to the box above it.
+ */
+export declare const COMPOSER_PICKER_TRIGGER_CLASS = "text-muted-foreground hover:text-foreground hover:bg-accent inline-flex min-w-0 shrink items-center gap-1 rounded-md px-1.5 py-0.5 text-2xs";
+//#endregion

package/dist/components/composer-tokens.js

@@ -0,0 +1,73 @@
+//#region src/components/composer-tokens.ts
+/**
+* The tokens every composer box shares: the chat hero, the chat follow-up
+* bar, the docked bar over documents (inspector chat, file overlay,
+* Template Studio) and the law home's entry box all render one shell from
+* these, so they restyle together. A surface that needs the look imports
+* these rather than copying the classes; a copy is how the boxes drifted
+* apart the first time (44px / `rounded-lg` / 14px in the chat, 38px /
+* `rounded-2xl` / 13px in the inspector).
+*/
+/** Shared responsive size for the two round controls flanking a composer. */
+const COMPOSER_CONTROL_BUTTON_SIZE = "icon-sm";
+/** The bordered box: background, radius, border, colour transition. The
+*  radius is the docked bar's original `rounded-2xl`: at the compact row's
+*  stature it reads as a soft pill, which is the shape the composers were
+*  meant to unify on. */
+const COMPOSER_BOX_CLASS = "bg-background rounded-2xl border";
+/** The box's focus ring in its default (non-anonymized) treatment. */
+const COMPOSER_BOX_FOCUS_CLASS = "focus-within:border-ring";
+/**
+* The box's "shield active" treatment when the next send is anonymized: a
+* blue ring replaces the default focus border (both together read as a
+* double ring on click).
+*/
+const COMPOSER_BOX_ANONYMIZED_CLASS = "ring-info/40 border-info/40 focus-within:border-info/60 shadow-[0_0_0_4px_rgb(from_var(--color-info)_r_g_b_/_0.08)] ring-1";
+/**
+* The compact (one-line) bar row: its stature, end alignment, control gap
+* and inset. The surface supplies the layout (`grid` for the chat bar's
+* three fixed columns, `flex` for the docked bar's variable leading
+* controls); the row grows with the editor.
+*/
+const COMPOSER_COMPACT_ROW_CLASS = "min-h-11 items-end gap-1 px-1.5 py-px";
+/**
+* The compact text cell: one `text-sm` line at `leading-5` plus the
+* vertical inset that makes a single line exactly as tall as the row's
+* inner height (44px row, 1px inset each side ⇒ 42px), so text and controls
+* share one centre. The editable element itself takes `min-h-0` so an empty
+* composer collapses to this one line and grows from there.
+*/
+const COMPOSER_COMPACT_TEXT_CELL_CLASS = "relative min-w-0 py-[11px]";
+/** Text stature of the editor and every placeholder painted over it. */
+const COMPOSER_TEXT_CLASS = "text-sm leading-5";
+/**
+* The `large` (hero) text well: the padding around the editor. The editor's
+* own stature is `COMPOSER_LARGE_EDITOR_CLASS` (~3 lines of `text-sm` at
+* `leading-5`), applied on the editable element by each surface because the
+* chat editor targets its `.ProseMirror` node while a plain textarea takes
+* it directly.
+*/
+const COMPOSER_LARGE_TEXT_WELL_CLASS = "ps-3 pe-3 pt-2 pb-1";
+/** The `large` editable element's stature: three lines before it grows. */
+const COMPOSER_LARGE_EDITOR_CLASS = "min-h-15";
+/** The placeholder painted over an empty editor, in either stature. */
+const COMPOSER_PLACEHOLDER_CLASS = "text-foreground-placeholder pointer-events-none absolute truncate text-sm";
+/** The `large` action row under the text well: leading controls, trailing send. */
+const COMPOSER_LARGE_ACTION_ROW_CLASS = "flex items-center justify-end gap-0.5 px-1.5 pb-1.5";
+/** The leading group of the action row (the (+) menu, or a scope control). */
+const COMPOSER_LEADING_GROUP_CLASS = "flex min-w-0 items-center gap-0.5";
+/**
+* The round, foreground-filled primary control at the action row's end:
+* the chat's send/stop/retry button and the law home's submit. `size-7`
+* pins the circle to the (+) trigger's diameter at every breakpoint
+* (`icon-sm` alone is 32px below `sm`), so a row's two round ends match.
+*/
+const COMPOSER_SEND_BUTTON_CLASS = "bg-foreground text-background hover:bg-foreground/90 size-7 shrink-0 rounded-full";
+/**
+* A picker in the status row under the box (the chat's matter picker, the
+* law home's scope and jurisdiction): quiet text with a hover surface, so
+* the row stays subordinate to the box above it.
+*/
+const COMPOSER_PICKER_TRIGGER_CLASS = "text-muted-foreground hover:text-foreground hover:bg-accent inline-flex min-w-0 shrink items-center gap-1 rounded-md px-1.5 py-0.5 text-2xs";
+//#endregion
+export { COMPOSER_BOX_ANONYMIZED_CLASS, COMPOSER_BOX_CLASS, COMPOSER_BOX_FOCUS_CLASS, COMPOSER_COMPACT_ROW_CLASS, COMPOSER_COMPACT_TEXT_CELL_CLASS, COMPOSER_CONTROL_BUTTON_SIZE, COMPOSER_LARGE_ACTION_ROW_CLASS, COMPOSER_LARGE_EDITOR_CLASS, COMPOSER_LARGE_TEXT_WELL_CLASS, COMPOSER_LEADING_GROUP_CLASS, COMPOSER_PICKER_TRIGGER_CLASS, COMPOSER_PLACEHOLDER_CLASS, COMPOSER_SEND_BUTTON_CLASS, COMPOSER_TEXT_CLASS };

package/dist/components/composer.d.ts

@@ -1,75 +1,6 @@
+import { COMPOSER_BOX_ANONYMIZED_CLASS, COMPOSER_BOX_CLASS, COMPOSER_BOX_FOCUS_CLASS, COMPOSER_COMPACT_ROW_CLASS, COMPOSER_COMPACT_TEXT_CELL_CLASS, COMPOSER_CONTROL_BUTTON_SIZE, COMPOSER_LARGE_ACTION_ROW_CLASS, COMPOSER_LARGE_EDITOR_CLASS, COMPOSER_LARGE_TEXT_WELL_CLASS, COMPOSER_LEADING_GROUP_CLASS, COMPOSER_PICKER_TRIGGER_CLASS, COMPOSER_PLACEHOLDER_CLASS, COMPOSER_SEND_BUTTON_CLASS, COMPOSER_TEXT_CLASS } from "./composer-tokens.js";
 import { ReactNode } from "react";
 //#region src/components/composer.d.ts
-/**
- * The tokens every composer box shares: the chat hero, the chat follow-up
- * bar, the docked bar over documents (inspector chat, file overlay,
- * Template Studio) and the law home's entry box all render one shell from
- * these, so they restyle together. A surface that needs the look imports
- * these rather than copying the classes; a copy is how the boxes drifted
- * apart the first time (44px / `rounded-lg` / 14px in the chat, 38px /
- * `rounded-2xl` / 13px in the inspector).
- */
-/** Shared responsive size for the two round controls flanking a composer. */
-export declare const COMPOSER_CONTROL_BUTTON_SIZE: "icon-sm";
-/** The bordered box: background, radius, border, colour transition. The
- *  radius is the docked bar's original `rounded-2xl`: at the compact row's
- *  stature it reads as a soft pill, which is the shape the composers were
- *  meant to unify on. */
-export declare const COMPOSER_BOX_CLASS = "bg-background rounded-2xl border";
-/** The box's focus ring in its default (non-anonymized) treatment. */
-export declare const COMPOSER_BOX_FOCUS_CLASS = "focus-within:border-ring";
-/**
- * The box's "shield active" treatment when the next send is anonymized: a
- * blue ring replaces the default focus border (both together read as a
- * double ring on click).
- */
-export declare const COMPOSER_BOX_ANONYMIZED_CLASS = "ring-info/40 border-info/40 focus-within:border-info/60 shadow-[0_0_0_4px_rgb(from_var(--color-info)_r_g_b_/_0.08)] ring-1";
-/**
- * The compact (one-line) bar row: its stature, end alignment, control gap
- * and inset. The surface supplies the layout (`grid` for the chat bar's
- * three fixed columns, `flex` for the docked bar's variable leading
- * controls); the row grows with the editor.
- */
-export declare const COMPOSER_COMPACT_ROW_CLASS = "min-h-11 items-end gap-1 px-1.5 py-px";
-/**
- * The compact text cell: one `text-sm` line at `leading-5` plus the
- * vertical inset that makes a single line exactly as tall as the row's
- * inner height (44px row, 1px inset each side ⇒ 42px), so text and controls
- * share one centre. The editable element itself takes `min-h-0` so an empty
- * composer collapses to this one line and grows from there.
- */
-export declare const COMPOSER_COMPACT_TEXT_CELL_CLASS = "relative min-w-0 py-[11px]";
-/** Text stature of the editor and every placeholder painted over it. */
-export declare const COMPOSER_TEXT_CLASS = "text-sm leading-5";
-/**
- * The `large` (hero) text well: the padding around the editor. The editor's
- * own stature is `COMPOSER_LARGE_EDITOR_CLASS` (~3 lines of `text-sm` at
- * `leading-5`), applied on the editable element by each surface because the
- * chat editor targets its `.ProseMirror` node while a plain textarea takes
- * it directly.
- */
-export declare const COMPOSER_LARGE_TEXT_WELL_CLASS = "ps-3 pe-3 pt-2 pb-1";
-/** The `large` editable element's stature: three lines before it grows. */
-export declare const COMPOSER_LARGE_EDITOR_CLASS = "min-h-15";
-/** The placeholder painted over an empty editor, in either stature. */
-export declare const COMPOSER_PLACEHOLDER_CLASS = "text-foreground-placeholder pointer-events-none absolute truncate text-sm";
-/** The `large` action row under the text well: leading controls, trailing send. */
-export declare const COMPOSER_LARGE_ACTION_ROW_CLASS = "flex items-center justify-end gap-0.5 px-1.5 pb-1.5";
-/** The leading group of the action row (the (+) menu, or a scope control). */
-export declare const COMPOSER_LEADING_GROUP_CLASS = "flex min-w-0 items-center gap-0.5";
-/**
- * The round, foreground-filled primary control at the action row's end:
- * the chat's send/stop/retry button and the law home's submit. `size-7`
- * pins the circle to the (+) trigger's diameter at every breakpoint
- * (`icon-sm` alone is 32px below `sm`), so a row's two round ends match.
- */
-export declare const COMPOSER_SEND_BUTTON_CLASS = "bg-foreground text-background hover:bg-foreground/90 size-7 shrink-0 rounded-full";
-/**
- * A picker in the status row under the box (the chat's matter picker, the
- * law home's scope and jurisdiction): quiet text with a hover surface, so
- * the row stays subordinate to the box above it.
- */
-export declare const COMPOSER_PICKER_TRIGGER_CLASS = "text-muted-foreground hover:text-foreground hover:bg-accent inline-flex min-w-0 shrink items-center gap-1 rounded-md px-1.5 py-0.5 text-2xs";
 type ComposerStatusRowProps = {
   /** Left cluster: matter picker, web-search / anonymize toggles, ... */
   start?: ReactNode | undefined;
@@ -112,4 +43,5 @@ type ComposerPickerProps<Value extends string> = {
  * kind of control.
  */
 export declare const ComposerPicker: <Value extends string>({ ariaLabel, icon, onChange, options, value }: ComposerPickerProps<Value>) => import("react").JSX.Element;
-//#endregion
+//#endregion
+export { COMPOSER_BOX_ANONYMIZED_CLASS, COMPOSER_BOX_CLASS, COMPOSER_BOX_FOCUS_CLASS, COMPOSER_COMPACT_ROW_CLASS, COMPOSER_COMPACT_TEXT_CELL_CLASS, COMPOSER_CONTROL_BUTTON_SIZE, COMPOSER_LARGE_ACTION_ROW_CLASS, COMPOSER_LARGE_EDITOR_CLASS, COMPOSER_LARGE_TEXT_WELL_CLASS, COMPOSER_LEADING_GROUP_CLASS, COMPOSER_PICKER_TRIGGER_CLASS, COMPOSER_PLACEHOLDER_CLASS, COMPOSER_SEND_BUTTON_CLASS, COMPOSER_TEXT_CLASS };

package/dist/components/composer.js

@@ -2,79 +2,10 @@
 import { ChevronDownIcon } from "../icons.js";
 import { cn } from "../lib/utils.js";
 import { DropdownMenu as Menu, DropdownMenuContent as MenuPopup, DropdownMenuRadioGroup as MenuRadioGroup, DropdownMenuRadioItem as MenuRadioItem, DropdownMenuTrigger as MenuTrigger } from "./menu.js";
+import { COMPOSER_BOX_ANONYMIZED_CLASS, COMPOSER_BOX_CLASS, COMPOSER_BOX_FOCUS_CLASS, COMPOSER_COMPACT_ROW_CLASS, COMPOSER_COMPACT_TEXT_CELL_CLASS, COMPOSER_CONTROL_BUTTON_SIZE, COMPOSER_LARGE_ACTION_ROW_CLASS, COMPOSER_LARGE_EDITOR_CLASS, COMPOSER_LARGE_TEXT_WELL_CLASS, COMPOSER_LEADING_GROUP_CLASS, COMPOSER_PICKER_TRIGGER_CLASS, COMPOSER_PLACEHOLDER_CLASS, COMPOSER_SEND_BUTTON_CLASS, COMPOSER_TEXT_CLASS } from "./composer-tokens.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/composer.tsx
 /**
-* The tokens every composer box shares: the chat hero, the chat follow-up
-* bar, the docked bar over documents (inspector chat, file overlay,
-* Template Studio) and the law home's entry box all render one shell from
-* these, so they restyle together. A surface that needs the look imports
-* these rather than copying the classes; a copy is how the boxes drifted
-* apart the first time (44px / `rounded-lg` / 14px in the chat, 38px /
-* `rounded-2xl` / 13px in the inspector).
-*/
-/** Shared responsive size for the two round controls flanking a composer. */
-const COMPOSER_CONTROL_BUTTON_SIZE = "icon-sm";
-/** The bordered box: background, radius, border, colour transition. The
-*  radius is the docked bar's original `rounded-2xl`: at the compact row's
-*  stature it reads as a soft pill, which is the shape the composers were
-*  meant to unify on. */
-const COMPOSER_BOX_CLASS = "bg-background rounded-2xl border";
-/** The box's focus ring in its default (non-anonymized) treatment. */
-const COMPOSER_BOX_FOCUS_CLASS = "focus-within:border-ring";
-/**
-* The box's "shield active" treatment when the next send is anonymized: a
-* blue ring replaces the default focus border (both together read as a
-* double ring on click).
-*/
-const COMPOSER_BOX_ANONYMIZED_CLASS = "ring-info/40 border-info/40 focus-within:border-info/60 shadow-[0_0_0_4px_rgb(from_var(--color-info)_r_g_b_/_0.08)] ring-1";
-/**
-* The compact (one-line) bar row: its stature, end alignment, control gap
-* and inset. The surface supplies the layout (`grid` for the chat bar's
-* three fixed columns, `flex` for the docked bar's variable leading
-* controls); the row grows with the editor.
-*/
-const COMPOSER_COMPACT_ROW_CLASS = "min-h-11 items-end gap-1 px-1.5 py-px";
-/**
-* The compact text cell: one `text-sm` line at `leading-5` plus the
-* vertical inset that makes a single line exactly as tall as the row's
-* inner height (44px row, 1px inset each side ⇒ 42px), so text and controls
-* share one centre. The editable element itself takes `min-h-0` so an empty
-* composer collapses to this one line and grows from there.
-*/
-const COMPOSER_COMPACT_TEXT_CELL_CLASS = "relative min-w-0 py-[11px]";
-/** Text stature of the editor and every placeholder painted over it. */
-const COMPOSER_TEXT_CLASS = "text-sm leading-5";
-/**
-* The `large` (hero) text well: the padding around the editor. The editor's
-* own stature is `COMPOSER_LARGE_EDITOR_CLASS` (~3 lines of `text-sm` at
-* `leading-5`), applied on the editable element by each surface because the
-* chat editor targets its `.ProseMirror` node while a plain textarea takes
-* it directly.
-*/
-const COMPOSER_LARGE_TEXT_WELL_CLASS = "ps-3 pe-3 pt-2 pb-1";
-/** The `large` editable element's stature: three lines before it grows. */
-const COMPOSER_LARGE_EDITOR_CLASS = "min-h-15";
-/** The placeholder painted over an empty editor, in either stature. */
-const COMPOSER_PLACEHOLDER_CLASS = "text-foreground-placeholder pointer-events-none absolute truncate text-sm";
-/** The `large` action row under the text well: leading controls, trailing send. */
-const COMPOSER_LARGE_ACTION_ROW_CLASS = "flex items-center justify-end gap-0.5 px-1.5 pb-1.5";
-/** The leading group of the action row (the (+) menu, or a scope control). */
-const COMPOSER_LEADING_GROUP_CLASS = "flex min-w-0 items-center gap-0.5";
-/**
-* The round, foreground-filled primary control at the action row's end:
-* the chat's send/stop/retry button and the law home's submit. `size-7`
-* pins the circle to the (+) trigger's diameter at every breakpoint
-* (`icon-sm` alone is 32px below `sm`), so a row's two round ends match.
-*/
-const COMPOSER_SEND_BUTTON_CLASS = "bg-foreground text-background hover:bg-foreground/90 size-7 shrink-0 rounded-full";
-/**
-* A picker in the status row under the box (the chat's matter picker, the
-* law home's scope and jurisdiction): quiet text with a hover surface, so
-* the row stays subordinate to the box above it.
-*/
-const COMPOSER_PICKER_TRIGGER_CLASS = "text-muted-foreground hover:text-foreground hover:bg-accent inline-flex min-w-0 shrink items-center gap-1 rounded-md px-1.5 py-0.5 text-2xs";
-/**
 * The slim status row rendered beneath a composer box: a `text-xs` row with
 * a start cluster and an end slot pinned to the far edge. Shared by every
 * surface so the shell can never drift. Renders nothing when both slots are

package/dist/components/copy-button.d.ts

@@ -1,6 +1,6 @@
 import { Button } from "./button.js";
-import { CopyToClipboardIcon } from "../icons.js";
 import { ComponentProps } from "react";
+import { CopyToClipboardIcon } from "../icons.js";
 //#region src/components/copy-button.d.ts
 export declare const COPIED_RESET_MS = 1500;
 type CopyButtonProps = Omit<ComponentProps<typeof Button>, "children" | "onClick"> & {

package/dist/components/date-picker-popover.d.ts

@@ -1,5 +1,5 @@
-import { OverlayLayer } from "../lib/overlay-layer.js";
 import { DatePickerMode } from "./date-picker-popover.logic.js";
+import { OverlayLayer } from "../lib/overlay-layer.js";
 //#region src/components/date-picker-popover.d.ts
 /**
  * `compact` keeps the dense 32px day cells everywhere. `touch` grows day,

package/dist/components/destructive-action-confirmation.d.ts

@@ -1,5 +1,5 @@
-import { InputProps } from "./input.js";
 import * as React$1 from "react";
+import { InputProps } from "./input.js";
 //#region src/components/destructive-action-confirmation.d.ts
 type DestructiveActionConfirmationProps = Omit<InputProps, "onChange" | "type" | "value"> & {
   confirmation: string;

package/dist/components/dialog.d.ts

@@ -1,7 +1,7 @@
-import { OverlayLayer } from "../lib/overlay-layer.js";
-import { DialogFormState } from "./dialog-form-state.js";
 import * as React$1 from "react";
 import { Dialog as Dialog$1 } from "@base-ui/react/dialog";
+import { DialogFormState } from "./dialog-form-state.js";
+import { OverlayLayer } from "../lib/overlay-layer.js";
 //#region src/components/dialog.d.ts
 declare const DialogCreateHandle: typeof Dialog$1.createHandle;
 type DialogLabels = {

package/dist/components/document-identity-badge.js

@@ -2,7 +2,7 @@ import { FileTextIcon } from "../icons.js";
 import { cn } from "../lib/utils.js";
 import { Tooltip, TooltipContent as TooltipPopup, TooltipTrigger } from "./tooltip.js";
 import { CourtBadge } from "./court-badge.js";
-import { COURT_TIER_WEIGHT, statuteIdentityLabels } from "./document-identity-badge.logic.js";
+import { COURT_TIER_WEIGHT, caseNumberIdentityLabels, statuteIdentityLabels } from "./document-identity-badge.logic.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { panic } from "better-result";
 //#region src/components/document-identity-badge.tsx
@@ -18,21 +18,11 @@ function documentIdentityMark(identity, size) {
 	switch (identity.kind) {
 		case "statute": {
 			const labels = statuteIdentityLabels(identity);
-			if (labels === null) return unknownDocumentMark();
-			return /* @__PURE__ */ jsxs("span", {
-				className: cn("@container/document-identity inline-flex max-w-full shrink-0 items-center justify-center font-mono leading-4 font-semibold tabular-nums", labels.short.length > 7 ? "text-[9px]" : "text-[10px]"),
-				style: { width: `${labels.long.length + .25}ch` },
-				"data-slot": "document-identity-badge",
-				"data-kind": "statute",
-				dir: "ltr",
-				children: [/* @__PURE__ */ jsx("bdi", {
-					className: statuteLabelClasses(labels.long.length).short,
-					children: labels.short
-				}), /* @__PURE__ */ jsx("bdi", {
-					className: statuteLabelClasses(labels.long.length).long,
-					children: labels.long
-				})]
-			});
+			return labels === null ? unknownDocumentMark() : referenceLabelMark(labels, "statute");
+		}
+		case "caseNumber": {
+			const labels = caseNumberIdentityLabels(identity);
+			return labels === null ? unknownDocumentMark() : referenceLabelMark(labels, "caseNumber");
 		}
 		case "decision": {
 			const abbreviation = identity.courtAbbreviation?.trim();
@@ -53,6 +43,30 @@ function documentIdentityMark(identity, size) {
 		default: return panic("Unhandled document identity");
 	}
 }
+/**
+* A number standing for its document: a statute's `165/12`, a decision's
+* `C-359/25`. Container queries compare available space with the full label
+* in the same monospace units, so no observer or per-row state is needed; a
+* label longer than its slot even in the short form truncates rather than
+* spilling over its neighbour.
+*/
+function referenceLabelMark(labels, kind) {
+	const classes = statuteLabelClasses(labels.long.length);
+	return /* @__PURE__ */ jsxs("span", {
+		className: cn("@container/document-identity inline-flex max-w-full shrink-0 items-center justify-center font-mono leading-4 font-semibold tabular-nums", labels.short.length > 7 ? "text-[9px]" : "text-[10px]"),
+		style: { width: `${labels.long.length + .25}ch` },
+		"data-slot": "document-identity-badge",
+		"data-kind": kind,
+		dir: "ltr",
+		children: [/* @__PURE__ */ jsx("bdi", {
+			className: cn("min-w-0 truncate", classes.short),
+			children: labels.short
+		}), /* @__PURE__ */ jsx("bdi", {
+			className: cn("min-w-0 truncate", classes.long),
+			children: labels.long
+		})]
+	});
+}
 function unknownDocumentMark() {
 	return /* @__PURE__ */ jsx(FileTextIcon, {
 		"aria-hidden": "true",

package/dist/components/document-identity-badge.logic.d.ts

@@ -13,13 +13,32 @@ export type DocumentIdentity = {
   kind: "decision";
   courtAbbreviation: string | null | undefined;
   courtTier?: keyof typeof COURT_TIER_WEIGHT | undefined;
+} |
+/**
+ * A decision named by its own case number, where a court chip would not
+ * tell several open decisions apart (one court's tabs side by side).
+ */
+{
+  kind: "caseNumber";
+  caseNumber: string | null | undefined;
 } | {
   kind: "unknown";
 };
-export declare const statuteIdentityLabels: ({ number, year }: Extract<DocumentIdentity, {
-  kind: "statute";
-}>) => {
+/** A reference label in its narrow and its full form. */
+export type IdentityLabels = {
   short: string;
   long: string;
-} | null;
+};
+export declare const statuteIdentityLabels: ({ number, year }: Extract<DocumentIdentity, {
+  kind: "statute";
+}>) => IdentityLabels | null;
+/**
+ * A case number in the two forms a statute number takes: the full one, and
+ * one whose closing four-digit year is cut to two, the way `165/2012` reads
+ * `165/12`. A number already printed with a two-digit year (`C-359/25`) is
+ * its own short form.
+ */
+export declare const caseNumberIdentityLabels: ({ caseNumber }: Extract<DocumentIdentity, {
+  kind: "caseNumber";
+}>) => IdentityLabels | null;
 //#endregion

package/dist/components/document-identity-badge.logic.js

@@ -21,5 +21,21 @@ const statuteIdentityLabels = ({ number, year }) => {
 		long: `${ordinal}/${fullYear}`
 	};
 };
+/** A four-digit year closing a case number: `1234/2019`, `C-1/2004`. */
+const TRAILING_FULL_YEAR = /\/\d{2}(\d{2})$/u;
+/**
+* A case number in the two forms a statute number takes: the full one, and
+* one whose closing four-digit year is cut to two, the way `165/2012` reads
+* `165/12`. A number already printed with a two-digit year (`C-359/25`) is
+* its own short form.
+*/
+const caseNumberIdentityLabels = ({ caseNumber }) => {
+	const long = caseNumber?.trim().replaceAll(/\s+/gu, " ") ?? "";
+	if (long === "") return null;
+	return {
+		short: long.replace(TRAILING_FULL_YEAR, "/$1"),
+		long
+	};
+};
 //#endregion
-export { COURT_TIER_WEIGHT, statuteIdentityLabels };
+export { COURT_TIER_WEIGHT, caseNumberIdentityLabels, statuteIdentityLabels };

package/dist/components/input-group.d.ts

@@ -1,6 +1,6 @@
+import * as React$1 from "react";
 import { InputProps } from "./input.js";
 import { TextareaProps } from "./textarea.js";
-import * as React$1 from "react";
 import { VariantProps } from "class-variance-authority";
 //#region src/components/input-group.d.ts
 declare const InputGroup: ({ className, ...props }: React$1.ComponentProps<"div">) => React$1.JSX.Element;

package/dist/components/input.d.ts

@@ -1,5 +1,5 @@
-import { ControlSize } from "../lib/control-size.js";
 import * as React$1 from "react";
+import { ControlSize } from "../lib/control-size.js";
 import { Input as Input$1 } from "@base-ui/react/input";
 //#region src/components/input.d.ts
 type InputProps = Omit<Input$1.Props & React$1.RefAttributes<HTMLInputElement>, "size" | "style" | "type"> & {

package/dist/components/list.d.ts

@@ -1,6 +1,6 @@
 import * as React$1 from "react";
-import { useRender } from "@base-ui/react/use-render";
 import { VariantProps } from "class-variance-authority";
+import { useRender } from "@base-ui/react/use-render";
 //#region src/components/list.d.ts
 /**
  * Grouped list: a titled section holding one surface of hairline-divided

package/dist/components/pagination.d.ts

@@ -1,5 +1,5 @@
-import { Button } from "./button.js";
 import * as React$1 from "react";
+import { Button } from "./button.js";
 import { useRender } from "@base-ui/react/use-render";
 //#region src/components/pagination.d.ts
 declare const Pagination: ({ className, ...props }: React$1.ComponentProps<"nav">) => React$1.JSX.Element;

package/dist/components/popover.d.ts

@@ -1,6 +1,6 @@
-import { OverlayLayer } from "../lib/overlay-layer.js";
 import * as React$1 from "react";
 import { ComponentProps } from "react";
+import { OverlayLayer } from "../lib/overlay-layer.js";
 import { Popover as Popover$1 } from "@base-ui/react/popover";
 //#region src/components/popover.d.ts
 declare const PopoverCreateHandle: typeof Popover$1.createHandle;