@pos-360/horizon 0.28.1 → 0.29.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{chunk-QJMRQP66.mjs → chunk-PXBJSQUY.mjs} +480 -13
- package/dist/chunk-PXBJSQUY.mjs.map +1 -0
- package/dist/{chunk-JI2LA5FH.js → chunk-TINY76JI.js} +480 -11
- package/dist/chunk-TINY76JI.js.map +1 -0
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +112 -104
- package/dist/index.mjs +1 -1
- package/dist/primitives.d.mts +171 -119
- package/dist/primitives.d.ts +171 -119
- package/dist/primitives.js +112 -104
- package/dist/primitives.mjs +1 -1
- package/package.json +1 -1
- package/dist/chunk-JI2LA5FH.js.map +0 -1
- package/dist/chunk-QJMRQP66.mjs.map +0 -1
|
@@ -2152,16 +2152,16 @@ function TimeInput({
|
|
|
2152
2152
|
setEditValue(raw);
|
|
2153
2153
|
return;
|
|
2154
2154
|
}
|
|
2155
|
+
if (raw.length === 1) {
|
|
2156
|
+
setEditValue(raw);
|
|
2157
|
+
return;
|
|
2158
|
+
}
|
|
2155
2159
|
const parsed = parseInt(raw, 10);
|
|
2156
2160
|
const clamped = clamp(parsed, min, max);
|
|
2157
|
-
|
|
2158
|
-
|
|
2159
|
-
|
|
2160
|
-
|
|
2161
|
-
onChange(clamped);
|
|
2162
|
-
setEditValue(null);
|
|
2163
|
-
onComplete?.();
|
|
2164
|
-
}
|
|
2161
|
+
committedRef.current = true;
|
|
2162
|
+
onChange(clamped);
|
|
2163
|
+
setEditValue(null);
|
|
2164
|
+
onComplete?.();
|
|
2165
2165
|
};
|
|
2166
2166
|
const commit = () => {
|
|
2167
2167
|
if (committedRef.current) {
|
|
@@ -2280,7 +2280,7 @@ function TimeField({
|
|
|
2280
2280
|
const focusMinute = () => {
|
|
2281
2281
|
minuteInputRef.current?.focus();
|
|
2282
2282
|
};
|
|
2283
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
|
|
2283
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 justify-between", children: [
|
|
2284
2284
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2285
2285
|
"span",
|
|
2286
2286
|
{
|
|
@@ -2339,6 +2339,80 @@ function TimeField({
|
|
|
2339
2339
|
] })
|
|
2340
2340
|
] });
|
|
2341
2341
|
}
|
|
2342
|
+
function TimePickerColumn({ value, onChange, disabled = false }) {
|
|
2343
|
+
const toHourRef = React10__namespace.useRef(null);
|
|
2344
|
+
const fromSet = isTimeSet(value.from);
|
|
2345
|
+
const toSet = isTimeSet(value.to);
|
|
2346
|
+
const bothSet = fromSet && toSet;
|
|
2347
|
+
const fromMinutes = (value.from.hour ?? 0) * 60 + (value.from.minute ?? 0);
|
|
2348
|
+
const toMinutes = (value.to.hour ?? 0) * 60 + (value.to.minute ?? 0);
|
|
2349
|
+
const bothEqual = fromMinutes === toMinutes;
|
|
2350
|
+
const isOvernight = bothSet && toMinutes < fromMinutes;
|
|
2351
|
+
const durationMinutes = bothSet && !bothEqual ? isOvernight ? 24 * 60 - fromMinutes + toMinutes : toMinutes - fromMinutes : 0;
|
|
2352
|
+
const durationHours = Math.floor(durationMinutes / 60);
|
|
2353
|
+
const durationRemaining = durationMinutes % 60;
|
|
2354
|
+
const showDuration = bothSet && !bothEqual;
|
|
2355
|
+
const durationLabel = durationRemaining > 0 ? `${durationHours}h ${durationRemaining}m window${isOvernight ? " (overnight)" : ""}` : `${durationHours}h window${isOvernight ? " (overnight)" : ""}`;
|
|
2356
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2357
|
+
"div",
|
|
2358
|
+
{
|
|
2359
|
+
className: chunk23BJPJOK_js.cn(
|
|
2360
|
+
"flex flex-col px-2 pt-2 pb-2 gap-1",
|
|
2361
|
+
"border-t border-gray-100 dark:border-neutral-700"
|
|
2362
|
+
),
|
|
2363
|
+
children: [
|
|
2364
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
|
|
2365
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2366
|
+
lucideReact.Clock,
|
|
2367
|
+
{
|
|
2368
|
+
className: chunk23BJPJOK_js.cn(
|
|
2369
|
+
"w-4 h-4 shrink-0",
|
|
2370
|
+
disabled ? "text-gray-300 dark:text-gray-600" : "text-gray-400 dark:text-gray-500"
|
|
2371
|
+
)
|
|
2372
|
+
}
|
|
2373
|
+
),
|
|
2374
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2375
|
+
"span",
|
|
2376
|
+
{
|
|
2377
|
+
className: chunk23BJPJOK_js.cn(
|
|
2378
|
+
"text-xs font-semibold uppercase tracking-wider",
|
|
2379
|
+
disabled ? "text-gray-300 dark:text-gray-600" : "text-gray-400 dark:text-gray-500"
|
|
2380
|
+
),
|
|
2381
|
+
children: "Time"
|
|
2382
|
+
}
|
|
2383
|
+
),
|
|
2384
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[9px] font-medium text-gray-400 dark:text-gray-600 tracking-wide", children: "(Optional)" })
|
|
2385
|
+
] }),
|
|
2386
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 pl-6", children: [
|
|
2387
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2388
|
+
TimeField,
|
|
2389
|
+
{
|
|
2390
|
+
label: "From",
|
|
2391
|
+
value: value.from,
|
|
2392
|
+
onChange: (from) => onChange({ ...value, from }),
|
|
2393
|
+
onMinuteComplete: () => toHourRef.current?.focus(),
|
|
2394
|
+
disabled
|
|
2395
|
+
}
|
|
2396
|
+
),
|
|
2397
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2398
|
+
TimeField,
|
|
2399
|
+
{
|
|
2400
|
+
label: "To",
|
|
2401
|
+
value: value.to,
|
|
2402
|
+
onChange: (to) => onChange({ ...value, to }),
|
|
2403
|
+
hourRef: toHourRef,
|
|
2404
|
+
disabled
|
|
2405
|
+
}
|
|
2406
|
+
),
|
|
2407
|
+
showDuration && /* @__PURE__ */ jsxRuntime.jsx("span", { className: chunk23BJPJOK_js.cn(
|
|
2408
|
+
"text-[10px] font-medium",
|
|
2409
|
+
isOvernight ? "text-amber-500 dark:text-amber-400" : "text-gray-400 dark:text-gray-500"
|
|
2410
|
+
), children: durationLabel })
|
|
2411
|
+
] })
|
|
2412
|
+
]
|
|
2413
|
+
}
|
|
2414
|
+
);
|
|
2415
|
+
}
|
|
2342
2416
|
function TimePickerRow({ value, onChange, disabled = false }) {
|
|
2343
2417
|
const toHourRef = React10__namespace.useRef(null);
|
|
2344
2418
|
const fromSet = isTimeSet(value.from);
|
|
@@ -2805,6 +2879,399 @@ function DateRangePicker({
|
|
|
2805
2879
|
] }) })
|
|
2806
2880
|
] });
|
|
2807
2881
|
}
|
|
2882
|
+
function formatTime2(tv) {
|
|
2883
|
+
if (tv.hour === null || tv.minute === null) return "";
|
|
2884
|
+
const period = tv.hour >= 12 ? "PM" : "AM";
|
|
2885
|
+
const h = tv.hour % 12 || 12;
|
|
2886
|
+
const m = tv.minute.toString().padStart(2, "0");
|
|
2887
|
+
return `${h}:${m} ${period}`;
|
|
2888
|
+
}
|
|
2889
|
+
function formatDateWithTime(date, dateFmt, time) {
|
|
2890
|
+
const dateStr = dateFns.format(date, dateFmt);
|
|
2891
|
+
const timeStr = time ? formatTime2(time) : "";
|
|
2892
|
+
return timeStr ? `${dateStr}, ${timeStr}` : dateStr;
|
|
2893
|
+
}
|
|
2894
|
+
function formatDateRange2(range, placeholder, time) {
|
|
2895
|
+
if (!range?.from) return placeholder;
|
|
2896
|
+
const hasTime = time && time.from.hour !== null && time.to.hour !== null;
|
|
2897
|
+
if (!range.to || dateFns.isSameDay(range.from, range.to)) {
|
|
2898
|
+
return formatDateWithTime(range.from, "MMMM d, yyyy", hasTime ? time.from : void 0);
|
|
2899
|
+
}
|
|
2900
|
+
const sameYear = range.from.getFullYear() === range.to.getFullYear();
|
|
2901
|
+
const fromFmt = sameYear ? "MMMM d" : "MMMM d, yyyy";
|
|
2902
|
+
const fromStr = formatDateWithTime(range.from, fromFmt, hasTime ? time.from : void 0);
|
|
2903
|
+
const toStr = formatDateWithTime(range.to, "MMMM d, yyyy", hasTime ? time.to : void 0);
|
|
2904
|
+
return `${fromStr} \u2013 ${toStr}`;
|
|
2905
|
+
}
|
|
2906
|
+
function DateRangePickerMobile({
|
|
2907
|
+
label,
|
|
2908
|
+
value,
|
|
2909
|
+
onChange,
|
|
2910
|
+
presets = DEFAULT_PRESETS,
|
|
2911
|
+
presetSections,
|
|
2912
|
+
placeholder = "Select date range",
|
|
2913
|
+
disabled = false,
|
|
2914
|
+
className,
|
|
2915
|
+
showTimePicker = false,
|
|
2916
|
+
timeValue,
|
|
2917
|
+
onTimeChange
|
|
2918
|
+
}) {
|
|
2919
|
+
const [open, setOpen] = React10__namespace.useState(false);
|
|
2920
|
+
const [internalRange, setInternalRange] = React10__namespace.useState({
|
|
2921
|
+
from: void 0,
|
|
2922
|
+
to: void 0
|
|
2923
|
+
});
|
|
2924
|
+
const [draft, setDraft] = React10__namespace.useState({
|
|
2925
|
+
from: void 0,
|
|
2926
|
+
to: void 0
|
|
2927
|
+
});
|
|
2928
|
+
const [hoverDate, setHoverDate] = React10__namespace.useState();
|
|
2929
|
+
const [viewMonth, setViewMonth] = React10__namespace.useState(
|
|
2930
|
+
() => dateFns.startOfMonth(value?.from ?? /* @__PURE__ */ new Date())
|
|
2931
|
+
);
|
|
2932
|
+
const [activePreset, setActivePreset] = React10__namespace.useState();
|
|
2933
|
+
const [internalTime, setInternalTime] = React10__namespace.useState(DEFAULT_TIME_RANGE);
|
|
2934
|
+
const committedRange = value ?? internalRange;
|
|
2935
|
+
const currentTime = timeValue ?? internalTime;
|
|
2936
|
+
const handleTimeChange = (newTime) => {
|
|
2937
|
+
if (onTimeChange) onTimeChange(newTime);
|
|
2938
|
+
else setInternalTime(newTime);
|
|
2939
|
+
};
|
|
2940
|
+
const timeVisible = !!(draft.from && draft.to);
|
|
2941
|
+
const handleOpenChange = (newOpen) => {
|
|
2942
|
+
if (newOpen) {
|
|
2943
|
+
setDraft(committedRange);
|
|
2944
|
+
if (committedRange.from) setViewMonth(dateFns.startOfMonth(committedRange.from));
|
|
2945
|
+
if (!onTimeChange) setInternalTime(currentTime);
|
|
2946
|
+
}
|
|
2947
|
+
setOpen(newOpen);
|
|
2948
|
+
};
|
|
2949
|
+
const handleDayClick = (date) => {
|
|
2950
|
+
const { from, to } = draft;
|
|
2951
|
+
if (!from || from && to) {
|
|
2952
|
+
setDraft({ from: date, to: void 0 });
|
|
2953
|
+
setActivePreset(void 0);
|
|
2954
|
+
return;
|
|
2955
|
+
}
|
|
2956
|
+
const [start, end] = dateFns.isBefore(from, date) ? [from, date] : [date, from];
|
|
2957
|
+
setDraft({ from: start, to: end });
|
|
2958
|
+
setHoverDate(void 0);
|
|
2959
|
+
};
|
|
2960
|
+
const handlePreset = (preset) => {
|
|
2961
|
+
const newRange = preset.getRange();
|
|
2962
|
+
if (showTimePicker) {
|
|
2963
|
+
setDraft(newRange);
|
|
2964
|
+
setActivePreset(preset.label);
|
|
2965
|
+
if (newRange.from) setViewMonth(dateFns.startOfMonth(newRange.from));
|
|
2966
|
+
} else {
|
|
2967
|
+
if (onChange) onChange(newRange);
|
|
2968
|
+
else setInternalRange(newRange);
|
|
2969
|
+
setActivePreset(preset.label);
|
|
2970
|
+
if (newRange.from) setViewMonth(dateFns.startOfMonth(newRange.from));
|
|
2971
|
+
setOpen(false);
|
|
2972
|
+
}
|
|
2973
|
+
};
|
|
2974
|
+
const handleApply = () => {
|
|
2975
|
+
if (draft.from && !draft.to) return;
|
|
2976
|
+
const newRange = draft.from && draft.to ? draft : void 0;
|
|
2977
|
+
if (onChange) onChange(newRange);
|
|
2978
|
+
else setInternalRange(newRange ?? { from: void 0, to: void 0 });
|
|
2979
|
+
setOpen(false);
|
|
2980
|
+
};
|
|
2981
|
+
const handleClear = () => {
|
|
2982
|
+
setDraft({ from: void 0, to: void 0 });
|
|
2983
|
+
setActivePreset(void 0);
|
|
2984
|
+
if (showTimePicker) handleTimeChange(DEFAULT_TIME_RANGE);
|
|
2985
|
+
};
|
|
2986
|
+
const canClear = !!(draft.from || committedRange.from);
|
|
2987
|
+
const canApply = !(draft.from && !draft.to) && !!(draft.from || committedRange.from);
|
|
2988
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunk23BJPJOK_js.cn("space-y-1.5", className), children: [
|
|
2989
|
+
label && /* @__PURE__ */ jsxRuntime.jsx(chunk23BJPJOK_js.Label, { className: "text-sm font-medium text-gray-900 dark:text-gray-100", children: label }),
|
|
2990
|
+
/* @__PURE__ */ jsxRuntime.jsxs(Popover, { open, onOpenChange: handleOpenChange, children: [
|
|
2991
|
+
/* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2992
|
+
"button",
|
|
2993
|
+
{
|
|
2994
|
+
disabled,
|
|
2995
|
+
className: chunk23BJPJOK_js.cn(
|
|
2996
|
+
"inline-flex w-full items-center gap-2 rounded-md border border-gray-300 bg-white px-3 py-2 text-sm shadow-sm transition-colors",
|
|
2997
|
+
"hover:bg-gray-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2",
|
|
2998
|
+
"dark:border-neutral-600 dark:bg-neutral-800 dark:hover:bg-neutral-700",
|
|
2999
|
+
"disabled:pointer-events-none disabled:opacity-50",
|
|
3000
|
+
committedRange.from ? "text-gray-900 dark:text-gray-100" : "text-gray-400 dark:text-gray-500"
|
|
3001
|
+
),
|
|
3002
|
+
children: [
|
|
3003
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.CalendarIcon, { className: "w-4 h-4 shrink-0 text-gray-400 dark:text-gray-500" }),
|
|
3004
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: formatDateRange2(
|
|
3005
|
+
committedRange,
|
|
3006
|
+
placeholder,
|
|
3007
|
+
showTimePicker ? currentTime : void 0
|
|
3008
|
+
) })
|
|
3009
|
+
]
|
|
3010
|
+
}
|
|
3011
|
+
) }),
|
|
3012
|
+
/* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { align: "center", className: "w-auto p-0 overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex divide-x divide-gray-100 dark:divide-neutral-700", children: [
|
|
3013
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col p-2 gap-0.5 min-w-[110px] max-h-[360px] overflow-y-auto", children: (presetSections ?? [{ title: "Presets", options: presets }]).map(
|
|
3014
|
+
(section, si) => /* @__PURE__ */ jsxRuntime.jsxs(React10__namespace.Fragment, { children: [
|
|
3015
|
+
si > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "my-2 border-t border-gray-100 dark:border-neutral-700" }),
|
|
3016
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-semibold text-gray-400 dark:text-gray-500 uppercase tracking-wider mb-1 px-2", children: section.title }),
|
|
3017
|
+
section.options.map((preset) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
3018
|
+
"button",
|
|
3019
|
+
{
|
|
3020
|
+
onClick: () => handlePreset(preset),
|
|
3021
|
+
className: chunk23BJPJOK_js.cn(
|
|
3022
|
+
"w-full text-left px-2 py-1.5 rounded-md text-sm transition-colors",
|
|
3023
|
+
activePreset === preset.label ? "bg-blue-50 text-blue-600 font-medium dark:bg-blue-950/50 dark:text-blue-400" : "text-gray-600 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-neutral-700"
|
|
3024
|
+
),
|
|
3025
|
+
children: preset.label
|
|
3026
|
+
},
|
|
3027
|
+
preset.label
|
|
3028
|
+
))
|
|
3029
|
+
] }, section.title)
|
|
3030
|
+
) }),
|
|
3031
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
|
|
3032
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-2", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3033
|
+
CalendarMonth,
|
|
3034
|
+
{
|
|
3035
|
+
month: viewMonth,
|
|
3036
|
+
range: draft,
|
|
3037
|
+
hoverDate,
|
|
3038
|
+
onDayClick: handleDayClick,
|
|
3039
|
+
onDayHover: setHoverDate,
|
|
3040
|
+
onPrevMonth: () => setViewMonth(dateFns.subMonths(viewMonth, 1)),
|
|
3041
|
+
onNextMonth: () => setViewMonth(dateFns.addMonths(viewMonth, 1)),
|
|
3042
|
+
showPrevNav: true,
|
|
3043
|
+
showNextNav: true
|
|
3044
|
+
}
|
|
3045
|
+
) }),
|
|
3046
|
+
showTimePicker && /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { initial: false, children: timeVisible && /* @__PURE__ */ jsxRuntime.jsx(
|
|
3047
|
+
framerMotion.motion.div,
|
|
3048
|
+
{
|
|
3049
|
+
initial: { height: 0, opacity: 0 },
|
|
3050
|
+
animate: { height: "auto", opacity: 1 },
|
|
3051
|
+
exit: { height: 0, opacity: 0 },
|
|
3052
|
+
transition: {
|
|
3053
|
+
height: {
|
|
3054
|
+
type: "spring",
|
|
3055
|
+
stiffness: 400,
|
|
3056
|
+
damping: 30,
|
|
3057
|
+
mass: 0.8
|
|
3058
|
+
},
|
|
3059
|
+
opacity: { duration: 0.2 }
|
|
3060
|
+
},
|
|
3061
|
+
className: "overflow-hidden",
|
|
3062
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3063
|
+
TimePickerColumn,
|
|
3064
|
+
{
|
|
3065
|
+
value: currentTime,
|
|
3066
|
+
onChange: handleTimeChange
|
|
3067
|
+
}
|
|
3068
|
+
)
|
|
3069
|
+
},
|
|
3070
|
+
"time-picker"
|
|
3071
|
+
) }),
|
|
3072
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-2 px-2 py-3 border-t border-gray-100 dark:border-neutral-700", children: [
|
|
3073
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3074
|
+
"button",
|
|
3075
|
+
{
|
|
3076
|
+
onClick: handleClear,
|
|
3077
|
+
disabled: !canClear,
|
|
3078
|
+
className: chunk23BJPJOK_js.cn(
|
|
3079
|
+
"px-3 py-1.5 rounded-md text-sm transition-colors",
|
|
3080
|
+
canClear ? "text-gray-600 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-neutral-700" : "text-gray-300 dark:text-gray-600 cursor-not-allowed"
|
|
3081
|
+
),
|
|
3082
|
+
children: "Clear"
|
|
3083
|
+
}
|
|
3084
|
+
),
|
|
3085
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3086
|
+
"button",
|
|
3087
|
+
{
|
|
3088
|
+
onClick: handleApply,
|
|
3089
|
+
disabled: !canApply,
|
|
3090
|
+
className: chunk23BJPJOK_js.cn(
|
|
3091
|
+
"px-3 py-1.5 rounded-md text-sm font-medium transition-colors",
|
|
3092
|
+
canApply ? "bg-blue-600 text-white hover:bg-blue-700 dark:hover:bg-blue-500" : "bg-blue-100 text-blue-300 cursor-not-allowed dark:bg-blue-950/30 dark:text-blue-800"
|
|
3093
|
+
),
|
|
3094
|
+
children: "Apply"
|
|
3095
|
+
}
|
|
3096
|
+
)
|
|
3097
|
+
] })
|
|
3098
|
+
] })
|
|
3099
|
+
] }) })
|
|
3100
|
+
] })
|
|
3101
|
+
] });
|
|
3102
|
+
}
|
|
3103
|
+
var colsClass = {
|
|
3104
|
+
2: "grid-cols-2",
|
|
3105
|
+
3: "grid-cols-3",
|
|
3106
|
+
4: "grid-cols-4",
|
|
3107
|
+
5: "grid-cols-5"
|
|
3108
|
+
};
|
|
3109
|
+
function MobileDataCard({
|
|
3110
|
+
title,
|
|
3111
|
+
subtitle,
|
|
3112
|
+
image,
|
|
3113
|
+
contentRows,
|
|
3114
|
+
onPress,
|
|
3115
|
+
showChevron,
|
|
3116
|
+
selectBar,
|
|
3117
|
+
stats,
|
|
3118
|
+
statColumns,
|
|
3119
|
+
statsRenderer,
|
|
3120
|
+
details,
|
|
3121
|
+
extraContent,
|
|
3122
|
+
className
|
|
3123
|
+
}) {
|
|
3124
|
+
const isSelected = selectBar?.isSelected ?? false;
|
|
3125
|
+
const chevronVisible = showChevron ?? !!onPress;
|
|
3126
|
+
const contentBody = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3 px-3 py-3", children: [
|
|
3127
|
+
image && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-shrink-0", children: image }),
|
|
3128
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1 space-y-2", children: [
|
|
3129
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3130
|
+
chunk23BJPJOK_js.Text,
|
|
3131
|
+
{
|
|
3132
|
+
size: "sm",
|
|
3133
|
+
weight: "semibold",
|
|
3134
|
+
className: "truncate leading-tight text-neutral-900 dark:text-neutral-100",
|
|
3135
|
+
children: title
|
|
3136
|
+
}
|
|
3137
|
+
),
|
|
3138
|
+
subtitle && /* @__PURE__ */ jsxRuntime.jsx(chunk23BJPJOK_js.Text, { size: "xs", className: "text-neutral-400 dark:text-neutral-500", children: subtitle }),
|
|
3139
|
+
contentRows && contentRows.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 gap-x-4 gap-y-1 text-xs", children: contentRows.map((row) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "truncate", children: [
|
|
3140
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-neutral-400 dark:text-neutral-500", children: [
|
|
3141
|
+
row.label,
|
|
3142
|
+
" "
|
|
3143
|
+
] }),
|
|
3144
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-neutral-700 dark:text-neutral-300", children: row.value })
|
|
3145
|
+
] }, row.label)) })
|
|
3146
|
+
] }),
|
|
3147
|
+
chevronVisible && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-4 w-4 flex-shrink-0 self-center text-neutral-300 dark:text-neutral-600" })
|
|
3148
|
+
] });
|
|
3149
|
+
const hasStats = stats && stats.length > 0 || !!statsRenderer;
|
|
3150
|
+
const hasDetails = details && details.length > 0;
|
|
3151
|
+
const cols = statColumns ?? stats?.length ?? 2;
|
|
3152
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3153
|
+
"div",
|
|
3154
|
+
{
|
|
3155
|
+
className: chunk23BJPJOK_js.cn(
|
|
3156
|
+
"overflow-hidden rounded-lg border transition-colors",
|
|
3157
|
+
isSelected ? "border-blue-500 bg-blue-50/50 dark:border-blue-400 dark:bg-blue-900/10" : "border-neutral-200 bg-white dark:border-neutral-700 dark:bg-neutral-800/30",
|
|
3158
|
+
className
|
|
3159
|
+
),
|
|
3160
|
+
children: [
|
|
3161
|
+
selectBar && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3162
|
+
"div",
|
|
3163
|
+
{
|
|
3164
|
+
role: "button",
|
|
3165
|
+
tabIndex: 0,
|
|
3166
|
+
"aria-label": isSelected ? "Deselect item" : "Select item",
|
|
3167
|
+
onClick: selectBar.onToggle,
|
|
3168
|
+
onKeyDown: (e) => {
|
|
3169
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
3170
|
+
e.preventDefault();
|
|
3171
|
+
selectBar.onToggle(e);
|
|
3172
|
+
}
|
|
3173
|
+
},
|
|
3174
|
+
className: "flex w-full cursor-pointer items-center gap-2.5 border-b border-neutral-100 px-3 py-1.5 focus:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-blue-500 dark:border-neutral-700/50",
|
|
3175
|
+
children: [
|
|
3176
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3177
|
+
Checkbox,
|
|
3178
|
+
{
|
|
3179
|
+
checked: isSelected,
|
|
3180
|
+
className: "pointer-events-none",
|
|
3181
|
+
tabIndex: -1
|
|
3182
|
+
}
|
|
3183
|
+
),
|
|
3184
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3185
|
+
chunk23BJPJOK_js.Text,
|
|
3186
|
+
{
|
|
3187
|
+
size: "xs",
|
|
3188
|
+
as: "span",
|
|
3189
|
+
className: chunk23BJPJOK_js.cn(
|
|
3190
|
+
isSelected ? "font-medium text-blue-600 dark:text-blue-400" : "text-neutral-400 dark:text-neutral-500"
|
|
3191
|
+
),
|
|
3192
|
+
children: isSelected ? "Selected" : "Select"
|
|
3193
|
+
}
|
|
3194
|
+
),
|
|
3195
|
+
selectBar.badge && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-auto", children: selectBar.badge })
|
|
3196
|
+
]
|
|
3197
|
+
}
|
|
3198
|
+
),
|
|
3199
|
+
onPress ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
3200
|
+
"button",
|
|
3201
|
+
{
|
|
3202
|
+
type: "button",
|
|
3203
|
+
onClick: onPress,
|
|
3204
|
+
className: "w-full text-left transition-colors active:bg-neutral-50 dark:active:bg-neutral-800",
|
|
3205
|
+
children: contentBody
|
|
3206
|
+
}
|
|
3207
|
+
) : contentBody,
|
|
3208
|
+
statsRenderer ?? (stats && stats.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunk23BJPJOK_js.cn("grid gap-1.5 px-3 pb-3", colsClass[cols]), children: stats.map((stat) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3209
|
+
"div",
|
|
3210
|
+
{
|
|
3211
|
+
className: "flex flex-col items-center rounded-md bg-neutral-100 py-1.5 dark:bg-neutral-800",
|
|
3212
|
+
children: [
|
|
3213
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3214
|
+
chunk23BJPJOK_js.Text,
|
|
3215
|
+
{
|
|
3216
|
+
size: "xs",
|
|
3217
|
+
as: "span",
|
|
3218
|
+
className: "leading-none text-neutral-400 dark:text-neutral-500",
|
|
3219
|
+
children: stat.label
|
|
3220
|
+
}
|
|
3221
|
+
),
|
|
3222
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3223
|
+
chunk23BJPJOK_js.Text,
|
|
3224
|
+
{
|
|
3225
|
+
size: "sm",
|
|
3226
|
+
weight: "semibold",
|
|
3227
|
+
as: "span",
|
|
3228
|
+
className: chunk23BJPJOK_js.cn(
|
|
3229
|
+
"mt-0.5 tabular-nums",
|
|
3230
|
+
stat.className ?? "text-neutral-800 dark:text-neutral-200"
|
|
3231
|
+
),
|
|
3232
|
+
children: stat.value
|
|
3233
|
+
}
|
|
3234
|
+
)
|
|
3235
|
+
]
|
|
3236
|
+
},
|
|
3237
|
+
stat.label
|
|
3238
|
+
)) })),
|
|
3239
|
+
hasDetails && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
3240
|
+
hasStats && /* @__PURE__ */ jsxRuntime.jsx(Separator3, {}),
|
|
3241
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1 px-3 py-2", children: details.map((detail) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3242
|
+
"div",
|
|
3243
|
+
{
|
|
3244
|
+
className: "flex items-center justify-between",
|
|
3245
|
+
children: [
|
|
3246
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3247
|
+
chunk23BJPJOK_js.Text,
|
|
3248
|
+
{
|
|
3249
|
+
size: "xs",
|
|
3250
|
+
as: "span",
|
|
3251
|
+
className: "text-neutral-400 dark:text-neutral-500",
|
|
3252
|
+
children: detail.label
|
|
3253
|
+
}
|
|
3254
|
+
),
|
|
3255
|
+
detail.pill ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex items-center rounded-full bg-blue-50 px-2 py-0.5 dark:bg-blue-900/30", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3256
|
+
chunk23BJPJOK_js.Text,
|
|
3257
|
+
{
|
|
3258
|
+
size: "xs",
|
|
3259
|
+
weight: "medium",
|
|
3260
|
+
as: "span",
|
|
3261
|
+
className: "text-blue-600 dark:text-blue-400",
|
|
3262
|
+
children: detail.value
|
|
3263
|
+
}
|
|
3264
|
+
) }) : detail.value
|
|
3265
|
+
]
|
|
3266
|
+
},
|
|
3267
|
+
detail.label
|
|
3268
|
+
)) })
|
|
3269
|
+
] }),
|
|
3270
|
+
extraContent
|
|
3271
|
+
]
|
|
3272
|
+
}
|
|
3273
|
+
);
|
|
3274
|
+
}
|
|
2808
3275
|
var DEFAULT_COMPARISON_PERIODS = [
|
|
2809
3276
|
{
|
|
2810
3277
|
key: "yesterday",
|
|
@@ -2894,6 +3361,7 @@ exports.DEFAULT_COMPARISON_PERIODS = DEFAULT_COMPARISON_PERIODS;
|
|
|
2894
3361
|
exports.DEFAULT_PRESETS = DEFAULT_PRESETS;
|
|
2895
3362
|
exports.DEFAULT_TIME_RANGE = DEFAULT_TIME_RANGE;
|
|
2896
3363
|
exports.DateRangePicker = DateRangePicker;
|
|
3364
|
+
exports.DateRangePickerMobile = DateRangePickerMobile;
|
|
2897
3365
|
exports.Dialog = Dialog;
|
|
2898
3366
|
exports.DialogClose = DialogClose;
|
|
2899
3367
|
exports.DialogContent = DialogContent;
|
|
@@ -2925,6 +3393,7 @@ exports.FormDescription = FormDescription;
|
|
|
2925
3393
|
exports.FormField = FormField;
|
|
2926
3394
|
exports.FormLabel = FormLabel;
|
|
2927
3395
|
exports.FormMessage = FormMessage;
|
|
3396
|
+
exports.MobileDataCard = MobileDataCard;
|
|
2928
3397
|
exports.PeriodComparisonSelector = PeriodComparisonSelector;
|
|
2929
3398
|
exports.Popover = Popover;
|
|
2930
3399
|
exports.PopoverAnchor = PopoverAnchor;
|
|
@@ -2984,5 +3453,5 @@ exports.useColumnVisibility = useColumnVisibility;
|
|
|
2984
3453
|
exports.useFormContext = useFormContext;
|
|
2985
3454
|
exports.useFormFieldContext = useFormFieldContext;
|
|
2986
3455
|
exports.useTableSelection = useTableSelection;
|
|
2987
|
-
//# sourceMappingURL=chunk-
|
|
2988
|
-
//# sourceMappingURL=chunk-
|
|
3456
|
+
//# sourceMappingURL=chunk-TINY76JI.js.map
|
|
3457
|
+
//# sourceMappingURL=chunk-TINY76JI.js.map
|