@oprt/react 0.2.1 → 0.4.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/README.md +2 -1
- package/dist/ComboBox/ComboBox.js +9 -1
- package/dist/DataGrid/DataGrid.js +12 -2
- package/dist/DataGrid/DataGrid.manifest.js +2 -2
- package/dist/Popover/Popover.js +6 -5
- package/dist/Skeleton/Skeleton.js +36 -25
- package/dist/Skeleton/Skeleton.manifest.js +10 -2
- package/dist/Tabs/useTabsIndicator.js +1 -1
- package/dist/_internal/hydration.js +2 -2
- package/dist/_internal/loadingStatus.js +30 -0
- package/dist/_internal/motion.js +2 -2
- package/dist/index.cjs +389 -327
- package/dist/index.d.cts +27 -2
- package/dist/index.d.ts +27 -2
- package/dist/version.js +1 -1
- package/package.json +6 -4
package/dist/index.cjs
CHANGED
|
@@ -944,8 +944,8 @@ function useMotion(mode = "auto", component) {
|
|
|
944
944
|
const [ready, setReady] = (0, import_react8.useState)(false);
|
|
945
945
|
const [keyboard, setKeyboard] = (0, import_react8.useState)(false);
|
|
946
946
|
const pointer = (0, import_react8.useRef)(false);
|
|
947
|
-
const frame = (0, import_react8.useRef)();
|
|
948
|
-
const contactCleanup = (0, import_react8.useRef)();
|
|
947
|
+
const frame = (0, import_react8.useRef)(void 0);
|
|
948
|
+
const contactCleanup = (0, import_react8.useRef)(void 0);
|
|
949
949
|
const clearContact = (0, import_react8.useCallback)(() => {
|
|
950
950
|
contactCleanup.current?.();
|
|
951
951
|
contactCleanup.current = void 0;
|
|
@@ -1286,11 +1286,11 @@ function warnProbeMissing(origin) {
|
|
|
1286
1286
|
function useHydrationRoot(...forwardedIds) {
|
|
1287
1287
|
const probe = (0, import_react11.useId)();
|
|
1288
1288
|
const hydrated = (0, import_react11.useSyncExternalStore)(subscribeNoop, getClientSnapshot, getServerSnapshot);
|
|
1289
|
-
const hydratingMount = (0, import_react11.useRef)();
|
|
1289
|
+
const hydratingMount = (0, import_react11.useRef)(void 0);
|
|
1290
1290
|
if (hydratingMount.current === void 0) hydratingMount.current = !hydrated;
|
|
1291
1291
|
const [disagrees, setDisagrees] = (0, import_react11.useState)(false);
|
|
1292
1292
|
const clientOnly = (0, import_react11.useRef)(hydrated);
|
|
1293
|
-
const origin = (0, import_react11.useRef)();
|
|
1293
|
+
const origin = (0, import_react11.useRef)(void 0);
|
|
1294
1294
|
if (process.env.NODE_ENV !== "production" && origin.current === void 0) {
|
|
1295
1295
|
origin.current = callerOfHook();
|
|
1296
1296
|
}
|
|
@@ -5813,7 +5813,7 @@ var import_clsx27 = __toESM(require("clsx"), 1);
|
|
|
5813
5813
|
// src/Skeleton/Skeleton.manifest.ts
|
|
5814
5814
|
var SkeletonManifest = {
|
|
5815
5815
|
Skeleton: {
|
|
5816
|
-
description: "Loading
|
|
5816
|
+
description: 'Loading placeholder, purely visual and silent: hidden from assistive technology, with no role, name or text, so a screen of placeholders does not say "Loading" once each. block renders one pulsing bar; text stacks `lines` bars with a shortened last line. Bars fill their container and never widen it, whatever width the caller asks for, and are drawn in a system color in forced-colors mode. The area that is loading says it: mark the area `aria-busy`, keep one polite status outside it (on the page before it has anything to say) that says "Loading <what>" and then that the content has arrived.',
|
|
5817
5817
|
props: {
|
|
5818
5818
|
variant: { type: "enum", values: ["block", "text"], default: "block" },
|
|
5819
5819
|
width: {
|
|
@@ -5830,11 +5830,19 @@ var SkeletonManifest = {
|
|
|
5830
5830
|
type: "number",
|
|
5831
5831
|
default: 3,
|
|
5832
5832
|
description: "Number of stacked bars in the text variant, rounded down with a minimum of 1. Non-finite values fall back to 3."
|
|
5833
|
+
},
|
|
5834
|
+
"aria-label": {
|
|
5835
|
+
type: "string",
|
|
5836
|
+
description: 'Deprecated and not applied. A Skeleton used to be a status named "Loading" (or this label); it is decorative now. In development a structured error says so, once. Name the loading area instead. The same holds for aria-labelledby, aria-describedby, role, aria-live and aria-busy.'
|
|
5837
|
+
},
|
|
5838
|
+
role: {
|
|
5839
|
+
type: "string",
|
|
5840
|
+
description: "Deprecated and not applied: a Skeleton is decorative and has no role. See aria-label."
|
|
5833
5841
|
}
|
|
5834
5842
|
},
|
|
5835
5843
|
composable_with: ["Card", "DataTable"],
|
|
5836
5844
|
never_inside: ["Button", "Badge"],
|
|
5837
|
-
example: '<Skeleton variant="text" lines={3} />'
|
|
5845
|
+
example: '<section aria-labelledby="tracks-title">\n <h2 id="tracks-title">Tracks</h2>\n <p role="status" className="sr-only">{note}</p>\n <div aria-busy={loading}>\n {loading ? <Skeleton variant="text" lines={3} /> : <TrackList tracks={tracks} />}\n </div>\n</section>'
|
|
5838
5846
|
}
|
|
5839
5847
|
};
|
|
5840
5848
|
|
|
@@ -5852,26 +5860,55 @@ var barStyles = (0, import_class_variance_authority16.cva)(
|
|
|
5852
5860
|
defaultVariants: { variant: "block" }
|
|
5853
5861
|
}
|
|
5854
5862
|
);
|
|
5863
|
+
var NOT_APPLIED2 = [
|
|
5864
|
+
"aria-label",
|
|
5865
|
+
"aria-labelledby",
|
|
5866
|
+
"aria-describedby",
|
|
5867
|
+
"role",
|
|
5868
|
+
"aria-live",
|
|
5869
|
+
"aria-busy"
|
|
5870
|
+
];
|
|
5871
|
+
var reportedNotApplied2 = /* @__PURE__ */ new Set();
|
|
5872
|
+
function reportNotApplied2(prop, received) {
|
|
5873
|
+
if (process.env.NODE_ENV === "production" || reportedNotApplied2.has(prop)) return;
|
|
5874
|
+
reportedNotApplied2.add(prop);
|
|
5875
|
+
console.error(
|
|
5876
|
+
JSON.stringify(
|
|
5877
|
+
{
|
|
5878
|
+
component: "Skeleton",
|
|
5879
|
+
error: "PROP_NOT_APPLIED",
|
|
5880
|
+
prop,
|
|
5881
|
+
received: typeof received === "string" ? received : String(received),
|
|
5882
|
+
suggestion: 'Skeleton is decorative: hidden from assistive technology, with no role or name, so it stays silent and a page of them does not say "Loading" once each. Mark the area that is loading aria-busy and say "Loading <what>" once in a status that is already on the page (see the Skeleton page).'
|
|
5883
|
+
},
|
|
5884
|
+
null,
|
|
5885
|
+
2
|
|
5886
|
+
)
|
|
5887
|
+
);
|
|
5888
|
+
}
|
|
5855
5889
|
var Skeleton = (0, import_react42.forwardRef)((allProps, ref) => {
|
|
5856
|
-
const { className, variant = "block", width, height, lines = 3, ...
|
|
5890
|
+
const { className, variant = "block", width, height, lines = 3, ...rest } = allProps;
|
|
5891
|
+
const props = { ...rest };
|
|
5857
5892
|
if (process.env.NODE_ENV !== "production") {
|
|
5858
5893
|
devValidate("Skeleton", SkeletonManifest.Skeleton.props, { ...allProps });
|
|
5894
|
+
for (const name of NOT_APPLIED2) {
|
|
5895
|
+
if (props[name] !== void 0) reportNotApplied2(name, props[name]);
|
|
5896
|
+
}
|
|
5859
5897
|
}
|
|
5898
|
+
for (const name of NOT_APPLIED2) delete props[name];
|
|
5899
|
+
delete props["aria-hidden"];
|
|
5860
5900
|
if (variant === "text") {
|
|
5861
5901
|
const count2 = Number.isFinite(lines) ? Math.max(1, Math.floor(lines)) : 3;
|
|
5862
5902
|
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
5863
5903
|
"div",
|
|
5864
5904
|
{
|
|
5905
|
+
...props,
|
|
5865
5906
|
ref,
|
|
5866
|
-
|
|
5867
|
-
"aria-busy": "true",
|
|
5868
|
-
"aria-label": "Loading",
|
|
5907
|
+
"aria-hidden": "true",
|
|
5869
5908
|
className: (0, import_clsx27.default)("flex flex-col gap-1u", className),
|
|
5870
|
-
...props,
|
|
5871
5909
|
children: Array.from({ length: count2 }, (_, i) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
5872
5910
|
"div",
|
|
5873
5911
|
{
|
|
5874
|
-
"aria-hidden": "true",
|
|
5875
5912
|
className: (0, import_clsx27.default)(barStyles({ variant: "text" }), i === count2 - 1 && "w-2/3")
|
|
5876
5913
|
},
|
|
5877
5914
|
i
|
|
@@ -5883,25 +5920,7 @@ var Skeleton = (0, import_react42.forwardRef)((allProps, ref) => {
|
|
|
5883
5920
|
if (width !== void 0) style.width = width;
|
|
5884
5921
|
if (height !== void 0) style.height = height;
|
|
5885
5922
|
const hasStyle = width !== void 0 || height !== void 0;
|
|
5886
|
-
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
5887
|
-
"div",
|
|
5888
|
-
{
|
|
5889
|
-
ref,
|
|
5890
|
-
role: "status",
|
|
5891
|
-
"aria-busy": "true",
|
|
5892
|
-
"aria-label": "Loading",
|
|
5893
|
-
className: (0, import_clsx27.default)("flex flex-col", className),
|
|
5894
|
-
...props,
|
|
5895
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
5896
|
-
"div",
|
|
5897
|
-
{
|
|
5898
|
-
"aria-hidden": "true",
|
|
5899
|
-
className: barStyles({ variant: "block" }),
|
|
5900
|
-
...hasStyle ? { style } : {}
|
|
5901
|
-
}
|
|
5902
|
-
)
|
|
5903
|
-
}
|
|
5904
|
-
);
|
|
5923
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { ...props, ref, "aria-hidden": "true", className: (0, import_clsx27.default)("flex flex-col", className), children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: barStyles({ variant: "block" }), ...hasStyle ? { style } : {} }) });
|
|
5905
5924
|
});
|
|
5906
5925
|
Skeleton.displayName = "Skeleton";
|
|
5907
5926
|
|
|
@@ -6464,7 +6483,7 @@ var TabsCompositionRules = {
|
|
|
6464
6483
|
var import_react45 = require("react");
|
|
6465
6484
|
function useTabsIndicator(list, vertical) {
|
|
6466
6485
|
const [geometry, setGeometry] = (0, import_react45.useState)();
|
|
6467
|
-
const selectedId = (0, import_react45.useRef)();
|
|
6486
|
+
const selectedId = (0, import_react45.useRef)(void 0);
|
|
6468
6487
|
useIsomorphicLayoutEffect(() => {
|
|
6469
6488
|
const node = list.current;
|
|
6470
6489
|
if (!node) return;
|
|
@@ -9407,9 +9426,34 @@ var Sparkline = (0, import_react55.forwardRef)((allProps, ref) => {
|
|
|
9407
9426
|
Sparkline.displayName = "Sparkline";
|
|
9408
9427
|
|
|
9409
9428
|
// src/DataGrid/DataGrid.tsx
|
|
9410
|
-
var
|
|
9429
|
+
var import_react57 = require("react");
|
|
9411
9430
|
var import_clsx39 = __toESM(require("clsx"), 1);
|
|
9412
9431
|
|
|
9432
|
+
// src/_internal/loadingStatus.ts
|
|
9433
|
+
var import_react56 = require("react");
|
|
9434
|
+
function useLoadingStatusText({
|
|
9435
|
+
loading,
|
|
9436
|
+
loadingText,
|
|
9437
|
+
loadedText
|
|
9438
|
+
}) {
|
|
9439
|
+
const held = useHoldBackNewText(true);
|
|
9440
|
+
const [seen2, setSeen] = (0, import_react56.useState)({ loading, first: loading, arrival: "" });
|
|
9441
|
+
let current = seen2;
|
|
9442
|
+
if (seen2.loading !== loading) {
|
|
9443
|
+
current = {
|
|
9444
|
+
loading,
|
|
9445
|
+
first: false,
|
|
9446
|
+
arrival: loading || seen2.first ? "" : loadedText
|
|
9447
|
+
};
|
|
9448
|
+
setSeen(current);
|
|
9449
|
+
} else if (!loading && seen2.arrival !== "" && seen2.arrival !== loadedText) {
|
|
9450
|
+
current = { ...seen2, arrival: "" };
|
|
9451
|
+
setSeen(current);
|
|
9452
|
+
}
|
|
9453
|
+
if (held || current.first) return "";
|
|
9454
|
+
return loading ? loadingText : current.arrival;
|
|
9455
|
+
}
|
|
9456
|
+
|
|
9413
9457
|
// src/DataGrid/DataGrid.manifest.ts
|
|
9414
9458
|
var DataGridManifest = {
|
|
9415
9459
|
DataGrid: {
|
|
@@ -9446,7 +9490,7 @@ var DataGridManifest = {
|
|
|
9446
9490
|
caption: {
|
|
9447
9491
|
type: "string",
|
|
9448
9492
|
default: "Data grid",
|
|
9449
|
-
description: "Accessible native table caption and controls group name."
|
|
9493
|
+
description: "Accessible native table caption and controls group name. Also names what is loading in the loading and loaded messages."
|
|
9450
9494
|
},
|
|
9451
9495
|
selectedRowIds: {
|
|
9452
9496
|
type: "array",
|
|
@@ -9523,7 +9567,7 @@ var DataGridManifest = {
|
|
|
9523
9567
|
loading: {
|
|
9524
9568
|
type: "boolean",
|
|
9525
9569
|
default: false,
|
|
9526
|
-
description:
|
|
9570
|
+
description: 'Marks the table busy and disables grid-owned controls and row activation while retaining supplied data. A load the person asks for (a reload, a page, a filter: `loading` turns on after the grid has rendered) says "Loading <caption>." once (or "Loading results." when no caption is given) and, when it ends, "<caption> loaded. N rows." once. The load that is under way when the grid first renders is busy but silent, as is the arrival of its rows.'
|
|
9527
9571
|
},
|
|
9528
9572
|
disabled: {
|
|
9529
9573
|
type: "boolean",
|
|
@@ -9591,8 +9635,8 @@ function ColumnWidthInput({
|
|
|
9591
9635
|
label,
|
|
9592
9636
|
onCommit
|
|
9593
9637
|
}) {
|
|
9594
|
-
const [draft, setDraft] = (0,
|
|
9595
|
-
(0,
|
|
9638
|
+
const [draft, setDraft] = (0, import_react57.useState)(null);
|
|
9639
|
+
(0, import_react57.useEffect)(() => setDraft(null), [value]);
|
|
9596
9640
|
const text = draft?.base === value ? draft.text : String(value);
|
|
9597
9641
|
const commit = (requested) => {
|
|
9598
9642
|
setDraft(null);
|
|
@@ -9633,12 +9677,12 @@ function withoutPage(selection, pageIds) {
|
|
|
9633
9677
|
const onPage = new Set(pageIds);
|
|
9634
9678
|
return selection.filter((id) => !onPage.has(id));
|
|
9635
9679
|
}
|
|
9636
|
-
var DataGrid = (0,
|
|
9680
|
+
var DataGrid = (0, import_react57.forwardRef)((allProps, ref) => {
|
|
9637
9681
|
const {
|
|
9638
9682
|
columns,
|
|
9639
9683
|
data,
|
|
9640
9684
|
getRowId,
|
|
9641
|
-
caption
|
|
9685
|
+
caption: captionProp,
|
|
9642
9686
|
selectedRowIds,
|
|
9643
9687
|
onSelectionChange,
|
|
9644
9688
|
sort,
|
|
@@ -9668,18 +9712,19 @@ var DataGrid = (0, import_react56.forwardRef)((allProps, ref) => {
|
|
|
9668
9712
|
if (process.env.NODE_ENV !== "production") {
|
|
9669
9713
|
devValidate("DataGrid", DataGridManifest.DataGrid.props, allProps);
|
|
9670
9714
|
}
|
|
9671
|
-
const
|
|
9672
|
-
const [
|
|
9673
|
-
const [
|
|
9674
|
-
const [
|
|
9675
|
-
const [
|
|
9676
|
-
const [
|
|
9677
|
-
const [
|
|
9678
|
-
const [
|
|
9679
|
-
const
|
|
9715
|
+
const caption = captionProp ?? "Data grid";
|
|
9716
|
+
const [localSelection, setLocalSelection] = (0, import_react57.useState)([]);
|
|
9717
|
+
const [localSort, setLocalSort] = (0, import_react57.useState)(null);
|
|
9718
|
+
const [localPage, setLocalPage] = (0, import_react57.useState)(1);
|
|
9719
|
+
const [hiddenColumns, setHiddenColumns] = (0, import_react57.useState)([]);
|
|
9720
|
+
const [columnsOpen, setColumnsOpen] = (0, import_react57.useState)(false);
|
|
9721
|
+
const [localWidths, setLocalWidths] = (0, import_react57.useState)({});
|
|
9722
|
+
const [localPinned, setLocalPinned] = (0, import_react57.useState)([]);
|
|
9723
|
+
const [localView, setLocalView] = (0, import_react57.useState)("virtualized");
|
|
9724
|
+
const columnsId = (0, import_react57.useId)();
|
|
9680
9725
|
const blocked = disabled || loading;
|
|
9681
9726
|
const selection = selectedRowIds ?? localSelection;
|
|
9682
|
-
const selectionSet = (0,
|
|
9727
|
+
const selectionSet = (0, import_react57.useMemo)(() => new Set(selection), [selection]);
|
|
9683
9728
|
const selectionEnabled = selectedRowIds !== void 0 || Boolean(onSelectionChange);
|
|
9684
9729
|
const effectiveSort = sort === void 0 ? localSort : sort;
|
|
9685
9730
|
const visibleKeys = visibleColumnKeys ?? columns.filter((column) => !hiddenColumns.includes(column.key)).map((column) => column.key);
|
|
@@ -9714,13 +9759,20 @@ var DataGrid = (0, import_react56.forwardRef)((allProps, ref) => {
|
|
|
9714
9759
|
const safePageSize = Number.isFinite(pageSize) && pageSize >= 1 ? Math.floor(pageSize) : 10;
|
|
9715
9760
|
const count2 = mode === "server" && rowCount !== void 0 && Number.isFinite(rowCount) ? Math.max(0, Math.floor(rowCount)) : data.length;
|
|
9716
9761
|
const pageCount = Math.max(1, Math.ceil(count2 / safePageSize));
|
|
9762
|
+
const what = captionProp ?? "results";
|
|
9763
|
+
const loadingNote = `Loading ${what}.`;
|
|
9764
|
+
const loadingStatus = useLoadingStatusText({
|
|
9765
|
+
loading,
|
|
9766
|
+
loadingText: loadingNote,
|
|
9767
|
+
loadedText: `${captionProp ?? "Results"} loaded. ${count2} ${count2 === 1 ? "row" : "rows"}.`
|
|
9768
|
+
});
|
|
9717
9769
|
const requestedPage = page ?? localPage;
|
|
9718
9770
|
const currentPage = Math.min(
|
|
9719
9771
|
pageCount,
|
|
9720
9772
|
Math.max(1, Number.isFinite(requestedPage) ? Math.floor(requestedPage) : 1)
|
|
9721
9773
|
);
|
|
9722
|
-
const correction = (0,
|
|
9723
|
-
(0,
|
|
9774
|
+
const correction = (0, import_react57.useRef)(null);
|
|
9775
|
+
(0, import_react57.useEffect)(() => {
|
|
9724
9776
|
if (requestedPage === currentPage) {
|
|
9725
9777
|
correction.current = null;
|
|
9726
9778
|
return;
|
|
@@ -9752,7 +9804,7 @@ var DataGrid = (0, import_react56.forwardRef)((allProps, ref) => {
|
|
|
9752
9804
|
const sortKey = sortColumn?.key;
|
|
9753
9805
|
const sortCompare = sortColumn?.compare;
|
|
9754
9806
|
const direction = effectiveSort?.direction;
|
|
9755
|
-
const sorted = (0,
|
|
9807
|
+
const sorted = (0, import_react57.useMemo)(() => {
|
|
9756
9808
|
if (mode !== "client" || sortKey === void 0 || direction === void 0) return data;
|
|
9757
9809
|
return sortedOrder(
|
|
9758
9810
|
data.map((row) => row[sortKey]),
|
|
@@ -9762,17 +9814,17 @@ var DataGrid = (0, import_react56.forwardRef)((allProps, ref) => {
|
|
|
9762
9814
|
}, [data, mode, sortKey, direction, sortCompare]);
|
|
9763
9815
|
const pageStart = (currentPage - 1) * safePageSize;
|
|
9764
9816
|
const paged = mode === "client" && !virtual;
|
|
9765
|
-
const pageRows = (0,
|
|
9817
|
+
const pageRows = (0, import_react57.useMemo)(
|
|
9766
9818
|
() => paged ? sorted.slice(pageStart, pageStart + safePageSize) : sorted,
|
|
9767
9819
|
[sorted, paged, pageStart, safePageSize]
|
|
9768
9820
|
);
|
|
9769
|
-
const latestGetRowId = (0,
|
|
9821
|
+
const latestGetRowId = (0, import_react57.useRef)(getRowId);
|
|
9770
9822
|
latestGetRowId.current = getRowId;
|
|
9771
|
-
const pageIdsOf = (0,
|
|
9823
|
+
const pageIdsOf = (0, import_react57.useMemo)(() => {
|
|
9772
9824
|
let ids = null;
|
|
9773
9825
|
return () => ids ??= pageRows.map((row) => latestGetRowId.current(row));
|
|
9774
9826
|
}, [pageRows]);
|
|
9775
|
-
const { allSelected, someSelected } = (0,
|
|
9827
|
+
const { allSelected, someSelected } = (0, import_react57.useMemo)(() => {
|
|
9776
9828
|
if (selectionSet.size === 0) return { allSelected: false, someSelected: false };
|
|
9777
9829
|
const pageIds = pageIdsOf();
|
|
9778
9830
|
let selected = 0;
|
|
@@ -9993,7 +10045,8 @@ var DataGrid = (0, import_react56.forwardRef)((allProps, ref) => {
|
|
|
9993
10045
|
} : {}
|
|
9994
10046
|
}
|
|
9995
10047
|
),
|
|
9996
|
-
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { role: "status", className:
|
|
10048
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { role: "status", className: "sr-only", children: loadingStatus }),
|
|
10049
|
+
loading && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { "aria-hidden": "true", className: "m-0 text-oprt-text-dim", children: loadingNote }),
|
|
9997
10050
|
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "flex flex-wrap items-center justify-between gap-2u", children: [
|
|
9998
10051
|
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("p", { className: "m-0 font-mono tabular-nums text-oprt-text-dim", children: [
|
|
9999
10052
|
count2,
|
|
@@ -10018,7 +10071,7 @@ var DataGrid = (0, import_react56.forwardRef)((allProps, ref) => {
|
|
|
10018
10071
|
DataGrid.displayName = "DataGrid";
|
|
10019
10072
|
|
|
10020
10073
|
// src/ComboBox/ComboBox.tsx
|
|
10021
|
-
var
|
|
10074
|
+
var import_react58 = require("react");
|
|
10022
10075
|
var import_class_variance_authority24 = require("class-variance-authority");
|
|
10023
10076
|
var import_clsx40 = __toESM(require("clsx"), 1);
|
|
10024
10077
|
var import_react_aria_components19 = require("react-aria-components");
|
|
@@ -10144,7 +10197,7 @@ function reportUnknownValue(received, options) {
|
|
|
10144
10197
|
)
|
|
10145
10198
|
);
|
|
10146
10199
|
}
|
|
10147
|
-
var ComboBox = (0,
|
|
10200
|
+
var ComboBox = (0, import_react58.forwardRef)((props, ref) => {
|
|
10148
10201
|
const {
|
|
10149
10202
|
motion = "auto",
|
|
10150
10203
|
options,
|
|
@@ -10169,7 +10222,7 @@ var ComboBox = (0, import_react57.forwardRef)((props, ref) => {
|
|
|
10169
10222
|
className
|
|
10170
10223
|
} = props;
|
|
10171
10224
|
const motionState = useMotion(motion);
|
|
10172
|
-
const editing = (0,
|
|
10225
|
+
const editing = (0, import_react58.useRef)(false);
|
|
10173
10226
|
const {
|
|
10174
10227
|
id: inputId,
|
|
10175
10228
|
labelledBy,
|
|
@@ -10261,7 +10314,15 @@ var ComboBox = (0, import_react57.forwardRef)((props, ref) => {
|
|
|
10261
10314
|
}
|
|
10262
10315
|
)
|
|
10263
10316
|
] }),
|
|
10264
|
-
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10317
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10318
|
+
"p",
|
|
10319
|
+
{
|
|
10320
|
+
role: "status",
|
|
10321
|
+
"data-react-aria-top-layer": "",
|
|
10322
|
+
className: loading ? "m-0 text-oprt-text-dim" : "sr-only",
|
|
10323
|
+
children: loading ? "Loading options." : null
|
|
10324
|
+
}
|
|
10325
|
+
),
|
|
10265
10326
|
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10266
10327
|
MotionPopover,
|
|
10267
10328
|
{
|
|
@@ -10303,7 +10364,7 @@ ComboBox.displayName = "ComboBox";
|
|
|
10303
10364
|
var import_icons16 = require("@oprt/icons");
|
|
10304
10365
|
var import_class_variance_authority25 = require("class-variance-authority");
|
|
10305
10366
|
var import_clsx41 = __toESM(require("clsx"), 1);
|
|
10306
|
-
var
|
|
10367
|
+
var import_react59 = require("react");
|
|
10307
10368
|
|
|
10308
10369
|
// src/SplitPane/SplitPane.manifest.ts
|
|
10309
10370
|
var SplitPaneManifest = {
|
|
@@ -10409,8 +10470,8 @@ var paneStyles = "min-w-0 min-h-0 overflow-auto focus-visible:outline-hidden foc
|
|
|
10409
10470
|
var BUTTON_STEP = 10;
|
|
10410
10471
|
var clamp = (value, min, max) => Math.min(max, Math.max(min, value));
|
|
10411
10472
|
function usePaneScrolls(pane) {
|
|
10412
|
-
const [scrolls, setScrolls] = (0,
|
|
10413
|
-
(0,
|
|
10473
|
+
const [scrolls, setScrolls] = (0, import_react59.useState)(false);
|
|
10474
|
+
(0, import_react59.useEffect)(() => {
|
|
10414
10475
|
const node = pane.current;
|
|
10415
10476
|
if (!node) return;
|
|
10416
10477
|
const measure = () => setScrolls(
|
|
@@ -10446,7 +10507,7 @@ function usePaneScrolls(pane) {
|
|
|
10446
10507
|
}, [pane]);
|
|
10447
10508
|
return scrolls;
|
|
10448
10509
|
}
|
|
10449
|
-
var SplitPane = (0,
|
|
10510
|
+
var SplitPane = (0, import_react59.forwardRef)(
|
|
10450
10511
|
({
|
|
10451
10512
|
primary,
|
|
10452
10513
|
secondary,
|
|
@@ -10472,15 +10533,15 @@ var SplitPane = (0, import_react58.forwardRef)(
|
|
|
10472
10533
|
}
|
|
10473
10534
|
const vertical = orientation === "vertical";
|
|
10474
10535
|
const axis = vertical ? "vertical" : "horizontal";
|
|
10475
|
-
const rootRef = (0,
|
|
10476
|
-
const primaryRef = (0,
|
|
10477
|
-
const secondaryRef = (0,
|
|
10478
|
-
const separatorRef = (0,
|
|
10536
|
+
const rootRef = (0, import_react59.useRef)(null);
|
|
10537
|
+
const primaryRef = (0, import_react59.useRef)(null);
|
|
10538
|
+
const secondaryRef = (0, import_react59.useRef)(null);
|
|
10539
|
+
const separatorRef = (0, import_react59.useRef)(null);
|
|
10479
10540
|
const ownChild = (selector) => () => Array.from(rootRef.current?.children ?? []).find((child) => child.matches(selector))?.id;
|
|
10480
10541
|
const primaryId = useHydratedId(ownChild('[data-pane="primary"]'));
|
|
10481
10542
|
const helpId = useHydratedId(ownChild("[data-oprt-split-help]"));
|
|
10482
|
-
const [internalSize, setInternalSize] = (0,
|
|
10483
|
-
const drag = (0,
|
|
10543
|
+
const [internalSize, setInternalSize] = (0, import_react59.useState)(defaultSize);
|
|
10544
|
+
const drag = (0, import_react59.useRef)(null);
|
|
10484
10545
|
const lower = clamp(Number.isFinite(minSize) ? minSize : 20, 0, 100);
|
|
10485
10546
|
const upper = clamp(Number.isFinite(maxSize) ? maxSize : 80, lower, 100);
|
|
10486
10547
|
const rawSize = size ?? internalSize;
|
|
@@ -10489,7 +10550,7 @@ var SplitPane = (0, import_react58.forwardRef)(
|
|
|
10489
10550
|
const buttonStep = Math.max(BUTTON_STEP, increment);
|
|
10490
10551
|
const threshold = Number.isFinite(stackBelow) ? Math.max(0, stackBelow) : 640;
|
|
10491
10552
|
const setRef2 = useMergedRefs(rootRef, forwardedRef);
|
|
10492
|
-
const isNarrow = (0,
|
|
10553
|
+
const isNarrow = (0, import_react59.useCallback)((width) => width < threshold, [threshold]);
|
|
10493
10554
|
const narrow = useElementWidth(rootRef, {
|
|
10494
10555
|
initial: false,
|
|
10495
10556
|
select: isNarrow
|
|
@@ -10501,7 +10562,7 @@ var SplitPane = (0, import_react58.forwardRef)(
|
|
|
10501
10562
|
track: (element) => element.closest("[data-oprt-split-divider]")?.parentElement === rootRef.current ? true : null,
|
|
10502
10563
|
findTarget: () => separatorRef.current?.isConnected ? separatorRef.current : primaryRef.current
|
|
10503
10564
|
});
|
|
10504
|
-
(0,
|
|
10565
|
+
(0, import_react59.useEffect)(() => {
|
|
10505
10566
|
drag.current = null;
|
|
10506
10567
|
}, [disabled, stacked, orientation]);
|
|
10507
10568
|
const resize = (next) => {
|
|
@@ -10681,7 +10742,7 @@ SplitPane.displayName = "SplitPane";
|
|
|
10681
10742
|
// src/TimeRange/TimeRange.tsx
|
|
10682
10743
|
var import_class_variance_authority26 = require("class-variance-authority");
|
|
10683
10744
|
var import_clsx42 = __toESM(require("clsx"), 1);
|
|
10684
|
-
var
|
|
10745
|
+
var import_react60 = require("react");
|
|
10685
10746
|
|
|
10686
10747
|
// src/_internal/timestamp.ts
|
|
10687
10748
|
var MAX_TIME = 864e13;
|
|
@@ -10751,7 +10812,7 @@ function describeRange(start, end) {
|
|
|
10751
10812
|
const sameDay = from.slice(0, 10) === to.slice(0, 10);
|
|
10752
10813
|
return `${from} to ${sameDay ? to.slice(11) : to}`;
|
|
10753
10814
|
}
|
|
10754
|
-
var TimeRange = (0,
|
|
10815
|
+
var TimeRange = (0, import_react60.forwardRef)(
|
|
10755
10816
|
({
|
|
10756
10817
|
value,
|
|
10757
10818
|
onValueChange,
|
|
@@ -10764,7 +10825,7 @@ var TimeRange = (0, import_react59.forwardRef)(
|
|
|
10764
10825
|
className,
|
|
10765
10826
|
...props
|
|
10766
10827
|
}, ref) => {
|
|
10767
|
-
const root = (0,
|
|
10828
|
+
const root = (0, import_react60.useRef)(null);
|
|
10768
10829
|
const setRoot = useMergedRefs(root, ref);
|
|
10769
10830
|
const ids = usePartIds(
|
|
10770
10831
|
["start-date", "start-time", "end-date", "end-time", "error", "range", "status"],
|
|
@@ -10772,15 +10833,15 @@ var TimeRange = (0, import_react59.forwardRef)(
|
|
|
10772
10833
|
);
|
|
10773
10834
|
const base = `${value.start}|${value.end}`;
|
|
10774
10835
|
const applied = draftOf(value);
|
|
10775
|
-
const [draft, setDraft] = (0,
|
|
10836
|
+
const [draft, setDraft] = (0, import_react60.useState)(() => ({ base, ...applied }));
|
|
10776
10837
|
const current = draft.base === base ? draft : applied;
|
|
10777
10838
|
const parsed = { start: parseEndpoint(current.start), end: parseEndpoint(current.end) };
|
|
10778
10839
|
const error = validate(parsed, min, max);
|
|
10779
10840
|
const pending = !(unchanged(current.start, parsed.start, applied.start, value.start) && unchanged(current.end, parsed.end, applied.end, value.end));
|
|
10780
10841
|
const valid = !error && !pending;
|
|
10781
|
-
const callback = (0,
|
|
10842
|
+
const callback = (0, import_react60.useRef)(onDraftValidityChange);
|
|
10782
10843
|
callback.current = onDraftValidityChange;
|
|
10783
|
-
(0,
|
|
10844
|
+
(0, import_react60.useEffect)(() => callback.current?.(valid, { pending }), [valid, pending]);
|
|
10784
10845
|
const readout = Number.isNaN(parsed.start) || Number.isNaN(parsed.end) ? null : describeRange(parsed.start, parsed.end);
|
|
10785
10846
|
const unapplied = !error && pending;
|
|
10786
10847
|
const edit = (part, field, next) => setDraft({ ...current, base, [part]: { ...current[part], [field]: next } });
|
|
@@ -10926,7 +10987,7 @@ var TimeRangeManifest = {
|
|
|
10926
10987
|
// src/EventTimeline/EventTimeline.tsx
|
|
10927
10988
|
var import_class_variance_authority27 = require("class-variance-authority");
|
|
10928
10989
|
var import_clsx43 = __toESM(require("clsx"), 1);
|
|
10929
|
-
var
|
|
10990
|
+
var import_react61 = require("react");
|
|
10930
10991
|
var import_jsx_runtime45 = require("react/jsx-runtime");
|
|
10931
10992
|
var timelineStyles = (0, import_class_variance_authority27.cva)("flex min-w-0 flex-col gap-2u font-sans text-oprt-text");
|
|
10932
10993
|
var markStyles = (0, import_class_variance_authority27.cva)("fill-current", {
|
|
@@ -10946,7 +11007,7 @@ var eventValid = (event) => isValidTimestamp(event.start) && (event.end === void
|
|
|
10946
11007
|
var laneOf = (event) => event.lane || "Events";
|
|
10947
11008
|
var DEFAULT_WIDTH = 1e3;
|
|
10948
11009
|
var MIN_WIDTH = 16;
|
|
10949
|
-
var Marker2 = (0,
|
|
11010
|
+
var Marker2 = (0, import_react61.memo)(function Marker3({ id, severity, x, width, selected }) {
|
|
10950
11011
|
const classes = (0, import_clsx43.default)(
|
|
10951
11012
|
markStyles({ severity: severity ?? "neutral" }),
|
|
10952
11013
|
selected && "stroke-oprt-text"
|
|
@@ -10972,7 +11033,7 @@ var Marker2 = (0, import_react60.memo)(function Marker3({ id, severity, x, width
|
|
|
10972
11033
|
}
|
|
10973
11034
|
);
|
|
10974
11035
|
});
|
|
10975
|
-
var TimelineRow = (0,
|
|
11036
|
+
var TimelineRow = (0, import_react61.memo)(function TimelineRow2({
|
|
10976
11037
|
event,
|
|
10977
11038
|
selected,
|
|
10978
11039
|
selectable,
|
|
@@ -11026,7 +11087,7 @@ var TimelineRow = (0, import_react60.memo)(function TimelineRow2({
|
|
|
11026
11087
|
}
|
|
11027
11088
|
);
|
|
11028
11089
|
});
|
|
11029
|
-
var EventTimeline = (0,
|
|
11090
|
+
var EventTimeline = (0, import_react61.forwardRef)(
|
|
11030
11091
|
({
|
|
11031
11092
|
events,
|
|
11032
11093
|
start,
|
|
@@ -11039,21 +11100,21 @@ var EventTimeline = (0, import_react60.forwardRef)(
|
|
|
11039
11100
|
className,
|
|
11040
11101
|
...props
|
|
11041
11102
|
}, forwardedRef) => {
|
|
11042
|
-
const id = (0,
|
|
11043
|
-
const rootRef = (0,
|
|
11103
|
+
const id = (0, import_react61.useId)();
|
|
11104
|
+
const rootRef = (0, import_react61.useRef)(null);
|
|
11044
11105
|
const setRef2 = useMergedRefs(rootRef, forwardedRef);
|
|
11045
11106
|
const observed = useElementWidth(rootRef, {
|
|
11046
11107
|
initial: null,
|
|
11047
11108
|
min: MIN_WIDTH
|
|
11048
11109
|
});
|
|
11049
|
-
const [firstWidth, setFirstWidth] = (0,
|
|
11110
|
+
const [firstWidth, setFirstWidth] = (0, import_react61.useState)(null);
|
|
11050
11111
|
useIsomorphicLayoutEffect(() => {
|
|
11051
11112
|
const width = rootRef.current?.getBoundingClientRect().width;
|
|
11052
11113
|
if (width !== void 0 && Number.isFinite(width) && width > MIN_WIDTH) setFirstWidth(width);
|
|
11053
11114
|
}, []);
|
|
11054
11115
|
const plotWidth = observed ?? firstWidth ?? DEFAULT_WIDTH;
|
|
11055
11116
|
const validRange = isValidTimestamp(start) && isValidTimestamp(end) && start < end;
|
|
11056
|
-
const { visible, omitted, lanes } = (0,
|
|
11117
|
+
const { visible, omitted, lanes } = (0, import_react61.useMemo)(() => {
|
|
11057
11118
|
const validEvents = events.filter(eventValid);
|
|
11058
11119
|
const inWindow = validRange ? validEvents.filter((event) => event.start <= end && (event.end ?? event.start) >= start).sort((a, b) => a.start - b.start) : [];
|
|
11059
11120
|
const byLane = /* @__PURE__ */ new Map();
|
|
@@ -11065,11 +11126,11 @@ var EventTimeline = (0, import_react60.forwardRef)(
|
|
|
11065
11126
|
}
|
|
11066
11127
|
return { visible: inWindow, omitted: events.length - validEvents.length, lanes: byLane };
|
|
11067
11128
|
}, [events, start, end, validRange]);
|
|
11068
|
-
const selectionRef = (0,
|
|
11129
|
+
const selectionRef = (0, import_react61.useRef)(onSelectionChange);
|
|
11069
11130
|
useIsomorphicLayoutEffect(() => {
|
|
11070
11131
|
selectionRef.current = onSelectionChange;
|
|
11071
11132
|
});
|
|
11072
|
-
const select = (0,
|
|
11133
|
+
const select = (0, import_react61.useCallback)((eventId) => selectionRef.current?.(eventId), []);
|
|
11073
11134
|
const extent2 = plotWidth - 16;
|
|
11074
11135
|
const position = (time) => 8 + Math.max(0, Math.min(extent2, (time - start) / (end - start) * extent2));
|
|
11075
11136
|
return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
|
|
@@ -11218,7 +11279,7 @@ var EventTimelineManifest = {
|
|
|
11218
11279
|
};
|
|
11219
11280
|
|
|
11220
11281
|
// src/AppShell/AppShell.tsx
|
|
11221
|
-
var
|
|
11282
|
+
var import_react62 = require("react");
|
|
11222
11283
|
var import_class_variance_authority28 = require("class-variance-authority");
|
|
11223
11284
|
var import_clsx44 = __toESM(require("clsx"), 1);
|
|
11224
11285
|
|
|
@@ -11301,7 +11362,7 @@ var connectionVariants = {
|
|
|
11301
11362
|
function connectionVariant(connection) {
|
|
11302
11363
|
return Object.prototype.hasOwnProperty.call(connectionVariants, connection) ? connectionVariants[connection] : "neutral";
|
|
11303
11364
|
}
|
|
11304
|
-
var AppShell = (0,
|
|
11365
|
+
var AppShell = (0, import_react62.forwardRef)(
|
|
11305
11366
|
({
|
|
11306
11367
|
title = "Workspace",
|
|
11307
11368
|
identity,
|
|
@@ -11316,7 +11377,7 @@ var AppShell = (0, import_react61.forwardRef)(
|
|
|
11316
11377
|
className,
|
|
11317
11378
|
...props
|
|
11318
11379
|
}, ref) => {
|
|
11319
|
-
const id = (0,
|
|
11380
|
+
const id = (0, import_react62.useId)();
|
|
11320
11381
|
if (process.env.NODE_ENV !== "production") {
|
|
11321
11382
|
devValidate("AppShell", AppShellManifest.AppShell.props, { mode, connection });
|
|
11322
11383
|
}
|
|
@@ -11378,14 +11439,14 @@ var AppShell = (0, import_react61.forwardRef)(
|
|
|
11378
11439
|
AppShell.displayName = "AppShell";
|
|
11379
11440
|
|
|
11380
11441
|
// src/Inspector/Inspector.tsx
|
|
11381
|
-
var
|
|
11442
|
+
var import_react63 = require("react");
|
|
11382
11443
|
var import_class_variance_authority29 = require("class-variance-authority");
|
|
11383
11444
|
var import_clsx45 = __toESM(require("clsx"), 1);
|
|
11384
11445
|
var import_jsx_runtime47 = require("react/jsx-runtime");
|
|
11385
11446
|
var inspectorStyles = (0, import_class_variance_authority29.cva)(
|
|
11386
11447
|
"flex min-w-0 flex-col gap-2u break-words border border-oprt-border bg-oprt-surface-1 p-2u font-sans text-oprt-base normal-case text-oprt-text"
|
|
11387
11448
|
);
|
|
11388
|
-
var Inspector = (0,
|
|
11449
|
+
var Inspector = (0, import_react63.forwardRef)(
|
|
11389
11450
|
({
|
|
11390
11451
|
open = true,
|
|
11391
11452
|
title,
|
|
@@ -11397,7 +11458,7 @@ var Inspector = (0, import_react62.forwardRef)(
|
|
|
11397
11458
|
"aria-describedby": describedBy,
|
|
11398
11459
|
...props
|
|
11399
11460
|
}, ref) => {
|
|
11400
|
-
const root = (0,
|
|
11461
|
+
const root = (0, import_react63.useRef)(null);
|
|
11401
11462
|
const setRef2 = useMergedRefs(root, ref);
|
|
11402
11463
|
const ids = usePartIds(["title", "description"], {
|
|
11403
11464
|
readRendered: () => root.current?.getAttribute("data-oprt-ids")
|
|
@@ -11467,7 +11528,7 @@ var InspectorManifest = {
|
|
|
11467
11528
|
};
|
|
11468
11529
|
|
|
11469
11530
|
// src/TreeView/TreeView.tsx
|
|
11470
|
-
var
|
|
11531
|
+
var import_react64 = require("react");
|
|
11471
11532
|
var import_react_aria_components20 = require("react-aria-components");
|
|
11472
11533
|
var import_icons17 = require("@oprt/icons");
|
|
11473
11534
|
var import_class_variance_authority30 = require("class-variance-authority");
|
|
@@ -11496,7 +11557,7 @@ function aimAtLabel(tree, row) {
|
|
|
11496
11557
|
row.style.scrollMarginLeft = `${Math.min(0, box.left - left)}px`;
|
|
11497
11558
|
row.style.scrollMarginRight = `${Math.min(0, right - box.right)}px`;
|
|
11498
11559
|
}
|
|
11499
|
-
var TreeView = (0,
|
|
11560
|
+
var TreeView = (0, import_react64.forwardRef)(
|
|
11500
11561
|
({
|
|
11501
11562
|
items,
|
|
11502
11563
|
label = "Navigation",
|
|
@@ -11510,12 +11571,12 @@ var TreeView = (0, import_react63.forwardRef)(
|
|
|
11510
11571
|
className,
|
|
11511
11572
|
...attributes
|
|
11512
11573
|
}, ref) => {
|
|
11513
|
-
const [localSelection, setLocalSelection] = (0,
|
|
11514
|
-
const [localExpanded, setLocalExpanded] = (0,
|
|
11574
|
+
const [localSelection, setLocalSelection] = (0, import_react64.useState)(null);
|
|
11575
|
+
const [localExpanded, setLocalExpanded] = (0, import_react64.useState)(defaultExpandedIds);
|
|
11515
11576
|
const selection = selectedId === void 0 ? localSelection : selectedId;
|
|
11516
|
-
const treeRef = (0,
|
|
11577
|
+
const treeRef = (0, import_react64.useRef)(null);
|
|
11517
11578
|
const setRef2 = useMergedRefs(treeRef, ref);
|
|
11518
|
-
(0,
|
|
11579
|
+
(0, import_react64.useEffect)(() => {
|
|
11519
11580
|
const tree = treeRef.current;
|
|
11520
11581
|
if (!tree) return;
|
|
11521
11582
|
const aim = (event) => {
|
|
@@ -11640,14 +11701,14 @@ var TreeViewManifest = {
|
|
|
11640
11701
|
};
|
|
11641
11702
|
|
|
11642
11703
|
// src/OperationalStatus/OperationalStatus.tsx
|
|
11643
|
-
var
|
|
11704
|
+
var import_react66 = require("react");
|
|
11644
11705
|
var import_class_variance_authority32 = require("class-variance-authority");
|
|
11645
11706
|
var import_clsx48 = __toESM(require("clsx"), 1);
|
|
11646
11707
|
|
|
11647
11708
|
// src/DescriptionList/DescriptionList.tsx
|
|
11648
11709
|
var import_class_variance_authority31 = require("class-variance-authority");
|
|
11649
11710
|
var import_clsx47 = __toESM(require("clsx"), 1);
|
|
11650
|
-
var
|
|
11711
|
+
var import_react65 = require("react");
|
|
11651
11712
|
|
|
11652
11713
|
// src/DescriptionList/DescriptionList.manifest.ts
|
|
11653
11714
|
var DescriptionListManifest = {
|
|
@@ -11728,13 +11789,13 @@ var valueStyles2 = (0, import_class_variance_authority31.cva)(
|
|
|
11728
11789
|
}
|
|
11729
11790
|
);
|
|
11730
11791
|
var isMissing = (value) => value === null || value === void 0 || value === "";
|
|
11731
|
-
var DescriptionList = (0,
|
|
11792
|
+
var DescriptionList = (0, import_react65.forwardRef)(
|
|
11732
11793
|
({ items, layout = "stacked", className, ...props }, ref) => {
|
|
11733
11794
|
if (process.env.NODE_ENV !== "production") {
|
|
11734
11795
|
devValidate("DescriptionList", DescriptionListManifest.DescriptionList.props, { layout });
|
|
11735
11796
|
}
|
|
11736
|
-
const reported3 = (0,
|
|
11737
|
-
(0,
|
|
11797
|
+
const reported3 = (0, import_react65.useRef)(/* @__PURE__ */ new Set());
|
|
11798
|
+
(0, import_react65.useEffect)(() => {
|
|
11738
11799
|
if (process.env.NODE_ENV === "production") return;
|
|
11739
11800
|
const fresh = items.filter(({ id, value }) => isMissing(value) && !reported3.current.has(id)).map(({ id }) => id);
|
|
11740
11801
|
if (fresh.length === 0) return;
|
|
@@ -11819,10 +11880,10 @@ var variants = {
|
|
|
11819
11880
|
unavailable: "error",
|
|
11820
11881
|
unknown: "neutral"
|
|
11821
11882
|
};
|
|
11822
|
-
var OperationalStatus = (0,
|
|
11883
|
+
var OperationalStatus = (0, import_react66.forwardRef)(
|
|
11823
11884
|
(allProps, ref) => {
|
|
11824
11885
|
const { state = "unknown", source, updatedAt, detail, className, ...props } = allProps;
|
|
11825
|
-
const qualityId = `${(0,
|
|
11886
|
+
const qualityId = `${(0, import_react66.useId)()}-quality`;
|
|
11826
11887
|
if (process.env.NODE_ENV !== "production") {
|
|
11827
11888
|
devValidate("OperationalStatus", OperationalStatusManifest.OperationalStatus.props, {
|
|
11828
11889
|
...allProps
|
|
@@ -11885,15 +11946,15 @@ var OperationalStatus = (0, import_react65.forwardRef)(
|
|
|
11885
11946
|
OperationalStatus.displayName = "OperationalStatus";
|
|
11886
11947
|
|
|
11887
11948
|
// src/ActionStatus/ActionStatus.tsx
|
|
11888
|
-
var
|
|
11949
|
+
var import_react68 = require("react");
|
|
11889
11950
|
var import_class_variance_authority33 = require("class-variance-authority");
|
|
11890
11951
|
var import_clsx49 = __toESM(require("clsx"), 1);
|
|
11891
11952
|
|
|
11892
11953
|
// src/_internal/useActionFocus.ts
|
|
11893
|
-
var
|
|
11954
|
+
var import_react67 = require("react");
|
|
11894
11955
|
function useActionFocus(ref, { onFocusCapture, onBlurCapture } = {}) {
|
|
11895
|
-
const root = (0,
|
|
11896
|
-
(0,
|
|
11956
|
+
const root = (0, import_react67.useRef)(null);
|
|
11957
|
+
(0, import_react67.useImperativeHandle)(ref, () => root.current, []);
|
|
11897
11958
|
const restore = useRestoreFocusOnRemoval(root);
|
|
11898
11959
|
return {
|
|
11899
11960
|
ref: root,
|
|
@@ -12026,7 +12087,7 @@ function ActionStatusLine({
|
|
|
12026
12087
|
}
|
|
12027
12088
|
);
|
|
12028
12089
|
}
|
|
12029
|
-
var ActionStatus = (0,
|
|
12090
|
+
var ActionStatus = (0, import_react68.forwardRef)((allProps, ref) => {
|
|
12030
12091
|
const {
|
|
12031
12092
|
state,
|
|
12032
12093
|
label,
|
|
@@ -12072,7 +12133,7 @@ var ActionStatus = (0, import_react67.forwardRef)((allProps, ref) => {
|
|
|
12072
12133
|
ActionStatus.displayName = "ActionStatus";
|
|
12073
12134
|
|
|
12074
12135
|
// src/MultiSelect/MultiSelect.tsx
|
|
12075
|
-
var
|
|
12136
|
+
var import_react69 = require("react");
|
|
12076
12137
|
var import_class_variance_authority34 = require("class-variance-authority");
|
|
12077
12138
|
var import_clsx50 = __toESM(require("clsx"), 1);
|
|
12078
12139
|
var import_icons18 = require("@oprt/icons");
|
|
@@ -12081,7 +12142,7 @@ var styles = (0, import_class_variance_authority34.cva)("m-0 min-w-0 border p-2u
|
|
|
12081
12142
|
variants: { invalid: { true: "border-oprt-error", false: "border-oprt-border" } },
|
|
12082
12143
|
defaultVariants: { invalid: false }
|
|
12083
12144
|
});
|
|
12084
|
-
var MultiSelect = (0,
|
|
12145
|
+
var MultiSelect = (0, import_react69.forwardRef)(
|
|
12085
12146
|
({
|
|
12086
12147
|
label,
|
|
12087
12148
|
options,
|
|
@@ -12096,12 +12157,12 @@ var MultiSelect = (0, import_react68.forwardRef)(
|
|
|
12096
12157
|
"aria-describedby": describedBy,
|
|
12097
12158
|
...props
|
|
12098
12159
|
}, ref) => {
|
|
12099
|
-
const fieldset = (0,
|
|
12160
|
+
const fieldset = (0, import_react69.useRef)(null);
|
|
12100
12161
|
const fieldsetRef = useMergedRefs(fieldset, ref);
|
|
12101
12162
|
const ids = usePartIds(["description", "error"], {
|
|
12102
12163
|
readRendered: () => fieldset.current?.getAttribute("data-oprt-ids")
|
|
12103
12164
|
});
|
|
12104
|
-
const [local, setLocal] = (0,
|
|
12165
|
+
const [local, setLocal] = (0, import_react69.useState)(defaultValue);
|
|
12105
12166
|
const selected = value ?? local;
|
|
12106
12167
|
const descriptions = joinIds(describedBy, description && ids.description, error && ids.error);
|
|
12107
12168
|
return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
|
|
@@ -12228,7 +12289,7 @@ var MultiSelectManifest = {
|
|
|
12228
12289
|
};
|
|
12229
12290
|
|
|
12230
12291
|
// src/NumberInput/NumberInput.tsx
|
|
12231
|
-
var
|
|
12292
|
+
var import_react70 = require("react");
|
|
12232
12293
|
var import_class_variance_authority35 = require("class-variance-authority");
|
|
12233
12294
|
var import_clsx51 = __toESM(require("clsx"), 1);
|
|
12234
12295
|
|
|
@@ -12334,7 +12395,7 @@ function validate2(text, unit, min, max, step, required) {
|
|
|
12334
12395
|
function plainDecimal(value) {
|
|
12335
12396
|
return value.toLocaleString("en-US", { useGrouping: false, maximumFractionDigits: 20 });
|
|
12336
12397
|
}
|
|
12337
|
-
var NumberInput = (0,
|
|
12398
|
+
var NumberInput = (0, import_react70.forwardRef)((allProps, ref) => {
|
|
12338
12399
|
const {
|
|
12339
12400
|
label,
|
|
12340
12401
|
unit,
|
|
@@ -12361,22 +12422,22 @@ var NumberInput = (0, import_react69.forwardRef)((allProps, ref) => {
|
|
|
12361
12422
|
if (process.env.NODE_ENV !== "production") {
|
|
12362
12423
|
devValidate("NumberInput", NumberInputManifest.NumberInput.props, { ...allProps });
|
|
12363
12424
|
}
|
|
12364
|
-
const labelRef = (0,
|
|
12425
|
+
const labelRef = (0, import_react70.useRef)(null);
|
|
12365
12426
|
const ids = usePartIds(["unit", "description", "error", "unknown"], {
|
|
12366
12427
|
id,
|
|
12367
12428
|
readRendered: () => labelRef.current?.htmlFor
|
|
12368
12429
|
});
|
|
12369
12430
|
const inputId = ids.base;
|
|
12370
|
-
const inputRef = (0,
|
|
12431
|
+
const inputRef = (0, import_react70.useRef)(null);
|
|
12371
12432
|
const mergedRef = useMergedRefs(inputRef, ref);
|
|
12372
|
-
const [local, setLocal] = (0,
|
|
12433
|
+
const [local, setLocal] = (0, import_react70.useState)(defaultValue);
|
|
12373
12434
|
const numeric = value === void 0 ? local : value;
|
|
12374
|
-
const [draft, setDraft] = (0,
|
|
12435
|
+
const [draft, setDraft] = (0, import_react70.useState)(null);
|
|
12375
12436
|
const text = draft && Object.is(draft.base, numeric) ? draft.text : numeric === null ? "" : String(numeric);
|
|
12376
12437
|
const validation = error || validate2(text, unit, min, max, step, required);
|
|
12377
|
-
const validationRef = (0,
|
|
12438
|
+
const validationRef = (0, import_react70.useRef)(onValidationChange);
|
|
12378
12439
|
validationRef.current = onValidationChange;
|
|
12379
|
-
(0,
|
|
12440
|
+
(0, import_react70.useEffect)(() => {
|
|
12380
12441
|
inputRef.current?.setCustomValidity(validation ?? "");
|
|
12381
12442
|
validationRef.current?.(validation ?? null);
|
|
12382
12443
|
}, [validation]);
|
|
@@ -12485,11 +12546,11 @@ var NumberInput = (0, import_react69.forwardRef)((allProps, ref) => {
|
|
|
12485
12546
|
NumberInput.displayName = "NumberInput";
|
|
12486
12547
|
|
|
12487
12548
|
// src/CoordinateInput/CoordinateInput.tsx
|
|
12488
|
-
var
|
|
12549
|
+
var import_react71 = require("react");
|
|
12489
12550
|
var import_clsx52 = __toESM(require("clsx"), 1);
|
|
12490
12551
|
var import_jsx_runtime54 = require("react/jsx-runtime");
|
|
12491
12552
|
var unknown = { latitude: null, longitude: null };
|
|
12492
|
-
var CoordinateInput = (0,
|
|
12553
|
+
var CoordinateInput = (0, import_react71.forwardRef)(
|
|
12493
12554
|
({
|
|
12494
12555
|
label = "Coordinates",
|
|
12495
12556
|
value,
|
|
@@ -12505,18 +12566,18 @@ var CoordinateInput = (0, import_react70.forwardRef)(
|
|
|
12505
12566
|
"aria-describedby": describedBy,
|
|
12506
12567
|
...props
|
|
12507
12568
|
}, ref) => {
|
|
12508
|
-
const fieldset = (0,
|
|
12569
|
+
const fieldset = (0, import_react71.useRef)(null);
|
|
12509
12570
|
const fieldsetRef = useMergedRefs(fieldset, ref);
|
|
12510
12571
|
const ids = usePartIds(["status", "description", "error"], {
|
|
12511
12572
|
readRendered: () => fieldset.current?.getAttribute("data-oprt-ids")
|
|
12512
12573
|
});
|
|
12513
|
-
const [local, setLocal] = (0,
|
|
12514
|
-
const [invalidAxes, setInvalidAxes] = (0,
|
|
12574
|
+
const [local, setLocal] = (0, import_react71.useState)(defaultValue);
|
|
12575
|
+
const [invalidAxes, setInvalidAxes] = (0, import_react71.useState)({ latitude: false, longitude: false });
|
|
12515
12576
|
const position = value ?? local;
|
|
12516
12577
|
const invalid = Boolean(error) || invalidAxes.latitude || invalidAxes.longitude || position.latitude !== null && (!Number.isFinite(position.latitude) || Math.abs(position.latitude) > 90) || position.longitude !== null && (!Number.isFinite(position.longitude) || Math.abs(position.longitude) > 180);
|
|
12517
|
-
const validationRef = (0,
|
|
12578
|
+
const validationRef = (0, import_react71.useRef)(onValidationChange);
|
|
12518
12579
|
validationRef.current = onValidationChange;
|
|
12519
|
-
(0,
|
|
12580
|
+
(0, import_react71.useEffect)(() => {
|
|
12520
12581
|
validationRef.current?.(invalid);
|
|
12521
12582
|
}, [invalid]);
|
|
12522
12583
|
const status = invalid ? "Position invalid" : position.latitude === null || position.longitude === null ? "Position unknown" : "Decimal degrees";
|
|
@@ -12655,7 +12716,7 @@ var CoordinateInputManifest = {
|
|
|
12655
12716
|
// src/Link/Link.tsx
|
|
12656
12717
|
var import_class_variance_authority36 = require("class-variance-authority");
|
|
12657
12718
|
var import_clsx53 = __toESM(require("clsx"), 1);
|
|
12658
|
-
var
|
|
12719
|
+
var import_react72 = require("react");
|
|
12659
12720
|
var import_jsx_runtime55 = require("react/jsx-runtime");
|
|
12660
12721
|
var linkStyles = (0, import_class_variance_authority36.cva)(
|
|
12661
12722
|
"min-h-oprt-sm min-w-oprt-sm border border-transparent py-[calc((var(--oprt-height-sm)-2px-var(--oprt-line-base))/2)] box-decoration-clone font-sans text-oprt-base font-medium text-oprt-accent underline underline-offset-2 oprt-wrap-anywhere [&_svg]:inline-block hover:text-oprt-accent-hover aria-disabled:text-[color:inherit] aria-disabled:hover:text-[color:inherit] aria-disabled:no-underline aria-disabled:cursor-default focus-visible:outline-hidden focus-visible:border-oprt-border-focus focus-visible:shadow-oprt-focus forced-colors:focus-visible:outline-solid forced-colors:focus-visible:outline-2 forced-colors:focus-visible:outline-[CanvasText]",
|
|
@@ -12668,11 +12729,11 @@ var linkStyles = (0, import_class_variance_authority36.cva)(
|
|
|
12668
12729
|
}
|
|
12669
12730
|
);
|
|
12670
12731
|
function isIconOnly(children) {
|
|
12671
|
-
const parts =
|
|
12732
|
+
const parts = import_react72.Children.toArray(children).filter(
|
|
12672
12733
|
(part) => !(typeof part === "string" && part.trim() === "")
|
|
12673
12734
|
);
|
|
12674
12735
|
const [only] = parts;
|
|
12675
|
-
if (parts.length !== 1 || !(0,
|
|
12736
|
+
if (parts.length !== 1 || !(0, import_react72.isValidElement)(only)) return false;
|
|
12676
12737
|
const hidden = only.props["aria-hidden"];
|
|
12677
12738
|
return only.type === "svg" || hidden === true || hidden === "true" || typeof only.type !== "string" && only.props.children == null;
|
|
12678
12739
|
}
|
|
@@ -12709,7 +12770,7 @@ function reportUnsafeHref(destination) {
|
|
|
12709
12770
|
)
|
|
12710
12771
|
);
|
|
12711
12772
|
}
|
|
12712
|
-
var Link = (0,
|
|
12773
|
+
var Link = (0, import_react72.forwardRef)(
|
|
12713
12774
|
({ className, href, children, ...props }, ref) => {
|
|
12714
12775
|
const safe = typeof href !== "string" || isSafeHref(href, props.download !== void 0 && props.download !== false);
|
|
12715
12776
|
if (!safe) reportUnsafeHref(href);
|
|
@@ -12763,7 +12824,7 @@ var LinkManifest = {
|
|
|
12763
12824
|
};
|
|
12764
12825
|
|
|
12765
12826
|
// src/CopyButton/CopyButton.tsx
|
|
12766
|
-
var
|
|
12827
|
+
var import_react74 = require("react");
|
|
12767
12828
|
var import_class_variance_authority37 = require("class-variance-authority");
|
|
12768
12829
|
var import_icons19 = require("@oprt/icons");
|
|
12769
12830
|
|
|
@@ -12801,16 +12862,16 @@ var CopyButtonManifest = {
|
|
|
12801
12862
|
};
|
|
12802
12863
|
|
|
12803
12864
|
// src/_internal/useIsMounted.ts
|
|
12804
|
-
var
|
|
12865
|
+
var import_react73 = require("react");
|
|
12805
12866
|
function useIsMounted() {
|
|
12806
|
-
const mounted = (0,
|
|
12867
|
+
const mounted = (0, import_react73.useRef)(false);
|
|
12807
12868
|
useIsomorphicLayoutEffect(() => {
|
|
12808
12869
|
mounted.current = true;
|
|
12809
12870
|
return () => {
|
|
12810
12871
|
mounted.current = false;
|
|
12811
12872
|
};
|
|
12812
12873
|
}, []);
|
|
12813
|
-
return (0,
|
|
12874
|
+
return (0, import_react73.useCallback)(() => mounted.current, []);
|
|
12814
12875
|
}
|
|
12815
12876
|
|
|
12816
12877
|
// src/CopyButton/CopyButton.tsx
|
|
@@ -12844,14 +12905,14 @@ function reportLabelWithoutVisibleText(label) {
|
|
|
12844
12905
|
)
|
|
12845
12906
|
);
|
|
12846
12907
|
}
|
|
12847
|
-
var CopyButton = (0,
|
|
12908
|
+
var CopyButton = (0, import_react74.forwardRef)((allProps, ref) => {
|
|
12848
12909
|
const { value, label, onCopy, onCopyError, disabled = false, size = "md", className } = allProps;
|
|
12849
|
-
const [pending, setPending] = (0,
|
|
12910
|
+
const [pending, setPending] = (0, import_react74.useState)(false);
|
|
12850
12911
|
if (!/copy/i.test(label)) reportLabelWithoutVisibleText(label);
|
|
12851
|
-
const [feedback, setFeedback] = (0,
|
|
12852
|
-
const pendingRef = (0,
|
|
12912
|
+
const [feedback, setFeedback] = (0, import_react74.useState)(null);
|
|
12913
|
+
const pendingRef = (0, import_react74.useRef)(false);
|
|
12853
12914
|
const isMounted = useIsMounted();
|
|
12854
|
-
const context = (0,
|
|
12915
|
+
const context = (0, import_react74.useRef)({ value, label, revision: 0 });
|
|
12855
12916
|
if (process.env.NODE_ENV !== "production") {
|
|
12856
12917
|
devValidate("CopyButton", CopyButtonManifest.CopyButton.props, { ...allProps });
|
|
12857
12918
|
}
|
|
@@ -12932,7 +12993,7 @@ CopyButton.displayName = "CopyButton";
|
|
|
12932
12993
|
|
|
12933
12994
|
// src/Popover/Popover.tsx
|
|
12934
12995
|
var import_react_aria_components21 = require("react-aria-components");
|
|
12935
|
-
var
|
|
12996
|
+
var import_react75 = require("react");
|
|
12936
12997
|
var import_class_variance_authority38 = require("class-variance-authority");
|
|
12937
12998
|
var import_clsx54 = __toESM(require("clsx"), 1);
|
|
12938
12999
|
|
|
@@ -12996,7 +13057,7 @@ function topSurface() {
|
|
|
12996
13057
|
);
|
|
12997
13058
|
return surfaces[surfaces.length - 1];
|
|
12998
13059
|
}
|
|
12999
|
-
var Popover2 = (0,
|
|
13060
|
+
var Popover2 = (0, import_react75.forwardRef)(
|
|
13000
13061
|
({
|
|
13001
13062
|
children,
|
|
13002
13063
|
content,
|
|
@@ -13016,37 +13077,38 @@ var Popover2 = (0, import_react74.forwardRef)(
|
|
|
13016
13077
|
id: suppliedId,
|
|
13017
13078
|
...dialogProps
|
|
13018
13079
|
}, ref) => {
|
|
13019
|
-
const [localOpen, setLocalOpen] = (0,
|
|
13080
|
+
const [localOpen, setLocalOpen] = (0, import_react75.useState)(defaultOpen);
|
|
13020
13081
|
const isOpen = open ?? localOpen;
|
|
13021
|
-
const [positioning, setPositioning] = (0,
|
|
13022
|
-
const [tooltipOpen, setTooltipOpen] = (0,
|
|
13082
|
+
const [positioning, setPositioning] = (0, import_react75.useState)(true);
|
|
13083
|
+
const [tooltipOpen, setTooltipOpen] = (0, import_react75.useState)(false);
|
|
13023
13084
|
const motionState = useMotion(motion);
|
|
13024
13085
|
if (process.env.NODE_ENV !== "production") {
|
|
13025
13086
|
devValidate("Popover", PopoverManifest.Popover.props, { ...dialogProps, side, align });
|
|
13026
13087
|
}
|
|
13027
|
-
const generatedId = (0,
|
|
13088
|
+
const generatedId = (0, import_react75.useId)();
|
|
13028
13089
|
const id = suppliedId ?? `oprt-popover-${generatedId}`;
|
|
13029
|
-
const trigger = (0,
|
|
13030
|
-
const lastTrigger = (0,
|
|
13031
|
-
const dialog = (0,
|
|
13032
|
-
const lastDialog = (0,
|
|
13033
|
-
const wasOpen = (0,
|
|
13034
|
-
const focusFrame = (0,
|
|
13035
|
-
const focusScrollClose = (0,
|
|
13036
|
-
const current = (0,
|
|
13090
|
+
const trigger = (0, import_react75.useRef)(null);
|
|
13091
|
+
const lastTrigger = (0, import_react75.useRef)(null);
|
|
13092
|
+
const dialog = (0, import_react75.useRef)(null);
|
|
13093
|
+
const lastDialog = (0, import_react75.useRef)(null);
|
|
13094
|
+
const wasOpen = (0, import_react75.useRef)(false);
|
|
13095
|
+
const focusFrame = (0, import_react75.useRef)(void 0);
|
|
13096
|
+
const focusScrollClose = (0, import_react75.useRef)(false);
|
|
13097
|
+
const current = (0, import_react75.useRef)({ isOpen, onCloseAutoFocus, returnFocusRef });
|
|
13037
13098
|
current.current = { isOpen, onCloseAutoFocus, returnFocusRef };
|
|
13038
|
-
const
|
|
13039
|
-
const
|
|
13099
|
+
const triggerChild = children;
|
|
13100
|
+
const childRef = parseInt(import_react75.version, 10) < 19 ? triggerChild.ref : triggerChild.props.ref;
|
|
13101
|
+
const rememberTrigger = (0, import_react75.useCallback)((node) => {
|
|
13040
13102
|
trigger.current = node;
|
|
13041
13103
|
if (node) lastTrigger.current = node;
|
|
13042
13104
|
}, []);
|
|
13043
13105
|
const setTrigger = useMergedRefs(rememberTrigger, childRef);
|
|
13044
|
-
const rememberDialog = (0,
|
|
13106
|
+
const rememberDialog = (0, import_react75.useCallback)((node) => {
|
|
13045
13107
|
dialog.current = node;
|
|
13046
13108
|
if (node) lastDialog.current = node;
|
|
13047
13109
|
}, []);
|
|
13048
13110
|
const setDialog = useMergedRefs(rememberDialog, ref);
|
|
13049
|
-
const restoreFocus = (0,
|
|
13111
|
+
const restoreFocus = (0, import_react75.useCallback)(() => {
|
|
13050
13112
|
const event = new Event("popovercloseautofocus", { cancelable: true });
|
|
13051
13113
|
current.current.onCloseAutoFocus?.(event);
|
|
13052
13114
|
if (event.defaultPrevented) return;
|
|
@@ -13061,7 +13123,7 @@ var Popover2 = (0, import_react74.forwardRef)(
|
|
|
13061
13123
|
if (target?.isConnected) target.focus({ preventScroll: true });
|
|
13062
13124
|
});
|
|
13063
13125
|
}, []);
|
|
13064
|
-
(0,
|
|
13126
|
+
(0, import_react75.useEffect)(() => {
|
|
13065
13127
|
if (isOpen && !wasOpen.current) {
|
|
13066
13128
|
if (focusFrame.current !== void 0) cancelAnimationFrame(focusFrame.current);
|
|
13067
13129
|
setTooltipOpen(false);
|
|
@@ -13070,13 +13132,13 @@ var Popover2 = (0, import_react74.forwardRef)(
|
|
|
13070
13132
|
if (!isOpen && wasOpen.current) restoreFocus();
|
|
13071
13133
|
wasOpen.current = isOpen;
|
|
13072
13134
|
}, [isOpen, restoreFocus]);
|
|
13073
|
-
(0,
|
|
13135
|
+
(0, import_react75.useEffect)(
|
|
13074
13136
|
() => () => {
|
|
13075
13137
|
if (wasOpen.current && !dialog.current?.isConnected) restoreFocus();
|
|
13076
13138
|
},
|
|
13077
13139
|
[restoreFocus]
|
|
13078
13140
|
);
|
|
13079
|
-
const requestOpen = (0,
|
|
13141
|
+
const requestOpen = (0, import_react75.useCallback)(
|
|
13080
13142
|
(next) => {
|
|
13081
13143
|
if (next && disabled) return;
|
|
13082
13144
|
if (!next && focusScrollClose.current) return;
|
|
@@ -13144,7 +13206,7 @@ var Popover2 = (0, import_react74.forwardRef)(
|
|
|
13144
13206
|
window.removeEventListener(event, interact, true);
|
|
13145
13207
|
};
|
|
13146
13208
|
}, [isOpen]);
|
|
13147
|
-
(0,
|
|
13209
|
+
(0, import_react75.useEffect)(() => {
|
|
13148
13210
|
if (!isOpen) return;
|
|
13149
13211
|
let startedOutside = false;
|
|
13150
13212
|
const start = (event) => {
|
|
@@ -13171,10 +13233,10 @@ var Popover2 = (0, import_react74.forwardRef)(
|
|
|
13171
13233
|
document.removeEventListener("pointercancel", cancel, true);
|
|
13172
13234
|
};
|
|
13173
13235
|
}, [isOpen, requestOpen]);
|
|
13174
|
-
const triggerElement = (0,
|
|
13236
|
+
const triggerElement = (0, import_react75.cloneElement)(triggerChild, {
|
|
13175
13237
|
ref: setTrigger,
|
|
13176
|
-
disabled: disabled ||
|
|
13177
|
-
"aria-disabled": disabled ||
|
|
13238
|
+
disabled: disabled || triggerChild.props.disabled,
|
|
13239
|
+
"aria-disabled": disabled || triggerChild.props["aria-disabled"],
|
|
13178
13240
|
"aria-controls": isOpen ? id : void 0
|
|
13179
13241
|
});
|
|
13180
13242
|
const pressable = /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_react_aria_components21.Pressable, { isDisabled: disabled, children: triggerElement });
|
|
@@ -13261,16 +13323,16 @@ var Popover2 = (0, import_react74.forwardRef)(
|
|
|
13261
13323
|
Popover2.displayName = "Popover";
|
|
13262
13324
|
|
|
13263
13325
|
// src/EntityPreview/EntityPreview.tsx
|
|
13264
|
-
var
|
|
13326
|
+
var import_react76 = require("react");
|
|
13265
13327
|
var import_class_variance_authority39 = require("class-variance-authority");
|
|
13266
13328
|
var import_clsx55 = __toESM(require("clsx"), 1);
|
|
13267
13329
|
var import_jsx_runtime58 = require("react/jsx-runtime");
|
|
13268
13330
|
var previewStyles = (0, import_class_variance_authority39.cva)(
|
|
13269
13331
|
"flex min-w-0 flex-col gap-2u font-sans text-oprt-base normal-case tracking-normal text-oprt-text"
|
|
13270
13332
|
);
|
|
13271
|
-
var EntityPreview = (0,
|
|
13333
|
+
var EntityPreview = (0, import_react76.forwardRef)(
|
|
13272
13334
|
({ entity, media, actions: actions2, headingLevel = 3, className, ...props }, ref) => {
|
|
13273
|
-
const instanceId = (0,
|
|
13335
|
+
const instanceId = (0, import_react76.useId)();
|
|
13274
13336
|
const headingId = `${instanceId}-name`;
|
|
13275
13337
|
const conditionId = `${instanceId}-condition`;
|
|
13276
13338
|
const Heading5 = `h${headingLevel}`;
|
|
@@ -13375,16 +13437,16 @@ var EntityPreviewManifest = {
|
|
|
13375
13437
|
};
|
|
13376
13438
|
|
|
13377
13439
|
// src/FormSection/FormSection.tsx
|
|
13378
|
-
var
|
|
13440
|
+
var import_react77 = require("react");
|
|
13379
13441
|
var import_class_variance_authority40 = require("class-variance-authority");
|
|
13380
13442
|
var import_clsx56 = __toESM(require("clsx"), 1);
|
|
13381
13443
|
var import_jsx_runtime59 = require("react/jsx-runtime");
|
|
13382
13444
|
var sectionStyles = (0, import_class_variance_authority40.cva)(
|
|
13383
13445
|
"m-0 min-w-0 border border-oprt-border bg-oprt-surface-1 p-3u font-sans text-oprt-base normal-case tracking-normal text-oprt-text"
|
|
13384
13446
|
);
|
|
13385
|
-
var FormSection = (0,
|
|
13447
|
+
var FormSection = (0, import_react77.forwardRef)(
|
|
13386
13448
|
({ legend, description, children, className, "aria-describedby": describedBy, ...props }, ref) => {
|
|
13387
|
-
const root = (0,
|
|
13449
|
+
const root = (0, import_react77.useRef)(null);
|
|
13388
13450
|
const mergedRef = useMergedRefs(root, ref);
|
|
13389
13451
|
const ids = usePartIds(["description"], {
|
|
13390
13452
|
id: props.id,
|
|
@@ -13448,7 +13510,7 @@ var FormSectionManifest = {
|
|
|
13448
13510
|
};
|
|
13449
13511
|
|
|
13450
13512
|
// src/FormErrorSummary/FormErrorSummary.tsx
|
|
13451
|
-
var
|
|
13513
|
+
var import_react78 = require("react");
|
|
13452
13514
|
var import_class_variance_authority41 = require("class-variance-authority");
|
|
13453
13515
|
var import_clsx57 = __toESM(require("clsx"), 1);
|
|
13454
13516
|
var import_jsx_runtime60 = require("react/jsx-runtime");
|
|
@@ -13458,7 +13520,7 @@ var summaryStyles = (0, import_class_variance_authority41.cva)(
|
|
|
13458
13520
|
var errorStyles = (0, import_class_variance_authority41.cva)(
|
|
13459
13521
|
"inline-flex min-h-3u min-w-3u max-w-full items-center border border-transparent px-1u py-0.5u text-left text-oprt-base font-medium normal-case tracking-normal text-oprt-text underline underline-offset-2 hover:text-oprt-accent outline-hidden focus-visible:border-oprt-border-focus focus-visible:shadow-oprt-focus oprt-wrap-anywhere"
|
|
13460
13522
|
);
|
|
13461
|
-
var FormErrorSummary = (0,
|
|
13523
|
+
var FormErrorSummary = (0, import_react78.forwardRef)(
|
|
13462
13524
|
({
|
|
13463
13525
|
errors,
|
|
13464
13526
|
title = "Check these fields",
|
|
@@ -13468,7 +13530,7 @@ var FormErrorSummary = (0, import_react77.forwardRef)(
|
|
|
13468
13530
|
"aria-labelledby": labelledBy,
|
|
13469
13531
|
...props
|
|
13470
13532
|
}, ref) => {
|
|
13471
|
-
const root = (0,
|
|
13533
|
+
const root = (0, import_react78.useRef)(null);
|
|
13472
13534
|
const mergedRef = useMergedRefs(root, ref);
|
|
13473
13535
|
const ids = usePartIds(["title"], {
|
|
13474
13536
|
id: props.id,
|
|
@@ -13539,7 +13601,7 @@ var FormErrorSummaryManifest = {
|
|
|
13539
13601
|
};
|
|
13540
13602
|
|
|
13541
13603
|
// src/Calendar/Calendar.tsx
|
|
13542
|
-
var
|
|
13604
|
+
var import_react79 = require("react");
|
|
13543
13605
|
var import_date2 = require("@internationalized/date");
|
|
13544
13606
|
var import_react_aria_components22 = require("react-aria-components");
|
|
13545
13607
|
var import_class_variance_authority42 = require("class-variance-authority");
|
|
@@ -13725,7 +13787,7 @@ function CalendarContent() {
|
|
|
13725
13787
|
] })
|
|
13726
13788
|
] });
|
|
13727
13789
|
}
|
|
13728
|
-
var Calendar2 = (0,
|
|
13790
|
+
var Calendar2 = (0, import_react79.forwardRef)(
|
|
13729
13791
|
({
|
|
13730
13792
|
label,
|
|
13731
13793
|
value,
|
|
@@ -13738,10 +13800,10 @@ var Calendar2 = (0, import_react78.forwardRef)(
|
|
|
13738
13800
|
id,
|
|
13739
13801
|
className
|
|
13740
13802
|
}, ref) => {
|
|
13741
|
-
const generated = (0,
|
|
13803
|
+
const generated = (0, import_react79.useId)();
|
|
13742
13804
|
const errorId = `${id ?? generated}-error`;
|
|
13743
13805
|
const hydration = useHydrationRoot(id);
|
|
13744
|
-
const config = (0,
|
|
13806
|
+
const config = (0, import_react79.useMemo)(() => dateConfiguration(value, min, max), [value, min, max]);
|
|
13745
13807
|
const error = config.error ?? (required && value === null ? "A date is required." : null);
|
|
13746
13808
|
return (
|
|
13747
13809
|
// The key remounts the error with the calendar, so both take the client's ids when hydration
|
|
@@ -13816,7 +13878,7 @@ var CalendarManifest = {
|
|
|
13816
13878
|
};
|
|
13817
13879
|
|
|
13818
13880
|
// src/DatePicker/DatePicker.tsx
|
|
13819
|
-
var
|
|
13881
|
+
var import_react81 = require("react");
|
|
13820
13882
|
var import_react_aria_components23 = require("react-aria-components");
|
|
13821
13883
|
var import_date4 = require("@internationalized/date");
|
|
13822
13884
|
var import_icons21 = require("@oprt/icons");
|
|
@@ -13824,12 +13886,12 @@ var import_class_variance_authority43 = require("class-variance-authority");
|
|
|
13824
13886
|
var import_clsx59 = __toESM(require("clsx"), 1);
|
|
13825
13887
|
|
|
13826
13888
|
// src/_internal/segmentField.ts
|
|
13827
|
-
var
|
|
13889
|
+
var import_react80 = require("react");
|
|
13828
13890
|
function sameSnapshot(a, b) {
|
|
13829
13891
|
return a.value === b.value && a.empty === b.empty && a.valid === b.valid;
|
|
13830
13892
|
}
|
|
13831
13893
|
function useReportSegments(segments2, read, report2) {
|
|
13832
|
-
const last = (0,
|
|
13894
|
+
const last = (0, import_react80.useRef)(null);
|
|
13833
13895
|
useIsomorphicLayoutEffect(() => {
|
|
13834
13896
|
const snapshot = read(segments2);
|
|
13835
13897
|
const previous = last.current;
|
|
@@ -13876,11 +13938,11 @@ function useSegmentDraft({
|
|
|
13876
13938
|
rejected: false,
|
|
13877
13939
|
rejection: null
|
|
13878
13940
|
};
|
|
13879
|
-
const [draft, setDraft] = (0,
|
|
13941
|
+
const [draft, setDraft] = (0, import_react80.useState)(initial);
|
|
13880
13942
|
const current = draft.base === value ? draft : initial;
|
|
13881
|
-
const raw = (0,
|
|
13882
|
-
const rejectBlur = (0,
|
|
13883
|
-
const report2 = (0,
|
|
13943
|
+
const raw = (0, import_react80.useRef)(current.snapshot);
|
|
13944
|
+
const rejectBlur = (0, import_react80.useRef)(false);
|
|
13945
|
+
const report2 = (0, import_react80.useCallback)(
|
|
13884
13946
|
(snapshot) => {
|
|
13885
13947
|
raw.current = snapshot;
|
|
13886
13948
|
setDraft(
|
|
@@ -13927,7 +13989,7 @@ function useSegmentDraft({
|
|
|
13927
13989
|
accept: () => setDraft((previous) => ({ ...previous, rejected: false, rejection: null }))
|
|
13928
13990
|
};
|
|
13929
13991
|
}
|
|
13930
|
-
var SegmentGroupContext = (0,
|
|
13992
|
+
var SegmentGroupContext = (0, import_react80.createContext)(null);
|
|
13931
13993
|
|
|
13932
13994
|
// src/DatePicker/DatePicker.tsx
|
|
13933
13995
|
var import_jsx_runtime62 = require("react/jsx-runtime");
|
|
@@ -13936,11 +13998,11 @@ function ObservedYear({
|
|
|
13936
13998
|
segment,
|
|
13937
13999
|
report: report2
|
|
13938
14000
|
}) {
|
|
13939
|
-
const state = (0,
|
|
14001
|
+
const state = (0, import_react81.useContext)(import_react_aria_components23.DateFieldStateContext);
|
|
13940
14002
|
useReportSegments(state.segments, readDateSegments, report2);
|
|
13941
14003
|
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_react_aria_components23.DateSegment, { segment, className: SEGMENT_STYLES });
|
|
13942
14004
|
}
|
|
13943
|
-
var DatePicker = (0,
|
|
14005
|
+
var DatePicker = (0, import_react81.forwardRef)(
|
|
13944
14006
|
({
|
|
13945
14007
|
label,
|
|
13946
14008
|
value,
|
|
@@ -13955,19 +14017,19 @@ var DatePicker = (0, import_react80.forwardRef)(
|
|
|
13955
14017
|
className,
|
|
13956
14018
|
motion = "auto"
|
|
13957
14019
|
}, ref) => {
|
|
13958
|
-
const generated = (0,
|
|
14020
|
+
const generated = (0, import_react81.useId)();
|
|
13959
14021
|
const inputId = id ?? `oprt-date-${generated}`;
|
|
13960
14022
|
const hydration = useHydrationRoot(inputId);
|
|
13961
14023
|
const { locale } = (0, import_react_aria_components23.useLocale)();
|
|
13962
|
-
const gregorianLocale = (0,
|
|
14024
|
+
const gregorianLocale = (0, import_react81.useMemo)(
|
|
13963
14025
|
() => new Intl.Locale(locale, { calendar: "gregory" }).toString(),
|
|
13964
14026
|
[locale]
|
|
13965
14027
|
);
|
|
13966
|
-
const config = (0,
|
|
14028
|
+
const config = (0, import_react81.useMemo)(() => dateConfiguration(value, min, max), [value, min, max]);
|
|
13967
14029
|
const displayedValue = config.date?.toString() ?? null;
|
|
13968
14030
|
const motionState = useMotion(motion);
|
|
13969
|
-
const calendarButton = (0,
|
|
13970
|
-
const group = (0,
|
|
14031
|
+
const calendarButton = (0, import_react81.useRef)(null);
|
|
14032
|
+
const group = (0, import_react81.useContext)(SegmentGroupContext);
|
|
13971
14033
|
const calendarMin = parseDateOnly(group?.calendar?.min);
|
|
13972
14034
|
const calendarMax = parseDateOnly(group?.calendar?.max);
|
|
13973
14035
|
const minValue = calendarMin && calendarMin.compare(config.min) > 0 ? calendarMin : config.min;
|
|
@@ -13984,10 +14046,10 @@ var DatePicker = (0, import_react80.forwardRef)(
|
|
|
13984
14046
|
// The bound an edit crossed, named as for a supplied value (DatePicker-R6).
|
|
13985
14047
|
draft.rejection ?? "Enter a complete, valid date within the allowed bounds."
|
|
13986
14048
|
) : null);
|
|
13987
|
-
const validityCallback = (0,
|
|
14049
|
+
const validityCallback = (0, import_react81.useRef)(onDraftValidityChange);
|
|
13988
14050
|
validityCallback.current = onDraftValidityChange;
|
|
13989
14051
|
const pending = draft.pending;
|
|
13990
|
-
(0,
|
|
14052
|
+
(0, import_react81.useEffect)(() => validityCallback.current?.(!error, { pending }), [error, pending]);
|
|
13991
14053
|
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_react_aria_components23.I18nProvider, { locale: gregorianLocale, children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
|
|
13992
14054
|
import_react_aria_components23.DatePicker,
|
|
13993
14055
|
{
|
|
@@ -14112,7 +14174,7 @@ var DatePickerManifest = {
|
|
|
14112
14174
|
};
|
|
14113
14175
|
|
|
14114
14176
|
// src/InlineEdit/InlineEdit.tsx
|
|
14115
|
-
var
|
|
14177
|
+
var import_react82 = require("react");
|
|
14116
14178
|
var import_class_variance_authority44 = require("class-variance-authority");
|
|
14117
14179
|
var import_clsx60 = __toESM(require("clsx"), 1);
|
|
14118
14180
|
var import_jsx_runtime63 = require("react/jsx-runtime");
|
|
@@ -14123,35 +14185,35 @@ function matchesAttempt(attempt, value, label) {
|
|
|
14123
14185
|
const acceptedReplacement = value === attempt.submitted && value !== attempt.session.baseline;
|
|
14124
14186
|
return (label === attempt.session.label || acceptedReplacement) && (value === attempt.session.baseline || value === attempt.submitted);
|
|
14125
14187
|
}
|
|
14126
|
-
var InlineEdit = (0,
|
|
14188
|
+
var InlineEdit = (0, import_react82.forwardRef)(
|
|
14127
14189
|
({ label, value, onSave, disabled = false, readOnly = false, validate: validate3, className, ...props }, ref) => {
|
|
14128
|
-
const [editing, setEditing] = (0,
|
|
14129
|
-
const [draft, setDraft] = (0,
|
|
14130
|
-
const [error, setError] = (0,
|
|
14131
|
-
const [pending, setPending] = (0,
|
|
14132
|
-
const [multiline, setMultiline] = (0,
|
|
14133
|
-
const [returnFocus, setReturnFocus] = (0,
|
|
14134
|
-
const [changedTo, setChangedTo] = (0,
|
|
14135
|
-
const rootRef = (0,
|
|
14190
|
+
const [editing, setEditing] = (0, import_react82.useState)(false);
|
|
14191
|
+
const [draft, setDraft] = (0, import_react82.useState)(value);
|
|
14192
|
+
const [error, setError] = (0, import_react82.useState)(null);
|
|
14193
|
+
const [pending, setPending] = (0, import_react82.useState)(false);
|
|
14194
|
+
const [multiline, setMultiline] = (0, import_react82.useState)(false);
|
|
14195
|
+
const [returnFocus, setReturnFocus] = (0, import_react82.useState)(null);
|
|
14196
|
+
const [changedTo, setChangedTo] = (0, import_react82.useState)(null);
|
|
14197
|
+
const rootRef = (0, import_react82.useRef)(null);
|
|
14136
14198
|
const mergedRef = useMergedRefs(rootRef, ref);
|
|
14137
|
-
const inputRef = (0,
|
|
14138
|
-
const editRef = (0,
|
|
14139
|
-
const refocusInput = (0,
|
|
14140
|
-
const session = (0,
|
|
14141
|
-
const request = (0,
|
|
14142
|
-
const composing = (0,
|
|
14199
|
+
const inputRef = (0, import_react82.useRef)(null);
|
|
14200
|
+
const editRef = (0, import_react82.useRef)(null);
|
|
14201
|
+
const refocusInput = (0, import_react82.useRef)(false);
|
|
14202
|
+
const session = (0, import_react82.useRef)(null);
|
|
14203
|
+
const request = (0, import_react82.useRef)(null);
|
|
14204
|
+
const composing = (0, import_react82.useRef)(false);
|
|
14143
14205
|
const isMounted = useIsMounted();
|
|
14144
|
-
const latest = (0,
|
|
14206
|
+
const latest = (0, import_react82.useRef)({ label, value, disabled, readOnly });
|
|
14145
14207
|
latest.current = { label, value, disabled, readOnly };
|
|
14146
14208
|
const ids = usePartIds(["error", "changed"]);
|
|
14147
|
-
(0,
|
|
14209
|
+
(0, import_react82.useEffect)(
|
|
14148
14210
|
() => () => {
|
|
14149
14211
|
session.current = null;
|
|
14150
14212
|
request.current = null;
|
|
14151
14213
|
},
|
|
14152
14214
|
[]
|
|
14153
14215
|
);
|
|
14154
|
-
(0,
|
|
14216
|
+
(0, import_react82.useEffect)(() => {
|
|
14155
14217
|
const current = session.current;
|
|
14156
14218
|
if (!current) return;
|
|
14157
14219
|
const attempt = request.current;
|
|
@@ -14169,17 +14231,17 @@ var InlineEdit = (0, import_react81.forwardRef)(
|
|
|
14169
14231
|
session.current = { baseline: value, label };
|
|
14170
14232
|
if (current.baseline !== value) setChangedTo(value);
|
|
14171
14233
|
}, [value, label, disabled, readOnly]);
|
|
14172
|
-
(0,
|
|
14234
|
+
(0, import_react82.useEffect)(() => {
|
|
14173
14235
|
if (editing) inputRef.current?.focus();
|
|
14174
14236
|
}, [editing]);
|
|
14175
|
-
(0,
|
|
14237
|
+
(0, import_react82.useEffect)(() => {
|
|
14176
14238
|
if (pending || !refocusInput.current) return;
|
|
14177
14239
|
refocusInput.current = false;
|
|
14178
14240
|
const active = document.activeElement;
|
|
14179
14241
|
if (active === null || active === document.body || rootRef.current?.contains(active))
|
|
14180
14242
|
inputRef.current?.focus();
|
|
14181
14243
|
}, [pending]);
|
|
14182
|
-
(0,
|
|
14244
|
+
(0, import_react82.useEffect)(() => {
|
|
14183
14245
|
if (!returnFocus || editing) return;
|
|
14184
14246
|
if (!disabled && !readOnly && matchesAttempt(returnFocus, value, label))
|
|
14185
14247
|
editRef.current?.focus();
|
|
@@ -14401,7 +14463,7 @@ var InlineEditManifest = {
|
|
|
14401
14463
|
};
|
|
14402
14464
|
|
|
14403
14465
|
// src/ContextMenu/ContextMenu.tsx
|
|
14404
|
-
var
|
|
14466
|
+
var import_react83 = require("react");
|
|
14405
14467
|
var import_react_aria_components24 = require("react-aria-components");
|
|
14406
14468
|
var import_react_aria6 = require("react-aria");
|
|
14407
14469
|
var import_class_variance_authority45 = require("class-variance-authority");
|
|
@@ -14420,7 +14482,7 @@ function ContextSurface({
|
|
|
14420
14482
|
disabled,
|
|
14421
14483
|
children
|
|
14422
14484
|
}) {
|
|
14423
|
-
const surfaceRef = (0,
|
|
14485
|
+
const surfaceRef = (0, import_react83.useRef)(null);
|
|
14424
14486
|
const { pressProps } = (0, import_react_aria6.usePress)({ ref: surfaceRef, isDisabled: disabled });
|
|
14425
14487
|
return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
|
|
14426
14488
|
"div",
|
|
@@ -14457,7 +14519,7 @@ function ContextSurface({
|
|
|
14457
14519
|
}
|
|
14458
14520
|
);
|
|
14459
14521
|
}
|
|
14460
|
-
var ContextMenu = (0,
|
|
14522
|
+
var ContextMenu = (0, import_react83.forwardRef)(
|
|
14461
14523
|
({
|
|
14462
14524
|
label,
|
|
14463
14525
|
items,
|
|
@@ -14468,10 +14530,10 @@ var ContextMenu = (0, import_react82.forwardRef)(
|
|
|
14468
14530
|
className,
|
|
14469
14531
|
...props
|
|
14470
14532
|
}, ref) => {
|
|
14471
|
-
const [open, setOpen] = (0,
|
|
14533
|
+
const [open, setOpen] = (0, import_react83.useState)(null);
|
|
14472
14534
|
const hydration = useHydrationRoot();
|
|
14473
14535
|
const motionState = useMotion("auto", "ContextMenu");
|
|
14474
|
-
(0,
|
|
14536
|
+
(0, import_react83.useEffect)(() => {
|
|
14475
14537
|
if (disabled) setOpen(null);
|
|
14476
14538
|
}, [disabled]);
|
|
14477
14539
|
const menu = () => /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
|
|
@@ -14607,18 +14669,18 @@ var ContextMenuManifest = {
|
|
|
14607
14669
|
};
|
|
14608
14670
|
|
|
14609
14671
|
// src/TimeField/TimeField.tsx
|
|
14610
|
-
var
|
|
14672
|
+
var import_react84 = require("react");
|
|
14611
14673
|
var import_react_aria_components25 = require("react-aria-components");
|
|
14612
14674
|
var import_class_variance_authority46 = require("class-variance-authority");
|
|
14613
14675
|
var import_clsx62 = __toESM(require("clsx"), 1);
|
|
14614
14676
|
var import_jsx_runtime65 = require("react/jsx-runtime");
|
|
14615
14677
|
var fieldStyles3 = (0, import_class_variance_authority46.cva)("flex min-w-0 flex-col gap-1u font-sans text-oprt-base text-oprt-text");
|
|
14616
14678
|
function DraftObserver({ report: report2 }) {
|
|
14617
|
-
const state = (0,
|
|
14679
|
+
const state = (0, import_react84.useContext)(import_react_aria_components25.TimeFieldStateContext);
|
|
14618
14680
|
useReportSegments(state.segments, readTimeSegments, report2);
|
|
14619
14681
|
return null;
|
|
14620
14682
|
}
|
|
14621
|
-
var TimeField = (0,
|
|
14683
|
+
var TimeField = (0, import_react84.forwardRef)(
|
|
14622
14684
|
({
|
|
14623
14685
|
label,
|
|
14624
14686
|
value,
|
|
@@ -14632,12 +14694,12 @@ var TimeField = (0, import_react83.forwardRef)(
|
|
|
14632
14694
|
id,
|
|
14633
14695
|
className
|
|
14634
14696
|
}, ref) => {
|
|
14635
|
-
const generated = (0,
|
|
14697
|
+
const generated = (0, import_react84.useId)();
|
|
14636
14698
|
const inputId = id ?? `oprt-time-${generated}`;
|
|
14637
14699
|
const hydration = useHydrationRoot(inputId);
|
|
14638
|
-
const config = (0,
|
|
14700
|
+
const config = (0, import_react84.useMemo)(() => timeConfiguration(value, min, max), [value, min, max]);
|
|
14639
14701
|
const displayedValue = config.time ? formatTimeOnly(config.time) : null;
|
|
14640
|
-
const group = (0,
|
|
14702
|
+
const group = (0, import_react84.useContext)(SegmentGroupContext);
|
|
14641
14703
|
const draft = useSegmentDraft({
|
|
14642
14704
|
value,
|
|
14643
14705
|
displayed: displayedValue,
|
|
@@ -14650,10 +14712,10 @@ var TimeField = (0, import_react83.forwardRef)(
|
|
|
14650
14712
|
// The bound an edit crossed, named as for a supplied value (TimeField-R1).
|
|
14651
14713
|
draft.rejection ?? "Enter a complete, valid time within the allowed bounds."
|
|
14652
14714
|
) : null);
|
|
14653
|
-
const callback = (0,
|
|
14715
|
+
const callback = (0, import_react84.useRef)(onDraftValidityChange);
|
|
14654
14716
|
callback.current = onDraftValidityChange;
|
|
14655
14717
|
const pending = draft.pending;
|
|
14656
|
-
(0,
|
|
14718
|
+
(0, import_react84.useEffect)(() => callback.current?.(!error, { pending }), [error, pending]);
|
|
14657
14719
|
return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { ...draft.editProps, children: /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
|
|
14658
14720
|
import_react_aria_components25.TimeField,
|
|
14659
14721
|
{
|
|
@@ -14738,14 +14800,14 @@ var TimeFieldManifest = {
|
|
|
14738
14800
|
};
|
|
14739
14801
|
|
|
14740
14802
|
// src/DateTimePicker/DateTimePicker.tsx
|
|
14741
|
-
var
|
|
14803
|
+
var import_react85 = require("react");
|
|
14742
14804
|
var import_class_variance_authority47 = require("class-variance-authority");
|
|
14743
14805
|
var import_clsx63 = __toESM(require("clsx"), 1);
|
|
14744
14806
|
var import_jsx_runtime66 = require("react/jsx-runtime");
|
|
14745
14807
|
var pickerStyles = (0, import_class_variance_authority47.cva)(
|
|
14746
14808
|
"flex min-w-0 flex-col gap-2u font-sans text-oprt-base text-oprt-text focus-visible:outline-hidden focus-visible:shadow-oprt-focus"
|
|
14747
14809
|
);
|
|
14748
|
-
var DateTimePicker = (0,
|
|
14810
|
+
var DateTimePicker = (0, import_react85.forwardRef)(
|
|
14749
14811
|
({
|
|
14750
14812
|
label,
|
|
14751
14813
|
value,
|
|
@@ -14760,7 +14822,7 @@ var DateTimePicker = (0, import_react84.forwardRef)(
|
|
|
14760
14822
|
id,
|
|
14761
14823
|
className
|
|
14762
14824
|
}, ref) => {
|
|
14763
|
-
const root = (0,
|
|
14825
|
+
const root = (0, import_react85.useRef)(null);
|
|
14764
14826
|
const setRoot = useMergedRefs(root, ref);
|
|
14765
14827
|
const ids = usePartIds(["label", "zone", "error", "status"], {
|
|
14766
14828
|
id,
|
|
@@ -14768,7 +14830,7 @@ var DateTimePicker = (0, import_react84.forwardRef)(
|
|
|
14768
14830
|
});
|
|
14769
14831
|
const zoneName = typeof timeZone === "string" ? timeZone : "invalid";
|
|
14770
14832
|
const base = `${String(value)}|${String(timeZone)}`;
|
|
14771
|
-
const wall = (0,
|
|
14833
|
+
const wall = (0, import_react85.useMemo)(() => instantWallTime(value, timeZone), [value, timeZone]);
|
|
14772
14834
|
const initial = {
|
|
14773
14835
|
base,
|
|
14774
14836
|
date: wall.date,
|
|
@@ -14778,7 +14840,7 @@ var DateTimePicker = (0, import_react84.forwardRef)(
|
|
|
14778
14840
|
timeValid: true,
|
|
14779
14841
|
dirty: false
|
|
14780
14842
|
};
|
|
14781
|
-
const [draft, setDraft] = (0,
|
|
14843
|
+
const [draft, setDraft] = (0, import_react85.useState)(initial);
|
|
14782
14844
|
const current = draft.base === base ? draft : initial;
|
|
14783
14845
|
const zoneValid = validTimeZone(timeZone);
|
|
14784
14846
|
const boundsValid = (min === void 0 || validInstant(min)) && (max === void 0 || validInstant(max)) && !(min !== void 0 && max !== void 0 && min > max);
|
|
@@ -14788,11 +14850,11 @@ var DateTimePicker = (0, import_react84.forwardRef)(
|
|
|
14788
14850
|
const empty = current.date === null && current.time === null;
|
|
14789
14851
|
const checkedInstant = current.dirty ? candidate : value;
|
|
14790
14852
|
const error = !zoneValid ? "Invalid time zone. Supply an IANA time zone." : !boundsValid ? "Invalid instant bounds. Supply finite epoch milliseconds in ascending order." : !current.dirty && wall.error ? wall.error : !current.dateValid || !current.timeValid ? "Complete the date and time before applying this change." : empty ? required ? "A date and time are required." : null : !current.date || !current.time ? "Enter both a date and a time." : resolution?.status === "invalid" ? resolution.error : ambiguous && current.occurrence === null ? "Choose the earlier or later occurrence of this repeated time." : checkedInstant !== null && min !== void 0 && checkedInstant < min ? `Choose an instant at or after ${formatUtcTimestamp(min)}.` : checkedInstant !== null && max !== void 0 && checkedInstant > max ? `Choose an instant at or before ${formatUtcTimestamp(max)}.` : null;
|
|
14791
|
-
const group = (0,
|
|
14853
|
+
const group = (0, import_react85.useMemo)(() => {
|
|
14792
14854
|
const dayOf = (bound) => bound !== void 0 && zoneValid && boundsValid ? instantWallTime(bound, timeZone).date ?? void 0 : void 0;
|
|
14793
14855
|
return { required, calendar: { min: dayOf(min), max: dayOf(max) } };
|
|
14794
14856
|
}, [required, min, max, timeZone, zoneValid, boundsValid]);
|
|
14795
|
-
const restoring = (0,
|
|
14857
|
+
const restoring = (0, import_react85.useRef)(false);
|
|
14796
14858
|
const restore = useRestoreFocusOnRemoval(root, {
|
|
14797
14859
|
findTarget: () => {
|
|
14798
14860
|
restoring.current = true;
|
|
@@ -14810,9 +14872,9 @@ var DateTimePicker = (0, import_react84.forwardRef)(
|
|
|
14810
14872
|
const from = event.relatedTarget;
|
|
14811
14873
|
return from instanceof Node && event.currentTarget.contains(from);
|
|
14812
14874
|
};
|
|
14813
|
-
const callback = (0,
|
|
14875
|
+
const callback = (0, import_react85.useRef)(onDraftValidityChange);
|
|
14814
14876
|
callback.current = onDraftValidityChange;
|
|
14815
|
-
(0,
|
|
14877
|
+
(0, import_react85.useEffect)(
|
|
14816
14878
|
() => callback.current?.(!error && !current.dirty, { pending: current.dirty }),
|
|
14817
14879
|
[error, current.dirty]
|
|
14818
14880
|
);
|
|
@@ -14974,7 +15036,7 @@ var DateTimePickerManifest = {
|
|
|
14974
15036
|
};
|
|
14975
15037
|
|
|
14976
15038
|
// src/DateRangePicker/DateRangePicker.tsx
|
|
14977
|
-
var
|
|
15039
|
+
var import_react86 = require("react");
|
|
14978
15040
|
var import_class_variance_authority48 = require("class-variance-authority");
|
|
14979
15041
|
var import_clsx64 = __toESM(require("clsx"), 1);
|
|
14980
15042
|
var import_jsx_runtime67 = require("react/jsx-runtime");
|
|
@@ -14983,7 +15045,7 @@ var rangeStyles3 = (0, import_class_variance_authority48.cva)(
|
|
|
14983
15045
|
);
|
|
14984
15046
|
var REQUIRED_GROUP = { required: true };
|
|
14985
15047
|
var keyOf = (value) => value === null ? "null" : JSON.stringify([value.start, value.end]);
|
|
14986
|
-
var DateRangePicker = (0,
|
|
15048
|
+
var DateRangePicker = (0, import_react86.forwardRef)(
|
|
14987
15049
|
({
|
|
14988
15050
|
label,
|
|
14989
15051
|
value,
|
|
@@ -14999,14 +15061,14 @@ var DateRangePicker = (0, import_react85.forwardRef)(
|
|
|
14999
15061
|
id,
|
|
15000
15062
|
className
|
|
15001
15063
|
}, ref) => {
|
|
15002
|
-
const root = (0,
|
|
15064
|
+
const root = (0, import_react86.useRef)(null);
|
|
15003
15065
|
const setRoot = useMergedRefs(root, ref);
|
|
15004
15066
|
const ids = usePartIds(["label", "error", "status"], {
|
|
15005
15067
|
id,
|
|
15006
15068
|
readRendered: () => root.current?.id
|
|
15007
15069
|
});
|
|
15008
15070
|
const base = keyOf(value);
|
|
15009
|
-
const [replacement, setReplacement] = (0,
|
|
15071
|
+
const [replacement, setReplacement] = (0, import_react86.useState)({ base, generation: 0, requested: null });
|
|
15010
15072
|
if (replacement.base !== base) {
|
|
15011
15073
|
setReplacement({
|
|
15012
15074
|
base,
|
|
@@ -15028,7 +15090,7 @@ var DateRangePicker = (0, import_react85.forwardRef)(
|
|
|
15028
15090
|
startPending: false,
|
|
15029
15091
|
endPending: false
|
|
15030
15092
|
};
|
|
15031
|
-
const [draft, setDraft] = (0,
|
|
15093
|
+
const [draft, setDraft] = (0, import_react86.useState)(initial);
|
|
15032
15094
|
const current = draft.base === base ? draft : initial;
|
|
15033
15095
|
const start = parseDateOnly(current.start);
|
|
15034
15096
|
const end = parseDateOnly(current.end);
|
|
@@ -15037,9 +15099,9 @@ var DateRangePicker = (0, import_react85.forwardRef)(
|
|
|
15037
15099
|
const empty = current.start === null && current.end === null;
|
|
15038
15100
|
const pending = current.startPending || current.endPending || current.start !== (value?.start ?? null) || current.end !== (value?.end ?? null);
|
|
15039
15101
|
const error = startConfig.error || endConfig.error || (!current.startValid || !current.endValid ? "Complete both date fields before continuing." : empty ? required ? "A date range is required." : null : !start || !end ? "Enter both a start date and an end date." : start.compare(end) > 0 ? "Start date must be on or before end date." : null);
|
|
15040
|
-
const callback = (0,
|
|
15102
|
+
const callback = (0, import_react86.useRef)(onDraftValidityChange);
|
|
15041
15103
|
callback.current = onDraftValidityChange;
|
|
15042
|
-
(0,
|
|
15104
|
+
(0, import_react86.useEffect)(() => callback.current?.(!error && !pending, { pending }), [error, pending]);
|
|
15043
15105
|
const setEndpoint = (part, next) => {
|
|
15044
15106
|
if (disabled || readOnly) return;
|
|
15045
15107
|
const nextDraft = { ...current, [part]: next };
|
|
@@ -15154,7 +15216,7 @@ var DateRangePickerManifest = {
|
|
|
15154
15216
|
};
|
|
15155
15217
|
|
|
15156
15218
|
// src/FileUpload/FileUpload.tsx
|
|
15157
|
-
var
|
|
15219
|
+
var import_react87 = require("react");
|
|
15158
15220
|
var import_react_aria_components26 = require("react-aria-components");
|
|
15159
15221
|
var import_class_variance_authority49 = require("class-variance-authority");
|
|
15160
15222
|
var import_clsx65 = __toESM(require("clsx"), 1);
|
|
@@ -15182,7 +15244,7 @@ var dropStyles = (0, import_class_variance_authority49.cva)(
|
|
|
15182
15244
|
"flex min-w-0 flex-col items-start gap-2u border border-dashed border-oprt-border bg-oprt-surface-1 p-3u data-[drop-target]:border-oprt-accent data-[focus-visible]:border-oprt-border-focus data-[focus-visible]:shadow-oprt-focus"
|
|
15183
15245
|
);
|
|
15184
15246
|
var validAccept = (token) => /^\.[a-z0-9][a-z0-9._+-]*$/i.test(token) || /^(?:[a-z0-9!#$&^_.+-]+\/(?:[a-z0-9!#$&^_.+-]+|\*)|\*\/\*)$/i.test(token);
|
|
15185
|
-
var FileUpload = (0,
|
|
15247
|
+
var FileUpload = (0, import_react87.forwardRef)(
|
|
15186
15248
|
({
|
|
15187
15249
|
label,
|
|
15188
15250
|
description,
|
|
@@ -15198,29 +15260,29 @@ var FileUpload = (0, import_react86.forwardRef)(
|
|
|
15198
15260
|
"aria-describedby": describedBy,
|
|
15199
15261
|
...props
|
|
15200
15262
|
}, ref) => {
|
|
15201
|
-
const root = (0,
|
|
15263
|
+
const root = (0, import_react87.useRef)(null);
|
|
15202
15264
|
const mergedRef = useMergedRefs(root, ref);
|
|
15203
15265
|
const ids = usePartIds(["label", "description", "configuration"], {
|
|
15204
15266
|
id: props.id,
|
|
15205
15267
|
readRendered: () => root.current?.getAttribute("data-oprt-ids")
|
|
15206
15268
|
});
|
|
15207
|
-
const [issues, setIssues] = (0,
|
|
15208
|
-
const [reading, setReading] = (0,
|
|
15209
|
-
const [feedback, setFeedback] = (0,
|
|
15269
|
+
const [issues, setIssues] = (0, import_react87.useState)([]);
|
|
15270
|
+
const [reading, setReading] = (0, import_react87.useState)(false);
|
|
15271
|
+
const [feedback, setFeedback] = (0, import_react87.useState)("");
|
|
15210
15272
|
const isMounted = useIsMounted();
|
|
15211
|
-
const generation = (0,
|
|
15273
|
+
const generation = (0, import_react87.useRef)(0);
|
|
15212
15274
|
const types = accept?.map((token) => token.trim().toLowerCase()) ?? [];
|
|
15213
15275
|
const configurationError = accept?.some((token) => !validAccept(token.trim())) ? "Invalid accept configuration. Use file extensions or MIME types." : maxFiles !== void 0 && (!Number.isSafeInteger(maxFiles) || maxFiles < 1) ? "Invalid maxFiles configuration. Supply a positive integer." : maxFileSizeBytes !== void 0 && (!Number.isSafeInteger(maxFileSizeBytes) || maxFileSizeBytes < 0) ? "Invalid maxFileSizeBytes configuration. Supply a nonnegative integer." : "";
|
|
15214
15276
|
const signature = JSON.stringify([types, multiple, String(maxFiles), String(maxFileSizeBytes)]);
|
|
15215
|
-
const latest = (0,
|
|
15277
|
+
const latest = (0, import_react87.useRef)({ disabled, configurationError, signature, onFiles, onReject });
|
|
15216
15278
|
latest.current = { disabled, configurationError, signature, onFiles, onReject };
|
|
15217
|
-
(0,
|
|
15279
|
+
(0, import_react87.useEffect)(() => {
|
|
15218
15280
|
const requests = generation;
|
|
15219
15281
|
return () => {
|
|
15220
15282
|
requests.current++;
|
|
15221
15283
|
};
|
|
15222
15284
|
}, []);
|
|
15223
|
-
(0,
|
|
15285
|
+
(0, import_react87.useEffect)(() => {
|
|
15224
15286
|
generation.current++;
|
|
15225
15287
|
setReading(false);
|
|
15226
15288
|
}, [signature, disabled]);
|
|
@@ -15417,7 +15479,7 @@ var FileUploadManifest = {
|
|
|
15417
15479
|
};
|
|
15418
15480
|
|
|
15419
15481
|
// src/UploadQueue/UploadQueue.tsx
|
|
15420
|
-
var
|
|
15482
|
+
var import_react88 = require("react");
|
|
15421
15483
|
var import_class_variance_authority50 = require("class-variance-authority");
|
|
15422
15484
|
var import_clsx66 = __toESM(require("clsx"), 1);
|
|
15423
15485
|
var import_jsx_runtime70 = require("react/jsx-runtime");
|
|
@@ -15499,7 +15561,7 @@ function describeChanges(before, after) {
|
|
|
15499
15561
|
if (after.length === 0 && before.length > 0) parts.push("No files selected.");
|
|
15500
15562
|
return parts.join(" ");
|
|
15501
15563
|
}
|
|
15502
|
-
var UploadQueue = (0,
|
|
15564
|
+
var UploadQueue = (0, import_react88.forwardRef)(
|
|
15503
15565
|
({
|
|
15504
15566
|
label,
|
|
15505
15567
|
items,
|
|
@@ -15513,13 +15575,13 @@ var UploadQueue = (0, import_react87.forwardRef)(
|
|
|
15513
15575
|
"aria-labelledby": labelledBy,
|
|
15514
15576
|
...props
|
|
15515
15577
|
}, ref) => {
|
|
15516
|
-
const root = (0,
|
|
15578
|
+
const root = (0, import_react88.useRef)(null);
|
|
15517
15579
|
const ids = usePartIds(["label"], {
|
|
15518
15580
|
id: props.id,
|
|
15519
15581
|
readRendered: () => root.current?.getAttribute("data-oprt-ids")
|
|
15520
15582
|
});
|
|
15521
|
-
const rows = (0,
|
|
15522
|
-
(0,
|
|
15583
|
+
const rows = (0, import_react88.useRef)(/* @__PURE__ */ new Map());
|
|
15584
|
+
(0, import_react88.useImperativeHandle)(ref, () => root.current, []);
|
|
15523
15585
|
const invalidIdentity = hasInvalidIdentity(items);
|
|
15524
15586
|
const restoreFocus = useRestoreFocusOnRemoval(root, {
|
|
15525
15587
|
track: (element) => {
|
|
@@ -15534,17 +15596,17 @@ var UploadQueue = (0, import_react87.forwardRef)(
|
|
|
15534
15596
|
}
|
|
15535
15597
|
});
|
|
15536
15598
|
const signature = JSON.stringify(rowsOf(items));
|
|
15537
|
-
const announced = (0,
|
|
15538
|
-
const [announcement, setAnnouncement] = (0,
|
|
15539
|
-
const lastAnnouncement = (0,
|
|
15540
|
-
const repeatFrame = (0,
|
|
15541
|
-
(0,
|
|
15599
|
+
const announced = (0, import_react88.useRef)(null);
|
|
15600
|
+
const [announcement, setAnnouncement] = (0, import_react88.useState)("");
|
|
15601
|
+
const lastAnnouncement = (0, import_react88.useRef)("");
|
|
15602
|
+
const repeatFrame = (0, import_react88.useRef)(null);
|
|
15603
|
+
(0, import_react88.useEffect)(
|
|
15542
15604
|
() => () => {
|
|
15543
15605
|
if (repeatFrame.current !== null) cancelAnimationFrame(repeatFrame.current);
|
|
15544
15606
|
},
|
|
15545
15607
|
[]
|
|
15546
15608
|
);
|
|
15547
|
-
(0,
|
|
15609
|
+
(0, import_react88.useEffect)(() => {
|
|
15548
15610
|
const after = JSON.parse(signature);
|
|
15549
15611
|
const before = announced.current;
|
|
15550
15612
|
announced.current = after;
|
|
@@ -15568,7 +15630,7 @@ var UploadQueue = (0, import_react87.forwardRef)(
|
|
|
15568
15630
|
}, [signature]);
|
|
15569
15631
|
const unknownStates = items.filter((item) => !isKnownState(item.state)).map((item) => item.state);
|
|
15570
15632
|
const unknownKey = JSON.stringify(unknownStates);
|
|
15571
|
-
(0,
|
|
15633
|
+
(0, import_react88.useEffect)(() => {
|
|
15572
15634
|
if (process.env.NODE_ENV === "production") return;
|
|
15573
15635
|
for (const state of JSON.parse(unknownKey)) reportUnknownState(state);
|
|
15574
15636
|
}, [unknownKey]);
|
|
@@ -15729,7 +15791,7 @@ var UploadQueueManifest = {
|
|
|
15729
15791
|
};
|
|
15730
15792
|
|
|
15731
15793
|
// src/AttachmentPreview/AttachmentPreview.tsx
|
|
15732
|
-
var
|
|
15794
|
+
var import_react89 = require("react");
|
|
15733
15795
|
var import_class_variance_authority51 = require("class-variance-authority");
|
|
15734
15796
|
var import_clsx67 = __toESM(require("clsx"), 1);
|
|
15735
15797
|
var import_jsx_runtime71 = require("react/jsx-runtime");
|
|
@@ -15752,7 +15814,7 @@ function safeImageSource(src) {
|
|
|
15752
15814
|
return false;
|
|
15753
15815
|
}
|
|
15754
15816
|
}
|
|
15755
|
-
var AttachmentPreview = (0,
|
|
15817
|
+
var AttachmentPreview = (0, import_react89.forwardRef)(
|
|
15756
15818
|
({
|
|
15757
15819
|
label,
|
|
15758
15820
|
attachment,
|
|
@@ -15764,14 +15826,14 @@ var AttachmentPreview = (0, import_react88.forwardRef)(
|
|
|
15764
15826
|
"aria-labelledby": labelledBy,
|
|
15765
15827
|
...props
|
|
15766
15828
|
}, ref) => {
|
|
15767
|
-
const root = (0,
|
|
15829
|
+
const root = (0, import_react89.useRef)(null);
|
|
15768
15830
|
const mergedRef = useMergedRefs(root, ref);
|
|
15769
15831
|
const ids = usePartIds(["label"], {
|
|
15770
15832
|
id: props.id,
|
|
15771
15833
|
readRendered: () => root.current?.getAttribute("data-oprt-ids")
|
|
15772
15834
|
});
|
|
15773
15835
|
const imageKey = `${attachment.id}\0${preview.kind === "image" ? preview.src : ""}`;
|
|
15774
|
-
const [imageState, setImageState] = (0,
|
|
15836
|
+
const [imageState, setImageState] = (0, import_react89.useState)({ key: imageKey, failed: false });
|
|
15775
15837
|
if (imageState.key !== imageKey) setImageState({ key: imageKey, failed: false });
|
|
15776
15838
|
const imageError = preview.kind === "image" ? !safeImageSource(preview.src) ? "Image preview source is not supported." : imageState.key === imageKey && imageState.failed ? "Image preview could not be loaded." : null : null;
|
|
15777
15839
|
return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
|
|
@@ -15909,7 +15971,7 @@ var AttachmentPreviewManifest = {
|
|
|
15909
15971
|
};
|
|
15910
15972
|
|
|
15911
15973
|
// src/JobStatus/JobStatus.tsx
|
|
15912
|
-
var
|
|
15974
|
+
var import_react90 = require("react");
|
|
15913
15975
|
var import_class_variance_authority52 = require("class-variance-authority");
|
|
15914
15976
|
var import_clsx68 = __toESM(require("clsx"), 1);
|
|
15915
15977
|
|
|
@@ -15969,7 +16031,7 @@ var import_jsx_runtime72 = require("react/jsx-runtime");
|
|
|
15969
16031
|
var jobStyles = (0, import_class_variance_authority52.cva)(
|
|
15970
16032
|
"flex min-w-0 flex-col gap-2u border border-oprt-border p-2u font-sans text-oprt-base normal-case text-oprt-text outline-hidden focus-visible:shadow-oprt-focus"
|
|
15971
16033
|
);
|
|
15972
|
-
var JobStatus = (0,
|
|
16034
|
+
var JobStatus = (0, import_react90.forwardRef)((allProps, ref) => {
|
|
15973
16035
|
const {
|
|
15974
16036
|
jobId,
|
|
15975
16037
|
label,
|
|
@@ -15995,8 +16057,8 @@ var JobStatus = (0, import_react89.forwardRef)((allProps, ref) => {
|
|
|
15995
16057
|
const canRetry = !!onRetryRequest && ["failed", "partial", "canceled"].includes(state);
|
|
15996
16058
|
const blocked = disabled || requestPending !== null;
|
|
15997
16059
|
const pendingText = requestPending ? `${requestPending === "cancel" ? "Cancellation" : "Retry"} request pending. Awaiting an application update.` : "";
|
|
15998
|
-
const [spokenText, setSpokenText] = (0,
|
|
15999
|
-
(0,
|
|
16060
|
+
const [spokenText, setSpokenText] = (0, import_react90.useState)(pendingText);
|
|
16061
|
+
(0, import_react90.useEffect)(() => {
|
|
16000
16062
|
let second = 0;
|
|
16001
16063
|
const first = requestAnimationFrame(() => {
|
|
16002
16064
|
second = requestAnimationFrame(() => setSpokenText(pendingText));
|
|
@@ -16070,7 +16132,7 @@ var JobStatus = (0, import_react89.forwardRef)((allProps, ref) => {
|
|
|
16070
16132
|
JobStatus.displayName = "JobStatus";
|
|
16071
16133
|
|
|
16072
16134
|
// src/BulkActionBar/BulkActionBar.tsx
|
|
16073
|
-
var
|
|
16135
|
+
var import_react91 = require("react");
|
|
16074
16136
|
var import_class_variance_authority53 = require("class-variance-authority");
|
|
16075
16137
|
var import_clsx69 = __toESM(require("clsx"), 1);
|
|
16076
16138
|
|
|
@@ -16117,7 +16179,7 @@ var import_jsx_runtime73 = require("react/jsx-runtime");
|
|
|
16117
16179
|
var barStyles2 = (0, import_class_variance_authority53.cva)(
|
|
16118
16180
|
"flex min-w-0 flex-col gap-2u border border-oprt-border bg-oprt-surface-1 p-2u font-sans text-oprt-base text-oprt-text outline-hidden focus-visible:shadow-oprt-focus"
|
|
16119
16181
|
);
|
|
16120
|
-
var BulkActionBar = (0,
|
|
16182
|
+
var BulkActionBar = (0, import_react91.forwardRef)(
|
|
16121
16183
|
({
|
|
16122
16184
|
label,
|
|
16123
16185
|
selection,
|
|
@@ -16129,7 +16191,7 @@ var BulkActionBar = (0, import_react90.forwardRef)(
|
|
|
16129
16191
|
headingLevel = 3,
|
|
16130
16192
|
className
|
|
16131
16193
|
}, ref) => {
|
|
16132
|
-
const id = (0,
|
|
16194
|
+
const id = (0, import_react91.useId)();
|
|
16133
16195
|
const focus = useActionFocus(ref);
|
|
16134
16196
|
const Heading5 = `h${headingLevel}`;
|
|
16135
16197
|
const invalidSelection = selectionError(selection);
|
|
@@ -16290,7 +16352,7 @@ var BulkActionBarManifest = {
|
|
|
16290
16352
|
};
|
|
16291
16353
|
|
|
16292
16354
|
// src/BulkResults/BulkResults.tsx
|
|
16293
|
-
var
|
|
16355
|
+
var import_react92 = require("react");
|
|
16294
16356
|
var import_class_variance_authority54 = require("class-variance-authority");
|
|
16295
16357
|
var import_clsx70 = __toESM(require("clsx"), 1);
|
|
16296
16358
|
var import_jsx_runtime74 = require("react/jsx-runtime");
|
|
@@ -16313,7 +16375,7 @@ var COLUMNS = [
|
|
|
16313
16375
|
{ heading: "Details", width: "min-w-16u" },
|
|
16314
16376
|
{ heading: "Actions", width: "" }
|
|
16315
16377
|
];
|
|
16316
|
-
var BulkResults = (0,
|
|
16378
|
+
var BulkResults = (0, import_react92.forwardRef)(
|
|
16317
16379
|
({
|
|
16318
16380
|
label,
|
|
16319
16381
|
selection,
|
|
@@ -16326,10 +16388,10 @@ var BulkResults = (0, import_react91.forwardRef)(
|
|
|
16326
16388
|
className
|
|
16327
16389
|
}, ref) => {
|
|
16328
16390
|
const Heading5 = `h${headingLevel}`;
|
|
16329
|
-
const root = (0,
|
|
16330
|
-
(0,
|
|
16391
|
+
const root = (0, import_react92.useRef)(null);
|
|
16392
|
+
(0, import_react92.useImperativeHandle)(ref, () => root.current, []);
|
|
16331
16393
|
const [box, scrolls] = useScrollsSideways();
|
|
16332
|
-
const rows = (0,
|
|
16394
|
+
const rows = (0, import_react92.useRef)(/* @__PURE__ */ new Map());
|
|
16333
16395
|
const invalidSelection = selectionError(selection);
|
|
16334
16396
|
const selected = new Set(invalidSelection ? [] : selection.ids);
|
|
16335
16397
|
const invalidResults = idsError(items.map((item) => item.id)) || (items.some((item) => !selected.has(item.id)) ? "A result ID is outside the selection snapshot." : null) || (items.some(
|
|
@@ -16337,13 +16399,13 @@ var BulkResults = (0, import_react91.forwardRef)(
|
|
|
16337
16399
|
) ? "Every result needs a valid state, label, and message." : null);
|
|
16338
16400
|
const invalidRetries = idsError(pendingRetryIds) || (pendingRetryIds.some((item) => !selected.has(item)) ? "A pending retry ID is outside the selection snapshot." : null);
|
|
16339
16401
|
const resultMap = new Map((invalidResults ? [] : items).map((item) => [item.id, item]));
|
|
16340
|
-
const pending = (0,
|
|
16402
|
+
const pending = (0, import_react92.useMemo)(() => new Set(pendingRetryIds), [pendingRetryIds]);
|
|
16341
16403
|
const missing = invalidSelection ? 0 : selection.ids.filter((item) => !resultMap.has(item)).length;
|
|
16342
16404
|
const succeeded = invalidResults ? 0 : items.filter((item) => item.state === "succeeded").length;
|
|
16343
16405
|
const ids = invalidSelection ? NO_IDS : selection.ids;
|
|
16344
16406
|
const size = Number.isFinite(pageSize) && pageSize >= 1 ? Math.floor(pageSize) : DEFAULT_PAGE_SIZE;
|
|
16345
16407
|
const pageCount = Math.max(1, Math.ceil(ids.length / size));
|
|
16346
|
-
const [paging, setPaging] = (0,
|
|
16408
|
+
const [paging, setPaging] = (0, import_react92.useState)({ snapshot: selection.id, page: 1 });
|
|
16347
16409
|
const requestedPage = paging.snapshot === selection.id ? paging.page : 1;
|
|
16348
16410
|
const page = Math.min(pageCount, Math.max(1, requestedPage));
|
|
16349
16411
|
const pageIds = ids.length > size ? ids.slice((page - 1) * size, page * size) : ids;
|
|
@@ -16361,14 +16423,14 @@ var BulkResults = (0, import_react91.forwardRef)(
|
|
|
16361
16423
|
return next?.querySelector("button:not(:disabled)") ?? next?.querySelector("th") ?? root.current;
|
|
16362
16424
|
}
|
|
16363
16425
|
});
|
|
16364
|
-
const [spoken, setSpoken] = (0,
|
|
16365
|
-
const announced = (0,
|
|
16366
|
-
const latest = (0,
|
|
16426
|
+
const [spoken, setSpoken] = (0, import_react92.useState)("");
|
|
16427
|
+
const announced = (0, import_react92.useRef)(new Set(invalidRetries ? [] : pendingRetryIds));
|
|
16428
|
+
const latest = (0, import_react92.useRef)({ results: resultMap, pending: pendingRetryIds });
|
|
16367
16429
|
useIsomorphicLayoutEffect(() => {
|
|
16368
16430
|
latest.current = { results: resultMap, pending: pendingRetryIds };
|
|
16369
16431
|
});
|
|
16370
16432
|
const pendingKey = JSON.stringify(pendingRetryIds);
|
|
16371
|
-
(0,
|
|
16433
|
+
(0, import_react92.useEffect)(() => {
|
|
16372
16434
|
const current = invalidRetries ? [] : latest.current.pending;
|
|
16373
16435
|
for (const itemId of [...announced.current])
|
|
16374
16436
|
if (!current.includes(itemId)) announced.current.delete(itemId);
|
|
@@ -16590,7 +16652,7 @@ var BulkResultsManifest = {
|
|
|
16590
16652
|
};
|
|
16591
16653
|
|
|
16592
16654
|
// src/MapControls/MapControls.tsx
|
|
16593
|
-
var
|
|
16655
|
+
var import_react93 = require("react");
|
|
16594
16656
|
var import_react_aria7 = require("react-aria");
|
|
16595
16657
|
var import_class_variance_authority55 = require("class-variance-authority");
|
|
16596
16658
|
var import_clsx71 = __toESM(require("clsx"), 1);
|
|
@@ -16610,7 +16672,7 @@ var actions = [
|
|
|
16610
16672
|
{ id: "reset-north", label: "Reset north" },
|
|
16611
16673
|
{ id: "fit", label: "Fit map" }
|
|
16612
16674
|
];
|
|
16613
|
-
var MapControls = (0,
|
|
16675
|
+
var MapControls = (0, import_react93.forwardRef)(
|
|
16614
16676
|
({
|
|
16615
16677
|
label = "Map controls",
|
|
16616
16678
|
zoom = null,
|
|
@@ -16626,15 +16688,15 @@ var MapControls = (0, import_react92.forwardRef)(
|
|
|
16626
16688
|
onBlurCapture,
|
|
16627
16689
|
...props
|
|
16628
16690
|
}, ref) => {
|
|
16629
|
-
const root = (0,
|
|
16630
|
-
(0,
|
|
16631
|
-
const labelRef = (0,
|
|
16691
|
+
const root = (0, import_react93.useRef)(null);
|
|
16692
|
+
(0, import_react93.useImperativeHandle)(ref, () => root.current, []);
|
|
16693
|
+
const labelRef = (0, import_react93.useRef)(null);
|
|
16632
16694
|
const ids = usePartIds(["label"], {
|
|
16633
16695
|
id,
|
|
16634
16696
|
readRendered: () => labelRef.current?.id.replace(/-label$/, "")
|
|
16635
16697
|
});
|
|
16636
16698
|
const readout = (0, import_react_aria7.useNumberFormatter)(READOUT);
|
|
16637
|
-
const buttons = (0,
|
|
16699
|
+
const buttons = (0, import_react93.useRef)(/* @__PURE__ */ new Map());
|
|
16638
16700
|
const limitsValid = Number.isFinite(minZoom) && Number.isFinite(maxZoom) && minZoom <= maxZoom;
|
|
16639
16701
|
const validZoom = typeof zoom === "number" && Number.isFinite(zoom) && limitsValid && zoom >= minZoom && zoom <= maxZoom;
|
|
16640
16702
|
const validBearing = typeof bearing === "number" && Number.isFinite(bearing) && bearing >= 0 && bearing < 360;
|
|
@@ -16734,7 +16796,7 @@ var MapControlsManifest = {
|
|
|
16734
16796
|
};
|
|
16735
16797
|
|
|
16736
16798
|
// src/LayerControl/LayerControl.tsx
|
|
16737
|
-
var
|
|
16799
|
+
var import_react94 = require("react");
|
|
16738
16800
|
var import_class_variance_authority56 = require("class-variance-authority");
|
|
16739
16801
|
var import_clsx72 = __toESM(require("clsx"), 1);
|
|
16740
16802
|
var import_jsx_runtime76 = require("react/jsx-runtime");
|
|
@@ -16744,7 +16806,7 @@ var controlStyles3 = (0, import_class_variance_authority56.cva)(
|
|
|
16744
16806
|
var rowStyles = (0, import_class_variance_authority56.cva)(
|
|
16745
16807
|
"flex min-w-0 flex-col gap-2u border border-oprt-border p-2u outline-hidden focus-visible:shadow-oprt-focus"
|
|
16746
16808
|
);
|
|
16747
|
-
var LayerControl = (0,
|
|
16809
|
+
var LayerControl = (0, import_react94.forwardRef)(
|
|
16748
16810
|
({
|
|
16749
16811
|
label = "Map layers",
|
|
16750
16812
|
layers,
|
|
@@ -16757,14 +16819,14 @@ var LayerControl = (0, import_react93.forwardRef)(
|
|
|
16757
16819
|
"aria-labelledby": labelledBy,
|
|
16758
16820
|
...props
|
|
16759
16821
|
}, ref) => {
|
|
16760
|
-
const root = (0,
|
|
16761
|
-
const labelRef = (0,
|
|
16822
|
+
const root = (0, import_react94.useRef)(null);
|
|
16823
|
+
const labelRef = (0, import_react94.useRef)(null);
|
|
16762
16824
|
const ids = usePartIds(["label"], {
|
|
16763
16825
|
id,
|
|
16764
16826
|
readRendered: () => labelRef.current?.id.replace(/-label$/, "")
|
|
16765
16827
|
});
|
|
16766
|
-
const rows = (0,
|
|
16767
|
-
(0,
|
|
16828
|
+
const rows = (0, import_react94.useRef)(/* @__PURE__ */ new Map());
|
|
16829
|
+
(0, import_react94.useImperativeHandle)(ref, () => root.current, []);
|
|
16768
16830
|
const invalidIds = layers.some(
|
|
16769
16831
|
(item, index) => !item.id.trim() || layers.findIndex((other) => other.id === item.id) !== index
|
|
16770
16832
|
);
|
|
@@ -16955,7 +17017,7 @@ var LayerControlManifest = {
|
|
|
16955
17017
|
};
|
|
16956
17018
|
|
|
16957
17019
|
// src/MapLegend/MapLegend.tsx
|
|
16958
|
-
var
|
|
17020
|
+
var import_react95 = require("react");
|
|
16959
17021
|
var import_class_variance_authority57 = require("class-variance-authority");
|
|
16960
17022
|
var import_clsx73 = __toESM(require("clsx"), 1);
|
|
16961
17023
|
var import_jsx_runtime77 = require("react/jsx-runtime");
|
|
@@ -16980,9 +17042,9 @@ var symbolStyles = (0, import_class_variance_authority57.cva)("block shrink-0 fo
|
|
|
16980
17042
|
defaultVariants: { variant: "neutral", pattern: "solid" }
|
|
16981
17043
|
});
|
|
16982
17044
|
var kinds = { point: "Point", line: "Line", area: "Area" };
|
|
16983
|
-
var MapLegend = (0,
|
|
17045
|
+
var MapLegend = (0, import_react95.forwardRef)(
|
|
16984
17046
|
({ label = "Map legend", items, className, id, "aria-labelledby": labelledBy, ...props }, ref) => {
|
|
16985
|
-
const labelRef = (0,
|
|
17047
|
+
const labelRef = (0, import_react95.useRef)(null);
|
|
16986
17048
|
const ids = usePartIds(["label"], {
|
|
16987
17049
|
id,
|
|
16988
17050
|
readRendered: () => labelRef.current?.id.replace(/-label$/, "")
|
|
@@ -17066,7 +17128,7 @@ var MapLegendManifest = {
|
|
|
17066
17128
|
};
|
|
17067
17129
|
|
|
17068
17130
|
// src/MapScale/MapScale.tsx
|
|
17069
|
-
var
|
|
17131
|
+
var import_react96 = require("react");
|
|
17070
17132
|
var import_react_aria8 = require("react-aria");
|
|
17071
17133
|
var import_class_variance_authority58 = require("class-variance-authority");
|
|
17072
17134
|
var import_clsx74 = __toESM(require("clsx"), 1);
|
|
@@ -17117,7 +17179,7 @@ function scale2(metersPerPixel, width, units) {
|
|
|
17117
17179
|
if (!Number.isFinite(pixels) || pixels <= 0 || pixels > width) return null;
|
|
17118
17180
|
return { pixels, distance, unit };
|
|
17119
17181
|
}
|
|
17120
|
-
var MapScale = (0,
|
|
17182
|
+
var MapScale = (0, import_react96.forwardRef)((allProps, ref) => {
|
|
17121
17183
|
const {
|
|
17122
17184
|
label = "Map scale",
|
|
17123
17185
|
metersPerPixel = null,
|
|
@@ -17131,13 +17193,13 @@ var MapScale = (0, import_react95.forwardRef)((allProps, ref) => {
|
|
|
17131
17193
|
if (process.env.NODE_ENV !== "production") {
|
|
17132
17194
|
devValidate("MapScale", MapScaleManifest.MapScale.props, { ...allProps });
|
|
17133
17195
|
}
|
|
17134
|
-
const labelRef = (0,
|
|
17196
|
+
const labelRef = (0, import_react96.useRef)(null);
|
|
17135
17197
|
const ids = usePartIds(["label"], {
|
|
17136
17198
|
id,
|
|
17137
17199
|
readRendered: () => labelRef.current?.id.replace(/-label$/, "")
|
|
17138
17200
|
});
|
|
17139
17201
|
const format = (0, import_react_aria8.useNumberFormatter)(DISTANCE);
|
|
17140
|
-
const available = (0,
|
|
17202
|
+
const available = (0, import_react96.useRef)(null);
|
|
17141
17203
|
const measuredWidth = useElementWidth(available, {
|
|
17142
17204
|
initial: null
|
|
17143
17205
|
});
|
|
@@ -17184,7 +17246,7 @@ var MapScale = (0, import_react95.forwardRef)((allProps, ref) => {
|
|
|
17184
17246
|
MapScale.displayName = "MapScale";
|
|
17185
17247
|
|
|
17186
17248
|
// src/MediaFrame/MediaFrame.tsx
|
|
17187
|
-
var
|
|
17249
|
+
var import_react97 = require("react");
|
|
17188
17250
|
var import_react_aria9 = require("react-aria");
|
|
17189
17251
|
var import_class_variance_authority59 = require("class-variance-authority");
|
|
17190
17252
|
var import_clsx75 = __toESM(require("clsx"), 1);
|
|
@@ -17250,7 +17312,7 @@ var EXACT_NUMBER2 = { maximumSignificantDigits: 21 };
|
|
|
17250
17312
|
var frameStyles = (0, import_class_variance_authority59.cva)(
|
|
17251
17313
|
"flex min-w-0 flex-col border border-oprt-border bg-oprt-surface-1 font-sans text-oprt-base normal-case text-oprt-text"
|
|
17252
17314
|
);
|
|
17253
|
-
var MediaFrame = (0,
|
|
17315
|
+
var MediaFrame = (0, import_react97.forwardRef)((allProps, ref) => {
|
|
17254
17316
|
const {
|
|
17255
17317
|
label,
|
|
17256
17318
|
state,
|
|
@@ -17270,7 +17332,7 @@ var MediaFrame = (0, import_react96.forwardRef)((allProps, ref) => {
|
|
|
17270
17332
|
if (process.env.NODE_ENV !== "production") {
|
|
17271
17333
|
devValidate("MediaFrame", MediaFrameManifest.MediaFrame.props, { ...allProps });
|
|
17272
17334
|
}
|
|
17273
|
-
const labelRef = (0,
|
|
17335
|
+
const labelRef = (0, import_react97.useRef)(null);
|
|
17274
17336
|
const ids = usePartIds(["label"], {
|
|
17275
17337
|
id,
|
|
17276
17338
|
readRendered: () => labelRef.current?.id.replace(/-label$/, "")
|
|
@@ -17346,7 +17408,7 @@ MediaFrame.displayName = "MediaFrame";
|
|
|
17346
17408
|
// src/PlaybackControls/PlaybackControls.tsx
|
|
17347
17409
|
var import_class_variance_authority60 = require("class-variance-authority");
|
|
17348
17410
|
var import_clsx76 = __toESM(require("clsx"), 1);
|
|
17349
|
-
var
|
|
17411
|
+
var import_react98 = require("react");
|
|
17350
17412
|
var import_react_aria_components27 = require("react-aria-components");
|
|
17351
17413
|
var import_jsx_runtime80 = require("react/jsx-runtime");
|
|
17352
17414
|
var rootStyles8 = (0, import_class_variance_authority60.cva)(
|
|
@@ -17401,7 +17463,7 @@ function arrowDirection(key, rightToLeft) {
|
|
|
17401
17463
|
if (key === "ArrowLeft" || key === "Left") return rightToLeft ? 1 : -1;
|
|
17402
17464
|
return 0;
|
|
17403
17465
|
}
|
|
17404
|
-
var PlaybackControls = (0,
|
|
17466
|
+
var PlaybackControls = (0, import_react98.forwardRef)(
|
|
17405
17467
|
({
|
|
17406
17468
|
start,
|
|
17407
17469
|
end,
|
|
@@ -17425,12 +17487,12 @@ var PlaybackControls = (0, import_react97.forwardRef)(
|
|
|
17425
17487
|
onBlurCapture,
|
|
17426
17488
|
...props
|
|
17427
17489
|
}, ref) => {
|
|
17428
|
-
const descriptionId = (0,
|
|
17429
|
-
const root = (0,
|
|
17430
|
-
(0,
|
|
17431
|
-
const previousRef = (0,
|
|
17432
|
-
const playRef = (0,
|
|
17433
|
-
const nextRef = (0,
|
|
17490
|
+
const descriptionId = (0, import_react98.useId)();
|
|
17491
|
+
const root = (0, import_react98.useRef)(null);
|
|
17492
|
+
(0, import_react98.useImperativeHandle)(ref, () => root.current, []);
|
|
17493
|
+
const previousRef = (0, import_react98.useRef)(null);
|
|
17494
|
+
const playRef = (0, import_react98.useRef)(null);
|
|
17495
|
+
const nextRef = (0, import_react98.useRef)(null);
|
|
17434
17496
|
const { direction } = (0, import_react_aria_components27.useLocale)();
|
|
17435
17497
|
const validBounds = validTime(start) && validTime(end);
|
|
17436
17498
|
const validRange = validBounds && start < end;
|
|
@@ -17442,7 +17504,7 @@ var PlaybackControls = (0, import_react97.forwardRef)(
|
|
|
17442
17504
|
const sliderEnd = validRange ? end : 1;
|
|
17443
17505
|
const displayValue = validRange && validCursor ? Math.min(end, Math.max(start, value)) : sliderStart;
|
|
17444
17506
|
const positionText = validRange && validCursor ? formatTime(displayValue) : validBounds && start === end ? formatTime(start) : "Unknown playback position";
|
|
17445
|
-
const events = (0,
|
|
17507
|
+
const events = (0, import_react98.useMemo)(
|
|
17446
17508
|
() => [
|
|
17447
17509
|
...new Set(
|
|
17448
17510
|
(eventTimes ?? []).filter((time) => validTime(time) && time >= start && time <= end)
|
|
@@ -17700,7 +17762,7 @@ var PlaybackControlsManifest = {
|
|
|
17700
17762
|
};
|
|
17701
17763
|
|
|
17702
17764
|
// package.json
|
|
17703
|
-
var version3 = "0.
|
|
17765
|
+
var version3 = "0.4.0";
|
|
17704
17766
|
|
|
17705
17767
|
// src/version.ts
|
|
17706
17768
|
var VERSION = version3;
|