@datum-cloud/datum-ui 3.8.0 → 3.10.0

package/dist/autocomplete/index.mjs

@@ -1 +1 @@
-export { t as Autocomplete } from "../autocomplete-D0zAcT78.mjs";
+export { t as Autocomplete } from "../autocomplete-CrCbO2VS.mjs";

package/dist/{autocomplete-D0zAcT78.mjs → autocomplete-CrCbO2VS.mjs}

@@ -1,6 +1,8 @@
 import { t as cn } from "./utils-CTIuhCOs.mjs";
 import { n as OptionList, t as useOptionPicker } from "./use-option-picker-DXY2SNnT.mjs";
-import { t as ResponsivePopover } from "./responsive-popover-DJYd8lOK.mjs";
+import { t as ResponsivePopover } from "./responsive-popover-B_pUxrZ1.mjs";
+import { n as fieldPlaceholderClassName, r as fieldTriggerClassName, t as fieldIconClassName } from "./field-styles-D-FJatHt.mjs";
+import { t as Icon } from "./icon-wrapper-CIk2th6R.mjs";
 import { t as LoaderOverlay } from "./loader-overlay-DP0pvHuG.mjs";
 import { ChevronDown } from "lucide-react";
 import * as React from "react";
@@ -17,7 +19,7 @@ function Trigger({ ref, selectedOption, createdValue, renderValue, placeholder,
 		children: createdValue
 	});
 	else displayContent = /* @__PURE__ */ jsx("span", {
-		className: "text-muted-foreground",
+		className: cn("truncate", fieldPlaceholderClassName),
 		children: placeholder
 	});
 	return /* @__PURE__ */ jsxs("button", {
@@ -27,7 +29,7 @@ function Trigger({ ref, selectedOption, createdValue, renderValue, placeholder,
 		role: "combobox",
 		"aria-expanded": open,
 		disabled: disabled || loading,
-		className: cn("text-input-foreground placeholder:text-input-placeholder", "border-input-border bg-input-background/50 relative flex h-10 w-full items-center justify-between rounded-lg border px-3 py-2 text-left text-sm transition-all", "focus-visible:border-input-focus-border focus-visible:shadow-(--input-focus-shadow)", "focus-visible:ring-0 focus-visible:ring-offset-0 focus-visible:outline-hidden", "aria-invalid:border-destructive", (disabled || loading) && "cursor-not-allowed opacity-50", className),
+		className: cn(fieldTriggerClassName, "relative h-10 justify-between py-2", (disabled || loading) && "cursor-not-allowed opacity-50", className),
 		...rest,
 		children: [
 			loading && /* @__PURE__ */ jsx(LoaderOverlay, {}),
@@ -35,7 +37,11 @@ function Trigger({ ref, selectedOption, createdValue, renderValue, placeholder,
 				className: "min-w-0 flex-1",
 				children: displayContent
 			}),
-			/* @__PURE__ */ jsx(ChevronDown, { className: "text-muted-foreground ml-2 size-4 shrink-0" })
+			/* @__PURE__ */ jsx(Icon, {
+				icon: ChevronDown,
+				className: fieldIconClassName,
+				"aria-hidden": "true"
+			})
 		]
 	});
 }

package/dist/autosearch/index.mjs

@@ -2,7 +2,7 @@ import { t as cn } from "../utils-CTIuhCOs.mjs";
 import { t as Button } from "../button-Cn4KagBO.mjs";
 import { t as Input } from "../input-DsT5qkJn.mjs";
 import { n as OptionList, t as useOptionPicker } from "../use-option-picker-DXY2SNnT.mjs";
-import { t as ResponsivePopover } from "../responsive-popover-DJYd8lOK.mjs";
+import { t as ResponsivePopover } from "../responsive-popover-B_pUxrZ1.mjs";
 import { t as Tooltip } from "../tooltip-OIySjJWW.mjs";
 import { AlertCircle, Loader2, X } from "lucide-react";
 import * as React from "react";

package/dist/button-group/index.mjs

@@ -1 +1 @@
-export { t as ButtonGroup, n as ButtonGroupSeparator, r as ButtonGroupText, i as buttonGroupVariants } from "../button-group-C3GKo-0p.mjs";
+export { t as ButtonGroup, n as ButtonGroupSeparator, r as ButtonGroupText, i as buttonGroupVariants } from "../button-group-DJ6X1SSj.mjs";

package/dist/{button-group-C3GKo-0p.mjs → button-group-DJ6X1SSj.mjs}

@@ -4,7 +4,7 @@ import { cva } from "class-variance-authority";
 import { jsx } from "react/jsx-runtime";
 import { Slot } from "@radix-ui/react-slot";
 // ../shadcn/ui/button-group.tsx
-const buttonGroupVariants = cva("flex w-fit items-stretch has-[>[data-slot=button-group]]:gap-2 [&>*]:focus-visible:relative [&>*]:focus-visible:z-10 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1", {
+const buttonGroupVariants = cva("flex w-fit items-stretch has-[>[data-slot=button-group]]:gap-2 [&>*]:focus-visible:relative [&>*]:focus-visible:z-10 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-lg [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1", {
 	variants: { orientation: {
 		horizontal: "[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none",
 		vertical: "flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0 [&>*:not(:last-child)]:rounded-b-none"
@@ -22,7 +22,7 @@ function ButtonGroup({ className, orientation, ...props }) {
 }
 function ButtonGroupText({ className, asChild = false, ...props }) {
 	return /* @__PURE__ */ jsx(asChild ? Slot : "div", {
-		className: cn("bg-muted flex items-center gap-2 rounded-md border px-4 text-sm font-medium shadow-xs [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className),
+		className: cn("bg-muted text-muted-foreground border-input-border flex items-center gap-2 rounded-lg border px-3 text-sm font-normal [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className),
 		...props
 	});
 }

package/dist/{calendar-date-picker-CknZM6a2.mjs → calendar-date-picker-BRKs56gR.mjs}

@@ -1,5 +1,5 @@
 import { t as useDeprecationWarning } from "./use-deprecation-warning-BS1V4IS5.mjs";
-import { a as DateRangePicker } from "./picker-DC3GErYg.mjs";
+import { a as DateRangePicker } from "./picker-BHPtncpv.mjs";
 import { jsx } from "react/jsx-runtime";
 // src/components/features/calendar-date-picker/calendar-date-picker.tsx
 /**

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/data-table/index.mjs

@@ -1 +1 @@
-export { v as DEFAULT_DEBOUNCE_MS, y as DEFAULT_LOADING_ROWS, b as DEFAULT_PAGE_SIZE, x as DEFAULT_PAGE_SIZES, t as DataTable, h as DataTableColumnHeader, m as DataTableRowActions, u as createDataTableStore, g as createSelectionColumn, p as dataTableFeatures, d as resolvePath, f as rowMatchesSearch, n as useDataTableFilters, r as useDataTableInlineContents, i as useDataTableLoading, a as useDataTablePagination, o as useDataTableRows, s as useDataTableSearch, c as useDataTableSelection, l as useDataTableSorting, _ as useNuqsAdapter } from "../data-table-CpBwO8Ea.mjs";
+export { v as DEFAULT_DEBOUNCE_MS, y as DEFAULT_LOADING_ROWS, b as DEFAULT_PAGE_SIZE, x as DEFAULT_PAGE_SIZES, t as DataTable, h as DataTableColumnHeader, m as DataTableRowActions, u as createDataTableStore, g as createSelectionColumn, p as dataTableFeatures, d as resolvePath, f as rowMatchesSearch, n as useDataTableFilters, r as useDataTableInlineContents, i as useDataTableLoading, a as useDataTablePagination, o as useDataTableRows, s as useDataTableSearch, c as useDataTableSelection, l as useDataTableSorting, _ as useNuqsAdapter } from "../data-table-DFUnUydN.mjs";

package/dist/{data-table-CpBwO8Ea.mjs → data-table-DFUnUydN.mjs}

@@ -1,17 +1,17 @@
 import { t as Checkbox } from "./checkbox-BAo5sbHk.mjs";
 import { t as cn } from "./utils-CTIuhCOs.mjs";
 import { t as Button } from "./button-Cn4KagBO.mjs";
-import { t as ResponsiveDropdown } from "./responsive-dropdown-DsWgpE_i.mjs";
+import { t as ResponsiveDropdown } from "./responsive-dropdown-B9cDUeHt.mjs";
 import { t as ActionRow } from "./action-row-BEzE9x37.mjs";
 import { Badge } from "./badge/index.mjs";
 import { Skeleton } from "./skeleton/index.mjs";
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "./table/index.mjs";
-import { i as SelectItem, l as SelectTrigger, n as SelectContent, t as Select, u as SelectValue } from "./select-DemYhwnG.mjs";
+import { i as SelectItem, l as SelectTrigger, n as SelectContent, t as Select, u as SelectValue } from "./select-B0Xlz-wD.mjs";
 import { t as Input } from "./input-DsT5qkJn.mjs";
 import { n as useDebouncedSearchInput } from "./use-debounced-search-input-B4u28iLx.mjs";
-import { t as MultiSelect } from "./multi-select-C2cBrqXl.mjs";
-import { t as CalendarDatePicker } from "./calendar-date-picker-CknZM6a2.mjs";
-import { t as Autocomplete } from "./autocomplete-D0zAcT78.mjs";
+import { t as MultiSelect } from "./multi-select-DwcsJdHt.mjs";
+import { t as CalendarDatePicker } from "./calendar-date-picker-BRKs56gR.mjs";
+import { t as Autocomplete } from "./autocomplete-CrCbO2VS.mjs";
 import { ArrowDown, ArrowUp, ArrowUpDown, ChevronLeft, ChevronRight, MoreHorizontal, Search, X } from "lucide-react";
 import { createContext, memo, use, useCallback, useContext, useEffect, useId, useMemo, useRef, useState, useSyncExternalStore } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";

package/dist/date-picker/index.mjs

@@ -1,4 +1,4 @@
-import { M as getBrowserTimezone, N as getTimezoneOffset, j as formatTimezoneLabel } from "../date-time-range-picker-yy1Acntn.mjs";
-import { t as CalendarDatePicker } from "../calendar-date-picker-CknZM6a2.mjs";
-import { _ as getShortTimezoneDisplay, a as TimeRangePicker, b as utcToLocalInputString, c as getPresetByKey, d as TimezoneSelector, f as QuickRangesPanel, g as getDefaultTimezoneOptions, h as formatUtcForDisplay, i as formatTimeRangeDisplay, l as getPresetByShortcut, m as createTimezoneOption, n as formatDateForInput, o as DEFAULT_PRESETS, p as CustomRangePanel, r as formatSingleTimeDisplay, s as getDefaultPreset, t as toApiTimeRange, u as getPresetRange, v as localInputStringToUtc, x as zonedDateToUtcString, y as utcStringToZonedDate } from "../to-api-format-DyImCzCn.mjs";
+import { M as getBrowserTimezone, N as getTimezoneOffset, j as formatTimezoneLabel } from "../date-time-range-picker-CqGGJTLS.mjs";
+import { t as CalendarDatePicker } from "../calendar-date-picker-BRKs56gR.mjs";
+import { _ as getShortTimezoneDisplay, a as TimeRangePicker, b as utcToLocalInputString, c as getPresetByKey, d as TimezoneSelector, f as QuickRangesPanel, g as getDefaultTimezoneOptions, h as formatUtcForDisplay, i as formatTimeRangeDisplay, l as getPresetByShortcut, m as createTimezoneOption, n as formatDateForInput, o as DEFAULT_PRESETS, p as CustomRangePanel, r as formatSingleTimeDisplay, s as getDefaultPreset, t as toApiTimeRange, u as getPresetRange, v as localInputStringToUtc, x as zonedDateToUtcString, y as utcStringToZonedDate } from "../to-api-format-BiWOTFha.mjs";
 export { CustomRangePanel as AbsoluteRangePanel, CustomRangePanel, CalendarDatePicker, DEFAULT_PRESETS, QuickRangesPanel, TimeRangePicker, TimezoneSelector, createTimezoneOption, formatDateForInput, formatSingleTimeDisplay, formatTimeRangeDisplay, formatTimezoneLabel, formatUtcForDisplay, getBrowserTimezone, getDefaultPreset, getDefaultTimezoneOptions, getPresetByKey, getPresetByShortcut, getPresetRange, getShortTimezoneDisplay, getTimezoneOffset, localInputStringToUtc, toApiTimeRange, utcStringToZonedDate, utcToLocalInputString, zonedDateToUtcString };

package/dist/date-time-picker/index.mjs

@@ -1 +1 @@
-export { t as DateTimePicker } from "../date-time-picker-Bc41Ixrs.mjs";
+export { t as DateTimePicker } from "../date-time-picker-BRMm2QSz.mjs";

package/dist/{date-time-picker-Bc41Ixrs.mjs → date-time-picker-BRMm2QSz.mjs}

@@ -1,5 +1,5 @@
 import { t as useDeprecationWarning } from "./use-deprecation-warning-BS1V4IS5.mjs";
-import { r as DateTimePicker$1 } from "./picker-DC3GErYg.mjs";
+import { r as DateTimePicker$1 } from "./picker-BHPtncpv.mjs";
 import { jsx } from "react/jsx-runtime";
 // src/components/features/date-time-picker/date-time-picker.tsx
 /**

package/dist/{date-time-range-picker-yy1Acntn.mjs → date-time-range-picker-CqGGJTLS.mjs}

@@ -1,9 +1,11 @@
 import { Calendar } from "./calendar/index.mjs";
 import { t as cn } from "./utils-CTIuhCOs.mjs";
-import { t as ResponsivePopover } from "./responsive-popover-DJYd8lOK.mjs";
+import { t as ResponsivePopover } from "./responsive-popover-B_pUxrZ1.mjs";
 import { t as Button } from "./button-C57mkFkS.mjs";
-import { t as useBreakpoint } from "./use-breakpoint-zY_JYINK.mjs";
+import { t as useBreakpoint } from "./use-breakpoint-Ce5tS4cU.mjs";
 import { n as OptionList, t as useOptionPicker } from "./use-option-picker-DXY2SNnT.mjs";
+import { r as fieldTriggerClassName, t as fieldIconClassName } from "./field-styles-D-FJatHt.mjs";
+import { t as Icon } from "./icon-wrapper-CIk2th6R.mjs";
 import { t as Button$1 } from "./button-Cn4KagBO.mjs";
 import { CalendarIcon, Clock, Globe, X } from "lucide-react";
 import { createContext, useCallback, useContext, useEffect, useMemo, useReducer, useRef, useState } from "react";
@@ -1272,7 +1274,11 @@ function PickerTimezoneIndicator({ className, variant = "full" }) {
 }
 PickerTimezoneIndicator.displayName = "Picker.TimezoneIndicator";
 // src/components/features/picker/components/trigger.tsx
-const DEFAULT_ICON = /* @__PURE__ */ jsx(CalendarIcon, { className: "text-muted-foreground size-4 shrink-0" });
+const DEFAULT_ICON = /* @__PURE__ */ jsx(Icon, {
+	icon: CalendarIcon,
+	className: fieldIconClassName,
+	"aria-hidden": "true"
+});
 function PickerTrigger({ placeholder = "Pick a date", clearable = false, disabled = false, children, className, triggerClassName, id, icon, onClick, ...slotProps }) {
 	const { state, actions } = usePickerContext();
 	const hasValue = state.pendingValue !== null && state.pendingValue !== void 0;
@@ -1290,12 +1296,12 @@ function PickerTrigger({ placeholder = "Pick a date", clearable = false, disable
 			if (state.open) actions.close();
 			else actions.open();
 		},
-		className: cn("w-full justify-between gap-2 rounded-lg font-normal", triggerClassName, className),
+		className: cn(fieldTriggerClassName, "h-10 justify-between hover:bg-input-background/50 hover:text-input-foreground", triggerClassName, className),
 		...slotProps,
 		children: [/* @__PURE__ */ jsxs("span", {
 			className: "flex flex-1 items-center gap-2 truncate",
 			children: [renderedIcon, /* @__PURE__ */ jsx("span", {
-				className: cn("truncate", !hasValue && "text-muted-foreground"),
+				className: cn("truncate", !hasValue && "text-input-placeholder"),
 				children: hasValue ? children ? children(state.pendingValue) : String(state.pendingValue) : placeholder
 			})]
 		}), clearable && hasValue && /* @__PURE__ */ jsx("button", {
@@ -1305,8 +1311,13 @@ function PickerTrigger({ placeholder = "Pick a date", clearable = false, disable
 				e.stopPropagation();
 				actions.clear();
 			},
-			className: "text-muted-foreground hover:text-destructive shrink-0 rounded-sm p-0.5 transition-colors",
-			children: /* @__PURE__ */ jsx(X, { className: "size-3.5" })
+			className: "text-muted-foreground hover:text-destructive -m-0.5 shrink-0 rounded-sm p-0.5 transition-colors",
+			children: /* @__PURE__ */ jsx(Icon, {
+				icon: X,
+				size: 14,
+				className: "size-3.5! shrink-0",
+				"aria-hidden": "true"
+			})
 		})]
 	});
 }

package/dist/field-styles-D-FJatHt.mjs

@@ -0,0 +1,31 @@
+// src/utils/field-styles.ts
+/**
+* Shared look for every input-like trigger: Select, Autocomplete, MultiSelect
+* and the date/time pickers. They sit next to each other in toolbars and
+* filter rows, so they must line up with `Input` and with each other:
+*
+* - 12px (`px-3`) inline padding, the same as `Input`
+* - `text-sm`, regular weight for both the value and the placeholder
+* - 8px (`gap-2`) between the leading icon, the value and trailing icons
+* - trailing chevrons are 16px and muted, with no extra margin, so the
+*   chevron sits 12px from the right edge on every trigger
+* - clear (X) icons are 14px: lucide's X fills more of its box than the
+*   chevron, so at 16px it looks heavier than the chevron beside it
+*
+* Internal: not part of the public `utils` entry.
+*/
+/** Box, type and focus styles. Height is left to each component. */
+const fieldTriggerClassName = [
+	"flex w-full items-center gap-2 rounded-lg border px-3 text-left text-sm font-normal",
+	"border-input-border bg-input-background/50 text-input-foreground shadow-none",
+	"transition-[color,background-color,border-color,box-shadow] outline-none",
+	"focus-visible:border-input-focus-border focus-visible:shadow-(--input-focus-shadow)",
+	"focus-visible:ring-0 focus-visible:ring-offset-0",
+	"aria-invalid:border-destructive",
+	"disabled:cursor-not-allowed disabled:opacity-50"
+].join(" ");
+/** Placeholder text inside a trigger. Same colour as `Input`'s placeholder. */
+const fieldPlaceholderClassName = "text-input-placeholder";
+/** Leading icons and the trailing chevron. Clear icons use `size-3.5`. */
+const fieldIconClassName = "text-muted-foreground size-4 shrink-0";
+export { fieldPlaceholderClassName as n, fieldTriggerClassName as r, fieldIconClassName as t };

package/dist/form/index.mjs

@@ -1,3 +1,3 @@
-import { A as FormCheckbox, C as FormDialog, D as FormCustom, E as FormDatePicker, M as FormAutosearch, N as FormAutocomplete, O as FormCopyBox, S as FormError, T as FormDateTimePicker, _ as FormRadioGroup, a as useField, b as FormFieldArray, c as useWatchAll, d as FormTextarea, f as FormSwitch, g as FormRoot, h as FormSelectItem, i as useFieldContext, j as FormButton, k as FormCombobox, l as FormTransfer, m as FormSelect, n as useFormState, o as FormWhen, p as FormSubmit, r as useFormContext, s as useWatch, t as Form, u as FormTimePicker, v as FormRadioItem, w as FormDescription, x as FormField, y as FormInput } from "../form-DTaVgDSV.mjs";
+import { A as FormCheckbox, C as FormDialog, D as FormCustom, E as FormDatePicker, M as FormAutosearch, N as FormAutocomplete, O as FormCopyBox, S as FormError, T as FormDateTimePicker, _ as FormRadioGroup, a as useField, b as FormFieldArray, c as useWatchAll, d as FormTextarea, f as FormSwitch, g as FormRoot, h as FormSelectItem, i as useFieldContext, j as FormButton, k as FormCombobox, l as FormTransfer, m as FormSelect, n as useFormState, o as FormWhen, p as FormSubmit, r as useFormContext, s as useWatch, t as Form, u as FormTimePicker, v as FormRadioItem, w as FormDescription, x as FormField, y as FormInput } from "../form-VdbSqDjL.mjs";
 import { n as useAdapter, t as FormAdapterProvider } from "../adapter-context-XT749tyT.mjs";
 export { Form, FormAdapterProvider, FormAutocomplete, FormAutosearch, FormButton, FormCheckbox, FormCombobox, FormCopyBox, FormCustom, FormDatePicker, FormDateTimePicker, FormDescription, FormDialog, FormError, FormField, FormFieldArray, FormInput, FormRadioGroup, FormRadioItem, FormRoot, FormSelect, FormSelectItem, FormSubmit, FormSwitch, FormTextarea, FormTimePicker, FormTransfer, FormWhen, useAdapter, useField, useFieldContext, useFormContext, useFormState, useWatch, useWatchAll };

package/dist/{form-DTaVgDSV.mjs → form-VdbSqDjL.mjs}

@@ -1,5 +1,5 @@
 import { t as cn } from "./utils-CTIuhCOs.mjs";
-import { t as Autocomplete } from "./autocomplete-D0zAcT78.mjs";
+import { t as Autocomplete } from "./autocomplete-CrCbO2VS.mjs";
 import { Autosearch } from "./autosearch/index.mjs";
 import { t as Button } from "./button-Cn4KagBO.mjs";
 import { n as useFormContext$1, t as FormProvider } from "./form-context-BRzt53M5.mjs";
@@ -8,8 +8,8 @@ import { t as Label } from "./label-BR1V3Imy.mjs";
 import { t as toast } from "./toast-CizxCEcK.mjs";
 import { t as useCopyToClipboard } from "./use-copy-to-clipboard-CWKWHLxI.mjs";
 import { t as CopyStateIcon } from "./copy-state-icon-DMvXXsZm.mjs";
-import { t as CalendarDatePicker } from "./calendar-date-picker-CknZM6a2.mjs";
-import { t as DateTimePicker } from "./date-time-picker-Bc41Ixrs.mjs";
+import { t as CalendarDatePicker } from "./calendar-date-picker-BRKs56gR.mjs";
+import { t as DateTimePicker } from "./date-time-picker-BRMm2QSz.mjs";
 import { t as Dialog } from "./dialog-C8RXIQYm.mjs";
 import { t as useControllableState } from "./use-controllable-state-DLeVgbAb.mjs";
 import { t as Tooltip } from "./tooltip-OIySjJWW.mjs";
@@ -18,10 +18,10 @@ import { n as useAdapter } from "./adapter-context-XT749tyT.mjs";
 import { t as Input } from "./input-DsT5qkJn.mjs";
 import { InputWithAddons } from "./input-with-addons/index.mjs";
 import { n as RadioGroupItem, t as RadioGroup } from "./radio-group-Boxi2hm0.mjs";
-import { i as SelectItem, l as SelectTrigger, n as SelectContent, t as Select, u as SelectValue } from "./select-DemYhwnG.mjs";
+import { i as SelectItem, l as SelectTrigger, n as SelectContent, t as Select, u as SelectValue } from "./select-B0Xlz-wD.mjs";
 import { t as Switch } from "./switch-IduVwiPZ.mjs";
 import { t as Textarea } from "./textarea-CvhdK6JY.mjs";
-import { t as TimePicker } from "./time-picker-B_am4eAK.mjs";
+import { t as TimePicker } from "./time-picker-BFwH-Vd3.mjs";
 import { t as Transfer } from "./transfer-DGUeAQUL.mjs";
 import { CircleHelp } from "lucide-react";
 import * as React from "react";

package/dist/grouped-table/index.mjs

@@ -1 +1 @@
-export { t as GroupedTable } from "../grouped-table-Dl6DclbV.mjs";
+export { t as GroupedTable } from "../grouped-table-B4HzLXq6.mjs";

package/dist/{grouped-table-Dl6DclbV.mjs → grouped-table-B4HzLXq6.mjs}

@@ -2,7 +2,7 @@ import { t as cn } from "./utils-CTIuhCOs.mjs";
 import { r as CollapsibleTrigger, t as Collapsible } from "./collapsible-B-KP3JZ-.mjs";
 import { TableBody, TableCell, TableHead, TableHeader, TableRow } from "./table/index.mjs";
 import { t as Icon } from "./icon-wrapper-CIk2th6R.mjs";
-import { f as rowMatchesSearch, g as createSelectionColumn, h as DataTableColumnHeader, m as DataTableRowActions, p as dataTableFeatures } from "./data-table-CpBwO8Ea.mjs";
+import { f as rowMatchesSearch, g as createSelectionColumn, h as DataTableColumnHeader, m as DataTableRowActions, p as dataTableFeatures } from "./data-table-DFUnUydN.mjs";
 import { n as EASE } from "./motion-DOrRbLmy.mjs";
 import { Skeleton } from "./skeleton/index.mjs";
 import { n as useDebouncedSearchInput } from "./use-debounced-search-input-B4u28iLx.mjs";

package/dist/hooks/index.mjs

@@ -1,4 +1,4 @@
-import { t as useBreakpoint } from "../use-breakpoint-zY_JYINK.mjs";
+import { t as useBreakpoint } from "../use-breakpoint-Ce5tS4cU.mjs";
 import { n as useDebouncedSearchInput, t as DEFAULT_SEARCH_DEBOUNCE_MS } from "../use-debounced-search-input-B4u28iLx.mjs";
 import { t as useCopyToClipboard } from "../use-copy-to-clipboard-CWKWHLxI.mjs";
 import { t as useDebounce } from "../hooks-WVJbyhCz.mjs";

package/dist/hooks/use-breakpoint.d.ts

@@ -3,6 +3,11 @@ export type BreakpointTier = 'mobile' | 'tablet' | 'desktop';
  * Returns the current viewport breakpoint tier.
  *
  * Breakpoints: mobile <768px, tablet 768–1023px, desktop ≥1024px.
- * SSR-safe: defaults to 'desktop' on server; client corrects on mount.
+ *
+ * `initial` is the tier the server rendered with. Pass the viewport the server
+ * already knows about (for example a viewport client hint) so the hydration
+ * render matches; without one it defaults to 'desktop'. The client measures on
+ * mount and tracks resizes after that, so the first render stays deterministic
+ * on both sides.
  */
-export declare function useBreakpoint(): BreakpointTier;
+export declare function useBreakpoint(initial?: BreakpointTier): BreakpointTier;