@jirawatpyk/aura-react 5.1.0 → 5.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/aura.bundle.js +418 -148
- package/dist/cjs/index.cjs +418 -148
- package/dist/esm/AppShell.js +10 -2
- package/dist/esm/Avatar.js +4 -3
- package/dist/esm/BottomNav.js +2 -1
- package/dist/esm/Checkbox.js +3 -2
- package/dist/esm/Combobox.js +19 -19
- package/dist/esm/Command.js +1 -0
- package/dist/esm/DataTable.js +44 -14
- package/dist/esm/DatePicker.js +81 -18
- package/dist/esm/DropdownMenu.js +12 -0
- package/dist/esm/FileUpload.js +15 -0
- package/dist/esm/FormErrorSummary.js +19 -4
- package/dist/esm/Menu.js +20 -7
- package/dist/esm/NumberField.js +3 -1
- package/dist/esm/Pagination.js +3 -3
- package/dist/esm/Popover.js +11 -1
- package/dist/esm/RadioGroup.js +14 -1
- package/dist/esm/SideNav.js +2 -1
- package/dist/esm/Switch.js +1 -1
- package/dist/esm/Table.js +3 -2
- package/dist/esm/Tabs.js +11 -7
- package/dist/esm/TextField.js +2 -2
- package/dist/esm/Textarea.js +2 -2
- package/dist/esm/ThemeStyle.js +13 -3
- package/dist/esm/Toaster.js +1 -0
- package/dist/esm/Tooltip.js +54 -29
- package/dist/esm/colorScheme.js +7 -3
- package/dist/esm/colorSchemeScript.js +3 -3
- package/dist/esm/dates.js +6 -3
- package/dist/esm/internal.js +18 -7
- package/dist/esm/locale.js +6 -5
- package/dist/esm/theme.js +3 -1
- package/dist/esm/useModal.js +31 -8
- package/dist/index.d.cts +1508 -0
- package/dist/index.d.ts +1 -1
- package/dist/server/index.cjs +6 -4
- package/dist/server/index.d.cts +176 -0
- package/dist/server/index.js +6 -4
- package/dist/styles.css +19 -3
- package/dist/styles.layer.css +19 -3
- package/package.json +19 -8
package/dist/cjs/index.cjs
CHANGED
|
@@ -138,14 +138,21 @@ function omit(src, keys) {
|
|
|
138
138
|
}
|
|
139
139
|
function useMaybeControlled(value, initial, onChange) {
|
|
140
140
|
const s = React.useState(initial);
|
|
141
|
+
const wasSet = React.useState(value !== void 0);
|
|
142
|
+
if (value !== void 0 && !wasSet[0]) wasSet[1](true);
|
|
143
|
+
else if (value === void 0 && wasSet[0]) {
|
|
144
|
+
wasSet[1](false);
|
|
145
|
+
s[1](initial);
|
|
146
|
+
}
|
|
141
147
|
const controlled = value !== void 0;
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
];
|
|
148
|
+
const latest = React.useRef({ controlled, onChange, set: s[1] });
|
|
149
|
+
latest.current = { controlled, onChange, set: s[1] };
|
|
150
|
+
const set = React.useCallback(function(next) {
|
|
151
|
+
const l = latest.current;
|
|
152
|
+
if (!l.controlled) l.set(next);
|
|
153
|
+
if (l.onChange) l.onChange(next);
|
|
154
|
+
}, []);
|
|
155
|
+
return [controlled ? value : s[0], set];
|
|
149
156
|
}
|
|
150
157
|
var collator = typeof Intl !== "undefined" ? new Intl.Collator(["th", "en"], { numeric: true, sensitivity: "base" }) : null;
|
|
151
158
|
function compare(a, b) {
|
|
@@ -210,6 +217,9 @@ function tone(t) {
|
|
|
210
217
|
return TONES.indexOf(t) >= 0 ? t : "neutral";
|
|
211
218
|
}
|
|
212
219
|
var warned = {};
|
|
220
|
+
function plainClick(e) {
|
|
221
|
+
return !e.defaultPrevented && e.button === 0 && !e.metaKey && !e.ctrlKey && !e.shiftKey && !e.altKey;
|
|
222
|
+
}
|
|
213
223
|
function devWarnOnce(key, message) {
|
|
214
224
|
if (warned[key]) return;
|
|
215
225
|
let dev = false;
|
|
@@ -634,17 +644,18 @@ function AuraProvider(props) {
|
|
|
634
644
|
const timeZone = props.timeZone || outer && outer.timeZone || null;
|
|
635
645
|
const value = React3.useMemo(
|
|
636
646
|
function() {
|
|
637
|
-
const
|
|
647
|
+
const own = !!props.locale || !outer || !outer.locale;
|
|
648
|
+
const base = own ? props.locale && STRINGS[props.locale] || STRINGS.en : outer.strings;
|
|
638
649
|
return {
|
|
639
|
-
locale: props.locale || "en",
|
|
640
|
-
calendar: props.calendar || null,
|
|
650
|
+
locale: props.locale || outer && outer.locale || "en",
|
|
651
|
+
calendar: props.calendar || (own ? null : outer.calendar),
|
|
641
652
|
strings: props.strings ? Object.assign({}, base, props.strings) : base,
|
|
642
|
-
linkComponent: props.linkComponent || null,
|
|
653
|
+
linkComponent: props.linkComponent || outer && outer.linkComponent || null,
|
|
643
654
|
density,
|
|
644
655
|
timeZone
|
|
645
656
|
};
|
|
646
657
|
},
|
|
647
|
-
[props.locale, props.calendar, props.strings, props.linkComponent, density, timeZone]
|
|
658
|
+
[props.locale, props.calendar, props.strings, props.linkComponent, density, timeZone, outer]
|
|
648
659
|
);
|
|
649
660
|
return /* @__PURE__ */ React3.createElement(LocaleContext.Provider, { value }, props.density ? /* @__PURE__ */ React3.createElement("div", { className: "aura-density", "data-density": props.density }, props.children) : props.children);
|
|
650
661
|
}
|
|
@@ -783,11 +794,17 @@ var Menu = React6.forwardRef(function Menu2(props, ref) {
|
|
|
783
794
|
function() {
|
|
784
795
|
const a = props.anchor, m = own.current;
|
|
785
796
|
if (!a || !m) return;
|
|
786
|
-
const r = a.getBoundingClientRect(), mh = m.
|
|
787
|
-
let top = r.bottom + 4;
|
|
788
|
-
if (
|
|
797
|
+
const r = a.getBoundingClientRect(), mh = m.scrollHeight, mw = m.offsetWidth, below2 = window.innerHeight - r.bottom - 12, above = r.top - 12;
|
|
798
|
+
let top = r.bottom + 4, maxHeight;
|
|
799
|
+
if (mh > below2) {
|
|
800
|
+
if (mh <= above) top = r.top - mh - 4;
|
|
801
|
+
else if (above > below2) {
|
|
802
|
+
maxHeight = above;
|
|
803
|
+
top = r.top - above - 4;
|
|
804
|
+
} else maxHeight = below2;
|
|
805
|
+
}
|
|
789
806
|
const left = Math.max(8, Math.min(r.right - mw, window.innerWidth - mw - 8));
|
|
790
|
-
setPos({ top, left });
|
|
807
|
+
setPos({ top, left, maxHeight });
|
|
791
808
|
},
|
|
792
809
|
[props.anchor, mounted]
|
|
793
810
|
);
|
|
@@ -831,6 +848,9 @@ var Menu = React6.forwardRef(function Menu2(props, ref) {
|
|
|
831
848
|
} else if (e.key === "End") {
|
|
832
849
|
e.preventDefault();
|
|
833
850
|
list[list.length - 1].focus();
|
|
851
|
+
} else if (e.key === " " && document.activeElement && document.activeElement.tagName === "A") {
|
|
852
|
+
e.preventDefault();
|
|
853
|
+
document.activeElement.click();
|
|
834
854
|
} else if (e.key === "Escape") {
|
|
835
855
|
e.preventDefault();
|
|
836
856
|
props.onClose(true);
|
|
@@ -871,9 +891,9 @@ var Menu = React6.forwardRef(function Menu2(props, ref) {
|
|
|
871
891
|
tabIndex: -1,
|
|
872
892
|
role: "menuitem",
|
|
873
893
|
className: cls,
|
|
874
|
-
onClick: function() {
|
|
894
|
+
onClick: function(e) {
|
|
875
895
|
if (it.onSelect) it.onSelect();
|
|
876
|
-
props.onClose(
|
|
896
|
+
props.onClose(e.detail === 0);
|
|
877
897
|
}
|
|
878
898
|
},
|
|
879
899
|
body
|
|
@@ -904,7 +924,11 @@ var Menu = React6.forwardRef(function Menu2(props, ref) {
|
|
|
904
924
|
"aria-label": props.label,
|
|
905
925
|
className: "aura-menu",
|
|
906
926
|
onKeyDown,
|
|
907
|
-
style: {
|
|
927
|
+
style: {
|
|
928
|
+
top: pos ? pos.top : -9999,
|
|
929
|
+
left: pos ? pos.left : -9999,
|
|
930
|
+
maxHeight: pos && pos.maxHeight ? pos.maxHeight : void 0
|
|
931
|
+
}
|
|
908
932
|
},
|
|
909
933
|
groupItems(items2).map(function(block, bi) {
|
|
910
934
|
const rendered = block.items.map(function(x) {
|
|
@@ -922,6 +946,16 @@ var DropdownMenu = React7.forwardRef(function DropdownMenu2(props, ref) {
|
|
|
922
946
|
const st = React7.useState(null), anchor = st[0], setAnchor = st[1];
|
|
923
947
|
const wrap = React7.useRef(null), wrapMerged = useMergedRef(ref, wrap);
|
|
924
948
|
const child = React7.Children.only(props.trigger);
|
|
949
|
+
const menuRef = React7.useRef(null), toLast = React7.useRef(false);
|
|
950
|
+
React7.useEffect(
|
|
951
|
+
function() {
|
|
952
|
+
if (!anchor || !toLast.current || !menuRef.current) return;
|
|
953
|
+
toLast.current = false;
|
|
954
|
+
const list = menuRef.current.querySelectorAll('[role^="menuitem"]:not([disabled])');
|
|
955
|
+
if (list.length) list[list.length - 1].focus();
|
|
956
|
+
},
|
|
957
|
+
[anchor]
|
|
958
|
+
);
|
|
925
959
|
function toggle(e) {
|
|
926
960
|
if (child.props.onClick) child.props.onClick(e);
|
|
927
961
|
const el = wrap.current && (wrap.current.querySelector('button, [role="button"], a') || wrap.current);
|
|
@@ -930,12 +964,14 @@ var DropdownMenu = React7.forwardRef(function DropdownMenu2(props, ref) {
|
|
|
930
964
|
function onKeyDown(e) {
|
|
931
965
|
if ((e.key === "ArrowDown" || e.key === "ArrowUp") && !anchor) {
|
|
932
966
|
e.preventDefault();
|
|
967
|
+
toLast.current = e.key === "ArrowUp";
|
|
933
968
|
setAnchor(wrap.current.querySelector('button, [role="button"], a') || wrap.current);
|
|
934
969
|
}
|
|
935
970
|
}
|
|
936
971
|
return /* @__PURE__ */ React7.createElement("span", { ref: wrapMerged, className: "aura-dropdown", onKeyDown }, React7.cloneElement(child, { onClick: toggle, "aria-haspopup": "menu", "aria-expanded": anchor ? true : false }), anchor ? /* @__PURE__ */ React7.createElement(
|
|
937
972
|
Menu,
|
|
938
973
|
{
|
|
974
|
+
ref: menuRef,
|
|
939
975
|
anchor,
|
|
940
976
|
label: props.label,
|
|
941
977
|
items: props.items,
|
|
@@ -954,6 +990,7 @@ var Checkbox = React8.forwardRef(function Checkbox2(props, ref) {
|
|
|
954
990
|
const own = React8.useRef(null), merged = useMergedRef(ref, own);
|
|
955
991
|
const st = useMaybeControlled(props.checked, !!props.defaultChecked, props.onChange);
|
|
956
992
|
const on = !!st[0];
|
|
993
|
+
const auto = uid();
|
|
957
994
|
React8.useEffect(function() {
|
|
958
995
|
if (own.current) own.current.indeterminate = !!props.indeterminate;
|
|
959
996
|
});
|
|
@@ -977,7 +1014,7 @@ var Checkbox = React8.forwardRef(function Checkbox2(props, ref) {
|
|
|
977
1014
|
"checkbox-label",
|
|
978
1015
|
"Checkbox `label` is only the accessible name: it is not shown. In 6.0 it will be shown beside the box, like Switch and TextField. For visible text now pass it as children; for a bare box (a table row) add `hideLabel`."
|
|
979
1016
|
);
|
|
980
|
-
const descId = props.description
|
|
1017
|
+
const descId = props.description ? (props.id || auto) + "-desc" : void 0;
|
|
981
1018
|
return /* @__PURE__ */ React8.createElement(
|
|
982
1019
|
"label",
|
|
983
1020
|
{
|
|
@@ -1105,8 +1142,8 @@ var TextField = React11.forwardRef(function TextField2(props, ref) {
|
|
|
1105
1142
|
className: "aura-input__control",
|
|
1106
1143
|
placeholder: props.placeholder,
|
|
1107
1144
|
required: props.required,
|
|
1108
|
-
"aria-invalid": props.error ? true :
|
|
1109
|
-
"aria-describedby": describedBy(id, props)
|
|
1145
|
+
"aria-invalid": props.error ? true : rest["aria-invalid"],
|
|
1146
|
+
"aria-describedby": [describedBy(id, props), rest["aria-describedby"]].filter(Boolean).join(" ") || void 0
|
|
1110
1147
|
}
|
|
1111
1148
|
), props.suffix ? /* @__PURE__ */ React11.createElement("span", { className: "aura-input__suffix" }, props.suffix) : null)
|
|
1112
1149
|
);
|
|
@@ -1139,8 +1176,8 @@ var Textarea = React12.forwardRef(function Textarea2(props, ref) {
|
|
|
1139
1176
|
className: "aura-input aura-textarea",
|
|
1140
1177
|
placeholder: props.placeholder,
|
|
1141
1178
|
required: props.required,
|
|
1142
|
-
"aria-invalid": props.error ? true :
|
|
1143
|
-
"aria-describedby": describedBy(id, props)
|
|
1179
|
+
"aria-invalid": props.error ? true : rest["aria-invalid"],
|
|
1180
|
+
"aria-describedby": [describedBy(id, props), rest["aria-describedby"]].filter(Boolean).join(" ") || void 0
|
|
1144
1181
|
}
|
|
1145
1182
|
)
|
|
1146
1183
|
);
|
|
@@ -1199,10 +1236,22 @@ var RadioGroup = React14.forwardRef(function RadioGroup2(props, ref) {
|
|
|
1199
1236
|
props.onChange
|
|
1200
1237
|
);
|
|
1201
1238
|
const name = props.name || id;
|
|
1239
|
+
const setRef = React14.useCallback(
|
|
1240
|
+
function(el) {
|
|
1241
|
+
if (el)
|
|
1242
|
+
el.focus = function(opts) {
|
|
1243
|
+
const r = el.querySelector('input[type="radio"]:checked') || el.querySelector('input[type="radio"]:not(:disabled)');
|
|
1244
|
+
if (r) r.focus(opts);
|
|
1245
|
+
};
|
|
1246
|
+
if (typeof ref === "function") ref(el);
|
|
1247
|
+
else if (ref) ref.current = el;
|
|
1248
|
+
},
|
|
1249
|
+
[ref]
|
|
1250
|
+
);
|
|
1202
1251
|
return /* @__PURE__ */ React14.createElement(
|
|
1203
1252
|
"fieldset",
|
|
1204
1253
|
{
|
|
1205
|
-
ref,
|
|
1254
|
+
ref: setRef,
|
|
1206
1255
|
className: cx("aura-field aura-radio-group", props.error && "is-invalid", props.className),
|
|
1207
1256
|
"aria-describedby": describedBy(id, props),
|
|
1208
1257
|
"aria-invalid": props.error ? true : void 0,
|
|
@@ -1219,6 +1268,7 @@ var RadioGroup = React14.forwardRef(function RadioGroup2(props, ref) {
|
|
|
1219
1268
|
name,
|
|
1220
1269
|
value: v.value,
|
|
1221
1270
|
disabled: v.disabled,
|
|
1271
|
+
required: props.required || void 0,
|
|
1222
1272
|
checked: st[0] === v.value,
|
|
1223
1273
|
onChange: function() {
|
|
1224
1274
|
st[1](v.value);
|
|
@@ -1265,7 +1315,7 @@ var Switch = React15.forwardRef(function Switch2(props, ref) {
|
|
|
1265
1315
|
},
|
|
1266
1316
|
/* @__PURE__ */ React15.createElement("span", { className: "aura-switch__thumb" })
|
|
1267
1317
|
),
|
|
1268
|
-
props.label ? /* @__PURE__ */ React15.createElement("span", { className: "aura-choice__text" }, /* @__PURE__ */ React15.createElement("label", { className: "aura-choice__label", id: id + "-label", htmlFor: id }, props.label), props.description ? /* @__PURE__ */ React15.createElement("span", { className: "aura-choice__desc", id: id + "-desc" }, props.description) : null) : null
|
|
1318
|
+
props.label ? /* @__PURE__ */ React15.createElement("span", { className: "aura-choice__text" }, /* @__PURE__ */ React15.createElement("label", { className: "aura-choice__label", id: id + "-label", htmlFor: id }, props.label), props.description ? /* @__PURE__ */ React15.createElement("span", { className: "aura-choice__desc", id: id + "-desc" }, props.description) : null) : props.description ? /* @__PURE__ */ React15.createElement("span", { className: "aura-sr-only", id: id + "-desc" }, props.description) : null
|
|
1269
1319
|
);
|
|
1270
1320
|
});
|
|
1271
1321
|
|
|
@@ -1349,7 +1399,7 @@ var Combobox = React16.forwardRef(
|
|
|
1349
1399
|
function() {
|
|
1350
1400
|
if (open) place();
|
|
1351
1401
|
},
|
|
1352
|
-
[open, shown.length]
|
|
1402
|
+
[open, shown.length, values.length]
|
|
1353
1403
|
);
|
|
1354
1404
|
React16.useEffect(
|
|
1355
1405
|
function() {
|
|
@@ -1381,6 +1431,7 @@ var Combobox = React16.forwardRef(
|
|
|
1381
1431
|
},
|
|
1382
1432
|
[activeIdx, open]
|
|
1383
1433
|
);
|
|
1434
|
+
const live = props.loading ? [] : shown;
|
|
1384
1435
|
function openList() {
|
|
1385
1436
|
if (!open && !props.disabled && !props.readOnly) {
|
|
1386
1437
|
setOpen(true);
|
|
@@ -1416,7 +1467,7 @@ var Combobox = React16.forwardRef(
|
|
|
1416
1467
|
if (k === "ArrowDown") {
|
|
1417
1468
|
e.preventDefault();
|
|
1418
1469
|
if (!open) openList();
|
|
1419
|
-
else setActive(Math.min(activeIdx + 1,
|
|
1470
|
+
else setActive(Math.max(0, Math.min(activeIdx + 1, live.length - 1)));
|
|
1420
1471
|
} else if (k === "ArrowUp") {
|
|
1421
1472
|
e.preventDefault();
|
|
1422
1473
|
if (!open) openList();
|
|
@@ -1426,21 +1477,22 @@ var Combobox = React16.forwardRef(
|
|
|
1426
1477
|
setActive(0);
|
|
1427
1478
|
} else if (k === "End" && open) {
|
|
1428
1479
|
e.preventDefault();
|
|
1429
|
-
setActive(
|
|
1480
|
+
setActive(Math.max(0, live.length - 1));
|
|
1430
1481
|
} else if (k === "Enter") {
|
|
1431
|
-
if (
|
|
1482
|
+
if (e.nativeEvent.isComposing || e.keyCode === 229) return;
|
|
1483
|
+
if (open && live[activeIdx]) {
|
|
1432
1484
|
e.preventDefault();
|
|
1433
|
-
choose(
|
|
1485
|
+
choose(live[activeIdx]);
|
|
1434
1486
|
}
|
|
1435
1487
|
} else if (k === "Escape") {
|
|
1436
1488
|
if (open) {
|
|
1437
1489
|
e.preventDefault();
|
|
1438
1490
|
e.stopPropagation();
|
|
1439
1491
|
close();
|
|
1440
|
-
} else if (!multi && props.clearable !== false && value != null && query == null) {
|
|
1492
|
+
} else if (!multi && !props.readOnly && props.clearable !== false && value != null && query == null) {
|
|
1441
1493
|
setValue(null);
|
|
1442
1494
|
}
|
|
1443
|
-
} else if (k === "Backspace" && multi && !text && values.length) {
|
|
1495
|
+
} else if (k === "Backspace" && multi && !props.readOnly && !text && values.length) {
|
|
1444
1496
|
setValues(values.slice(0, -1));
|
|
1445
1497
|
} else if (k === "Tab") {
|
|
1446
1498
|
if (open) close();
|
|
@@ -1452,7 +1504,7 @@ var Combobox = React16.forwardRef(
|
|
|
1452
1504
|
return id + "-opt-" + i;
|
|
1453
1505
|
};
|
|
1454
1506
|
const list = open && mounted && posState[0] ? (0, import_react_dom2.createPortal)(
|
|
1455
|
-
/* @__PURE__ */ React16.createElement("div", { ref: listRef, className: "aura-combo__popover", style: posState[0] }, /* @__PURE__ */ React16.createElement(
|
|
1507
|
+
/* @__PURE__ */ React16.createElement("div", { ref: listRef, className: "aura-combo__popover", style: posState[0] }, live.length ? /* @__PURE__ */ React16.createElement(
|
|
1456
1508
|
"ul",
|
|
1457
1509
|
{
|
|
1458
1510
|
id: listId,
|
|
@@ -1461,7 +1513,7 @@ var Combobox = React16.forwardRef(
|
|
|
1461
1513
|
"aria-multiselectable": multi || void 0,
|
|
1462
1514
|
className: "aura-combo__list"
|
|
1463
1515
|
},
|
|
1464
|
-
|
|
1516
|
+
live.map(function(o, i) {
|
|
1465
1517
|
const isSel = multi ? isPicked(o.value) : !!selected && o.value === selected.value;
|
|
1466
1518
|
const blocked = o.disabled || multi && full && !isSel;
|
|
1467
1519
|
return /* @__PURE__ */ React16.createElement(
|
|
@@ -1493,9 +1545,8 @@ var Combobox = React16.forwardRef(
|
|
|
1493
1545
|
/* @__PURE__ */ React16.createElement("span", { className: "aura-combo__text" }, /* @__PURE__ */ React16.createElement("span", { className: "aura-combo__label" }, o.label), o.description ? /* @__PURE__ */ React16.createElement("span", { className: "aura-combo__desc" }, o.description) : null),
|
|
1494
1546
|
isSel ? /* @__PURE__ */ React16.createElement(Icon, { name: "check", className: "aura-combo__check" }) : null
|
|
1495
1547
|
);
|
|
1496
|
-
})
|
|
1497
|
-
|
|
1498
|
-
)),
|
|
1548
|
+
})
|
|
1549
|
+
) : null, props.loading || !live.length || more ? /* @__PURE__ */ React16.createElement("div", { className: "aura-combo__list", role: "status" }, props.loading ? /* @__PURE__ */ React16.createElement("div", { className: "aura-combo__note" }, /* @__PURE__ */ React16.createElement(Icon, { name: "loader-circle", className: "aura-spin" }), props.loadingText || t.searching) : !live.length ? /* @__PURE__ */ React16.createElement("div", { className: "aura-combo__note" }, props.emptyText || t.noMatches) : /* @__PURE__ */ React16.createElement("div", { className: "aura-combo__note" }, t.keepTyping((props.options || []).length))) : null),
|
|
1499
1550
|
document.body
|
|
1500
1551
|
) : null;
|
|
1501
1552
|
return /* @__PURE__ */ React16.createElement(
|
|
@@ -1534,9 +1585,9 @@ var Combobox = React16.forwardRef(
|
|
|
1534
1585
|
));
|
|
1535
1586
|
})) : null, multi ? /* @__PURE__ */ React16.createElement("span", { id: summaryId, className: "aura-sr-only" }, picked.length ? t.selectedCount(picked.length) + ": " + picked.map(function(o) {
|
|
1536
1587
|
return o.label;
|
|
1537
|
-
}).join(", ") : "") : null,
|
|
1588
|
+
}).join(", ") : "") : null, props.name ? multi ? values.map(function(v) {
|
|
1538
1589
|
return /* @__PURE__ */ React16.createElement("input", { key: v, type: "hidden", name: props.name, value: v });
|
|
1539
|
-
}) : null, /* @__PURE__ */ React16.createElement(
|
|
1590
|
+
}) : /* @__PURE__ */ React16.createElement("input", { type: "hidden", name: props.name, value: value == null ? "" : value }) : null, /* @__PURE__ */ React16.createElement(
|
|
1540
1591
|
"input",
|
|
1541
1592
|
{
|
|
1542
1593
|
ref: inputMerged,
|
|
@@ -1545,17 +1596,16 @@ var Combobox = React16.forwardRef(
|
|
|
1545
1596
|
role: "combobox",
|
|
1546
1597
|
className: "aura-input__control",
|
|
1547
1598
|
autoComplete: "off",
|
|
1548
|
-
"aria-expanded": open,
|
|
1549
|
-
"aria-controls": listId,
|
|
1599
|
+
"aria-expanded": open && live.length > 0,
|
|
1600
|
+
"aria-controls": open && live.length ? listId : void 0,
|
|
1550
1601
|
"aria-autocomplete": "list",
|
|
1551
|
-
"aria-activedescendant": open &&
|
|
1602
|
+
"aria-activedescendant": open && live[activeIdx] ? optId(activeIdx) : void 0,
|
|
1552
1603
|
"aria-invalid": props.error ? true : void 0,
|
|
1553
1604
|
"aria-describedby": [props.error ? id + "-error" : props.hint ? id + "-hint" : "", multi && picked.length ? summaryId : ""].filter(Boolean).join(" ") || void 0,
|
|
1554
1605
|
placeholder: multi && values.length ? void 0 : props.placeholder,
|
|
1555
1606
|
disabled: props.disabled,
|
|
1556
1607
|
readOnly: props.readOnly,
|
|
1557
1608
|
required: props.required && (!multi || !values.length),
|
|
1558
|
-
name: multi ? void 0 : props.name,
|
|
1559
1609
|
value: text,
|
|
1560
1610
|
onChange: function(e) {
|
|
1561
1611
|
setQuery(e.target.value);
|
|
@@ -1573,7 +1623,7 @@ var Combobox = React16.forwardRef(
|
|
|
1573
1623
|
}, 0);
|
|
1574
1624
|
}
|
|
1575
1625
|
}
|
|
1576
|
-
), props.clearable !== false && values.length && !props.disabled ? /* @__PURE__ */ React16.createElement(
|
|
1626
|
+
), props.clearable !== false && values.length && !props.disabled && !props.readOnly ? /* @__PURE__ */ React16.createElement(
|
|
1577
1627
|
"button",
|
|
1578
1628
|
{
|
|
1579
1629
|
type: "button",
|
|
@@ -1664,7 +1714,8 @@ var DATE_TEXT = {
|
|
|
1664
1714
|
rangePlaceholder: "\u0E27\u0E27/\u0E14\u0E14/\u0E1B\u0E1B\u0E1B\u0E1B \u2013 \u0E27\u0E27/\u0E14\u0E14/\u0E1B\u0E1B\u0E1B\u0E1B",
|
|
1665
1715
|
clearDates: "\u0E25\u0E49\u0E32\u0E07\u0E0A\u0E48\u0E27\u0E07\u0E27\u0E31\u0E19\u0E17\u0E35\u0E48",
|
|
1666
1716
|
chooseStart: "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E27\u0E31\u0E19\u0E40\u0E23\u0E34\u0E48\u0E21\u0E15\u0E49\u0E19",
|
|
1667
|
-
chooseEnd: "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E27\u0E31\u0E19\u0E2A\u0E34\u0E49\u0E19\u0E2A\u0E38\u0E14"
|
|
1717
|
+
chooseEnd: "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E27\u0E31\u0E19\u0E2A\u0E34\u0E49\u0E19\u0E2A\u0E38\u0E14",
|
|
1718
|
+
dateUnavailable: "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E27\u0E31\u0E19\u0E17\u0E35\u0E48\u0E19\u0E35\u0E49\u0E44\u0E21\u0E48\u0E44\u0E14\u0E49 \u0E25\u0E2D\u0E07\u0E40\u0E1B\u0E34\u0E14\u0E1B\u0E0F\u0E34\u0E17\u0E34\u0E19\u0E14\u0E39\u0E27\u0E31\u0E19\u0E17\u0E35\u0E48\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E44\u0E14\u0E49"
|
|
1668
1719
|
},
|
|
1669
1720
|
en: {
|
|
1670
1721
|
prevYears: "Previous years",
|
|
@@ -1681,7 +1732,8 @@ var DATE_TEXT = {
|
|
|
1681
1732
|
rangePlaceholder: "DD/MM/YYYY \u2013 DD/MM/YYYY",
|
|
1682
1733
|
clearDates: "Clear dates",
|
|
1683
1734
|
chooseStart: "Choose the start date",
|
|
1684
|
-
chooseEnd: "Choose the end date"
|
|
1735
|
+
chooseEnd: "Choose the end date",
|
|
1736
|
+
dateUnavailable: "That date can't be chosen. Open the calendar to see the dates you can pick."
|
|
1685
1737
|
},
|
|
1686
1738
|
sv: {
|
|
1687
1739
|
prevYears: "Tidigare \xE5r",
|
|
@@ -1698,7 +1750,8 @@ var DATE_TEXT = {
|
|
|
1698
1750
|
rangePlaceholder: "\xE5\xE5\xE5\xE5-mm-dd \u2013 \xE5\xE5\xE5\xE5-mm-dd",
|
|
1699
1751
|
clearDates: "Rensa datumen",
|
|
1700
1752
|
chooseStart: "V\xE4lj startdatum",
|
|
1701
|
-
chooseEnd: "V\xE4lj slutdatum"
|
|
1753
|
+
chooseEnd: "V\xE4lj slutdatum",
|
|
1754
|
+
dateUnavailable: "Det datumet g\xE5r inte att v\xE4lja. \xD6ppna kalendern f\xF6r att se vilka datum som g\xE5r."
|
|
1702
1755
|
}
|
|
1703
1756
|
};
|
|
1704
1757
|
function dateText(locale) {
|
|
@@ -1791,14 +1844,37 @@ function useFormatDate() {
|
|
|
1791
1844
|
[locale, calendar]
|
|
1792
1845
|
);
|
|
1793
1846
|
}
|
|
1847
|
+
function allowedDate(iso, o) {
|
|
1848
|
+
const t = o.min === "today" || o.max === "today" ? o.today && fromISO(o.today) ? o.today : todayIn(o.timeZone) : "";
|
|
1849
|
+
const lo = o.min === "today" ? t : o.min, hi = o.max === "today" ? t : o.max;
|
|
1850
|
+
if (lo && fromISO(lo) && iso < lo) return false;
|
|
1851
|
+
if (hi && fromISO(hi) && iso > hi) return false;
|
|
1852
|
+
return !(o.isDateDisabled && o.isDateDisabled(iso));
|
|
1853
|
+
}
|
|
1794
1854
|
var Calendar = React17.forwardRef(function Calendar2(props, ref) {
|
|
1795
1855
|
const ctx = useAuraLocale(), locale = props.locale || ctx.locale || "en", calendar = props.calendar || ctx.calendar || defaultCalendar(locale), tag = localeTag(locale, calendar);
|
|
1796
1856
|
const weekStart = props.weekStartsOn == null ? locale === "sv" ? 1 : 0 : props.weekStartsOn;
|
|
1797
|
-
const
|
|
1857
|
+
const given = props.today && fromISO(props.today) ? props.today : null, zone = props.timeZone || ctx.timeZone;
|
|
1858
|
+
const todayISO = given || todayIn(zone);
|
|
1798
1859
|
const today = fromISO(todayISO);
|
|
1860
|
+
const mounted = useMounted(), gridKey = given || mounted ? "client" : "server";
|
|
1799
1861
|
const min = fromISO(props.min === "today" ? todayISO : props.min), max = fromISO(props.max === "today" ? todayISO : props.max);
|
|
1800
1862
|
const start = fromISO(props.start), end = fromISO(props.end);
|
|
1801
|
-
|
|
1863
|
+
function disabledAt(d) {
|
|
1864
|
+
return !!(min && d < min || max && d > max || props.isDateDisabled && props.isDateDisabled(toISO(d)));
|
|
1865
|
+
}
|
|
1866
|
+
function select(iso) {
|
|
1867
|
+
if (props.onSelect) props.onSelect(iso);
|
|
1868
|
+
}
|
|
1869
|
+
const focusState = React17.useState(function() {
|
|
1870
|
+
const d0 = fromISO(props.focus) || start || today;
|
|
1871
|
+
if (!disabledAt(d0)) return d0;
|
|
1872
|
+
for (let i = 1; i <= 366; i++) {
|
|
1873
|
+
if (!disabledAt(addDays(d0, i))) return addDays(d0, i);
|
|
1874
|
+
if (!disabledAt(addDays(d0, -i))) return addDays(d0, -i);
|
|
1875
|
+
}
|
|
1876
|
+
return d0;
|
|
1877
|
+
});
|
|
1802
1878
|
const focusDate = focusState[0], setFocus = focusState[1];
|
|
1803
1879
|
const viewState = React17.useState("days"), view = viewState[0], setView = viewState[1];
|
|
1804
1880
|
const hoverState = React17.useState(null);
|
|
@@ -1806,7 +1882,7 @@ var Calendar = React17.forwardRef(function Calendar2(props, ref) {
|
|
|
1806
1882
|
const th = locale === "th";
|
|
1807
1883
|
const dt = dateText(locale);
|
|
1808
1884
|
function disabled(d) {
|
|
1809
|
-
return
|
|
1885
|
+
return disabledAt(d);
|
|
1810
1886
|
}
|
|
1811
1887
|
React17.useEffect(function() {
|
|
1812
1888
|
if (!moved.current) return;
|
|
@@ -1814,11 +1890,14 @@ var Calendar = React17.forwardRef(function Calendar2(props, ref) {
|
|
|
1814
1890
|
const el = gridRef.current && gridRef.current.querySelector('[data-date="' + toISO(focusDate) + '"]');
|
|
1815
1891
|
if (el) el.focus();
|
|
1816
1892
|
});
|
|
1817
|
-
React17.useEffect(
|
|
1818
|
-
|
|
1819
|
-
|
|
1820
|
-
|
|
1821
|
-
|
|
1893
|
+
React17.useEffect(
|
|
1894
|
+
function() {
|
|
1895
|
+
if (props.autoFocus === false) return;
|
|
1896
|
+
const el = gridRef.current && gridRef.current.querySelector('[tabindex="0"]');
|
|
1897
|
+
if (el) el.focus();
|
|
1898
|
+
},
|
|
1899
|
+
[gridKey]
|
|
1900
|
+
);
|
|
1822
1901
|
function move(d) {
|
|
1823
1902
|
moved.current = true;
|
|
1824
1903
|
setFocus(d);
|
|
@@ -1843,7 +1922,7 @@ var Calendar = React17.forwardRef(function Calendar2(props, ref) {
|
|
|
1843
1922
|
else if (k === "PageDown") n2 = addMonths(d, e.shiftKey ? 12 : 1);
|
|
1844
1923
|
else if (k === "Enter" || k === " ") {
|
|
1845
1924
|
e.preventDefault();
|
|
1846
|
-
if (!disabled(d))
|
|
1925
|
+
if (!disabled(d)) select(toISO(d));
|
|
1847
1926
|
return;
|
|
1848
1927
|
}
|
|
1849
1928
|
if (n2) {
|
|
@@ -1866,7 +1945,7 @@ var Calendar = React17.forwardRef(function Calendar2(props, ref) {
|
|
|
1866
1945
|
const yr = focusDate.getFullYear(), base = yr - yr % 12;
|
|
1867
1946
|
const years = [];
|
|
1868
1947
|
for (let y = base; y < base + 12; y++) years.push(y);
|
|
1869
|
-
return /* @__PURE__ */ React17.createElement("div", { className: "aura-cal", ref: gridMerged }, /* @__PURE__ */ React17.createElement("div", { className: "aura-cal__head" }, /* @__PURE__ */ React17.createElement(
|
|
1948
|
+
return /* @__PURE__ */ React17.createElement("div", { className: "aura-cal", ref: gridMerged, key: gridKey }, /* @__PURE__ */ React17.createElement("div", { className: "aura-cal__head" }, /* @__PURE__ */ React17.createElement(
|
|
1870
1949
|
IconButton,
|
|
1871
1950
|
{
|
|
1872
1951
|
icon: "chevron-left",
|
|
@@ -1913,7 +1992,7 @@ var Calendar = React17.forwardRef(function Calendar2(props, ref) {
|
|
|
1913
1992
|
);
|
|
1914
1993
|
})));
|
|
1915
1994
|
}
|
|
1916
|
-
return /* @__PURE__ */ React17.createElement("div", { className: "aura-cal", ref: gridMerged }, /* @__PURE__ */ React17.createElement("div", { className: "aura-cal__head" }, /* @__PURE__ */ React17.createElement(
|
|
1995
|
+
return /* @__PURE__ */ React17.createElement("div", { className: "aura-cal", ref: gridMerged, key: gridKey }, /* @__PURE__ */ React17.createElement("div", { className: "aura-cal__head" }, /* @__PURE__ */ React17.createElement(
|
|
1917
1996
|
IconButton,
|
|
1918
1997
|
{
|
|
1919
1998
|
icon: "chevron-left",
|
|
@@ -1975,7 +2054,7 @@ var Calendar = React17.forwardRef(function Calendar2(props, ref) {
|
|
|
1975
2054
|
type: "button",
|
|
1976
2055
|
"data-date": iso,
|
|
1977
2056
|
tabIndex: same(d, focusDate) ? 0 : -1,
|
|
1978
|
-
disabled: dis,
|
|
2057
|
+
"aria-disabled": dis || void 0,
|
|
1979
2058
|
"aria-label": fmt(tag, { weekday: "long", day: "numeric", month: "long", year: "numeric" }, d),
|
|
1980
2059
|
suppressHydrationWarning: true,
|
|
1981
2060
|
"aria-current": same(d, today) ? "date" : void 0,
|
|
@@ -1988,7 +2067,7 @@ var Calendar = React17.forwardRef(function Calendar2(props, ref) {
|
|
|
1988
2067
|
),
|
|
1989
2068
|
onClick: function() {
|
|
1990
2069
|
setFocus(d);
|
|
1991
|
-
|
|
2070
|
+
if (!dis) select(iso);
|
|
1992
2071
|
},
|
|
1993
2072
|
onKeyDown: function(e) {
|
|
1994
2073
|
onKey(e, d);
|
|
@@ -2010,7 +2089,7 @@ var Calendar = React17.forwardRef(function Calendar2(props, ref) {
|
|
|
2010
2089
|
disabled: disabled(today),
|
|
2011
2090
|
onClick: function() {
|
|
2012
2091
|
move(today);
|
|
2013
|
-
|
|
2092
|
+
select(toISO(today));
|
|
2014
2093
|
}
|
|
2015
2094
|
},
|
|
2016
2095
|
dt.today
|
|
@@ -2144,13 +2223,30 @@ var DatePicker = React17.forwardRef(function DatePicker2(props, ref) {
|
|
|
2144
2223
|
);
|
|
2145
2224
|
const boxRef = React17.useRef(null), inputRef = React17.useRef(null), inputMerged = useMergedRef(ref, inputRef);
|
|
2146
2225
|
const pop = useCalendarPopover(boxRef);
|
|
2226
|
+
const limits = {
|
|
2227
|
+
min: props.min,
|
|
2228
|
+
max: props.max,
|
|
2229
|
+
today: props.today,
|
|
2230
|
+
timeZone: props.timeZone || ctx.timeZone,
|
|
2231
|
+
isDateDisabled: props.isDateDisabled
|
|
2232
|
+
};
|
|
2233
|
+
const bad = React17.useState(null);
|
|
2234
|
+
React17.useEffect(
|
|
2235
|
+
function() {
|
|
2236
|
+
bad[1](null);
|
|
2237
|
+
},
|
|
2238
|
+
[st[0]]
|
|
2239
|
+
);
|
|
2147
2240
|
function commit(text) {
|
|
2241
|
+
bad[1](null);
|
|
2148
2242
|
if (!text.trim()) {
|
|
2149
2243
|
st[1](null);
|
|
2150
2244
|
return;
|
|
2151
2245
|
}
|
|
2152
2246
|
const iso = parseDate(text);
|
|
2153
|
-
if (iso)
|
|
2247
|
+
if (!iso) return;
|
|
2248
|
+
if (allowedDate(iso, limits)) st[1](iso);
|
|
2249
|
+
else bad[1](dt.dateUnavailable);
|
|
2154
2250
|
}
|
|
2155
2251
|
function close() {
|
|
2156
2252
|
pop.setOpen(false);
|
|
@@ -2188,6 +2284,7 @@ var DatePicker = React17.forwardRef(function DatePicker2(props, ref) {
|
|
|
2188
2284
|
start: st[0],
|
|
2189
2285
|
focus: st[0],
|
|
2190
2286
|
onSelect: function(iso) {
|
|
2287
|
+
bad[1](null);
|
|
2191
2288
|
st[1](iso);
|
|
2192
2289
|
close();
|
|
2193
2290
|
}
|
|
@@ -2203,7 +2300,7 @@ var DatePicker = React17.forwardRef(function DatePicker2(props, ref) {
|
|
|
2203
2300
|
dialogId,
|
|
2204
2301
|
label: props.label,
|
|
2205
2302
|
hint: props.hint,
|
|
2206
|
-
error: props.error,
|
|
2303
|
+
error: bad[0] || props.error,
|
|
2207
2304
|
required: props.required,
|
|
2208
2305
|
optional: props.optional,
|
|
2209
2306
|
disabled: props.disabled,
|
|
@@ -2217,6 +2314,7 @@ var DatePicker = React17.forwardRef(function DatePicker2(props, ref) {
|
|
|
2217
2314
|
hasValue: st[0] != null,
|
|
2218
2315
|
clearable: props.clearable,
|
|
2219
2316
|
onClear: function() {
|
|
2317
|
+
bad[1](null);
|
|
2220
2318
|
st[1](null);
|
|
2221
2319
|
inputRef.current && inputRef.current.focus();
|
|
2222
2320
|
},
|
|
@@ -2243,20 +2341,36 @@ var DateRangePicker = React17.forwardRef(
|
|
|
2243
2341
|
const draft = React17.useState(null);
|
|
2244
2342
|
const boxRef = React17.useRef(null), inputRef = React17.useRef(null), inputMerged = useMergedRef(ref, inputRef);
|
|
2245
2343
|
const pop = useCalendarPopover(boxRef);
|
|
2344
|
+
const limits = {
|
|
2345
|
+
min: props.min,
|
|
2346
|
+
max: props.max,
|
|
2347
|
+
today: props.today,
|
|
2348
|
+
timeZone: props.timeZone || ctx.timeZone,
|
|
2349
|
+
isDateDisabled: props.isDateDisabled
|
|
2350
|
+
};
|
|
2246
2351
|
const o = { locale, calendar };
|
|
2247
2352
|
function show2(r) {
|
|
2248
2353
|
if (!r.start) return "";
|
|
2249
2354
|
if (!r.end) return formatDate(r.start, o) + " \u2013";
|
|
2250
2355
|
return formatDate(r.start, o) + " \u2013 " + formatDate(r.end, o);
|
|
2251
2356
|
}
|
|
2357
|
+
const bad = React17.useState(null);
|
|
2358
|
+
React17.useEffect(
|
|
2359
|
+
function() {
|
|
2360
|
+
bad[1](null);
|
|
2361
|
+
},
|
|
2362
|
+
[v.start, v.end]
|
|
2363
|
+
);
|
|
2252
2364
|
function commit(text) {
|
|
2365
|
+
bad[1](null);
|
|
2253
2366
|
const parts = String(text).split(/\s[–-]\s|\s*–\s*/);
|
|
2254
2367
|
if (!text.trim()) {
|
|
2255
2368
|
st[1]({ start: null, end: null });
|
|
2256
2369
|
return;
|
|
2257
2370
|
}
|
|
2258
2371
|
const a = parseDate(parts[0]), b = parseDate(parts[1] || "");
|
|
2259
|
-
if (a && b
|
|
2372
|
+
if (a && b && !(allowedDate(a, limits) && allowedDate(b, limits))) bad[1](dt.dateUnavailable);
|
|
2373
|
+
else if (a && b) st[1](a <= b ? { start: a, end: b } : { start: b, end: a });
|
|
2260
2374
|
}
|
|
2261
2375
|
function close() {
|
|
2262
2376
|
pop.setOpen(false);
|
|
@@ -2269,6 +2383,7 @@ var DateRangePicker = React17.forwardRef(
|
|
|
2269
2383
|
return;
|
|
2270
2384
|
}
|
|
2271
2385
|
const a = draft[0], b = iso;
|
|
2386
|
+
bad[1](null);
|
|
2272
2387
|
st[1](a <= b ? { start: a, end: b } : { start: b, end: a });
|
|
2273
2388
|
close();
|
|
2274
2389
|
}
|
|
@@ -2319,7 +2434,7 @@ var DateRangePicker = React17.forwardRef(
|
|
|
2319
2434
|
dialogId,
|
|
2320
2435
|
label: props.label,
|
|
2321
2436
|
hint: props.hint,
|
|
2322
|
-
error: props.error,
|
|
2437
|
+
error: bad[0] || props.error,
|
|
2323
2438
|
required: props.required,
|
|
2324
2439
|
optional: props.optional,
|
|
2325
2440
|
disabled: props.disabled,
|
|
@@ -2333,6 +2448,7 @@ var DateRangePicker = React17.forwardRef(
|
|
|
2333
2448
|
hasValue: v.start != null,
|
|
2334
2449
|
clearable: props.clearable,
|
|
2335
2450
|
onClear: function() {
|
|
2451
|
+
bad[1](null);
|
|
2336
2452
|
st[1]({ start: null, end: null });
|
|
2337
2453
|
inputRef.current && inputRef.current.focus();
|
|
2338
2454
|
},
|
|
@@ -2528,6 +2644,7 @@ function Toaster(props) {
|
|
|
2528
2644
|
const s = React19.useState(toastState.list);
|
|
2529
2645
|
React19.useEffect(function() {
|
|
2530
2646
|
toastState.subs.push(s[1]);
|
|
2647
|
+
s[1](toastState.list.slice());
|
|
2531
2648
|
return function() {
|
|
2532
2649
|
toastState.subs = toastState.subs.filter(function(f) {
|
|
2533
2650
|
return f !== s[1];
|
|
@@ -2589,15 +2706,30 @@ var React21 = __toESM(require("react"), 1);
|
|
|
2589
2706
|
function items(errors) {
|
|
2590
2707
|
if (Array.isArray(errors)) return errors;
|
|
2591
2708
|
const out = [];
|
|
2592
|
-
|
|
2593
|
-
|
|
2594
|
-
|
|
2709
|
+
function walk(e, path, depth) {
|
|
2710
|
+
if (!e || typeof e !== "object" || depth > 8) return;
|
|
2711
|
+
const o = e;
|
|
2712
|
+
if (o.message) out.push({ field: path, message: o.message });
|
|
2713
|
+
for (const k in o) {
|
|
2714
|
+
if (k === "ref" || k === "type" || k === "types" || k === "message") continue;
|
|
2715
|
+
walk(o[k], path ? path + "." + k : k, depth + 1);
|
|
2716
|
+
}
|
|
2595
2717
|
}
|
|
2718
|
+
walk(errors, "", 0);
|
|
2596
2719
|
return out;
|
|
2597
2720
|
}
|
|
2598
2721
|
function fieldElement(field) {
|
|
2599
2722
|
if (typeof document === "undefined") return null;
|
|
2600
|
-
|
|
2723
|
+
const byId = document.getElementById(field);
|
|
2724
|
+
if (byId) return byId;
|
|
2725
|
+
const named = document.querySelector('[name="' + field.replace(/"/g, '\\"') + '"]');
|
|
2726
|
+
if (named && named.getAttribute("type") === "hidden") {
|
|
2727
|
+
const box = named.closest(".aura-field") || named.parentElement;
|
|
2728
|
+
return box && box.querySelector(
|
|
2729
|
+
'input:not([type="hidden"]), [role="combobox"], select, textarea, button:not([tabindex="-1"])'
|
|
2730
|
+
) || named;
|
|
2731
|
+
}
|
|
2732
|
+
return named;
|
|
2601
2733
|
}
|
|
2602
2734
|
var FormErrorSummary = React21.forwardRef(
|
|
2603
2735
|
function FormErrorSummary2(props, ref) {
|
|
@@ -2805,6 +2937,30 @@ var import_react_dom5 = require("react-dom");
|
|
|
2805
2937
|
|
|
2806
2938
|
// src/useModal.tsx
|
|
2807
2939
|
var React24 = __toESM(require("react"), 1);
|
|
2940
|
+
var locks = 0;
|
|
2941
|
+
var savedOverflow = "";
|
|
2942
|
+
function lockScroll() {
|
|
2943
|
+
const body = document.body;
|
|
2944
|
+
if (locks === 0) savedOverflow = body.style.overflow;
|
|
2945
|
+
locks++;
|
|
2946
|
+
body.style.overflow = "hidden";
|
|
2947
|
+
let done = false;
|
|
2948
|
+
return function() {
|
|
2949
|
+
if (done) return;
|
|
2950
|
+
done = true;
|
|
2951
|
+
locks--;
|
|
2952
|
+
if (locks === 0) body.style.overflow = savedOverflow;
|
|
2953
|
+
};
|
|
2954
|
+
}
|
|
2955
|
+
function tabbable(el) {
|
|
2956
|
+
const all = Array.prototype.filter.call(el.querySelectorAll(FOCUSABLE), function(c) {
|
|
2957
|
+
return c.tabIndex >= 0;
|
|
2958
|
+
});
|
|
2959
|
+
const shown = all.filter(function(c) {
|
|
2960
|
+
return c.getClientRects().length > 0;
|
|
2961
|
+
});
|
|
2962
|
+
return shown.length ? shown : all;
|
|
2963
|
+
}
|
|
2808
2964
|
function useModal(open, ref, opts) {
|
|
2809
2965
|
const mounted = useMounted();
|
|
2810
2966
|
const prev = React24.useRef(null);
|
|
@@ -2813,8 +2969,7 @@ function useModal(open, ref, opts) {
|
|
|
2813
2969
|
function() {
|
|
2814
2970
|
if (!open || !mounted) return;
|
|
2815
2971
|
prev.current = document.activeElement;
|
|
2816
|
-
const
|
|
2817
|
-
body.style.overflow = "hidden";
|
|
2972
|
+
const unlock = lockScroll();
|
|
2818
2973
|
const el = ref.current;
|
|
2819
2974
|
const firstIn = function(scope) {
|
|
2820
2975
|
if (!scope || !el) return null;
|
|
@@ -2829,7 +2984,7 @@ function useModal(open, ref, opts) {
|
|
|
2829
2984
|
const target = el && (el.querySelector("[data-autofocus]") || firstIn(o.bodySelector) || firstIn(o.footSelector) || el);
|
|
2830
2985
|
if (target && o.autoFocus !== false) target.focus();
|
|
2831
2986
|
return function() {
|
|
2832
|
-
|
|
2987
|
+
unlock();
|
|
2833
2988
|
if (prev.current && prev.current.focus) prev.current.focus();
|
|
2834
2989
|
};
|
|
2835
2990
|
},
|
|
@@ -2841,17 +2996,18 @@ function useModal(open, ref, opts) {
|
|
|
2841
2996
|
if (o.onEscape) o.onEscape();
|
|
2842
2997
|
return;
|
|
2843
2998
|
}
|
|
2844
|
-
if (e.key !== "Tab" || !ref.current) return;
|
|
2845
|
-
|
|
2999
|
+
if (e.key !== "Tab" || !ref.current || e.defaultPrevented) return;
|
|
3000
|
+
if (!ref.current.contains(e.target)) return;
|
|
3001
|
+
const list = tabbable(ref.current);
|
|
2846
3002
|
if (!list.length) {
|
|
2847
3003
|
e.preventDefault();
|
|
2848
3004
|
return;
|
|
2849
3005
|
}
|
|
2850
|
-
const first = list[0], last = list[list.length - 1];
|
|
2851
|
-
if (e.shiftKey && (
|
|
3006
|
+
const first = list[0], last = list[list.length - 1], active = document.activeElement, stray = active === ref.current;
|
|
3007
|
+
if (e.shiftKey && (active === first || stray)) {
|
|
2852
3008
|
e.preventDefault();
|
|
2853
3009
|
last.focus();
|
|
2854
|
-
} else if (!e.shiftKey &&
|
|
3010
|
+
} else if (!e.shiftKey && (active === last || stray)) {
|
|
2855
3011
|
e.preventDefault();
|
|
2856
3012
|
first.focus();
|
|
2857
3013
|
}
|
|
@@ -2974,6 +3130,7 @@ function Command(props) {
|
|
|
2974
3130
|
e.preventDefault();
|
|
2975
3131
|
move("last");
|
|
2976
3132
|
} else if (e.key === "Enter") {
|
|
3133
|
+
if (e.nativeEvent.isComposing || e.keyCode === 229) return;
|
|
2977
3134
|
e.preventDefault();
|
|
2978
3135
|
if (active >= 0) run(flat[active]);
|
|
2979
3136
|
}
|
|
@@ -3093,7 +3250,7 @@ var import_react_dom6 = require("react-dom");
|
|
|
3093
3250
|
var Tooltip = React26.forwardRef(function Tooltip2(props, ref) {
|
|
3094
3251
|
const id = uid(), st = React26.useState(false), open = props.open !== void 0 ? props.open : st[0], set = st[1];
|
|
3095
3252
|
const anchor = React26.useRef(null), anchorMerged = useMergedRef(ref, anchor), tip = React26.useRef(null), timer = React26.useRef(void 0);
|
|
3096
|
-
const pos = React26.useState(null);
|
|
3253
|
+
const pos = React26.useState(null), mounted = useMounted();
|
|
3097
3254
|
function show2(now) {
|
|
3098
3255
|
clearTimeout(timer.current);
|
|
3099
3256
|
timer.current = setTimeout(
|
|
@@ -3107,34 +3264,55 @@ var Tooltip = React26.forwardRef(function Tooltip2(props, ref) {
|
|
|
3107
3264
|
clearTimeout(timer.current);
|
|
3108
3265
|
set(false);
|
|
3109
3266
|
}
|
|
3267
|
+
function hideSoon() {
|
|
3268
|
+
clearTimeout(timer.current);
|
|
3269
|
+
timer.current = setTimeout(function() {
|
|
3270
|
+
set(false);
|
|
3271
|
+
}, 120);
|
|
3272
|
+
}
|
|
3273
|
+
React26.useEffect(function() {
|
|
3274
|
+
return function() {
|
|
3275
|
+
clearTimeout(timer.current);
|
|
3276
|
+
};
|
|
3277
|
+
}, []);
|
|
3278
|
+
function place() {
|
|
3279
|
+
if (!anchor.current || !tip.current) return;
|
|
3280
|
+
const r = anchor.current.getBoundingClientRect(), t = tip.current.getBoundingClientRect();
|
|
3281
|
+
const vw = window.innerWidth, vh = window.innerHeight, gap = 8, m = 8;
|
|
3282
|
+
let side = props.side || "top";
|
|
3283
|
+
if (side === "top" && r.top - t.height - gap < m && r.bottom + gap + t.height <= vh - m) side = "bottom";
|
|
3284
|
+
else if (side === "bottom" && r.bottom + gap + t.height > vh - m && r.top - t.height - gap >= m) side = "top";
|
|
3285
|
+
else if (side === "left" && r.left - t.width - gap < m && r.right + gap + t.width <= vw - m) side = "right";
|
|
3286
|
+
else if (side === "right" && r.right + gap + t.width > vw - m && r.left - t.width - gap >= m) side = "left";
|
|
3287
|
+
const clampX = function(x) {
|
|
3288
|
+
return Math.max(m, Math.min(x, vw - t.width - m));
|
|
3289
|
+
};
|
|
3290
|
+
const clampY = function(y) {
|
|
3291
|
+
return Math.max(m, Math.min(y, vh - t.height - m));
|
|
3292
|
+
};
|
|
3293
|
+
let top, left;
|
|
3294
|
+
if (side === "top" || side === "bottom") {
|
|
3295
|
+
top = clampY(side === "top" ? r.top - t.height - gap : r.bottom + gap);
|
|
3296
|
+
left = clampX(r.left + r.width / 2 - t.width / 2);
|
|
3297
|
+
} else {
|
|
3298
|
+
left = side === "left" ? r.left - t.width - gap : r.right + gap;
|
|
3299
|
+
left = clampX(left);
|
|
3300
|
+
top = clampY(r.top + r.height / 2 - t.height / 2);
|
|
3301
|
+
}
|
|
3302
|
+
pos[1]({ top, left });
|
|
3303
|
+
}
|
|
3110
3304
|
useIsoLayoutEffect(
|
|
3111
3305
|
function() {
|
|
3112
|
-
if (!open
|
|
3113
|
-
|
|
3114
|
-
|
|
3115
|
-
|
|
3116
|
-
|
|
3117
|
-
|
|
3118
|
-
|
|
3119
|
-
else if (side === "right" && r.right + gap + t.width > vw - m && r.left - t.width - gap >= m) side = "left";
|
|
3120
|
-
const clampX = function(x) {
|
|
3121
|
-
return Math.max(m, Math.min(x, vw - t.width - m));
|
|
3122
|
-
};
|
|
3123
|
-
const clampY = function(y) {
|
|
3124
|
-
return Math.max(m, Math.min(y, vh - t.height - m));
|
|
3306
|
+
if (!open) return;
|
|
3307
|
+
place();
|
|
3308
|
+
window.addEventListener("scroll", place, true);
|
|
3309
|
+
window.addEventListener("resize", place);
|
|
3310
|
+
return function() {
|
|
3311
|
+
window.removeEventListener("scroll", place, true);
|
|
3312
|
+
window.removeEventListener("resize", place);
|
|
3125
3313
|
};
|
|
3126
|
-
let top, left;
|
|
3127
|
-
if (side === "top" || side === "bottom") {
|
|
3128
|
-
top = clampY(side === "top" ? r.top - t.height - gap : r.bottom + gap);
|
|
3129
|
-
left = clampX(r.left + r.width / 2 - t.width / 2);
|
|
3130
|
-
} else {
|
|
3131
|
-
left = side === "left" ? r.left - t.width - gap : r.right + gap;
|
|
3132
|
-
left = clampX(left);
|
|
3133
|
-
top = clampY(r.top + r.height / 2 - t.height / 2);
|
|
3134
|
-
}
|
|
3135
|
-
pos[1]({ top, left });
|
|
3136
3314
|
},
|
|
3137
|
-
[open]
|
|
3315
|
+
[open, mounted]
|
|
3138
3316
|
);
|
|
3139
3317
|
React26.useEffect(
|
|
3140
3318
|
function() {
|
|
@@ -3158,7 +3336,7 @@ var Tooltip = React26.forwardRef(function Tooltip2(props, ref) {
|
|
|
3158
3336
|
onMouseEnter: function() {
|
|
3159
3337
|
show2(false);
|
|
3160
3338
|
},
|
|
3161
|
-
onMouseLeave:
|
|
3339
|
+
onMouseLeave: hideSoon,
|
|
3162
3340
|
onFocus: function() {
|
|
3163
3341
|
show2(true);
|
|
3164
3342
|
},
|
|
@@ -3166,14 +3344,18 @@ var Tooltip = React26.forwardRef(function Tooltip2(props, ref) {
|
|
|
3166
3344
|
},
|
|
3167
3345
|
React26.cloneElement(child, { "aria-describedby": open ? id : child.props["aria-describedby"] })
|
|
3168
3346
|
);
|
|
3169
|
-
return /* @__PURE__ */ React26.createElement(React26.Fragment, null, trigger, open ? (0, import_react_dom6.createPortal)(
|
|
3347
|
+
return /* @__PURE__ */ React26.createElement(React26.Fragment, null, trigger, open && mounted ? (0, import_react_dom6.createPortal)(
|
|
3170
3348
|
/* @__PURE__ */ React26.createElement(
|
|
3171
3349
|
"div",
|
|
3172
3350
|
{
|
|
3173
3351
|
ref: tip,
|
|
3174
3352
|
id,
|
|
3175
3353
|
role: "tooltip",
|
|
3176
|
-
|
|
3354
|
+
onMouseEnter: function() {
|
|
3355
|
+
clearTimeout(timer.current);
|
|
3356
|
+
},
|
|
3357
|
+
onMouseLeave: hideSoon,
|
|
3358
|
+
className: "aura-tooltip aura-tooltip--hoverable",
|
|
3177
3359
|
style: { top: pos[0] ? pos[0].top : -9999, left: pos[0] ? pos[0].left : -9999 }
|
|
3178
3360
|
},
|
|
3179
3361
|
props.content
|
|
@@ -3288,7 +3470,7 @@ var DataTable = React28.forwardRef(function DataTable2(props, ref) {
|
|
|
3288
3470
|
byKey[c.key] = c;
|
|
3289
3471
|
});
|
|
3290
3472
|
const rows = props.rows || [];
|
|
3291
|
-
const rowKey = props.rowKey || columns[0].key;
|
|
3473
|
+
const rowKey = props.rowKey || (columns[0] ? columns[0].key : "id");
|
|
3292
3474
|
const manual = !!props.manual;
|
|
3293
3475
|
const Link = useLinkComponent(props.linkComponent);
|
|
3294
3476
|
const busy = !!props.loading;
|
|
@@ -3518,6 +3700,7 @@ var DataTable = React28.forwardRef(function DataTable2(props, ref) {
|
|
|
3518
3700
|
if (isPinned(c)) s["--aura-cell-left"] = "calc(var(--aura-space-6)" + selW + " + " + pinOffsets[c.key] + "px)";
|
|
3519
3701
|
return s;
|
|
3520
3702
|
}
|
|
3703
|
+
const sortCol = sort && sort.key ? byKey[sort.key] : void 0;
|
|
3521
3704
|
const view = React28.useMemo(
|
|
3522
3705
|
function() {
|
|
3523
3706
|
if (manual || !sort || !sort.key || !byKey[sort.key]) return rows;
|
|
@@ -3536,7 +3719,16 @@ var DataTable = React28.forwardRef(function DataTable2(props, ref) {
|
|
|
3536
3719
|
return p[0];
|
|
3537
3720
|
});
|
|
3538
3721
|
},
|
|
3539
|
-
[
|
|
3722
|
+
[
|
|
3723
|
+
rows,
|
|
3724
|
+
manual,
|
|
3725
|
+
sort && sort.key,
|
|
3726
|
+
sort && sort.dir,
|
|
3727
|
+
!!sortCol,
|
|
3728
|
+
sortCol && sortCol.sortValue,
|
|
3729
|
+
sortCol && sortCol.pill,
|
|
3730
|
+
sortCol && sortCol.tones
|
|
3731
|
+
]
|
|
3540
3732
|
);
|
|
3541
3733
|
function nextSort(key) {
|
|
3542
3734
|
if (!sort || sort.key !== key) return { key, dir: "asc" };
|
|
@@ -3545,14 +3737,23 @@ var DataTable = React28.forwardRef(function DataTable2(props, ref) {
|
|
|
3545
3737
|
}
|
|
3546
3738
|
const pageSize = props.pageSize || 0;
|
|
3547
3739
|
const total = manual ? props.totalRows != null ? props.totalRows : (Math.max(1, pageState[0] || 1) - 1) * pageSize + rows.length + (pageSize && rows.length >= pageSize ? 1 : 0) : view.length;
|
|
3548
|
-
const pageCount = pageSize ? Math.max(1, Math.ceil(total / pageSize)) : 1;
|
|
3740
|
+
const pageCount = pageSize ? Math.max(1, Math.ceil(total / pageSize), manual && props.totalRows == null ? pageState[0] || 1 : 1) : 1;
|
|
3549
3741
|
const page = Math.min(Math.max(1, pageState[0] || 1), pageCount);
|
|
3550
3742
|
const first = pageSize ? (page - 1) * pageSize : 0;
|
|
3551
3743
|
const pageRows = pageSize && !manual ? view.slice(first, first + pageSize) : view;
|
|
3552
3744
|
const canSortAny = !busy && (manual ? total > 1 : rows.length > 1);
|
|
3553
3745
|
const shownTotal = manual && props.totalRows == null ? first + rows.length : total;
|
|
3554
3746
|
const linkPaging = !!props.getPageHref && !props.onPageChange && !oneCallback;
|
|
3555
|
-
const prevLink = React28.useRef(null), nextLink = React28.useRef(null);
|
|
3747
|
+
const prevLink = React28.useRef(null), nextLink = React28.useRef(null), jumpLink = React28.useRef(null);
|
|
3748
|
+
const jumpState = React28.useState(null);
|
|
3749
|
+
React28.useEffect(
|
|
3750
|
+
function() {
|
|
3751
|
+
if (jumpState[0] == null) return;
|
|
3752
|
+
if (jumpLink.current) jumpLink.current.click();
|
|
3753
|
+
jumpState[1](null);
|
|
3754
|
+
},
|
|
3755
|
+
[jumpState[0]]
|
|
3756
|
+
);
|
|
3556
3757
|
function emit(s, p) {
|
|
3557
3758
|
if (props.onStateChange) props.onStateChange({ sort: s, page: p });
|
|
3558
3759
|
}
|
|
@@ -3563,6 +3764,7 @@ var DataTable = React28.forwardRef(function DataTable2(props, ref) {
|
|
|
3563
3764
|
if (linkPaging) {
|
|
3564
3765
|
const a = next === page - 1 ? prevLink.current : next === page + 1 ? nextLink.current : null;
|
|
3565
3766
|
if (a) a.click();
|
|
3767
|
+
else jumpState[1](next);
|
|
3566
3768
|
return false;
|
|
3567
3769
|
}
|
|
3568
3770
|
if (focus) pending.current = focus;
|
|
@@ -3599,7 +3801,8 @@ var DataTable = React28.forwardRef(function DataTable2(props, ref) {
|
|
|
3599
3801
|
}
|
|
3600
3802
|
const height = props.height || 0;
|
|
3601
3803
|
const virtual = !!height && !loading && pageRows.length > 0 && !stacked;
|
|
3602
|
-
const
|
|
3804
|
+
const stickyTotal = !!(props.footer && props.stickyFooter && rows.length && !loading);
|
|
3805
|
+
const bodyH = Math.max(ROW_H, height - ROW_H - (stickyTotal ? ROW_H : 0));
|
|
3603
3806
|
let start = 0, end = pageRows.length;
|
|
3604
3807
|
if (virtual) {
|
|
3605
3808
|
start = Math.max(0, Math.floor(scrollTop / ROW_H) - OVERSCAN);
|
|
@@ -3629,6 +3832,11 @@ var DataTable = React28.forwardRef(function DataTable2(props, ref) {
|
|
|
3629
3832
|
});
|
|
3630
3833
|
c = at >= 0 ? at + (selectable ? 1 : 0) : Math.min(p.c || 0, nCols - 1);
|
|
3631
3834
|
}
|
|
3835
|
+
const ae = document.activeElement;
|
|
3836
|
+
if (ae && ae !== document.body && !gridRef.current.contains(ae)) {
|
|
3837
|
+
pending.current = null;
|
|
3838
|
+
return;
|
|
3839
|
+
}
|
|
3632
3840
|
const el = gridRef.current.querySelector('[data-rc="' + p.r + ":" + c + '"]');
|
|
3633
3841
|
if (el) {
|
|
3634
3842
|
pending.current = null;
|
|
@@ -3658,26 +3866,28 @@ var DataTable = React28.forwardRef(function DataTable2(props, ref) {
|
|
|
3658
3866
|
});
|
|
3659
3867
|
const selSet = {};
|
|
3660
3868
|
selected.forEach(function(k) {
|
|
3661
|
-
selSet[k] = true;
|
|
3869
|
+
selSet[String(k)] = true;
|
|
3662
3870
|
});
|
|
3663
3871
|
const nSel = pageKeys.filter(function(k) {
|
|
3664
|
-
return selSet[k];
|
|
3872
|
+
return selSet[String(k)];
|
|
3665
3873
|
}).length;
|
|
3666
3874
|
const all = nSel > 0 && nSel === pageKeys.length;
|
|
3667
3875
|
function toggle(k, on) {
|
|
3668
3876
|
setSelected(
|
|
3669
3877
|
on ? selected.concat([k]) : selected.filter(function(x) {
|
|
3670
|
-
return x !== k;
|
|
3878
|
+
return String(x) !== String(k);
|
|
3671
3879
|
})
|
|
3672
3880
|
);
|
|
3673
3881
|
}
|
|
3674
3882
|
function toggleAll() {
|
|
3675
3883
|
setSelected(
|
|
3676
3884
|
all ? selected.filter(function(k) {
|
|
3677
|
-
return pageKeys.
|
|
3885
|
+
return !pageKeys.some(function(p) {
|
|
3886
|
+
return String(p) === String(k);
|
|
3887
|
+
});
|
|
3678
3888
|
}) : selected.concat(
|
|
3679
3889
|
pageKeys.filter(function(k) {
|
|
3680
|
-
return !selSet[k];
|
|
3890
|
+
return !selSet[String(k)];
|
|
3681
3891
|
})
|
|
3682
3892
|
)
|
|
3683
3893
|
);
|
|
@@ -4278,7 +4488,7 @@ var DataTable = React28.forwardRef(function DataTable2(props, ref) {
|
|
|
4278
4488
|
}
|
|
4279
4489
|
);
|
|
4280
4490
|
}
|
|
4281
|
-
if (pageSize && (rows.length || busy)) {
|
|
4491
|
+
if (pageSize && (rows.length || busy || page > 1)) {
|
|
4282
4492
|
const from = rows.length ? first + 1 : 0, to = manual ? first + rows.length : Math.min(first + pageSize, view.length);
|
|
4283
4493
|
foot = /* @__PURE__ */ React28.createElement("div", { className: "aura-table__foot" }, /* @__PURE__ */ React28.createElement("span", { "aria-live": "polite" }, busy ? t.loading : t.range(from, to, shownTotal)), /* @__PURE__ */ React28.createElement("span", { className: "aura-table__pager" }, /* @__PURE__ */ React28.createElement("span", null, t.page(page, pageCount)), pagerButton(-1), pagerButton(1)));
|
|
4284
4494
|
} else if (height && rows.length && !loading) {
|
|
@@ -4329,7 +4539,8 @@ var DataTable = React28.forwardRef(function DataTable2(props, ref) {
|
|
|
4329
4539
|
) : null;
|
|
4330
4540
|
const scrollStyle = {
|
|
4331
4541
|
scrollPaddingLeft: "calc(var(--aura-space-6)" + selW + " + " + acc + "px)",
|
|
4332
|
-
scrollPaddingTop: ROW_H + "px"
|
|
4542
|
+
scrollPaddingTop: ROW_H + "px",
|
|
4543
|
+
scrollPaddingBottom: stickyTotal ? ROW_H + "px" : void 0
|
|
4333
4544
|
};
|
|
4334
4545
|
if (height) scrollStyle["--aura-table-h"] = height + "px";
|
|
4335
4546
|
const gridEl = /* @__PURE__ */ React28.createElement(
|
|
@@ -4363,7 +4574,7 @@ var DataTable = React28.forwardRef(function DataTable2(props, ref) {
|
|
|
4363
4574
|
role: "grid",
|
|
4364
4575
|
"aria-label": props.label,
|
|
4365
4576
|
"aria-busy": busy || void 0,
|
|
4366
|
-
"aria-rowcount": loading ? -1 : shownTotal + 1 + (totalRow ? 1 : 0),
|
|
4577
|
+
"aria-rowcount": loading || manual && props.totalRows == null && pageSize && rows.length >= pageSize ? -1 : shownTotal + 1 + (totalRow ? 1 : 0),
|
|
4367
4578
|
"aria-colcount": nCols,
|
|
4368
4579
|
"aria-multiselectable": selectable || void 0,
|
|
4369
4580
|
onKeyDown: onGridKey,
|
|
@@ -4411,7 +4622,8 @@ var DataTable = React28.forwardRef(function DataTable2(props, ref) {
|
|
|
4411
4622
|
items: menu.kind === "picker" ? pickerItems() : byKey[menu.key] ? columnMenuItems(byKey[menu.key]) : []
|
|
4412
4623
|
}
|
|
4413
4624
|
) : null,
|
|
4414
|
-
tipEl
|
|
4625
|
+
tipEl,
|
|
4626
|
+
jumpState[0] != null && props.getPageHref ? /* @__PURE__ */ React28.createElement(Link, { ref: jumpLink, href: props.getPageHref(jumpState[0]), hidden: true, tabIndex: -1, "aria-hidden": true }) : null
|
|
4415
4627
|
);
|
|
4416
4628
|
if (!levels.length) return gridEl;
|
|
4417
4629
|
let out = gridEl;
|
|
@@ -4456,19 +4668,23 @@ var Card = React29.forwardRef(function Card2(props, ref) {
|
|
|
4456
4668
|
var React30 = __toESM(require("react"), 1);
|
|
4457
4669
|
var Tabs = React30.forwardRef(function Tabs2(props, ref) {
|
|
4458
4670
|
const items2 = props.tabs || [], base = uid();
|
|
4671
|
+
const asLinks = items2.length > 0 && items2.every(function(t) {
|
|
4672
|
+
return !!t.href;
|
|
4673
|
+
});
|
|
4674
|
+
const firstOn = items2.filter(function(t) {
|
|
4675
|
+
return !t.disabled;
|
|
4676
|
+
})[0];
|
|
4459
4677
|
const st = useMaybeControlled(
|
|
4460
4678
|
props.value,
|
|
4461
|
-
props.defaultValue ||
|
|
4679
|
+
props.defaultValue || (asLinks ? void 0 : firstOn && firstOn.id),
|
|
4462
4680
|
props.onChange
|
|
4463
4681
|
);
|
|
4682
|
+
const cur = asLinks && "value" in props ? props.value : st[0];
|
|
4464
4683
|
const refs = React30.useRef({});
|
|
4465
4684
|
const current2 = items2.filter(function(t) {
|
|
4466
|
-
return t.id ===
|
|
4467
|
-
})[0] || items2[0];
|
|
4685
|
+
return t.id === cur;
|
|
4686
|
+
})[0] || firstOn || items2[0];
|
|
4468
4687
|
const Link = useLinkComponent(props.linkComponent);
|
|
4469
|
-
const asLinks = items2.length > 0 && items2.every(function(t) {
|
|
4470
|
-
return !!t.href;
|
|
4471
|
-
});
|
|
4472
4688
|
if (asLinks)
|
|
4473
4689
|
return /* @__PURE__ */ React30.createElement(
|
|
4474
4690
|
"nav",
|
|
@@ -4478,7 +4694,7 @@ var Tabs = React30.forwardRef(function Tabs2(props, ref) {
|
|
|
4478
4694
|
className: cx("aura-tabs aura-tabs--links", props.className)
|
|
4479
4695
|
},
|
|
4480
4696
|
/* @__PURE__ */ React30.createElement("div", { className: "aura-tabs__list" }, items2.map(function(t) {
|
|
4481
|
-
const on = t.id ===
|
|
4697
|
+
const on = t.id === cur;
|
|
4482
4698
|
const inner = [
|
|
4483
4699
|
t.icon ? /* @__PURE__ */ React30.createElement(Icon, { key: "i", name: t.icon }) : null,
|
|
4484
4700
|
t.label,
|
|
@@ -4724,6 +4940,7 @@ var SideNav = React31.forwardRef(function SideNav2(props, ref) {
|
|
|
4724
4940
|
style: depth ? { ["--aura-nav-depth"]: depth } : void 0,
|
|
4725
4941
|
onClick: function(e) {
|
|
4726
4942
|
if (!it.href) e.preventDefault();
|
|
4943
|
+
else if (!plainClick(e)) return;
|
|
4727
4944
|
st[1](it.id);
|
|
4728
4945
|
}
|
|
4729
4946
|
};
|
|
@@ -4801,7 +5018,7 @@ function initials(name) {
|
|
|
4801
5018
|
return ((parts[0] || "?")[0] + (parts.length > 1 ? parts[parts.length - 1][0] : parts[0][1] || "")).toUpperCase();
|
|
4802
5019
|
}
|
|
4803
5020
|
var Avatar = React33.forwardRef(function Avatar2(props, ref) {
|
|
4804
|
-
const size = props.size || "md", errState = React33.useState(
|
|
5021
|
+
const size = props.size || "md", errState = React33.useState(null);
|
|
4805
5022
|
let hash = 0;
|
|
4806
5023
|
String(props.name || "").split("").forEach(function(ch) {
|
|
4807
5024
|
hash = hash * 31 + ch.charCodeAt(0) >>> 0;
|
|
@@ -4815,13 +5032,14 @@ var Avatar = React33.forwardRef(function Avatar2(props, ref) {
|
|
|
4815
5032
|
role: "img",
|
|
4816
5033
|
"aria-label": props.name + (props.status ? ", " + props.status : "")
|
|
4817
5034
|
},
|
|
4818
|
-
props.src &&
|
|
5035
|
+
props.src && errState[0] !== props.src ? /* @__PURE__ */ React33.createElement(
|
|
4819
5036
|
"img",
|
|
4820
5037
|
{
|
|
5038
|
+
key: props.src,
|
|
4821
5039
|
src: props.src,
|
|
4822
5040
|
alt: "",
|
|
4823
5041
|
onError: function() {
|
|
4824
|
-
errState[1](
|
|
5042
|
+
errState[1](props.src || null);
|
|
4825
5043
|
}
|
|
4826
5044
|
}
|
|
4827
5045
|
) : /* @__PURE__ */ React33.createElement("span", { "aria-hidden": true }, initials(props.name)),
|
|
@@ -4941,16 +5159,24 @@ var AppShell = React38.forwardRef(function AppShell2(props, ref) {
|
|
|
4941
5159
|
[wide]
|
|
4942
5160
|
);
|
|
4943
5161
|
const navEl = props.nav && React38.isValidElement(props.nav) ? props.nav : null;
|
|
5162
|
+
const shared = !!navEl && navEl.props.value === void 0 && (navEl.props.defaultValue !== void 0 || navEl.props.sections !== void 0 || navEl.props.items !== void 0);
|
|
5163
|
+
const navState = React38.useState(navEl ? navEl.props.defaultValue : void 0);
|
|
5164
|
+
function onNav(id) {
|
|
5165
|
+
if (shared) navState[1](id);
|
|
5166
|
+
if (navEl && navEl.props.onChange) navEl.props.onChange(id);
|
|
5167
|
+
}
|
|
5168
|
+
const deskNav = navEl && shared ? React38.cloneElement(navEl, { value: navState[0], onChange: onNav }) : props.nav;
|
|
4944
5169
|
const drawerNav = navEl ? React38.cloneElement(navEl, {
|
|
5170
|
+
value: shared ? navState[0] : navEl.props.value,
|
|
4945
5171
|
onChange: function(id) {
|
|
4946
|
-
|
|
5172
|
+
onNav(id);
|
|
4947
5173
|
setOpen(false);
|
|
4948
5174
|
},
|
|
4949
5175
|
className: cx(navEl.props.className, "is-in-drawer"),
|
|
4950
5176
|
collapsed: false,
|
|
4951
5177
|
collapsible: false
|
|
4952
5178
|
}) : props.nav;
|
|
4953
|
-
return /* @__PURE__ */ React38.createElement("div", { ref, className: cx("aura-shell", props.bottomNav && "aura-shell--bottomnav", props.className) }, props.nav ? /* @__PURE__ */ React38.createElement("div", { className: "aura-shell__nav" },
|
|
5179
|
+
return /* @__PURE__ */ React38.createElement("div", { ref, className: cx("aura-shell", props.bottomNav && "aura-shell--bottomnav", props.className) }, props.nav ? /* @__PURE__ */ React38.createElement("div", { className: "aura-shell__nav" }, deskNav) : null, props.nav ? /* @__PURE__ */ React38.createElement(
|
|
4954
5180
|
Drawer,
|
|
4955
5181
|
{
|
|
4956
5182
|
open,
|
|
@@ -5064,8 +5290,9 @@ var Table = React41.forwardRef(function Table2(props, ref) {
|
|
|
5064
5290
|
className: "aura-tbl-wrap",
|
|
5065
5291
|
"data-density": density,
|
|
5066
5292
|
tabIndex: scrolls ? 0 : void 0,
|
|
5067
|
-
role: scrolls ? "region" : void 0,
|
|
5068
|
-
"aria-labelledby": scrolls && caption != null ? capId : void 0
|
|
5293
|
+
role: scrolls && (caption != null || rest["aria-label"]) ? "region" : void 0,
|
|
5294
|
+
"aria-labelledby": scrolls && caption != null ? capId : void 0,
|
|
5295
|
+
"aria-label": scrolls && caption == null ? rest["aria-label"] : void 0
|
|
5069
5296
|
},
|
|
5070
5297
|
/* @__PURE__ */ React41.createElement("table", { ref, className: cx("aura-tbl", className), ...rest }, caption != null ? /* @__PURE__ */ React41.createElement("caption", { id: capId, className: cx("aura-tbl__caption", captionHidden && "aura-sr-only") }, caption) : null, children)
|
|
5071
5298
|
);
|
|
@@ -5134,6 +5361,7 @@ var BottomNav = React42.forwardRef(function BottomNav2(props, ref) {
|
|
|
5134
5361
|
"aria-current": on ? "page" : void 0,
|
|
5135
5362
|
onClick: function(e) {
|
|
5136
5363
|
if (!it.href) e.preventDefault();
|
|
5364
|
+
else if (!plainClick(e)) return;
|
|
5137
5365
|
st[1](it.id);
|
|
5138
5366
|
}
|
|
5139
5367
|
};
|
|
@@ -5579,6 +5807,21 @@ var FileUpload = React46.forwardRef(function FileUpload2(props, ref) {
|
|
|
5579
5807
|
});
|
|
5580
5808
|
};
|
|
5581
5809
|
}, []);
|
|
5810
|
+
React46.useEffect(
|
|
5811
|
+
function() {
|
|
5812
|
+
const el = inputRef.current;
|
|
5813
|
+
if (!el || !props.name || typeof DataTransfer === "undefined") return;
|
|
5814
|
+
try {
|
|
5815
|
+
const dt = new DataTransfer();
|
|
5816
|
+
items2.forEach(function(i) {
|
|
5817
|
+
if (i.file && !i.error) dt.items.add(i.file);
|
|
5818
|
+
});
|
|
5819
|
+
el.files = dt.files;
|
|
5820
|
+
} catch (e) {
|
|
5821
|
+
}
|
|
5822
|
+
},
|
|
5823
|
+
[items2, props.name]
|
|
5824
|
+
);
|
|
5582
5825
|
function thumb(it) {
|
|
5583
5826
|
if (!it.file || !/^image\//.test(it.type || "") || typeof URL === "undefined" || !URL.createObjectURL) return null;
|
|
5584
5827
|
if (!urls.current[it.id]) urls.current[it.id] = URL.createObjectURL(it.file);
|
|
@@ -5957,6 +6200,8 @@ function createTheme(opts) {
|
|
|
5957
6200
|
}
|
|
5958
6201
|
if (s) check("light", "ink", "accent-lime (signal)", 4.5, INK, s[200]);
|
|
5959
6202
|
function css(selector) {
|
|
6203
|
+
if (selector !== void 0 && /[<{};@\r\n]|\/\*|\*\//.test(selector))
|
|
6204
|
+
throw new Error('createTheme: "' + selector + '" is not a plain CSS selector');
|
|
5960
6205
|
const light = selector ? selector : ':root, [data-theme="light"]';
|
|
5961
6206
|
const dark = selector ? selector + ".dark, .dark " + selector + ", " + selector + '[data-theme="dark"], [data-theme="dark"] ' + selector : '.dark, [data-theme="dark"]';
|
|
5962
6207
|
const system = selector ? '[data-theme="system"] ' + selector + ", " + selector + '[data-theme="system"]' : '[data-theme="system"]';
|
|
@@ -5965,7 +6210,7 @@ function createTheme(opts) {
|
|
|
5965
6210
|
return " --aura-" + k + ": " + m[k] + ";";
|
|
5966
6211
|
}).join("\n") + "\n}";
|
|
5967
6212
|
}
|
|
5968
|
-
return "/* AURA theme" + (o.name ? ' "' + o.name + '"' : "") + ": brand " + o.brand + (o.signal ? ", signal " + o.signal : "") + (o.primary === "brand" ? ", brand primary buttons" : "") + ". Load after aura.css. Generated by createTheme. */\n" + block(light, L) + "\n" + block(dark, D) + "\n@media (prefers-color-scheme: dark) {\n" + block(system, D) + "\n}\n";
|
|
6213
|
+
return "/* AURA theme" + (o.name ? ' "' + String(o.name).replace(/[*/<>\\]/g, "") + '"' : "") + ": brand " + o.brand + (o.signal ? ", signal " + o.signal : "") + (o.primary === "brand" ? ", brand primary buttons" : "") + ". Load after aura.css. Generated by createTheme. */\n" + block(light, L) + "\n" + block(dark, D) + "\n@media (prefers-color-scheme: dark) {\n" + block(system, D) + "\n}\n";
|
|
5969
6214
|
}
|
|
5970
6215
|
return {
|
|
5971
6216
|
name: o.name || null,
|
|
@@ -5986,12 +6231,21 @@ var React47 = __toESM(require("react"), 1);
|
|
|
5986
6231
|
function ThemeStyle(props) {
|
|
5987
6232
|
const css = React47.useMemo(
|
|
5988
6233
|
function() {
|
|
5989
|
-
|
|
5990
|
-
|
|
5991
|
-
|
|
6234
|
+
try {
|
|
6235
|
+
return createTheme({
|
|
6236
|
+
brand: props.brand,
|
|
6237
|
+
signal: props.signal,
|
|
6238
|
+
primary: props.primary,
|
|
6239
|
+
name: props.name
|
|
6240
|
+
}).css(props.selector);
|
|
6241
|
+
} catch (e) {
|
|
6242
|
+
devWarnOnce("theme-style", "ThemeStyle ignored: " + e.message);
|
|
6243
|
+
return null;
|
|
6244
|
+
}
|
|
5992
6245
|
},
|
|
5993
6246
|
[props.brand, props.signal, props.primary, props.name, props.selector]
|
|
5994
6247
|
);
|
|
6248
|
+
if (css === null) return null;
|
|
5995
6249
|
return /* @__PURE__ */ React47.createElement("style", { "data-aura-theme": props.name || props.brand, dangerouslySetInnerHTML: { __html: css } });
|
|
5996
6250
|
}
|
|
5997
6251
|
|
|
@@ -6006,9 +6260,9 @@ function valid(v) {
|
|
|
6006
6260
|
return typeof v === "string" && SCHEMES.indexOf(v) >= 0;
|
|
6007
6261
|
}
|
|
6008
6262
|
function colorSchemeScript(options) {
|
|
6009
|
-
const key = JSON.stringify(options && options.storageKey || DEFAULT_KEY);
|
|
6010
|
-
const fallback = JSON.stringify(options && options.defaultScheme || "system");
|
|
6011
|
-
return "(function(){try{var s=localStorage.getItem(" + key + ");if(s!=='light'&&s!=='dark'&&s!=='system')s=" + fallback + `;var d=document.documentElement;d.setAttribute("data-theme",s);var
|
|
6263
|
+
const key = JSON.stringify(options && options.storageKey || DEFAULT_KEY).replace(/</g, "\\u003c");
|
|
6264
|
+
const fallback = JSON.stringify(options && options.defaultScheme || "system").replace(/</g, "\\u003c");
|
|
6265
|
+
return "(function(){try{var s=localStorage.getItem(" + key + ");if(s!=='light'&&s!=='dark'&&s!=='system')s=" + fallback + `;var d=document.documentElement;d.setAttribute("data-theme",s);var m=window.matchMedia('(prefers-color-scheme: dark)');d.classList.toggle('dark',s==='dark'||(s==='system'&&m.matches));if(m.addEventListener)m.addEventListener('change',function(e){if(d.getAttribute('data-theme')==='system')d.classList.toggle('dark',e.matches)});}catch(e){}})();`;
|
|
6012
6266
|
}
|
|
6013
6267
|
|
|
6014
6268
|
// src/colorScheme.tsx
|
|
@@ -6045,16 +6299,20 @@ function useColorScheme(options) {
|
|
|
6045
6299
|
if (readScheme(fallback) === "system") apply("system");
|
|
6046
6300
|
cb();
|
|
6047
6301
|
}
|
|
6302
|
+
function onStorage(e) {
|
|
6303
|
+
if (e.key === key) apply(valid(e.newValue) ? e.newValue : fallback);
|
|
6304
|
+
cb();
|
|
6305
|
+
}
|
|
6048
6306
|
if (mq) mq.addEventListener("change", onSystem);
|
|
6049
6307
|
window.addEventListener(EVENT, cb);
|
|
6050
|
-
window.addEventListener("storage",
|
|
6308
|
+
window.addEventListener("storage", onStorage);
|
|
6051
6309
|
return function() {
|
|
6052
6310
|
if (mq) mq.removeEventListener("change", onSystem);
|
|
6053
6311
|
window.removeEventListener(EVENT, cb);
|
|
6054
|
-
window.removeEventListener("storage",
|
|
6312
|
+
window.removeEventListener("storage", onStorage);
|
|
6055
6313
|
};
|
|
6056
6314
|
},
|
|
6057
|
-
[fallback]
|
|
6315
|
+
[fallback, key]
|
|
6058
6316
|
);
|
|
6059
6317
|
const snapshot = React48.useSyncExternalStore(
|
|
6060
6318
|
subscribe2,
|
|
@@ -6254,7 +6512,7 @@ var Pagination = React53.forwardRef(function Pagination2(props, ref) {
|
|
|
6254
6512
|
{
|
|
6255
6513
|
href: link(p),
|
|
6256
6514
|
onClick: function(e) {
|
|
6257
|
-
if (props.onChange) {
|
|
6515
|
+
if (props.onChange && plainClick(e)) {
|
|
6258
6516
|
e.preventDefault();
|
|
6259
6517
|
go(p);
|
|
6260
6518
|
}
|
|
@@ -6296,7 +6554,7 @@ var Pagination = React53.forwardRef(function Pagination2(props, ref) {
|
|
|
6296
6554
|
"aria-label": label,
|
|
6297
6555
|
title: label,
|
|
6298
6556
|
onClick: function(e) {
|
|
6299
|
-
if (props.onChange) {
|
|
6557
|
+
if (props.onChange && plainClick(e)) {
|
|
6300
6558
|
e.preventDefault();
|
|
6301
6559
|
go(p);
|
|
6302
6560
|
}
|
|
@@ -6391,6 +6649,7 @@ var Popover = React55.forwardRef(function Popover2(props, ref) {
|
|
|
6391
6649
|
const open = !!st[0];
|
|
6392
6650
|
const wrap = React55.useRef(null), pop = React55.useRef(null), popMerged = useMergedRef(ref, pop);
|
|
6393
6651
|
const pos = React55.useState(null), mounted = useMounted();
|
|
6652
|
+
const inTree = React55.useRef(false);
|
|
6394
6653
|
function trigger() {
|
|
6395
6654
|
return wrap.current && (wrap.current.querySelector('button, [role="button"], a, input') || wrap.current.firstElementChild);
|
|
6396
6655
|
}
|
|
@@ -6424,13 +6683,19 @@ var Popover = React55.forwardRef(function Popover2(props, ref) {
|
|
|
6424
6683
|
const f = pop.current.querySelector("[data-autofocus]") || pop.current.querySelector(FOCUSABLE);
|
|
6425
6684
|
(f || pop.current).focus();
|
|
6426
6685
|
}
|
|
6686
|
+
let timer;
|
|
6427
6687
|
function outside(e) {
|
|
6428
6688
|
if (pop.current && pop.current.contains(e.target)) return;
|
|
6429
6689
|
if (wrap.current && wrap.current.contains(e.target)) return;
|
|
6430
|
-
|
|
6690
|
+
inTree.current = false;
|
|
6691
|
+
clearTimeout(timer);
|
|
6692
|
+
timer = setTimeout(function() {
|
|
6693
|
+
if (!inTree.current) close(false);
|
|
6694
|
+
}, 0);
|
|
6431
6695
|
}
|
|
6432
6696
|
document.addEventListener("pointerdown", outside, true);
|
|
6433
6697
|
return function() {
|
|
6698
|
+
clearTimeout(timer);
|
|
6434
6699
|
document.removeEventListener("pointerdown", outside, true);
|
|
6435
6700
|
};
|
|
6436
6701
|
},
|
|
@@ -6449,6 +6714,9 @@ var Popover = React55.forwardRef(function Popover2(props, ref) {
|
|
|
6449
6714
|
"aria-label": props.title ? void 0 : props.label,
|
|
6450
6715
|
"aria-labelledby": props.title ? id + "-title" : void 0,
|
|
6451
6716
|
tabIndex: -1,
|
|
6717
|
+
onPointerDownCapture: function() {
|
|
6718
|
+
inTree.current = true;
|
|
6719
|
+
},
|
|
6452
6720
|
className: cx("aura-popover", pos[0] && "is-" + pos[0].side, props.className),
|
|
6453
6721
|
style: Object.assign(
|
|
6454
6722
|
{ top: pos[0] ? pos[0].top : -9999, left: pos[0] ? pos[0].left : -9999 },
|
|
@@ -6498,7 +6766,9 @@ function decimalsOf(n2) {
|
|
|
6498
6766
|
return i < 0 ? 0 : s.length - i - 1;
|
|
6499
6767
|
}
|
|
6500
6768
|
function parse(text) {
|
|
6501
|
-
|
|
6769
|
+
let t = text.trim();
|
|
6770
|
+
if (t.indexOf(".") < 0 && /^-?\d+,\d+$/.test(t.replace(/[\s ]/g, "")) && !/,\d{3}$/.test(t)) t = t.replace(",", ".");
|
|
6771
|
+
const s = t.replace(/[,\s ]/g, "");
|
|
6502
6772
|
if (!/^-?(\d+\.?\d*|\.\d+)$/.test(s)) return NaN;
|
|
6503
6773
|
return Number(s);
|
|
6504
6774
|
}
|