@datum-cloud/datum-ui 3.8.0 → 3.10.0

package/dist/{multi-select-C2cBrqXl.mjs → multi-select-DwcsJdHt.mjs}

@@ -1,8 +1,10 @@
 import { t as cn } from "./utils-CTIuhCOs.mjs";
+import { n as fieldPlaceholderClassName, r as fieldTriggerClassName, t as fieldIconClassName } from "./field-styles-D-FJatHt.mjs";
 import { t as useControllableState } from "./use-controllable-state-DLeVgbAb.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 Separator } from "./separator-DNiiN2BN.mjs";
+import { t as Icon } from "./icon-wrapper-CIk2th6R.mjs";
 import { t as LoaderOverlay } from "./loader-overlay-DP0pvHuG.mjs";
 import { n as useChipMotion, t as MotionBadge } from "./motion-chip-BczV7spP.mjs";
 import { cva } from "class-variance-authority";
@@ -91,9 +93,9 @@ function SelectedBadgeList({ selectedOptions, maxCount, variant, badgeClassName,
 	const overflowCount = maxCount === -1 ? 0 : selectedOptions.length - maxCount;
 	const chipMotion = useChipMotion();
 	return /* @__PURE__ */ jsxs("div", {
-		className: "flex w-full items-center justify-between",
+		className: "flex w-full items-center justify-between gap-2",
 		children: [/* @__PURE__ */ jsx("div", {
-			className: "relative flex flex-wrap items-center gap-2",
+			className: "relative flex min-w-0 flex-wrap items-center gap-2",
 			children: /* @__PURE__ */ jsxs(AnimatePresence, {
 				initial: false,
 				mode: "popLayout",
@@ -120,7 +122,9 @@ function SelectedBadgeList({ selectedOptions, maxCount, variant, badgeClassName,
 								label: `Remove ${option.label}`,
 								onActivate: () => onRemove(option.value),
 								className: "text-muted-foreground ml-1",
-								children: /* @__PURE__ */ jsx(XCircle, {
+								children: /* @__PURE__ */ jsx(Icon, {
+									icon: XCircle,
+									size: 12,
 									className: "size-3",
 									"aria-hidden": "true"
 								})
@@ -135,7 +139,9 @@ function SelectedBadgeList({ selectedOptions, maxCount, variant, badgeClassName,
 						label: "Clear extra selected",
 						onActivate: onClearExtra,
 						className: "text-muted-foreground ml-1",
-						children: /* @__PURE__ */ jsx(XCircle, {
+						children: /* @__PURE__ */ jsx(Icon, {
+							icon: XCircle,
+							size: 12,
 							className: "size-3",
 							"aria-hidden": "true"
 						})
@@ -143,23 +149,26 @@ function SelectedBadgeList({ selectedOptions, maxCount, variant, badgeClassName,
 				}, "overflow")]
 			})
 		}), /* @__PURE__ */ jsxs("div", {
-			className: "flex items-center justify-between",
+			className: "flex shrink-0 items-center gap-2",
 			children: [
 				/* @__PURE__ */ jsx(IconAction, {
 					label: "Clear all",
 					onActivate: onClearAll,
-					className: "text-muted-foreground mx-2",
-					children: /* @__PURE__ */ jsx(XIcon, {
-						className: "h-4",
+					className: "text-muted-foreground hover:text-foreground rounded-sm",
+					children: /* @__PURE__ */ jsx(Icon, {
+						icon: XIcon,
+						size: 14,
+						className: "size-3.5 shrink-0",
 						"aria-hidden": "true"
 					})
 				}),
 				/* @__PURE__ */ jsx("span", {
-					className: "bg-border flex h-full min-h-6 w-px",
+					className: "bg-border h-4 w-px",
 					"aria-hidden": "true"
 				}),
-				/* @__PURE__ */ jsx(ChevronDown, {
-					className: "text-muted-foreground mx-2 h-4",
+				/* @__PURE__ */ jsx(Icon, {
+					icon: ChevronDown,
+					className: fieldIconClassName,
 					"aria-hidden": "true"
 				})
 			]
@@ -238,6 +247,7 @@ function MultiSelect({ options, onValueChange, variant, defaultValue = EMPTY_ARR
 			]
 		})]
 	})] }) : void 0;
+	const showBadges = hasSelection && !isLoading && options.length > 0;
 	const triggerJSX = /* @__PURE__ */ jsxs("button", {
 		...rest,
 		type: "button",
@@ -247,8 +257,8 @@ function MultiSelect({ options, onValueChange, variant, defaultValue = EMPTY_ARR
 			onTriggerClick?.(event);
 			setIsPopoverOpen((prev) => !prev);
 		},
-		className: cn("text-input-foreground placeholder:text-input-placeholder", "border-input-border bg-input-background/50 relative flex min-h-10 w-full items-center justify-between rounded-lg border px-2 py-1 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", (disabled || isLoading) && "cursor-not-allowed opacity-50", className),
-		children: [hasSelection && !isLoading && options.length > 0 ? /* @__PURE__ */ jsx(SelectedBadgeList, {
+		className: cn(fieldTriggerClassName, "relative min-h-10 justify-between py-1", (disabled || isLoading) && "cursor-not-allowed opacity-50", className),
+		children: [showBadges ? /* @__PURE__ */ jsx(SelectedBadgeList, {
 			selectedOptions,
 			maxCount,
 			variant,
@@ -260,16 +270,14 @@ function MultiSelect({ options, onValueChange, variant, defaultValue = EMPTY_ARR
 			onClearExtra: clearExtraOptions,
 			onClearAll: handleClear,
 			onBadgeClick
-		}) : /* @__PURE__ */ jsxs("div", {
-			className: "flex w-full items-center justify-between px-2",
-			children: [/* @__PURE__ */ jsx("span", {
-				className: "text-muted-foreground text-sm",
-				children: placeholder
-			}), /* @__PURE__ */ jsx(ChevronDown, {
-				className: "text-muted-foreground mx-1 h-4",
-				"aria-hidden": "true"
-			})]
-		}), isLoading && /* @__PURE__ */ jsx(LoaderOverlay, { className: "rounded-lg" })]
+		}) : /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("span", {
+			className: cn("min-w-0 flex-1 truncate", fieldPlaceholderClassName),
+			children: placeholder
+		}), /* @__PURE__ */ jsx(Icon, {
+			icon: ChevronDown,
+			className: fieldIconClassName,
+			"aria-hidden": "true"
+		})] }), isLoading && /* @__PURE__ */ jsx(LoaderOverlay, { className: "rounded-lg" })]
 	});
 	return /* @__PURE__ */ jsxs(Fragment$1, { children: [
 		/* @__PURE__ */ jsx(ResponsivePopover, {

package/dist/picker/index.mjs

@@ -1,3 +1,3 @@
-import { A as formatInTimezone, B as isDateBearingMode, C as PickerClear, D as PickerCalendar, E as PickerContent, F as zonedDateToIso, H as isTimeBearingMode, I as ALLOWED_STEPS, L as DATE_BEARING_MODES, M as getBrowserTimezone, N as getTimezoneOffset, O as PickerContext, P as isoToZonedDate, R as RANGE_MODES, S as PickerCancel, T as PickerReset, V as isRangeMode, _ as parseTimeString, a as PickerTimezoneIndicator, b as PickerPresets, d as DATE_PRESETS, f as getDefaultPresets, g as isValidTimeString, h as formatTimeLabel, i as PickerTrigger, j as formatTimezoneLabel, k as usePickerContext, l as usePresets, m as dateToYYYYMMDD, o as PickerTimeInput, p as usePickerState, r as formatPickerValue, s as useTimeSlots, t as DateTimeRangePicker, u as DATETIME_PRESETS, v as resolveCommit, w as PickerFooter, x as PickerApply, y as useKeyboardShortcuts, z as TIME_BEARING_MODES } from "../date-time-range-picker-yy1Acntn.mjs";
-import { a as DateRangePicker, c as getDaysDifference, d as isSameDateRange, f as isSameStringRange, i as DateRangeTimePicker, l as isRangeValid, m as PickerTimezoneSelect, n as TimePicker, o as DatePicker, p as Picker, r as DateTimePicker, s as clampRange, t as TimeRangePicker, u as isSameDate } from "../picker-DC3GErYg.mjs";
+import { A as formatInTimezone, B as isDateBearingMode, C as PickerClear, D as PickerCalendar, E as PickerContent, F as zonedDateToIso, H as isTimeBearingMode, I as ALLOWED_STEPS, L as DATE_BEARING_MODES, M as getBrowserTimezone, N as getTimezoneOffset, O as PickerContext, P as isoToZonedDate, R as RANGE_MODES, S as PickerCancel, T as PickerReset, V as isRangeMode, _ as parseTimeString, a as PickerTimezoneIndicator, b as PickerPresets, d as DATE_PRESETS, f as getDefaultPresets, g as isValidTimeString, h as formatTimeLabel, i as PickerTrigger, j as formatTimezoneLabel, k as usePickerContext, l as usePresets, m as dateToYYYYMMDD, o as PickerTimeInput, p as usePickerState, r as formatPickerValue, s as useTimeSlots, t as DateTimeRangePicker, u as DATETIME_PRESETS, v as resolveCommit, w as PickerFooter, x as PickerApply, y as useKeyboardShortcuts, z as TIME_BEARING_MODES } from "../date-time-range-picker-CqGGJTLS.mjs";
+import { a as DateRangePicker, c as getDaysDifference, d as isSameDateRange, f as isSameStringRange, i as DateRangeTimePicker, l as isRangeValid, m as PickerTimezoneSelect, n as TimePicker, o as DatePicker, p as Picker, r as DateTimePicker, s as clampRange, t as TimeRangePicker, u as isSameDate } from "../picker-BHPtncpv.mjs";
 export { ALLOWED_STEPS, DATETIME_PRESETS, DATE_BEARING_MODES, DATE_PRESETS, DatePicker, DateRangePicker, DateRangeTimePicker, DateTimePicker, DateTimeRangePicker, Picker, PickerApply, PickerCalendar, PickerCancel, PickerClear, PickerContent, PickerContext, PickerFooter, PickerPresets, PickerReset, PickerTimeInput, PickerTimezoneIndicator, PickerTimezoneSelect, PickerTrigger, RANGE_MODES, TIME_BEARING_MODES, TimePicker, TimeRangePicker, clampRange, dateToYYYYMMDD, formatInTimezone, formatPickerValue, formatTimeLabel, formatTimezoneLabel, getBrowserTimezone, getDaysDifference, getDefaultPresets, getTimezoneOffset, isDateBearingMode, isRangeMode, isRangeValid, isSameDate, isSameDateRange, isSameStringRange, isTimeBearingMode, isValidTimeString, isoToZonedDate, parseTimeString, resolveCommit, useKeyboardShortcuts, usePickerContext, usePickerState, usePresets, useTimeSlots, zonedDateToIso };

package/dist/{picker-DC3GErYg.mjs → picker-BHPtncpv.mjs}

@@ -1,6 +1,6 @@
 import { t as cn } from "./utils-CTIuhCOs.mjs";
-import { i as SelectItem, l as SelectTrigger, n as SelectContent, t as Select, u as SelectValue } from "./select-jgK6wyXj.mjs";
-import { C as PickerClear, D as PickerCalendar, E as PickerContent, F as zonedDateToIso, H as isTimeBearingMode, P as isoToZonedDate, S as PickerCancel, T as PickerReset, _ as parseTimeString, a as PickerTimezoneIndicator, b as PickerPresets, c as Picker$1, i as PickerTrigger, k as usePickerContext, n as DefaultFooter, o as PickerTimeInput, r as formatPickerValue, w as PickerFooter, x as PickerApply } from "./date-time-range-picker-yy1Acntn.mjs";
+import { i as SelectItem, l as SelectTrigger, n as SelectContent, t as Select, u as SelectValue } from "./select-CGsHf70u.mjs";
+import { C as PickerClear, D as PickerCalendar, E as PickerContent, F as zonedDateToIso, H as isTimeBearingMode, P as isoToZonedDate, S as PickerCancel, T as PickerReset, _ as parseTimeString, a as PickerTimezoneIndicator, b as PickerPresets, c as Picker$1, i as PickerTrigger, k as usePickerContext, n as DefaultFooter, o as PickerTimeInput, r as formatPickerValue, w as PickerFooter, x as PickerApply } from "./date-time-range-picker-CqGGJTLS.mjs";
 import { Clock, Globe } from "lucide-react";
 import { useEffect, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/responsive-dropdown/index.mjs

@@ -1 +1 @@
-export { t as ResponsiveDropdown } from "../responsive-dropdown-DsWgpE_i.mjs";
+export { t as ResponsiveDropdown } from "../responsive-dropdown-B9cDUeHt.mjs";

package/dist/{responsive-dropdown-DsWgpE_i.mjs → responsive-dropdown-B9cDUeHt.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 { t as cn } from "./utils-CTIuhCOs.mjs";
 import { i as useInSheet, t as ResponsiveSheetTrigger } from "./mobile-sheet-1995HYY_.mjs";
 import { i as PopoverTrigger, r as PopoverContent, t as Popover } from "./popover-7YxyP_W0.mjs";

package/dist/responsive-popover/index.mjs

@@ -1 +1 @@
-export { t as ResponsivePopover } from "../responsive-popover-DJYd8lOK.mjs";
+export { t as ResponsivePopover } from "../responsive-popover-B_pUxrZ1.mjs";

package/dist/{responsive-popover-DJYd8lOK.mjs → responsive-popover-B_pUxrZ1.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 { t as cn } from "./utils-CTIuhCOs.mjs";
 import { i as useInSheet, t as ResponsiveSheetTrigger } from "./mobile-sheet-1995HYY_.mjs";
 import { i as PopoverTrigger, r as PopoverContent, t as Popover } from "./popover-7YxyP_W0.mjs";

package/dist/rich-text-editor/index.mjs

@@ -1,3 +1,3 @@
 import { t as RichTextContent } from "../rich-text-content-BiIIowBU.mjs";
-import { n as useRichTextEditor, t as RichTextEditor } from "../rich-text-editor-BUz06s-b.mjs";
+import { n as useRichTextEditor, t as RichTextEditor } from "../rich-text-editor-CPd_6vdZ.mjs";
 export { RichTextContent, RichTextEditor, useRichTextEditor };

package/dist/{rich-text-editor-BUz06s-b.mjs → rich-text-editor-CPd_6vdZ.mjs}

@@ -2,7 +2,7 @@ import { t as cn } from "./utils-CTIuhCOs.mjs";
 import { t as Tooltip } from "./tooltip-OIySjJWW.mjs";
 import { t as Button } from "./button-Cn4KagBO.mjs";
 import { t as Input } from "./input-DsT5qkJn.mjs";
-import { t as ResponsivePopover } from "./responsive-popover-DJYd8lOK.mjs";
+import { t as ResponsivePopover } from "./responsive-popover-B_pUxrZ1.mjs";
 import { t as Icon } from "./icon-wrapper-CIk2th6R.mjs";
 import { BoldIcon, ItalicIcon, LinkIcon, StrikethroughIcon, UnderlineIcon, UnlinkIcon } from "lucide-react";
 import { createContext, use, useCallback, useEffect, useState } from "react";

package/dist/select/index.mjs

@@ -1 +1 @@
-export { t as Select, n as SelectContent, r as SelectGroup, i as SelectItem, a as SelectLabel, o as SelectScrollDownButton, s as SelectScrollUpButton, c as SelectSeparator, l as SelectTrigger, u as SelectValue } from "../select-DemYhwnG.mjs";
+export { t as Select, n as SelectContent, r as SelectGroup, i as SelectItem, a as SelectLabel, o as SelectScrollDownButton, s as SelectScrollUpButton, c as SelectSeparator, l as SelectTrigger, u as SelectValue } from "../select-B0Xlz-wD.mjs";

package/dist/{select-DemYhwnG.mjs → select-B0Xlz-wD.mjs}

@@ -1,5 +1,6 @@
-import { a as SelectLabel$1, c as SelectSeparator$1, i as SelectItem$1, l as SelectTrigger$1, n as SelectContent$1, o as SelectScrollDownButton$1, r as SelectGroup$1, s as SelectScrollUpButton$1, t as Select$1, u as SelectValue$1 } from "./select-jgK6wyXj.mjs";
+import { a as SelectLabel$1, c as SelectSeparator$1, i as SelectItem$1, l as SelectTrigger$1, n as SelectContent$1, o as SelectScrollDownButton$1, r as SelectGroup$1, s as SelectScrollUpButton$1, t as Select$1, u as SelectValue$1 } from "./select-CGsHf70u.mjs";
 import { t as cn } from "./utils-CTIuhCOs.mjs";
+import { r as fieldTriggerClassName } from "./field-styles-D-FJatHt.mjs";
 import "react";
 import { jsx } from "react/jsx-runtime";
 // src/components/base/select/select.tsx
@@ -16,7 +17,7 @@ SelectGroup.displayName = "SelectGroup";
 function SelectTrigger({ ref, className, ...props }) {
 	return /* @__PURE__ */ jsx(SelectTrigger$1, {
 		ref,
-		className: cn("rounded-lg", "bg-input-background/50", "text-input-foreground", "border-input-border", "placeholder:text-input-placeholder", "shadow-none", "focus-visible:ring-0 focus-visible:ring-offset-0", "focus-visible:border-input-focus-border", "focus-visible:shadow-(--input-focus-shadow)", "aria-invalid:border-destructive", className),
+		className: cn(fieldTriggerClassName, "data-[placeholder]:text-input-placeholder", className),
 		...props
 	});
 }

package/dist/{select-jgK6wyXj.mjs → select-CGsHf70u.mjs}

@@ -25,11 +25,16 @@ function SelectValue({ ...props }) {
 function SelectTrigger({ className, children, ...props }) {
 	return /* @__PURE__ */ jsxs(SelectPrimitive.Trigger, {
 		"data-slot": "select-trigger",
-		className: cn("border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive rounded-md border bg-transparent py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", "flex h-auto min-h-10 w-full items-center justify-between px-3 text-sm font-medium", className),
+		className: cn("border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive rounded-md border bg-transparent py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", "flex h-auto min-h-10 w-full items-center justify-between gap-2 px-3 text-sm font-normal", className),
 		...props,
 		children: [children, /* @__PURE__ */ jsx(SelectPrimitive.Icon, {
 			asChild: true,
-			children: /* @__PURE__ */ jsx(ChevronDownIcon, { className: "size-4 opacity-50" })
+			children: /* @__PURE__ */ jsx(ChevronDownIcon, {
+				className: "text-muted-foreground size-4 shrink-0",
+				size: 16,
+				strokeWidth: 1,
+				absoluteStrokeWidth: true
+			})
 		})]
 	});
 }

package/dist/task-queue/index.mjs

@@ -1 +1 @@
-export { v as LocalTaskStorage, _ as RedisTaskStorage, i as TaskPanel, s as TaskPanelActions, o as TaskPanelCounter, c as TaskPanelHeader, a as TaskPanelItem, h as TaskQueue, t as TaskQueueDropdown, m as TaskQueueProvider, r as TaskQueueTrigger, n as TaskSummaryDialog, y as createOrgMetadata, b as createProjectMetadata, x as createUserMetadata, g as detectStorage, l as getContextLabel, u as matchesCurrentScope, d as useCurrentScope, p as useTaskQueue, f as useTasksWithLabels } from "../task-queue-dropdown-DuCAAybs.mjs";
+export { v as LocalTaskStorage, _ as RedisTaskStorage, i as TaskPanel, s as TaskPanelActions, o as TaskPanelCounter, c as TaskPanelHeader, a as TaskPanelItem, h as TaskQueue, t as TaskQueueDropdown, m as TaskQueueProvider, r as TaskQueueTrigger, n as TaskSummaryDialog, y as createOrgMetadata, b as createProjectMetadata, x as createUserMetadata, g as detectStorage, l as getContextLabel, u as matchesCurrentScope, d as useCurrentScope, p as useTaskQueue, f as useTasksWithLabels } from "../task-queue-dropdown-BflEFiMi.mjs";

package/dist/{task-queue-dropdown-DuCAAybs.mjs → task-queue-dropdown-BflEFiMi.mjs}

@@ -4,7 +4,7 @@ import { t as SpinnerIcon } from "./spinner.icon-BiUnMAxw.mjs";
 import { t as Button } from "./button-Cn4KagBO.mjs";
 import { t as Icon } from "./icon-wrapper-CIk2th6R.mjs";
 import { t as Dialog } from "./dialog-C8RXIQYm.mjs";
-import { t as ResponsiveDropdown } from "./responsive-dropdown-DsWgpE_i.mjs";
+import { t as ResponsiveDropdown } from "./responsive-dropdown-B9cDUeHt.mjs";
 import { a as TooltipTrigger, n as Tooltip, r as TooltipContent, t as Tooltip$1 } from "./tooltip-OIySjJWW.mjs";
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "./table/index.mjs";
 import { Ban, CheckCircle2, CircleAlert, CircleCheck, CornerDownRightIcon, FileIcon, ListTodo, X, XCircle } from "lucide-react";

package/dist/time-picker/index.mjs

@@ -1 +1 @@
-export { t as TimePicker } from "../time-picker-B_am4eAK.mjs";
+export { t as TimePicker } from "../time-picker-BFwH-Vd3.mjs";

package/dist/{time-picker-B_am4eAK.mjs → time-picker-BFwH-Vd3.mjs}

@@ -1,5 +1,5 @@
 import { t as useDeprecationWarning } from "./use-deprecation-warning-BS1V4IS5.mjs";
-import { n as TimePicker$1 } from "./picker-DC3GErYg.mjs";
+import { n as TimePicker$1 } from "./picker-BHPtncpv.mjs";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 // src/components/features/time-picker/time-picker.tsx
 const STEP_VALUES = [

package/dist/{to-api-format-DyImCzCn.mjs → to-api-format-BiWOTFha.mjs}

@@ -2,9 +2,9 @@ import { t as cn } from "./utils-CTIuhCOs.mjs";
 import { t as Button } from "./button-Cn4KagBO.mjs";
 import { Calendar } from "./calendar/index.mjs";
 import { t as Input } from "./input-DsT5qkJn.mjs";
-import { t as ResponsivePopover } from "./responsive-popover-DJYd8lOK.mjs";
-import { i as SelectItem, l as SelectTrigger, n as SelectContent, t as Select, u as SelectValue } from "./select-DemYhwnG.mjs";
-import { F as zonedDateToIso, M as getBrowserTimezone, N as getTimezoneOffset, P as isoToZonedDate, U as endOfDayInTz, W as startOfDayInTz, j as formatTimezoneLabel, t as DateTimeRangePicker } from "./date-time-range-picker-yy1Acntn.mjs";
+import { t as ResponsivePopover } from "./responsive-popover-B_pUxrZ1.mjs";
+import { i as SelectItem, l as SelectTrigger, n as SelectContent, t as Select, u as SelectValue } from "./select-B0Xlz-wD.mjs";
+import { F as zonedDateToIso, M as getBrowserTimezone, N as getTimezoneOffset, P as isoToZonedDate, U as endOfDayInTz, W as startOfDayInTz, j as formatTimezoneLabel, t as DateTimeRangePicker } from "./date-time-range-picker-CqGGJTLS.mjs";
 import { t as useDeprecationWarning } from "./use-deprecation-warning-BS1V4IS5.mjs";
 import { CalendarIcon, Globe } from "lucide-react";
 import { useCallback, useEffect, useId, useRef, useState } from "react";

package/dist/{use-breakpoint-zY_JYINK.mjs → use-breakpoint-Ce5tS4cU.mjs}

@@ -13,16 +13,22 @@ function getBreakpoint() {
 * 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.
 */
-function useBreakpoint() {
-	const [breakpoint, setBreakpoint] = useState(getBreakpoint);
+function useBreakpoint(initial = "desktop") {
+	const [breakpoint, setBreakpoint] = useState(initial);
 	useEffect(() => {
-		const mqTablet = window.matchMedia(`(min-width: ${TABLET_MIN}px)`);
-		const mqDesktop = window.matchMedia(`(min-width: ${DESKTOP_MIN}px)`);
 		const update = () => {
 			setBreakpoint(getBreakpoint());
 		};
+		update();
+		const mqTablet = window.matchMedia(`(min-width: ${TABLET_MIN}px)`);
+		const mqDesktop = window.matchMedia(`(min-width: ${DESKTOP_MIN}px)`);
 		mqTablet.addEventListener("change", update);
 		mqDesktop.addEventListener("change", update);
 		return () => {

package/dist/utils/field-styles.d.ts

@@ -0,0 +1,21 @@
+/**
+ * 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. */
+export declare const fieldTriggerClassName: string;
+/** Placeholder text inside a trigger. Same colour as `Input`'s placeholder. */
+export declare const fieldPlaceholderClassName = "text-input-placeholder";
+/** Leading icons and the trailing chevron. Clear icons use `size-3.5`. */
+export declare const fieldIconClassName = "text-muted-foreground size-4 shrink-0";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@datum-cloud/datum-ui",
   "type": "module",
-  "version": "3.8.0",
+  "version": "3.10.0",
   "license": "MIT",
   "repository": {
     "url": "https://github.com/datum-cloud/datum-ui"