@orianatech/pire 0.9.0 → 0.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/forms/DateRangePicker.d.cts +55 -0
- package/dist/components/forms/DateRangePicker.d.ts +56 -0
- package/dist/components/forms/DateRangePicker.d.ts.map +1 -0
- package/dist/components/forms/Input.d.cts +5 -0
- package/dist/components/forms/Input.d.ts +5 -0
- package/dist/components/forms/Input.d.ts.map +1 -1
- package/dist/components.css +18 -0
- package/dist/i18n/messages.d.cts +2 -0
- package/dist/i18n/messages.d.ts +2 -0
- package/dist/i18n/messages.d.ts.map +1 -1
- package/dist/index.cjs +404 -284
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +396 -260
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -40,9 +40,10 @@ __export(src_exports, {
|
|
|
40
40
|
ConfirmDialog: () => ConfirmDialog,
|
|
41
41
|
DataTable: () => DataTable,
|
|
42
42
|
DatePicker: () => DatePicker,
|
|
43
|
+
DateRangePicker: () => DateRangePicker,
|
|
43
44
|
DescriptionList: () => DescriptionList,
|
|
44
45
|
Dialog: () => Dialog,
|
|
45
|
-
DialogTrigger: () =>
|
|
46
|
+
DialogTrigger: () => import_react_aria_components32.DialogTrigger,
|
|
46
47
|
EmptyState: () => EmptyState,
|
|
47
48
|
FileDropZone: () => FileDropZone,
|
|
48
49
|
FileUpload: () => FileUpload,
|
|
@@ -50,7 +51,7 @@ __export(src_exports, {
|
|
|
50
51
|
FooterBar: () => FooterBar,
|
|
51
52
|
FormField: () => FormField,
|
|
52
53
|
Heading: () => Heading,
|
|
53
|
-
I18nProvider: () =>
|
|
54
|
+
I18nProvider: () => import_react_aria_components32.I18nProvider,
|
|
54
55
|
Icon: () => Icon,
|
|
55
56
|
IconButton: () => IconButton,
|
|
56
57
|
InlineMessage: () => InlineMessage,
|
|
@@ -62,7 +63,7 @@ __export(src_exports, {
|
|
|
62
63
|
MenuItem: () => MenuItem,
|
|
63
64
|
MenuSection: () => MenuSection,
|
|
64
65
|
MenuSeparator: () => MenuSeparator,
|
|
65
|
-
MenuTrigger: () =>
|
|
66
|
+
MenuTrigger: () => import_react_aria_components32.MenuTrigger,
|
|
66
67
|
MultiComboBox: () => MultiComboBox,
|
|
67
68
|
NumberField: () => NumberField,
|
|
68
69
|
ObjectHeader: () => ObjectHeader,
|
|
@@ -70,11 +71,11 @@ __export(src_exports, {
|
|
|
70
71
|
PageHeader: () => PageHeader,
|
|
71
72
|
Pagination: () => Pagination,
|
|
72
73
|
PireIntlProvider: () => PireIntlProvider,
|
|
73
|
-
Popover: () =>
|
|
74
|
+
Popover: () => import_react_aria_components32.Popover,
|
|
74
75
|
ProgressBar: () => ProgressBar,
|
|
75
76
|
Radio: () => Radio,
|
|
76
77
|
RadioGroup: () => RadioGroup,
|
|
77
|
-
RouterProvider: () =>
|
|
78
|
+
RouterProvider: () => import_react_aria_components32.RouterProvider,
|
|
78
79
|
SectionHeader: () => SectionHeader,
|
|
79
80
|
SegmentedControl: () => SegmentedControl,
|
|
80
81
|
Select: () => Select,
|
|
@@ -86,7 +87,7 @@ __export(src_exports, {
|
|
|
86
87
|
Skeleton: () => Skeleton,
|
|
87
88
|
SkeletonTableRow: () => SkeletonTableRow,
|
|
88
89
|
Strong: () => Strong,
|
|
89
|
-
SubmenuTrigger: () =>
|
|
90
|
+
SubmenuTrigger: () => import_react_aria_components32.SubmenuTrigger,
|
|
90
91
|
Switch: () => Switch,
|
|
91
92
|
Tabs: () => Tabs,
|
|
92
93
|
Tag: () => Tag,
|
|
@@ -102,6 +103,7 @@ __export(src_exports, {
|
|
|
102
103
|
enMessages: () => enMessages,
|
|
103
104
|
esMessages: () => esMessages,
|
|
104
105
|
formatFileSize: () => formatFileSize,
|
|
106
|
+
rangeLengthInDays: () => rangeLengthInDays,
|
|
105
107
|
usePireMessages: () => usePireMessages,
|
|
106
108
|
useToast: () => useToast
|
|
107
109
|
});
|
|
@@ -899,6 +901,7 @@ var enMessages = {
|
|
|
899
901
|
datePickerOpenCalendar: "Open calendar",
|
|
900
902
|
datePickerPreviousMonth: "Previous month",
|
|
901
903
|
datePickerNextMonth: "Next month",
|
|
904
|
+
dateRangePresetsLabel: "Date range shortcuts",
|
|
902
905
|
numberFieldIncrease: "Increase",
|
|
903
906
|
numberFieldDecrease: "Decrease",
|
|
904
907
|
valueHelpFieldClear: "Clear selection",
|
|
@@ -935,6 +938,7 @@ var esMessages = {
|
|
|
935
938
|
datePickerOpenCalendar: "Abrir calendario",
|
|
936
939
|
datePickerPreviousMonth: "Mes anterior",
|
|
937
940
|
datePickerNextMonth: "Mes siguiente",
|
|
941
|
+
dateRangePresetsLabel: "Atajos de rango de fechas",
|
|
938
942
|
numberFieldIncrease: "Aumentar",
|
|
939
943
|
numberFieldDecrease: "Disminuir",
|
|
940
944
|
valueHelpFieldClear: "Limpiar selecci\xF3n",
|
|
@@ -1294,6 +1298,120 @@ function DatePicker({
|
|
|
1294
1298
|
] });
|
|
1295
1299
|
}
|
|
1296
1300
|
|
|
1301
|
+
// src/components/forms/DateRangePicker.tsx
|
|
1302
|
+
var import_react_aria_components19 = require("react-aria-components");
|
|
1303
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
1304
|
+
function rangeLengthInDays(range) {
|
|
1305
|
+
return range.end.toDate("UTC").getTime() / 864e5 - range.start.toDate("UTC").getTime() / 864e5 + 1;
|
|
1306
|
+
}
|
|
1307
|
+
function DateRangePicker({
|
|
1308
|
+
label,
|
|
1309
|
+
description,
|
|
1310
|
+
errorMessage,
|
|
1311
|
+
maxRangeDays,
|
|
1312
|
+
presets,
|
|
1313
|
+
size = "md",
|
|
1314
|
+
fullWidth = true,
|
|
1315
|
+
startName,
|
|
1316
|
+
endName,
|
|
1317
|
+
className,
|
|
1318
|
+
style,
|
|
1319
|
+
...rest
|
|
1320
|
+
}) {
|
|
1321
|
+
const msg = usePireMessages();
|
|
1322
|
+
const current = rest.value ?? rest.defaultValue ?? null;
|
|
1323
|
+
const tooLong = maxRangeDays != null && current != null && rangeLengthInDays(current) > maxRangeDays;
|
|
1324
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
1325
|
+
import_react_aria_components19.DateRangePicker,
|
|
1326
|
+
{
|
|
1327
|
+
className: cx("pire-field", className),
|
|
1328
|
+
style,
|
|
1329
|
+
startName,
|
|
1330
|
+
endName,
|
|
1331
|
+
validationBehavior: "aria",
|
|
1332
|
+
...rest,
|
|
1333
|
+
isInvalid: rest.isInvalid || tooLong,
|
|
1334
|
+
children: [
|
|
1335
|
+
label ? /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react_aria_components19.Label, { className: "pire-field-label", children: [
|
|
1336
|
+
label,
|
|
1337
|
+
rest.isRequired ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "pire-field-req", "aria-hidden": "true", children: "*" }) : null
|
|
1338
|
+
] }) : null,
|
|
1339
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
1340
|
+
import_react_aria_components19.Group,
|
|
1341
|
+
{
|
|
1342
|
+
className: "pire-control pire-daterange-control",
|
|
1343
|
+
"data-size": size,
|
|
1344
|
+
"data-full-width": String(fullWidth),
|
|
1345
|
+
"data-invalid": rest.isInvalid || tooLong ? "true" : void 0,
|
|
1346
|
+
"data-readonly": rest.isReadOnly ? "true" : void 0,
|
|
1347
|
+
children: [
|
|
1348
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_aria_components19.DateInput, { slot: "start", className: "pire-datefield", children: (segment) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_aria_components19.DateSegment, { segment, className: "pire-datesegment" }) }),
|
|
1349
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { "aria-hidden": "true", className: "pire-daterange-dash", children: "\u2013" }),
|
|
1350
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_aria_components19.DateInput, { slot: "end", className: "pire-datefield", children: (segment) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_aria_components19.DateSegment, { segment, className: "pire-datesegment" }) }),
|
|
1351
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
1352
|
+
import_react_aria_components19.Button,
|
|
1353
|
+
{
|
|
1354
|
+
className: "pire-iconbtn",
|
|
1355
|
+
"data-size": "sm",
|
|
1356
|
+
"aria-label": msg.datePickerOpenCalendar,
|
|
1357
|
+
style: { width: 24, height: 24 },
|
|
1358
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Icon, { name: "calendar", size: 16 })
|
|
1359
|
+
}
|
|
1360
|
+
)
|
|
1361
|
+
]
|
|
1362
|
+
}
|
|
1363
|
+
),
|
|
1364
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_aria_components19.Text, { slot: "description", className: "pire-field-hint", children: description }) : null,
|
|
1365
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_aria_components19.FieldError, { className: "pire-field-error", children: errorMessage }),
|
|
1366
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_aria_components19.Popover, { className: "pire-popover", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react_aria_components19.Dialog, { className: "pire-daterange-dialog", children: [
|
|
1367
|
+
presets?.length ? (
|
|
1368
|
+
// Before the calendar in the DOM, so keyboard users reach the shortcut without
|
|
1369
|
+
// arrowing through a month first.
|
|
1370
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "pire-daterange-presets", role: "group", "aria-label": msg.dateRangePresetsLabel, children: presets.map((preset) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
1371
|
+
import_react_aria_components19.Button,
|
|
1372
|
+
{
|
|
1373
|
+
className: "pire-daterange-preset",
|
|
1374
|
+
onPress: () => rest.onChange?.(preset.range()),
|
|
1375
|
+
children: preset.label
|
|
1376
|
+
},
|
|
1377
|
+
preset.id
|
|
1378
|
+
)) })
|
|
1379
|
+
) : null,
|
|
1380
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react_aria_components19.RangeCalendar, { className: "pire-calendar", children: [
|
|
1381
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("header", { className: "pire-calendar-head", children: [
|
|
1382
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
1383
|
+
import_react_aria_components19.Button,
|
|
1384
|
+
{
|
|
1385
|
+
slot: "previous",
|
|
1386
|
+
className: "pire-iconbtn",
|
|
1387
|
+
"data-size": "sm",
|
|
1388
|
+
"aria-label": msg.datePickerPreviousMonth,
|
|
1389
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Icon, { name: "chevron-left", size: 16 })
|
|
1390
|
+
}
|
|
1391
|
+
),
|
|
1392
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_aria_components19.Heading, { className: "pire-calendar-title" }),
|
|
1393
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
1394
|
+
import_react_aria_components19.Button,
|
|
1395
|
+
{
|
|
1396
|
+
slot: "next",
|
|
1397
|
+
className: "pire-iconbtn",
|
|
1398
|
+
"data-size": "sm",
|
|
1399
|
+
"aria-label": msg.datePickerNextMonth,
|
|
1400
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Icon, { name: "chevron-right", size: 16 })
|
|
1401
|
+
}
|
|
1402
|
+
)
|
|
1403
|
+
] }),
|
|
1404
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react_aria_components19.CalendarGrid, { className: "pire-calendar-grid", children: [
|
|
1405
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_aria_components19.CalendarGridHeader, { children: (day) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_aria_components19.CalendarHeaderCell, { children: day }) }),
|
|
1406
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_aria_components19.CalendarGridBody, { children: (date) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_aria_components19.CalendarCell, { date, className: "pire-calendar-cell" }) })
|
|
1407
|
+
] })
|
|
1408
|
+
] })
|
|
1409
|
+
] }) })
|
|
1410
|
+
]
|
|
1411
|
+
}
|
|
1412
|
+
);
|
|
1413
|
+
}
|
|
1414
|
+
|
|
1297
1415
|
// src/components/forms/ValueHelpField.tsx
|
|
1298
1416
|
var React9 = __toESM(require("react"), 1);
|
|
1299
1417
|
|
|
@@ -1301,8 +1419,8 @@ var React9 = __toESM(require("react"), 1);
|
|
|
1301
1419
|
var React8 = __toESM(require("react"), 1);
|
|
1302
1420
|
|
|
1303
1421
|
// src/components/feedback/Dialog.tsx
|
|
1304
|
-
var
|
|
1305
|
-
var
|
|
1422
|
+
var import_react_aria_components20 = require("react-aria-components");
|
|
1423
|
+
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
1306
1424
|
function Dialog({
|
|
1307
1425
|
isOpen,
|
|
1308
1426
|
onOpenChange,
|
|
@@ -1322,8 +1440,8 @@ function Dialog({
|
|
|
1322
1440
|
onClose?.();
|
|
1323
1441
|
onOpenChange?.(false);
|
|
1324
1442
|
};
|
|
1325
|
-
return /* @__PURE__ */ (0,
|
|
1326
|
-
|
|
1443
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1444
|
+
import_react_aria_components20.ModalOverlay,
|
|
1327
1445
|
{
|
|
1328
1446
|
className: "pire-modal-overlay",
|
|
1329
1447
|
isOpen,
|
|
@@ -1331,28 +1449,28 @@ function Dialog({
|
|
|
1331
1449
|
onOpenChange: (o) => {
|
|
1332
1450
|
if (!o) close();
|
|
1333
1451
|
},
|
|
1334
|
-
children: /* @__PURE__ */ (0,
|
|
1335
|
-
title ? /* @__PURE__ */ (0,
|
|
1336
|
-
/* @__PURE__ */ (0,
|
|
1337
|
-
/* @__PURE__ */ (0,
|
|
1338
|
-
subtitle ? /* @__PURE__ */ (0,
|
|
1452
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react_aria_components20.Modal, { className: cx("pire-modal", className), "data-size": size, style, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react_aria_components20.Dialog, { className: "pire-dialog", children: [
|
|
1453
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("header", { className: "pire-dialog-head", children: [
|
|
1454
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { style: { flex: 1, minWidth: 0 }, children: [
|
|
1455
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react_aria_components20.Heading, { slot: "title", className: "pire-dialog-title", children: title }),
|
|
1456
|
+
subtitle ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("p", { className: "pire-dialog-sub", style: { margin: 0 }, children: subtitle }) : null
|
|
1339
1457
|
] }),
|
|
1340
|
-
showClose ? /* @__PURE__ */ (0,
|
|
1458
|
+
showClose ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(IconButton, { icon: "x", label: msg.dialogClose, size: "sm", onPress: close }) : null
|
|
1341
1459
|
] }) : null,
|
|
1342
|
-
/* @__PURE__ */ (0,
|
|
1343
|
-
footer ? /* @__PURE__ */ (0,
|
|
1460
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "pire-dialog-body", children }),
|
|
1461
|
+
footer ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("footer", { className: "pire-dialog-foot", children: footer }) : null
|
|
1344
1462
|
] }) })
|
|
1345
1463
|
}
|
|
1346
1464
|
);
|
|
1347
1465
|
}
|
|
1348
1466
|
|
|
1349
1467
|
// src/components/data/DataTable.tsx
|
|
1350
|
-
var
|
|
1468
|
+
var import_react_aria_components21 = require("react-aria-components");
|
|
1351
1469
|
|
|
1352
1470
|
// src/components/feedback/Skeleton.tsx
|
|
1353
|
-
var
|
|
1471
|
+
var import_jsx_runtime28 = require("react/jsx-runtime");
|
|
1354
1472
|
function Skeleton({ shape = "text", width, height, className, style, ...rest }) {
|
|
1355
|
-
return /* @__PURE__ */ (0,
|
|
1473
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
1356
1474
|
"div",
|
|
1357
1475
|
{
|
|
1358
1476
|
className: cx("pire-skeleton", className),
|
|
@@ -1366,7 +1484,7 @@ function Skeleton({ shape = "text", width, height, className, style, ...rest })
|
|
|
1366
1484
|
var BAR_WIDTHS = ["72%", "54%", "86%", "63%"];
|
|
1367
1485
|
function SkeletonTableRow({ columns, density = "regular", className, style, ...rest }) {
|
|
1368
1486
|
const cells = typeof columns === "number" ? Array.from({ length: columns }, () => ({})) : columns;
|
|
1369
|
-
return /* @__PURE__ */ (0,
|
|
1487
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
1370
1488
|
"div",
|
|
1371
1489
|
{
|
|
1372
1490
|
className: cx("pire-skeleton-row", className),
|
|
@@ -1378,13 +1496,13 @@ function SkeletonTableRow({ columns, density = "regular", className, style, ...r
|
|
|
1378
1496
|
const align = c.numeric ? "right" : c.align ?? "left";
|
|
1379
1497
|
return (
|
|
1380
1498
|
// biome-ignore lint/suspicious/noArrayIndexKey: columns are positional and never reordered.
|
|
1381
|
-
/* @__PURE__ */ (0,
|
|
1499
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
1382
1500
|
"div",
|
|
1383
1501
|
{
|
|
1384
1502
|
className: "pire-skeleton-cell",
|
|
1385
1503
|
"data-align": align,
|
|
1386
1504
|
style: { width: c.width, flex: c.width ? "0 0 auto" : void 0 },
|
|
1387
|
-
children: /* @__PURE__ */ (0,
|
|
1505
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Skeleton, { width: BAR_WIDTHS[i % BAR_WIDTHS.length] })
|
|
1388
1506
|
},
|
|
1389
1507
|
i
|
|
1390
1508
|
)
|
|
@@ -1395,7 +1513,7 @@ function SkeletonTableRow({ columns, density = "regular", className, style, ...r
|
|
|
1395
1513
|
}
|
|
1396
1514
|
|
|
1397
1515
|
// src/components/data/DataTable.tsx
|
|
1398
|
-
var
|
|
1516
|
+
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
1399
1517
|
function DataTable({
|
|
1400
1518
|
columns,
|
|
1401
1519
|
rows,
|
|
@@ -1427,15 +1545,15 @@ function DataTable({
|
|
|
1427
1545
|
...columns.map((c) => ({ width: c.width, align: c.align, numeric: c.numeric }))
|
|
1428
1546
|
];
|
|
1429
1547
|
const body = isLoading ? [] : rows;
|
|
1430
|
-
return /* @__PURE__ */ (0,
|
|
1548
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
1431
1549
|
"div",
|
|
1432
1550
|
{
|
|
1433
1551
|
className: cx("pire-table-wrap", className),
|
|
1434
1552
|
style,
|
|
1435
1553
|
"data-loading": isLoading ? "true" : void 0,
|
|
1436
1554
|
"aria-busy": isLoading ? "true" : void 0,
|
|
1437
|
-
children: /* @__PURE__ */ (0,
|
|
1438
|
-
|
|
1555
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
|
|
1556
|
+
import_react_aria_components21.Table,
|
|
1439
1557
|
{
|
|
1440
1558
|
className: "pire-table",
|
|
1441
1559
|
"data-density": density,
|
|
@@ -1451,10 +1569,10 @@ function DataTable({
|
|
|
1451
1569
|
if (row) onRowAction(row);
|
|
1452
1570
|
} : void 0,
|
|
1453
1571
|
children: [
|
|
1454
|
-
/* @__PURE__ */ (0,
|
|
1455
|
-
selectable ? /* @__PURE__ */ (0,
|
|
1456
|
-
columns.map((c, i) => /* @__PURE__ */ (0,
|
|
1457
|
-
|
|
1572
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_aria_components21.TableHeader, { className: "pire-thead-row", children: [
|
|
1573
|
+
selectable ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react_aria_components21.Column, { className: "pire-th", width: 44, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Checkbox, { slot: "selection", "aria-label": msg.dataTableSelectAll }) }) : null,
|
|
1574
|
+
columns.map((c, i) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
1575
|
+
import_react_aria_components21.Column,
|
|
1458
1576
|
{
|
|
1459
1577
|
id: c.key,
|
|
1460
1578
|
className: "pire-th",
|
|
@@ -1463,9 +1581,9 @@ function DataTable({
|
|
|
1463
1581
|
width: c.width,
|
|
1464
1582
|
"data-align": c.numeric || c.align === "right" ? "right" : c.align,
|
|
1465
1583
|
"data-allows-sorting": c.sortable ? "true" : void 0,
|
|
1466
|
-
children: /* @__PURE__ */ (0,
|
|
1584
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("span", { className: "pire-th-inner", children: [
|
|
1467
1585
|
c.label,
|
|
1468
|
-
c.sortable ? /* @__PURE__ */ (0,
|
|
1586
|
+
c.sortable ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
1469
1587
|
Icon,
|
|
1470
1588
|
{
|
|
1471
1589
|
size: 12,
|
|
@@ -1478,16 +1596,16 @@ function DataTable({
|
|
|
1478
1596
|
c.key
|
|
1479
1597
|
))
|
|
1480
1598
|
] }),
|
|
1481
|
-
/* @__PURE__ */ (0,
|
|
1482
|
-
/* @__PURE__ */ (0,
|
|
1599
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react_aria_components21.TableBody, { renderEmptyState: () => isLoading ? /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "pire-table-loading", role: "status", "aria-live": "polite", children: [
|
|
1600
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "pire-sr-only", children: loadingLabel ?? msg.dataTableLoading }),
|
|
1483
1601
|
Array.from({ length: skeletonRows }, (_, i) => (
|
|
1484
1602
|
// biome-ignore lint/suspicious/noArrayIndexKey: placeholder rows are positional.
|
|
1485
|
-
/* @__PURE__ */ (0,
|
|
1603
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(SkeletonTableRow, { columns: skeletonColumns, density }, i)
|
|
1486
1604
|
))
|
|
1487
|
-
] }) : /* @__PURE__ */ (0,
|
|
1488
|
-
selectable ? /* @__PURE__ */ (0,
|
|
1489
|
-
columns.map((c) => /* @__PURE__ */ (0,
|
|
1490
|
-
|
|
1605
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "pire-table-empty", children: emptyLabel }), children: body.map((row) => /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react_aria_components21.Row, { id: row.id, className: "pire-tr", "data-pressable": onRowAction ? "true" : void 0, children: [
|
|
1606
|
+
selectable ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react_aria_components21.Cell, { className: "pire-td", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Checkbox, { slot: "selection", "aria-label": msg.dataTableSelectRow }) }) : null,
|
|
1607
|
+
columns.map((c) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
1608
|
+
import_react_aria_components21.Cell,
|
|
1491
1609
|
{
|
|
1492
1610
|
className: "pire-td",
|
|
1493
1611
|
"data-numeric": c.numeric ? "true" : void 0,
|
|
@@ -1505,7 +1623,7 @@ function DataTable({
|
|
|
1505
1623
|
}
|
|
1506
1624
|
|
|
1507
1625
|
// src/components/patterns/ValueHelpDialog.tsx
|
|
1508
|
-
var
|
|
1626
|
+
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
1509
1627
|
function ValueHelpDialog({
|
|
1510
1628
|
isOpen,
|
|
1511
1629
|
title = "Select a record",
|
|
@@ -1526,16 +1644,16 @@ function ValueHelpDialog({
|
|
|
1526
1644
|
if (!q) return rows;
|
|
1527
1645
|
return rows.filter((row) => Object.values(row).some((v) => String(v).toLowerCase().includes(q)));
|
|
1528
1646
|
}, [rows, query]);
|
|
1529
|
-
return /* @__PURE__ */ (0,
|
|
1647
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1530
1648
|
Dialog,
|
|
1531
1649
|
{
|
|
1532
1650
|
isOpen,
|
|
1533
1651
|
size: "lg",
|
|
1534
1652
|
title,
|
|
1535
1653
|
onClose,
|
|
1536
|
-
footer: /* @__PURE__ */ (0,
|
|
1537
|
-
children: /* @__PURE__ */ (0,
|
|
1538
|
-
/* @__PURE__ */ (0,
|
|
1654
|
+
footer: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Button, { variant: "tertiary", onPress: onClose, children: msg.valueHelpDialogCancel }),
|
|
1655
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "var(--sp-3)" }, children: [
|
|
1656
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1539
1657
|
Input,
|
|
1540
1658
|
{
|
|
1541
1659
|
"aria-label": msg.valueHelpDialogSearch,
|
|
@@ -1547,7 +1665,7 @@ function ValueHelpDialog({
|
|
|
1547
1665
|
autoFocus: true
|
|
1548
1666
|
}
|
|
1549
1667
|
),
|
|
1550
|
-
/* @__PURE__ */ (0,
|
|
1668
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1551
1669
|
DataTable,
|
|
1552
1670
|
{
|
|
1553
1671
|
"aria-label": typeof title === "string" ? title : "Records",
|
|
@@ -1567,7 +1685,7 @@ function ValueHelpDialog({
|
|
|
1567
1685
|
}
|
|
1568
1686
|
|
|
1569
1687
|
// src/components/forms/ValueHelpField.tsx
|
|
1570
|
-
var
|
|
1688
|
+
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
1571
1689
|
var defaultFormat = (row) => [row.id, row.name ?? row.label ?? row.text].filter(Boolean).join(" \u2014 ");
|
|
1572
1690
|
function ValueHelpField({
|
|
1573
1691
|
label,
|
|
@@ -1589,9 +1707,9 @@ function ValueHelpField({
|
|
|
1589
1707
|
}) {
|
|
1590
1708
|
const msg = usePireMessages();
|
|
1591
1709
|
const [open, setOpen] = React9.useState(false);
|
|
1592
|
-
return /* @__PURE__ */ (0,
|
|
1593
|
-
/* @__PURE__ */ (0,
|
|
1594
|
-
/* @__PURE__ */ (0,
|
|
1710
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: cx(className), style, children: [
|
|
1711
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { style: { display: "flex", gap: "var(--sp-2)", alignItems: "flex-end" }, children: [
|
|
1712
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
1595
1713
|
Input,
|
|
1596
1714
|
{
|
|
1597
1715
|
label,
|
|
@@ -1605,7 +1723,7 @@ function ValueHelpField({
|
|
|
1605
1723
|
errorMessage
|
|
1606
1724
|
}
|
|
1607
1725
|
),
|
|
1608
|
-
allowsClear && value ? /* @__PURE__ */ (0,
|
|
1726
|
+
allowsClear && value ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
1609
1727
|
IconButton,
|
|
1610
1728
|
{
|
|
1611
1729
|
icon: "x",
|
|
@@ -1615,7 +1733,7 @@ function ValueHelpField({
|
|
|
1615
1733
|
onPress: () => onChange?.(null)
|
|
1616
1734
|
}
|
|
1617
1735
|
) : null,
|
|
1618
|
-
/* @__PURE__ */ (0,
|
|
1736
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
1619
1737
|
IconButton,
|
|
1620
1738
|
{
|
|
1621
1739
|
icon: "search",
|
|
@@ -1626,7 +1744,7 @@ function ValueHelpField({
|
|
|
1626
1744
|
}
|
|
1627
1745
|
)
|
|
1628
1746
|
] }),
|
|
1629
|
-
/* @__PURE__ */ (0,
|
|
1747
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
1630
1748
|
ValueHelpDialog,
|
|
1631
1749
|
{
|
|
1632
1750
|
isOpen: open,
|
|
@@ -1642,11 +1760,11 @@ function ValueHelpField({
|
|
|
1642
1760
|
|
|
1643
1761
|
// src/components/forms/FileUpload.tsx
|
|
1644
1762
|
var React10 = __toESM(require("react"), 1);
|
|
1645
|
-
var
|
|
1763
|
+
var import_react_aria_components23 = require("react-aria-components");
|
|
1646
1764
|
|
|
1647
1765
|
// src/components/feedback/ProgressBar.tsx
|
|
1648
|
-
var
|
|
1649
|
-
var
|
|
1766
|
+
var import_react_aria_components22 = require("react-aria-components");
|
|
1767
|
+
var import_jsx_runtime32 = require("react/jsx-runtime");
|
|
1650
1768
|
function ProgressBar({
|
|
1651
1769
|
value = 0,
|
|
1652
1770
|
minValue = 0,
|
|
@@ -1659,8 +1777,8 @@ function ProgressBar({
|
|
|
1659
1777
|
className,
|
|
1660
1778
|
style
|
|
1661
1779
|
}) {
|
|
1662
|
-
return /* @__PURE__ */ (0,
|
|
1663
|
-
|
|
1780
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
1781
|
+
import_react_aria_components22.ProgressBar,
|
|
1664
1782
|
{
|
|
1665
1783
|
className: cx("pire-progress", className),
|
|
1666
1784
|
"data-status": status,
|
|
@@ -1670,19 +1788,19 @@ function ProgressBar({
|
|
|
1670
1788
|
maxValue,
|
|
1671
1789
|
isIndeterminate,
|
|
1672
1790
|
style,
|
|
1673
|
-
children: ({ percentage, valueText }) => /* @__PURE__ */ (0,
|
|
1674
|
-
label || showValue ? /* @__PURE__ */ (0,
|
|
1675
|
-
label ? /* @__PURE__ */ (0,
|
|
1676
|
-
showValue && !isIndeterminate ? /* @__PURE__ */ (0,
|
|
1791
|
+
children: ({ percentage, valueText }) => /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_jsx_runtime32.Fragment, { children: [
|
|
1792
|
+
label || showValue ? /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "pire-progress-head", children: [
|
|
1793
|
+
label ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react_aria_components22.Label, { children: label }) : /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", {}),
|
|
1794
|
+
showValue && !isIndeterminate ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "pire-numeric", children: valueText }) : null
|
|
1677
1795
|
] }) : null,
|
|
1678
|
-
/* @__PURE__ */ (0,
|
|
1796
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "pire-progress-track", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "pire-progress-fill", style: { width: `${isIndeterminate ? 40 : percentage}%` } }) })
|
|
1679
1797
|
] })
|
|
1680
1798
|
}
|
|
1681
1799
|
);
|
|
1682
1800
|
}
|
|
1683
1801
|
|
|
1684
1802
|
// src/components/forms/FileUpload.tsx
|
|
1685
|
-
var
|
|
1803
|
+
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
1686
1804
|
var isImage = (file) => file.type.startsWith("image/");
|
|
1687
1805
|
function formatFileSize(bytes) {
|
|
1688
1806
|
if (bytes < 1024) return `${bytes} B`;
|
|
@@ -1754,7 +1872,7 @@ function FileUpload({
|
|
|
1754
1872
|
commit(allowsMultiple ? [...files, ...wrapped] : wrapped.slice(0, 1));
|
|
1755
1873
|
};
|
|
1756
1874
|
const remove = (target) => commit(files.filter((f) => f.file !== target));
|
|
1757
|
-
return /* @__PURE__ */ (0,
|
|
1875
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
|
|
1758
1876
|
"div",
|
|
1759
1877
|
{
|
|
1760
1878
|
className: cx("pire-field", "pire-fileupload", className),
|
|
@@ -1762,24 +1880,24 @@ function FileUpload({
|
|
|
1762
1880
|
"data-full-width": String(fullWidth),
|
|
1763
1881
|
"data-invalid": isInvalid ? "true" : void 0,
|
|
1764
1882
|
children: [
|
|
1765
|
-
label ? /* @__PURE__ */ (0,
|
|
1883
|
+
label ? /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("span", { className: "pire-field-label", children: [
|
|
1766
1884
|
label,
|
|
1767
|
-
isRequired ? /* @__PURE__ */ (0,
|
|
1885
|
+
isRequired ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "pire-field-req", "aria-hidden": "true", children: "*" }) : null
|
|
1768
1886
|
] }) : null,
|
|
1769
|
-
/* @__PURE__ */ (0,
|
|
1770
|
-
|
|
1887
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1888
|
+
import_react_aria_components23.FileTrigger,
|
|
1771
1889
|
{
|
|
1772
1890
|
acceptedFileTypes,
|
|
1773
1891
|
allowsMultiple,
|
|
1774
1892
|
onSelect: accept,
|
|
1775
|
-
children: /* @__PURE__ */ (0,
|
|
1893
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Button, { icon: "paperclip", isDisabled: isDisabled || isReadOnly, children: chooseLabel ?? msg.fileUploadChoose })
|
|
1776
1894
|
}
|
|
1777
1895
|
),
|
|
1778
|
-
files.length ? /* @__PURE__ */ (0,
|
|
1779
|
-
previewUrl ? /* @__PURE__ */ (0,
|
|
1780
|
-
/* @__PURE__ */ (0,
|
|
1781
|
-
/* @__PURE__ */ (0,
|
|
1782
|
-
isDisabled || isReadOnly ? null : /* @__PURE__ */ (0,
|
|
1896
|
+
files.length ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("ul", { className: "pire-fileupload-list", children: files.map(({ file, previewUrl }) => /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("li", { className: "pire-fileupload-item", children: [
|
|
1897
|
+
previewUrl ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("img", { className: "pire-fileupload-thumb", src: previewUrl, alt: "" }) : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Icon, { name: "file-text", size: 16, className: "pire-fileupload-icon" }),
|
|
1898
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "pire-fileupload-name", children: file.name }),
|
|
1899
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "pire-fileupload-size", children: formatFileSize(file.size) }),
|
|
1900
|
+
isDisabled || isReadOnly ? null : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1783
1901
|
IconButton,
|
|
1784
1902
|
{
|
|
1785
1903
|
icon: "x",
|
|
@@ -1789,16 +1907,16 @@ function FileUpload({
|
|
|
1789
1907
|
}
|
|
1790
1908
|
)
|
|
1791
1909
|
] }, `${file.name}-${file.size}-${file.lastModified}`)) }) : null,
|
|
1792
|
-
uploadProgress != null ? /* @__PURE__ */ (0,
|
|
1793
|
-
description ? /* @__PURE__ */ (0,
|
|
1794
|
-
isInvalid && errorMessage ? /* @__PURE__ */ (0,
|
|
1910
|
+
uploadProgress != null ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ProgressBar, { value: uploadProgress, label: msg.fileUploadUploading }) : null,
|
|
1911
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react_aria_components23.Text, { slot: "description", className: "pire-field-hint", children: description }) : null,
|
|
1912
|
+
isInvalid && errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "pire-field-error", children: errorMessage }) : null
|
|
1795
1913
|
]
|
|
1796
1914
|
}
|
|
1797
1915
|
);
|
|
1798
1916
|
}
|
|
1799
1917
|
|
|
1800
1918
|
// src/components/navigation/ShellBar.tsx
|
|
1801
|
-
var
|
|
1919
|
+
var import_jsx_runtime34 = require("react/jsx-runtime");
|
|
1802
1920
|
var initials2 = (name) => name.trim().split(/\s+/).slice(0, 2).map((p) => p[0]).join("").toUpperCase();
|
|
1803
1921
|
function ShellBar({
|
|
1804
1922
|
product,
|
|
@@ -1813,30 +1931,30 @@ function ShellBar({
|
|
|
1813
1931
|
className,
|
|
1814
1932
|
...rest
|
|
1815
1933
|
}) {
|
|
1816
|
-
return /* @__PURE__ */ (0,
|
|
1817
|
-
onMenu ? /* @__PURE__ */ (0,
|
|
1818
|
-
monogram ? /* @__PURE__ */ (0,
|
|
1819
|
-
product ? /* @__PURE__ */ (0,
|
|
1820
|
-
title ? /* @__PURE__ */ (0,
|
|
1821
|
-
/* @__PURE__ */ (0,
|
|
1822
|
-
onSearch ? /* @__PURE__ */ (0,
|
|
1934
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("header", { className: cx("pire-shellbar", className), ...rest, children: [
|
|
1935
|
+
onMenu ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(IconButton, { icon: "menu", label: menuLabel, variant: "inverse", size: "sm", onPress: onMenu }) : null,
|
|
1936
|
+
monogram ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "pire-shellbar-mono", "aria-hidden": "true", children: monogram }) : null,
|
|
1937
|
+
product ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "pire-shellbar-product", children: product }) : null,
|
|
1938
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "pire-shellbar-title", children: title }) : null,
|
|
1939
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "pire-shellbar-spacer" }),
|
|
1940
|
+
onSearch ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(IconButton, { icon: "search", label: searchLabel, variant: "inverse", size: "sm", onPress: onSearch }) : null,
|
|
1823
1941
|
actions,
|
|
1824
|
-
user ? /* @__PURE__ */ (0,
|
|
1942
|
+
user ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "pire-avatar", title: user, "aria-label": user, role: "img", children: initials2(user) }) : null
|
|
1825
1943
|
] });
|
|
1826
1944
|
}
|
|
1827
1945
|
|
|
1828
1946
|
// src/components/navigation/SideNav.tsx
|
|
1829
1947
|
var React11 = __toESM(require("react"), 1);
|
|
1830
|
-
var
|
|
1948
|
+
var import_react_aria_components25 = require("react-aria-components");
|
|
1831
1949
|
|
|
1832
1950
|
// src/components/navigation/Menu.tsx
|
|
1833
|
-
var
|
|
1834
|
-
var
|
|
1951
|
+
var import_react_aria_components24 = require("react-aria-components");
|
|
1952
|
+
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
1835
1953
|
function Menu({ minWidth, className, style, ...rest }) {
|
|
1836
1954
|
const width = typeof minWidth === "number" ? `${minWidth}px` : minWidth;
|
|
1837
1955
|
const menuStyle = width == null ? style : { ["--pire-menu-min-w"]: width, ...style };
|
|
1838
|
-
return /* @__PURE__ */ (0,
|
|
1839
|
-
|
|
1956
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
1957
|
+
import_react_aria_components24.Menu,
|
|
1840
1958
|
{
|
|
1841
1959
|
className: cx("pire-menu", className),
|
|
1842
1960
|
style: menuStyle,
|
|
@@ -1853,35 +1971,35 @@ function MenuItem({
|
|
|
1853
1971
|
className,
|
|
1854
1972
|
...rest
|
|
1855
1973
|
}) {
|
|
1856
|
-
return /* @__PURE__ */ (0,
|
|
1857
|
-
|
|
1974
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
|
|
1975
|
+
import_react_aria_components24.MenuItem,
|
|
1858
1976
|
{
|
|
1859
1977
|
className: cx("pire-menu-item", className),
|
|
1860
1978
|
"data-tone": tone === "danger" ? "danger" : void 0,
|
|
1861
1979
|
...rest,
|
|
1862
1980
|
children: [
|
|
1863
|
-
icon ? /* @__PURE__ */ (0,
|
|
1864
|
-
/* @__PURE__ */ (0,
|
|
1865
|
-
/* @__PURE__ */ (0,
|
|
1866
|
-
description ? /* @__PURE__ */ (0,
|
|
1981
|
+
icon ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Icon, { name: icon, size: 16, className: "pire-menu-item-icon" }) : null,
|
|
1982
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("span", { className: "pire-menu-item-body", children: [
|
|
1983
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "pire-menu-item-label", children }),
|
|
1984
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "pire-menu-item-desc", children: description }) : null
|
|
1867
1985
|
] }),
|
|
1868
|
-
shortcut ? /* @__PURE__ */ (0,
|
|
1986
|
+
shortcut ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("kbd", { className: "pire-menu-item-shortcut", children: shortcut }) : null
|
|
1869
1987
|
]
|
|
1870
1988
|
}
|
|
1871
1989
|
);
|
|
1872
1990
|
}
|
|
1873
1991
|
function MenuSection({ title, children, className, ...rest }) {
|
|
1874
|
-
return /* @__PURE__ */ (0,
|
|
1875
|
-
title ? /* @__PURE__ */ (0,
|
|
1992
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_react_aria_components24.MenuSection, { className: cx("pire-menu-section", className), ...rest, children: [
|
|
1993
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react_aria_components24.Header, { className: "pire-menu-section-title", children: title }) : null,
|
|
1876
1994
|
children
|
|
1877
1995
|
] });
|
|
1878
1996
|
}
|
|
1879
1997
|
function MenuSeparator({ className }) {
|
|
1880
|
-
return /* @__PURE__ */ (0,
|
|
1998
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react_aria_components24.Separator, { className: cx("pire-menu-separator", className) });
|
|
1881
1999
|
}
|
|
1882
2000
|
|
|
1883
2001
|
// src/components/navigation/SideNav.tsx
|
|
1884
|
-
var
|
|
2002
|
+
var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
1885
2003
|
function findActiveParent(groups, value) {
|
|
1886
2004
|
if (value == null) return void 0;
|
|
1887
2005
|
for (const group of groups) {
|
|
@@ -1930,8 +2048,8 @@ function SideNav({
|
|
|
1930
2048
|
};
|
|
1931
2049
|
const renderRow = (item, onPress, isGroup) => {
|
|
1932
2050
|
const selected = !isGroup && item.id === value;
|
|
1933
|
-
const button = /* @__PURE__ */ (0,
|
|
1934
|
-
|
|
2051
|
+
const button = /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
|
|
2052
|
+
import_react_aria_components25.Button,
|
|
1935
2053
|
{
|
|
1936
2054
|
className: "pire-sidenav-item",
|
|
1937
2055
|
"data-selected": selected ? "true" : void 0,
|
|
@@ -1940,70 +2058,70 @@ function SideNav({
|
|
|
1940
2058
|
"aria-label": collapsed ? item.label : void 0,
|
|
1941
2059
|
onPress,
|
|
1942
2060
|
children: [
|
|
1943
|
-
item.icon ? /* @__PURE__ */ (0,
|
|
1944
|
-
collapsed ? null : /* @__PURE__ */ (0,
|
|
1945
|
-
item.count != null && !collapsed ? /* @__PURE__ */ (0,
|
|
2061
|
+
item.icon ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Icon, { name: item.icon, size: 16 }) : null,
|
|
2062
|
+
collapsed ? null : /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { children: item.label }),
|
|
2063
|
+
item.count != null && !collapsed ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "pire-sidenav-count", children: item.count }) : null
|
|
1946
2064
|
]
|
|
1947
2065
|
},
|
|
1948
2066
|
item.id
|
|
1949
2067
|
);
|
|
1950
|
-
return collapsed ? /* @__PURE__ */ (0,
|
|
2068
|
+
return collapsed ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Tooltip, { label: item.label, placement: "right", children: button }, item.id) : button;
|
|
1951
2069
|
};
|
|
1952
|
-
const renderRailFlyout = (item) => /* @__PURE__ */ (0,
|
|
1953
|
-
/* @__PURE__ */ (0,
|
|
1954
|
-
|
|
2070
|
+
const renderRailFlyout = (item) => /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_react_aria_components25.MenuTrigger, { children: [
|
|
2071
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2072
|
+
import_react_aria_components25.Button,
|
|
1955
2073
|
{
|
|
1956
2074
|
className: "pire-sidenav-item",
|
|
1957
2075
|
"aria-label": item.label,
|
|
1958
2076
|
"data-active-child": item.id === activeParent ? "true" : void 0,
|
|
1959
|
-
children: item.icon ? /* @__PURE__ */ (0,
|
|
2077
|
+
children: item.icon ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Icon, { name: item.icon, size: 16 }) : null
|
|
1960
2078
|
}
|
|
1961
2079
|
),
|
|
1962
|
-
/* @__PURE__ */ (0,
|
|
2080
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_react_aria_components25.Popover, { className: "pire-popover", placement: "right top", offset: 4, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
1963
2081
|
Menu,
|
|
1964
2082
|
{
|
|
1965
2083
|
"aria-label": item.label,
|
|
1966
2084
|
className: "pire-sidenav-flyout",
|
|
1967
2085
|
onAction: (key) => onChange?.(String(key)),
|
|
1968
|
-
children: (item.items ?? []).map((child) => /* @__PURE__ */ (0,
|
|
2086
|
+
children: (item.items ?? []).map((child) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(MenuItem, { id: child.id, children: child.label }, child.id))
|
|
1969
2087
|
}
|
|
1970
2088
|
) })
|
|
1971
2089
|
] }, item.id);
|
|
1972
|
-
const renderSection = (item) => /* @__PURE__ */ (0,
|
|
1973
|
-
/* @__PURE__ */ (0,
|
|
1974
|
-
|
|
2090
|
+
const renderSection = (item) => /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_react_aria_components25.Disclosure, { id: item.id, className: "pire-sidenav-section", children: [
|
|
2091
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
|
|
2092
|
+
import_react_aria_components25.Button,
|
|
1975
2093
|
{
|
|
1976
2094
|
slot: "trigger",
|
|
1977
2095
|
className: "pire-sidenav-item",
|
|
1978
2096
|
"data-kind": "group",
|
|
1979
2097
|
"data-active-child": item.id === activeParent ? "true" : void 0,
|
|
1980
2098
|
children: [
|
|
1981
|
-
item.icon ? /* @__PURE__ */ (0,
|
|
1982
|
-
/* @__PURE__ */ (0,
|
|
1983
|
-
item.count != null ? /* @__PURE__ */ (0,
|
|
1984
|
-
/* @__PURE__ */ (0,
|
|
2099
|
+
item.icon ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Icon, { name: item.icon, size: 16 }) : null,
|
|
2100
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { children: item.label }),
|
|
2101
|
+
item.count != null ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "pire-sidenav-count", children: item.count }) : null,
|
|
2102
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Icon, { name: "chevron-down", size: 16, className: "pire-sidenav-chevron" })
|
|
1985
2103
|
]
|
|
1986
2104
|
}
|
|
1987
2105
|
),
|
|
1988
|
-
/* @__PURE__ */ (0,
|
|
2106
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_react_aria_components25.DisclosurePanel, { className: "pire-sidenav-subnav", children: item.items?.map((child) => {
|
|
1989
2107
|
const selected = child.id === value;
|
|
1990
|
-
return /* @__PURE__ */ (0,
|
|
1991
|
-
|
|
2108
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
|
|
2109
|
+
import_react_aria_components25.Button,
|
|
1992
2110
|
{
|
|
1993
2111
|
className: "pire-sidenav-item pire-sidenav-subitem",
|
|
1994
2112
|
"data-selected": selected ? "true" : void 0,
|
|
1995
2113
|
"aria-current": selected ? "page" : void 0,
|
|
1996
2114
|
onPress: () => onChange?.(child.id),
|
|
1997
2115
|
children: [
|
|
1998
|
-
/* @__PURE__ */ (0,
|
|
1999
|
-
child.count != null ? /* @__PURE__ */ (0,
|
|
2116
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { children: child.label }),
|
|
2117
|
+
child.count != null ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "pire-sidenav-count", children: child.count }) : null
|
|
2000
2118
|
]
|
|
2001
2119
|
},
|
|
2002
2120
|
child.id
|
|
2003
2121
|
);
|
|
2004
2122
|
}) })
|
|
2005
2123
|
] }, item.id);
|
|
2006
|
-
return /* @__PURE__ */ (0,
|
|
2124
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
|
|
2007
2125
|
"nav",
|
|
2008
2126
|
{
|
|
2009
2127
|
className: cx("pire-sidenav", className),
|
|
@@ -2019,10 +2137,10 @@ function SideNav({
|
|
|
2019
2137
|
if (isGroup && collapsed && railFlyout) return renderRailFlyout(item);
|
|
2020
2138
|
return renderRow(item, () => isGroup ? toggleExpanded(item.id) : onChange?.(item.id), isGroup);
|
|
2021
2139
|
});
|
|
2022
|
-
return /* @__PURE__ */ (0,
|
|
2023
|
-
group.label && !collapsed ? /* @__PURE__ */ (0,
|
|
2024
|
-
hasSections ? /* @__PURE__ */ (0,
|
|
2025
|
-
|
|
2140
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "pire-sidenav-group", children: [
|
|
2141
|
+
group.label && !collapsed ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "pire-sidenav-label", children: group.label }) : null,
|
|
2142
|
+
hasSections ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2143
|
+
import_react_aria_components25.DisclosureGroup,
|
|
2026
2144
|
{
|
|
2027
2145
|
className: "pire-sidenav-tree",
|
|
2028
2146
|
allowsMultipleExpanded: true,
|
|
@@ -2033,18 +2151,18 @@ function SideNav({
|
|
|
2033
2151
|
) : rows
|
|
2034
2152
|
] }, group.label ?? gi);
|
|
2035
2153
|
}),
|
|
2036
|
-
footer ? /* @__PURE__ */ (0,
|
|
2154
|
+
footer ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "pire-sidenav-footer", children: footer }) : null
|
|
2037
2155
|
]
|
|
2038
2156
|
}
|
|
2039
2157
|
);
|
|
2040
2158
|
}
|
|
2041
2159
|
|
|
2042
2160
|
// src/components/navigation/Tabs.tsx
|
|
2043
|
-
var
|
|
2044
|
-
var
|
|
2161
|
+
var import_react_aria_components26 = require("react-aria-components");
|
|
2162
|
+
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
2045
2163
|
function Tabs({ items, value, defaultValue, onChange, panels, className, style, ...rest }) {
|
|
2046
|
-
return /* @__PURE__ */ (0,
|
|
2047
|
-
|
|
2164
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
|
|
2165
|
+
import_react_aria_components26.Tabs,
|
|
2048
2166
|
{
|
|
2049
2167
|
className,
|
|
2050
2168
|
style,
|
|
@@ -2052,23 +2170,23 @@ function Tabs({ items, value, defaultValue, onChange, panels, className, style,
|
|
|
2052
2170
|
defaultSelectedKey: defaultValue,
|
|
2053
2171
|
onSelectionChange: (k) => onChange?.(String(k)),
|
|
2054
2172
|
children: [
|
|
2055
|
-
/* @__PURE__ */ (0,
|
|
2056
|
-
item.icon ? /* @__PURE__ */ (0,
|
|
2173
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react_aria_components26.TabList, { className: "pire-tablist", items, "aria-label": rest["aria-label"] ?? "Views", children: (item) => /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_react_aria_components26.Tab, { className: cx("pire-tab"), id: item.id, isDisabled: item.isDisabled, children: [
|
|
2174
|
+
item.icon ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Icon, { name: item.icon, size: 16 }) : null,
|
|
2057
2175
|
item.label,
|
|
2058
|
-
item.count != null ? /* @__PURE__ */ (0,
|
|
2176
|
+
item.count != null ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "pire-tab-count", children: item.count }) : null
|
|
2059
2177
|
] }) }),
|
|
2060
|
-
items.map((item) => /* @__PURE__ */ (0,
|
|
2178
|
+
items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react_aria_components26.TabPanel, { id: item.id, className: panels ? "pire-tabpanel" : void 0, children: panels?.[item.id] }, item.id))
|
|
2061
2179
|
]
|
|
2062
2180
|
}
|
|
2063
2181
|
);
|
|
2064
2182
|
}
|
|
2065
2183
|
|
|
2066
2184
|
// src/components/navigation/Breadcrumb.tsx
|
|
2067
|
-
var
|
|
2068
|
-
var
|
|
2185
|
+
var import_react_aria_components27 = require("react-aria-components");
|
|
2186
|
+
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
2069
2187
|
function Breadcrumb({ items, onNavigate, className, style }) {
|
|
2070
|
-
return /* @__PURE__ */ (0,
|
|
2071
|
-
|
|
2188
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
2189
|
+
import_react_aria_components27.Breadcrumbs,
|
|
2072
2190
|
{
|
|
2073
2191
|
className: cx("pire-breadcrumbs", className),
|
|
2074
2192
|
style,
|
|
@@ -2076,9 +2194,9 @@ function Breadcrumb({ items, onNavigate, className, style }) {
|
|
|
2076
2194
|
onAction: (key) => onNavigate?.(String(key)),
|
|
2077
2195
|
children: (item) => {
|
|
2078
2196
|
const last = items[items.length - 1] === item;
|
|
2079
|
-
return /* @__PURE__ */ (0,
|
|
2080
|
-
last ? item.label : /* @__PURE__ */ (0,
|
|
2081
|
-
last ? null : /* @__PURE__ */ (0,
|
|
2197
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_react_aria_components27.Breadcrumb, { className: "pire-breadcrumb", id: item.id ?? item.label, children: [
|
|
2198
|
+
last ? item.label : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_react_aria_components27.Link, { href: item.href, children: item.label }),
|
|
2199
|
+
last ? null : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Icon, { name: "chevron-right", size: 12, style: { color: "var(--text-tertiary)" } })
|
|
2082
2200
|
] });
|
|
2083
2201
|
}
|
|
2084
2202
|
}
|
|
@@ -2086,7 +2204,7 @@ function Breadcrumb({ items, onNavigate, className, style }) {
|
|
|
2086
2204
|
}
|
|
2087
2205
|
|
|
2088
2206
|
// src/components/navigation/Pagination.tsx
|
|
2089
|
-
var
|
|
2207
|
+
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
2090
2208
|
function Pagination({
|
|
2091
2209
|
page = 1,
|
|
2092
2210
|
pageSize = 25,
|
|
@@ -2101,9 +2219,9 @@ function Pagination({
|
|
|
2101
2219
|
const pages = Math.max(1, Math.ceil(total / pageSize));
|
|
2102
2220
|
const from = total === 0 ? 0 : (page - 1) * pageSize + 1;
|
|
2103
2221
|
const to = Math.min(total, page * pageSize);
|
|
2104
|
-
return /* @__PURE__ */ (0,
|
|
2105
|
-
/* @__PURE__ */ (0,
|
|
2106
|
-
/* @__PURE__ */ (0,
|
|
2222
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("nav", { className: cx("pire-pagination", className), style, "aria-label": msg.paginationLabel, children: [
|
|
2223
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "pire-pagination-count", children: msg.paginationRange.replace("{from}", from.toLocaleString()).replace("{to}", to.toLocaleString()).replace("{total}", total.toLocaleString()) }),
|
|
2224
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
2107
2225
|
IconButton,
|
|
2108
2226
|
{
|
|
2109
2227
|
icon: "chevron-left",
|
|
@@ -2114,8 +2232,8 @@ function Pagination({
|
|
|
2114
2232
|
onPress: () => onPageChange?.(page - 1)
|
|
2115
2233
|
}
|
|
2116
2234
|
),
|
|
2117
|
-
/* @__PURE__ */ (0,
|
|
2118
|
-
/* @__PURE__ */ (0,
|
|
2235
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "pire-pagination-count", "aria-live": "polite", children: msg.paginationPageOf.replace("{page}", String(page)).replace("{pages}", String(pages)) }),
|
|
2236
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
2119
2237
|
IconButton,
|
|
2120
2238
|
{
|
|
2121
2239
|
icon: "chevron-right",
|
|
@@ -2126,7 +2244,7 @@ function Pagination({
|
|
|
2126
2244
|
onPress: () => onPageChange?.(page + 1)
|
|
2127
2245
|
}
|
|
2128
2246
|
),
|
|
2129
|
-
onPageSizeChange ? /* @__PURE__ */ (0,
|
|
2247
|
+
onPageSizeChange ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
2130
2248
|
Select,
|
|
2131
2249
|
{
|
|
2132
2250
|
"aria-label": msg.paginationRowsPerPage,
|
|
@@ -2142,7 +2260,7 @@ function Pagination({
|
|
|
2142
2260
|
}
|
|
2143
2261
|
|
|
2144
2262
|
// src/components/feedback/InlineMessage.tsx
|
|
2145
|
-
var
|
|
2263
|
+
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
2146
2264
|
var KIND_ICON = {
|
|
2147
2265
|
info: "info",
|
|
2148
2266
|
success: "check-circle-2",
|
|
@@ -2152,7 +2270,7 @@ var KIND_ICON = {
|
|
|
2152
2270
|
function InlineMessage({ kind = "info", title, action, onClose, children, className, ...rest }) {
|
|
2153
2271
|
const msg = usePireMessages();
|
|
2154
2272
|
const assertive = kind === "error" || kind === "warning";
|
|
2155
|
-
return /* @__PURE__ */ (0,
|
|
2273
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
2156
2274
|
"div",
|
|
2157
2275
|
{
|
|
2158
2276
|
className: cx("pire-msg", className),
|
|
@@ -2161,13 +2279,13 @@ function InlineMessage({ kind = "info", title, action, onClose, children, classN
|
|
|
2161
2279
|
"aria-live": assertive ? "assertive" : "polite",
|
|
2162
2280
|
...rest,
|
|
2163
2281
|
children: [
|
|
2164
|
-
/* @__PURE__ */ (0,
|
|
2165
|
-
/* @__PURE__ */ (0,
|
|
2166
|
-
title ? /* @__PURE__ */ (0,
|
|
2167
|
-
children ? /* @__PURE__ */ (0,
|
|
2282
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Icon, { name: KIND_ICON[kind], size: 16, style: { marginTop: 2 } }),
|
|
2283
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: "var(--sp-1)" }, children: [
|
|
2284
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "pire-msg-title", children: title }) : null,
|
|
2285
|
+
children ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "pire-msg-body", children }) : null,
|
|
2168
2286
|
action
|
|
2169
2287
|
] }),
|
|
2170
|
-
onClose ? /* @__PURE__ */ (0,
|
|
2288
|
+
onClose ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(IconButton, { icon: "x", label: msg.inlineMessageDismiss, size: "sm", onPress: onClose }) : null
|
|
2171
2289
|
]
|
|
2172
2290
|
}
|
|
2173
2291
|
);
|
|
@@ -2175,7 +2293,7 @@ function InlineMessage({ kind = "info", title, action, onClose, children, classN
|
|
|
2175
2293
|
|
|
2176
2294
|
// src/components/feedback/Toast.tsx
|
|
2177
2295
|
var React12 = __toESM(require("react"), 1);
|
|
2178
|
-
var
|
|
2296
|
+
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
2179
2297
|
var KIND_ICON2 = {
|
|
2180
2298
|
info: "info",
|
|
2181
2299
|
success: "check-circle-2",
|
|
@@ -2184,7 +2302,7 @@ var KIND_ICON2 = {
|
|
|
2184
2302
|
};
|
|
2185
2303
|
function Toast({ kind = "success", onClose, position = "bottom-center", children, className, ...rest }) {
|
|
2186
2304
|
const msg = usePireMessages();
|
|
2187
|
-
return /* @__PURE__ */ (0,
|
|
2305
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
2188
2306
|
"div",
|
|
2189
2307
|
{
|
|
2190
2308
|
className: cx("pire-toast", className),
|
|
@@ -2193,9 +2311,9 @@ function Toast({ kind = "success", onClose, position = "bottom-center", children
|
|
|
2193
2311
|
"aria-live": kind === "error" ? "assertive" : "polite",
|
|
2194
2312
|
...rest,
|
|
2195
2313
|
children: [
|
|
2196
|
-
/* @__PURE__ */ (0,
|
|
2197
|
-
/* @__PURE__ */ (0,
|
|
2198
|
-
onClose ? /* @__PURE__ */ (0,
|
|
2314
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Icon, { name: KIND_ICON2[kind], size: 16 }),
|
|
2315
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { style: { flex: 1 }, children }),
|
|
2316
|
+
onClose ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(IconButton, { icon: "x", label: msg.toastDismiss, size: "sm", variant: "inverse", onPress: onClose }) : null
|
|
2199
2317
|
]
|
|
2200
2318
|
}
|
|
2201
2319
|
);
|
|
@@ -2213,9 +2331,9 @@ function ToastProvider({ children, timeout = 6e3 }) {
|
|
|
2213
2331
|
return id;
|
|
2214
2332
|
}, [close, timeout]);
|
|
2215
2333
|
const value = React12.useMemo(() => ({ add, close }), [add, close]);
|
|
2216
|
-
return /* @__PURE__ */ (0,
|
|
2334
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(ToastContext.Provider, { value, children: [
|
|
2217
2335
|
children,
|
|
2218
|
-
/* @__PURE__ */ (0,
|
|
2336
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "pire-toast-region", role: "region", "aria-label": msg.toastRegionLabel, children: toasts.map((t) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Toast, { kind: t.kind, onClose: () => close(t.id), style: { position: "static", transform: "none" }, children: t.message }, t.id)) })
|
|
2219
2337
|
] });
|
|
2220
2338
|
}
|
|
2221
2339
|
function useToast() {
|
|
@@ -2225,8 +2343,8 @@ function useToast() {
|
|
|
2225
2343
|
}
|
|
2226
2344
|
|
|
2227
2345
|
// src/components/data/KpiTile.tsx
|
|
2228
|
-
var
|
|
2229
|
-
var
|
|
2346
|
+
var import_react_aria_components28 = require("react-aria-components");
|
|
2347
|
+
var import_jsx_runtime42 = require("react/jsx-runtime");
|
|
2230
2348
|
function KpiTile({
|
|
2231
2349
|
label,
|
|
2232
2350
|
value,
|
|
@@ -2242,50 +2360,50 @@ function KpiTile({
|
|
|
2242
2360
|
style
|
|
2243
2361
|
}) {
|
|
2244
2362
|
const tone = deltaTone ?? (deltaDirection === "down" ? "negative" : "positive");
|
|
2245
|
-
const body = /* @__PURE__ */ (0,
|
|
2246
|
-
/* @__PURE__ */ (0,
|
|
2247
|
-
icon ? /* @__PURE__ */ (0,
|
|
2363
|
+
const body = /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, { children: [
|
|
2364
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("span", { className: "pire-kpi-label", children: [
|
|
2365
|
+
icon ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Icon, { name: icon, size: 16 }) : null,
|
|
2248
2366
|
label
|
|
2249
2367
|
] }),
|
|
2250
|
-
/* @__PURE__ */ (0,
|
|
2368
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("span", { className: "pire-kpi-value", children: [
|
|
2251
2369
|
value,
|
|
2252
|
-
unit ? /* @__PURE__ */ (0,
|
|
2370
|
+
unit ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "pire-kpi-unit", children: unit }) : null
|
|
2253
2371
|
] }),
|
|
2254
|
-
delta ? /* @__PURE__ */ (0,
|
|
2255
|
-
deltaDirection ? /* @__PURE__ */ (0,
|
|
2372
|
+
delta ? /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("span", { className: "pire-kpi-delta", "data-tone": tone, children: [
|
|
2373
|
+
deltaDirection ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Icon, { name: deltaDirection === "up" ? "trending-up" : "trending-down", size: 12 }) : null,
|
|
2256
2374
|
delta
|
|
2257
2375
|
] }) : null,
|
|
2258
|
-
footnote ? /* @__PURE__ */ (0,
|
|
2376
|
+
footnote ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "pire-kpi-foot", children: footnote }) : null
|
|
2259
2377
|
] });
|
|
2260
2378
|
const props = { className: cx("pire-kpi", className), "data-status": status, style };
|
|
2261
|
-
return onPress ? /* @__PURE__ */ (0,
|
|
2379
|
+
return onPress ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react_aria_components28.Button, { ...props, "data-pressable": "true", onPress, children: body }) : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { ...props, children: body });
|
|
2262
2380
|
}
|
|
2263
2381
|
|
|
2264
2382
|
// src/components/data/ObjectHeader.tsx
|
|
2265
|
-
var
|
|
2383
|
+
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
2266
2384
|
function ObjectHeader({ title, subtitle, id, breadcrumb, badge, facts, actions, className, ...rest }) {
|
|
2267
|
-
return /* @__PURE__ */ (0,
|
|
2385
|
+
return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("header", { className: cx("pire-objheader", className), ...rest, children: [
|
|
2268
2386
|
breadcrumb,
|
|
2269
|
-
/* @__PURE__ */ (0,
|
|
2270
|
-
/* @__PURE__ */ (0,
|
|
2271
|
-
/* @__PURE__ */ (0,
|
|
2272
|
-
subtitle || id ? /* @__PURE__ */ (0,
|
|
2387
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "pire-objheader-row", children: [
|
|
2388
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { style: { minWidth: 0 }, children: [
|
|
2389
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)("h1", { className: "pire-objheader-title", children: title }),
|
|
2390
|
+
subtitle || id ? /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "pire-objheader-sub", children: [
|
|
2273
2391
|
subtitle,
|
|
2274
|
-
id ? /* @__PURE__ */ (0,
|
|
2392
|
+
id ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: "pire-objheader-id", children: id }) : null
|
|
2275
2393
|
] }) : null
|
|
2276
2394
|
] }),
|
|
2277
2395
|
badge,
|
|
2278
|
-
actions ? /* @__PURE__ */ (0,
|
|
2396
|
+
actions ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "pire-objheader-actions", children: actions }) : null
|
|
2279
2397
|
] }),
|
|
2280
|
-
facts?.length ? /* @__PURE__ */ (0,
|
|
2281
|
-
/* @__PURE__ */ (0,
|
|
2282
|
-
/* @__PURE__ */ (0,
|
|
2398
|
+
facts?.length ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("dl", { className: "pire-facts", style: { margin: 0 }, children: facts.map((fact) => /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { children: [
|
|
2399
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)("dt", { className: "pire-fact-label", children: fact.label }),
|
|
2400
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)("dd", { className: "pire-fact-value", "data-numeric": fact.numeric ? "true" : void 0, style: { margin: 0 }, children: fact.value })
|
|
2283
2401
|
] }, fact.label)) }) : null
|
|
2284
2402
|
] });
|
|
2285
2403
|
}
|
|
2286
2404
|
|
|
2287
2405
|
// src/components/data/FilterBar.tsx
|
|
2288
|
-
var
|
|
2406
|
+
var import_jsx_runtime44 = require("react/jsx-runtime");
|
|
2289
2407
|
function FilterBar({
|
|
2290
2408
|
children,
|
|
2291
2409
|
activeFilters = [],
|
|
@@ -2302,66 +2420,66 @@ function FilterBar({
|
|
|
2302
2420
|
const label = useMessage("filterBarLabel", rest["aria-label"]);
|
|
2303
2421
|
const go = useMessage("filterBarGo", goLabel);
|
|
2304
2422
|
const clearAll = useMessage("filterBarClearAll", clearAllLabel);
|
|
2305
|
-
return /* @__PURE__ */ (0,
|
|
2306
|
-
/* @__PURE__ */ (0,
|
|
2423
|
+
return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("section", { className: cx("pire-filterbar", className), ...rest, "aria-label": label, children: [
|
|
2424
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "pire-filterbar-controls", children: [
|
|
2307
2425
|
children,
|
|
2308
|
-
onGo ? /* @__PURE__ */ (0,
|
|
2426
|
+
onGo ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Button, { variant: "primary", onPress: onGo, children: go }) : null
|
|
2309
2427
|
] }),
|
|
2310
|
-
activeFilters.length || resultLabel || actions ? /* @__PURE__ */ (0,
|
|
2311
|
-
activeFilters.map((filter) => /* @__PURE__ */ (0,
|
|
2312
|
-
activeFilters.length && onClear ? /* @__PURE__ */ (0,
|
|
2313
|
-
resultLabel ? /* @__PURE__ */ (0,
|
|
2314
|
-
actions ? /* @__PURE__ */ (0,
|
|
2428
|
+
activeFilters.length || resultLabel || actions ? /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "pire-filterbar-foot", children: [
|
|
2429
|
+
activeFilters.map((filter) => /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Tag, { onRemove: onRemoveFilter ? () => onRemoveFilter(filter.id) : void 0, children: filter.label }, filter.id)),
|
|
2430
|
+
activeFilters.length && onClear ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Button, { variant: "tertiary", size: "sm", onPress: onClear, children: clearAll }) : null,
|
|
2431
|
+
resultLabel ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "pire-filterbar-result", "aria-live": "polite", children: resultLabel }) : null,
|
|
2432
|
+
actions ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "pire-filterbar-actions", children: actions }) : null
|
|
2315
2433
|
] }) : null
|
|
2316
2434
|
] });
|
|
2317
2435
|
}
|
|
2318
2436
|
|
|
2319
2437
|
// src/components/data/DescriptionList.tsx
|
|
2320
|
-
var
|
|
2438
|
+
var import_jsx_runtime45 = require("react/jsx-runtime");
|
|
2321
2439
|
function DescriptionList({ items, layout = "rows", columns = 3, className, style, ...rest }) {
|
|
2322
|
-
return /* @__PURE__ */ (0,
|
|
2440
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
|
|
2323
2441
|
"dl",
|
|
2324
2442
|
{
|
|
2325
2443
|
className: cx("pire-dl", className),
|
|
2326
2444
|
"data-layout": layout,
|
|
2327
2445
|
style: { ...layout === "grid" ? { "--pire-dl-cols": columns } : null, ...style },
|
|
2328
2446
|
...rest,
|
|
2329
|
-
children: items.map((item, i) => /* @__PURE__ */ (0,
|
|
2330
|
-
/* @__PURE__ */ (0,
|
|
2447
|
+
children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: "pire-dl-row", "data-emphasis": item.emphasis ? "true" : void 0, children: [
|
|
2448
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("dt", { className: "pire-dl-term", children: [
|
|
2331
2449
|
item.label,
|
|
2332
2450
|
item.hint
|
|
2333
2451
|
] }),
|
|
2334
|
-
/* @__PURE__ */ (0,
|
|
2452
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)("dd", { className: "pire-dl-value", "data-numeric": item.numeric ? "true" : void 0, children: item.value })
|
|
2335
2453
|
] }, i))
|
|
2336
2454
|
}
|
|
2337
2455
|
);
|
|
2338
2456
|
}
|
|
2339
2457
|
|
|
2340
2458
|
// src/components/data/Timeline.tsx
|
|
2341
|
-
var
|
|
2459
|
+
var import_jsx_runtime46 = require("react/jsx-runtime");
|
|
2342
2460
|
function Timeline({ entries, reverse = false, className, ...rest }) {
|
|
2343
2461
|
const list = reverse ? [...entries].reverse() : entries;
|
|
2344
|
-
return /* @__PURE__ */ (0,
|
|
2345
|
-
/* @__PURE__ */ (0,
|
|
2346
|
-
/* @__PURE__ */ (0,
|
|
2347
|
-
entry.actor ? /* @__PURE__ */ (0,
|
|
2462
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("ol", { className: cx("pire-timeline", className), ...rest, children: list.map((entry, i) => /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("li", { className: "pire-timeline-item", children: [
|
|
2463
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "pire-timeline-time", children: entry.time }),
|
|
2464
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "pire-timeline-text", children: entry.event }),
|
|
2465
|
+
entry.actor ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "pire-timeline-actor", children: entry.actor }) : null
|
|
2348
2466
|
] }, entry.id ?? i)) });
|
|
2349
2467
|
}
|
|
2350
2468
|
|
|
2351
2469
|
// src/components/data/LinkList.tsx
|
|
2352
|
-
var
|
|
2353
|
-
var
|
|
2470
|
+
var import_react_aria_components29 = require("react-aria-components");
|
|
2471
|
+
var import_jsx_runtime47 = require("react/jsx-runtime");
|
|
2354
2472
|
function LinkList({ items, onSelect, className, ...rest }) {
|
|
2355
|
-
return /* @__PURE__ */ (0,
|
|
2356
|
-
item.icon ? /* @__PURE__ */ (0,
|
|
2357
|
-
item.key ? /* @__PURE__ */ (0,
|
|
2358
|
-
item.text ? /* @__PURE__ */ (0,
|
|
2473
|
+
return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: cx("pire-linklist", className), role: "list", ...rest, children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_react_aria_components29.Button, { className: "pire-linklist-item", onPress: () => onSelect?.(item.id), children: [
|
|
2474
|
+
item.icon ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Icon, { name: item.icon, size: 16, style: { color: "var(--text-secondary)" } }) : null,
|
|
2475
|
+
item.key ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: "pire-linklist-key", children: item.key }) : null,
|
|
2476
|
+
item.text ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: "pire-linklist-text", children: item.text }) : null,
|
|
2359
2477
|
item.trailing
|
|
2360
2478
|
] }, item.id)) });
|
|
2361
2479
|
}
|
|
2362
2480
|
|
|
2363
2481
|
// src/components/layout/PageBand.tsx
|
|
2364
|
-
var
|
|
2482
|
+
var import_jsx_runtime48 = require("react/jsx-runtime");
|
|
2365
2483
|
function PageBand({
|
|
2366
2484
|
surface = "card",
|
|
2367
2485
|
hasBorder = true,
|
|
@@ -2369,7 +2487,7 @@ function PageBand({
|
|
|
2369
2487
|
className,
|
|
2370
2488
|
...rest
|
|
2371
2489
|
}) {
|
|
2372
|
-
return /* @__PURE__ */ (0,
|
|
2490
|
+
return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
|
|
2373
2491
|
"div",
|
|
2374
2492
|
{
|
|
2375
2493
|
className: cx("pire-pageband", className),
|
|
@@ -2382,56 +2500,56 @@ function PageBand({
|
|
|
2382
2500
|
}
|
|
2383
2501
|
|
|
2384
2502
|
// src/components/layout/PageHeader.tsx
|
|
2385
|
-
var
|
|
2503
|
+
var import_jsx_runtime49 = require("react/jsx-runtime");
|
|
2386
2504
|
function PageHeader({ title, subtitle, actions, className, ...rest }) {
|
|
2387
|
-
return /* @__PURE__ */ (0,
|
|
2388
|
-
/* @__PURE__ */ (0,
|
|
2389
|
-
/* @__PURE__ */ (0,
|
|
2390
|
-
subtitle ? /* @__PURE__ */ (0,
|
|
2505
|
+
return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("header", { className: cx("pire-pageheader", className), ...rest, children: [
|
|
2506
|
+
/* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { style: { minWidth: 0 }, children: [
|
|
2507
|
+
/* @__PURE__ */ (0, import_jsx_runtime49.jsx)("h1", { className: "pire-pageheader-title", children: title }),
|
|
2508
|
+
subtitle ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("p", { className: "pire-pageheader-sub", children: subtitle }) : null
|
|
2391
2509
|
] }),
|
|
2392
|
-
actions ? /* @__PURE__ */ (0,
|
|
2510
|
+
actions ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "pire-pageheader-actions", children: actions }) : null
|
|
2393
2511
|
] });
|
|
2394
2512
|
}
|
|
2395
2513
|
|
|
2396
2514
|
// src/components/layout/SectionHeader.tsx
|
|
2397
|
-
var
|
|
2515
|
+
var import_jsx_runtime50 = require("react/jsx-runtime");
|
|
2398
2516
|
function SectionHeader({ title, meta, actions, className, ...rest }) {
|
|
2399
|
-
return /* @__PURE__ */ (0,
|
|
2400
|
-
/* @__PURE__ */ (0,
|
|
2401
|
-
meta ? /* @__PURE__ */ (0,
|
|
2402
|
-
actions ? /* @__PURE__ */ (0,
|
|
2517
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: cx("pire-sectionhead", className), ...rest, children: [
|
|
2518
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "pire-eyebrow", children: title }),
|
|
2519
|
+
meta ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { style: { font: "var(--type-caption)", color: "var(--text-tertiary)" }, children: meta }) : null,
|
|
2520
|
+
actions ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "pire-sectionhead-actions", children: actions }) : null
|
|
2403
2521
|
] });
|
|
2404
2522
|
}
|
|
2405
2523
|
|
|
2406
2524
|
// src/components/layout/SelectionBar.tsx
|
|
2407
|
-
var
|
|
2525
|
+
var import_jsx_runtime51 = require("react/jsx-runtime");
|
|
2408
2526
|
function SelectionBar({ count, noun = "record", children, actions, className, ...rest }) {
|
|
2409
2527
|
if (!count) return null;
|
|
2410
|
-
return /* @__PURE__ */ (0,
|
|
2411
|
-
/* @__PURE__ */ (0,
|
|
2528
|
+
return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: cx("pire-selectionbar", className), role: "status", "aria-live": "polite", ...rest, children: [
|
|
2529
|
+
/* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("span", { className: "pire-selectionbar-count", children: [
|
|
2412
2530
|
count.toLocaleString(),
|
|
2413
2531
|
" ",
|
|
2414
2532
|
noun,
|
|
2415
2533
|
count === 1 ? "" : "s",
|
|
2416
2534
|
" selected"
|
|
2417
2535
|
] }),
|
|
2418
|
-
children ? /* @__PURE__ */ (0,
|
|
2419
|
-
actions ? /* @__PURE__ */ (0,
|
|
2536
|
+
children ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { style: { color: "var(--text-secondary)", font: "var(--type-caption)" }, children }) : null,
|
|
2537
|
+
actions ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "pire-selectionbar-actions", children: actions }) : null
|
|
2420
2538
|
] });
|
|
2421
2539
|
}
|
|
2422
2540
|
|
|
2423
2541
|
// src/components/layout/FooterBar.tsx
|
|
2424
|
-
var
|
|
2542
|
+
var import_jsx_runtime52 = require("react/jsx-runtime");
|
|
2425
2543
|
function FooterBar({ note, actions, children, className, ...rest }) {
|
|
2426
|
-
return /* @__PURE__ */ (0,
|
|
2427
|
-
note ? /* @__PURE__ */ (0,
|
|
2544
|
+
return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("footer", { className: cx("pire-footerbar", className), ...rest, children: [
|
|
2545
|
+
note ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "pire-footerbar-note", children: note }) : null,
|
|
2428
2546
|
children,
|
|
2429
|
-
actions ? /* @__PURE__ */ (0,
|
|
2547
|
+
actions ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "pire-footerbar-actions", children: actions }) : null
|
|
2430
2548
|
] });
|
|
2431
2549
|
}
|
|
2432
2550
|
|
|
2433
2551
|
// src/components/patterns/ConfirmDialog.tsx
|
|
2434
|
-
var
|
|
2552
|
+
var import_jsx_runtime53 = require("react/jsx-runtime");
|
|
2435
2553
|
function ConfirmDialog({
|
|
2436
2554
|
isOpen,
|
|
2437
2555
|
title,
|
|
@@ -2445,7 +2563,7 @@ function ConfirmDialog({
|
|
|
2445
2563
|
onConfirm,
|
|
2446
2564
|
onCancel
|
|
2447
2565
|
}) {
|
|
2448
|
-
return /* @__PURE__ */ (0,
|
|
2566
|
+
return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
|
|
2449
2567
|
Dialog,
|
|
2450
2568
|
{
|
|
2451
2569
|
isOpen,
|
|
@@ -2455,12 +2573,12 @@ function ConfirmDialog({
|
|
|
2455
2573
|
onClose: onCancel,
|
|
2456
2574
|
isDismissable: !isBusy,
|
|
2457
2575
|
showClose: false,
|
|
2458
|
-
footer: /* @__PURE__ */ (0,
|
|
2459
|
-
/* @__PURE__ */ (0,
|
|
2460
|
-
/* @__PURE__ */ (0,
|
|
2576
|
+
footer: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_jsx_runtime53.Fragment, { children: [
|
|
2577
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { variant: "tertiary", isDisabled: isBusy, onPress: onCancel, children: cancelLabel }),
|
|
2578
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { variant: tone === "danger" ? "danger" : "primary", isDisabled: isBusy, onPress: onConfirm, children: isBusy ? "Working\u2026" : confirmLabel })
|
|
2461
2579
|
] }),
|
|
2462
2580
|
children: [
|
|
2463
|
-
consequence ? /* @__PURE__ */ (0,
|
|
2581
|
+
consequence ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(InlineMessage, { kind: tone === "danger" ? "error" : "warning", style: { marginBottom: children ? "var(--sp-3)" : 0 }, children: consequence }) : null,
|
|
2464
2582
|
children
|
|
2465
2583
|
]
|
|
2466
2584
|
}
|
|
@@ -2468,12 +2586,12 @@ function ConfirmDialog({
|
|
|
2468
2586
|
}
|
|
2469
2587
|
|
|
2470
2588
|
// src/components/patterns/SidePanel.tsx
|
|
2471
|
-
var
|
|
2472
|
-
var
|
|
2589
|
+
var import_react_aria_components30 = require("react-aria-components");
|
|
2590
|
+
var import_jsx_runtime54 = require("react/jsx-runtime");
|
|
2473
2591
|
function SidePanel({ isOpen, title, subtitle, width = 400, children, footer, onClose, className }) {
|
|
2474
2592
|
const msg = usePireMessages();
|
|
2475
|
-
return /* @__PURE__ */ (0,
|
|
2476
|
-
|
|
2593
|
+
return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
|
|
2594
|
+
import_react_aria_components30.ModalOverlay,
|
|
2477
2595
|
{
|
|
2478
2596
|
className: "pire-sidepanel-overlay",
|
|
2479
2597
|
isOpen,
|
|
@@ -2481,36 +2599,36 @@ function SidePanel({ isOpen, title, subtitle, width = 400, children, footer, onC
|
|
|
2481
2599
|
onOpenChange: (o) => {
|
|
2482
2600
|
if (!o) onClose?.();
|
|
2483
2601
|
},
|
|
2484
|
-
children: /* @__PURE__ */ (0,
|
|
2485
|
-
/* @__PURE__ */ (0,
|
|
2486
|
-
/* @__PURE__ */ (0,
|
|
2487
|
-
/* @__PURE__ */ (0,
|
|
2488
|
-
subtitle ? /* @__PURE__ */ (0,
|
|
2602
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_react_aria_components30.Modal, { className: cx("pire-sidepanel", className), style: { width }, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_react_aria_components30.Dialog, { className: "pire-dialog", style: { height: "100%" }, children: [
|
|
2603
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("header", { className: "pire-dialog-head", children: [
|
|
2604
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { style: { flex: 1, minWidth: 0 }, children: [
|
|
2605
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_react_aria_components30.Heading, { slot: "title", className: "pire-dialog-title", children: title }),
|
|
2606
|
+
subtitle ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("p", { className: "pire-dialog-sub", style: { margin: 0 }, children: subtitle }) : null
|
|
2489
2607
|
] }),
|
|
2490
|
-
/* @__PURE__ */ (0,
|
|
2608
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)(IconButton, { icon: "x", label: msg.sidePanelClose, size: "sm", onPress: onClose })
|
|
2491
2609
|
] }),
|
|
2492
|
-
/* @__PURE__ */ (0,
|
|
2493
|
-
footer ? /* @__PURE__ */ (0,
|
|
2610
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "pire-dialog-body", style: { flex: 1 }, children }),
|
|
2611
|
+
footer ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("footer", { className: "pire-dialog-foot", children: footer }) : null
|
|
2494
2612
|
] }) })
|
|
2495
2613
|
}
|
|
2496
2614
|
);
|
|
2497
2615
|
}
|
|
2498
2616
|
|
|
2499
2617
|
// src/components/patterns/EmptyState.tsx
|
|
2500
|
-
var
|
|
2618
|
+
var import_jsx_runtime55 = require("react/jsx-runtime");
|
|
2501
2619
|
function EmptyState({ icon = "file-text", title, action, compact, children, className, ...rest }) {
|
|
2502
|
-
return /* @__PURE__ */ (0,
|
|
2503
|
-
/* @__PURE__ */ (0,
|
|
2504
|
-
title ? /* @__PURE__ */ (0,
|
|
2505
|
-
children ? /* @__PURE__ */ (0,
|
|
2620
|
+
return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: cx("pire-empty", className), "data-compact": compact ? "true" : void 0, ...rest, children: [
|
|
2621
|
+
/* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Icon, { name: icon, size: 24, className: "pire-empty-icon" }),
|
|
2622
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("p", { className: "pire-empty-title", style: { margin: 0 }, children: title }) : null,
|
|
2623
|
+
children ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("p", { className: "pire-empty-body", style: { margin: 0 }, children }) : null,
|
|
2506
2624
|
action
|
|
2507
2625
|
] });
|
|
2508
2626
|
}
|
|
2509
2627
|
|
|
2510
2628
|
// src/components/patterns/FileDropZone.tsx
|
|
2511
2629
|
var React13 = __toESM(require("react"), 1);
|
|
2512
|
-
var
|
|
2513
|
-
var
|
|
2630
|
+
var import_react_aria_components31 = require("react-aria-components");
|
|
2631
|
+
var import_jsx_runtime56 = require("react/jsx-runtime");
|
|
2514
2632
|
var isImage2 = (file) => file.type.startsWith("image/");
|
|
2515
2633
|
function FileDropZone({
|
|
2516
2634
|
label,
|
|
@@ -2559,43 +2677,43 @@ function FileDropZone({
|
|
|
2559
2677
|
commit(allowsMultiple ? [...files, ...wrapped] : wrapped.slice(0, 1));
|
|
2560
2678
|
};
|
|
2561
2679
|
const remove = (target) => commit(files.filter((f) => f.file !== target));
|
|
2562
|
-
return /* @__PURE__ */ (0,
|
|
2563
|
-
label ? /* @__PURE__ */ (0,
|
|
2680
|
+
return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: cx("pire-field", className), style, "data-full-width": String(fullWidth), children: [
|
|
2681
|
+
label ? /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("span", { className: "pire-field-label", children: [
|
|
2564
2682
|
label,
|
|
2565
|
-
isRequired ? /* @__PURE__ */ (0,
|
|
2683
|
+
isRequired ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "pire-field-req", "aria-hidden": "true", children: "*" }) : null
|
|
2566
2684
|
] }) : null,
|
|
2567
|
-
/* @__PURE__ */ (0,
|
|
2568
|
-
|
|
2685
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
|
|
2686
|
+
import_react_aria_components31.DropZone,
|
|
2569
2687
|
{
|
|
2570
2688
|
className: "pire-dropzone",
|
|
2571
2689
|
"data-height": height,
|
|
2572
2690
|
isDisabled: isDisabled || isReadOnly,
|
|
2573
2691
|
onDrop: async (e) => {
|
|
2574
2692
|
const dropped = await Promise.all(
|
|
2575
|
-
e.items.filter(
|
|
2693
|
+
e.items.filter(import_react_aria_components31.isFileDropItem).map((item) => item.getFile())
|
|
2576
2694
|
);
|
|
2577
2695
|
accept(dropped);
|
|
2578
2696
|
},
|
|
2579
2697
|
children: [
|
|
2580
|
-
/* @__PURE__ */ (0,
|
|
2581
|
-
/* @__PURE__ */ (0,
|
|
2582
|
-
/* @__PURE__ */ (0,
|
|
2583
|
-
|
|
2698
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Icon, { name: "download", size: 24, className: "pire-dropzone-icon" }),
|
|
2699
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "pire-dropzone-prompt", children: promptLabel ?? msg.fileDropZonePrompt }),
|
|
2700
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
|
|
2701
|
+
import_react_aria_components31.FileTrigger,
|
|
2584
2702
|
{
|
|
2585
2703
|
acceptedFileTypes,
|
|
2586
2704
|
allowsMultiple,
|
|
2587
2705
|
onSelect: (list) => accept(list ? [...list] : []),
|
|
2588
|
-
children: /* @__PURE__ */ (0,
|
|
2706
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Button, { variant: "secondary", isDisabled: isDisabled || isReadOnly, children: msg.fileUploadChoose })
|
|
2589
2707
|
}
|
|
2590
2708
|
)
|
|
2591
2709
|
]
|
|
2592
2710
|
}
|
|
2593
2711
|
),
|
|
2594
|
-
files.length ? /* @__PURE__ */ (0,
|
|
2595
|
-
previewUrl ? /* @__PURE__ */ (0,
|
|
2596
|
-
/* @__PURE__ */ (0,
|
|
2597
|
-
/* @__PURE__ */ (0,
|
|
2598
|
-
isDisabled || isReadOnly ? null : /* @__PURE__ */ (0,
|
|
2712
|
+
files.length ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("ul", { className: "pire-fileupload-list", children: files.map(({ file, previewUrl }) => /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("li", { className: "pire-fileupload-item", children: [
|
|
2713
|
+
previewUrl ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("img", { className: "pire-fileupload-thumb", src: previewUrl, alt: "" }) : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Icon, { name: "file-text", size: 16, className: "pire-fileupload-icon" }),
|
|
2714
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "pire-fileupload-name", children: file.name }),
|
|
2715
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "pire-fileupload-size", children: formatFileSize(file.size) }),
|
|
2716
|
+
isDisabled || isReadOnly ? null : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
|
|
2599
2717
|
IconButton,
|
|
2600
2718
|
{
|
|
2601
2719
|
icon: "x",
|
|
@@ -2605,14 +2723,14 @@ function FileDropZone({
|
|
|
2605
2723
|
}
|
|
2606
2724
|
)
|
|
2607
2725
|
] }, `${file.name}-${file.size}-${file.lastModified}`)) }) : null,
|
|
2608
|
-
uploadProgress != null ? /* @__PURE__ */ (0,
|
|
2609
|
-
description ? /* @__PURE__ */ (0,
|
|
2610
|
-
isInvalid && errorMessage ? /* @__PURE__ */ (0,
|
|
2726
|
+
uploadProgress != null ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(ProgressBar, { value: uploadProgress, label: msg.fileUploadUploading }) : null,
|
|
2727
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "pire-field-hint", children: description }) : null,
|
|
2728
|
+
isInvalid && errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "pire-field-error", children: errorMessage }) : null
|
|
2611
2729
|
] });
|
|
2612
2730
|
}
|
|
2613
2731
|
|
|
2614
2732
|
// src/index.ts
|
|
2615
|
-
var
|
|
2733
|
+
var import_react_aria_components32 = require("react-aria-components");
|
|
2616
2734
|
// Annotate the CommonJS export names for ESM import in node:
|
|
2617
2735
|
0 && (module.exports = {
|
|
2618
2736
|
Avatar,
|
|
@@ -2625,6 +2743,7 @@ var import_react_aria_components31 = require("react-aria-components");
|
|
|
2625
2743
|
ConfirmDialog,
|
|
2626
2744
|
DataTable,
|
|
2627
2745
|
DatePicker,
|
|
2746
|
+
DateRangePicker,
|
|
2628
2747
|
DescriptionList,
|
|
2629
2748
|
Dialog,
|
|
2630
2749
|
DialogTrigger,
|
|
@@ -2687,6 +2806,7 @@ var import_react_aria_components31 = require("react-aria-components");
|
|
|
2687
2806
|
enMessages,
|
|
2688
2807
|
esMessages,
|
|
2689
2808
|
formatFileSize,
|
|
2809
|
+
rangeLengthInDays,
|
|
2690
2810
|
usePireMessages,
|
|
2691
2811
|
useToast
|
|
2692
2812
|
});
|