@homebound/beam 3.1.0-alpha.1 → 3.1.0-alpha.2
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.cjs +221 -149
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +27 -24
- package/dist/index.d.ts +27 -24
- package/dist/index.js +205 -134
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -219,6 +219,7 @@ __export(index_exports, {
|
|
|
219
219
|
filterTestIdPrefix: () => filterTestIdPrefix,
|
|
220
220
|
formatDate: () => formatDate,
|
|
221
221
|
formatDateRange: () => formatDateRange,
|
|
222
|
+
formatPlainDate: () => formatPlainDate,
|
|
222
223
|
formatValue: () => formatValue,
|
|
223
224
|
generateColumnId: () => generateColumnId,
|
|
224
225
|
getAlignment: () => getAlignment,
|
|
@@ -6410,6 +6411,107 @@ var import_react_stately7 = require("react-stately");
|
|
|
6410
6411
|
// src/components/internal/DatePicker/DatePicker.tsx
|
|
6411
6412
|
var import_react_day_picker3 = require("react-day-picker");
|
|
6412
6413
|
|
|
6414
|
+
// src/utils/plainDate.ts
|
|
6415
|
+
var import_temporal_polyfill = require("temporal-polyfill");
|
|
6416
|
+
function jsDateToPlainDate(date) {
|
|
6417
|
+
return new import_temporal_polyfill.Temporal.PlainDate(date.getFullYear(), date.getMonth() + 1, date.getDate());
|
|
6418
|
+
}
|
|
6419
|
+
function formatPlainDate(date, format) {
|
|
6420
|
+
switch (format) {
|
|
6421
|
+
case "shortDate":
|
|
6422
|
+
return date.toLocaleString("en-US", { month: "2-digit", day: "2-digit", year: "2-digit" });
|
|
6423
|
+
case "date":
|
|
6424
|
+
return date.toLocaleString("en-US", { month: "2-digit", day: "2-digit", year: "numeric" });
|
|
6425
|
+
case "shortWeekdayMonthDay":
|
|
6426
|
+
return date.toLocaleString("en-US", { weekday: "short", month: "short", day: "numeric" });
|
|
6427
|
+
case "longWeekdayMonthDayYear":
|
|
6428
|
+
return `${date.toLocaleString("en-US", { weekday: "long" })} ${date.toLocaleString("en-US", { month: "long" })} ${date.day}, ${formatYear(date.year)}`;
|
|
6429
|
+
case "monthYear":
|
|
6430
|
+
return date.toLocaleString("en-US", { month: "long", year: "numeric" });
|
|
6431
|
+
case "shortMonth":
|
|
6432
|
+
return date.toLocaleString("en-US", { month: "short" });
|
|
6433
|
+
case "year":
|
|
6434
|
+
return formatYear(date.year);
|
|
6435
|
+
case "weekdayInitial":
|
|
6436
|
+
return date.toLocaleString("en-US", { weekday: "narrow" });
|
|
6437
|
+
case "weekday":
|
|
6438
|
+
return date.toLocaleString("en-US", { weekday: "long" });
|
|
6439
|
+
default:
|
|
6440
|
+
throw new Error(`Unsupported date format: ${format}`);
|
|
6441
|
+
}
|
|
6442
|
+
}
|
|
6443
|
+
function todayPlainDate() {
|
|
6444
|
+
return import_temporal_polyfill.Temporal.Now.plainDateISO();
|
|
6445
|
+
}
|
|
6446
|
+
function isPlainDate(value) {
|
|
6447
|
+
return value instanceof import_temporal_polyfill.Temporal.PlainDate;
|
|
6448
|
+
}
|
|
6449
|
+
function parsePersistedPlainDate(value) {
|
|
6450
|
+
if (isPlainDate(value)) return value;
|
|
6451
|
+
if (value instanceof Date && !Number.isNaN(value.getTime())) {
|
|
6452
|
+
return jsDateToPlainDate(value);
|
|
6453
|
+
}
|
|
6454
|
+
if (typeof value !== "string") return void 0;
|
|
6455
|
+
try {
|
|
6456
|
+
if (/^\d{4}-\d{2}-\d{2}$/.test(value)) {
|
|
6457
|
+
return import_temporal_polyfill.Temporal.PlainDate.from(value);
|
|
6458
|
+
}
|
|
6459
|
+
} catch {
|
|
6460
|
+
return void 0;
|
|
6461
|
+
}
|
|
6462
|
+
const date = new Date(value);
|
|
6463
|
+
return Number.isNaN(date.getTime()) ? void 0 : jsDateToPlainDate(date);
|
|
6464
|
+
}
|
|
6465
|
+
function dehydratePlainDate(value) {
|
|
6466
|
+
return value?.toString();
|
|
6467
|
+
}
|
|
6468
|
+
function padNumber(value, length) {
|
|
6469
|
+
return Math.abs(value).toString().padStart(length, "0");
|
|
6470
|
+
}
|
|
6471
|
+
function formatYear(year) {
|
|
6472
|
+
return `${year < 0 ? "-" : ""}${padNumber(year, 4)}`;
|
|
6473
|
+
}
|
|
6474
|
+
|
|
6475
|
+
// src/components/internal/DatePicker/dates.ts
|
|
6476
|
+
function plainDateToJsDate(date) {
|
|
6477
|
+
return new Date(date.year, date.month - 1, date.day, 12);
|
|
6478
|
+
}
|
|
6479
|
+
function dateRangeToJsDateRange(range) {
|
|
6480
|
+
if (!range) return void 0;
|
|
6481
|
+
return {
|
|
6482
|
+
from: range.from ? plainDateToJsDate(range.from) : void 0,
|
|
6483
|
+
to: range.to ? plainDateToJsDate(range.to) : void 0
|
|
6484
|
+
};
|
|
6485
|
+
}
|
|
6486
|
+
function jsDateRangeToDateRange(range) {
|
|
6487
|
+
if (!range) return void 0;
|
|
6488
|
+
return {
|
|
6489
|
+
from: range.from ? jsDateToPlainDate(range.from) : void 0,
|
|
6490
|
+
to: range.to ? jsDateToPlainDate(range.to) : void 0
|
|
6491
|
+
};
|
|
6492
|
+
}
|
|
6493
|
+
function dateMatcherToDayPickerMatcher(matcher) {
|
|
6494
|
+
if (typeof matcher === "function") {
|
|
6495
|
+
return function dayPickerMatcher(date) {
|
|
6496
|
+
return matcher(jsDateToPlainDate(date));
|
|
6497
|
+
};
|
|
6498
|
+
}
|
|
6499
|
+
if (Array.isArray(matcher)) {
|
|
6500
|
+
return matcher.map(plainDateToJsDate);
|
|
6501
|
+
}
|
|
6502
|
+
if (isPlainDate(matcher)) {
|
|
6503
|
+
return plainDateToJsDate(matcher);
|
|
6504
|
+
}
|
|
6505
|
+
return {
|
|
6506
|
+
from: matcher.from ? plainDateToJsDate(matcher.from) : void 0,
|
|
6507
|
+
to: matcher.to ? plainDateToJsDate(matcher.to) : void 0
|
|
6508
|
+
};
|
|
6509
|
+
}
|
|
6510
|
+
function dateMatchersToDayPickerMatchers(matchers) {
|
|
6511
|
+
if (matchers === void 0) return void 0;
|
|
6512
|
+
return Array.isArray(matchers) ? matchers.map(dateMatcherToDayPickerMatcher) : dateMatcherToDayPickerMatcher(matchers);
|
|
6513
|
+
}
|
|
6514
|
+
|
|
6413
6515
|
// src/components/internal/DatePicker/Day.tsx
|
|
6414
6516
|
var import_react21 = require("react");
|
|
6415
6517
|
var import_react_day_picker = require("react-day-picker");
|
|
@@ -6551,11 +6653,12 @@ function Header(props) {
|
|
|
6551
6653
|
const {
|
|
6552
6654
|
displayMonth
|
|
6553
6655
|
} = props;
|
|
6656
|
+
const displayMonthDate = jsDateToPlainDate(displayMonth);
|
|
6554
6657
|
const {
|
|
6555
6658
|
goToMonth
|
|
6556
6659
|
} = (0, import_react_day_picker2.useNavigation)();
|
|
6557
6660
|
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "df jcsb aic ml_12px mr_2px h_32px", children: [
|
|
6558
|
-
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("h1", { className: "fw4 fz_16px lh_24px", children: (
|
|
6661
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("h1", { className: "fw4 fz_16px lh_24px", children: formatPlainDate(displayMonthDate, "monthYear") }),
|
|
6559
6662
|
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { children: [
|
|
6560
6663
|
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(IconButton, { color: "rgba(100, 100, 100, 1)" /* Gray700 */, icon: "chevronLeft", onClick: () => goToMonth((0, import_date_fns.addMonths)(displayMonth, -1)) }),
|
|
6561
6664
|
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(IconButton, { color: "rgba(100, 100, 100, 1)" /* Gray700 */, icon: "chevronRight", onClick: () => goToMonth((0, import_date_fns.addMonths)(displayMonth, 1)) })
|
|
@@ -6566,91 +6669,41 @@ function YearSkipHeader(props) {
|
|
|
6566
6669
|
const {
|
|
6567
6670
|
displayMonth
|
|
6568
6671
|
} = props;
|
|
6672
|
+
const displayMonthDate = jsDateToPlainDate(displayMonth);
|
|
6569
6673
|
const {
|
|
6570
6674
|
goToMonth
|
|
6571
6675
|
} = (0, import_react_day_picker2.useNavigation)();
|
|
6572
6676
|
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "df jcsb aic ml_12px mr_12px h_32px", children: [
|
|
6573
6677
|
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "df fdr jcsb", children: [
|
|
6574
6678
|
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(IconButton, { color: "rgba(100, 100, 100, 1)" /* Gray700 */, icon: "chevronLeft", onClick: () => goToMonth((0, import_date_fns.addMonths)(displayMonth, -1)) }),
|
|
6575
|
-
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("h1", { className: "fw4 fz_16px lh_24px", children: (
|
|
6679
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("h1", { className: "fw4 fz_16px lh_24px", children: formatPlainDate(displayMonthDate, "shortMonth") }),
|
|
6576
6680
|
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(IconButton, { color: "rgba(100, 100, 100, 1)" /* Gray700 */, icon: "chevronRight", onClick: () => goToMonth((0, import_date_fns.addMonths)(displayMonth, 1)) })
|
|
6577
6681
|
] }),
|
|
6578
6682
|
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "df fdr jcsb", children: [
|
|
6579
6683
|
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(IconButton, { color: "rgba(100, 100, 100, 1)" /* Gray700 */, icon: "chevronLeft", onClick: () => goToMonth((0, import_date_fns.addYears)(displayMonth, -1)) }),
|
|
6580
|
-
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("h1", { className: "fw4 fz_16px lh_24px", children: (
|
|
6684
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("h1", { className: "fw4 fz_16px lh_24px", children: formatPlainDate(displayMonthDate, "year") }),
|
|
6581
6685
|
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(IconButton, { color: "rgba(100, 100, 100, 1)" /* Gray700 */, icon: "chevronRight", onClick: () => goToMonth((0, import_date_fns.addYears)(displayMonth, 1)) })
|
|
6582
6686
|
] })
|
|
6583
6687
|
] });
|
|
6584
6688
|
}
|
|
6585
6689
|
|
|
6586
6690
|
// src/components/internal/DatePicker/WeekHeader.tsx
|
|
6587
|
-
var import_date_fns2 = require("date-fns");
|
|
6588
6691
|
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
6589
6692
|
function WeekHeader() {
|
|
6590
|
-
const
|
|
6693
|
+
const today = todayPlainDate();
|
|
6694
|
+
const start = today.subtract({
|
|
6695
|
+
days: today.dayOfWeek % 7
|
|
6696
|
+
});
|
|
6591
6697
|
const days = [];
|
|
6592
6698
|
for (let i = 0; i < 7; i++) {
|
|
6593
|
-
days.push(
|
|
6699
|
+
days.push(start.add({
|
|
6700
|
+
days: i
|
|
6701
|
+
}));
|
|
6594
6702
|
}
|
|
6595
6703
|
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("thead", { className: "rdp-head", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("tr", { className: "rdp-head_row", children: days.map((day) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("th", { scope: "col", className: "pt1 pb_12px pr1 pl1 fw4 fz_12px lh_16px gray400", children: [
|
|
6596
|
-
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { "aria-hidden": "true", children: (
|
|
6597
|
-
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "rdp-vhidden", children: (
|
|
6598
|
-
] }, (
|
|
6599
|
-
}
|
|
6600
|
-
|
|
6601
|
-
// src/utils/plainDate.ts
|
|
6602
|
-
var import_temporal_polyfill = require("temporal-polyfill");
|
|
6603
|
-
function plainDateToJsDate(date) {
|
|
6604
|
-
return new Date(date.year, date.month - 1, date.day, 12);
|
|
6605
|
-
}
|
|
6606
|
-
function jsDateToPlainDate(date) {
|
|
6607
|
-
return new import_temporal_polyfill.Temporal.PlainDate(date.getFullYear(), date.getMonth() + 1, date.getDate());
|
|
6608
|
-
}
|
|
6609
|
-
function dateRangeToJsDateRange(range) {
|
|
6610
|
-
if (!range) return void 0;
|
|
6611
|
-
return {
|
|
6612
|
-
from: range.from ? plainDateToJsDate(range.from) : void 0,
|
|
6613
|
-
to: range.to ? plainDateToJsDate(range.to) : void 0
|
|
6614
|
-
};
|
|
6615
|
-
}
|
|
6616
|
-
function jsDateRangeToDateRange(range) {
|
|
6617
|
-
if (!range) return void 0;
|
|
6618
|
-
return {
|
|
6619
|
-
from: range.from ? jsDateToPlainDate(range.from) : void 0,
|
|
6620
|
-
to: range.to ? jsDateToPlainDate(range.to) : void 0
|
|
6621
|
-
};
|
|
6622
|
-
}
|
|
6623
|
-
function dayMatcherToDayPickerMatcher(matcher) {
|
|
6624
|
-
return (date) => matcher(jsDateToPlainDate(date));
|
|
6625
|
-
}
|
|
6626
|
-
function dayMatchersToDayPickerMatchers(matchers) {
|
|
6627
|
-
if (matchers === void 0) return void 0;
|
|
6628
|
-
return Array.isArray(matchers) ? matchers.map(dayMatcherToDayPickerMatcher) : dayMatcherToDayPickerMatcher(matchers);
|
|
6629
|
-
}
|
|
6630
|
-
function todayPlainDate() {
|
|
6631
|
-
return import_temporal_polyfill.Temporal.Now.plainDateISO();
|
|
6632
|
-
}
|
|
6633
|
-
function isPlainDate(value) {
|
|
6634
|
-
return value instanceof import_temporal_polyfill.Temporal.PlainDate;
|
|
6635
|
-
}
|
|
6636
|
-
function parsePersistedPlainDate(value) {
|
|
6637
|
-
if (isPlainDate(value)) return value;
|
|
6638
|
-
if (value instanceof Date && !Number.isNaN(value.getTime())) {
|
|
6639
|
-
return jsDateToPlainDate(value);
|
|
6640
|
-
}
|
|
6641
|
-
if (typeof value !== "string") return void 0;
|
|
6642
|
-
try {
|
|
6643
|
-
if (/^\d{4}-\d{2}-\d{2}$/.test(value)) {
|
|
6644
|
-
return import_temporal_polyfill.Temporal.PlainDate.from(value);
|
|
6645
|
-
}
|
|
6646
|
-
} catch {
|
|
6647
|
-
return void 0;
|
|
6648
|
-
}
|
|
6649
|
-
const date = new Date(value);
|
|
6650
|
-
return Number.isNaN(date.getTime()) ? void 0 : jsDateToPlainDate(date);
|
|
6651
|
-
}
|
|
6652
|
-
function dehydratePlainDate(value) {
|
|
6653
|
-
return value?.toString();
|
|
6704
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { "aria-hidden": "true", children: formatPlainDate(day, "weekdayInitial") }),
|
|
6705
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "rdp-vhidden", children: formatPlainDate(day, "weekday") })
|
|
6706
|
+
] }, formatPlainDate(day, "weekday"))) }) });
|
|
6654
6707
|
}
|
|
6655
6708
|
|
|
6656
6709
|
// src/components/internal/DatePicker/DatePicker.tsx
|
|
@@ -6678,9 +6731,9 @@ function DatePicker(props) {
|
|
|
6678
6731
|
if (modifiers.disabled) return;
|
|
6679
6732
|
onSelect(jsDateToPlainDate(day));
|
|
6680
6733
|
},
|
|
6681
|
-
disabled:
|
|
6734
|
+
disabled: dateMatchersToDayPickerMatchers(disabledDays),
|
|
6682
6735
|
modifiers: {
|
|
6683
|
-
indicatorDot:
|
|
6736
|
+
indicatorDot: dateMatchersToDayPickerMatchers(dottedDays) ?? []
|
|
6684
6737
|
}
|
|
6685
6738
|
}
|
|
6686
6739
|
) });
|
|
@@ -6714,8 +6767,8 @@ function DateRangePicker(props) {
|
|
|
6714
6767
|
}, defaultMonth: plainDateToJsDate(range?.to ?? range?.from ?? todayPlainDate()), onSelect: (selection, day, activeModifiers) => {
|
|
6715
6768
|
if (activeModifiers.disabled) return;
|
|
6716
6769
|
onSelect(jsDateRangeToDateRange(selection));
|
|
6717
|
-
}, disabled:
|
|
6718
|
-
indicatorDot:
|
|
6770
|
+
}, disabled: dateMatchersToDayPickerMatchers(disabledDays), modifiers: {
|
|
6771
|
+
indicatorDot: dateMatchersToDayPickerMatchers(dottedDays) ?? []
|
|
6719
6772
|
} }) });
|
|
6720
6773
|
}
|
|
6721
6774
|
|
|
@@ -12539,69 +12592,36 @@ function CheckboxGroupItem(props) {
|
|
|
12539
12592
|
}
|
|
12540
12593
|
|
|
12541
12594
|
// src/inputs/DateFields/DateField.mock.tsx
|
|
12542
|
-
var import_date_fns3 = require("date-fns");
|
|
12543
12595
|
var import_react50 = require("react");
|
|
12544
|
-
var import_jsx_runtime60 = require("react/jsx-runtime");
|
|
12545
|
-
function DateFieldMock(props) {
|
|
12546
|
-
const { onChange = () => {
|
|
12547
|
-
}, errorMsg, onBlur, onFocus } = props;
|
|
12548
|
-
const [value, setValue] = (0, import_react50.useState)(props.value ? (0, import_date_fns3.format)(plainDateToJsDate(props.value), "MM/dd/yy") : "");
|
|
12549
|
-
const tid = useTestIds(props, "date");
|
|
12550
|
-
return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
12551
|
-
"input",
|
|
12552
|
-
{
|
|
12553
|
-
...tid,
|
|
12554
|
-
"data-error": !!errorMsg,
|
|
12555
|
-
value,
|
|
12556
|
-
onChange: (e) => {
|
|
12557
|
-
const { value: value2 } = e.target;
|
|
12558
|
-
setValue(value2);
|
|
12559
|
-
const parsed = (0, import_date_fns3.parse)(value2, "MM/dd/yy", plainDateToJsDate(todayPlainDate()));
|
|
12560
|
-
onChange(Number.isNaN(parsed.getTime()) ? void 0 : jsDateToPlainDate(parsed));
|
|
12561
|
-
},
|
|
12562
|
-
onBlur: () => maybeCall(onBlur),
|
|
12563
|
-
onFocus: () => maybeCall(onFocus),
|
|
12564
|
-
disabled: !!props.disabled,
|
|
12565
|
-
readOnly: !!props.readOnly,
|
|
12566
|
-
"data-disabled-days": JSON.stringify(props.disabledDays)
|
|
12567
|
-
}
|
|
12568
|
-
);
|
|
12569
|
-
}
|
|
12570
|
-
|
|
12571
|
-
// src/inputs/DateFields/DateFieldBase.tsx
|
|
12572
|
-
var import_react51 = require("react");
|
|
12573
|
-
var import_react_aria31 = require("react-aria");
|
|
12574
|
-
var import_react_stately10 = require("react-stately");
|
|
12575
12596
|
|
|
12576
12597
|
// src/inputs/DateFields/utils.ts
|
|
12577
|
-
var import_date_fns4 = require("date-fns");
|
|
12578
12598
|
var import_temporal_polyfill2 = require("temporal-polyfill");
|
|
12579
12599
|
var dateFormats = {
|
|
12580
|
-
short: "
|
|
12581
|
-
medium: "
|
|
12582
|
-
long: "
|
|
12600
|
+
short: "shortDate",
|
|
12601
|
+
medium: "shortWeekdayMonthDay",
|
|
12602
|
+
long: "longWeekdayMonthDayYear"
|
|
12583
12603
|
};
|
|
12584
|
-
function getDateFormat(
|
|
12585
|
-
return
|
|
12604
|
+
function getDateFormat(format) {
|
|
12605
|
+
return format ? dateFormats[format] : dateFormats.short;
|
|
12586
12606
|
}
|
|
12587
|
-
function formatDate(date,
|
|
12607
|
+
function formatDate(date, format) {
|
|
12588
12608
|
if (!date) return "";
|
|
12589
|
-
return (
|
|
12609
|
+
return formatPlainDate(date, format);
|
|
12590
12610
|
}
|
|
12591
|
-
function formatDateRange(date,
|
|
12611
|
+
function formatDateRange(date, format) {
|
|
12592
12612
|
if (!date) return "";
|
|
12593
12613
|
const { from, to } = date;
|
|
12594
|
-
const fromFormatted = from ? (
|
|
12595
|
-
const toFormatted = to ? (
|
|
12614
|
+
const fromFormatted = from ? formatPlainDate(from, format) : "";
|
|
12615
|
+
const toFormatted = to ? formatPlainDate(to, format) : "";
|
|
12596
12616
|
return !fromFormatted && !toFormatted ? void 0 : `${fromFormatted} - ${toFormatted}`;
|
|
12597
12617
|
}
|
|
12598
|
-
function parseDate(str,
|
|
12599
|
-
return parseDateString(str,
|
|
12618
|
+
function parseDate(str, format) {
|
|
12619
|
+
return parseDateString(str, format);
|
|
12600
12620
|
}
|
|
12601
|
-
function parseDateRange(str,
|
|
12621
|
+
function parseDateRange(str, format) {
|
|
12602
12622
|
const [from = "", to = ""] = str.split("-");
|
|
12603
|
-
const fromDate = parseDateString(from.trim(),
|
|
12604
|
-
const toDate = parseDateString(to.trim(),
|
|
12623
|
+
const fromDate = parseDateString(from.trim(), format);
|
|
12624
|
+
const toDate = parseDateString(to.trim(), format);
|
|
12605
12625
|
if (toDate && fromDate && import_temporal_polyfill2.Temporal.PlainDate.compare(toDate, fromDate) < 0) {
|
|
12606
12626
|
return { from: toDate, to: fromDate };
|
|
12607
12627
|
}
|
|
@@ -12610,34 +12630,81 @@ function parseDateRange(str, format4) {
|
|
|
12610
12630
|
}
|
|
12611
12631
|
return { from: fromDate, to: toDate };
|
|
12612
12632
|
}
|
|
12613
|
-
function parseDateString(str,
|
|
12633
|
+
function parseDateString(str, format) {
|
|
12634
|
+
if (format !== dateFormats.short && format !== "date") {
|
|
12635
|
+
return void 0;
|
|
12636
|
+
}
|
|
12614
12637
|
const split = str.split("/");
|
|
12615
12638
|
if (split.length !== 3) {
|
|
12616
12639
|
return void 0;
|
|
12617
12640
|
}
|
|
12618
|
-
|
|
12641
|
+
const yearLength = format === dateFormats.short ? 2 : 4;
|
|
12642
|
+
if (split[2].length !== yearLength) {
|
|
12619
12643
|
return void 0;
|
|
12620
12644
|
}
|
|
12621
|
-
const month = parseInt(split[0], 10)
|
|
12645
|
+
const month = parseInt(split[0], 10);
|
|
12622
12646
|
const day = parseInt(split[1], 10);
|
|
12623
12647
|
const year = parseInt(split[2], 10);
|
|
12624
|
-
if (isNaN(year) ||
|
|
12648
|
+
if (Number.isNaN(year) || Number.isNaN(month) || Number.isNaN(day) || day <= 0 || day > 31 || month <= 0 || month > 12) {
|
|
12625
12649
|
return void 0;
|
|
12626
12650
|
}
|
|
12627
|
-
|
|
12628
|
-
|
|
12651
|
+
try {
|
|
12652
|
+
return import_temporal_polyfill2.Temporal.PlainDate.from({
|
|
12653
|
+
year: yearLength === 2 ? normalizeTwoDigitYear(year, todayPlainDate().year) : year,
|
|
12654
|
+
month,
|
|
12655
|
+
day
|
|
12656
|
+
});
|
|
12657
|
+
} catch {
|
|
12629
12658
|
return void 0;
|
|
12630
12659
|
}
|
|
12631
|
-
return jsDateToPlainDate(parsed);
|
|
12632
12660
|
}
|
|
12633
12661
|
function isValidDate(d) {
|
|
12634
12662
|
return d !== void 0 && isPlainDate(d);
|
|
12635
12663
|
}
|
|
12636
|
-
function
|
|
12637
|
-
|
|
12664
|
+
function normalizeTwoDigitYear(twoDigitYear, currentYear) {
|
|
12665
|
+
const isCommonEra = currentYear > 0;
|
|
12666
|
+
const absCurrentYear = isCommonEra ? currentYear : 1 - currentYear;
|
|
12667
|
+
if (absCurrentYear <= 50) {
|
|
12668
|
+
return isCommonEra ? twoDigitYear || 100 : 1 - (twoDigitYear || 100);
|
|
12669
|
+
}
|
|
12670
|
+
const rangeEnd = absCurrentYear + 50;
|
|
12671
|
+
const rangeEndCentury = Math.floor(rangeEnd / 100) * 100;
|
|
12672
|
+
const isPreviousCentury = twoDigitYear >= rangeEnd % 100;
|
|
12673
|
+
const normalizedYear = twoDigitYear + rangeEndCentury - (isPreviousCentury ? 100 : 0);
|
|
12674
|
+
return isCommonEra ? normalizedYear : 1 - normalizedYear;
|
|
12675
|
+
}
|
|
12676
|
+
|
|
12677
|
+
// src/inputs/DateFields/DateField.mock.tsx
|
|
12678
|
+
var import_jsx_runtime60 = require("react/jsx-runtime");
|
|
12679
|
+
function DateFieldMock(props) {
|
|
12680
|
+
const { onChange = () => {
|
|
12681
|
+
}, errorMsg, onBlur, onFocus } = props;
|
|
12682
|
+
const [value, setValue] = (0, import_react50.useState)(formatDate(props.value, dateFormats.short));
|
|
12683
|
+
const tid = useTestIds(props, "date");
|
|
12684
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
12685
|
+
"input",
|
|
12686
|
+
{
|
|
12687
|
+
...tid,
|
|
12688
|
+
"data-error": !!errorMsg,
|
|
12689
|
+
value,
|
|
12690
|
+
onChange: (e) => {
|
|
12691
|
+
const { value: value2 } = e.target;
|
|
12692
|
+
setValue(value2);
|
|
12693
|
+
onChange(parseDate(value2, dateFormats.short));
|
|
12694
|
+
},
|
|
12695
|
+
onBlur: () => maybeCall(onBlur),
|
|
12696
|
+
onFocus: () => maybeCall(onFocus),
|
|
12697
|
+
disabled: !!props.disabled,
|
|
12698
|
+
readOnly: !!props.readOnly,
|
|
12699
|
+
"data-disabled-days": JSON.stringify(props.disabledDays)
|
|
12700
|
+
}
|
|
12701
|
+
);
|
|
12638
12702
|
}
|
|
12639
12703
|
|
|
12640
12704
|
// src/inputs/DateFields/DateFieldBase.tsx
|
|
12705
|
+
var import_react51 = require("react");
|
|
12706
|
+
var import_react_aria31 = require("react-aria");
|
|
12707
|
+
var import_react_stately10 = require("react-stately");
|
|
12641
12708
|
var import_runtime43 = require("@homebound/truss/runtime");
|
|
12642
12709
|
var import_jsx_runtime61 = require("react/jsx-runtime");
|
|
12643
12710
|
function DateFieldBase(props) {
|
|
@@ -12653,7 +12720,7 @@ function DateFieldBase(props) {
|
|
|
12653
12720
|
errorMsg,
|
|
12654
12721
|
helperText,
|
|
12655
12722
|
readOnly,
|
|
12656
|
-
format
|
|
12723
|
+
format = "short",
|
|
12657
12724
|
iconLeft = false,
|
|
12658
12725
|
hideCalendarIcon = false,
|
|
12659
12726
|
disabledDays,
|
|
@@ -12670,7 +12737,7 @@ function DateFieldBase(props) {
|
|
|
12670
12737
|
const buttonRef = (0, import_react51.useRef)(null);
|
|
12671
12738
|
const overlayRef = (0, import_react51.useRef)(null);
|
|
12672
12739
|
const isFocused = (0, import_react51.useRef)(false);
|
|
12673
|
-
const dateFormat = getDateFormat(
|
|
12740
|
+
const dateFormat = getDateFormat(format);
|
|
12674
12741
|
const [wipValue, setWipValue] = (0, import_react51.useState)(value);
|
|
12675
12742
|
const [inputValue, setInputValue] = (0, import_react51.useState)((isRangeMode ? formatDateRange(props.value, dateFormat) : formatDate(props.value, dateFormat)) ?? "");
|
|
12676
12743
|
const tid = useTestIds(props, defaultTestId(label));
|
|
@@ -12768,7 +12835,11 @@ function DateFieldBase(props) {
|
|
|
12768
12835
|
return;
|
|
12769
12836
|
}
|
|
12770
12837
|
} else {
|
|
12771
|
-
|
|
12838
|
+
if (isRangeMode) {
|
|
12839
|
+
props.onChange(void 0);
|
|
12840
|
+
} else {
|
|
12841
|
+
props.onChange(void 0);
|
|
12842
|
+
}
|
|
12772
12843
|
return;
|
|
12773
12844
|
}
|
|
12774
12845
|
},
|
|
@@ -12776,7 +12847,7 @@ function DateFieldBase(props) {
|
|
|
12776
12847
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
12777
12848
|
[isRangeMode, props.onChange]
|
|
12778
12849
|
);
|
|
12779
|
-
const inputSize = !isRangeMode ?
|
|
12850
|
+
const inputSize = !isRangeMode ? format === "short" ? 8 : format === "medium" ? 10 : void 0 : void 0;
|
|
12780
12851
|
const clearButton = /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_jsx_runtime61.Fragment, { children: inputValue !== "" && !state.isOpen && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(IconButton, { icon: "xCircle", color: "rgba(100, 100, 100, 1)" /* Gray700 */, onClick: () => {
|
|
12781
12852
|
setInputValue("");
|
|
12782
12853
|
onChange(void 0);
|
|
@@ -15358,7 +15429,7 @@ function useScrollStorage(tableId, enabled = true) {
|
|
|
15358
15429
|
}
|
|
15359
15430
|
|
|
15360
15431
|
// src/components/Table/hooks/useSetupColumnSizes.ts
|
|
15361
|
-
var
|
|
15432
|
+
var import_utils67 = require("@react-aria/utils");
|
|
15362
15433
|
var import_react70 = require("react");
|
|
15363
15434
|
|
|
15364
15435
|
// src/components/Table/hooks/useColumnResizing.ts
|
|
@@ -15482,7 +15553,7 @@ function useSetupColumnSizes(style, columns, resizeRef, expandedColumnIds, visib
|
|
|
15482
15553
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
15483
15554
|
[tableWidth, setTableAndColumnWidths, setTableAndColumnWidthsDebounced]
|
|
15484
15555
|
);
|
|
15485
|
-
(0,
|
|
15556
|
+
(0, import_utils67.useResizeObserver)({ ref: resizeRef, onResize });
|
|
15486
15557
|
return { columnSizes, tableWidth, resizedWidths, setResizedWidth, setResizedWidths, resetColumnWidths };
|
|
15487
15558
|
}
|
|
15488
15559
|
|
|
@@ -16075,7 +16146,7 @@ function ToggleChips(props) {
|
|
|
16075
16146
|
}
|
|
16076
16147
|
|
|
16077
16148
|
// src/components/Accordion.tsx
|
|
16078
|
-
var
|
|
16149
|
+
var import_utils70 = require("@react-aria/utils");
|
|
16079
16150
|
var import_react73 = require("react");
|
|
16080
16151
|
var import_react_aria40 = require("react-aria");
|
|
16081
16152
|
var import_runtime54 = require("@homebound/truss/runtime");
|
|
@@ -16101,7 +16172,7 @@ function Accordion(props) {
|
|
|
16101
16172
|
xss
|
|
16102
16173
|
} = props;
|
|
16103
16174
|
const tid = useTestIds(props, "accordion");
|
|
16104
|
-
const id = (0,
|
|
16175
|
+
const id = (0, import_utils70.useId)();
|
|
16105
16176
|
const [expanded, setExpanded] = (0, import_react73.useState)(defaultExpanded && !disabled);
|
|
16106
16177
|
const {
|
|
16107
16178
|
isFocusVisible,
|
|
@@ -16123,7 +16194,7 @@ function Accordion(props) {
|
|
|
16123
16194
|
setContentHeight(`${contentEl.scrollHeight}px`);
|
|
16124
16195
|
}
|
|
16125
16196
|
}, [expanded, contentEl, setContentHeight]);
|
|
16126
|
-
(0,
|
|
16197
|
+
(0, import_utils70.useResizeObserver)({
|
|
16127
16198
|
ref: contentRef,
|
|
16128
16199
|
onResize
|
|
16129
16200
|
});
|
|
@@ -16414,7 +16485,7 @@ var import_react102 = require("react");
|
|
|
16414
16485
|
var import_react_aria46 = require("react-aria");
|
|
16415
16486
|
|
|
16416
16487
|
// src/components/Modal/Modal.tsx
|
|
16417
|
-
var
|
|
16488
|
+
var import_utils74 = require("@react-aria/utils");
|
|
16418
16489
|
var import_react78 = require("react");
|
|
16419
16490
|
var import_react_aria41 = require("react-aria");
|
|
16420
16491
|
var import_react_dom3 = require("react-dom");
|
|
@@ -16537,7 +16608,7 @@ function Modal(props) {
|
|
|
16537
16608
|
};
|
|
16538
16609
|
}
|
|
16539
16610
|
const [hasScroll, setHasScroll] = (0, import_react78.useState)(forceScrolling ?? false);
|
|
16540
|
-
(0,
|
|
16611
|
+
(0, import_utils74.useResizeObserver)({
|
|
16541
16612
|
ref: modalBodyRef,
|
|
16542
16613
|
onResize: (0, import_react78.useCallback)(
|
|
16543
16614
|
() => {
|
|
@@ -18177,7 +18248,7 @@ function FormHeading(props) {
|
|
|
18177
18248
|
FormHeading.isFormHeading = true;
|
|
18178
18249
|
|
|
18179
18250
|
// src/forms/StaticField.tsx
|
|
18180
|
-
var
|
|
18251
|
+
var import_utils102 = require("@react-aria/utils");
|
|
18181
18252
|
var import_runtime65 = require("@homebound/truss/runtime");
|
|
18182
18253
|
var import_jsx_runtime118 = require("react/jsx-runtime");
|
|
18183
18254
|
function StaticField(props) {
|
|
@@ -18191,7 +18262,7 @@ function StaticField(props) {
|
|
|
18191
18262
|
children
|
|
18192
18263
|
} = props;
|
|
18193
18264
|
const tid = useTestIds(props, typeof label === "string" ? defaultTestId(label) : "staticField");
|
|
18194
|
-
const id = (0,
|
|
18265
|
+
const id = (0, import_utils102.useId)();
|
|
18195
18266
|
return /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)("div", { ...(0, import_runtime65.trussProps)({
|
|
18196
18267
|
...labelStyle === "left" ? {
|
|
18197
18268
|
display: "df",
|
|
@@ -18884,7 +18955,7 @@ var DateFilter = class extends BaseFilter {
|
|
|
18884
18955
|
return value ? { op: value.op, value: dehydratePlainDate(value.value) } : void 0;
|
|
18885
18956
|
}
|
|
18886
18957
|
render(value, setValue, tid, inModal, vertical) {
|
|
18887
|
-
const { label, operations, getOperationValue, getOperationLabel } = this.props;
|
|
18958
|
+
const { label, operations, getOperationValue, getOperationLabel, defaultValue } = this.props;
|
|
18888
18959
|
return /* @__PURE__ */ (0, import_jsx_runtime127.jsxs)(import_jsx_runtime127.Fragment, { children: [
|
|
18889
18960
|
vertical && /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(Label, { label }),
|
|
18890
18961
|
/* @__PURE__ */ (0, import_jsx_runtime127.jsxs)(CompoundField, { children: [
|
|
@@ -18901,8 +18972,8 @@ var DateFilter = class extends BaseFilter {
|
|
|
18901
18972
|
getOptionLabel: (o) => o === anyOption ? "Any" : getOperationLabel(o),
|
|
18902
18973
|
value: value?.op,
|
|
18903
18974
|
onSelect: (op) => (
|
|
18904
|
-
// default the selected date to today if it doesn't exist in the filter's value
|
|
18905
|
-
setValue(op ? { op, value: value?.value ?? todayPlainDate() } : void 0)
|
|
18975
|
+
// default the selected date to the filter's default date or today if it doesn't exist in the filter's value
|
|
18976
|
+
setValue(op ? { op, value: value?.value ?? defaultValue?.value ?? todayPlainDate() } : void 0)
|
|
18906
18977
|
),
|
|
18907
18978
|
label: inModal ? `${label} date filter operation` : label,
|
|
18908
18979
|
labelStyle: !inModal && !vertical ? "inline" : inModal || vertical ? "hidden" : "above",
|
|
@@ -18914,7 +18985,7 @@ var DateFilter = class extends BaseFilter {
|
|
|
18914
18985
|
DateField,
|
|
18915
18986
|
{
|
|
18916
18987
|
labelStyle: "inline",
|
|
18917
|
-
value: value?.value ?? todayPlainDate(),
|
|
18988
|
+
value: value?.value ?? defaultValue?.value ?? todayPlainDate(),
|
|
18918
18989
|
label: "Date",
|
|
18919
18990
|
onChange: (d) => {
|
|
18920
18991
|
if (d && value) {
|
|
@@ -20313,7 +20384,7 @@ var import_react106 = require("react");
|
|
|
20313
20384
|
var import_react_aria49 = require("react-aria");
|
|
20314
20385
|
|
|
20315
20386
|
// src/components/Tag.tsx
|
|
20316
|
-
var
|
|
20387
|
+
var import_utils119 = require("@react-aria/utils");
|
|
20317
20388
|
var import_react105 = require("react");
|
|
20318
20389
|
var import_runtime78 = require("@homebound/truss/runtime");
|
|
20319
20390
|
var import_jsx_runtime152 = require("react/jsx-runtime");
|
|
@@ -20329,7 +20400,7 @@ function Tag(props) {
|
|
|
20329
20400
|
const tid = useTestIds(otherProps);
|
|
20330
20401
|
const [showTooltip, setShowTooltip] = (0, import_react105.useState)(false);
|
|
20331
20402
|
const ref = (0, import_react105.useRef)(null);
|
|
20332
|
-
(0,
|
|
20403
|
+
(0, import_utils119.useResizeObserver)({
|
|
20333
20404
|
ref,
|
|
20334
20405
|
onResize: () => {
|
|
20335
20406
|
if (ref.current) {
|
|
@@ -21026,7 +21097,7 @@ function HbSpinnerProvider({
|
|
|
21026
21097
|
}
|
|
21027
21098
|
|
|
21028
21099
|
// src/components/MaxLines.tsx
|
|
21029
|
-
var
|
|
21100
|
+
var import_utils127 = require("@react-aria/utils");
|
|
21030
21101
|
var import_react115 = require("react");
|
|
21031
21102
|
var import_runtime85 = require("@homebound/truss/runtime");
|
|
21032
21103
|
var import_jsx_runtime160 = require("react/jsx-runtime");
|
|
@@ -21037,7 +21108,7 @@ function MaxLines({
|
|
|
21037
21108
|
const elRef = (0, import_react115.useRef)(null);
|
|
21038
21109
|
const [hasMore, setHasMore] = (0, import_react115.useState)(false);
|
|
21039
21110
|
const [expanded, setExpanded] = (0, import_react115.useState)(false);
|
|
21040
|
-
(0,
|
|
21111
|
+
(0, import_utils127.useLayoutEffect)(() => {
|
|
21041
21112
|
if (!elRef.current) return;
|
|
21042
21113
|
setHasMore(elRef.current.scrollHeight > elRef.current.clientHeight);
|
|
21043
21114
|
}, []);
|
|
@@ -21048,7 +21119,7 @@ function MaxLines({
|
|
|
21048
21119
|
if (!elRef.current) return;
|
|
21049
21120
|
!expanded && setHasMore(elRef.current.scrollHeight > elRef.current.clientHeight);
|
|
21050
21121
|
}, [expanded]);
|
|
21051
|
-
(0,
|
|
21122
|
+
(0, import_utils127.useResizeObserver)({
|
|
21052
21123
|
ref: elRef,
|
|
21053
21124
|
onResize
|
|
21054
21125
|
});
|
|
@@ -21069,7 +21140,7 @@ function MaxLines({
|
|
|
21069
21140
|
}
|
|
21070
21141
|
|
|
21071
21142
|
// src/components/ScrollShadows.tsx
|
|
21072
|
-
var
|
|
21143
|
+
var import_utils128 = require("@react-aria/utils");
|
|
21073
21144
|
var import_react116 = require("react");
|
|
21074
21145
|
var import_runtime86 = require("@homebound/truss/runtime");
|
|
21075
21146
|
var import_jsx_runtime161 = require("react/jsx-runtime");
|
|
@@ -21156,7 +21227,7 @@ function ScrollShadows(props) {
|
|
|
21156
21227
|
setShowEndShadow(start + boxSize < end);
|
|
21157
21228
|
}, [horizontal]);
|
|
21158
21229
|
const onResize = (0, import_react116.useCallback)(() => scrollRef.current && updateScrollProps(scrollRef.current), [updateScrollProps]);
|
|
21159
|
-
(0,
|
|
21230
|
+
(0, import_utils128.useResizeObserver)({
|
|
21160
21231
|
ref: scrollRef,
|
|
21161
21232
|
onResize
|
|
21162
21233
|
});
|
|
@@ -22193,6 +22264,7 @@ function useToast() {
|
|
|
22193
22264
|
filterTestIdPrefix,
|
|
22194
22265
|
formatDate,
|
|
22195
22266
|
formatDateRange,
|
|
22267
|
+
formatPlainDate,
|
|
22196
22268
|
formatValue,
|
|
22197
22269
|
generateColumnId,
|
|
22198
22270
|
getAlignment,
|