@jirawatpyk/aura-react 5.51.0 → 5.53.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 +26 -0
- package/dist/aura.bundle.js +408 -198
- package/dist/cjs/index.cjs +407 -197
- package/dist/esm/Table.js +52 -7
- package/dist/esm/TableSkeleton.js +170 -0
- package/dist/esm/display.js +3 -1
- package/dist/esm/index.js +2 -0
- package/dist/index.d.cts +62 -5
- package/dist/index.d.ts +62 -5
- package/dist/server/index.cjs +213 -49
- package/dist/server/index.d.cts +45 -3
- package/dist/server/index.d.ts +45 -3
- package/dist/server/index.js +213 -49
- package/dist/styles.css +21 -0
- package/dist/styles.layer.css +21 -0
- package/package.json +1 -1
package/dist/cjs/index.cjs
CHANGED
|
@@ -92,6 +92,7 @@ __export(index_exports, {
|
|
|
92
92
|
TFoot: () => TFoot,
|
|
93
93
|
THead: () => THead,
|
|
94
94
|
Table: () => Table,
|
|
95
|
+
TableSkeleton: () => TableSkeleton,
|
|
95
96
|
Tabs: () => Tabs,
|
|
96
97
|
Tag: () => Tag,
|
|
97
98
|
Td: () => Td,
|
|
@@ -812,7 +813,9 @@ function buttonClass(opts = {}) {
|
|
|
812
813
|
"aura-btn",
|
|
813
814
|
"aura-btn--" + (opts.variant || "primary"),
|
|
814
815
|
opts.size === "sm" && "aura-btn--sm",
|
|
815
|
-
opts.fullWidth && "aura-btn--full",
|
|
816
|
+
opts.fullWidth && opts.fullWidth !== "below-sm" && opts.fullWidth !== "below-md" && "aura-btn--full",
|
|
817
|
+
/* 5.53 (Chamber-OS 165): full width on phones only. */
|
|
818
|
+
(opts.fullWidth === "below-sm" || opts.fullWidth === "below-md") && "aura-btn--full-" + opts.fullWidth,
|
|
816
819
|
opts.touchHeight && "aura-btn--touch",
|
|
817
820
|
opts.loading && "is-loading",
|
|
818
821
|
opts.className
|
|
@@ -5950,7 +5953,7 @@ var DataTableImpl = React33.forwardRef(function DataTable(props, ref) {
|
|
|
5950
5953
|
);
|
|
5951
5954
|
for (let i = 0; i < els.length; i++) if (els[i].tabIndex !== -1) els[i].tabIndex = -1;
|
|
5952
5955
|
});
|
|
5953
|
-
function
|
|
5956
|
+
function widthOf2(c) {
|
|
5954
5957
|
return widths[c.key] != null ? widths[c.key] : c.width;
|
|
5955
5958
|
}
|
|
5956
5959
|
const order = orderState[0].filter(function(k) {
|
|
@@ -6024,11 +6027,11 @@ var DataTableImpl = React33.forwardRef(function DataTable(props, ref) {
|
|
|
6024
6027
|
return p === "field" || p === "wide";
|
|
6025
6028
|
});
|
|
6026
6029
|
const hasFlex = vis.some(function(c) {
|
|
6027
|
-
return
|
|
6030
|
+
return widthOf2(c) == null;
|
|
6028
6031
|
});
|
|
6029
6032
|
let fixedSum = 0, hideTerms = "";
|
|
6030
6033
|
vis.forEach(function(c) {
|
|
6031
|
-
const w =
|
|
6034
|
+
const w = widthOf2(c) != null ? widthOf2(c) : c.minWidth || FLEX_MIN, lv = hideLevel(c);
|
|
6032
6035
|
if (lv && boxWidth[0] == null) hideTerms += " + " + w + "px * var(--aura-h" + lv + "-on, 1)";
|
|
6033
6036
|
else fixedSum += w;
|
|
6034
6037
|
});
|
|
@@ -6037,7 +6040,7 @@ var DataTableImpl = React33.forwardRef(function DataTable(props, ref) {
|
|
|
6037
6040
|
if (isPinned(c)) {
|
|
6038
6041
|
pinOffsets[c.key] = acc;
|
|
6039
6042
|
const lv = hideLevel(c);
|
|
6040
|
-
acc += " + " +
|
|
6043
|
+
acc += " + " + widthOf2(c) + "px" + (lv && boxWidth[0] == null ? " * var(--aura-h" + lv + "-on, 1)" : "");
|
|
6041
6044
|
}
|
|
6042
6045
|
});
|
|
6043
6046
|
if (vis.filter(function(c) {
|
|
@@ -6051,7 +6054,7 @@ var DataTableImpl = React33.forwardRef(function DataTable(props, ref) {
|
|
|
6051
6054
|
const gutterR = controls ? "var(--aura-space-12)" : "var(--aura-space-6)";
|
|
6052
6055
|
const rowMinWidth = "calc(" + fixedSum + "px" + hideTerms + " + var(--aura-space-6) + " + gutterR + selW + ")";
|
|
6053
6056
|
function cellStyle(c, i) {
|
|
6054
|
-
const w =
|
|
6057
|
+
const w = widthOf2(c), s = {};
|
|
6055
6058
|
if (w == null) {
|
|
6056
6059
|
const g = typeof c.grow === "number" && c.grow >= 0 && isFinite(c.grow) ? c.grow : 1;
|
|
6057
6060
|
s["--aura-cell-flex"] = g + " 1 0";
|
|
@@ -6366,7 +6369,7 @@ var DataTableImpl = React33.forwardRef(function DataTable(props, ref) {
|
|
|
6366
6369
|
e.preventDefault();
|
|
6367
6370
|
e.stopPropagation();
|
|
6368
6371
|
resizing.current = true;
|
|
6369
|
-
let x0 = e.clientX, w0 =
|
|
6372
|
+
let x0 = e.clientX, w0 = widthOf2(c), last = w0;
|
|
6370
6373
|
const el = e.currentTarget;
|
|
6371
6374
|
el.classList.add("is-dragging");
|
|
6372
6375
|
document.body.style.cursor = "col-resize";
|
|
@@ -6550,7 +6553,7 @@ var DataTableImpl = React33.forwardRef(function DataTable(props, ref) {
|
|
|
6550
6553
|
const row = r2 > 0 && r2 <= nRows ? pageRows[r2 - 1] : null, isTotal = hasTotal && r2 === T;
|
|
6551
6554
|
let handled = true;
|
|
6552
6555
|
if (r2 === 0 && col && e.altKey && (k === "ArrowLeft" || k === "ArrowRight") && canResize(col))
|
|
6553
|
-
setW(col,
|
|
6556
|
+
setW(col, widthOf2(col) + (k === "ArrowLeft" ? -1 : 1) * (e.shiftKey ? 48 : 16), true);
|
|
6554
6557
|
else if (r2 === 0 && col && e.ctrlKey && e.shiftKey && (k === "ArrowLeft" || k === "ArrowRight") && reorderable) {
|
|
6555
6558
|
if (moveCol(col.key, k === "ArrowLeft" ? -1 : 1)) pending.current = { r: 0, key: col.key, c };
|
|
6556
6559
|
} else if (r2 === 0 && col && (e.altKey && k === "ArrowDown" || k === "ContextMenu" || e.shiftKey && k === "F10") && controls)
|
|
@@ -8368,9 +8371,9 @@ var AppShell = React48.forwardRef(function AppShell2(props, ref) {
|
|
|
8368
8371
|
const root = rootRef.current, bar = barRef.current;
|
|
8369
8372
|
if (!root || !bar) return;
|
|
8370
8373
|
function sync() {
|
|
8371
|
-
const
|
|
8372
|
-
root.style.setProperty("--aura-shell-bar-height", awayRef.current || !pinned(bar) ? "0px" :
|
|
8373
|
-
if (
|
|
8374
|
+
const h12 = bar.getBoundingClientRect().height;
|
|
8375
|
+
root.style.setProperty("--aura-shell-bar-height", awayRef.current || !pinned(bar) ? "0px" : h12 + "px");
|
|
8376
|
+
if (h12 > 0) barH[1](Math.round(h12));
|
|
8374
8377
|
}
|
|
8375
8378
|
sync();
|
|
8376
8379
|
const ro = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(sync);
|
|
@@ -8537,13 +8540,176 @@ var Separator = React50.forwardRef(function Separator2(props, ref) {
|
|
|
8537
8540
|
});
|
|
8538
8541
|
|
|
8539
8542
|
// src/Table.tsx
|
|
8543
|
+
var React52 = __toESM(require("react"), 1);
|
|
8544
|
+
|
|
8545
|
+
// src/TableSkeleton.tsx
|
|
8540
8546
|
var React51 = __toESM(require("react"), 1);
|
|
8541
|
-
var
|
|
8542
|
-
|
|
8547
|
+
var h10 = React51.createElement;
|
|
8548
|
+
function inertProps() {
|
|
8549
|
+
return { inert: parseInt(React51.version, 10) >= 19 ? true : "", "aria-hidden": true };
|
|
8550
|
+
}
|
|
8551
|
+
function widthOf(w) {
|
|
8552
|
+
return w == null || w === "" ? void 0 : typeof w === "number" ? w + "px" : w;
|
|
8553
|
+
}
|
|
8554
|
+
function skeletonColgroup(cols) {
|
|
8555
|
+
return h10(
|
|
8556
|
+
"colgroup",
|
|
8557
|
+
null,
|
|
8558
|
+
cols.map(function(c, i) {
|
|
8559
|
+
const w = widthOf(c.width);
|
|
8560
|
+
return h10("col", { key: i, style: w ? { width: w } : void 0 });
|
|
8561
|
+
})
|
|
8562
|
+
);
|
|
8563
|
+
}
|
|
8564
|
+
function placeholder(c) {
|
|
8565
|
+
const s = c.skeleton || {};
|
|
8566
|
+
if (s.kind === "pill") return h10("span", { className: "aura-skel aura-skel--pill" });
|
|
8567
|
+
if (s.kind === "action") return h10("span", { className: cx("aura-skel aura-skel--action", s.touch && "is-touch") });
|
|
8568
|
+
if (s.lines === 2)
|
|
8569
|
+
return h10(
|
|
8570
|
+
"span",
|
|
8571
|
+
{ className: "aura-skel-lines" },
|
|
8572
|
+
h10("span", { className: "aura-skel aura-skel--text", style: { width: "100%" } }),
|
|
8573
|
+
h10("span", { className: "aura-skel aura-skel--text", style: { width: "60%" } })
|
|
8574
|
+
);
|
|
8575
|
+
return h10("span", { className: "aura-skel aura-skel--text", style: { width: "80%" } });
|
|
8576
|
+
}
|
|
8577
|
+
function cellCls(base, c) {
|
|
8578
|
+
const align = c.align || (c.numeric ? "end" : void 0);
|
|
8579
|
+
return cx(base, align === "end" && "is-end", align === "center" && "is-center", c.numeric && "is-numeric");
|
|
8580
|
+
}
|
|
8581
|
+
function skeletonBody(cols, n3, stacked) {
|
|
8582
|
+
const rows = [];
|
|
8583
|
+
for (let r2 = 0; r2 < n3; r2++)
|
|
8584
|
+
rows.push(
|
|
8585
|
+
h10(
|
|
8586
|
+
"tr",
|
|
8587
|
+
{ key: r2, className: "aura-tbl__row aura-tbl__row--skeleton", role: stacked ? "row" : void 0 },
|
|
8588
|
+
cols.map(function(c, i) {
|
|
8589
|
+
const slot = stacked && (c.card === "title" || c.card === "action") ? c.card : void 0;
|
|
8590
|
+
return h10(
|
|
8591
|
+
"td",
|
|
8592
|
+
{
|
|
8593
|
+
key: i,
|
|
8594
|
+
className: cellCls("aura-tbl__td", c),
|
|
8595
|
+
role: stacked ? "cell" : void 0,
|
|
8596
|
+
"data-label": stacked && !slot && c.label ? c.label : void 0,
|
|
8597
|
+
"data-card": slot
|
|
8598
|
+
},
|
|
8599
|
+
placeholder(c)
|
|
8600
|
+
);
|
|
8601
|
+
})
|
|
8602
|
+
)
|
|
8603
|
+
);
|
|
8604
|
+
return h10(
|
|
8605
|
+
"tbody",
|
|
8606
|
+
{ key: "aura-skeleton", className: "aura-tbl__body", role: stacked ? "rowgroup" : void 0 },
|
|
8607
|
+
rows
|
|
8608
|
+
);
|
|
8609
|
+
}
|
|
8610
|
+
function tableWrapClass(p) {
|
|
8611
|
+
return cx(
|
|
8612
|
+
"aura-tbl-wrap",
|
|
8613
|
+
p.stackBelow && "is-stackable",
|
|
8614
|
+
p.bordered === false && "is-flush",
|
|
8615
|
+
p.bleed && "aura-bleed-frame",
|
|
8616
|
+
p.bleed && !p.cards && "aura-bleed",
|
|
8617
|
+
p.bleed && p.bleedEnd && !p.cards && "aura-bleed-end"
|
|
8618
|
+
);
|
|
8619
|
+
}
|
|
8620
|
+
function tableClass(p) {
|
|
8621
|
+
return cx(
|
|
8622
|
+
"aura-tbl",
|
|
8623
|
+
p.stackBelow && "aura-tbl--stack-" + p.stackBelow,
|
|
8624
|
+
(p.align === "middle" || p.rowHeight === "density" && p.align !== "top") && "aura-tbl--middle",
|
|
8625
|
+
p.rowHeight === "density" && "aura-tbl--row-density",
|
|
8626
|
+
p.cards && "aura-tbl--cards",
|
|
8627
|
+
p.className
|
|
8628
|
+
);
|
|
8629
|
+
}
|
|
8630
|
+
function cardsFrame(el, p) {
|
|
8631
|
+
return p.cards ? h10(
|
|
8632
|
+
"div",
|
|
8633
|
+
{
|
|
8634
|
+
className: cx(
|
|
8635
|
+
"aura-tbl-cards aura-tbl-cards--" + p.stackBelow,
|
|
8636
|
+
p.bleed && "aura-bleed",
|
|
8637
|
+
p.bleed && p.bleedEnd && "aura-bleed-end"
|
|
8638
|
+
)
|
|
8639
|
+
},
|
|
8640
|
+
el
|
|
8641
|
+
) : el;
|
|
8642
|
+
}
|
|
8643
|
+
function TableSkeleton(props) {
|
|
8644
|
+
const cols = props.columns || [];
|
|
8645
|
+
const n3 = props.rows != null ? Math.max(0, props.rows) : 5;
|
|
8646
|
+
const stacked = !!props.stackBelow;
|
|
8647
|
+
const cards = stacked && props.stackStyle === "cards";
|
|
8648
|
+
const head = h10(
|
|
8649
|
+
"thead",
|
|
8650
|
+
{ className: "aura-tbl__head", role: stacked ? "rowgroup" : void 0 },
|
|
8651
|
+
h10(
|
|
8652
|
+
"tr",
|
|
8653
|
+
{ className: "aura-tbl__row", role: stacked ? "row" : void 0 },
|
|
8654
|
+
cols.map(function(c, i) {
|
|
8655
|
+
return h10(
|
|
8656
|
+
"th",
|
|
8657
|
+
{ key: i, scope: "col", className: cellCls("aura-tbl__th", c), role: stacked ? "columnheader" : void 0 },
|
|
8658
|
+
c.label
|
|
8659
|
+
);
|
|
8660
|
+
})
|
|
8661
|
+
)
|
|
8662
|
+
);
|
|
8663
|
+
const table = h10(
|
|
8664
|
+
"div",
|
|
8665
|
+
Object.assign(
|
|
8666
|
+
{
|
|
8667
|
+
className: tableWrapClass({
|
|
8668
|
+
stackBelow: props.stackBelow,
|
|
8669
|
+
bordered: props.bordered,
|
|
8670
|
+
bleed: props.bleed,
|
|
8671
|
+
bleedEnd: props.bleedEnd,
|
|
8672
|
+
cards
|
|
8673
|
+
}),
|
|
8674
|
+
"data-density": props.density || "comfortable"
|
|
8675
|
+
},
|
|
8676
|
+
inertProps()
|
|
8677
|
+
),
|
|
8678
|
+
h10(
|
|
8679
|
+
"table",
|
|
8680
|
+
{
|
|
8681
|
+
className: cx(
|
|
8682
|
+
tableClass({
|
|
8683
|
+
stackBelow: props.stackBelow,
|
|
8684
|
+
align: props.align,
|
|
8685
|
+
rowHeight: props.rowHeight,
|
|
8686
|
+
cards,
|
|
8687
|
+
className: props.className
|
|
8688
|
+
}),
|
|
8689
|
+
"aura-tbl--skeleton"
|
|
8690
|
+
),
|
|
8691
|
+
role: stacked ? "table" : void 0
|
|
8692
|
+
},
|
|
8693
|
+
skeletonColgroup(cols),
|
|
8694
|
+
head,
|
|
8695
|
+
skeletonBody(cols, n3, stacked)
|
|
8696
|
+
)
|
|
8697
|
+
);
|
|
8698
|
+
return cardsFrame(table, {
|
|
8699
|
+
stackBelow: props.stackBelow,
|
|
8700
|
+
bleed: props.bleed,
|
|
8701
|
+
bleedEnd: props.bleedEnd,
|
|
8702
|
+
cards
|
|
8703
|
+
});
|
|
8704
|
+
}
|
|
8705
|
+
|
|
8706
|
+
// src/Table.tsx
|
|
8707
|
+
var StackLabels = React52.createContext(null);
|
|
8708
|
+
var ColumnIndex = React52.createContext(-1);
|
|
8543
8709
|
function flat2(children) {
|
|
8544
8710
|
const out = [];
|
|
8545
|
-
|
|
8546
|
-
if (
|
|
8711
|
+
React52.Children.toArray(children).forEach(function(c) {
|
|
8712
|
+
if (React52.isValidElement(c) && c.type === React52.Fragment)
|
|
8547
8713
|
out.push.apply(out, flat2(c.props.children));
|
|
8548
8714
|
else out.push(c);
|
|
8549
8715
|
});
|
|
@@ -8557,7 +8723,7 @@ function text(node) {
|
|
|
8557
8723
|
});
|
|
8558
8724
|
return parts.length ? parts.join("") : void 0;
|
|
8559
8725
|
}
|
|
8560
|
-
if (
|
|
8726
|
+
if (React52.isValidElement(node)) {
|
|
8561
8727
|
const p = node.props;
|
|
8562
8728
|
if (p["aria-hidden"] === true || p["aria-hidden"] === "true") return void 0;
|
|
8563
8729
|
return text(p.children);
|
|
@@ -8567,13 +8733,13 @@ function text(node) {
|
|
|
8567
8733
|
function headerLabels(children) {
|
|
8568
8734
|
let out = [];
|
|
8569
8735
|
flat2(children).forEach(function(c) {
|
|
8570
|
-
if (out.length || !
|
|
8736
|
+
if (out.length || !React52.isValidElement(c) || c.type !== THead) return;
|
|
8571
8737
|
const row = flat2(c.props.children).find(function(r2) {
|
|
8572
|
-
return
|
|
8738
|
+
return React52.isValidElement(r2);
|
|
8573
8739
|
});
|
|
8574
8740
|
if (!row) return;
|
|
8575
8741
|
flat2(row.props.children).forEach(function(cell) {
|
|
8576
|
-
if (!
|
|
8742
|
+
if (!React52.isValidElement(cell)) return;
|
|
8577
8743
|
const p = cell.props;
|
|
8578
8744
|
const t = text(p.children);
|
|
8579
8745
|
const label = p.label != null ? p.label : t != null ? t.replace(/\s+/g, " ").trim() || void 0 : void 0;
|
|
@@ -8583,7 +8749,34 @@ function headerLabels(children) {
|
|
|
8583
8749
|
});
|
|
8584
8750
|
return out;
|
|
8585
8751
|
}
|
|
8586
|
-
|
|
8752
|
+
function headerColumns(children) {
|
|
8753
|
+
const out = [];
|
|
8754
|
+
flat2(children).forEach(function(c) {
|
|
8755
|
+
if (out.length || !React52.isValidElement(c) || c.type !== THead) return;
|
|
8756
|
+
const row = flat2(c.props.children).find(function(r2) {
|
|
8757
|
+
return React52.isValidElement(r2);
|
|
8758
|
+
});
|
|
8759
|
+
if (!row) return;
|
|
8760
|
+
flat2(row.props.children).forEach(function(cell) {
|
|
8761
|
+
if (!React52.isValidElement(cell)) return;
|
|
8762
|
+
const p = cell.props;
|
|
8763
|
+
const t = text(p.children);
|
|
8764
|
+
const style = p.style;
|
|
8765
|
+
const span = Math.max(1, Number(p.colSpan) || 1);
|
|
8766
|
+
for (let i = 0; i < span; i++)
|
|
8767
|
+
out.push({
|
|
8768
|
+
label: p.label != null ? p.label : t != null ? t.replace(/\s+/g, " ").trim() || void 0 : void 0,
|
|
8769
|
+
width: span > 1 ? void 0 : p.skeletonWidth != null ? p.skeletonWidth : p.width != null ? p.width : style && style.width,
|
|
8770
|
+
align: p.align,
|
|
8771
|
+
numeric: p.numeric,
|
|
8772
|
+
card: p.card,
|
|
8773
|
+
skeleton: p.skeleton
|
|
8774
|
+
});
|
|
8775
|
+
});
|
|
8776
|
+
});
|
|
8777
|
+
return out;
|
|
8778
|
+
}
|
|
8779
|
+
var Table = React52.forwardRef(function Table2(props, ref) {
|
|
8587
8780
|
const {
|
|
8588
8781
|
caption,
|
|
8589
8782
|
captionHidden,
|
|
@@ -8597,10 +8790,24 @@ var Table = React51.forwardRef(function Table2(props, ref) {
|
|
|
8597
8790
|
maxHeight,
|
|
8598
8791
|
stackStyle,
|
|
8599
8792
|
rowHeight,
|
|
8793
|
+
loading,
|
|
8794
|
+
loadingRows,
|
|
8600
8795
|
className,
|
|
8601
8796
|
children,
|
|
8602
8797
|
...rest
|
|
8603
8798
|
} = props;
|
|
8799
|
+
const skeletonCols = loading ? headerColumns(children) : null;
|
|
8800
|
+
if (skeletonCols && !skeletonCols.length)
|
|
8801
|
+
devWarnOnce(
|
|
8802
|
+
"tbl-loading-cols",
|
|
8803
|
+
"Table loading: no THead > Tr > Th found among its children, so there are no columns to draw. Put the THead directly inside Table (a function call, not your own component)."
|
|
8804
|
+
);
|
|
8805
|
+
const shownChildren = skeletonCols ? [
|
|
8806
|
+
flat2(children).filter(function(c) {
|
|
8807
|
+
return React52.isValidElement(c) && c.type === THead;
|
|
8808
|
+
}),
|
|
8809
|
+
skeletonBody(skeletonCols, loadingRows != null ? Math.max(0, loadingRows) : 5, !!stackBelow)
|
|
8810
|
+
] : children;
|
|
8604
8811
|
const cards = !!stackBelow && stackStyle === "cards";
|
|
8605
8812
|
if (maxHeight != null && caption == null && !rest["aria-label"] && !rest["aria-labelledby"])
|
|
8606
8813
|
devWarnOnce(
|
|
@@ -8613,12 +8820,12 @@ var Table = React51.forwardRef(function Table2(props, ref) {
|
|
|
8613
8820
|
"tbl-stack-labels",
|
|
8614
8821
|
"Table stackBelow: no THead > Tr > Th found among its children, so cells have no labels. Pass `label` on each Td."
|
|
8615
8822
|
);
|
|
8616
|
-
const outer =
|
|
8823
|
+
const outer = React52.useContext(StackLabels);
|
|
8617
8824
|
const pageDensity = useDensity();
|
|
8618
8825
|
const capId = uid();
|
|
8619
|
-
const wrap =
|
|
8620
|
-
const sc =
|
|
8621
|
-
const wide =
|
|
8826
|
+
const wrap = React52.useRef(null);
|
|
8827
|
+
const sc = React52.useState(false), scrolls = sc[0];
|
|
8828
|
+
const wide = React52.useState(false);
|
|
8622
8829
|
useIsoLayoutEffect(function() {
|
|
8623
8830
|
const el = wrap.current;
|
|
8624
8831
|
if (!el || typeof ResizeObserver === "undefined") return;
|
|
@@ -8635,7 +8842,7 @@ var Table = React51.forwardRef(function Table2(props, ref) {
|
|
|
8635
8842
|
ro.disconnect();
|
|
8636
8843
|
};
|
|
8637
8844
|
}, []);
|
|
8638
|
-
const table = /* @__PURE__ */
|
|
8845
|
+
const table = /* @__PURE__ */ React52.createElement(
|
|
8639
8846
|
"div",
|
|
8640
8847
|
{
|
|
8641
8848
|
ref: wrap,
|
|
@@ -8654,12 +8861,13 @@ var Table = React51.forwardRef(function Table2(props, ref) {
|
|
|
8654
8861
|
),
|
|
8655
8862
|
style: maxHeight != null ? { maxHeight: typeof maxHeight === "number" ? maxHeight + "px" : maxHeight } : void 0,
|
|
8656
8863
|
"data-density": density || pageDensity,
|
|
8657
|
-
|
|
8658
|
-
|
|
8659
|
-
|
|
8660
|
-
"aria-
|
|
8864
|
+
...loading ? inertProps() : null,
|
|
8865
|
+
tabIndex: scrolls && !loading ? 0 : void 0,
|
|
8866
|
+
role: scrolls && !loading && (caption != null || rest["aria-label"] || rest["aria-labelledby"]) ? "region" : void 0,
|
|
8867
|
+
"aria-labelledby": scrolls && !loading ? caption != null ? capId : rest["aria-labelledby"] : void 0,
|
|
8868
|
+
"aria-label": scrolls && !loading && caption == null ? rest["aria-label"] : void 0
|
|
8661
8869
|
},
|
|
8662
|
-
/* @__PURE__ */
|
|
8870
|
+
/* @__PURE__ */ React52.createElement(
|
|
8663
8871
|
"table",
|
|
8664
8872
|
{
|
|
8665
8873
|
ref,
|
|
@@ -8670,16 +8878,18 @@ var Table = React51.forwardRef(function Table2(props, ref) {
|
|
|
8670
8878
|
(align === "middle" || rowHeight === "density" && align !== "top") && "aura-tbl--middle",
|
|
8671
8879
|
rowHeight === "density" && "aura-tbl--row-density",
|
|
8672
8880
|
cards && "aura-tbl--cards",
|
|
8881
|
+
loading && "aura-tbl--skeleton",
|
|
8673
8882
|
className
|
|
8674
8883
|
),
|
|
8675
8884
|
role: stackBelow ? "table" : void 0,
|
|
8676
8885
|
...rest
|
|
8677
8886
|
},
|
|
8678
|
-
caption != null ? /* @__PURE__ */
|
|
8679
|
-
|
|
8887
|
+
caption != null ? /* @__PURE__ */ React52.createElement("caption", { id: capId, className: cx("aura-tbl__caption", captionHidden && "aura-sr-only") }, caption) : null,
|
|
8888
|
+
skeletonCols ? skeletonColgroup(skeletonCols) : null,
|
|
8889
|
+
labels ? /* @__PURE__ */ React52.createElement(StackLabels.Provider, { value: labels }, shownChildren) : outer ? /* @__PURE__ */ React52.createElement(StackLabels.Provider, { value: null }, shownChildren) : shownChildren
|
|
8680
8890
|
)
|
|
8681
8891
|
);
|
|
8682
|
-
return cards ? /* @__PURE__ */
|
|
8892
|
+
return cards ? /* @__PURE__ */ React52.createElement(
|
|
8683
8893
|
"div",
|
|
8684
8894
|
{
|
|
8685
8895
|
className: cx(
|
|
@@ -8692,10 +8902,10 @@ var Table = React51.forwardRef(function Table2(props, ref) {
|
|
|
8692
8902
|
) : table;
|
|
8693
8903
|
});
|
|
8694
8904
|
function section(tag, cls) {
|
|
8695
|
-
const C =
|
|
8905
|
+
const C = React52.forwardRef(function TableSection(props, ref) {
|
|
8696
8906
|
const { className, ...rest } = props;
|
|
8697
|
-
const stacked =
|
|
8698
|
-
return
|
|
8907
|
+
const stacked = React52.useContext(StackLabels) != null;
|
|
8908
|
+
return React52.createElement(
|
|
8699
8909
|
tag,
|
|
8700
8910
|
Object.assign({ ref, className: cx(cls, className), role: stacked ? "rowgroup" : void 0 }, rest)
|
|
8701
8911
|
);
|
|
@@ -8708,14 +8918,14 @@ var TBody = section("tbody", "aura-tbl__body");
|
|
|
8708
8918
|
TBody.displayName = "TBody";
|
|
8709
8919
|
var TFoot = section("tfoot", "aura-tbl__foot");
|
|
8710
8920
|
TFoot.displayName = "TFoot";
|
|
8711
|
-
var Tr =
|
|
8921
|
+
var Tr = React52.forwardRef(function Tr2(props, ref) {
|
|
8712
8922
|
const { className, children, ...rest } = props;
|
|
8713
|
-
const stacked =
|
|
8923
|
+
const stacked = React52.useContext(StackLabels) != null;
|
|
8714
8924
|
let col = 0;
|
|
8715
|
-
return /* @__PURE__ */
|
|
8925
|
+
return /* @__PURE__ */ React52.createElement("tr", { ref, className: cx("aura-tbl__row", className), role: stacked ? "row" : void 0, ...rest }, stacked ? flat2(children).map(function(c) {
|
|
8716
8926
|
const at = col;
|
|
8717
|
-
if (
|
|
8718
|
-
return /* @__PURE__ */
|
|
8927
|
+
if (React52.isValidElement(c)) col += Math.max(1, Number(c.props.colSpan) || 1);
|
|
8928
|
+
return /* @__PURE__ */ React52.createElement(ColumnIndex.Provider, { key: React52.isValidElement(c) && c.key != null ? c.key : at, value: at }, c);
|
|
8719
8929
|
}) : children);
|
|
8720
8930
|
});
|
|
8721
8931
|
function cellClass(base, p) {
|
|
@@ -8729,10 +8939,10 @@ function cellClass(base, p) {
|
|
|
8729
8939
|
p.className
|
|
8730
8940
|
);
|
|
8731
8941
|
}
|
|
8732
|
-
var Th =
|
|
8733
|
-
const { align, numeric, mono, className, scope, label, card, ...rest } = props;
|
|
8734
|
-
const stacked =
|
|
8735
|
-
return /* @__PURE__ */
|
|
8942
|
+
var Th = React52.forwardRef(function Th2(props, ref) {
|
|
8943
|
+
const { align, numeric, mono, className, scope, label, card, skeleton, skeletonWidth, ...rest } = props;
|
|
8944
|
+
const stacked = React52.useContext(StackLabels) != null;
|
|
8945
|
+
return /* @__PURE__ */ React52.createElement(
|
|
8736
8946
|
"th",
|
|
8737
8947
|
{
|
|
8738
8948
|
ref,
|
|
@@ -8744,12 +8954,12 @@ var Th = React51.forwardRef(function Th2(props, ref) {
|
|
|
8744
8954
|
}
|
|
8745
8955
|
);
|
|
8746
8956
|
});
|
|
8747
|
-
var Td =
|
|
8748
|
-
const { align, numeric, mono, className, scope, label, card, ...rest } = props;
|
|
8749
|
-
const labels =
|
|
8957
|
+
var Td = React52.forwardRef(function Td2(props, ref) {
|
|
8958
|
+
const { align, numeric, mono, className, scope, label, card, skeleton, skeletonWidth, ...rest } = props;
|
|
8959
|
+
const labels = React52.useContext(StackLabels), col = React52.useContext(ColumnIndex);
|
|
8750
8960
|
const slot = labels && (card === "title" || card === "action") ? card : void 0;
|
|
8751
8961
|
const shown = labels && !slot ? label != null ? label : col >= 0 ? labels[col] : void 0 : void 0;
|
|
8752
|
-
return /* @__PURE__ */
|
|
8962
|
+
return /* @__PURE__ */ React52.createElement(
|
|
8753
8963
|
"td",
|
|
8754
8964
|
{
|
|
8755
8965
|
ref,
|
|
@@ -8763,8 +8973,8 @@ var Td = React51.forwardRef(function Td2(props, ref) {
|
|
|
8763
8973
|
});
|
|
8764
8974
|
|
|
8765
8975
|
// src/BottomNav.tsx
|
|
8766
|
-
var
|
|
8767
|
-
var BottomNav =
|
|
8976
|
+
var React53 = __toESM(require("react"), 1);
|
|
8977
|
+
var BottomNav = React53.forwardRef(function BottomNav2(props, ref) {
|
|
8768
8978
|
const t = useStrings();
|
|
8769
8979
|
const Link = useLinkComponent(props.linkComponent);
|
|
8770
8980
|
const st = useMaybeControlled(
|
|
@@ -8774,7 +8984,7 @@ var BottomNav = React52.forwardRef(function BottomNav2(props, ref) {
|
|
|
8774
8984
|
);
|
|
8775
8985
|
const active = st[0];
|
|
8776
8986
|
const hide2 = props.hideFrom === false ? "always" : "below-" + (props.hideFrom || "lg");
|
|
8777
|
-
const own =
|
|
8987
|
+
const own = React53.useRef(null);
|
|
8778
8988
|
const hf = props.hideFrom === false ? null : props.hideFrom || "lg";
|
|
8779
8989
|
const away = useHideOnScroll(
|
|
8780
8990
|
!!props.hideOnScroll,
|
|
@@ -8782,7 +8992,7 @@ var BottomNav = React52.forwardRef(function BottomNav2(props, ref) {
|
|
|
8782
8992
|
hf ? "(max-width: " + (breakpoints[hf] - 0.02) + "px)" : "all",
|
|
8783
8993
|
64
|
|
8784
8994
|
);
|
|
8785
|
-
const setRef =
|
|
8995
|
+
const setRef = React53.useCallback(
|
|
8786
8996
|
function(el) {
|
|
8787
8997
|
own.current = el;
|
|
8788
8998
|
if (typeof ref === "function") ref(el);
|
|
@@ -8790,7 +9000,7 @@ var BottomNav = React52.forwardRef(function BottomNav2(props, ref) {
|
|
|
8790
9000
|
},
|
|
8791
9001
|
[ref]
|
|
8792
9002
|
);
|
|
8793
|
-
return /* @__PURE__ */
|
|
9003
|
+
return /* @__PURE__ */ React53.createElement(React53.Fragment, null, /* @__PURE__ */ React53.createElement("div", { className: cx("aura-bottomnav-spacer", "aura-bottomnav--" + hide2), "aria-hidden": "true" }), /* @__PURE__ */ React53.createElement(
|
|
8794
9004
|
"nav",
|
|
8795
9005
|
{
|
|
8796
9006
|
ref: setRef,
|
|
@@ -8803,7 +9013,7 @@ var BottomNav = React52.forwardRef(function BottomNav2(props, ref) {
|
|
|
8803
9013
|
),
|
|
8804
9014
|
"aria-label": props.label || t.mainNav
|
|
8805
9015
|
},
|
|
8806
|
-
/* @__PURE__ */
|
|
9016
|
+
/* @__PURE__ */ React53.createElement("ul", { className: "aura-bottomnav__list" }, props.items.map(function(it) {
|
|
8807
9017
|
if (it.ariaLabel && typeof it.label === "string" && it.ariaLabel.toLowerCase().indexOf(it.label.toLowerCase()) < 0)
|
|
8808
9018
|
devWarnOnce(
|
|
8809
9019
|
"bottomnav-label-" + it.id,
|
|
@@ -8824,23 +9034,23 @@ var BottomNav = React52.forwardRef(function BottomNav2(props, ref) {
|
|
|
8824
9034
|
}
|
|
8825
9035
|
};
|
|
8826
9036
|
const inner = [
|
|
8827
|
-
/* @__PURE__ */
|
|
8828
|
-
it.ariaLabel ? /* @__PURE__ */
|
|
8829
|
-
/* @__PURE__ */
|
|
8830
|
-
suffix && !it.ariaLabel ? /* @__PURE__ */
|
|
9037
|
+
/* @__PURE__ */ React53.createElement("span", { key: "i", className: "aura-bottomnav__icon" }, /* @__PURE__ */ React53.createElement(Icon, { name: it.icon, size: "md" }), count ? /* @__PURE__ */ React53.createElement("span", { className: "aura-bottomnav__count", "aria-hidden": "true" }, count) : it.badge ? /* @__PURE__ */ React53.createElement("span", { className: "aura-bottomnav__dot", "aria-hidden": "true" }) : null),
|
|
9038
|
+
it.ariaLabel ? /* @__PURE__ */ React53.createElement("span", { key: "n", className: "aura-sr-only" }, it.ariaLabel + suffix) : null,
|
|
9039
|
+
/* @__PURE__ */ React53.createElement("span", { key: "l", className: "aura-bottomnav__label", "aria-hidden": it.ariaLabel ? true : void 0 }, it.label),
|
|
9040
|
+
suffix && !it.ariaLabel ? /* @__PURE__ */ React53.createElement("span", { key: "s", className: "aura-sr-only" }, suffix) : null
|
|
8831
9041
|
];
|
|
8832
|
-
return /* @__PURE__ */
|
|
9042
|
+
return /* @__PURE__ */ React53.createElement("li", { key: it.id, className: "aura-bottomnav__cell" }, it.href ? /* @__PURE__ */ React53.createElement(Link, { href: it.href, ...common }, inner) : /* @__PURE__ */ React53.createElement("button", { type: "button", ...common }, inner));
|
|
8833
9043
|
}))
|
|
8834
9044
|
));
|
|
8835
9045
|
});
|
|
8836
9046
|
|
|
8837
9047
|
// src/Surface.tsx
|
|
8838
|
-
var
|
|
8839
|
-
var
|
|
8840
|
-
var Surface =
|
|
9048
|
+
var React54 = __toESM(require("react"), 1);
|
|
9049
|
+
var h11 = React54.createElement;
|
|
9050
|
+
var Surface = React54.forwardRef(function Surface2(props, ref) {
|
|
8841
9051
|
const t = props.texture || "mesh";
|
|
8842
9052
|
const rest = omit(props, ["texture", "className", "children", "as"]);
|
|
8843
|
-
return
|
|
9053
|
+
return h11(
|
|
8844
9054
|
props.as || "div",
|
|
8845
9055
|
Object.assign({}, rest, {
|
|
8846
9056
|
ref,
|
|
@@ -8858,14 +9068,14 @@ var Surface = React53.forwardRef(function Surface2(props, ref) {
|
|
|
8858
9068
|
});
|
|
8859
9069
|
|
|
8860
9070
|
// src/Stat.tsx
|
|
8861
|
-
var
|
|
8862
|
-
var Stat =
|
|
9071
|
+
var React55 = __toESM(require("react"), 1);
|
|
9072
|
+
var Stat = React55.forwardRef(function Stat2(props, ref) {
|
|
8863
9073
|
const Link = useLinkComponent(props.linkComponent);
|
|
8864
9074
|
return statElement(props, ref, Link);
|
|
8865
9075
|
});
|
|
8866
9076
|
|
|
8867
9077
|
// src/TimePicker.tsx
|
|
8868
|
-
var
|
|
9078
|
+
var React56 = __toESM(require("react"), 1);
|
|
8869
9079
|
var import_react_dom12 = require("react-dom");
|
|
8870
9080
|
|
|
8871
9081
|
// src/text.ts
|
|
@@ -8907,7 +9117,7 @@ function toMin(t) {
|
|
|
8907
9117
|
function fromMin(n3) {
|
|
8908
9118
|
return pad3(Math.floor(n3 / 60)) + ":" + pad3(n3 % 60);
|
|
8909
9119
|
}
|
|
8910
|
-
var TimePicker =
|
|
9120
|
+
var TimePicker = React56.forwardRef(function TimePicker2(props, ref) {
|
|
8911
9121
|
const t = useStrings();
|
|
8912
9122
|
const auto = uid(), id = props.id || auto, listId = id + "-list";
|
|
8913
9123
|
const st = useMaybeControlled(
|
|
@@ -8917,7 +9127,7 @@ var TimePicker = React55.forwardRef(function TimePicker2(props, ref) {
|
|
|
8917
9127
|
);
|
|
8918
9128
|
const value = st[0];
|
|
8919
9129
|
const step = props.step || 30, lo = toMin(props.min) != null ? toMin(props.min) : 0, hi = toMin(props.max) != null ? toMin(props.max) : 24 * 60 - 1;
|
|
8920
|
-
const slots =
|
|
9130
|
+
const slots = React56.useMemo(
|
|
8921
9131
|
function() {
|
|
8922
9132
|
const out = [];
|
|
8923
9133
|
for (let m = lo; m <= hi; m += step) out.push(fromMin(m));
|
|
@@ -8929,12 +9139,12 @@ var TimePicker = React55.forwardRef(function TimePicker2(props, ref) {
|
|
|
8929
9139
|
const n3 = toMin(v);
|
|
8930
9140
|
return n3 == null || n3 < lo || n3 > hi || props.isTimeDisabled && props.isTimeDisabled(v);
|
|
8931
9141
|
}
|
|
8932
|
-
const openState =
|
|
8933
|
-
const editState =
|
|
8934
|
-
const aState =
|
|
8935
|
-
const errState =
|
|
8936
|
-
const pos =
|
|
8937
|
-
const boxRef =
|
|
9142
|
+
const openState = React56.useState(false), open = openState[0], setOpen = openState[1];
|
|
9143
|
+
const editState = React56.useState(null), editing = editState[0], setEditing = editState[1];
|
|
9144
|
+
const aState = React56.useState(0), active = aState[0], setActive = aState[1];
|
|
9145
|
+
const errState = React56.useState(null);
|
|
9146
|
+
const pos = React56.useState(null);
|
|
9147
|
+
const boxRef = React56.useRef(null), inputRef = React56.useRef(null), listRef = React56.useRef(null), inputMerged = useMergedRef(ref, inputRef);
|
|
8938
9148
|
const mounted = useMounted();
|
|
8939
9149
|
function nearest(v) {
|
|
8940
9150
|
const n3 = toMin(v);
|
|
@@ -8962,7 +9172,7 @@ var TimePicker = React55.forwardRef(function TimePicker2(props, ref) {
|
|
|
8962
9172
|
},
|
|
8963
9173
|
[open]
|
|
8964
9174
|
);
|
|
8965
|
-
|
|
9175
|
+
React56.useEffect(
|
|
8966
9176
|
function() {
|
|
8967
9177
|
if (!open) return;
|
|
8968
9178
|
function outside(e) {
|
|
@@ -8984,7 +9194,7 @@ var TimePicker = React55.forwardRef(function TimePicker2(props, ref) {
|
|
|
8984
9194
|
},
|
|
8985
9195
|
[open]
|
|
8986
9196
|
);
|
|
8987
|
-
|
|
9197
|
+
React56.useEffect(
|
|
8988
9198
|
function() {
|
|
8989
9199
|
if (!open || !listRef.current) return;
|
|
8990
9200
|
const el = listRef.current.querySelector('[data-idx="' + active + '"]');
|
|
@@ -9083,9 +9293,9 @@ var TimePicker = React55.forwardRef(function TimePicker2(props, ref) {
|
|
|
9083
9293
|
}
|
|
9084
9294
|
const error = errState[0] || props.error;
|
|
9085
9295
|
const list = open && mounted && pos[0] ? (0, import_react_dom12.createPortal)(
|
|
9086
|
-
/* @__PURE__ */
|
|
9296
|
+
/* @__PURE__ */ React56.createElement("div", { ref: listRef, className: "aura-combo__popover aura-time__popover", style: pos[0] }, /* @__PURE__ */ React56.createElement("ul", { id: listId, role: "listbox", "aria-label": props.label, className: "aura-combo__list" }, slots.map(function(s, i) {
|
|
9087
9297
|
const dis = blocked(s), sel = s === value;
|
|
9088
|
-
return /* @__PURE__ */
|
|
9298
|
+
return /* @__PURE__ */ React56.createElement(
|
|
9089
9299
|
"li",
|
|
9090
9300
|
{
|
|
9091
9301
|
key: s,
|
|
@@ -9110,13 +9320,13 @@ var TimePicker = React55.forwardRef(function TimePicker2(props, ref) {
|
|
|
9110
9320
|
if (active !== i) setActive(i);
|
|
9111
9321
|
}
|
|
9112
9322
|
},
|
|
9113
|
-
/* @__PURE__ */
|
|
9114
|
-
sel ? /* @__PURE__ */
|
|
9323
|
+
/* @__PURE__ */ React56.createElement("span", { className: "aura-combo__label" }, s),
|
|
9324
|
+
sel ? /* @__PURE__ */ React56.createElement(Icon, { name: /* @__PURE__ */ React56.createElement(IconCheck, null), className: "aura-combo__check" }) : null
|
|
9115
9325
|
);
|
|
9116
9326
|
}))),
|
|
9117
9327
|
document.body
|
|
9118
9328
|
) : null;
|
|
9119
|
-
return /* @__PURE__ */
|
|
9329
|
+
return /* @__PURE__ */ React56.createElement(
|
|
9120
9330
|
Field,
|
|
9121
9331
|
{
|
|
9122
9332
|
id,
|
|
@@ -9128,7 +9338,7 @@ var TimePicker = React55.forwardRef(function TimePicker2(props, ref) {
|
|
|
9128
9338
|
disabled: props.disabled,
|
|
9129
9339
|
className: cx(touchClass(props.touchHeight), props.className)
|
|
9130
9340
|
},
|
|
9131
|
-
/* @__PURE__ */
|
|
9341
|
+
/* @__PURE__ */ React56.createElement("div", { ref: boxRef, className: cx("aura-input aura-combo aura-time has-icon", open && "is-open") }, /* @__PURE__ */ React56.createElement(Icon, { name: /* @__PURE__ */ React56.createElement(IconClock, null), className: "aura-input__icon" }), /* @__PURE__ */ React56.createElement(
|
|
9132
9342
|
"input",
|
|
9133
9343
|
{
|
|
9134
9344
|
ref: inputMerged,
|
|
@@ -9168,7 +9378,7 @@ var TimePicker = React55.forwardRef(function TimePicker2(props, ref) {
|
|
|
9168
9378
|
}, 0);
|
|
9169
9379
|
}
|
|
9170
9380
|
}
|
|
9171
|
-
), props.clearable !== false && value != null && !props.disabled ? /* @__PURE__ */
|
|
9381
|
+
), props.clearable !== false && value != null && !props.disabled ? /* @__PURE__ */ React56.createElement(
|
|
9172
9382
|
"button",
|
|
9173
9383
|
{
|
|
9174
9384
|
type: "button",
|
|
@@ -9181,8 +9391,8 @@ var TimePicker = React55.forwardRef(function TimePicker2(props, ref) {
|
|
|
9181
9391
|
if (inputRef.current) inputRef.current.focus();
|
|
9182
9392
|
}
|
|
9183
9393
|
},
|
|
9184
|
-
/* @__PURE__ */
|
|
9185
|
-
) : null, /* @__PURE__ */
|
|
9394
|
+
/* @__PURE__ */ React56.createElement(Icon, { name: /* @__PURE__ */ React56.createElement(IconX, null) })
|
|
9395
|
+
) : null, /* @__PURE__ */ React56.createElement(
|
|
9186
9396
|
"button",
|
|
9187
9397
|
{
|
|
9188
9398
|
type: "button",
|
|
@@ -9200,14 +9410,14 @@ var TimePicker = React55.forwardRef(function TimePicker2(props, ref) {
|
|
|
9200
9410
|
}
|
|
9201
9411
|
}
|
|
9202
9412
|
},
|
|
9203
|
-
/* @__PURE__ */
|
|
9413
|
+
/* @__PURE__ */ React56.createElement(Icon, { name: /* @__PURE__ */ React56.createElement(IconChevronDown, null) })
|
|
9204
9414
|
)),
|
|
9205
9415
|
list
|
|
9206
9416
|
);
|
|
9207
9417
|
});
|
|
9208
9418
|
|
|
9209
9419
|
// src/FileUpload.tsx
|
|
9210
|
-
var
|
|
9420
|
+
var React57 = __toESM(require("react"), 1);
|
|
9211
9421
|
function matches(file, accept) {
|
|
9212
9422
|
if (!accept) return true;
|
|
9213
9423
|
const name = (file.name || "").toLowerCase(), type = (file.type || "").toLowerCase();
|
|
@@ -9231,24 +9441,24 @@ function describeAccept(accept, t) {
|
|
|
9231
9441
|
}).join(", ");
|
|
9232
9442
|
}
|
|
9233
9443
|
var seq = 0;
|
|
9234
|
-
var FileUpload =
|
|
9444
|
+
var FileUpload = React57.forwardRef(function FileUpload2(props, ref) {
|
|
9235
9445
|
const t = useStrings();
|
|
9236
9446
|
const auto = uid(), id = props.id || auto;
|
|
9237
9447
|
const st = useMaybeControlled(props.value, props.defaultValue || [], props.onChange);
|
|
9238
9448
|
const items2 = st[0] || [];
|
|
9239
|
-
const dragState =
|
|
9240
|
-
const inputRef =
|
|
9241
|
-
const urls =
|
|
9449
|
+
const dragState = React57.useState(false), over = dragState[0];
|
|
9450
|
+
const inputRef = React57.useRef(null), inputMerged = useMergedRef(ref, inputRef);
|
|
9451
|
+
const urls = React57.useRef({});
|
|
9242
9452
|
const maxFiles = props.multiple ? props.maxFiles : 1;
|
|
9243
9453
|
const note = t.accepts(describeAccept(props.accept, t), props.maxSize ? formatBytes(props.maxSize) : "");
|
|
9244
|
-
|
|
9454
|
+
React57.useEffect(function() {
|
|
9245
9455
|
return function() {
|
|
9246
9456
|
Object.keys(urls.current).forEach(function(k) {
|
|
9247
9457
|
URL.revokeObjectURL(urls.current[k]);
|
|
9248
9458
|
});
|
|
9249
9459
|
};
|
|
9250
9460
|
}, []);
|
|
9251
|
-
|
|
9461
|
+
React57.useEffect(
|
|
9252
9462
|
function() {
|
|
9253
9463
|
const el = inputRef.current;
|
|
9254
9464
|
if (!el || !props.name || typeof DataTransfer === "undefined") return;
|
|
@@ -9308,7 +9518,7 @@ var FileUpload = React56.forwardRef(function FileUpload2(props, ref) {
|
|
|
9308
9518
|
if (inputRef.current) inputRef.current.focus();
|
|
9309
9519
|
}
|
|
9310
9520
|
const error = props.error;
|
|
9311
|
-
return /* @__PURE__ */
|
|
9521
|
+
return /* @__PURE__ */ React57.createElement(
|
|
9312
9522
|
Field,
|
|
9313
9523
|
{
|
|
9314
9524
|
id,
|
|
@@ -9320,7 +9530,7 @@ var FileUpload = React56.forwardRef(function FileUpload2(props, ref) {
|
|
|
9320
9530
|
disabled: props.disabled,
|
|
9321
9531
|
className: props.className
|
|
9322
9532
|
},
|
|
9323
|
-
/* @__PURE__ */
|
|
9533
|
+
/* @__PURE__ */ React57.createElement(
|
|
9324
9534
|
"div",
|
|
9325
9535
|
{
|
|
9326
9536
|
className: cx("aura-upload", over && "is-over", props.disabled && "is-disabled", error && "is-invalid"),
|
|
@@ -9341,9 +9551,9 @@ var FileUpload = React56.forwardRef(function FileUpload2(props, ref) {
|
|
|
9341
9551
|
add(e.dataTransfer && e.dataTransfer.files);
|
|
9342
9552
|
}
|
|
9343
9553
|
},
|
|
9344
|
-
/* @__PURE__ */
|
|
9345
|
-
/* @__PURE__ */
|
|
9346
|
-
/* @__PURE__ */
|
|
9554
|
+
/* @__PURE__ */ React57.createElement(Icon, { name: /* @__PURE__ */ React57.createElement(IconCloudUpload, null), size: "lg", className: "aura-upload__icon" }),
|
|
9555
|
+
/* @__PURE__ */ React57.createElement("span", { className: "aura-upload__text" }, t.dropFiles, " "),
|
|
9556
|
+
/* @__PURE__ */ React57.createElement(
|
|
9347
9557
|
"input",
|
|
9348
9558
|
{
|
|
9349
9559
|
ref: inputMerged,
|
|
@@ -9365,12 +9575,12 @@ var FileUpload = React56.forwardRef(function FileUpload2(props, ref) {
|
|
|
9365
9575
|
}
|
|
9366
9576
|
}
|
|
9367
9577
|
),
|
|
9368
|
-
/* @__PURE__ */
|
|
9369
|
-
note ? /* @__PURE__ */
|
|
9578
|
+
/* @__PURE__ */ React57.createElement("span", { className: "aura-upload__browse", "aria-hidden": true }, props.multiple ? t.browse : t.browseOne),
|
|
9579
|
+
note ? /* @__PURE__ */ React57.createElement("span", { className: "aura-upload__note", id: id + "-note" }, note) : null
|
|
9370
9580
|
),
|
|
9371
|
-
items2.length ? /* @__PURE__ */
|
|
9581
|
+
items2.length ? /* @__PURE__ */ React57.createElement("ul", { className: "aura-upload__list", "aria-live": "polite" }, items2.map(function(it) {
|
|
9372
9582
|
const src = thumb(it);
|
|
9373
|
-
return /* @__PURE__ */
|
|
9583
|
+
return /* @__PURE__ */ React57.createElement("li", { key: it.id, className: cx("aura-upload__item", it.error && "is-error") }, src ? /* @__PURE__ */ React57.createElement("img", { className: "aura-upload__thumb", src, alt: "" }) : /* @__PURE__ */ React57.createElement("span", { className: "aura-upload__thumb is-icon", "aria-hidden": true }, /* @__PURE__ */ React57.createElement(Icon, { name: /^image\//.test(it.type || "") ? /* @__PURE__ */ React57.createElement(IconImage, null) : /* @__PURE__ */ React57.createElement(IconFile, null), size: "md" })), /* @__PURE__ */ React57.createElement("span", { className: "aura-upload__meta" }, it.url && !it.error ? /* @__PURE__ */ React57.createElement("a", { className: "aura-upload__name", href: it.url, target: "_blank", rel: "noreferrer" }, it.name) : /* @__PURE__ */ React57.createElement("span", { className: "aura-upload__name" }, it.name), /* @__PURE__ */ React57.createElement("span", { className: "aura-upload__sub" }, it.error ? /* @__PURE__ */ React57.createElement(React57.Fragment, null, /* @__PURE__ */ React57.createElement(Icon, { name: /* @__PURE__ */ React57.createElement(IconCircleAlert, null), size: 12 }), it.error) : it.status === "uploading" ? t.uploading + (it.progress != null ? " " + Math.round(it.progress) + "%" : "") : it.status === "done" ? /* @__PURE__ */ React57.createElement(React57.Fragment, null, /* @__PURE__ */ React57.createElement(Icon, { name: /* @__PURE__ */ React57.createElement(IconCircleCheck, null), size: 12 }), formatBytes(it.size)) : formatBytes(it.size)), it.status === "uploading" ? /* @__PURE__ */ React57.createElement(
|
|
9374
9584
|
"span",
|
|
9375
9585
|
{
|
|
9376
9586
|
className: "aura-upload__bar",
|
|
@@ -9380,11 +9590,11 @@ var FileUpload = React56.forwardRef(function FileUpload2(props, ref) {
|
|
|
9380
9590
|
"aria-valuemax": 100,
|
|
9381
9591
|
"aria-valuenow": it.progress != null ? Math.round(it.progress) : void 0
|
|
9382
9592
|
},
|
|
9383
|
-
/* @__PURE__ */
|
|
9384
|
-
) : null), /* @__PURE__ */
|
|
9593
|
+
/* @__PURE__ */ React57.createElement("span", { style: { width: (it.progress || 0) + "%" } })
|
|
9594
|
+
) : null), /* @__PURE__ */ React57.createElement(
|
|
9385
9595
|
IconButton,
|
|
9386
9596
|
{
|
|
9387
|
-
icon: /* @__PURE__ */
|
|
9597
|
+
icon: /* @__PURE__ */ React57.createElement(IconX, null),
|
|
9388
9598
|
label: t.remove(it.name),
|
|
9389
9599
|
onClick: function() {
|
|
9390
9600
|
remove(it);
|
|
@@ -9397,14 +9607,14 @@ var FileUpload = React56.forwardRef(function FileUpload2(props, ref) {
|
|
|
9397
9607
|
|
|
9398
9608
|
// src/theme.ts
|
|
9399
9609
|
function hexToRgb(hex) {
|
|
9400
|
-
let
|
|
9401
|
-
if (
|
|
9402
|
-
|
|
9610
|
+
let h12 = String(hex).trim().replace("#", "");
|
|
9611
|
+
if (h12.length === 3)
|
|
9612
|
+
h12 = h12.split("").map(function(c) {
|
|
9403
9613
|
return c + c;
|
|
9404
9614
|
}).join("");
|
|
9405
|
-
if (!/^[0-9a-f]{6}$/i.test(
|
|
9615
|
+
if (!/^[0-9a-f]{6}$/i.test(h12)) throw new Error('createTheme: "' + hex + '" is not a #rgb or #rrggbb colour');
|
|
9406
9616
|
return [0, 2, 4].map(function(i) {
|
|
9407
|
-
return parseInt(
|
|
9617
|
+
return parseInt(h12.slice(i, i + 2), 16) / 255;
|
|
9408
9618
|
});
|
|
9409
9619
|
}
|
|
9410
9620
|
function rgbToHex(rgb) {
|
|
@@ -9700,9 +9910,9 @@ function createTheme(opts) {
|
|
|
9700
9910
|
}
|
|
9701
9911
|
|
|
9702
9912
|
// src/ThemeStyle.tsx
|
|
9703
|
-
var
|
|
9913
|
+
var React58 = __toESM(require("react"), 1);
|
|
9704
9914
|
function ThemeStyle(props) {
|
|
9705
|
-
const css =
|
|
9915
|
+
const css = React58.useMemo(
|
|
9706
9916
|
function() {
|
|
9707
9917
|
try {
|
|
9708
9918
|
return createTheme({
|
|
@@ -9719,11 +9929,11 @@ function ThemeStyle(props) {
|
|
|
9719
9929
|
[props.brand, props.signal, props.primary, props.name, props.selector]
|
|
9720
9930
|
);
|
|
9721
9931
|
if (css === null) return null;
|
|
9722
|
-
return /* @__PURE__ */
|
|
9932
|
+
return /* @__PURE__ */ React58.createElement("style", { "data-aura-theme": props.name || props.brand, dangerouslySetInnerHTML: { __html: css } });
|
|
9723
9933
|
}
|
|
9724
9934
|
|
|
9725
9935
|
// src/colorScheme.tsx
|
|
9726
|
-
var
|
|
9936
|
+
var React59 = __toESM(require("react"), 1);
|
|
9727
9937
|
|
|
9728
9938
|
// src/colorSchemeScript.ts
|
|
9729
9939
|
var DEFAULT_KEY = "aura-color-scheme";
|
|
@@ -9740,7 +9950,7 @@ function colorSchemeScript(options) {
|
|
|
9740
9950
|
|
|
9741
9951
|
// src/colorScheme.tsx
|
|
9742
9952
|
function ColorSchemeScript(props) {
|
|
9743
|
-
return /* @__PURE__ */
|
|
9953
|
+
return /* @__PURE__ */ React59.createElement(
|
|
9744
9954
|
"script",
|
|
9745
9955
|
{
|
|
9746
9956
|
"data-aura-color-scheme": "",
|
|
@@ -9765,7 +9975,7 @@ function apply(scheme) {
|
|
|
9765
9975
|
function useColorScheme(options) {
|
|
9766
9976
|
const key = options && options.storageKey || DEFAULT_KEY;
|
|
9767
9977
|
const fallback = options && options.defaultScheme || "system";
|
|
9768
|
-
const subscribe2 =
|
|
9978
|
+
const subscribe2 = React59.useCallback(
|
|
9769
9979
|
function(cb) {
|
|
9770
9980
|
const mq = window.matchMedia ? window.matchMedia("(prefers-color-scheme: dark)") : null;
|
|
9771
9981
|
function onSystem() {
|
|
@@ -9787,7 +9997,7 @@ function useColorScheme(options) {
|
|
|
9787
9997
|
},
|
|
9788
9998
|
[fallback, key]
|
|
9789
9999
|
);
|
|
9790
|
-
const snapshot =
|
|
10000
|
+
const snapshot = React59.useSyncExternalStore(
|
|
9791
10001
|
subscribe2,
|
|
9792
10002
|
function() {
|
|
9793
10003
|
const s = readScheme(fallback);
|
|
@@ -9798,7 +10008,7 @@ function useColorScheme(options) {
|
|
|
9798
10008
|
}
|
|
9799
10009
|
);
|
|
9800
10010
|
const parts = snapshot.split("|");
|
|
9801
|
-
const setScheme =
|
|
10011
|
+
const setScheme = React59.useCallback(
|
|
9802
10012
|
function(next) {
|
|
9803
10013
|
if (!valid(next)) return;
|
|
9804
10014
|
try {
|
|
@@ -9817,14 +10027,14 @@ function ColorSchemeToggle(props) {
|
|
|
9817
10027
|
const cs = useColorScheme(props);
|
|
9818
10028
|
const names = { light: t.schemeLight, dark: t.schemeDark, system: t.schemeSystem };
|
|
9819
10029
|
const label = props.label || t.colorScheme;
|
|
9820
|
-
return /* @__PURE__ */
|
|
10030
|
+
return /* @__PURE__ */ React59.createElement(
|
|
9821
10031
|
DropdownMenu,
|
|
9822
10032
|
{
|
|
9823
10033
|
label,
|
|
9824
|
-
trigger: /* @__PURE__ */
|
|
10034
|
+
trigger: /* @__PURE__ */ React59.createElement(
|
|
9825
10035
|
IconButton,
|
|
9826
10036
|
{
|
|
9827
|
-
icon: cs.resolved === "dark" ? /* @__PURE__ */
|
|
10037
|
+
icon: cs.resolved === "dark" ? /* @__PURE__ */ React59.createElement(IconMoon, null) : /* @__PURE__ */ React59.createElement(IconSun, null),
|
|
9828
10038
|
label: label + ": " + names[cs.scheme]
|
|
9829
10039
|
}
|
|
9830
10040
|
),
|
|
@@ -9842,14 +10052,14 @@ function ColorSchemeToggle(props) {
|
|
|
9842
10052
|
}
|
|
9843
10053
|
|
|
9844
10054
|
// src/Badge.tsx
|
|
9845
|
-
var
|
|
9846
|
-
var Badge =
|
|
10055
|
+
var React60 = __toESM(require("react"), 1);
|
|
10056
|
+
var Badge = React60.forwardRef(function Badge2(props, ref) {
|
|
9847
10057
|
return badgeElement(props, ref);
|
|
9848
10058
|
});
|
|
9849
10059
|
|
|
9850
10060
|
// src/Progress.tsx
|
|
9851
|
-
var
|
|
9852
|
-
var Progress =
|
|
10061
|
+
var React61 = __toESM(require("react"), 1);
|
|
10062
|
+
var Progress = React61.forwardRef(function Progress2(props, ref) {
|
|
9853
10063
|
const t = useStrings();
|
|
9854
10064
|
const auto = uid(), id = props.id || auto;
|
|
9855
10065
|
const max = props.max || 100, det = props.value != null;
|
|
@@ -9858,7 +10068,7 @@ var Progress = React60.forwardRef(function Progress2(props, ref) {
|
|
|
9858
10068
|
const spct = sec ? Math.max(0, Math.min(100 - pct, sec / max * 100)) : 0;
|
|
9859
10069
|
const valueText = props.valueText != null ? props.valueText : props.valueLabel != null ? String(props.valueLabel) : sec ? t.progressReserved(props.value, sec, max) : void 0;
|
|
9860
10070
|
const shown = props.valueLabel != null ? props.valueLabel : det ? Math.round(pct) + "%" : null;
|
|
9861
|
-
return /* @__PURE__ */
|
|
10071
|
+
return /* @__PURE__ */ React61.createElement(
|
|
9862
10072
|
"div",
|
|
9863
10073
|
{
|
|
9864
10074
|
ref,
|
|
@@ -9869,8 +10079,8 @@ var Progress = React60.forwardRef(function Progress2(props, ref) {
|
|
|
9869
10079
|
props.className
|
|
9870
10080
|
)
|
|
9871
10081
|
},
|
|
9872
|
-
props.label || props.showValue && shown ? /* @__PURE__ */
|
|
9873
|
-
/* @__PURE__ */
|
|
10082
|
+
props.label || props.showValue && shown ? /* @__PURE__ */ React61.createElement("div", { className: "aura-progress__head" }, props.label ? /* @__PURE__ */ React61.createElement("span", { className: "aura-progress__label", id: id + "-label" }, props.label) : /* @__PURE__ */ React61.createElement("span", null), props.showValue && shown ? /* @__PURE__ */ React61.createElement("span", { className: "aura-progress__value" }, shown) : null) : null,
|
|
10083
|
+
/* @__PURE__ */ React61.createElement(
|
|
9874
10084
|
"div",
|
|
9875
10085
|
{
|
|
9876
10086
|
className: cx("aura-progress__track", !det && "is-indeterminate"),
|
|
@@ -9882,8 +10092,8 @@ var Progress = React60.forwardRef(function Progress2(props, ref) {
|
|
|
9882
10092
|
"aria-valuenow": det ? props.value : void 0,
|
|
9883
10093
|
"aria-valuetext": det ? valueText : void 0
|
|
9884
10094
|
},
|
|
9885
|
-
/* @__PURE__ */
|
|
9886
|
-
sec ? /* @__PURE__ */
|
|
10095
|
+
/* @__PURE__ */ React61.createElement("span", { className: "aura-progress__bar", style: det ? { width: pct + "%" } : void 0 }),
|
|
10096
|
+
sec ? /* @__PURE__ */ React61.createElement(
|
|
9887
10097
|
"span",
|
|
9888
10098
|
{
|
|
9889
10099
|
className: "aura-progress__bar aura-progress__bar--reserved",
|
|
@@ -9891,19 +10101,19 @@ var Progress = React60.forwardRef(function Progress2(props, ref) {
|
|
|
9891
10101
|
}
|
|
9892
10102
|
) : null
|
|
9893
10103
|
),
|
|
9894
|
-
props.hint ? /* @__PURE__ */
|
|
10104
|
+
props.hint ? /* @__PURE__ */ React61.createElement("p", { className: "aura-progress__hint" }, props.hint) : null
|
|
9895
10105
|
);
|
|
9896
10106
|
});
|
|
9897
10107
|
|
|
9898
10108
|
// src/Skeleton.tsx
|
|
9899
|
-
var
|
|
9900
|
-
var Skeleton =
|
|
10109
|
+
var React62 = __toESM(require("react"), 1);
|
|
10110
|
+
var Skeleton = React62.forwardRef(function Skeleton2(props, ref) {
|
|
9901
10111
|
const v = props.variant || "text";
|
|
9902
10112
|
if (v === "text" && (props.lines || 1) > 1) {
|
|
9903
10113
|
const n3 = props.lines, rows = [];
|
|
9904
10114
|
for (let i = 0; i < n3; i++)
|
|
9905
|
-
rows.push(/* @__PURE__ */
|
|
9906
|
-
return /* @__PURE__ */
|
|
10115
|
+
rows.push(/* @__PURE__ */ React62.createElement("span", { key: i, className: "aura-skel aura-skel--text", style: { width: i === n3 - 1 ? "60%" : "100%" } }));
|
|
10116
|
+
return /* @__PURE__ */ React62.createElement(
|
|
9907
10117
|
"span",
|
|
9908
10118
|
{
|
|
9909
10119
|
ref,
|
|
@@ -9921,17 +10131,17 @@ var Skeleton = React61.forwardRef(function Skeleton2(props, ref) {
|
|
|
9921
10131
|
if (v === "circle") {
|
|
9922
10132
|
style.width = style.height = props.size || props.width || 40;
|
|
9923
10133
|
}
|
|
9924
|
-
return /* @__PURE__ */
|
|
10134
|
+
return /* @__PURE__ */ React62.createElement("span", { ref, "aria-hidden": true, className: cx("aura-skel", "aura-skel--" + v, props.className), style });
|
|
9925
10135
|
});
|
|
9926
10136
|
|
|
9927
10137
|
// src/EmptyState.tsx
|
|
9928
|
-
var
|
|
9929
|
-
var EmptyState =
|
|
10138
|
+
var React63 = __toESM(require("react"), 1);
|
|
10139
|
+
var EmptyState = React63.forwardRef(function EmptyState2(props, ref) {
|
|
9930
10140
|
return emptyStateElement(props, ref);
|
|
9931
10141
|
});
|
|
9932
10142
|
|
|
9933
10143
|
// src/Pagination.tsx
|
|
9934
|
-
var
|
|
10144
|
+
var React64 = __toESM(require("react"), 1);
|
|
9935
10145
|
function pageList(page, count, sib) {
|
|
9936
10146
|
let out = [], lo = Math.max(2, page - sib), hi = Math.min(count - 1, page + sib);
|
|
9937
10147
|
if (page - sib <= 3) {
|
|
@@ -9951,7 +10161,7 @@ function pageList(page, count, sib) {
|
|
|
9951
10161
|
if (count > 1) out.push(count);
|
|
9952
10162
|
return out;
|
|
9953
10163
|
}
|
|
9954
|
-
var Pagination =
|
|
10164
|
+
var Pagination = React64.forwardRef(function Pagination2(props, ref) {
|
|
9955
10165
|
const t = useStrings();
|
|
9956
10166
|
useAutoTip();
|
|
9957
10167
|
const count = Math.max(1, props.pageCount || 1);
|
|
@@ -9971,7 +10181,7 @@ var Pagination = React63.forwardRef(function Pagination2(props, ref) {
|
|
|
9971
10181
|
},
|
|
9972
10182
|
extra
|
|
9973
10183
|
);
|
|
9974
|
-
return link ? /* @__PURE__ */
|
|
10184
|
+
return link ? /* @__PURE__ */ React64.createElement(
|
|
9975
10185
|
Link,
|
|
9976
10186
|
{
|
|
9977
10187
|
href: link(p),
|
|
@@ -9984,7 +10194,7 @@ var Pagination = React63.forwardRef(function Pagination2(props, ref) {
|
|
|
9984
10194
|
...common
|
|
9985
10195
|
},
|
|
9986
10196
|
label
|
|
9987
|
-
) : /* @__PURE__ */
|
|
10197
|
+
) : /* @__PURE__ */ React64.createElement(
|
|
9988
10198
|
"button",
|
|
9989
10199
|
{
|
|
9990
10200
|
type: "button",
|
|
@@ -9998,7 +10208,7 @@ var Pagination = React63.forwardRef(function Pagination2(props, ref) {
|
|
|
9998
10208
|
}
|
|
9999
10209
|
function arrow(p, icon, label, rel, disabled) {
|
|
10000
10210
|
if (!link || disabled)
|
|
10001
|
-
return /* @__PURE__ */
|
|
10211
|
+
return /* @__PURE__ */ React64.createElement(
|
|
10002
10212
|
IconButton,
|
|
10003
10213
|
{
|
|
10004
10214
|
icon,
|
|
@@ -10009,7 +10219,7 @@ var Pagination = React63.forwardRef(function Pagination2(props, ref) {
|
|
|
10009
10219
|
}
|
|
10010
10220
|
}
|
|
10011
10221
|
);
|
|
10012
|
-
return /* @__PURE__ */
|
|
10222
|
+
return /* @__PURE__ */ React64.createElement(
|
|
10013
10223
|
Link,
|
|
10014
10224
|
{
|
|
10015
10225
|
href: link(p),
|
|
@@ -10024,17 +10234,17 @@ var Pagination = React63.forwardRef(function Pagination2(props, ref) {
|
|
|
10024
10234
|
}
|
|
10025
10235
|
}
|
|
10026
10236
|
},
|
|
10027
|
-
/* @__PURE__ */
|
|
10237
|
+
/* @__PURE__ */ React64.createElement(Icon, { name: icon, size: "sm" })
|
|
10028
10238
|
);
|
|
10029
10239
|
}
|
|
10030
|
-
return /* @__PURE__ */
|
|
10031
|
-
return typeof p === "number" ? /* @__PURE__ */
|
|
10032
|
-
})), /* @__PURE__ */
|
|
10240
|
+
return /* @__PURE__ */ React64.createElement("nav", { ref, className: cx("aura-pagination", props.className), "aria-label": props.label || t.pagination }, arrow(page - 1, /* @__PURE__ */ React64.createElement(IconChevronLeft, null), t.prevPage, "prev", page <= 1), /* @__PURE__ */ React64.createElement("ol", { className: "aura-pagination__list" }, pageList(page, count, props.siblingCount == null ? 1 : props.siblingCount).map(function(p) {
|
|
10241
|
+
return typeof p === "number" ? /* @__PURE__ */ React64.createElement("li", { key: p }, item(p, p)) : /* @__PURE__ */ React64.createElement("li", { key: p, className: "aura-pagination__gap", "aria-hidden": true }, "\u2026");
|
|
10242
|
+
})), /* @__PURE__ */ React64.createElement("span", { className: "aura-pagination__compact", "aria-hidden": true }, t.page(page, count)), arrow(page + 1, /* @__PURE__ */ React64.createElement(IconChevronRight, null), t.nextPage, "next", page >= count));
|
|
10033
10243
|
});
|
|
10034
10244
|
|
|
10035
10245
|
// src/Accordion.tsx
|
|
10036
|
-
var
|
|
10037
|
-
var Accordion =
|
|
10246
|
+
var React65 = __toESM(require("react"), 1);
|
|
10247
|
+
var Accordion = React65.forwardRef(function Accordion2(props, ref) {
|
|
10038
10248
|
const auto = uid(), base = props.id || auto;
|
|
10039
10249
|
const multiple = props.type === "multiple";
|
|
10040
10250
|
const st = useMaybeControlled(
|
|
@@ -10072,9 +10282,9 @@ var Accordion = React64.forwardRef(function Accordion2(props, ref) {
|
|
|
10072
10282
|
n3.focus();
|
|
10073
10283
|
}
|
|
10074
10284
|
}
|
|
10075
|
-
return /* @__PURE__ */
|
|
10285
|
+
return /* @__PURE__ */ React65.createElement("div", { ref, className: cx("aura-accordion", props.className), onKeyDown: onKey }, items2.map(function(it) {
|
|
10076
10286
|
const on = open.indexOf(it.id) >= 0, bid = base + "-btn-" + it.id, pid = base + "-panel-" + it.id;
|
|
10077
|
-
return /* @__PURE__ */
|
|
10287
|
+
return /* @__PURE__ */ React65.createElement("div", { key: it.id, className: cx("aura-accordion__item", on && "is-open") }, /* @__PURE__ */ React65.createElement(HT, { className: "aura-accordion__heading" }, /* @__PURE__ */ React65.createElement(
|
|
10078
10288
|
"button",
|
|
10079
10289
|
{
|
|
10080
10290
|
type: "button",
|
|
@@ -10087,10 +10297,10 @@ var Accordion = React64.forwardRef(function Accordion2(props, ref) {
|
|
|
10087
10297
|
toggle(it.id);
|
|
10088
10298
|
}
|
|
10089
10299
|
},
|
|
10090
|
-
it.icon ? /* @__PURE__ */
|
|
10091
|
-
/* @__PURE__ */
|
|
10092
|
-
/* @__PURE__ */
|
|
10093
|
-
)), /* @__PURE__ */
|
|
10300
|
+
it.icon ? /* @__PURE__ */ React65.createElement(Icon, { name: it.icon, className: "aura-accordion__lead" }) : null,
|
|
10301
|
+
/* @__PURE__ */ React65.createElement("span", { className: "aura-accordion__title" }, /* @__PURE__ */ React65.createElement("span", { id: it.description ? bid + "-title" : void 0 }, it.title), it.description ? /* @__PURE__ */ React65.createElement("span", { className: "aura-accordion__desc", id: bid + "-desc", "aria-hidden": true }, it.description) : null),
|
|
10302
|
+
/* @__PURE__ */ React65.createElement(Icon, { name: /* @__PURE__ */ React65.createElement(IconChevronDown, null), className: "aura-accordion__chevron" })
|
|
10303
|
+
)), /* @__PURE__ */ React65.createElement(
|
|
10094
10304
|
"div",
|
|
10095
10305
|
{
|
|
10096
10306
|
id: pid,
|
|
@@ -10105,7 +10315,7 @@ var Accordion = React64.forwardRef(function Accordion2(props, ref) {
|
|
|
10105
10315
|
});
|
|
10106
10316
|
|
|
10107
10317
|
// src/Popover.tsx
|
|
10108
|
-
var
|
|
10318
|
+
var React66 = __toESM(require("react"), 1);
|
|
10109
10319
|
var import_react_dom13 = require("react-dom");
|
|
10110
10320
|
function position(anchor, pop, placement) {
|
|
10111
10321
|
const r2 = anchor.getBoundingClientRect(), pw = pop.offsetWidth, ph = pop.scrollHeight, vw = window.innerWidth, vh = window.innerHeight, gap = 6;
|
|
@@ -10118,20 +10328,20 @@ function position(anchor, pop, placement) {
|
|
|
10118
10328
|
side = above > below2 ? "top" : "bottom";
|
|
10119
10329
|
maxHeight = Math.max(120, side === "top" ? above : below2);
|
|
10120
10330
|
}
|
|
10121
|
-
const
|
|
10122
|
-
const top = side === "top" ? r2.top - gap -
|
|
10331
|
+
const h12 = maxHeight ? Math.min(ph, maxHeight) : ph;
|
|
10332
|
+
const top = side === "top" ? r2.top - gap - h12 : r2.bottom + gap;
|
|
10123
10333
|
const left = align === "end" ? r2.right - pw : align === "center" ? r2.left + r2.width / 2 - pw / 2 : r2.left;
|
|
10124
10334
|
return { top: Math.max(8, top), left: Math.max(8, Math.min(left, vw - pw - 8)), side, maxHeight };
|
|
10125
10335
|
}
|
|
10126
|
-
var Popover =
|
|
10336
|
+
var Popover = React66.forwardRef(function Popover2(props, ref) {
|
|
10127
10337
|
const t = useStrings();
|
|
10128
10338
|
const density = useDensity();
|
|
10129
10339
|
const auto = uid(), id = props.id || auto;
|
|
10130
10340
|
const st = useMaybeControlled(props.open, !!props.defaultOpen, props.onOpenChange);
|
|
10131
10341
|
const open = !!st[0];
|
|
10132
|
-
const wrap =
|
|
10133
|
-
const pos =
|
|
10134
|
-
const inTree =
|
|
10342
|
+
const wrap = React66.useRef(null), pop = React66.useRef(null), popMerged = useMergedRef(ref, pop);
|
|
10343
|
+
const pos = React66.useState(null), mounted = useMounted();
|
|
10344
|
+
const inTree = React66.useRef(false);
|
|
10135
10345
|
function trigger() {
|
|
10136
10346
|
return wrap.current && (wrap.current.querySelector('button, [role="button"], a, input') || wrap.current.firstElementChild);
|
|
10137
10347
|
}
|
|
@@ -10158,7 +10368,7 @@ var Popover = React65.forwardRef(function Popover2(props, ref) {
|
|
|
10158
10368
|
},
|
|
10159
10369
|
[open, mounted, props.placement]
|
|
10160
10370
|
);
|
|
10161
|
-
|
|
10371
|
+
React66.useEffect(
|
|
10162
10372
|
function() {
|
|
10163
10373
|
if (!open || !mounted) return;
|
|
10164
10374
|
if (props.autoFocus !== false && pop.current) {
|
|
@@ -10183,9 +10393,9 @@ var Popover = React65.forwardRef(function Popover2(props, ref) {
|
|
|
10183
10393
|
},
|
|
10184
10394
|
[open, mounted]
|
|
10185
10395
|
);
|
|
10186
|
-
const child =
|
|
10396
|
+
const child = React66.Children.only(props.trigger);
|
|
10187
10397
|
const panel = open && mounted ? (0, import_react_dom13.createPortal)(
|
|
10188
|
-
/* @__PURE__ */
|
|
10398
|
+
/* @__PURE__ */ React66.createElement(
|
|
10189
10399
|
"div",
|
|
10190
10400
|
{
|
|
10191
10401
|
ref: popMerged,
|
|
@@ -10215,17 +10425,17 @@ var Popover = React65.forwardRef(function Popover2(props, ref) {
|
|
|
10215
10425
|
} else trapTab(e, pop.current);
|
|
10216
10426
|
}
|
|
10217
10427
|
},
|
|
10218
|
-
props.title ? /* @__PURE__ */
|
|
10428
|
+
props.title ? /* @__PURE__ */ React66.createElement("div", { className: "aura-popover__head" }, /* @__PURE__ */ React66.createElement("p", { className: "aura-popover__title", id: id + "-title" }, props.title), /* @__PURE__ */ React66.createElement(
|
|
10219
10429
|
IconButton,
|
|
10220
10430
|
{
|
|
10221
|
-
icon: /* @__PURE__ */
|
|
10431
|
+
icon: /* @__PURE__ */ React66.createElement(IconX, null),
|
|
10222
10432
|
label: t.close,
|
|
10223
10433
|
onClick: function() {
|
|
10224
10434
|
close(true);
|
|
10225
10435
|
}
|
|
10226
10436
|
}
|
|
10227
10437
|
)) : null,
|
|
10228
|
-
/* @__PURE__ */
|
|
10438
|
+
/* @__PURE__ */ React66.createElement("div", { className: "aura-popover__body" }, typeof props.children === "function" ? props.children({
|
|
10229
10439
|
close: function() {
|
|
10230
10440
|
close(true);
|
|
10231
10441
|
}
|
|
@@ -10233,7 +10443,7 @@ var Popover = React65.forwardRef(function Popover2(props, ref) {
|
|
|
10233
10443
|
),
|
|
10234
10444
|
document.body
|
|
10235
10445
|
) : null;
|
|
10236
|
-
return /* @__PURE__ */
|
|
10446
|
+
return /* @__PURE__ */ React66.createElement("span", { ref: wrap, className: "aura-popover-anchor" }, React66.cloneElement(child, {
|
|
10237
10447
|
onClick: function(e) {
|
|
10238
10448
|
if (child.props.onClick) child.props.onClick(e);
|
|
10239
10449
|
st[1](!open);
|
|
@@ -10245,7 +10455,7 @@ var Popover = React65.forwardRef(function Popover2(props, ref) {
|
|
|
10245
10455
|
});
|
|
10246
10456
|
|
|
10247
10457
|
// src/NumberField.tsx
|
|
10248
|
-
var
|
|
10458
|
+
var React67 = __toESM(require("react"), 1);
|
|
10249
10459
|
function decimalsOf(n3) {
|
|
10250
10460
|
const s = String(n3);
|
|
10251
10461
|
const i = s.indexOf(".");
|
|
@@ -10258,7 +10468,7 @@ function parse(text2) {
|
|
|
10258
10468
|
if (!/^-?(\d+\.?\d*|\.\d+)$/.test(s)) return NaN;
|
|
10259
10469
|
return Number(s);
|
|
10260
10470
|
}
|
|
10261
|
-
var NumberField =
|
|
10471
|
+
var NumberField = React67.forwardRef(function NumberField2(props, ref) {
|
|
10262
10472
|
const t = useStrings();
|
|
10263
10473
|
const auto = uid(), id = props.id || auto;
|
|
10264
10474
|
const step = props.step || 1;
|
|
@@ -10269,7 +10479,7 @@ var NumberField = React66.forwardRef(function NumberField2(props, ref) {
|
|
|
10269
10479
|
props.onChange
|
|
10270
10480
|
);
|
|
10271
10481
|
const value = st[0], setValue = st[1];
|
|
10272
|
-
const draftState =
|
|
10482
|
+
const draftState = React67.useState(null), draft = draftState[0], setDraft = draftState[1];
|
|
10273
10483
|
function fmt2(n3) {
|
|
10274
10484
|
if (n3 == null || isNaN(n3)) return "";
|
|
10275
10485
|
return n3.toLocaleString("en", { minimumFractionDigits: decimals, maximumFractionDigits: decimals });
|
|
@@ -10318,7 +10528,7 @@ var NumberField = React66.forwardRef(function NumberField2(props, ref) {
|
|
|
10318
10528
|
};
|
|
10319
10529
|
const valueText = value == null ? void 0 : [affixText(props.prefix), fmt2(value), affixText(props.suffix)].join(" ").trim();
|
|
10320
10530
|
const stepper = props.stepper !== false && !props.readOnly;
|
|
10321
|
-
return /* @__PURE__ */
|
|
10531
|
+
return /* @__PURE__ */ React67.createElement(
|
|
10322
10532
|
Field,
|
|
10323
10533
|
{
|
|
10324
10534
|
id,
|
|
@@ -10330,7 +10540,7 @@ var NumberField = React66.forwardRef(function NumberField2(props, ref) {
|
|
|
10330
10540
|
disabled: props.disabled,
|
|
10331
10541
|
className: cx(touchClass(props.touchHeight), props.className)
|
|
10332
10542
|
},
|
|
10333
|
-
/* @__PURE__ */
|
|
10543
|
+
/* @__PURE__ */ React67.createElement("div", { className: cx("aura-input aura-number", stepper && "has-stepper") }, props.prefix != null ? /* @__PURE__ */ React67.createElement("span", { className: "aura-number__affix", "aria-hidden": true }, props.prefix) : null, /* @__PURE__ */ React67.createElement(
|
|
10334
10544
|
"input",
|
|
10335
10545
|
{
|
|
10336
10546
|
ref,
|
|
@@ -10377,7 +10587,7 @@ var NumberField = React66.forwardRef(function NumberField2(props, ref) {
|
|
|
10377
10587
|
},
|
|
10378
10588
|
onKeyDown
|
|
10379
10589
|
}
|
|
10380
|
-
), props.suffix != null ? /* @__PURE__ */
|
|
10590
|
+
), props.suffix != null ? /* @__PURE__ */ React67.createElement("span", { className: "aura-number__affix", "aria-hidden": true }, props.suffix) : null, stepper ? /* @__PURE__ */ React67.createElement("span", { className: "aura-number__steps" }, /* @__PURE__ */ React67.createElement(
|
|
10381
10591
|
"button",
|
|
10382
10592
|
{
|
|
10383
10593
|
type: "button",
|
|
@@ -10393,8 +10603,8 @@ var NumberField = React66.forwardRef(function NumberField2(props, ref) {
|
|
|
10393
10603
|
nudge(-step);
|
|
10394
10604
|
}
|
|
10395
10605
|
},
|
|
10396
|
-
/* @__PURE__ */
|
|
10397
|
-
), /* @__PURE__ */
|
|
10606
|
+
/* @__PURE__ */ React67.createElement(Icon, { name: /* @__PURE__ */ React67.createElement(IconMinus, null) })
|
|
10607
|
+
), /* @__PURE__ */ React67.createElement(
|
|
10398
10608
|
"button",
|
|
10399
10609
|
{
|
|
10400
10610
|
type: "button",
|
|
@@ -10410,14 +10620,14 @@ var NumberField = React66.forwardRef(function NumberField2(props, ref) {
|
|
|
10410
10620
|
nudge(step);
|
|
10411
10621
|
}
|
|
10412
10622
|
},
|
|
10413
|
-
/* @__PURE__ */
|
|
10623
|
+
/* @__PURE__ */ React67.createElement(Icon, { name: /* @__PURE__ */ React67.createElement(IconPlus, null) })
|
|
10414
10624
|
)) : null)
|
|
10415
10625
|
);
|
|
10416
10626
|
});
|
|
10417
10627
|
|
|
10418
10628
|
// src/Stepper.tsx
|
|
10419
|
-
var
|
|
10420
|
-
var Stepper =
|
|
10629
|
+
var React68 = __toESM(require("react"), 1);
|
|
10630
|
+
var Stepper = React68.forwardRef(function Stepper2(props, ref) {
|
|
10421
10631
|
const t = useStrings();
|
|
10422
10632
|
const idBase = uid();
|
|
10423
10633
|
const steps = props.steps || [];
|
|
@@ -10428,22 +10638,22 @@ var Stepper = React67.forwardRef(function Stepper2(props, ref) {
|
|
|
10428
10638
|
if (at < 0) at = 0;
|
|
10429
10639
|
const vertical = props.orientation === "vertical";
|
|
10430
10640
|
const cur2 = steps[at];
|
|
10431
|
-
return /* @__PURE__ */
|
|
10641
|
+
return /* @__PURE__ */ React68.createElement(
|
|
10432
10642
|
"nav",
|
|
10433
10643
|
{
|
|
10434
10644
|
ref,
|
|
10435
10645
|
"aria-label": props.label,
|
|
10436
10646
|
className: cx("aura-stepper", vertical ? "aura-stepper--vertical" : "aura-stepper--horizontal", props.className)
|
|
10437
10647
|
},
|
|
10438
|
-
/* @__PURE__ */
|
|
10648
|
+
/* @__PURE__ */ React68.createElement("ol", { className: "aura-stepper__list" }, steps.map(function(s, i) {
|
|
10439
10649
|
const state = i < at ? "done" : i === at ? "current" : "upcoming";
|
|
10440
10650
|
const error = s.status === "error";
|
|
10441
|
-
const marker = /* @__PURE__ */
|
|
10651
|
+
const marker = /* @__PURE__ */ React68.createElement("span", { className: "aura-stepper__marker", "aria-hidden": true }, error ? /* @__PURE__ */ React68.createElement(Icon, { name: /* @__PURE__ */ React68.createElement(IconCircleAlert, null) }) : state === "done" ? /* @__PURE__ */ React68.createElement(Icon, { name: /* @__PURE__ */ React68.createElement(IconCheck, null) }) : i + 1);
|
|
10442
10652
|
const note = error ? t.stepError : state === "done" ? t.stepDone : "";
|
|
10443
10653
|
const clickable = state === "done" && !!props.onStepClick;
|
|
10444
10654
|
const named = clickable && (typeof s.label === "string" || typeof s.label === "number") && String(s.label).trim() !== "";
|
|
10445
10655
|
const descId = idBase + "-step-" + i;
|
|
10446
|
-
const text2 = /* @__PURE__ */
|
|
10656
|
+
const text2 = /* @__PURE__ */ React68.createElement("span", { className: "aura-stepper__text" }, named ? /* @__PURE__ */ React68.createElement("span", { className: "aura-sr-only" }, String(s.label) + (note ? ", " + note : "")) : null, /* @__PURE__ */ React68.createElement("span", { className: "aura-stepper__label", "aria-hidden": named ? true : void 0 }, s.label, note && !named ? /* @__PURE__ */ React68.createElement("span", { className: "aura-sr-only" }, ", " + note) : null), s.description ? /* @__PURE__ */ React68.createElement(
|
|
10447
10657
|
"span",
|
|
10448
10658
|
{
|
|
10449
10659
|
className: "aura-stepper__desc",
|
|
@@ -10452,14 +10662,14 @@ var Stepper = React67.forwardRef(function Stepper2(props, ref) {
|
|
|
10452
10662
|
},
|
|
10453
10663
|
s.description
|
|
10454
10664
|
) : null);
|
|
10455
|
-
return /* @__PURE__ */
|
|
10665
|
+
return /* @__PURE__ */ React68.createElement(
|
|
10456
10666
|
"li",
|
|
10457
10667
|
{
|
|
10458
10668
|
key: s.id,
|
|
10459
10669
|
className: cx("aura-stepper__item", "is-" + state, error && "is-error"),
|
|
10460
10670
|
"aria-current": state === "current" ? "step" : void 0
|
|
10461
10671
|
},
|
|
10462
|
-
clickable ? /* @__PURE__ */
|
|
10672
|
+
clickable ? /* @__PURE__ */ React68.createElement(
|
|
10463
10673
|
"button",
|
|
10464
10674
|
{
|
|
10465
10675
|
type: "button",
|
|
@@ -10471,19 +10681,19 @@ var Stepper = React67.forwardRef(function Stepper2(props, ref) {
|
|
|
10471
10681
|
},
|
|
10472
10682
|
marker,
|
|
10473
10683
|
text2
|
|
10474
|
-
) : /* @__PURE__ */
|
|
10684
|
+
) : /* @__PURE__ */ React68.createElement("span", { className: "aura-stepper__step" }, marker, text2)
|
|
10475
10685
|
);
|
|
10476
10686
|
})),
|
|
10477
|
-
!vertical && cur2 ? /* @__PURE__ */
|
|
10687
|
+
!vertical && cur2 ? /* @__PURE__ */ React68.createElement("p", { className: "aura-stepper__compact", "aria-hidden": true }, /* @__PURE__ */ React68.createElement("span", { className: "aura-stepper__count" }, t.stepOf(at + 1, steps.length), cur2.status === "error" ? /* @__PURE__ */ React68.createElement("span", { className: "aura-stepper__count-error" }, " \u2014 " + t.stepError) : null), /* @__PURE__ */ React68.createElement("span", { className: "aura-stepper__compact-label" }, cur2.label)) : null
|
|
10478
10688
|
);
|
|
10479
10689
|
});
|
|
10480
10690
|
|
|
10481
10691
|
// src/SegmentedControl.tsx
|
|
10482
|
-
var
|
|
10692
|
+
var React69 = __toESM(require("react"), 1);
|
|
10483
10693
|
function toOpt2(o) {
|
|
10484
10694
|
return typeof o === "object" ? o : { value: o, label: o };
|
|
10485
10695
|
}
|
|
10486
|
-
var SegmentedControl =
|
|
10696
|
+
var SegmentedControl = React69.forwardRef(
|
|
10487
10697
|
function SegmentedControl2(props, ref) {
|
|
10488
10698
|
const options = (props.options || []).map(toOpt2);
|
|
10489
10699
|
useAutoTip();
|
|
@@ -10497,7 +10707,7 @@ var SegmentedControl = React68.forwardRef(
|
|
|
10497
10707
|
);
|
|
10498
10708
|
const value = st[0], setValue = st[1];
|
|
10499
10709
|
const auto = uid(), id = props.id || auto;
|
|
10500
|
-
const refs =
|
|
10710
|
+
const refs = React69.useRef([]);
|
|
10501
10711
|
const selIdx = options.findIndex(function(o) {
|
|
10502
10712
|
return o.value === value;
|
|
10503
10713
|
});
|
|
@@ -10530,7 +10740,7 @@ var SegmentedControl = React68.forwardRef(
|
|
|
10530
10740
|
move(options.length, -1);
|
|
10531
10741
|
}
|
|
10532
10742
|
}
|
|
10533
|
-
return /* @__PURE__ */
|
|
10743
|
+
return /* @__PURE__ */ React69.createElement(
|
|
10534
10744
|
"div",
|
|
10535
10745
|
{
|
|
10536
10746
|
ref,
|
|
@@ -10550,7 +10760,7 @@ var SegmentedControl = React68.forwardRef(
|
|
|
10550
10760
|
options.map(function(o, i) {
|
|
10551
10761
|
const on = o.value === value;
|
|
10552
10762
|
const off = props.disabled || o.disabled;
|
|
10553
|
-
return /* @__PURE__ */
|
|
10763
|
+
return /* @__PURE__ */ React69.createElement(
|
|
10554
10764
|
"button",
|
|
10555
10765
|
{
|
|
10556
10766
|
key: o.value,
|
|
@@ -10572,8 +10782,8 @@ var SegmentedControl = React68.forwardRef(
|
|
|
10572
10782
|
onKeyDown(e, i);
|
|
10573
10783
|
}
|
|
10574
10784
|
},
|
|
10575
|
-
o.icon ? /* @__PURE__ */
|
|
10576
|
-
o.iconOnly ? null : /* @__PURE__ */
|
|
10785
|
+
o.icon ? /* @__PURE__ */ React69.createElement(Icon, { name: o.icon }) : null,
|
|
10786
|
+
o.iconOnly ? null : /* @__PURE__ */ React69.createElement("span", null, o.label)
|
|
10577
10787
|
);
|
|
10578
10788
|
})
|
|
10579
10789
|
);
|