@datum-cloud/datum-ui 3.7.1 → 3.10.0

package/dist/components/base/radio-group/radio-group.d.ts

@@ -1,13 +1,19 @@
-import { RadioGroup as ShadcnRadioGroup, RadioGroupItem as ShadcnRadioGroupItem } from '../../../_shadcn/ui/radio-group';
+import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
 import * as React from 'react';
-declare function RadioGroup({ ref, className, ...props }: React.ComponentProps<typeof ShadcnRadioGroup> & {
-    ref?: React.RefObject<React.ElementRef<typeof ShadcnRadioGroup> | null>;
+declare function RadioGroup({ ref, className, value: valueProp, defaultValue, onValueChange, ...props }: React.ComponentProps<typeof RadioGroupPrimitive.Root> & {
+    ref?: React.RefObject<React.ElementRef<typeof RadioGroupPrimitive.Root> | null>;
 }): React.JSX.Element;
 declare namespace RadioGroup {
     var displayName: string;
 }
-declare function RadioGroupItem({ ref, className, ...props }: React.ComponentProps<typeof ShadcnRadioGroupItem> & {
-    ref?: React.RefObject<React.ElementRef<typeof ShadcnRadioGroupItem> | null>;
+/**
+ * RadioGroupItem renders the Radix primitive directly (not the shadcn wrapper)
+ * so the dot can stay mounted and animate out as well as in. The dot pops in
+ * from half size with a small spring and fades out quickly when another option
+ * takes the selection. Under reduced motion it only fades.
+ */
+declare function RadioGroupItem({ ref, className, value, ...props }: React.ComponentProps<typeof RadioGroupPrimitive.Item> & {
+    ref?: React.RefObject<React.ElementRef<typeof RadioGroupPrimitive.Item> | null>;
 }): React.JSX.Element;
 declare namespace RadioGroupItem {
     var displayName: string;

package/dist/components/base/spinner/index.d.ts

@@ -1 +1 @@
-export * from '../../../_shadcn/ui/spinner';
+export { Spinner } from './spinner';

package/dist/components/base/spinner/spinner.d.ts

@@ -0,0 +1,11 @@
+import type * as React from 'react';
+/**
+ * Standalone loading indicator, announced to assistive tech as a status.
+ *
+ * Built on `SpinnerIcon`. It differs in three ways: it is `size-4` unless a
+ * size class is passed, it carries `role="status"`, and its colour comes from
+ * `className` (default `text-primary`), so `<Spinner className="text-white" />`
+ * recolours the arc and its track together.
+ */
+declare function Spinner({ className, ...props }: React.ComponentProps<'svg'>): React.JSX.Element;
+export { Spinner };

package/dist/components/base/switch/switch.d.ts

@@ -5,8 +5,13 @@ import * as React from 'react';
  * one, because its state glyphs go inside the thumb. Building it here keeps the
  * shadcn base untouched, so that base can be regenerated from upstream without
  * losing anything of ours.
+ *
+ * Motion drives the thumb: it slides on a light spring, stretches while the
+ * pointer is held down (so the press registers before the release toggles it),
+ * and the on/off glyphs cross-fade. Under reduced motion the thumb moves
+ * instantly and only the glyphs fade.
  */
-declare function Switch({ ref, className, ...props }: React.ComponentProps<typeof SwitchPrimitive.Root> & {
+declare function Switch({ ref, className, checked: checkedProp, defaultChecked, onCheckedChange, onPointerDown, onPointerUp, onPointerLeave, onPointerCancel, ...props }: React.ComponentProps<typeof SwitchPrimitive.Root> & {
     ref?: React.RefObject<React.ElementRef<typeof SwitchPrimitive.Root> | null>;
 }): React.JSX.Element;
 declare namespace Switch {

package/dist/components/base/typography/typography.d.ts

@@ -1,7 +1,7 @@
 import type { VariantProps } from 'class-variance-authority';
 import * as React from 'react';
 declare const titleVariants: (props?: ({
-    level?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | null | undefined;
+    level?: 1 | 2 | 4 | 3 | 5 | 6 | 7 | null | undefined;
     weight?: "bold" | "normal" | "medium" | "semibold" | "extrabold" | null | undefined;
     textColor?: "default" | "secondary" | "destructive" | "success" | "info" | "warning" | "primary" | "muted" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;

package/dist/components/features/_shared/copy-state-icon.d.ts

@@ -0,0 +1,12 @@
+import type { LucideProps } from 'lucide-react';
+/**
+ * Copy glyph that turns into a check once the copy has happened, and back again
+ * when `copied` resets. The two glyphs are stacked and cross-fade with a scale
+ * and a light blur, so the swap reads as one icon changing rather than two
+ * swapping places. Under reduced motion it only fades.
+ *
+ * Decorative: the owning button carries the accessible label.
+ */
+export declare function CopyStateIcon({ copied, ...iconProps }: LucideProps & {
+    copied: boolean;
+}): import("react").JSX.Element;

package/dist/components/features/_shared/index.d.ts

@@ -1,2 +1,4 @@
+export { CopyStateIcon } from './copy-state-icon';
+export { MotionBadge, useChipMotion } from './motion-chip';
 export { endOfDayInTz, startOfDayInTz } from './timezone';
 export { useDeprecationWarning } from './use-deprecation-warning';

package/dist/components/features/_shared/motion-chip.d.ts

@@ -0,0 +1,293 @@
+import type { HTMLMotionProps } from 'motion/react';
+/** `Badge` as a Motion component, so chips can enter, exit and reflow. */
+export declare const MotionBadge: import("react").ComponentType<Omit<{
+    slot?: string | undefined;
+    title?: string | undefined;
+    className?: string | undefined;
+    defaultChecked?: boolean | undefined;
+    defaultValue?: string | number | readonly string[] | undefined;
+    suppressContentEditableWarning?: boolean | undefined;
+    suppressHydrationWarning?: boolean | undefined;
+    accessKey?: string | undefined;
+    autoCapitalize?: "none" | (string & {}) | "off" | "on" | "sentences" | "words" | "characters" | undefined;
+    autoFocus?: boolean | undefined;
+    contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
+    contextMenu?: string | undefined;
+    dir?: string | undefined;
+    draggable?: (boolean | "true" | "false") | undefined;
+    enterKeyHint?: "search" | "enter" | "done" | "go" | "next" | "previous" | "send" | undefined;
+    hidden?: boolean | undefined;
+    id?: string | undefined;
+    lang?: string | undefined;
+    nonce?: string | undefined;
+    spellCheck?: (boolean | "true" | "false") | undefined;
+    tabIndex?: number | undefined;
+    translate?: "yes" | "no" | undefined;
+    radioGroup?: string | undefined;
+    role?: import("react").AriaRole | undefined;
+    about?: string | undefined;
+    content?: string | undefined;
+    datatype?: string | undefined;
+    inlist?: any;
+    prefix?: string | undefined;
+    property?: string | undefined;
+    rel?: string | undefined;
+    resource?: string | undefined;
+    rev?: string | undefined;
+    typeof?: string | undefined;
+    vocab?: string | undefined;
+    autoCorrect?: string | undefined;
+    autoSave?: string | undefined;
+    color?: string | undefined;
+    itemProp?: string | undefined;
+    itemScope?: boolean | undefined;
+    itemType?: string | undefined;
+    itemID?: string | undefined;
+    itemRef?: string | undefined;
+    results?: number | undefined;
+    security?: string | undefined;
+    unselectable?: "off" | "on" | undefined;
+    popover?: "" | "auto" | "manual" | "hint" | undefined;
+    popoverTargetAction?: "toggle" | "show" | "hide" | undefined;
+    popoverTarget?: string | undefined;
+    inert?: boolean | undefined;
+    inputMode?: "search" | "text" | "none" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
+    is?: string | undefined;
+    exportparts?: string | undefined;
+    part?: string | undefined;
+    "aria-activedescendant"?: string | undefined;
+    "aria-atomic"?: (boolean | "true" | "false") | undefined;
+    "aria-autocomplete"?: "list" | "none" | "inline" | "both" | undefined;
+    "aria-braillelabel"?: string | undefined;
+    "aria-brailleroledescription"?: string | undefined;
+    "aria-busy"?: (boolean | "true" | "false") | undefined;
+    "aria-checked"?: boolean | "true" | "false" | "mixed" | undefined;
+    "aria-colcount"?: number | undefined;
+    "aria-colindex"?: number | undefined;
+    "aria-colindextext"?: string | undefined;
+    "aria-colspan"?: number | undefined;
+    "aria-controls"?: string | undefined;
+    "aria-current"?: boolean | "true" | "false" | "time" | "page" | "step" | "location" | "date" | undefined;
+    "aria-describedby"?: string | undefined;
+    "aria-description"?: string | undefined;
+    "aria-details"?: string | undefined;
+    "aria-disabled"?: (boolean | "true" | "false") | undefined;
+    "aria-dropeffect"?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
+    "aria-errormessage"?: string | undefined;
+    "aria-expanded"?: (boolean | "true" | "false") | undefined;
+    "aria-flowto"?: string | undefined;
+    "aria-grabbed"?: (boolean | "true" | "false") | undefined;
+    "aria-haspopup"?: boolean | "true" | "false" | "dialog" | "menu" | "grid" | "listbox" | "tree" | undefined;
+    "aria-hidden"?: (boolean | "true" | "false") | undefined;
+    "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
+    "aria-keyshortcuts"?: string | undefined;
+    "aria-label"?: string | undefined;
+    "aria-labelledby"?: string | undefined;
+    "aria-level"?: number | undefined;
+    "aria-live"?: "off" | "assertive" | "polite" | undefined;
+    "aria-modal"?: (boolean | "true" | "false") | undefined;
+    "aria-multiline"?: (boolean | "true" | "false") | undefined;
+    "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
+    "aria-orientation"?: "horizontal" | "vertical" | undefined;
+    "aria-owns"?: string | undefined;
+    "aria-placeholder"?: string | undefined;
+    "aria-posinset"?: number | undefined;
+    "aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
+    "aria-readonly"?: (boolean | "true" | "false") | undefined;
+    "aria-relevant"?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
+    "aria-required"?: (boolean | "true" | "false") | undefined;
+    "aria-roledescription"?: string | undefined;
+    "aria-rowcount"?: number | undefined;
+    "aria-rowindex"?: number | undefined;
+    "aria-rowindextext"?: string | undefined;
+    "aria-rowspan"?: number | undefined;
+    "aria-selected"?: (boolean | "true" | "false") | undefined;
+    "aria-setsize"?: number | undefined;
+    "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
+    "aria-valuemax"?: number | undefined;
+    "aria-valuemin"?: number | undefined;
+    "aria-valuenow"?: number | undefined;
+    "aria-valuetext"?: string | undefined;
+    dangerouslySetInnerHTML?: {
+        __html: string | TrustedHTML;
+    } | undefined;
+    onCopy?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCopyCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCut?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCutCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
+    onPaste?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
+    onPasteCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCompositionEnd?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionEndCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionStart?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionStartCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionUpdate?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionUpdateCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
+    onFocus?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
+    onFocusCapture?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
+    onBlur?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
+    onBlurCapture?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
+    onChange?: import("react").ChangeEventHandler<HTMLDivElement, Element> | undefined;
+    onChangeCapture?: import("react").ChangeEventHandler<HTMLDivElement, Element> | undefined;
+    onBeforeInput?: import("react").InputEventHandler<HTMLDivElement> | undefined;
+    onBeforeInputCapture?: import("react").InputEventHandler<HTMLDivElement> | undefined;
+    onInput?: import("react").InputEventHandler<HTMLDivElement> | undefined;
+    onInputCapture?: import("react").InputEventHandler<HTMLDivElement> | undefined;
+    onReset?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onResetCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSubmit?: import("react").SubmitEventHandler<HTMLDivElement> | undefined;
+    onSubmitCapture?: import("react").SubmitEventHandler<HTMLDivElement> | undefined;
+    onInvalid?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onInvalidCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoad?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onError?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onErrorCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onKeyDown?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyDownCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyPress?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyPressCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyUp?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyUpCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+    onAbort?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onAbortCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlay?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlayCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlayThrough?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlayThroughCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onDurationChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onDurationChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onEmptied?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onEmptiedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onEncrypted?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onEncryptedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onEnded?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onEndedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedData?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedDataCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedMetadata?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedMetadataCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadStart?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadStartCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onPause?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onPauseCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onPlay?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onPlayCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onPlaying?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onPlayingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onProgress?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onProgressCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onRateChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onRateChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSeeked?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSeekedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSeeking?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSeekingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onStalled?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onStalledCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSuspend?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSuspendCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onTimeUpdate?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onTimeUpdateCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onVolumeChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onVolumeChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onWaiting?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onWaitingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onAuxClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onAuxClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onContextMenu?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onContextMenuCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onDoubleClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onDoubleClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onDragCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragEndCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragEnter?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragEnterCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragExit?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragExitCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragLeave?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragLeaveCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragOver?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragOverCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragStartCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDrop?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDropCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onMouseDown?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseDownCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseEnter?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseLeave?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseMove?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseMoveCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOut?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOutCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOver?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOverCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseUp?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseUpCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onSelect?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSelectCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onTouchCancel?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchCancelCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchEnd?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchEndCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchMove?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchMoveCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchStart?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchStartCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onPointerDown?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerDownCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerMove?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerMoveCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerUp?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerUpCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerCancel?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerCancelCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerEnter?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerLeave?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOver?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOverCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOut?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOutCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onGotPointerCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onGotPointerCaptureCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onLostPointerCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onScroll?: import("react").UIEventHandler<HTMLDivElement> | undefined;
+    onScrollCapture?: import("react").UIEventHandler<HTMLDivElement> | undefined;
+    onScrollEnd?: import("react").UIEventHandler<HTMLDivElement> | undefined;
+    onScrollEndCapture?: import("react").UIEventHandler<HTMLDivElement> | undefined;
+    onWheel?: import("react").WheelEventHandler<HTMLDivElement> | undefined;
+    onWheelCapture?: import("react").WheelEventHandler<HTMLDivElement> | undefined;
+    onAnimationStartCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationEnd?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationIteration?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
+    onToggle?: import("react").ToggleEventHandler<HTMLDivElement> | undefined;
+    onBeforeToggle?: import("react").ToggleEventHandler<HTMLDivElement> | undefined;
+    onTransitionCancel?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
+    onTransitionCancelCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
+    onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
+    onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
+    onTransitionRun?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
+    onTransitionRunCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
+    onTransitionStart?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
+    onTransitionStartCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
+    type?: "secondary" | "success" | "info" | "warning" | "primary" | "tertiary" | "quaternary" | "danger" | "muted" | null | undefined;
+    theme?: "outline" | "solid" | "light" | null | undefined;
+} & import("motion/react").MotionProps, "children"> & {
+    children?: import("react").ReactNode | import("motion/react").MotionValue<number> | import("motion/react").MotionValue<string>;
+}>;
+/**
+ * Motion props for a chip in a wrapping list, for use with `MotionBadge`
+ * inside `<AnimatePresence initial={false} mode="popLayout">`.
+ *
+ * A chip scales up slightly as it fades in, and fades out a little faster
+ * when removed. `popLayout` takes the leaving chip out of flow straight away,
+ * and `layout="position"` slides the chips after it into the gap rather than
+ * snapping. The list needs `position: relative` for `popLayout` to place the
+ * leaving chip. Under reduced motion chips only fade and nothing slides.
+ */
+export declare function useChipMotion(): Pick<HTMLMotionProps<'div'>, 'initial' | 'animate' | 'exit' | 'transition' | 'layout'>;

package/dist/components/features/logs/hooks/use-logs-url-state.d.ts

@@ -0,0 +1,59 @@
+import type { LogFilters, LogTimeRange } from '../types';
+import type { LogsUrlState, LogsUrlStateOptions } from '../utils/url-state';
+type SearchParamsUpdate = (prev: URLSearchParams) => URLSearchParams;
+/**
+ * Updates the query string. Shaped like React Router's `setSearchParams`, so
+ * `useSearchParams()` from `react-router` plugs straight in.
+ */
+export type SetLogsSearchParams = (update: SearchParamsUpdate, options?: {
+    replace?: boolean;
+}) => void;
+export interface UseLogsUrlStateOptions extends LogsUrlStateOptions {
+    /**
+     * Current query string, from the app's router. Pass it together with
+     * `setSearchParams` whenever the app has a client router that owns the URL
+     * (React Router, TanStack Router): writing `window.history` behind its back
+     * leaves the router's location stale, and its next navigation can drop these
+     * params. Leave both out only for plain pages or Next.js App Router, which
+     * follows History API calls itself.
+     */
+    searchParams?: URLSearchParams;
+    setSearchParams?: SetLogsSearchParams;
+    /**
+     * `replace` (default) rewrites the current history entry, so the back button
+     * leaves the page instead of stepping through every filter click. `push`
+     * adds an entry per change.
+     */
+    history?: 'replace' | 'push';
+}
+/** Values and change handlers to spread onto `Logs.Root`. */
+export interface LogsUrlStateProps extends LogsUrlState {
+    onTimeRangeChange: (range: LogTimeRange) => void;
+    onFiltersChange: (filters: LogFilters) => void;
+    onSearchChange: (search: string) => void;
+    onLiveChange: (live: boolean) => void;
+    onSelectedIdChange: (id: string | null) => void;
+}
+/**
+ * Keep `Logs.Root`'s time range, filters, search, live toggle and open row in
+ * the address bar, so a refresh or a shared link reopens the same view.
+ *
+ * ```tsx
+ * const logsState = useLogsUrlState()
+ * const query = buildLogQL({ matchers: logsState.filters, lineContains: logsState.search })
+ * // fetch with query + resolveLogTimeRange(logsState.timeRange)
+ *
+ * <Logs.Root {...logsState} entries={entries} onRefresh={refetch}>
+ *   <Logs.Explorer />
+ * </Logs.Root>
+ * ```
+ *
+ * With React Router, hand it the router's search params instead:
+ *
+ * ```tsx
+ * const [searchParams, setSearchParams] = useSearchParams()
+ * const logsState = useLogsUrlState({ searchParams, setSearchParams })
+ * ```
+ */
+export declare function useLogsUrlState(options?: UseLogsUrlStateOptions): LogsUrlStateProps;
+export {};

package/dist/components/features/logs/index.d.ts

@@ -1,5 +1,8 @@
 export { resolveLogColumns } from './components/columns';
 export { useLogs } from './hooks/use-logs';
+export { useLogsUrlState } from './hooks/use-logs-url-state';
+export type { LogsUrlStateProps, SetLogsSearchParams, UseLogsUrlStateOptions } from './hooks/use-logs-url-state';
 export { Logs } from './logs';
 export type { BuildLogQLOptions, LogColumn, LogColumnCellContext, LogColumnId, LogColumnSize, LogColumnSkeletonContext, LogColumnSpec, LogEntry, LogFacet, LogFacetOption, LogFilters, LogHistogramBucket, LogsContextValue, LogsRootProps, LogTimeRange, LokiQueryRangeResponse, LokiStream, ParsedHttpLogLine, ParsedLogLine, ParsedTextLogLine, } from './types';
-export { buildLogQL, facetsFromEntries, filterEntries, flattenLokiStreams, formatHttpLogLine, histogramFromEntries, httpStatusBadgeType, httpStatusTextClass, lastThirtyMinutes, LOG_TIME_PRESETS, logLineDisplay, logRequestHost, logTimeRangeLabel, logUserAgent, nsToDate, parseLogLine, parseUserAgent, resolveLogTimeRange, searchableLogText, severityBadgeType, splitPathQuery, } from './utils';
+export { buildLogFacetCountQuery, buildLogQL, facetFromLokiCounts, facetsFromEntries, filterEntries, flattenLokiStreams, formatHttpLogLine, histogramFromEntries, httpStatusBadgeType, httpStatusTextClass, lastThirtyMinutes, LOG_TIME_PRESETS, logLineDisplay, logRequestHost, LOGS_URL_KEYS, logTimeRangeLabel, logUserAgent, nsToDate, parseLogLine, parseLogsUrlState, parseUserAgent, resolveLogTimeRange, searchableLogText, severityBadgeType, splitPathQuery, writeLogsUrlState, } from './utils';
+export type { BuildLogFacetCountQueryOptions, LogsUrlState, LogsUrlStateOptions, LokiVectorResponse, LokiVectorSample } from './utils';

package/dist/components/features/logs/utils/facet-counts.d.ts

@@ -0,0 +1,50 @@
+import type { LogFacet, LogFilters, LogTimeRange } from '../types';
+export interface BuildLogFacetCountQueryOptions {
+    /** Label to count values of, e.g. `response_code`. */
+    label: string;
+    /**
+     * Matchers that scope the page, e.g. `{ route_name: ['my-alb'] }`. Leave the
+     * user's facet selections and search out: counting against the scope alone
+     * keeps every option listed, with its total for the window, no matter what
+     * is ticked.
+     */
+    matchers?: LogFilters;
+    /** Window to count over. Its length becomes the range selector. */
+    timeRange: LogTimeRange;
+}
+/**
+ * LogQL that counts log lines per value of one label across a time range:
+ *
+ * ```
+ * sum by (response_code) (count_over_time({route_name="my-alb"}[1800s]))
+ * ```
+ *
+ * Run it as an instant query (`/loki/api/v1/query`) with `time` set to the
+ * range's `to`, then pass the response to `facetFromLokiCounts`. Returns
+ * `null` for a label name LogQL can't express. Works for indexed stream labels
+ * and for structured metadata, which Loki can also group by.
+ */
+export declare function buildLogFacetCountQuery({ label, matchers, timeRange }: BuildLogFacetCountQueryOptions): string | null;
+/** One series of a Loki instant-query (`resultType: 'vector'`) response. */
+export interface LokiVectorSample {
+    metric: Record<string, string>;
+    value: [timestamp: number | string, value: string];
+}
+export interface LokiVectorResponse {
+    status: 'success' | 'error';
+    data?: {
+        resultType: string;
+        result: LokiVectorSample[];
+    };
+    errorType?: string;
+    error?: string;
+}
+/**
+ * Turn the response to a `buildLogFacetCountQuery` query into a facet for
+ * `Logs.Root`. Series without the label (lines that don't carry it) and zero
+ * counts are skipped. Options are ordered the same way as `facetsFromEntries`.
+ * Pass `label` to override the display name.
+ */
+export declare function facetFromLokiCounts(name: string, response: LokiVectorResponse | null | undefined, options?: {
+    label?: string;
+}): LogFacet;

package/dist/components/features/logs/utils/facets.d.ts

@@ -1,4 +1,6 @@
 import type { LogEntry, LogFacet, LogFilters } from '../types';
+export declare function facetLabel(name: string): string;
+export declare function compareFacetValues(name: string, a: string, b: string): number;
 export declare function facetsFromEntries(entries: readonly LogEntry[], names?: readonly string[]): LogFacet[];
 export declare function filterEntries(entries: readonly LogEntry[], filters: LogFilters, search?: string): LogEntry[];
 /**

package/dist/components/features/logs/utils/index.d.ts

@@ -1,5 +1,7 @@
 export { buildLogQL } from './build-logql';
 export { CANONICAL_FACET_NAMES, DEFAULT_LOG_COLUMNS, DEFAULT_LOGQL_MATCHER, FACET_LABELS, SEVERITY_ORDER, } from './constants';
+export { buildLogFacetCountQuery, facetFromLokiCounts } from './facet-counts';
+export type { BuildLogFacetCountQueryOptions, LokiVectorResponse, LokiVectorSample } from './facet-counts';
 export { facetsFromEntries, filterEntries, searchableLogText } from './facets';
 export { flattenLokiStreams, nsToDate } from './flatten-loki';
 export { formatLocalTimestamp, formatLogTimestamp, formatLogTimestampParts, formatRelativeTimestamp, formatUtcTimestamp, } from './format-timestamp';
@@ -8,5 +10,7 @@ export { logRequestHost } from './host';
 export { formatHttpLogLine, logLineDisplay, parseLogLine, splitPathQuery } from './parse-log-line';
 export { httpStatusBadgeType, httpStatusTextClass, severityBadgeType } from './severity';
 export { filtersAreActive, lastThirtyMinutes, LOG_TIME_PRESETS, logTimeRangeLabel, resolveLogTimeRange, } from './time-range';
+export { LOGS_URL_KEYS, logsUrlStateKey, parseLogsUrlState, writeLogsUrlState } from './url-state';
+export type { LogsUrlState, LogsUrlStateOptions } from './url-state';
 export { logUserAgent, parseUserAgent } from './user-agent';
 export type { ParsedUserAgent, UserAgentDevice } from './user-agent';

package/dist/components/features/logs/utils/url-state.d.ts

@@ -0,0 +1,61 @@
+import type { LogFilters, LogTimeRange } from '../types';
+/**
+ * The parts of `Logs.Root` state that belong in the address bar: everything
+ * that decides which logs the host fetches, plus the open row.
+ */
+export interface LogsUrlState {
+    timeRange: LogTimeRange;
+    filters: LogFilters;
+    search: string;
+    live: boolean;
+    selectedId: string | null;
+}
+export interface LogsUrlStateOptions {
+    /**
+     * Prepended to every key, e.g. `logs.` gives `logs.q`, `logs.range`. Use it
+     * when two explorers share a page, or a key clashes with one the app owns.
+     */
+    prefix?: string;
+    /**
+     * Range used when the URL has none, and left out of the URL when chosen.
+     * Defaults to the last 30 minutes.
+     */
+    defaultTimeRange?: LogTimeRange;
+}
+/**
+ * Query-string keys, before `prefix`. A preset range is written as
+ * `range=last-1h`; a hand-picked one as `from` and `to` ISO timestamps. Each
+ * selected facet value is its own `filter=<label>:<value>` entry.
+ */
+export declare const LOGS_URL_KEYS: {
+    readonly search: "q";
+    readonly range: "range";
+    readonly from: "from";
+    readonly to: "to";
+    readonly filter: "filter";
+    readonly live: "live";
+    readonly selected: "log";
+};
+/**
+ * Read logs state from a query string. Missing or malformed values fall back
+ * to the defaults (`Logs.Root`'s own defaults), so a hand-edited or stale link
+ * still opens. A preset range is resolved against `now`.
+ */
+export declare function parseLogsUrlState(input: URLSearchParams | string, options?: LogsUrlStateOptions & {
+    now?: Date;
+}): LogsUrlState;
+/**
+ * Return a copy of `input` with the given parts of logs state written in.
+ * Only the parts present in `state` are touched, and params the app owns are
+ * kept. Defaults (no search, no filters, not live, the default range) are
+ * left out so a fresh explorer has a clean URL.
+ */
+export declare function writeLogsUrlState(input: URLSearchParams | string, state: Partial<LogsUrlState>, options?: LogsUrlStateOptions): URLSearchParams;
+/**
+ * Just this explorer's params, as a query string in a fixed key order. It
+ * parses to the same state as the full query string, and only changes when
+ * one of these params does, so it works as a memo key: an unrelated app param
+ * changing won't re-resolve a preset range (which would hand the host a new
+ * `timeRange` and trigger a refetch).
+ */
+export declare function logsUrlStateKey(input: URLSearchParams | string, options?: Pick<LogsUrlStateOptions, 'prefix'>): string;

package/dist/components/icons/spinner.icon.d.ts

@@ -1,12 +1,26 @@
 import type { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
 declare const spinnerVariants: (props?: ({
     size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export interface SpinnerIconProps extends React.SVGProps<SVGSVGElement>, VariantProps<typeof spinnerVariants> {
-    /** Color of the track (background circle) */
+    /**
+     * Colour of the track (background circle). By default the track is the
+     * indicator colour at low opacity, so recolouring the indicator recolours both.
+     */
     trackClassName?: string;
-    /** Color of the spinning indicator */
+    /** Colour of the spinning indicator */
     indicatorClassName?: string;
 }
-export declare function SpinnerIcon({ size, className, trackClassName, indicatorClassName, ...props }: SpinnerIconProps): import("react").JSX.Element;
+/**
+ * A loading spinner: a faint full-circle track with an arc that fades from a
+ * transparent tail to a solid, rounded head, turning clockwise.
+ *
+ * The rotation runs through Motion as a full `transform` keyframe animation,
+ * which Motion hands to the Web Animations API. That keeps it on the
+ * compositor, so the spinner stays smooth while the main thread is busy doing
+ * whatever the user is waiting for. It keeps spinning under reduced motion:
+ * it is essential loading feedback, not decoration.
+ */
+export declare function SpinnerIcon({ size, className, trackClassName, indicatorClassName, ...props }: SpinnerIconProps): React.JSX.Element;
 export {};