@sustaina/shared-ui 1.65.5 → 1.67.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/index.mjs CHANGED
@@ -7,7 +7,7 @@ import { twMerge } from 'tailwind-merge';
7
7
  import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
8
8
  import * as AccordionPrimitive from '@radix-ui/react-accordion';
9
9
  import useEmblaCarousel from 'embla-carousel-react';
10
- import { ChevronLeft, ChevronRight, CircleX, ChevronDown, X, CircleHelp, Clock, Check, Undo, Redo, SearchIcon as SearchIcon$1, Pencil, BaselineIcon, Bold, Italic, Underline, Strikethrough, Code, Pilcrow, Heading1, Heading2, Heading3, List, ListOrdered, QuoteIcon, CodeSquare, LinkIcon, Link2Off, ImageIcon, AlignLeft, AlignCenter, AlignRight, ExternalLink, XIcon, CheckIcon, Triangle, CalendarIcon, Search, ChevronUp, ChevronRightIcon, PanelLeftIcon, Minimize2, Maximize2, Plus, MoreVertical, Bug, GripVertical, Info, CircleMinus, Minus } from 'lucide-react';
10
+ import { ChevronLeft, ChevronRight, CircleX, ChevronDown, X, CircleHelp, Check, Undo, Redo, SearchIcon as SearchIcon$1, Pencil, BaselineIcon, Bold, Italic, Underline, Strikethrough, Code, Pilcrow, Heading1, Heading2, Heading3, List, ListOrdered, QuoteIcon, CodeSquare, LinkIcon, Link2Off, ImageIcon, AlignLeft, AlignCenter, AlignRight, ExternalLink, XIcon, CheckIcon, Triangle, CalendarIcon, Search, ChevronUp, ChevronRightIcon, PanelLeftIcon, Minimize2, Maximize2, Plus, MoreVertical, Bug, GripVertical, Info, CircleMinus, Minus } from 'lucide-react';
11
11
  import Autoplay from 'embla-carousel-autoplay';
12
12
  import { Slot } from '@radix-ui/react-slot';
13
13
  import { cva } from 'class-variance-authority';
@@ -15,7 +15,7 @@ import { createPortal } from 'react-dom';
15
15
  import * as SelectPrimitive from '@radix-ui/react-select';
16
16
  import { useForm, FormProvider, Controller, useFormContext, useFormState, useFieldArray, useWatch } from 'react-hook-form';
17
17
  import * as LabelPrimitive from '@radix-ui/react-label';
18
- import { format, isValid, parse, parseISO, isAfter, compareAsc } from 'date-fns';
18
+ import { format, isValid, parseISO, isAfter, compareAsc, parse } from 'date-fns';
19
19
  import * as PopoverPrimitive from '@radix-ui/react-popover';
20
20
  import { Command as Command$1 } from 'cmdk';
21
21
  import * as DialogPrimitive2 from '@radix-ui/react-dialog';
@@ -4854,6 +4854,14 @@ var ClearButton = ({
4854
4854
  event.stopPropagation();
4855
4855
  triggerClear();
4856
4856
  };
4857
+ const handlePointerDown = (event) => {
4858
+ event.preventDefault();
4859
+ event.stopPropagation();
4860
+ };
4861
+ const handleMouseDown = (event) => {
4862
+ event.preventDefault();
4863
+ event.stopPropagation();
4864
+ };
4857
4865
  const handleKeyDown = (event) => {
4858
4866
  if (event.key === "Enter" || event.key === " ") {
4859
4867
  event.preventDefault();
@@ -4866,6 +4874,8 @@ var ClearButton = ({
4866
4874
  {
4867
4875
  role: "button",
4868
4876
  tabIndex: 0,
4877
+ onPointerDown: handlePointerDown,
4878
+ onMouseDown: handleMouseDown,
4869
4879
  onClick: handleClick,
4870
4880
  onKeyDown: handleKeyDown,
4871
4881
  className: `clear-button ${className}`.trim(),
@@ -9977,6 +9987,291 @@ var DataTable = ({
9977
9987
  );
9978
9988
  };
9979
9989
  var DataTable_default = DataTable;
9990
+ var defaultValueFormatter3 = (date) => format(date, "yyyy-MM-dd'T'HH:mm:ss");
9991
+ var parseWithPatterns = (value) => {
9992
+ const patterns = ["yyyy-MM-dd'T'HH:mm:ss", "yyyy-MM-dd HH:mm", "yyyy-MM-dd"];
9993
+ for (const pattern of patterns) {
9994
+ const parsed = parse(value, pattern, /* @__PURE__ */ new Date());
9995
+ if (isValid(parsed)) return parsed;
9996
+ }
9997
+ return void 0;
9998
+ };
9999
+ var defaultValueParser3 = (value) => {
10000
+ const isoParsed = parseISO(value);
10001
+ if (isValid(isoParsed)) return isoParsed;
10002
+ return parseWithPatterns(value);
10003
+ };
10004
+ var DateTimePicker = ({
10005
+ value,
10006
+ onChange,
10007
+ onValueChange,
10008
+ disabled = false,
10009
+ invalid = false,
10010
+ allowClear = true,
10011
+ use24Hour = false,
10012
+ placeholderDate = "Select date",
10013
+ placeholderTime = "Select time",
10014
+ className,
10015
+ datePickerClassName,
10016
+ timePickerClassName,
10017
+ popoverContentClassName,
10018
+ clearAriaLabel = "Clear date time",
10019
+ minuteStep = 5,
10020
+ minDateTime,
10021
+ maxDateTime,
10022
+ valueFormatter,
10023
+ valueParser,
10024
+ datePickerProps,
10025
+ timePickerProps
10026
+ }) => {
10027
+ const [open, setOpen] = React__default.useState(false);
10028
+ const hourListRef = React__default.useRef(null);
10029
+ const minuteListRef = React__default.useRef(null);
10030
+ const parser = React__default.useMemo(() => valueParser ?? defaultValueParser3, [valueParser]);
10031
+ const outputFormatter = React__default.useMemo(() => valueFormatter ?? defaultValueFormatter3, [valueFormatter]);
10032
+ const parseInput = React__default.useCallback(
10033
+ (input) => {
10034
+ if (input === null || input === void 0) return void 0;
10035
+ if (input instanceof Date) return isValid(input) ? input : void 0;
10036
+ const parsed = parser(input);
10037
+ return parsed && isValid(parsed) ? parsed : void 0;
10038
+ },
10039
+ [parser]
10040
+ );
10041
+ const isControlled = value !== void 0;
10042
+ const parsedValue = React__default.useMemo(() => parseInput(value), [parseInput, value]);
10043
+ const [internalValue, setInternalValue] = React__default.useState(() => parsedValue);
10044
+ React__default.useEffect(() => {
10045
+ if (isControlled) {
10046
+ setInternalValue(parsedValue);
10047
+ }
10048
+ }, [isControlled, parsedValue]);
10049
+ const currentValue = isControlled ? parsedValue : internalValue;
10050
+ const emitChange = React__default.useCallback(
10051
+ (next) => {
10052
+ if (!isControlled) {
10053
+ setInternalValue(next);
10054
+ }
10055
+ onChange?.(next);
10056
+ onValueChange?.(next ? outputFormatter(next) : void 0);
10057
+ },
10058
+ [isControlled, onChange, onValueChange, outputFormatter]
10059
+ );
10060
+ const makeDateTime = React__default.useCallback((baseDate, hour, minute) => {
10061
+ const clampedHour = Math.min(23, Math.max(0, hour));
10062
+ const clampedMinute = Math.min(59, Math.max(0, minute));
10063
+ return new Date(
10064
+ baseDate.getFullYear(),
10065
+ baseDate.getMonth(),
10066
+ baseDate.getDate(),
10067
+ clampedHour,
10068
+ clampedMinute,
10069
+ 0,
10070
+ 0
10071
+ );
10072
+ }, []);
10073
+ const handleDateChange = React__default.useCallback(
10074
+ (nextDate) => {
10075
+ if (!nextDate) {
10076
+ emitChange(void 0);
10077
+ return;
10078
+ }
10079
+ emitChange(new Date(nextDate.getFullYear(), nextDate.getMonth(), nextDate.getDate(), 0, 0, 0, 0));
10080
+ },
10081
+ [emitChange]
10082
+ );
10083
+ const handleTimeApply = React__default.useCallback(
10084
+ (hour, minute) => {
10085
+ const baseDate = currentValue;
10086
+ if (!baseDate) return;
10087
+ emitChange(makeDateTime(baseDate, hour, minute));
10088
+ },
10089
+ [currentValue, emitChange, makeDateTime]
10090
+ );
10091
+ const currentHour = currentValue?.getHours();
10092
+ const currentMinute = currentValue?.getMinutes();
10093
+ const handleHourSelect = React__default.useCallback(
10094
+ (hour) => {
10095
+ handleTimeApply(hour, currentMinute ?? 0);
10096
+ },
10097
+ [currentMinute, handleTimeApply]
10098
+ );
10099
+ const handleMinuteSelect = React__default.useCallback(
10100
+ (minute) => {
10101
+ handleTimeApply(currentHour ?? 0, minute);
10102
+ setOpen(false);
10103
+ },
10104
+ [currentHour, handleTimeApply]
10105
+ );
10106
+ const hours = React__default.useMemo(() => Array.from({ length: 24 }, (_, index) => 23 - index), []);
10107
+ const minuteInterval = React__default.useMemo(() => {
10108
+ const safeStep = Math.min(60, Math.max(1, minuteStep));
10109
+ return Array.from({ length: Math.ceil(60 / safeStep) }, (_, index) => index * safeStep).filter(
10110
+ (value2) => value2 < 60
10111
+ );
10112
+ }, [minuteStep]);
10113
+ const displayLabel = React__default.useMemo(() => {
10114
+ if (!currentValue) return `${placeholderDate} ${placeholderTime}`;
10115
+ return format(currentValue, use24Hour ? "dd/MM/yyyy HH:mm" : "dd/MM/yyyy hh:mm a");
10116
+ }, [currentValue, placeholderDate, placeholderTime, use24Hour]);
10117
+ const canSelectTime = !disabled && !!currentValue;
10118
+ const isHourDisabled = React__default.useCallback(
10119
+ (hour) => {
10120
+ if (!currentValue) return true;
10121
+ const testDateTime = new Date(
10122
+ currentValue.getFullYear(),
10123
+ currentValue.getMonth(),
10124
+ currentValue.getDate(),
10125
+ hour,
10126
+ 0,
10127
+ 0,
10128
+ 0
10129
+ );
10130
+ if (minDateTime && testDateTime < minDateTime) return true;
10131
+ if (maxDateTime && testDateTime > maxDateTime) return true;
10132
+ return false;
10133
+ },
10134
+ [currentValue, minDateTime, maxDateTime]
10135
+ );
10136
+ const isMinuteDisabled = React__default.useCallback(
10137
+ (minute) => {
10138
+ if (!currentValue || typeof currentHour === "undefined") return true;
10139
+ const testDateTime = new Date(
10140
+ currentValue.getFullYear(),
10141
+ currentValue.getMonth(),
10142
+ currentValue.getDate(),
10143
+ currentHour,
10144
+ minute,
10145
+ 0,
10146
+ 0
10147
+ );
10148
+ if (minDateTime && testDateTime < minDateTime) return true;
10149
+ if (maxDateTime && testDateTime > maxDateTime) return true;
10150
+ return false;
10151
+ },
10152
+ [currentValue, currentHour, minDateTime, maxDateTime]
10153
+ );
10154
+ const scrollToSelected = React__default.useCallback((container, selector) => {
10155
+ if (!container) return;
10156
+ const element = container.querySelector(selector);
10157
+ if (!element) return;
10158
+ const target = element.offsetTop - container.clientHeight / 2 + element.clientHeight / 2;
10159
+ container.scrollTo({ top: Math.max(0, target), behavior: "smooth" });
10160
+ }, []);
10161
+ React__default.useEffect(() => {
10162
+ if (!open) return;
10163
+ if (typeof currentHour === "number") {
10164
+ scrollToSelected(hourListRef.current, `[data-hour="${currentHour}"]`);
10165
+ }
10166
+ if (typeof currentMinute === "number") {
10167
+ scrollToSelected(minuteListRef.current, `[data-minute="${currentMinute}"]`);
10168
+ }
10169
+ }, [currentHour, currentMinute, open, scrollToSelected]);
10170
+ const handleClear = React__default.useCallback(() => {
10171
+ emitChange(void 0);
10172
+ setOpen(false);
10173
+ }, [emitChange]);
10174
+ return /* @__PURE__ */ jsxs("div", { className: cn("relative w-full", className), children: [
10175
+ /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
10176
+ /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
10177
+ Button,
10178
+ {
10179
+ type: "button",
10180
+ variant: "outline",
10181
+ disabled,
10182
+ "aria-invalid": invalid || void 0,
10183
+ className: cn(
10184
+ "group relative flex! w-full items-center justify-between rounded-md bg-white! pl-4 text-left text-sm font-medium shadow-none border border-sus-secondary-gray-8 focus-visible:ring-0 focus-visible:ring-offset-0 data-[state=open]:border-black disabled:bg-sus-secondary-gray-3!",
10185
+ "min-h-9",
10186
+ currentValue ? "text-gray-700" : "text-gray-400",
10187
+ invalid && "border-destructive focus-visible:border-destructive focus-visible:ring-destructive/30",
10188
+ allowClear && currentValue ? "pr-8" : "pr-4"
10189
+ ),
10190
+ children: [
10191
+ /* @__PURE__ */ jsx("span", { className: "flex-1 truncate font-light", children: displayLabel }),
10192
+ /* @__PURE__ */ jsx("span", { className: "flex items-center gap-2 text-black group-disabled:text-sus-secondary-gray-8 shrink-0", children: /* @__PURE__ */ jsx(SuiCalendarIcon2, { className: "h-4 w-4" }) })
10193
+ ]
10194
+ }
10195
+ ) }),
10196
+ /* @__PURE__ */ jsx(PopoverContent, { className: cn("w-auto p-0", popoverContentClassName), align: "start", children: /* @__PURE__ */ jsxs("div", { className: "sm:flex", children: [
10197
+ /* @__PURE__ */ jsx(
10198
+ DatePicker,
10199
+ {
10200
+ ...datePickerProps,
10201
+ className: cn(datePickerProps?.className, datePickerClassName),
10202
+ selectionMode: "single",
10203
+ selectedDate: currentValue,
10204
+ onDateSelect: handleDateChange,
10205
+ minDate: minDateTime,
10206
+ maxDate: maxDateTime
10207
+ }
10208
+ ),
10209
+ /* @__PURE__ */ jsx(
10210
+ "div",
10211
+ {
10212
+ className: cn(
10213
+ "flex border-t sm:border-t-0 sm:border-l p-2",
10214
+ !canSelectTime && "opacity-60",
10215
+ timePickerClassName,
10216
+ timePickerProps?.panelClassName
10217
+ ),
10218
+ children: /* @__PURE__ */ jsxs("div", { className: "flex w-full", children: [
10219
+ /* @__PURE__ */ jsx("div", { className: "w-14 border-r pr-1", children: /* @__PURE__ */ jsx("div", { ref: hourListRef, className: "h-[300px] overflow-y-auto space-y-1", children: hours.map((hour) => {
10220
+ const selected = currentHour === hour;
10221
+ const hourDisabled = isHourDisabled(hour);
10222
+ return /* @__PURE__ */ jsx(
10223
+ "button",
10224
+ {
10225
+ type: "button",
10226
+ "data-hour": hour,
10227
+ disabled: !canSelectTime || hourDisabled,
10228
+ onClick: () => handleHourSelect(hour),
10229
+ className: cn(
10230
+ "h-8 w-full rounded-md text-sm transition-colors",
10231
+ selected ? "bg-[#379a2a] text-white hover:bg-[#379a2a]" : "text-foreground hover:bg-sus-secondary-gray-3",
10232
+ (!canSelectTime || hourDisabled) && "cursor-not-allowed opacity-50"
10233
+ ),
10234
+ children: String(hour).padStart(2, "0")
10235
+ },
10236
+ hour
10237
+ );
10238
+ }) }) }),
10239
+ /* @__PURE__ */ jsx("div", { className: "w-14 pl-1", children: /* @__PURE__ */ jsx("div", { ref: minuteListRef, className: "h-[300px] overflow-y-auto space-y-1", children: minuteInterval.map((minute) => {
10240
+ const selected = currentMinute === minute;
10241
+ const minuteDisabled = isMinuteDisabled(minute);
10242
+ return /* @__PURE__ */ jsx(
10243
+ "button",
10244
+ {
10245
+ type: "button",
10246
+ "data-minute": minute,
10247
+ disabled: !canSelectTime || minuteDisabled,
10248
+ onClick: () => handleMinuteSelect(minute),
10249
+ className: cn(
10250
+ "h-8 w-full rounded-md text-sm transition-colors",
10251
+ selected ? "bg-[#379a2a] text-white hover:bg-[#379a2a]" : "text-foreground hover:bg-sus-secondary-gray-3",
10252
+ (!canSelectTime || minuteDisabled) && "cursor-not-allowed opacity-50"
10253
+ ),
10254
+ children: String(minute).padStart(2, "0")
10255
+ },
10256
+ minute
10257
+ );
10258
+ }) }) })
10259
+ ] })
10260
+ }
10261
+ )
10262
+ ] }) })
10263
+ ] }),
10264
+ allowClear && !!currentValue && !disabled && /* @__PURE__ */ jsx(
10265
+ ClearButton,
10266
+ {
10267
+ onClick: handleClear,
10268
+ ariaLabel: clearAriaLabel,
10269
+ title: clearAriaLabel,
10270
+ className: "absolute right-3 top-1/2 z-10 -translate-y-1/2"
10271
+ }
10272
+ )
10273
+ ] });
10274
+ };
9980
10275
  function Dialog2(props) {
9981
10276
  return /* @__PURE__ */ jsx(DialogPrimitive2.Root, { "data-slot": "dialog", ...props });
9982
10277
  }
@@ -10462,6 +10757,18 @@ var DIALOG_ALERT_TEMPLATES = {
10462
10757
  title: "confirm.logout.title",
10463
10758
  description: "confirm.logout.description",
10464
10759
  confirmText: "confirm.logout.confirm_text"
10760
+ },
10761
+ "confirm.set_default": {
10762
+ variant: "confirm",
10763
+ title: "confirm.set_default.title",
10764
+ description: "confirm.set_default.description",
10765
+ confirmText: "confirm.set_default.confirm_text"
10766
+ },
10767
+ "confirm.unset_default": {
10768
+ variant: "confirm",
10769
+ title: "confirm.unset_default.title",
10770
+ description: "confirm.unset_default.description",
10771
+ confirmText: "confirm.unset_default.confirm_text"
10465
10772
  }
10466
10773
  };
10467
10774
 
@@ -10591,6 +10898,16 @@ var defaultResource = {
10591
10898
  title: "Confirmation",
10592
10899
  description: "Do you want to log out?",
10593
10900
  confirm_text: "Logout"
10901
+ },
10902
+ "confirm.set_default": {
10903
+ title: "Confirmation",
10904
+ description: "Set this item as the default?",
10905
+ confirm_text: "Confirm"
10906
+ },
10907
+ "confirm.unset_default": {
10908
+ title: "Confirmation",
10909
+ description: "Remove default status from this item?",
10910
+ confirm_text: "Confirm"
10594
10911
  }
10595
10912
  }
10596
10913
  }
@@ -16333,351 +16650,6 @@ var RightPanelContainer = ({
16333
16650
  );
16334
16651
  };
16335
16652
  var RightPanelContainer_default = RightPanelContainer;
16336
- var defaultDisplayFormatter3 = (date, use24Hour) => use24Hour ? format(date, "HH:mm") : format(date, "hh:mm a");
16337
- var defaultValueFormatter3 = (date) => format(date, "HH:mm");
16338
- var defaultValueParser3 = (value) => {
16339
- let parsed = parse(value, "HH:mm", /* @__PURE__ */ new Date());
16340
- if (isValid(parsed)) return parsed;
16341
- parsed = parse(value, "HH:mm:ss", /* @__PURE__ */ new Date());
16342
- if (isValid(parsed)) return parsed;
16343
- parsed = parse(value, "hh:mm a", /* @__PURE__ */ new Date());
16344
- if (isValid(parsed)) return parsed;
16345
- return void 0;
16346
- };
16347
- var TimePicker = React.forwardRef(
16348
- ({
16349
- value,
16350
- onChange,
16351
- onValueChange,
16352
- disabled = false,
16353
- className,
16354
- buttonClassName,
16355
- wrapperClassName,
16356
- placeholder: placeholder2,
16357
- use24Hour = false,
16358
- iconPosition = "start",
16359
- icon,
16360
- allowClear = true,
16361
- clearAriaLabel = "Clear time",
16362
- displayFormatter,
16363
- valueFormatter,
16364
- valueParser,
16365
- invalid = false
16366
- }, ref) => {
16367
- const [open, setOpen] = React.useState(false);
16368
- const [hours, setHours] = React.useState("12");
16369
- const [minutes, setMinutes] = React.useState("00");
16370
- const [period, setPeriod] = React.useState("AM");
16371
- const parser = React.useMemo(() => valueParser ?? defaultValueParser3, [valueParser]);
16372
- const outputFormatter = React.useMemo(
16373
- () => valueFormatter ?? defaultValueFormatter3,
16374
- [valueFormatter]
16375
- );
16376
- const labelFormatter = React.useMemo(
16377
- () => displayFormatter ?? defaultDisplayFormatter3,
16378
- [displayFormatter]
16379
- );
16380
- const parseInput = React.useCallback(
16381
- (input) => {
16382
- if (input === null || input === void 0) return void 0;
16383
- if (input instanceof Date) return isValid(input) ? input : void 0;
16384
- const parsed = parser(input);
16385
- return parsed && isValid(parsed) ? parsed : void 0;
16386
- },
16387
- [parser]
16388
- );
16389
- const parsedValue = React.useMemo(() => parseInput(value), [parseInput, value]);
16390
- const hasValue = parsedValue !== void 0;
16391
- React.useEffect(() => {
16392
- if (parsedValue) {
16393
- const hour24 = parsedValue.getHours();
16394
- const minute = parsedValue.getMinutes();
16395
- if (use24Hour) {
16396
- setHours(String(hour24).padStart(2, "0"));
16397
- } else {
16398
- const newPeriod = hour24 >= 12 ? "PM" : "AM";
16399
- const hour12 = hour24 === 0 ? 12 : hour24 > 12 ? hour24 - 12 : hour24;
16400
- setHours(String(hour12).padStart(2, "0"));
16401
- setPeriod(newPeriod);
16402
- }
16403
- setMinutes(String(minute).padStart(2, "0"));
16404
- } else {
16405
- setHours(use24Hour ? "00" : "12");
16406
- setMinutes("00");
16407
- setPeriod("AM");
16408
- }
16409
- }, [parsedValue, use24Hour]);
16410
- const createTimeDate = (h, m, p) => {
16411
- let hour = parseInt(h) || 0;
16412
- const minute = parseInt(m) || 0;
16413
- if (!use24Hour) {
16414
- if (p === "PM" && hour !== 12) {
16415
- hour += 12;
16416
- } else if (p === "AM" && hour === 12) {
16417
- hour = 0;
16418
- }
16419
- }
16420
- const today = /* @__PURE__ */ new Date();
16421
- return new Date(today.getFullYear(), today.getMonth(), today.getDate(), hour, minute, 0, 0);
16422
- };
16423
- const emitChange = (date) => {
16424
- onChange?.(date);
16425
- onValueChange?.(outputFormatter(date));
16426
- };
16427
- const handleClear = () => {
16428
- onChange?.(void 0);
16429
- onValueChange?.(void 0);
16430
- };
16431
- const handleHourChange = (newHour) => {
16432
- const hour = parseInt(newHour) || 0;
16433
- const maxHour = use24Hour ? 23 : 12;
16434
- const minHour = use24Hour ? 0 : 1;
16435
- if (hour <= maxHour && hour >= minHour) {
16436
- setHours(newHour.padStart(2, "0"));
16437
- emitChange(createTimeDate(newHour, minutes, period));
16438
- }
16439
- };
16440
- const handleMinuteChange = (newMinute) => {
16441
- const minute = parseInt(newMinute) || 0;
16442
- if (minute <= 59 && minute >= 0) {
16443
- setMinutes(newMinute.padStart(2, "0"));
16444
- emitChange(createTimeDate(hours, newMinute, period));
16445
- }
16446
- };
16447
- const handlePeriodToggle = () => {
16448
- const newPeriod = period === "AM" ? "PM" : "AM";
16449
- setPeriod(newPeriod);
16450
- emitChange(createTimeDate(hours, minutes, newPeriod));
16451
- };
16452
- const incrementHour = () => {
16453
- const hour = parseInt(hours) || 0;
16454
- const maxHour = use24Hour ? 23 : 12;
16455
- const minHour = use24Hour ? 0 : 1;
16456
- const newHour = hour >= maxHour ? minHour : hour + 1;
16457
- handleHourChange(String(newHour));
16458
- };
16459
- const decrementHour = () => {
16460
- const hour = parseInt(hours) || 0;
16461
- const maxHour = use24Hour ? 23 : 12;
16462
- const minHour = use24Hour ? 0 : 1;
16463
- const newHour = hour <= minHour ? maxHour : hour - 1;
16464
- handleHourChange(String(newHour));
16465
- };
16466
- const incrementMinute = () => {
16467
- const minute = parseInt(minutes) || 0;
16468
- const newMinute = minute >= 59 ? 0 : minute + 1;
16469
- handleMinuteChange(String(newMinute));
16470
- };
16471
- const decrementMinute = () => {
16472
- const minute = parseInt(minutes) || 0;
16473
- const newMinute = minute <= 0 ? 59 : minute - 1;
16474
- handleMinuteChange(String(newMinute));
16475
- };
16476
- const displayValue = parsedValue ? labelFormatter(parsedValue, use24Hour) : placeholder2;
16477
- const displayIcon = icon || /* @__PURE__ */ jsx(Clock, { className: "h-4 w-4" });
16478
- const showClear = allowClear && hasValue && !disabled;
16479
- return /* @__PURE__ */ jsxs("div", { className: cn("relative inline-flex w-full", wrapperClassName), children: [
16480
- /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
16481
- /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
16482
- Button,
16483
- {
16484
- variant: "outline",
16485
- disabled,
16486
- className: cn(
16487
- "w-full justify-between text-left font-normal",
16488
- !hasValue && "text-muted-foreground",
16489
- invalid && "border-destructive focus-visible:ring-destructive",
16490
- showClear && "pr-8",
16491
- buttonClassName,
16492
- className
16493
- ),
16494
- children: [
16495
- iconPosition === "start" && /* @__PURE__ */ jsx("span", { className: "shrink-0", children: displayIcon }),
16496
- /* @__PURE__ */ jsx(
16497
- "span",
16498
- {
16499
- className: cn(
16500
- "flex-1 truncate",
16501
- iconPosition === "start" && "ml-2",
16502
- iconPosition === "end" && "mr-2"
16503
- ),
16504
- children: displayValue || placeholder2 || "Select time"
16505
- }
16506
- ),
16507
- iconPosition === "end" && /* @__PURE__ */ jsx("span", { className: "shrink-0", children: displayIcon })
16508
- ]
16509
- }
16510
- ) }),
16511
- /* @__PURE__ */ jsx(PopoverContent, { className: "w-auto p-4", align: "start", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
16512
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-1", children: [
16513
- /* @__PURE__ */ jsx(
16514
- Button,
16515
- {
16516
- variant: "ghost",
16517
- size: "icon",
16518
- className: "h-8 w-8",
16519
- onClick: incrementHour,
16520
- type: "button",
16521
- children: /* @__PURE__ */ jsx(
16522
- "svg",
16523
- {
16524
- xmlns: "http://www.w3.org/2000/svg",
16525
- width: "16",
16526
- height: "16",
16527
- viewBox: "0 0 24 24",
16528
- fill: "none",
16529
- stroke: "currentColor",
16530
- strokeWidth: "2",
16531
- strokeLinecap: "round",
16532
- strokeLinejoin: "round",
16533
- children: /* @__PURE__ */ jsx("polyline", { points: "18 15 12 9 6 15" })
16534
- }
16535
- )
16536
- }
16537
- ),
16538
- /* @__PURE__ */ jsx(
16539
- Input,
16540
- {
16541
- ref,
16542
- type: "text",
16543
- inputMode: "numeric",
16544
- value: hours,
16545
- onChange: (e) => handleHourChange(e.target.value),
16546
- className: "w-16 text-center",
16547
- maxLength: 2
16548
- }
16549
- ),
16550
- /* @__PURE__ */ jsx(
16551
- Button,
16552
- {
16553
- variant: "ghost",
16554
- size: "icon",
16555
- className: "h-8 w-8",
16556
- onClick: decrementHour,
16557
- type: "button",
16558
- children: /* @__PURE__ */ jsx(
16559
- "svg",
16560
- {
16561
- xmlns: "http://www.w3.org/2000/svg",
16562
- width: "16",
16563
- height: "16",
16564
- viewBox: "0 0 24 24",
16565
- fill: "none",
16566
- stroke: "currentColor",
16567
- strokeWidth: "2",
16568
- strokeLinecap: "round",
16569
- strokeLinejoin: "round",
16570
- children: /* @__PURE__ */ jsx("polyline", { points: "6 9 12 15 18 9" })
16571
- }
16572
- )
16573
- }
16574
- )
16575
- ] }),
16576
- /* @__PURE__ */ jsx("span", { className: "text-2xl font-semibold", children: ":" }),
16577
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-1", children: [
16578
- /* @__PURE__ */ jsx(
16579
- Button,
16580
- {
16581
- variant: "ghost",
16582
- size: "icon",
16583
- className: "h-8 w-8",
16584
- onClick: incrementMinute,
16585
- type: "button",
16586
- children: /* @__PURE__ */ jsx(
16587
- "svg",
16588
- {
16589
- xmlns: "http://www.w3.org/2000/svg",
16590
- width: "16",
16591
- height: "16",
16592
- viewBox: "0 0 24 24",
16593
- fill: "none",
16594
- stroke: "currentColor",
16595
- strokeWidth: "2",
16596
- strokeLinecap: "round",
16597
- strokeLinejoin: "round",
16598
- children: /* @__PURE__ */ jsx("polyline", { points: "18 15 12 9 6 15" })
16599
- }
16600
- )
16601
- }
16602
- ),
16603
- /* @__PURE__ */ jsx(
16604
- Input,
16605
- {
16606
- type: "text",
16607
- inputMode: "numeric",
16608
- value: minutes,
16609
- onChange: (e) => handleMinuteChange(e.target.value),
16610
- className: "w-16 text-center",
16611
- maxLength: 2
16612
- }
16613
- ),
16614
- /* @__PURE__ */ jsx(
16615
- Button,
16616
- {
16617
- variant: "ghost",
16618
- size: "icon",
16619
- className: "h-8 w-8",
16620
- onClick: decrementMinute,
16621
- type: "button",
16622
- children: /* @__PURE__ */ jsx(
16623
- "svg",
16624
- {
16625
- xmlns: "http://www.w3.org/2000/svg",
16626
- width: "16",
16627
- height: "16",
16628
- viewBox: "0 0 24 24",
16629
- fill: "none",
16630
- stroke: "currentColor",
16631
- strokeWidth: "2",
16632
- strokeLinecap: "round",
16633
- strokeLinejoin: "round",
16634
- children: /* @__PURE__ */ jsx("polyline", { points: "6 9 12 15 18 9" })
16635
- }
16636
- )
16637
- }
16638
- )
16639
- ] }),
16640
- !use24Hour && /* @__PURE__ */ jsxs(Fragment, { children: [
16641
- /* @__PURE__ */ jsx("div", { className: "w-px h-16 bg-border mx-1" }),
16642
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-1", children: [
16643
- /* @__PURE__ */ jsx(
16644
- Button,
16645
- {
16646
- variant: period === "AM" ? "default" : "outline",
16647
- size: "sm",
16648
- className: "w-14 h-12",
16649
- onClick: handlePeriodToggle,
16650
- type: "button",
16651
- children: "AM"
16652
- }
16653
- ),
16654
- /* @__PURE__ */ jsx(
16655
- Button,
16656
- {
16657
- variant: period === "PM" ? "default" : "outline",
16658
- size: "sm",
16659
- className: "w-14 h-12",
16660
- onClick: handlePeriodToggle,
16661
- type: "button",
16662
- children: "PM"
16663
- }
16664
- )
16665
- ] })
16666
- ] })
16667
- ] }) })
16668
- ] }),
16669
- showClear && /* @__PURE__ */ jsx(
16670
- ClearButton,
16671
- {
16672
- onClick: handleClear,
16673
- ariaLabel: clearAriaLabel,
16674
- className: "absolute right-2 top-1/2 -translate-y-1/2"
16675
- }
16676
- )
16677
- ] });
16678
- }
16679
- );
16680
- TimePicker.displayName = "TimePicker";
16681
16653
 
16682
16654
  // src/components/cropperModal/type.ts
16683
16655
  var CropperModalError = class extends Error {
@@ -18629,6 +18601,6 @@ function InputMentionInner({
18629
18601
  }
18630
18602
  var InputMention = forwardRef(InputMentionInner);
18631
18603
 
18632
- export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, dropdownMenu_default as ActionDropdown, ActionMenu, AdministrationIcon, AdvanceSearch_default as AdvanceSearch, AnalyticsIcon, ApplicationLogIcon, ArrowIcon, AuditFooter, BookmarkIcon, BriefcaseBusinessIcon, BuildingIcon, Button, SuiCalendarIcon2 as Calendar2Icon, CalendarDaysIcon, CardIcon, Carousel, CarouselContent, CarouselDots, CarouselItem, CarouselNext, CarouselPrevious, CarouselThumbnails, Checkbox, CircleUserIcon, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, Combobox_default as Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, CopyUserRightsIcon, CropperModal, CropperModalError, CustomActionStatusIcon, CustomFieldIcon, DIALOG_ALERT_I18N_SUBNAMESPACE, DIALOG_ALERT_TEMPLATES, DashboardIcon, DataEntryIcon, DataTable_default as DataTable, DatePicker2 as DatePicker, DecreaseIcon, Dialog2 as Dialog, DialogAlert, DialogAlertProvider, DialogClose, DialogCloseButton, DialogContent2 as DialogContent, DialogDescription2 as DialogDescription, DialogFooter, DialogHeader2 as DialogHeader, DialogTitle2 as DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EllipsisBoxIcon, ErrorCompression, ErrorCreateCanvas, ErrorGeneratingBlob, ErrorInvalidSVG, ErrorSVGExceedSize, FactoryIcon, FileCogIcon, FileSpreadsheet, FileTextIcon, FiltersIcon, FolderIcon, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, FormulaEditor, GridSettingsModal_default as GridSettingsModal, HamburgerMenuIcon, HandymanIcon, header_default as Header, HeaderCell_default as HeaderCell, HelpIcon, HomeIcon, HomePlusIcon, Image2 as Image, ImagePlaceholderIcon, InformationIcon, Input, InputMention, InputNumber_default as InputNumber, Label2 as Label, LoadingPage, LookupSelect, MailIcon, MainListContainer_default as MainListContainer, ManIcon, ManagementIcon, MenuIcon, MessageIcon, MessageIconInverse, MessageSquareIcon, MonthPicker2 as MonthPicker, navbar_default as Navbar, NotFoundIcon, OutlineArrowIcon, PlusIcon, PlusSearchIcon, Popover, PopoverAnchor, PopoverArrow, PopoverContent, PopoverTrigger, PowerIcon, PreventPageLeave_default as PreventPageLeave, ProgressBar_default as ProgressBar, QuestionIcon, RadioGroupItem, RadioGroupRoot, RadioLabel, RichText, RightPanelContainer_default as RightPanelContainer, RoleIcon, SearchIcon, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator3 as Separator, SetupIcon, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarLayout, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Spinner, SuiCalendarIcon, SuiCalendarIcon2, SuiCheckIcon, SuiDotsVerticalIcon, SuiEmptyDataIcon, SuiExpandIcon, SuiFilterIcon, SuiSettingIcon, SuiTriangleDownIcon, SuiWarningIcon, Switch, TabSelect, Table, TableBody, TableCaption, TableCell, TableContainer, TableFooter, TableHead, TableHeader, TableOfContents, TableRow, TagListViewIcon, TextArea, TimePicker, ToolBoxIcon, Tooltip2 as Tooltip, TooltipArrow, TooltipContent2 as TooltipContent, TooltipProvider2 as TooltipProvider, TooltipTrigger2 as TooltipTrigger, TransferUserRightsIcon, TrashIcon, truncated_default as Truncated, truncatedMouseEnterDiv_default as TruncatedMouseEnterDiv, ui_exports as UI, UserActiveIcon, UserAloneIcon, UserFriendIcon, UserGroupIcon, UserIcon, UserInactiveIcon, UserNameIcon, UserProtectIcon, UsersIcon, VirtualizedCommand_default as VirtualizedCommand, WorkFlowIcon, booleanToSelectValue, buildPrefixMap, buttonVariants, cn, compareAlphanumeric, debounce, defaultOperatorShortcuts, defaultOperators, formatISODate, getDialogAlertControls, inputVariants, isDefined, isEmptyObject, isValidParentheses, mapTokensToOutput, parseFormula, parseFormulaToToken, resetVisibleTableState, selectValueToBoolean, spinnerVariants, splitOperators, stripNullishObject, throttle, tokenizeFormulaString, useBindRef_default as useBindRef, useCarousel, useControllableState_default as useControllableState, useDraftGuardStore, useFormField, useGridSettingsStore_default as useGridSettingsStore, useHover_default as useHover, useIntersectionObserver_default as useIntersectionObserver, useIsomorphicLayoutEffect, useMediaQuery_default as useMediaQuery, usePreventPageLeave_default as usePreventPageLeave, usePreventPageLeaveStore_default as usePreventPageLeaveStore, useSafeBlocker, useScreenSize_default as useScreenSize, useSidebar, useTruncated_default as useTruncated, validateTokenPrefixes };
18604
+ export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, dropdownMenu_default as ActionDropdown, ActionMenu, AdministrationIcon, AdvanceSearch_default as AdvanceSearch, AnalyticsIcon, ApplicationLogIcon, ArrowIcon, AuditFooter, BookmarkIcon, BriefcaseBusinessIcon, BuildingIcon, Button, SuiCalendarIcon2 as Calendar2Icon, CalendarDaysIcon, CardIcon, Carousel, CarouselContent, CarouselDots, CarouselItem, CarouselNext, CarouselPrevious, CarouselThumbnails, Checkbox, CircleUserIcon, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, Combobox_default as Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, CopyUserRightsIcon, CropperModal, CropperModalError, CustomActionStatusIcon, CustomFieldIcon, DIALOG_ALERT_I18N_SUBNAMESPACE, DIALOG_ALERT_TEMPLATES, DashboardIcon, DataEntryIcon, DataTable_default as DataTable, DatePicker2 as DatePicker, DateTimePicker, DecreaseIcon, Dialog2 as Dialog, DialogAlert, DialogAlertProvider, DialogClose, DialogCloseButton, DialogContent2 as DialogContent, DialogDescription2 as DialogDescription, DialogFooter, DialogHeader2 as DialogHeader, DialogTitle2 as DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EllipsisBoxIcon, ErrorCompression, ErrorCreateCanvas, ErrorGeneratingBlob, ErrorInvalidSVG, ErrorSVGExceedSize, FactoryIcon, FileCogIcon, FileSpreadsheet, FileTextIcon, FiltersIcon, FolderIcon, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, FormulaEditor, GridSettingsModal_default as GridSettingsModal, HamburgerMenuIcon, HandymanIcon, header_default as Header, HeaderCell_default as HeaderCell, HelpIcon, HomeIcon, HomePlusIcon, Image2 as Image, ImagePlaceholderIcon, InformationIcon, Input, InputMention, InputNumber_default as InputNumber, Label2 as Label, LoadingPage, LookupSelect, MailIcon, MainListContainer_default as MainListContainer, ManIcon, ManagementIcon, MenuIcon, MessageIcon, MessageIconInverse, MessageSquareIcon, MonthPicker2 as MonthPicker, navbar_default as Navbar, NotFoundIcon, OutlineArrowIcon, PlusIcon, PlusSearchIcon, Popover, PopoverAnchor, PopoverArrow, PopoverContent, PopoverTrigger, PowerIcon, PreventPageLeave_default as PreventPageLeave, ProgressBar_default as ProgressBar, QuestionIcon, RadioGroupItem, RadioGroupRoot, RadioLabel, RichText, RightPanelContainer_default as RightPanelContainer, RoleIcon, SearchIcon, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator3 as Separator, SetupIcon, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarLayout, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Spinner, SuiCalendarIcon, SuiCalendarIcon2, SuiCheckIcon, SuiDotsVerticalIcon, SuiEmptyDataIcon, SuiExpandIcon, SuiFilterIcon, SuiSettingIcon, SuiTriangleDownIcon, SuiWarningIcon, Switch, TabSelect, Table, TableBody, TableCaption, TableCell, TableContainer, TableFooter, TableHead, TableHeader, TableOfContents, TableRow, TagListViewIcon, TextArea, ToolBoxIcon, Tooltip2 as Tooltip, TooltipArrow, TooltipContent2 as TooltipContent, TooltipProvider2 as TooltipProvider, TooltipTrigger2 as TooltipTrigger, TransferUserRightsIcon, TrashIcon, truncated_default as Truncated, truncatedMouseEnterDiv_default as TruncatedMouseEnterDiv, ui_exports as UI, UserActiveIcon, UserAloneIcon, UserFriendIcon, UserGroupIcon, UserIcon, UserInactiveIcon, UserNameIcon, UserProtectIcon, UsersIcon, VirtualizedCommand_default as VirtualizedCommand, WorkFlowIcon, booleanToSelectValue, buildPrefixMap, buttonVariants, cn, compareAlphanumeric, debounce, defaultOperatorShortcuts, defaultOperators, formatISODate, getDialogAlertControls, inputVariants, isDefined, isEmptyObject, isValidParentheses, mapTokensToOutput, parseFormula, parseFormulaToToken, resetVisibleTableState, selectValueToBoolean, spinnerVariants, splitOperators, stripNullishObject, throttle, tokenizeFormulaString, useBindRef_default as useBindRef, useCarousel, useControllableState_default as useControllableState, useDraftGuardStore, useFormField, useGridSettingsStore_default as useGridSettingsStore, useHover_default as useHover, useIntersectionObserver_default as useIntersectionObserver, useIsomorphicLayoutEffect, useMediaQuery_default as useMediaQuery, usePreventPageLeave_default as usePreventPageLeave, usePreventPageLeaveStore_default as usePreventPageLeaveStore, useSafeBlocker, useScreenSize_default as useScreenSize, useSidebar, useTruncated_default as useTruncated, validateTokenPrefixes };
18633
18605
  //# sourceMappingURL=index.mjs.map
18634
18606
  //# sourceMappingURL=index.mjs.map