@orianatech/pire 0.4.0 → 0.6.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/NOTICE +19 -0
- package/dist/components/core/Heading.d.cts +15 -0
- package/dist/components/core/Heading.d.ts +16 -0
- package/dist/components/core/Heading.d.ts.map +1 -0
- package/dist/components/core/Link.d.cts +13 -0
- package/dist/components/core/Link.d.ts +14 -0
- package/dist/components/core/Link.d.ts.map +1 -0
- package/dist/components/core/Separator.d.cts +12 -0
- package/dist/components/core/Separator.d.ts +13 -0
- package/dist/components/core/Separator.d.ts.map +1 -0
- package/dist/components/core/Text.d.cts +29 -0
- package/dist/components/core/Text.d.ts +30 -0
- package/dist/components/core/Text.d.ts.map +1 -0
- package/dist/components/data/DataTable.d.ts.map +1 -1
- package/dist/components/data/FilterBar.d.cts +7 -1
- package/dist/components/data/FilterBar.d.ts +7 -1
- package/dist/components/data/FilterBar.d.ts.map +1 -1
- package/dist/components/feedback/Dialog.d.ts.map +1 -1
- package/dist/components/feedback/InlineMessage.d.ts.map +1 -1
- package/dist/components/feedback/Toast.d.ts.map +1 -1
- package/dist/components/forms/ComboBox.d.ts.map +1 -1
- package/dist/components/forms/DatePicker.d.ts.map +1 -1
- package/dist/components/forms/MultiComboBox.d.ts.map +1 -1
- package/dist/components/forms/NumberField.d.ts.map +1 -1
- package/dist/components/forms/ValueHelpField.d.ts.map +1 -1
- package/dist/components/navigation/Menu.d.cts +39 -0
- package/dist/components/navigation/Menu.d.ts +40 -0
- package/dist/components/navigation/Menu.d.ts.map +1 -0
- package/dist/components/navigation/Pagination.d.ts.map +1 -1
- package/dist/components/navigation/SideNav.d.ts.map +1 -1
- package/dist/components/patterns/SidePanel.d.ts.map +1 -1
- package/dist/components/patterns/ValueHelpDialog.d.ts.map +1 -1
- package/dist/components.css +67 -0
- package/dist/fonts/LICENSE-jetbrains-mono.txt +93 -0
- package/dist/fonts/LICENSE-public-sans.txt +93 -0
- package/dist/fonts/jetbrains-mono-latin-400-normal.woff2 +0 -0
- package/dist/fonts/jetbrains-mono-latin-500-normal.woff2 +0 -0
- package/dist/fonts/jetbrains-mono-latin-600-normal.woff2 +0 -0
- package/dist/fonts/public-sans-latin-400-normal.woff2 +0 -0
- package/dist/fonts/public-sans-latin-500-normal.woff2 +0 -0
- package/dist/fonts/public-sans-latin-600-normal.woff2 +0 -0
- package/dist/fonts/public-sans-latin-700-normal.woff2 +0 -0
- package/dist/i18n/PireIntlProvider.d.cts +21 -0
- package/dist/i18n/PireIntlProvider.d.ts +22 -0
- package/dist/i18n/PireIntlProvider.d.ts.map +1 -0
- package/dist/i18n/messages.d.cts +64 -0
- package/dist/i18n/messages.d.ts +65 -0
- package/dist/i18n/messages.d.ts.map +1 -0
- package/dist/index.cjs +674 -399
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +8 -1
- package/dist/index.d.ts +8 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +628 -359
- package/dist/index.js.map +1 -1
- package/dist/tokens/fonts.css +20 -15
- package/dist/tokens/typography.css +5 -0
- package/package.json +5 -2
package/dist/index.js
CHANGED
|
@@ -388,25 +388,131 @@ function SegmentedControl({
|
|
|
388
388
|
);
|
|
389
389
|
}
|
|
390
390
|
|
|
391
|
+
// src/components/core/Text.tsx
|
|
392
|
+
import { jsx as jsx10 } from "react/jsx-runtime";
|
|
393
|
+
function Text({
|
|
394
|
+
size = "body",
|
|
395
|
+
color = "primary",
|
|
396
|
+
weight = "regular",
|
|
397
|
+
numeric,
|
|
398
|
+
eyebrow,
|
|
399
|
+
truncate,
|
|
400
|
+
elementType: Wrapper = "p",
|
|
401
|
+
className,
|
|
402
|
+
style,
|
|
403
|
+
...rest
|
|
404
|
+
}) {
|
|
405
|
+
const lineClamp = typeof truncate === "number" ? truncate : truncate ? 1 : void 0;
|
|
406
|
+
const clampStyle = lineClamp == null ? style : { ["--pire-text-clamp"]: lineClamp, ...style };
|
|
407
|
+
return /* @__PURE__ */ jsx10(
|
|
408
|
+
Wrapper,
|
|
409
|
+
{
|
|
410
|
+
className: cx("pire-text", className),
|
|
411
|
+
"data-size": size,
|
|
412
|
+
"data-color": color,
|
|
413
|
+
"data-weight": weight === "strong" ? "strong" : void 0,
|
|
414
|
+
"data-numeric": numeric ? "true" : void 0,
|
|
415
|
+
"data-eyebrow": eyebrow ? "true" : void 0,
|
|
416
|
+
"data-truncate": lineClamp != null ? "true" : void 0,
|
|
417
|
+
style: clampStyle,
|
|
418
|
+
...rest
|
|
419
|
+
}
|
|
420
|
+
);
|
|
421
|
+
}
|
|
422
|
+
function Strong({ className, ...rest }) {
|
|
423
|
+
return /* @__PURE__ */ jsx10(Text, { elementType: "span", weight: "strong", className, ...rest });
|
|
424
|
+
}
|
|
425
|
+
|
|
426
|
+
// src/components/core/Heading.tsx
|
|
427
|
+
import { Heading as AriaHeading } from "react-aria-components";
|
|
428
|
+
import { jsx as jsx11 } from "react/jsx-runtime";
|
|
429
|
+
function Heading({
|
|
430
|
+
level = 2,
|
|
431
|
+
size,
|
|
432
|
+
color = "primary",
|
|
433
|
+
truncate,
|
|
434
|
+
className,
|
|
435
|
+
style,
|
|
436
|
+
...rest
|
|
437
|
+
}) {
|
|
438
|
+
const lineClamp = typeof truncate === "number" ? truncate : truncate ? 1 : void 0;
|
|
439
|
+
const clampStyle = lineClamp == null ? style : { ["--pire-text-clamp"]: lineClamp, ...style };
|
|
440
|
+
return /* @__PURE__ */ jsx11(
|
|
441
|
+
AriaHeading,
|
|
442
|
+
{
|
|
443
|
+
level,
|
|
444
|
+
className: cx("pire-heading", className),
|
|
445
|
+
"data-size": size ?? `h${level}`,
|
|
446
|
+
"data-color": color,
|
|
447
|
+
"data-truncate": lineClamp != null ? "true" : void 0,
|
|
448
|
+
style: clampStyle,
|
|
449
|
+
...rest
|
|
450
|
+
}
|
|
451
|
+
);
|
|
452
|
+
}
|
|
453
|
+
|
|
454
|
+
// src/components/core/Link.tsx
|
|
455
|
+
import { Link as AriaLink } from "react-aria-components";
|
|
456
|
+
import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
457
|
+
function Link({ children, size, isExternal, className, rel, ...rest }) {
|
|
458
|
+
return /* @__PURE__ */ jsxs7(
|
|
459
|
+
AriaLink,
|
|
460
|
+
{
|
|
461
|
+
className: cx("pire-link", className),
|
|
462
|
+
"data-size": size,
|
|
463
|
+
"data-external": isExternal ? "true" : void 0,
|
|
464
|
+
rel: isExternal ? rel ?? "noopener noreferrer" : rel,
|
|
465
|
+
...rest,
|
|
466
|
+
children: [
|
|
467
|
+
children,
|
|
468
|
+
isExternal ? /* @__PURE__ */ jsx12(Icon, { name: "external-link", size: 12, className: "pire-link-external" }) : null
|
|
469
|
+
]
|
|
470
|
+
}
|
|
471
|
+
);
|
|
472
|
+
}
|
|
473
|
+
|
|
474
|
+
// src/components/core/Separator.tsx
|
|
475
|
+
import { Separator as AriaSeparator } from "react-aria-components";
|
|
476
|
+
import { jsx as jsx13 } from "react/jsx-runtime";
|
|
477
|
+
function Separator({
|
|
478
|
+
orientation = "horizontal",
|
|
479
|
+
emphasis = "default",
|
|
480
|
+
spacing = "md",
|
|
481
|
+
className,
|
|
482
|
+
...rest
|
|
483
|
+
}) {
|
|
484
|
+
return /* @__PURE__ */ jsx13(
|
|
485
|
+
AriaSeparator,
|
|
486
|
+
{
|
|
487
|
+
orientation,
|
|
488
|
+
className: cx("pire-separator", className),
|
|
489
|
+
"data-orientation": orientation,
|
|
490
|
+
"data-emphasis": emphasis,
|
|
491
|
+
"data-spacing": spacing,
|
|
492
|
+
...rest
|
|
493
|
+
}
|
|
494
|
+
);
|
|
495
|
+
}
|
|
496
|
+
|
|
391
497
|
// src/components/forms/FormField.tsx
|
|
392
|
-
import { jsx as
|
|
498
|
+
import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
393
499
|
function FormField({ label, htmlFor, isRequired, hint, error, layout = "stacked", children, className, ...rest }) {
|
|
394
|
-
return /* @__PURE__ */
|
|
395
|
-
/* @__PURE__ */
|
|
500
|
+
return /* @__PURE__ */ jsxs8("div", { className: cx("pire-field", className), "data-layout": layout, ...rest, children: [
|
|
501
|
+
/* @__PURE__ */ jsxs8("label", { className: "pire-field-label", htmlFor, children: [
|
|
396
502
|
label,
|
|
397
|
-
isRequired ? /* @__PURE__ */
|
|
503
|
+
isRequired ? /* @__PURE__ */ jsx14("span", { className: "pire-field-req", "aria-hidden": "true", children: "*" }) : null
|
|
398
504
|
] }),
|
|
399
505
|
children,
|
|
400
|
-
error ? /* @__PURE__ */
|
|
401
|
-
/* @__PURE__ */
|
|
506
|
+
error ? /* @__PURE__ */ jsxs8("span", { className: "pire-field-error", role: "alert", children: [
|
|
507
|
+
/* @__PURE__ */ jsx14(Icon, { name: "alert-circle", size: 12 }),
|
|
402
508
|
error
|
|
403
|
-
] }) : hint ? /* @__PURE__ */
|
|
509
|
+
] }) : hint ? /* @__PURE__ */ jsx14("span", { className: "pire-field-hint", children: hint }) : null
|
|
404
510
|
] });
|
|
405
511
|
}
|
|
406
512
|
|
|
407
513
|
// src/components/forms/Input.tsx
|
|
408
|
-
import { TextField, Label, Input as AriaInput, Group, Text, FieldError } from "react-aria-components";
|
|
409
|
-
import { jsx as
|
|
514
|
+
import { TextField, Label, Input as AriaInput, Group, Text as Text2, FieldError } from "react-aria-components";
|
|
515
|
+
import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
410
516
|
function Input({
|
|
411
517
|
label,
|
|
412
518
|
icon,
|
|
@@ -422,7 +528,7 @@ function Input({
|
|
|
422
528
|
onChange,
|
|
423
529
|
...rest
|
|
424
530
|
}) {
|
|
425
|
-
return /* @__PURE__ */
|
|
531
|
+
return /* @__PURE__ */ jsxs9(
|
|
426
532
|
TextField,
|
|
427
533
|
{
|
|
428
534
|
className: cx("pire-field", className),
|
|
@@ -431,11 +537,11 @@ function Input({
|
|
|
431
537
|
validationBehavior: "aria",
|
|
432
538
|
...rest,
|
|
433
539
|
children: [
|
|
434
|
-
label ? /* @__PURE__ */
|
|
540
|
+
label ? /* @__PURE__ */ jsxs9(Label, { className: "pire-field-label", children: [
|
|
435
541
|
label,
|
|
436
|
-
rest.isRequired ? /* @__PURE__ */
|
|
542
|
+
rest.isRequired ? /* @__PURE__ */ jsx15("span", { className: "pire-field-req", "aria-hidden": "true", children: "*" }) : null
|
|
437
543
|
] }) : null,
|
|
438
|
-
/* @__PURE__ */
|
|
544
|
+
/* @__PURE__ */ jsxs9(
|
|
439
545
|
Group,
|
|
440
546
|
{
|
|
441
547
|
className: "pire-control",
|
|
@@ -444,14 +550,14 @@ function Input({
|
|
|
444
550
|
"data-invalid": rest.isInvalid ? "true" : void 0,
|
|
445
551
|
"data-readonly": rest.isReadOnly ? "true" : void 0,
|
|
446
552
|
children: [
|
|
447
|
-
icon ? /* @__PURE__ */
|
|
448
|
-
/* @__PURE__ */
|
|
449
|
-
suffix ? /* @__PURE__ */
|
|
553
|
+
icon ? /* @__PURE__ */ jsx15(Icon, { name: icon, size: 16, className: "pire-leading-icon" }) : null,
|
|
554
|
+
/* @__PURE__ */ jsx15(AriaInput, { ref: inputRef, className: "pire-input", "data-numeric": numeric ? "true" : void 0 }),
|
|
555
|
+
suffix ? /* @__PURE__ */ jsx15("span", { className: "pire-affix", children: suffix }) : null
|
|
450
556
|
]
|
|
451
557
|
}
|
|
452
558
|
),
|
|
453
|
-
description ? /* @__PURE__ */
|
|
454
|
-
/* @__PURE__ */
|
|
559
|
+
description ? /* @__PURE__ */ jsx15(Text2, { slot: "description", className: "pire-field-hint", children: description }) : null,
|
|
560
|
+
/* @__PURE__ */ jsx15(FieldError, { className: "pire-field-error", children: errorMessage })
|
|
455
561
|
]
|
|
456
562
|
}
|
|
457
563
|
);
|
|
@@ -459,8 +565,8 @@ function Input({
|
|
|
459
565
|
|
|
460
566
|
// src/components/forms/TextArea.tsx
|
|
461
567
|
import * as React5 from "react";
|
|
462
|
-
import { TextField as TextField2, Label as Label2, TextArea as AriaTextArea, Group as Group2, Text as
|
|
463
|
-
import { jsx as
|
|
568
|
+
import { TextField as TextField2, Label as Label2, TextArea as AriaTextArea, Group as Group2, Text as Text3, FieldError as FieldError2 } from "react-aria-components";
|
|
569
|
+
import { jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
464
570
|
var useIsomorphicLayoutEffect = typeof document === "undefined" ? React5.useEffect : React5.useLayoutEffect;
|
|
465
571
|
function TextArea({
|
|
466
572
|
label,
|
|
@@ -501,7 +607,7 @@ function TextArea({
|
|
|
501
607
|
}
|
|
502
608
|
grow();
|
|
503
609
|
}, [autoGrow, grow, rest.value]);
|
|
504
|
-
return /* @__PURE__ */
|
|
610
|
+
return /* @__PURE__ */ jsxs10(
|
|
505
611
|
TextField2,
|
|
506
612
|
{
|
|
507
613
|
className: cx("pire-field", className),
|
|
@@ -510,11 +616,11 @@ function TextArea({
|
|
|
510
616
|
validationBehavior: "aria",
|
|
511
617
|
...rest,
|
|
512
618
|
children: [
|
|
513
|
-
label ? /* @__PURE__ */
|
|
619
|
+
label ? /* @__PURE__ */ jsxs10(Label2, { className: "pire-field-label", children: [
|
|
514
620
|
label,
|
|
515
|
-
rest.isRequired ? /* @__PURE__ */
|
|
621
|
+
rest.isRequired ? /* @__PURE__ */ jsx16("span", { className: "pire-field-req", "aria-hidden": "true", children: "*" }) : null
|
|
516
622
|
] }) : null,
|
|
517
|
-
/* @__PURE__ */
|
|
623
|
+
/* @__PURE__ */ jsx16(
|
|
518
624
|
Group2,
|
|
519
625
|
{
|
|
520
626
|
className: "pire-control",
|
|
@@ -523,7 +629,7 @@ function TextArea({
|
|
|
523
629
|
"data-multiline": "true",
|
|
524
630
|
"data-invalid": rest.isInvalid ? "true" : void 0,
|
|
525
631
|
"data-readonly": rest.isReadOnly ? "true" : void 0,
|
|
526
|
-
children: /* @__PURE__ */
|
|
632
|
+
children: /* @__PURE__ */ jsx16(
|
|
527
633
|
AriaTextArea,
|
|
528
634
|
{
|
|
529
635
|
ref,
|
|
@@ -535,8 +641,8 @@ function TextArea({
|
|
|
535
641
|
)
|
|
536
642
|
}
|
|
537
643
|
),
|
|
538
|
-
description ? /* @__PURE__ */
|
|
539
|
-
/* @__PURE__ */
|
|
644
|
+
description ? /* @__PURE__ */ jsx16(Text3, { slot: "description", className: "pire-field-hint", children: description }) : null,
|
|
645
|
+
/* @__PURE__ */ jsx16(FieldError2, { className: "pire-field-error", children: errorMessage })
|
|
540
646
|
]
|
|
541
647
|
}
|
|
542
648
|
);
|
|
@@ -551,10 +657,10 @@ import {
|
|
|
551
657
|
Popover,
|
|
552
658
|
ListBox,
|
|
553
659
|
ListBoxItem,
|
|
554
|
-
Text as
|
|
660
|
+
Text as Text4,
|
|
555
661
|
FieldError as FieldError3
|
|
556
662
|
} from "react-aria-components";
|
|
557
|
-
import { jsx as
|
|
663
|
+
import { jsx as jsx17, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
558
664
|
var norm = (o) => typeof o === "string" ? { value: o, label: o, isDisabled: false } : o;
|
|
559
665
|
function Select({
|
|
560
666
|
label,
|
|
@@ -572,7 +678,7 @@ function Select({
|
|
|
572
678
|
...rest
|
|
573
679
|
}) {
|
|
574
680
|
const items = options.map(norm);
|
|
575
|
-
return /* @__PURE__ */
|
|
681
|
+
return /* @__PURE__ */ jsxs11(
|
|
576
682
|
AriaSelect,
|
|
577
683
|
{
|
|
578
684
|
className: cx("pire-field", className),
|
|
@@ -584,11 +690,11 @@ function Select({
|
|
|
584
690
|
validationBehavior: "aria",
|
|
585
691
|
...rest,
|
|
586
692
|
children: [
|
|
587
|
-
label ? /* @__PURE__ */
|
|
693
|
+
label ? /* @__PURE__ */ jsxs11(Label3, { className: "pire-field-label", children: [
|
|
588
694
|
label,
|
|
589
|
-
rest.isRequired ? /* @__PURE__ */
|
|
695
|
+
rest.isRequired ? /* @__PURE__ */ jsx17("span", { className: "pire-field-req", "aria-hidden": "true", children: "*" }) : null
|
|
590
696
|
] }) : null,
|
|
591
|
-
/* @__PURE__ */
|
|
697
|
+
/* @__PURE__ */ jsxs11(
|
|
592
698
|
AriaButton4,
|
|
593
699
|
{
|
|
594
700
|
className: "pire-control",
|
|
@@ -596,14 +702,14 @@ function Select({
|
|
|
596
702
|
"data-full-width": String(fullWidth),
|
|
597
703
|
"data-invalid": rest.isInvalid ? "true" : void 0,
|
|
598
704
|
children: [
|
|
599
|
-
/* @__PURE__ */
|
|
600
|
-
/* @__PURE__ */
|
|
705
|
+
/* @__PURE__ */ jsx17(SelectValue, { className: "pire-select-value" }),
|
|
706
|
+
/* @__PURE__ */ jsx17(Icon, { name: "chevron-down", size: 16, className: "pire-leading-icon" })
|
|
601
707
|
]
|
|
602
708
|
}
|
|
603
709
|
),
|
|
604
|
-
description ? /* @__PURE__ */
|
|
605
|
-
/* @__PURE__ */
|
|
606
|
-
/* @__PURE__ */
|
|
710
|
+
description ? /* @__PURE__ */ jsx17(Text4, { slot: "description", className: "pire-field-hint", children: description }) : null,
|
|
711
|
+
/* @__PURE__ */ jsx17(FieldError3, { className: "pire-field-error", children: errorMessage }),
|
|
712
|
+
/* @__PURE__ */ jsx17(Popover, { className: "pire-popover", children: /* @__PURE__ */ jsx17(ListBox, { className: "pire-listbox", items, children: (item) => /* @__PURE__ */ jsx17(ListBoxItem, { className: "pire-option", id: item.value, textValue: item.label, isDisabled: item.isDisabled, children: item.label }) }) })
|
|
607
713
|
]
|
|
608
714
|
}
|
|
609
715
|
);
|
|
@@ -611,13 +717,13 @@ function Select({
|
|
|
611
717
|
|
|
612
718
|
// src/components/forms/Checkbox.tsx
|
|
613
719
|
import { Checkbox as AriaCheckbox } from "react-aria-components";
|
|
614
|
-
import { Fragment, jsx as
|
|
720
|
+
import { Fragment, jsx as jsx18, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
615
721
|
function Checkbox({ label, hint, children, className, ...rest }) {
|
|
616
|
-
return /* @__PURE__ */
|
|
617
|
-
/* @__PURE__ */
|
|
618
|
-
/* @__PURE__ */
|
|
722
|
+
return /* @__PURE__ */ jsx18(AriaCheckbox, { className: cx("pire-choice", className), ...rest, children: ({ isSelected, isIndeterminate }) => /* @__PURE__ */ jsxs12(Fragment, { children: [
|
|
723
|
+
/* @__PURE__ */ jsx18("span", { className: "pire-choice-box", "aria-hidden": "true", children: isIndeterminate ? /* @__PURE__ */ jsx18(Icon, { name: "minus", size: 12 }) : isSelected ? /* @__PURE__ */ jsx18(Icon, { name: "check", size: 12 }) : null }),
|
|
724
|
+
/* @__PURE__ */ jsxs12("span", { children: [
|
|
619
725
|
label ?? children,
|
|
620
|
-
hint ? /* @__PURE__ */
|
|
726
|
+
hint ? /* @__PURE__ */ jsx18("span", { className: "pire-choice-hint", children: hint }) : null
|
|
621
727
|
] })
|
|
622
728
|
] }) });
|
|
623
729
|
}
|
|
@@ -627,35 +733,35 @@ import {
|
|
|
627
733
|
RadioGroup as AriaRadioGroup,
|
|
628
734
|
Radio as AriaRadio,
|
|
629
735
|
Label as Label4,
|
|
630
|
-
Text as
|
|
736
|
+
Text as Text5,
|
|
631
737
|
FieldError as FieldError4
|
|
632
738
|
} from "react-aria-components";
|
|
633
|
-
import { jsx as
|
|
739
|
+
import { jsx as jsx19, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
634
740
|
function RadioGroup({ label, description, errorMessage, children, className, ...rest }) {
|
|
635
|
-
return /* @__PURE__ */
|
|
636
|
-
label ? /* @__PURE__ */
|
|
637
|
-
/* @__PURE__ */
|
|
638
|
-
description ? /* @__PURE__ */
|
|
639
|
-
/* @__PURE__ */
|
|
741
|
+
return /* @__PURE__ */ jsxs13(AriaRadioGroup, { className: cx("pire-field", className), validationBehavior: "aria", ...rest, children: [
|
|
742
|
+
label ? /* @__PURE__ */ jsx19(Label4, { className: "pire-field-label", children: label }) : null,
|
|
743
|
+
/* @__PURE__ */ jsx19("div", { className: "pire-radiogroup", children }),
|
|
744
|
+
description ? /* @__PURE__ */ jsx19(Text5, { slot: "description", className: "pire-field-hint", children: description }) : null,
|
|
745
|
+
/* @__PURE__ */ jsx19(FieldError4, { className: "pire-field-error", children: errorMessage })
|
|
640
746
|
] });
|
|
641
747
|
}
|
|
642
748
|
function Radio({ label, hint, children, className, ...rest }) {
|
|
643
|
-
return /* @__PURE__ */
|
|
644
|
-
/* @__PURE__ */
|
|
645
|
-
/* @__PURE__ */
|
|
749
|
+
return /* @__PURE__ */ jsxs13(AriaRadio, { className: cx("pire-choice", className), ...rest, children: [
|
|
750
|
+
/* @__PURE__ */ jsx19("span", { className: "pire-choice-box", "data-radio": "true", "aria-hidden": "true" }),
|
|
751
|
+
/* @__PURE__ */ jsxs13("span", { children: [
|
|
646
752
|
label ?? children,
|
|
647
|
-
hint ? /* @__PURE__ */
|
|
753
|
+
hint ? /* @__PURE__ */ jsx19("span", { className: "pire-choice-hint", children: hint }) : null
|
|
648
754
|
] })
|
|
649
755
|
] });
|
|
650
756
|
}
|
|
651
757
|
|
|
652
758
|
// src/components/forms/Switch.tsx
|
|
653
759
|
import { Switch as AriaSwitch } from "react-aria-components";
|
|
654
|
-
import { jsx as
|
|
760
|
+
import { jsx as jsx20, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
655
761
|
function Switch({ label, children, className, ...rest }) {
|
|
656
|
-
return /* @__PURE__ */
|
|
657
|
-
/* @__PURE__ */
|
|
658
|
-
/* @__PURE__ */
|
|
762
|
+
return /* @__PURE__ */ jsxs14(AriaSwitch, { className: cx("pire-choice", className), ...rest, children: [
|
|
763
|
+
/* @__PURE__ */ jsx20("span", { className: "pire-switch-track", "aria-hidden": "true", children: /* @__PURE__ */ jsx20("span", { className: "pire-switch-thumb" }) }),
|
|
764
|
+
/* @__PURE__ */ jsx20("span", { children: label ?? children })
|
|
659
765
|
] });
|
|
660
766
|
}
|
|
661
767
|
|
|
@@ -669,10 +775,95 @@ import {
|
|
|
669
775
|
Popover as Popover2,
|
|
670
776
|
ListBox as ListBox2,
|
|
671
777
|
ListBoxItem as ListBoxItem2,
|
|
672
|
-
Text as
|
|
778
|
+
Text as Text6,
|
|
673
779
|
FieldError as FieldError5
|
|
674
780
|
} from "react-aria-components";
|
|
675
|
-
|
|
781
|
+
|
|
782
|
+
// src/i18n/PireIntlProvider.tsx
|
|
783
|
+
import * as React6 from "react";
|
|
784
|
+
|
|
785
|
+
// src/i18n/messages.ts
|
|
786
|
+
var enMessages = {
|
|
787
|
+
filterBarLabel: "Filters",
|
|
788
|
+
filterBarGo: "Go",
|
|
789
|
+
filterBarClearAll: "Clear all",
|
|
790
|
+
dataTableSelectAll: "Select all rows",
|
|
791
|
+
dataTableSelectRow: "Select row",
|
|
792
|
+
dialogClose: "Close",
|
|
793
|
+
sidePanelClose: "Close panel",
|
|
794
|
+
inlineMessageDismiss: "Dismiss message",
|
|
795
|
+
toastDismiss: "Dismiss",
|
|
796
|
+
toastRegionLabel: "Notifications",
|
|
797
|
+
comboBoxShowSuggestions: "Show suggestions",
|
|
798
|
+
datePickerOpenCalendar: "Open calendar",
|
|
799
|
+
datePickerPreviousMonth: "Previous month",
|
|
800
|
+
datePickerNextMonth: "Next month",
|
|
801
|
+
numberFieldIncrease: "Increase",
|
|
802
|
+
numberFieldDecrease: "Decrease",
|
|
803
|
+
valueHelpFieldClear: "Clear selection",
|
|
804
|
+
valueHelpFieldOpenNamed: "Select {label}",
|
|
805
|
+
valueHelpFieldOpen: "Open value help",
|
|
806
|
+
valueHelpDialogSearch: "Search records",
|
|
807
|
+
valueHelpDialogCancel: "Cancel",
|
|
808
|
+
paginationLabel: "Pagination",
|
|
809
|
+
paginationRange: "{from}\u2013{to} of {total}",
|
|
810
|
+
paginationPageOf: "Page {page} of {pages}",
|
|
811
|
+
paginationPrevious: "Previous page",
|
|
812
|
+
paginationNext: "Next page",
|
|
813
|
+
paginationRowsPerPage: "Rows per page",
|
|
814
|
+
sideNavLabel: "Main navigation"
|
|
815
|
+
};
|
|
816
|
+
var esMessages = {
|
|
817
|
+
filterBarLabel: "Filtros",
|
|
818
|
+
filterBarGo: "Buscar",
|
|
819
|
+
filterBarClearAll: "Limpiar todo",
|
|
820
|
+
dataTableSelectAll: "Seleccionar todas las filas",
|
|
821
|
+
dataTableSelectRow: "Seleccionar fila",
|
|
822
|
+
dialogClose: "Cerrar",
|
|
823
|
+
sidePanelClose: "Cerrar panel",
|
|
824
|
+
inlineMessageDismiss: "Descartar mensaje",
|
|
825
|
+
toastDismiss: "Descartar",
|
|
826
|
+
toastRegionLabel: "Notificaciones",
|
|
827
|
+
comboBoxShowSuggestions: "Mostrar sugerencias",
|
|
828
|
+
datePickerOpenCalendar: "Abrir calendario",
|
|
829
|
+
datePickerPreviousMonth: "Mes anterior",
|
|
830
|
+
datePickerNextMonth: "Mes siguiente",
|
|
831
|
+
numberFieldIncrease: "Aumentar",
|
|
832
|
+
numberFieldDecrease: "Disminuir",
|
|
833
|
+
valueHelpFieldClear: "Limpiar selecci\xF3n",
|
|
834
|
+
valueHelpFieldOpenNamed: "Seleccionar {label}",
|
|
835
|
+
valueHelpFieldOpen: "Abrir ayuda de valores",
|
|
836
|
+
valueHelpDialogSearch: "Buscar registros",
|
|
837
|
+
valueHelpDialogCancel: "Cancelar",
|
|
838
|
+
paginationLabel: "Paginaci\xF3n",
|
|
839
|
+
paginationRange: "{from}\u2013{to} de {total}",
|
|
840
|
+
paginationPageOf: "P\xE1gina {page} de {pages}",
|
|
841
|
+
paginationPrevious: "P\xE1gina anterior",
|
|
842
|
+
paginationNext: "P\xE1gina siguiente",
|
|
843
|
+
paginationRowsPerPage: "Filas por p\xE1gina",
|
|
844
|
+
sideNavLabel: "Navegaci\xF3n principal"
|
|
845
|
+
};
|
|
846
|
+
|
|
847
|
+
// src/i18n/PireIntlProvider.tsx
|
|
848
|
+
import { jsx as jsx21 } from "react/jsx-runtime";
|
|
849
|
+
var MessagesContext = React6.createContext(enMessages);
|
|
850
|
+
function PireIntlProvider({ messages, children }) {
|
|
851
|
+
const value = React6.useMemo(
|
|
852
|
+
() => messages ? { ...enMessages, ...messages } : enMessages,
|
|
853
|
+
[messages]
|
|
854
|
+
);
|
|
855
|
+
return /* @__PURE__ */ jsx21(MessagesContext.Provider, { value, children });
|
|
856
|
+
}
|
|
857
|
+
function usePireMessages() {
|
|
858
|
+
return React6.useContext(MessagesContext);
|
|
859
|
+
}
|
|
860
|
+
function useMessage(key, override) {
|
|
861
|
+
const messages = React6.useContext(MessagesContext);
|
|
862
|
+
return override ?? messages[key];
|
|
863
|
+
}
|
|
864
|
+
|
|
865
|
+
// src/components/forms/ComboBox.tsx
|
|
866
|
+
import { jsx as jsx22, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
676
867
|
var norm2 = (o) => typeof o === "string" ? { value: o, label: o } : o;
|
|
677
868
|
function ComboBox({
|
|
678
869
|
label,
|
|
@@ -689,8 +880,9 @@ function ComboBox({
|
|
|
689
880
|
style,
|
|
690
881
|
...rest
|
|
691
882
|
}) {
|
|
883
|
+
const msg = usePireMessages();
|
|
692
884
|
const items = options.map(norm2);
|
|
693
|
-
return /* @__PURE__ */
|
|
885
|
+
return /* @__PURE__ */ jsxs15(
|
|
694
886
|
AriaComboBox,
|
|
695
887
|
{
|
|
696
888
|
className: cx("pire-field", className),
|
|
@@ -704,11 +896,11 @@ function ComboBox({
|
|
|
704
896
|
validationBehavior: "aria",
|
|
705
897
|
...rest,
|
|
706
898
|
children: [
|
|
707
|
-
label ? /* @__PURE__ */
|
|
899
|
+
label ? /* @__PURE__ */ jsxs15(Label5, { className: "pire-field-label", children: [
|
|
708
900
|
label,
|
|
709
|
-
rest.isRequired ? /* @__PURE__ */
|
|
901
|
+
rest.isRequired ? /* @__PURE__ */ jsx22("span", { className: "pire-field-req", "aria-hidden": "true", children: "*" }) : null
|
|
710
902
|
] }) : null,
|
|
711
|
-
/* @__PURE__ */
|
|
903
|
+
/* @__PURE__ */ jsxs15(
|
|
712
904
|
Group3,
|
|
713
905
|
{
|
|
714
906
|
className: "pire-control",
|
|
@@ -716,17 +908,17 @@ function ComboBox({
|
|
|
716
908
|
"data-full-width": String(fullWidth),
|
|
717
909
|
"data-invalid": rest.isInvalid ? "true" : void 0,
|
|
718
910
|
children: [
|
|
719
|
-
/* @__PURE__ */
|
|
720
|
-
/* @__PURE__ */
|
|
721
|
-
/* @__PURE__ */
|
|
911
|
+
/* @__PURE__ */ jsx22(Icon, { name: "search", size: 16, className: "pire-leading-icon" }),
|
|
912
|
+
/* @__PURE__ */ jsx22(AriaInput2, { className: "pire-input", placeholder: rest.placeholder }),
|
|
913
|
+
/* @__PURE__ */ jsx22(AriaButton5, { className: "pire-iconbtn", "data-size": "sm", "aria-label": msg.comboBoxShowSuggestions, style: { width: 20, height: 20 }, children: /* @__PURE__ */ jsx22(Icon, { name: "chevron-down", size: 16 }) })
|
|
722
914
|
]
|
|
723
915
|
}
|
|
724
916
|
),
|
|
725
|
-
description ? /* @__PURE__ */
|
|
726
|
-
/* @__PURE__ */
|
|
727
|
-
/* @__PURE__ */
|
|
728
|
-
/* @__PURE__ */
|
|
729
|
-
item.secondary ? /* @__PURE__ */
|
|
917
|
+
description ? /* @__PURE__ */ jsx22(Text6, { slot: "description", className: "pire-field-hint", children: description }) : null,
|
|
918
|
+
/* @__PURE__ */ jsx22(FieldError5, { className: "pire-field-error", children: errorMessage }),
|
|
919
|
+
/* @__PURE__ */ jsx22(Popover2, { className: "pire-popover", children: /* @__PURE__ */ jsx22(ListBox2, { className: "pire-listbox", children: (item) => /* @__PURE__ */ jsxs15(ListBoxItem2, { className: "pire-option", id: item.value, textValue: item.label, isDisabled: item.isDisabled, children: [
|
|
920
|
+
/* @__PURE__ */ jsx22("span", { style: { flex: 1 }, children: item.label }),
|
|
921
|
+
item.secondary ? /* @__PURE__ */ jsx22("span", { style: { font: "var(--type-code)", color: "var(--text-tertiary)" }, children: item.secondary }) : null
|
|
730
922
|
] }) }) })
|
|
731
923
|
]
|
|
732
924
|
}
|
|
@@ -734,7 +926,7 @@ function ComboBox({
|
|
|
734
926
|
}
|
|
735
927
|
|
|
736
928
|
// src/components/forms/MultiComboBox.tsx
|
|
737
|
-
import * as
|
|
929
|
+
import * as React7 from "react";
|
|
738
930
|
import {
|
|
739
931
|
ComboBox as AriaComboBox2,
|
|
740
932
|
Label as Label6,
|
|
@@ -745,11 +937,11 @@ import {
|
|
|
745
937
|
Popover as Popover3,
|
|
746
938
|
ListBox as ListBox3,
|
|
747
939
|
ListBoxItem as ListBoxItem3,
|
|
748
|
-
Text as
|
|
940
|
+
Text as Text7,
|
|
749
941
|
FieldError as FieldError6,
|
|
750
942
|
VisuallyHidden
|
|
751
943
|
} from "react-aria-components";
|
|
752
|
-
import { jsx as
|
|
944
|
+
import { jsx as jsx23, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
753
945
|
var norm3 = (o) => typeof o === "string" ? { value: o, label: o } : o;
|
|
754
946
|
function MultiComboBox({
|
|
755
947
|
label,
|
|
@@ -767,13 +959,14 @@ function MultiComboBox({
|
|
|
767
959
|
style,
|
|
768
960
|
...rest
|
|
769
961
|
}) {
|
|
770
|
-
const
|
|
771
|
-
const
|
|
772
|
-
const [
|
|
773
|
-
const
|
|
962
|
+
const msg = usePireMessages();
|
|
963
|
+
const items = React7.useMemo(() => options.map(norm3), [options]);
|
|
964
|
+
const [uncontrolled, setUncontrolled] = React7.useState(defaultValue ?? []);
|
|
965
|
+
const [announcement, setAnnouncement] = React7.useState("");
|
|
966
|
+
const inputRef = React7.useRef(null);
|
|
774
967
|
const raw = value ?? uncontrolled;
|
|
775
968
|
const contentKey = raw.join("\0");
|
|
776
|
-
const values =
|
|
969
|
+
const values = React7.useMemo(() => raw, [contentKey]);
|
|
777
970
|
const labelOf = (v) => items.find((o) => o.value === v)?.label ?? v;
|
|
778
971
|
const isEditable = !rest.isDisabled && !rest.isReadOnly;
|
|
779
972
|
const commit = (next) => {
|
|
@@ -806,7 +999,7 @@ function MultiComboBox({
|
|
|
806
999
|
e.stopPropagation();
|
|
807
1000
|
if (!values.includes(next)) commit([...values, next]);
|
|
808
1001
|
};
|
|
809
|
-
return /* @__PURE__ */
|
|
1002
|
+
return /* @__PURE__ */ jsxs16(
|
|
810
1003
|
AriaComboBox2,
|
|
811
1004
|
{
|
|
812
1005
|
className: cx("pire-field", className),
|
|
@@ -820,11 +1013,11 @@ function MultiComboBox({
|
|
|
820
1013
|
validationBehavior: "aria",
|
|
821
1014
|
...rest,
|
|
822
1015
|
children: [
|
|
823
|
-
label ? /* @__PURE__ */
|
|
1016
|
+
label ? /* @__PURE__ */ jsxs16(Label6, { className: "pire-field-label", children: [
|
|
824
1017
|
label,
|
|
825
|
-
rest.isRequired ? /* @__PURE__ */
|
|
1018
|
+
rest.isRequired ? /* @__PURE__ */ jsx23("span", { className: "pire-field-req", "aria-hidden": "true", children: "*" }) : null
|
|
826
1019
|
] }) : null,
|
|
827
|
-
/* @__PURE__ */
|
|
1020
|
+
/* @__PURE__ */ jsxs16(
|
|
828
1021
|
Group4,
|
|
829
1022
|
{
|
|
830
1023
|
className: "pire-control",
|
|
@@ -834,14 +1027,14 @@ function MultiComboBox({
|
|
|
834
1027
|
"data-invalid": rest.isInvalid ? "true" : void 0,
|
|
835
1028
|
"data-readonly": rest.isReadOnly ? "true" : void 0,
|
|
836
1029
|
children: [
|
|
837
|
-
/* @__PURE__ */
|
|
838
|
-
/* @__PURE__ */
|
|
839
|
-
/* @__PURE__ */
|
|
1030
|
+
/* @__PURE__ */ jsx23(Icon, { name: "search", size: 16, className: "pire-leading-icon" }),
|
|
1031
|
+
/* @__PURE__ */ jsxs16("div", { className: "pire-chipfield", children: [
|
|
1032
|
+
/* @__PURE__ */ jsx23(ButtonContext.Provider, { value: null, children: values.map((v) => (
|
|
840
1033
|
/* Disabled follows the field, not `isEditable`: a read-only field's chips are
|
|
841
1034
|
real, current values and should read as such — they simply lose the × . */
|
|
842
|
-
/* @__PURE__ */
|
|
1035
|
+
/* @__PURE__ */ jsx23(Tag, { isDisabled: rest.isDisabled, onRemove: isEditable ? () => remove(v) : void 0, children: labelOf(v) }, v)
|
|
843
1036
|
)) }),
|
|
844
|
-
/* @__PURE__ */
|
|
1037
|
+
/* @__PURE__ */ jsx23(
|
|
845
1038
|
AriaInput3,
|
|
846
1039
|
{
|
|
847
1040
|
ref: inputRef,
|
|
@@ -851,16 +1044,16 @@ function MultiComboBox({
|
|
|
851
1044
|
}
|
|
852
1045
|
)
|
|
853
1046
|
] }),
|
|
854
|
-
/* @__PURE__ */
|
|
1047
|
+
/* @__PURE__ */ jsx23(AriaButton6, { className: "pire-iconbtn", "data-size": "sm", "aria-label": msg.comboBoxShowSuggestions, style: { width: 20, height: 20 }, children: /* @__PURE__ */ jsx23(Icon, { name: "chevron-down", size: 16 }) })
|
|
855
1048
|
]
|
|
856
1049
|
}
|
|
857
1050
|
),
|
|
858
|
-
/* @__PURE__ */
|
|
859
|
-
description ? /* @__PURE__ */
|
|
860
|
-
/* @__PURE__ */
|
|
861
|
-
/* @__PURE__ */
|
|
862
|
-
/* @__PURE__ */
|
|
863
|
-
item.secondary ? /* @__PURE__ */
|
|
1051
|
+
/* @__PURE__ */ jsx23(VisuallyHidden, { children: /* @__PURE__ */ jsx23("span", { "aria-live": "polite", children: announcement }) }),
|
|
1052
|
+
description ? /* @__PURE__ */ jsx23(Text7, { slot: "description", className: "pire-field-hint", children: description }) : null,
|
|
1053
|
+
/* @__PURE__ */ jsx23(FieldError6, { className: "pire-field-error", children: errorMessage }),
|
|
1054
|
+
/* @__PURE__ */ jsx23(Popover3, { className: "pire-popover", children: /* @__PURE__ */ jsx23(ListBox3, { className: "pire-listbox", children: (item) => /* @__PURE__ */ jsxs16(ListBoxItem3, { className: "pire-option", id: item.value, textValue: item.label, isDisabled: item.isDisabled, children: [
|
|
1055
|
+
/* @__PURE__ */ jsx23("span", { style: { flex: 1 }, children: item.label }),
|
|
1056
|
+
item.secondary ? /* @__PURE__ */ jsx23("span", { style: { font: "var(--type-code)", color: "var(--text-tertiary)" }, children: item.secondary }) : null
|
|
864
1057
|
] }) }) })
|
|
865
1058
|
]
|
|
866
1059
|
}
|
|
@@ -874,10 +1067,10 @@ import {
|
|
|
874
1067
|
Input as AriaInput4,
|
|
875
1068
|
Group as Group5,
|
|
876
1069
|
Button as AriaButton7,
|
|
877
|
-
Text as
|
|
1070
|
+
Text as Text8,
|
|
878
1071
|
FieldError as FieldError7
|
|
879
1072
|
} from "react-aria-components";
|
|
880
|
-
import { jsx as
|
|
1073
|
+
import { jsx as jsx24, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
881
1074
|
function NumberField({
|
|
882
1075
|
label,
|
|
883
1076
|
suffix,
|
|
@@ -890,12 +1083,13 @@ function NumberField({
|
|
|
890
1083
|
style,
|
|
891
1084
|
...rest
|
|
892
1085
|
}) {
|
|
893
|
-
|
|
894
|
-
|
|
1086
|
+
const msg = usePireMessages();
|
|
1087
|
+
return /* @__PURE__ */ jsxs17(AriaNumberField, { className: cx("pire-field", className), style, validationBehavior: "aria", ...rest, children: [
|
|
1088
|
+
label ? /* @__PURE__ */ jsxs17(Label7, { className: "pire-field-label", children: [
|
|
895
1089
|
label,
|
|
896
|
-
rest.isRequired ? /* @__PURE__ */
|
|
1090
|
+
rest.isRequired ? /* @__PURE__ */ jsx24("span", { className: "pire-field-req", "aria-hidden": "true", children: "*" }) : null
|
|
897
1091
|
] }) : null,
|
|
898
|
-
/* @__PURE__ */
|
|
1092
|
+
/* @__PURE__ */ jsxs17(
|
|
899
1093
|
Group5,
|
|
900
1094
|
{
|
|
901
1095
|
className: "pire-control",
|
|
@@ -904,17 +1098,17 @@ function NumberField({
|
|
|
904
1098
|
"data-invalid": rest.isInvalid ? "true" : void 0,
|
|
905
1099
|
"data-readonly": rest.isReadOnly ? "true" : void 0,
|
|
906
1100
|
children: [
|
|
907
|
-
/* @__PURE__ */
|
|
908
|
-
suffix ? /* @__PURE__ */
|
|
909
|
-
hideStepper ? null : /* @__PURE__ */
|
|
910
|
-
/* @__PURE__ */
|
|
911
|
-
/* @__PURE__ */
|
|
1101
|
+
/* @__PURE__ */ jsx24(AriaInput4, { className: "pire-input", "data-numeric": "true" }),
|
|
1102
|
+
suffix ? /* @__PURE__ */ jsx24("span", { className: "pire-affix", children: suffix }) : null,
|
|
1103
|
+
hideStepper ? null : /* @__PURE__ */ jsxs17("span", { className: "pire-stepper", children: [
|
|
1104
|
+
/* @__PURE__ */ jsx24(AriaButton7, { slot: "increment", className: "pire-stepper-btn", "aria-label": msg.numberFieldIncrease, children: /* @__PURE__ */ jsx24(Icon, { name: "plus", size: 10 }) }),
|
|
1105
|
+
/* @__PURE__ */ jsx24(AriaButton7, { slot: "decrement", className: "pire-stepper-btn", "aria-label": msg.numberFieldDecrease, children: /* @__PURE__ */ jsx24(Icon, { name: "minus", size: 10 }) })
|
|
912
1106
|
] })
|
|
913
1107
|
]
|
|
914
1108
|
}
|
|
915
1109
|
),
|
|
916
|
-
description ? /* @__PURE__ */
|
|
917
|
-
/* @__PURE__ */
|
|
1110
|
+
description ? /* @__PURE__ */ jsx24(Text8, { slot: "description", className: "pire-field-hint", children: description }) : null,
|
|
1111
|
+
/* @__PURE__ */ jsx24(FieldError7, { className: "pire-field-error", children: errorMessage })
|
|
918
1112
|
] });
|
|
919
1113
|
}
|
|
920
1114
|
|
|
@@ -934,11 +1128,11 @@ import {
|
|
|
934
1128
|
CalendarHeaderCell,
|
|
935
1129
|
CalendarGridBody,
|
|
936
1130
|
CalendarCell,
|
|
937
|
-
Heading,
|
|
938
|
-
Text as
|
|
1131
|
+
Heading as Heading2,
|
|
1132
|
+
Text as Text9,
|
|
939
1133
|
FieldError as FieldError8
|
|
940
1134
|
} from "react-aria-components";
|
|
941
|
-
import { jsx as
|
|
1135
|
+
import { jsx as jsx25, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
942
1136
|
function DatePicker({
|
|
943
1137
|
label,
|
|
944
1138
|
description,
|
|
@@ -949,12 +1143,13 @@ function DatePicker({
|
|
|
949
1143
|
style,
|
|
950
1144
|
...rest
|
|
951
1145
|
}) {
|
|
952
|
-
|
|
953
|
-
|
|
1146
|
+
const msg = usePireMessages();
|
|
1147
|
+
return /* @__PURE__ */ jsxs18(AriaDatePicker, { className: cx("pire-field", className), style, validationBehavior: "aria", ...rest, children: [
|
|
1148
|
+
label ? /* @__PURE__ */ jsxs18(Label8, { className: "pire-field-label", children: [
|
|
954
1149
|
label,
|
|
955
|
-
rest.isRequired ? /* @__PURE__ */
|
|
1150
|
+
rest.isRequired ? /* @__PURE__ */ jsx25("span", { className: "pire-field-req", "aria-hidden": "true", children: "*" }) : null
|
|
956
1151
|
] }) : null,
|
|
957
|
-
/* @__PURE__ */
|
|
1152
|
+
/* @__PURE__ */ jsxs18(
|
|
958
1153
|
Group6,
|
|
959
1154
|
{
|
|
960
1155
|
className: "pire-control",
|
|
@@ -963,36 +1158,36 @@ function DatePicker({
|
|
|
963
1158
|
"data-invalid": rest.isInvalid ? "true" : void 0,
|
|
964
1159
|
"data-readonly": rest.isReadOnly ? "true" : void 0,
|
|
965
1160
|
children: [
|
|
966
|
-
/* @__PURE__ */
|
|
967
|
-
/* @__PURE__ */
|
|
1161
|
+
/* @__PURE__ */ jsx25(DateInput, { className: "pire-datefield", children: (segment) => /* @__PURE__ */ jsx25(DateSegment, { segment, className: "pire-datesegment" }) }),
|
|
1162
|
+
/* @__PURE__ */ jsx25(AriaButton8, { className: "pire-iconbtn", "data-size": "sm", "aria-label": msg.datePickerOpenCalendar, style: { width: 24, height: 24 }, children: /* @__PURE__ */ jsx25(Icon, { name: "calendar", size: 16 }) })
|
|
968
1163
|
]
|
|
969
1164
|
}
|
|
970
1165
|
),
|
|
971
|
-
description ? /* @__PURE__ */
|
|
972
|
-
/* @__PURE__ */
|
|
973
|
-
/* @__PURE__ */
|
|
974
|
-
/* @__PURE__ */
|
|
975
|
-
/* @__PURE__ */
|
|
976
|
-
/* @__PURE__ */
|
|
977
|
-
/* @__PURE__ */
|
|
1166
|
+
description ? /* @__PURE__ */ jsx25(Text9, { slot: "description", className: "pire-field-hint", children: description }) : null,
|
|
1167
|
+
/* @__PURE__ */ jsx25(FieldError8, { className: "pire-field-error", children: errorMessage }),
|
|
1168
|
+
/* @__PURE__ */ jsx25(Popover4, { className: "pire-popover", children: /* @__PURE__ */ jsx25(AriaDialog, { children: /* @__PURE__ */ jsxs18(Calendar, { className: "pire-calendar", children: [
|
|
1169
|
+
/* @__PURE__ */ jsxs18("header", { className: "pire-calendar-head", children: [
|
|
1170
|
+
/* @__PURE__ */ jsx25(AriaButton8, { slot: "previous", className: "pire-iconbtn", "data-size": "sm", "aria-label": msg.datePickerPreviousMonth, children: /* @__PURE__ */ jsx25(Icon, { name: "chevron-left", size: 16 }) }),
|
|
1171
|
+
/* @__PURE__ */ jsx25(Heading2, { className: "pire-calendar-title" }),
|
|
1172
|
+
/* @__PURE__ */ jsx25(AriaButton8, { slot: "next", className: "pire-iconbtn", "data-size": "sm", "aria-label": msg.datePickerNextMonth, children: /* @__PURE__ */ jsx25(Icon, { name: "chevron-right", size: 16 }) })
|
|
978
1173
|
] }),
|
|
979
|
-
/* @__PURE__ */
|
|
980
|
-
/* @__PURE__ */
|
|
981
|
-
/* @__PURE__ */
|
|
1174
|
+
/* @__PURE__ */ jsxs18(CalendarGrid, { className: "pire-calendar-grid", children: [
|
|
1175
|
+
/* @__PURE__ */ jsx25(CalendarGridHeader, { children: (day) => /* @__PURE__ */ jsx25(CalendarHeaderCell, { children: day }) }),
|
|
1176
|
+
/* @__PURE__ */ jsx25(CalendarGridBody, { children: (date) => /* @__PURE__ */ jsx25(CalendarCell, { date, className: "pire-calendar-cell" }) })
|
|
982
1177
|
] })
|
|
983
1178
|
] }) }) })
|
|
984
1179
|
] });
|
|
985
1180
|
}
|
|
986
1181
|
|
|
987
1182
|
// src/components/forms/ValueHelpField.tsx
|
|
988
|
-
import * as
|
|
1183
|
+
import * as React9 from "react";
|
|
989
1184
|
|
|
990
1185
|
// src/components/patterns/ValueHelpDialog.tsx
|
|
991
|
-
import * as
|
|
1186
|
+
import * as React8 from "react";
|
|
992
1187
|
|
|
993
1188
|
// src/components/feedback/Dialog.tsx
|
|
994
|
-
import { ModalOverlay, Modal, Dialog as AriaDialog2, Heading as
|
|
995
|
-
import { jsx as
|
|
1189
|
+
import { ModalOverlay, Modal, Dialog as AriaDialog2, Heading as Heading3 } from "react-aria-components";
|
|
1190
|
+
import { jsx as jsx26, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
996
1191
|
function Dialog({
|
|
997
1192
|
isOpen,
|
|
998
1193
|
onOpenChange,
|
|
@@ -1007,11 +1202,12 @@ function Dialog({
|
|
|
1007
1202
|
className,
|
|
1008
1203
|
style
|
|
1009
1204
|
}) {
|
|
1205
|
+
const msg = usePireMessages();
|
|
1010
1206
|
const close = () => {
|
|
1011
1207
|
onClose?.();
|
|
1012
1208
|
onOpenChange?.(false);
|
|
1013
1209
|
};
|
|
1014
|
-
return /* @__PURE__ */
|
|
1210
|
+
return /* @__PURE__ */ jsx26(
|
|
1015
1211
|
ModalOverlay,
|
|
1016
1212
|
{
|
|
1017
1213
|
className: "pire-modal-overlay",
|
|
@@ -1020,16 +1216,16 @@ function Dialog({
|
|
|
1020
1216
|
onOpenChange: (o) => {
|
|
1021
1217
|
if (!o) close();
|
|
1022
1218
|
},
|
|
1023
|
-
children: /* @__PURE__ */
|
|
1024
|
-
title ? /* @__PURE__ */
|
|
1025
|
-
/* @__PURE__ */
|
|
1026
|
-
/* @__PURE__ */
|
|
1027
|
-
subtitle ? /* @__PURE__ */
|
|
1219
|
+
children: /* @__PURE__ */ jsx26(Modal, { className: cx("pire-modal", className), "data-size": size, style, children: /* @__PURE__ */ jsxs19(AriaDialog2, { className: "pire-dialog", children: [
|
|
1220
|
+
title ? /* @__PURE__ */ jsxs19("header", { className: "pire-dialog-head", children: [
|
|
1221
|
+
/* @__PURE__ */ jsxs19("div", { style: { flex: 1, minWidth: 0 }, children: [
|
|
1222
|
+
/* @__PURE__ */ jsx26(Heading3, { slot: "title", className: "pire-dialog-title", children: title }),
|
|
1223
|
+
subtitle ? /* @__PURE__ */ jsx26("p", { className: "pire-dialog-sub", style: { margin: 0 }, children: subtitle }) : null
|
|
1028
1224
|
] }),
|
|
1029
|
-
showClose ? /* @__PURE__ */
|
|
1225
|
+
showClose ? /* @__PURE__ */ jsx26(IconButton, { icon: "x", label: msg.dialogClose, size: "sm", onPress: close }) : null
|
|
1030
1226
|
] }) : null,
|
|
1031
|
-
/* @__PURE__ */
|
|
1032
|
-
footer ? /* @__PURE__ */
|
|
1227
|
+
/* @__PURE__ */ jsx26("div", { className: "pire-dialog-body", children }),
|
|
1228
|
+
footer ? /* @__PURE__ */ jsx26("footer", { className: "pire-dialog-foot", children: footer }) : null
|
|
1033
1229
|
] }) })
|
|
1034
1230
|
}
|
|
1035
1231
|
);
|
|
@@ -1044,7 +1240,7 @@ import {
|
|
|
1044
1240
|
Row,
|
|
1045
1241
|
Cell
|
|
1046
1242
|
} from "react-aria-components";
|
|
1047
|
-
import { jsx as
|
|
1243
|
+
import { jsx as jsx27, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
1048
1244
|
function DataTable({
|
|
1049
1245
|
columns,
|
|
1050
1246
|
rows,
|
|
@@ -1061,12 +1257,13 @@ function DataTable({
|
|
|
1061
1257
|
style,
|
|
1062
1258
|
...rest
|
|
1063
1259
|
}) {
|
|
1260
|
+
const msg = usePireMessages();
|
|
1064
1261
|
const sortDescriptor = sort ? { column: sort.key, direction: sort.dir === "asc" ? "ascending" : "descending" } : void 0;
|
|
1065
1262
|
const handleSelection = (keys) => {
|
|
1066
1263
|
if (keys === "all") return onSelectionChange?.(rows.map((r) => r.id));
|
|
1067
1264
|
onSelectionChange?.([...keys]);
|
|
1068
1265
|
};
|
|
1069
|
-
return /* @__PURE__ */
|
|
1266
|
+
return /* @__PURE__ */ jsx27("div", { className: cx("pire-table-wrap", className), style, children: /* @__PURE__ */ jsxs20(
|
|
1070
1267
|
Table,
|
|
1071
1268
|
{
|
|
1072
1269
|
className: "pire-table",
|
|
@@ -1083,9 +1280,9 @@ function DataTable({
|
|
|
1083
1280
|
if (row) onRowAction(row);
|
|
1084
1281
|
} : void 0,
|
|
1085
1282
|
children: [
|
|
1086
|
-
/* @__PURE__ */
|
|
1087
|
-
selectable ? /* @__PURE__ */
|
|
1088
|
-
columns.map((c, i) => /* @__PURE__ */
|
|
1283
|
+
/* @__PURE__ */ jsxs20(TableHeader, { className: "pire-thead-row", children: [
|
|
1284
|
+
selectable ? /* @__PURE__ */ jsx27(Column, { className: "pire-th", width: 44, children: /* @__PURE__ */ jsx27(Checkbox, { slot: "selection", "aria-label": msg.dataTableSelectAll }) }) : null,
|
|
1285
|
+
columns.map((c, i) => /* @__PURE__ */ jsx27(
|
|
1089
1286
|
Column,
|
|
1090
1287
|
{
|
|
1091
1288
|
id: c.key,
|
|
@@ -1095,9 +1292,9 @@ function DataTable({
|
|
|
1095
1292
|
width: c.width,
|
|
1096
1293
|
"data-align": c.numeric || c.align === "right" ? "right" : c.align,
|
|
1097
1294
|
"data-allows-sorting": c.sortable ? "true" : void 0,
|
|
1098
|
-
children: /* @__PURE__ */
|
|
1295
|
+
children: /* @__PURE__ */ jsxs20("span", { className: "pire-th-inner", children: [
|
|
1099
1296
|
c.label,
|
|
1100
|
-
c.sortable ? /* @__PURE__ */
|
|
1297
|
+
c.sortable ? /* @__PURE__ */ jsx27(
|
|
1101
1298
|
Icon,
|
|
1102
1299
|
{
|
|
1103
1300
|
size: 12,
|
|
@@ -1110,9 +1307,9 @@ function DataTable({
|
|
|
1110
1307
|
c.key
|
|
1111
1308
|
))
|
|
1112
1309
|
] }),
|
|
1113
|
-
/* @__PURE__ */
|
|
1114
|
-
selectable ? /* @__PURE__ */
|
|
1115
|
-
columns.map((c) => /* @__PURE__ */
|
|
1310
|
+
/* @__PURE__ */ jsx27(TableBody, { renderEmptyState: () => /* @__PURE__ */ jsx27("div", { className: "pire-table-empty", children: emptyLabel }), children: rows.map((row) => /* @__PURE__ */ jsxs20(Row, { id: row.id, className: "pire-tr", "data-pressable": onRowAction ? "true" : void 0, children: [
|
|
1311
|
+
selectable ? /* @__PURE__ */ jsx27(Cell, { className: "pire-td", children: /* @__PURE__ */ jsx27(Checkbox, { slot: "selection", "aria-label": msg.dataTableSelectRow }) }) : null,
|
|
1312
|
+
columns.map((c) => /* @__PURE__ */ jsx27(
|
|
1116
1313
|
Cell,
|
|
1117
1314
|
{
|
|
1118
1315
|
className: "pire-td",
|
|
@@ -1129,7 +1326,7 @@ function DataTable({
|
|
|
1129
1326
|
}
|
|
1130
1327
|
|
|
1131
1328
|
// src/components/patterns/ValueHelpDialog.tsx
|
|
1132
|
-
import { jsx as
|
|
1329
|
+
import { jsx as jsx28, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
1133
1330
|
function ValueHelpDialog({
|
|
1134
1331
|
isOpen,
|
|
1135
1332
|
title = "Select a record",
|
|
@@ -1140,28 +1337,29 @@ function ValueHelpDialog({
|
|
|
1140
1337
|
onSelect,
|
|
1141
1338
|
onClose
|
|
1142
1339
|
}) {
|
|
1143
|
-
const
|
|
1144
|
-
|
|
1340
|
+
const msg = usePireMessages();
|
|
1341
|
+
const [query, setQuery] = React8.useState("");
|
|
1342
|
+
React8.useEffect(() => {
|
|
1145
1343
|
if (isOpen) setQuery("");
|
|
1146
1344
|
}, [isOpen]);
|
|
1147
|
-
const filtered =
|
|
1345
|
+
const filtered = React8.useMemo(() => {
|
|
1148
1346
|
const q = query.trim().toLowerCase();
|
|
1149
1347
|
if (!q) return rows;
|
|
1150
1348
|
return rows.filter((row) => Object.values(row).some((v) => String(v).toLowerCase().includes(q)));
|
|
1151
1349
|
}, [rows, query]);
|
|
1152
|
-
return /* @__PURE__ */
|
|
1350
|
+
return /* @__PURE__ */ jsx28(
|
|
1153
1351
|
Dialog,
|
|
1154
1352
|
{
|
|
1155
1353
|
isOpen,
|
|
1156
1354
|
size: "lg",
|
|
1157
1355
|
title,
|
|
1158
1356
|
onClose,
|
|
1159
|
-
footer: /* @__PURE__ */
|
|
1160
|
-
children: /* @__PURE__ */
|
|
1161
|
-
/* @__PURE__ */
|
|
1357
|
+
footer: /* @__PURE__ */ jsx28(Button, { variant: "tertiary", onPress: onClose, children: msg.valueHelpDialogCancel }),
|
|
1358
|
+
children: /* @__PURE__ */ jsxs21("div", { style: { display: "flex", flexDirection: "column", gap: "var(--sp-3)" }, children: [
|
|
1359
|
+
/* @__PURE__ */ jsx28(
|
|
1162
1360
|
Input,
|
|
1163
1361
|
{
|
|
1164
|
-
"aria-label":
|
|
1362
|
+
"aria-label": msg.valueHelpDialogSearch,
|
|
1165
1363
|
icon: "search",
|
|
1166
1364
|
type: "search",
|
|
1167
1365
|
value: query,
|
|
@@ -1170,7 +1368,7 @@ function ValueHelpDialog({
|
|
|
1170
1368
|
autoFocus: true
|
|
1171
1369
|
}
|
|
1172
1370
|
),
|
|
1173
|
-
/* @__PURE__ */
|
|
1371
|
+
/* @__PURE__ */ jsx28(
|
|
1174
1372
|
DataTable,
|
|
1175
1373
|
{
|
|
1176
1374
|
"aria-label": typeof title === "string" ? title : "Records",
|
|
@@ -1190,7 +1388,7 @@ function ValueHelpDialog({
|
|
|
1190
1388
|
}
|
|
1191
1389
|
|
|
1192
1390
|
// src/components/forms/ValueHelpField.tsx
|
|
1193
|
-
import { jsx as
|
|
1391
|
+
import { jsx as jsx29, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
1194
1392
|
var defaultFormat = (row) => [row.id, row.name ?? row.label ?? row.text].filter(Boolean).join(" \u2014 ");
|
|
1195
1393
|
function ValueHelpField({
|
|
1196
1394
|
label,
|
|
@@ -1210,10 +1408,11 @@ function ValueHelpField({
|
|
|
1210
1408
|
className,
|
|
1211
1409
|
style
|
|
1212
1410
|
}) {
|
|
1213
|
-
const
|
|
1214
|
-
|
|
1215
|
-
|
|
1216
|
-
|
|
1411
|
+
const msg = usePireMessages();
|
|
1412
|
+
const [open, setOpen] = React9.useState(false);
|
|
1413
|
+
return /* @__PURE__ */ jsxs22("div", { className: cx(className), style, children: [
|
|
1414
|
+
/* @__PURE__ */ jsxs22("div", { style: { display: "flex", gap: "var(--sp-2)", alignItems: "flex-end" }, children: [
|
|
1415
|
+
/* @__PURE__ */ jsx29(
|
|
1217
1416
|
Input,
|
|
1218
1417
|
{
|
|
1219
1418
|
label,
|
|
@@ -1227,28 +1426,28 @@ function ValueHelpField({
|
|
|
1227
1426
|
errorMessage
|
|
1228
1427
|
}
|
|
1229
1428
|
),
|
|
1230
|
-
allowsClear && value ? /* @__PURE__ */
|
|
1429
|
+
allowsClear && value ? /* @__PURE__ */ jsx29(
|
|
1231
1430
|
IconButton,
|
|
1232
1431
|
{
|
|
1233
1432
|
icon: "x",
|
|
1234
|
-
label:
|
|
1433
|
+
label: msg.valueHelpFieldClear,
|
|
1235
1434
|
variant: "outlined",
|
|
1236
1435
|
isDisabled,
|
|
1237
1436
|
onPress: () => onChange?.(null)
|
|
1238
1437
|
}
|
|
1239
1438
|
) : null,
|
|
1240
|
-
/* @__PURE__ */
|
|
1439
|
+
/* @__PURE__ */ jsx29(
|
|
1241
1440
|
IconButton,
|
|
1242
1441
|
{
|
|
1243
1442
|
icon: "search",
|
|
1244
|
-
label: typeof label === "string" ?
|
|
1443
|
+
label: typeof label === "string" ? msg.valueHelpFieldOpenNamed.replace("{label}", label.toLowerCase()) : msg.valueHelpFieldOpen,
|
|
1245
1444
|
variant: "outlined",
|
|
1246
1445
|
isDisabled,
|
|
1247
1446
|
onPress: () => setOpen(true)
|
|
1248
1447
|
}
|
|
1249
1448
|
)
|
|
1250
1449
|
] }),
|
|
1251
|
-
/* @__PURE__ */
|
|
1450
|
+
/* @__PURE__ */ jsx29(
|
|
1252
1451
|
ValueHelpDialog,
|
|
1253
1452
|
{
|
|
1254
1453
|
isOpen: open,
|
|
@@ -1263,7 +1462,7 @@ function ValueHelpField({
|
|
|
1263
1462
|
}
|
|
1264
1463
|
|
|
1265
1464
|
// src/components/navigation/ShellBar.tsx
|
|
1266
|
-
import { jsx as
|
|
1465
|
+
import { jsx as jsx30, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
1267
1466
|
var initials2 = (name) => name.trim().split(/\s+/).slice(0, 2).map((p) => p[0]).join("").toUpperCase();
|
|
1268
1467
|
function ShellBar({
|
|
1269
1468
|
product,
|
|
@@ -1278,22 +1477,22 @@ function ShellBar({
|
|
|
1278
1477
|
className,
|
|
1279
1478
|
...rest
|
|
1280
1479
|
}) {
|
|
1281
|
-
return /* @__PURE__ */
|
|
1282
|
-
onMenu ? /* @__PURE__ */
|
|
1283
|
-
monogram ? /* @__PURE__ */
|
|
1284
|
-
product ? /* @__PURE__ */
|
|
1285
|
-
title ? /* @__PURE__ */
|
|
1286
|
-
/* @__PURE__ */
|
|
1287
|
-
onSearch ? /* @__PURE__ */
|
|
1480
|
+
return /* @__PURE__ */ jsxs23("header", { className: cx("pire-shellbar", className), ...rest, children: [
|
|
1481
|
+
onMenu ? /* @__PURE__ */ jsx30(IconButton, { icon: "menu", label: menuLabel, variant: "inverse", size: "sm", onPress: onMenu }) : null,
|
|
1482
|
+
monogram ? /* @__PURE__ */ jsx30("span", { className: "pire-shellbar-mono", "aria-hidden": "true", children: monogram }) : null,
|
|
1483
|
+
product ? /* @__PURE__ */ jsx30("span", { className: "pire-shellbar-product", children: product }) : null,
|
|
1484
|
+
title ? /* @__PURE__ */ jsx30("span", { className: "pire-shellbar-title", children: title }) : null,
|
|
1485
|
+
/* @__PURE__ */ jsx30("span", { className: "pire-shellbar-spacer" }),
|
|
1486
|
+
onSearch ? /* @__PURE__ */ jsx30(IconButton, { icon: "search", label: searchLabel, variant: "inverse", size: "sm", onPress: onSearch }) : null,
|
|
1288
1487
|
actions,
|
|
1289
|
-
user ? /* @__PURE__ */
|
|
1488
|
+
user ? /* @__PURE__ */ jsx30("span", { className: "pire-avatar", title: user, "aria-label": user, role: "img", children: initials2(user) }) : null
|
|
1290
1489
|
] });
|
|
1291
1490
|
}
|
|
1292
1491
|
|
|
1293
1492
|
// src/components/navigation/SideNav.tsx
|
|
1294
|
-
import * as
|
|
1493
|
+
import * as React10 from "react";
|
|
1295
1494
|
import { Button as AriaButton9, Disclosure, DisclosureGroup, DisclosurePanel } from "react-aria-components";
|
|
1296
|
-
import { jsx as
|
|
1495
|
+
import { jsx as jsx31, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
1297
1496
|
function findActiveParent(groups, value) {
|
|
1298
1497
|
if (value == null) return void 0;
|
|
1299
1498
|
for (const group of groups) {
|
|
@@ -1315,12 +1514,13 @@ function SideNav({
|
|
|
1315
1514
|
className,
|
|
1316
1515
|
...rest
|
|
1317
1516
|
}) {
|
|
1517
|
+
const msg = usePireMessages();
|
|
1318
1518
|
const activeParent = findActiveParent(groups, value);
|
|
1319
1519
|
const isControlled = expandedIds != null;
|
|
1320
|
-
const [ownExpanded, setOwnExpanded] =
|
|
1520
|
+
const [ownExpanded, setOwnExpanded] = React10.useState(
|
|
1321
1521
|
() => new Set(defaultExpandedIds ?? (activeParent ? [activeParent] : []))
|
|
1322
1522
|
);
|
|
1323
|
-
const [lastValue, setLastValue] =
|
|
1523
|
+
const [lastValue, setLastValue] = React10.useState(value);
|
|
1324
1524
|
if (value !== lastValue) {
|
|
1325
1525
|
setLastValue(value);
|
|
1326
1526
|
if (!isControlled && activeParent && !ownExpanded.has(activeParent)) {
|
|
@@ -1340,26 +1540,27 @@ function SideNav({
|
|
|
1340
1540
|
};
|
|
1341
1541
|
const renderRow = (item, onPress, isGroup) => {
|
|
1342
1542
|
const selected = !isGroup && item.id === value;
|
|
1343
|
-
const button = /* @__PURE__ */
|
|
1543
|
+
const button = /* @__PURE__ */ jsxs24(
|
|
1344
1544
|
AriaButton9,
|
|
1345
1545
|
{
|
|
1346
1546
|
className: "pire-sidenav-item",
|
|
1347
1547
|
"data-selected": selected ? "true" : void 0,
|
|
1348
1548
|
"data-active-child": isGroup && item.id === activeParent ? "true" : void 0,
|
|
1349
1549
|
"aria-current": selected ? "page" : void 0,
|
|
1550
|
+
"aria-label": collapsed ? item.label : void 0,
|
|
1350
1551
|
onPress,
|
|
1351
1552
|
children: [
|
|
1352
|
-
item.icon ? /* @__PURE__ */
|
|
1353
|
-
collapsed ? null : /* @__PURE__ */
|
|
1354
|
-
item.count != null && !collapsed ? /* @__PURE__ */
|
|
1553
|
+
item.icon ? /* @__PURE__ */ jsx31(Icon, { name: item.icon, size: 16 }) : null,
|
|
1554
|
+
collapsed ? null : /* @__PURE__ */ jsx31("span", { children: item.label }),
|
|
1555
|
+
item.count != null && !collapsed ? /* @__PURE__ */ jsx31("span", { className: "pire-sidenav-count", children: item.count }) : null
|
|
1355
1556
|
]
|
|
1356
1557
|
},
|
|
1357
1558
|
item.id
|
|
1358
1559
|
);
|
|
1359
|
-
return collapsed ? /* @__PURE__ */
|
|
1560
|
+
return collapsed ? /* @__PURE__ */ jsx31(Tooltip, { label: item.label, placement: "right", children: button }, item.id) : button;
|
|
1360
1561
|
};
|
|
1361
|
-
const renderSection = (item) => /* @__PURE__ */
|
|
1362
|
-
/* @__PURE__ */
|
|
1562
|
+
const renderSection = (item) => /* @__PURE__ */ jsxs24(Disclosure, { id: item.id, className: "pire-sidenav-section", children: [
|
|
1563
|
+
/* @__PURE__ */ jsxs24(
|
|
1363
1564
|
AriaButton9,
|
|
1364
1565
|
{
|
|
1365
1566
|
slot: "trigger",
|
|
@@ -1367,16 +1568,16 @@ function SideNav({
|
|
|
1367
1568
|
"data-kind": "group",
|
|
1368
1569
|
"data-active-child": item.id === activeParent ? "true" : void 0,
|
|
1369
1570
|
children: [
|
|
1370
|
-
item.icon ? /* @__PURE__ */
|
|
1371
|
-
/* @__PURE__ */
|
|
1372
|
-
item.count != null ? /* @__PURE__ */
|
|
1373
|
-
/* @__PURE__ */
|
|
1571
|
+
item.icon ? /* @__PURE__ */ jsx31(Icon, { name: item.icon, size: 16 }) : null,
|
|
1572
|
+
/* @__PURE__ */ jsx31("span", { children: item.label }),
|
|
1573
|
+
item.count != null ? /* @__PURE__ */ jsx31("span", { className: "pire-sidenav-count", children: item.count }) : null,
|
|
1574
|
+
/* @__PURE__ */ jsx31(Icon, { name: "chevron-down", size: 16, className: "pire-sidenav-chevron" })
|
|
1374
1575
|
]
|
|
1375
1576
|
}
|
|
1376
1577
|
),
|
|
1377
|
-
/* @__PURE__ */
|
|
1578
|
+
/* @__PURE__ */ jsx31(DisclosurePanel, { className: "pire-sidenav-subnav", children: item.items?.map((child) => {
|
|
1378
1579
|
const selected = child.id === value;
|
|
1379
|
-
return /* @__PURE__ */
|
|
1580
|
+
return /* @__PURE__ */ jsxs24(
|
|
1380
1581
|
AriaButton9,
|
|
1381
1582
|
{
|
|
1382
1583
|
className: "pire-sidenav-item pire-sidenav-subitem",
|
|
@@ -1384,20 +1585,20 @@ function SideNav({
|
|
|
1384
1585
|
"aria-current": selected ? "page" : void 0,
|
|
1385
1586
|
onPress: () => onChange?.(child.id),
|
|
1386
1587
|
children: [
|
|
1387
|
-
/* @__PURE__ */
|
|
1388
|
-
child.count != null ? /* @__PURE__ */
|
|
1588
|
+
/* @__PURE__ */ jsx31("span", { children: child.label }),
|
|
1589
|
+
child.count != null ? /* @__PURE__ */ jsx31("span", { className: "pire-sidenav-count", children: child.count }) : null
|
|
1389
1590
|
]
|
|
1390
1591
|
},
|
|
1391
1592
|
child.id
|
|
1392
1593
|
);
|
|
1393
1594
|
}) })
|
|
1394
1595
|
] }, item.id);
|
|
1395
|
-
return /* @__PURE__ */
|
|
1596
|
+
return /* @__PURE__ */ jsxs24(
|
|
1396
1597
|
"nav",
|
|
1397
1598
|
{
|
|
1398
1599
|
className: cx("pire-sidenav", className),
|
|
1399
1600
|
"data-collapsed": collapsed ? "true" : void 0,
|
|
1400
|
-
"aria-label":
|
|
1601
|
+
"aria-label": msg.sideNavLabel,
|
|
1401
1602
|
...rest,
|
|
1402
1603
|
children: [
|
|
1403
1604
|
groups.map((group, gi) => {
|
|
@@ -1407,9 +1608,9 @@ function SideNav({
|
|
|
1407
1608
|
if (isGroup && !collapsed) return renderSection(item);
|
|
1408
1609
|
return renderRow(item, () => isGroup ? toggleExpanded(item.id) : onChange?.(item.id), isGroup);
|
|
1409
1610
|
});
|
|
1410
|
-
return /* @__PURE__ */
|
|
1411
|
-
group.label && !collapsed ? /* @__PURE__ */
|
|
1412
|
-
hasSections ? /* @__PURE__ */
|
|
1611
|
+
return /* @__PURE__ */ jsxs24("div", { className: "pire-sidenav-group", children: [
|
|
1612
|
+
group.label && !collapsed ? /* @__PURE__ */ jsx31("div", { className: "pire-sidenav-label", children: group.label }) : null,
|
|
1613
|
+
hasSections ? /* @__PURE__ */ jsx31(
|
|
1413
1614
|
DisclosureGroup,
|
|
1414
1615
|
{
|
|
1415
1616
|
className: "pire-sidenav-tree",
|
|
@@ -1421,7 +1622,7 @@ function SideNav({
|
|
|
1421
1622
|
) : rows
|
|
1422
1623
|
] }, group.label ?? gi);
|
|
1423
1624
|
}),
|
|
1424
|
-
footer ? /* @__PURE__ */
|
|
1625
|
+
footer ? /* @__PURE__ */ jsx31("div", { className: "pire-sidenav-footer", children: footer }) : null
|
|
1425
1626
|
]
|
|
1426
1627
|
}
|
|
1427
1628
|
);
|
|
@@ -1429,9 +1630,9 @@ function SideNav({
|
|
|
1429
1630
|
|
|
1430
1631
|
// src/components/navigation/Tabs.tsx
|
|
1431
1632
|
import { Tabs as AriaTabs, TabList, Tab as AriaTab, TabPanel } from "react-aria-components";
|
|
1432
|
-
import { jsx as
|
|
1633
|
+
import { jsx as jsx32, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
1433
1634
|
function Tabs({ items, value, defaultValue, onChange, panels, className, style, ...rest }) {
|
|
1434
|
-
return /* @__PURE__ */
|
|
1635
|
+
return /* @__PURE__ */ jsxs25(
|
|
1435
1636
|
AriaTabs,
|
|
1436
1637
|
{
|
|
1437
1638
|
className,
|
|
@@ -1440,22 +1641,22 @@ function Tabs({ items, value, defaultValue, onChange, panels, className, style,
|
|
|
1440
1641
|
defaultSelectedKey: defaultValue,
|
|
1441
1642
|
onSelectionChange: (k) => onChange?.(String(k)),
|
|
1442
1643
|
children: [
|
|
1443
|
-
/* @__PURE__ */
|
|
1444
|
-
item.icon ? /* @__PURE__ */
|
|
1644
|
+
/* @__PURE__ */ jsx32(TabList, { className: "pire-tablist", items, "aria-label": rest["aria-label"] ?? "Views", children: (item) => /* @__PURE__ */ jsxs25(AriaTab, { className: cx("pire-tab"), id: item.id, isDisabled: item.isDisabled, children: [
|
|
1645
|
+
item.icon ? /* @__PURE__ */ jsx32(Icon, { name: item.icon, size: 16 }) : null,
|
|
1445
1646
|
item.label,
|
|
1446
|
-
item.count != null ? /* @__PURE__ */
|
|
1647
|
+
item.count != null ? /* @__PURE__ */ jsx32("span", { className: "pire-tab-count", children: item.count }) : null
|
|
1447
1648
|
] }) }),
|
|
1448
|
-
items.map((item) => /* @__PURE__ */
|
|
1649
|
+
items.map((item) => /* @__PURE__ */ jsx32(TabPanel, { id: item.id, className: panels ? "pire-tabpanel" : void 0, children: panels?.[item.id] }, item.id))
|
|
1449
1650
|
]
|
|
1450
1651
|
}
|
|
1451
1652
|
);
|
|
1452
1653
|
}
|
|
1453
1654
|
|
|
1454
1655
|
// src/components/navigation/Breadcrumb.tsx
|
|
1455
|
-
import { Breadcrumbs as AriaBreadcrumbs, Breadcrumb as AriaBreadcrumb, Link } from "react-aria-components";
|
|
1456
|
-
import { jsx as
|
|
1656
|
+
import { Breadcrumbs as AriaBreadcrumbs, Breadcrumb as AriaBreadcrumb, Link as Link2 } from "react-aria-components";
|
|
1657
|
+
import { jsx as jsx33, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
1457
1658
|
function Breadcrumb({ items, onNavigate, className, style }) {
|
|
1458
|
-
return /* @__PURE__ */
|
|
1659
|
+
return /* @__PURE__ */ jsx33(
|
|
1459
1660
|
AriaBreadcrumbs,
|
|
1460
1661
|
{
|
|
1461
1662
|
className: cx("pire-breadcrumbs", className),
|
|
@@ -1464,9 +1665,9 @@ function Breadcrumb({ items, onNavigate, className, style }) {
|
|
|
1464
1665
|
onAction: (key) => onNavigate?.(String(key)),
|
|
1465
1666
|
children: (item) => {
|
|
1466
1667
|
const last = items[items.length - 1] === item;
|
|
1467
|
-
return /* @__PURE__ */
|
|
1468
|
-
last ? item.label : /* @__PURE__ */
|
|
1469
|
-
last ? null : /* @__PURE__ */
|
|
1668
|
+
return /* @__PURE__ */ jsxs26(AriaBreadcrumb, { className: "pire-breadcrumb", id: item.id ?? item.label, children: [
|
|
1669
|
+
last ? item.label : /* @__PURE__ */ jsx33(Link2, { href: item.href, children: item.label }),
|
|
1670
|
+
last ? null : /* @__PURE__ */ jsx33(Icon, { name: "chevron-right", size: 12, style: { color: "var(--text-tertiary)" } })
|
|
1470
1671
|
] });
|
|
1471
1672
|
}
|
|
1472
1673
|
}
|
|
@@ -1474,7 +1675,7 @@ function Breadcrumb({ items, onNavigate, className, style }) {
|
|
|
1474
1675
|
}
|
|
1475
1676
|
|
|
1476
1677
|
// src/components/navigation/Pagination.tsx
|
|
1477
|
-
import { jsx as
|
|
1678
|
+
import { jsx as jsx34, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
1478
1679
|
function Pagination({
|
|
1479
1680
|
page = 1,
|
|
1480
1681
|
pageSize = 25,
|
|
@@ -1485,49 +1686,39 @@ function Pagination({
|
|
|
1485
1686
|
className,
|
|
1486
1687
|
style
|
|
1487
1688
|
}) {
|
|
1689
|
+
const msg = usePireMessages();
|
|
1488
1690
|
const pages = Math.max(1, Math.ceil(total / pageSize));
|
|
1489
1691
|
const from = total === 0 ? 0 : (page - 1) * pageSize + 1;
|
|
1490
1692
|
const to = Math.min(total, page * pageSize);
|
|
1491
|
-
return /* @__PURE__ */
|
|
1492
|
-
/* @__PURE__ */
|
|
1493
|
-
|
|
1494
|
-
"\u2013",
|
|
1495
|
-
to.toLocaleString(),
|
|
1496
|
-
" of ",
|
|
1497
|
-
total.toLocaleString()
|
|
1498
|
-
] }),
|
|
1499
|
-
/* @__PURE__ */ jsx29(
|
|
1693
|
+
return /* @__PURE__ */ jsxs27("nav", { className: cx("pire-pagination", className), style, "aria-label": msg.paginationLabel, children: [
|
|
1694
|
+
/* @__PURE__ */ jsx34("span", { className: "pire-pagination-count", children: msg.paginationRange.replace("{from}", from.toLocaleString()).replace("{to}", to.toLocaleString()).replace("{total}", total.toLocaleString()) }),
|
|
1695
|
+
/* @__PURE__ */ jsx34(
|
|
1500
1696
|
IconButton,
|
|
1501
1697
|
{
|
|
1502
1698
|
icon: "chevron-left",
|
|
1503
|
-
label:
|
|
1699
|
+
label: msg.paginationPrevious,
|
|
1504
1700
|
size: "sm",
|
|
1505
1701
|
variant: "outlined",
|
|
1506
1702
|
isDisabled: page <= 1,
|
|
1507
1703
|
onPress: () => onPageChange?.(page - 1)
|
|
1508
1704
|
}
|
|
1509
1705
|
),
|
|
1510
|
-
/* @__PURE__ */
|
|
1511
|
-
|
|
1512
|
-
page,
|
|
1513
|
-
" of ",
|
|
1514
|
-
pages
|
|
1515
|
-
] }),
|
|
1516
|
-
/* @__PURE__ */ jsx29(
|
|
1706
|
+
/* @__PURE__ */ jsx34("span", { className: "pire-pagination-count", "aria-live": "polite", children: msg.paginationPageOf.replace("{page}", String(page)).replace("{pages}", String(pages)) }),
|
|
1707
|
+
/* @__PURE__ */ jsx34(
|
|
1517
1708
|
IconButton,
|
|
1518
1709
|
{
|
|
1519
1710
|
icon: "chevron-right",
|
|
1520
|
-
label:
|
|
1711
|
+
label: msg.paginationNext,
|
|
1521
1712
|
size: "sm",
|
|
1522
1713
|
variant: "outlined",
|
|
1523
1714
|
isDisabled: page >= pages,
|
|
1524
1715
|
onPress: () => onPageChange?.(page + 1)
|
|
1525
1716
|
}
|
|
1526
1717
|
),
|
|
1527
|
-
onPageSizeChange ? /* @__PURE__ */
|
|
1718
|
+
onPageSizeChange ? /* @__PURE__ */ jsx34(
|
|
1528
1719
|
Select,
|
|
1529
1720
|
{
|
|
1530
|
-
"aria-label":
|
|
1721
|
+
"aria-label": msg.paginationRowsPerPage,
|
|
1531
1722
|
size: "sm",
|
|
1532
1723
|
fullWidth: false,
|
|
1533
1724
|
value: String(pageSize),
|
|
@@ -1539,8 +1730,65 @@ function Pagination({
|
|
|
1539
1730
|
] });
|
|
1540
1731
|
}
|
|
1541
1732
|
|
|
1733
|
+
// src/components/navigation/Menu.tsx
|
|
1734
|
+
import {
|
|
1735
|
+
Menu as AriaMenu,
|
|
1736
|
+
MenuItem as AriaMenuItem,
|
|
1737
|
+
MenuSection as AriaMenuSection,
|
|
1738
|
+
Separator as AriaSeparator2,
|
|
1739
|
+
Header
|
|
1740
|
+
} from "react-aria-components";
|
|
1741
|
+
import { jsx as jsx35, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
1742
|
+
function Menu({ minWidth, className, style, ...rest }) {
|
|
1743
|
+
const width = typeof minWidth === "number" ? `${minWidth}px` : minWidth;
|
|
1744
|
+
const menuStyle = width == null ? style : { ["--pire-menu-min-w"]: width, ...style };
|
|
1745
|
+
return /* @__PURE__ */ jsx35(
|
|
1746
|
+
AriaMenu,
|
|
1747
|
+
{
|
|
1748
|
+
className: cx("pire-menu", className),
|
|
1749
|
+
style: menuStyle,
|
|
1750
|
+
...rest
|
|
1751
|
+
}
|
|
1752
|
+
);
|
|
1753
|
+
}
|
|
1754
|
+
function MenuItem({
|
|
1755
|
+
children,
|
|
1756
|
+
icon,
|
|
1757
|
+
description,
|
|
1758
|
+
shortcut,
|
|
1759
|
+
tone = "default",
|
|
1760
|
+
className,
|
|
1761
|
+
...rest
|
|
1762
|
+
}) {
|
|
1763
|
+
return /* @__PURE__ */ jsxs28(
|
|
1764
|
+
AriaMenuItem,
|
|
1765
|
+
{
|
|
1766
|
+
className: cx("pire-menu-item", className),
|
|
1767
|
+
"data-tone": tone === "danger" ? "danger" : void 0,
|
|
1768
|
+
...rest,
|
|
1769
|
+
children: [
|
|
1770
|
+
icon ? /* @__PURE__ */ jsx35(Icon, { name: icon, size: 16, className: "pire-menu-item-icon" }) : null,
|
|
1771
|
+
/* @__PURE__ */ jsxs28("span", { className: "pire-menu-item-body", children: [
|
|
1772
|
+
/* @__PURE__ */ jsx35("span", { className: "pire-menu-item-label", children }),
|
|
1773
|
+
description ? /* @__PURE__ */ jsx35("span", { className: "pire-menu-item-desc", children: description }) : null
|
|
1774
|
+
] }),
|
|
1775
|
+
shortcut ? /* @__PURE__ */ jsx35("kbd", { className: "pire-menu-item-shortcut", children: shortcut }) : null
|
|
1776
|
+
]
|
|
1777
|
+
}
|
|
1778
|
+
);
|
|
1779
|
+
}
|
|
1780
|
+
function MenuSection({ title, children, className, ...rest }) {
|
|
1781
|
+
return /* @__PURE__ */ jsxs28(AriaMenuSection, { className: cx("pire-menu-section", className), ...rest, children: [
|
|
1782
|
+
title ? /* @__PURE__ */ jsx35(Header, { className: "pire-menu-section-title", children: title }) : null,
|
|
1783
|
+
children
|
|
1784
|
+
] });
|
|
1785
|
+
}
|
|
1786
|
+
function MenuSeparator({ className }) {
|
|
1787
|
+
return /* @__PURE__ */ jsx35(AriaSeparator2, { className: cx("pire-menu-separator", className) });
|
|
1788
|
+
}
|
|
1789
|
+
|
|
1542
1790
|
// src/components/feedback/InlineMessage.tsx
|
|
1543
|
-
import { jsx as
|
|
1791
|
+
import { jsx as jsx36, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
1544
1792
|
var KIND_ICON = {
|
|
1545
1793
|
info: "info",
|
|
1546
1794
|
success: "check-circle-2",
|
|
@@ -1548,8 +1796,9 @@ var KIND_ICON = {
|
|
|
1548
1796
|
error: "alert-octagon"
|
|
1549
1797
|
};
|
|
1550
1798
|
function InlineMessage({ kind = "info", title, action, onClose, children, className, ...rest }) {
|
|
1799
|
+
const msg = usePireMessages();
|
|
1551
1800
|
const assertive = kind === "error" || kind === "warning";
|
|
1552
|
-
return /* @__PURE__ */
|
|
1801
|
+
return /* @__PURE__ */ jsxs29(
|
|
1553
1802
|
"div",
|
|
1554
1803
|
{
|
|
1555
1804
|
className: cx("pire-msg", className),
|
|
@@ -1558,13 +1807,13 @@ function InlineMessage({ kind = "info", title, action, onClose, children, classN
|
|
|
1558
1807
|
"aria-live": assertive ? "assertive" : "polite",
|
|
1559
1808
|
...rest,
|
|
1560
1809
|
children: [
|
|
1561
|
-
/* @__PURE__ */
|
|
1562
|
-
/* @__PURE__ */
|
|
1563
|
-
title ? /* @__PURE__ */
|
|
1564
|
-
children ? /* @__PURE__ */
|
|
1810
|
+
/* @__PURE__ */ jsx36(Icon, { name: KIND_ICON[kind], size: 16, style: { marginTop: 2 } }),
|
|
1811
|
+
/* @__PURE__ */ jsxs29("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: "var(--sp-1)" }, children: [
|
|
1812
|
+
title ? /* @__PURE__ */ jsx36("span", { className: "pire-msg-title", children: title }) : null,
|
|
1813
|
+
children ? /* @__PURE__ */ jsx36("span", { className: "pire-msg-body", children }) : null,
|
|
1565
1814
|
action
|
|
1566
1815
|
] }),
|
|
1567
|
-
onClose ? /* @__PURE__ */
|
|
1816
|
+
onClose ? /* @__PURE__ */ jsx36(IconButton, { icon: "x", label: msg.inlineMessageDismiss, size: "sm", onPress: onClose }) : null
|
|
1568
1817
|
]
|
|
1569
1818
|
}
|
|
1570
1819
|
);
|
|
@@ -1572,7 +1821,7 @@ function InlineMessage({ kind = "info", title, action, onClose, children, classN
|
|
|
1572
1821
|
|
|
1573
1822
|
// src/components/feedback/ProgressBar.tsx
|
|
1574
1823
|
import { ProgressBar as AriaProgressBar, Label as Label9 } from "react-aria-components";
|
|
1575
|
-
import { Fragment as Fragment2, jsx as
|
|
1824
|
+
import { Fragment as Fragment2, jsx as jsx37, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
1576
1825
|
function ProgressBar({
|
|
1577
1826
|
value = 0,
|
|
1578
1827
|
minValue = 0,
|
|
@@ -1585,7 +1834,7 @@ function ProgressBar({
|
|
|
1585
1834
|
className,
|
|
1586
1835
|
style
|
|
1587
1836
|
}) {
|
|
1588
|
-
return /* @__PURE__ */
|
|
1837
|
+
return /* @__PURE__ */ jsx37(
|
|
1589
1838
|
AriaProgressBar,
|
|
1590
1839
|
{
|
|
1591
1840
|
className: cx("pire-progress", className),
|
|
@@ -1596,20 +1845,20 @@ function ProgressBar({
|
|
|
1596
1845
|
maxValue,
|
|
1597
1846
|
isIndeterminate,
|
|
1598
1847
|
style,
|
|
1599
|
-
children: ({ percentage, valueText }) => /* @__PURE__ */
|
|
1600
|
-
label || showValue ? /* @__PURE__ */
|
|
1601
|
-
label ? /* @__PURE__ */
|
|
1602
|
-
showValue && !isIndeterminate ? /* @__PURE__ */
|
|
1848
|
+
children: ({ percentage, valueText }) => /* @__PURE__ */ jsxs30(Fragment2, { children: [
|
|
1849
|
+
label || showValue ? /* @__PURE__ */ jsxs30("div", { className: "pire-progress-head", children: [
|
|
1850
|
+
label ? /* @__PURE__ */ jsx37(Label9, { children: label }) : /* @__PURE__ */ jsx37("span", {}),
|
|
1851
|
+
showValue && !isIndeterminate ? /* @__PURE__ */ jsx37("span", { className: "pire-numeric", children: valueText }) : null
|
|
1603
1852
|
] }) : null,
|
|
1604
|
-
/* @__PURE__ */
|
|
1853
|
+
/* @__PURE__ */ jsx37("div", { className: "pire-progress-track", children: /* @__PURE__ */ jsx37("div", { className: "pire-progress-fill", style: { width: `${isIndeterminate ? 40 : percentage}%` } }) })
|
|
1605
1854
|
] })
|
|
1606
1855
|
}
|
|
1607
1856
|
);
|
|
1608
1857
|
}
|
|
1609
1858
|
|
|
1610
1859
|
// src/components/feedback/Toast.tsx
|
|
1611
|
-
import * as
|
|
1612
|
-
import { jsx as
|
|
1860
|
+
import * as React11 from "react";
|
|
1861
|
+
import { jsx as jsx38, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
1613
1862
|
var KIND_ICON2 = {
|
|
1614
1863
|
info: "info",
|
|
1615
1864
|
success: "check-circle-2",
|
|
@@ -1617,7 +1866,8 @@ var KIND_ICON2 = {
|
|
|
1617
1866
|
error: "alert-octagon"
|
|
1618
1867
|
};
|
|
1619
1868
|
function Toast({ kind = "success", onClose, position = "bottom-center", children, className, ...rest }) {
|
|
1620
|
-
|
|
1869
|
+
const msg = usePireMessages();
|
|
1870
|
+
return /* @__PURE__ */ jsxs31(
|
|
1621
1871
|
"div",
|
|
1622
1872
|
{
|
|
1623
1873
|
className: cx("pire-toast", className),
|
|
@@ -1626,40 +1876,41 @@ function Toast({ kind = "success", onClose, position = "bottom-center", children
|
|
|
1626
1876
|
"aria-live": kind === "error" ? "assertive" : "polite",
|
|
1627
1877
|
...rest,
|
|
1628
1878
|
children: [
|
|
1629
|
-
/* @__PURE__ */
|
|
1630
|
-
/* @__PURE__ */
|
|
1631
|
-
onClose ? /* @__PURE__ */
|
|
1879
|
+
/* @__PURE__ */ jsx38(Icon, { name: KIND_ICON2[kind], size: 16 }),
|
|
1880
|
+
/* @__PURE__ */ jsx38("span", { style: { flex: 1 }, children }),
|
|
1881
|
+
onClose ? /* @__PURE__ */ jsx38(IconButton, { icon: "x", label: msg.toastDismiss, size: "sm", variant: "inverse", onPress: onClose }) : null
|
|
1632
1882
|
]
|
|
1633
1883
|
}
|
|
1634
1884
|
);
|
|
1635
1885
|
}
|
|
1636
|
-
var ToastContext =
|
|
1886
|
+
var ToastContext = React11.createContext(null);
|
|
1637
1887
|
function ToastProvider({ children, timeout = 6e3 }) {
|
|
1638
|
-
const
|
|
1639
|
-
const
|
|
1640
|
-
const
|
|
1888
|
+
const msg = usePireMessages();
|
|
1889
|
+
const [toasts, setToasts] = React11.useState([]);
|
|
1890
|
+
const close = React11.useCallback((id) => setToasts((t) => t.filter((x) => x.id !== id)), []);
|
|
1891
|
+
const add = React11.useCallback((toast) => {
|
|
1641
1892
|
const id = Math.random().toString(36).slice(2);
|
|
1642
1893
|
setToasts((t) => [...t, { ...toast, id }]);
|
|
1643
1894
|
const ms = toast.timeout ?? timeout;
|
|
1644
1895
|
if (ms > 0) setTimeout(() => close(id), ms);
|
|
1645
1896
|
return id;
|
|
1646
1897
|
}, [close, timeout]);
|
|
1647
|
-
const value =
|
|
1648
|
-
return /* @__PURE__ */
|
|
1898
|
+
const value = React11.useMemo(() => ({ add, close }), [add, close]);
|
|
1899
|
+
return /* @__PURE__ */ jsxs31(ToastContext.Provider, { value, children: [
|
|
1649
1900
|
children,
|
|
1650
|
-
/* @__PURE__ */
|
|
1901
|
+
/* @__PURE__ */ jsx38("div", { className: "pire-toast-region", role: "region", "aria-label": msg.toastRegionLabel, children: toasts.map((t) => /* @__PURE__ */ jsx38(Toast, { kind: t.kind, onClose: () => close(t.id), style: { position: "static", transform: "none" }, children: t.message }, t.id)) })
|
|
1651
1902
|
] });
|
|
1652
1903
|
}
|
|
1653
1904
|
function useToast() {
|
|
1654
|
-
const ctx =
|
|
1905
|
+
const ctx = React11.useContext(ToastContext);
|
|
1655
1906
|
if (!ctx) throw new Error("useToast must be used inside <ToastProvider>");
|
|
1656
1907
|
return ctx;
|
|
1657
1908
|
}
|
|
1658
1909
|
|
|
1659
1910
|
// src/components/feedback/Skeleton.tsx
|
|
1660
|
-
import { jsx as
|
|
1911
|
+
import { jsx as jsx39 } from "react/jsx-runtime";
|
|
1661
1912
|
function Skeleton({ shape = "text", width, height, className, style, ...rest }) {
|
|
1662
|
-
return /* @__PURE__ */
|
|
1913
|
+
return /* @__PURE__ */ jsx39(
|
|
1663
1914
|
"div",
|
|
1664
1915
|
{
|
|
1665
1916
|
className: cx("pire-skeleton", className),
|
|
@@ -1673,7 +1924,7 @@ function Skeleton({ shape = "text", width, height, className, style, ...rest })
|
|
|
1673
1924
|
var BAR_WIDTHS = ["72%", "54%", "86%", "63%"];
|
|
1674
1925
|
function SkeletonTableRow({ columns, density = "regular", className, style, ...rest }) {
|
|
1675
1926
|
const cells = typeof columns === "number" ? Array.from({ length: columns }, () => ({})) : columns;
|
|
1676
|
-
return /* @__PURE__ */
|
|
1927
|
+
return /* @__PURE__ */ jsx39(
|
|
1677
1928
|
"div",
|
|
1678
1929
|
{
|
|
1679
1930
|
className: cx("pire-skeleton-row", className),
|
|
@@ -1685,13 +1936,13 @@ function SkeletonTableRow({ columns, density = "regular", className, style, ...r
|
|
|
1685
1936
|
const align = c.numeric ? "right" : c.align ?? "left";
|
|
1686
1937
|
return (
|
|
1687
1938
|
// biome-ignore lint/suspicious/noArrayIndexKey: columns are positional and never reordered.
|
|
1688
|
-
/* @__PURE__ */
|
|
1939
|
+
/* @__PURE__ */ jsx39(
|
|
1689
1940
|
"div",
|
|
1690
1941
|
{
|
|
1691
1942
|
className: "pire-skeleton-cell",
|
|
1692
1943
|
"data-align": align,
|
|
1693
1944
|
style: { width: c.width, flex: c.width ? "0 0 auto" : void 0 },
|
|
1694
|
-
children: /* @__PURE__ */
|
|
1945
|
+
children: /* @__PURE__ */ jsx39(Skeleton, { width: BAR_WIDTHS[i % BAR_WIDTHS.length] })
|
|
1695
1946
|
},
|
|
1696
1947
|
i
|
|
1697
1948
|
)
|
|
@@ -1703,7 +1954,7 @@ function SkeletonTableRow({ columns, density = "regular", className, style, ...r
|
|
|
1703
1954
|
|
|
1704
1955
|
// src/components/data/KpiTile.tsx
|
|
1705
1956
|
import { Button as AriaButton10 } from "react-aria-components";
|
|
1706
|
-
import { Fragment as Fragment3, jsx as
|
|
1957
|
+
import { Fragment as Fragment3, jsx as jsx40, jsxs as jsxs32 } from "react/jsx-runtime";
|
|
1707
1958
|
function KpiTile({
|
|
1708
1959
|
label,
|
|
1709
1960
|
value,
|
|
@@ -1719,50 +1970,50 @@ function KpiTile({
|
|
|
1719
1970
|
style
|
|
1720
1971
|
}) {
|
|
1721
1972
|
const tone = deltaTone ?? (deltaDirection === "down" ? "negative" : "positive");
|
|
1722
|
-
const body = /* @__PURE__ */
|
|
1723
|
-
/* @__PURE__ */
|
|
1724
|
-
icon ? /* @__PURE__ */
|
|
1973
|
+
const body = /* @__PURE__ */ jsxs32(Fragment3, { children: [
|
|
1974
|
+
/* @__PURE__ */ jsxs32("span", { className: "pire-kpi-label", children: [
|
|
1975
|
+
icon ? /* @__PURE__ */ jsx40(Icon, { name: icon, size: 16 }) : null,
|
|
1725
1976
|
label
|
|
1726
1977
|
] }),
|
|
1727
|
-
/* @__PURE__ */
|
|
1978
|
+
/* @__PURE__ */ jsxs32("span", { className: "pire-kpi-value", children: [
|
|
1728
1979
|
value,
|
|
1729
|
-
unit ? /* @__PURE__ */
|
|
1980
|
+
unit ? /* @__PURE__ */ jsx40("span", { className: "pire-kpi-unit", children: unit }) : null
|
|
1730
1981
|
] }),
|
|
1731
|
-
delta ? /* @__PURE__ */
|
|
1732
|
-
deltaDirection ? /* @__PURE__ */
|
|
1982
|
+
delta ? /* @__PURE__ */ jsxs32("span", { className: "pire-kpi-delta", "data-tone": tone, children: [
|
|
1983
|
+
deltaDirection ? /* @__PURE__ */ jsx40(Icon, { name: deltaDirection === "up" ? "trending-up" : "trending-down", size: 12 }) : null,
|
|
1733
1984
|
delta
|
|
1734
1985
|
] }) : null,
|
|
1735
|
-
footnote ? /* @__PURE__ */
|
|
1986
|
+
footnote ? /* @__PURE__ */ jsx40("span", { className: "pire-kpi-foot", children: footnote }) : null
|
|
1736
1987
|
] });
|
|
1737
1988
|
const props = { className: cx("pire-kpi", className), "data-status": status, style };
|
|
1738
|
-
return onPress ? /* @__PURE__ */
|
|
1989
|
+
return onPress ? /* @__PURE__ */ jsx40(AriaButton10, { ...props, "data-pressable": "true", onPress, children: body }) : /* @__PURE__ */ jsx40("div", { ...props, children: body });
|
|
1739
1990
|
}
|
|
1740
1991
|
|
|
1741
1992
|
// src/components/data/ObjectHeader.tsx
|
|
1742
|
-
import { jsx as
|
|
1993
|
+
import { jsx as jsx41, jsxs as jsxs33 } from "react/jsx-runtime";
|
|
1743
1994
|
function ObjectHeader({ title, subtitle, id, breadcrumb, badge, facts, actions, className, ...rest }) {
|
|
1744
|
-
return /* @__PURE__ */
|
|
1995
|
+
return /* @__PURE__ */ jsxs33("header", { className: cx("pire-objheader", className), ...rest, children: [
|
|
1745
1996
|
breadcrumb,
|
|
1746
|
-
/* @__PURE__ */
|
|
1747
|
-
/* @__PURE__ */
|
|
1748
|
-
/* @__PURE__ */
|
|
1749
|
-
subtitle || id ? /* @__PURE__ */
|
|
1997
|
+
/* @__PURE__ */ jsxs33("div", { className: "pire-objheader-row", children: [
|
|
1998
|
+
/* @__PURE__ */ jsxs33("div", { style: { minWidth: 0 }, children: [
|
|
1999
|
+
/* @__PURE__ */ jsx41("h1", { className: "pire-objheader-title", children: title }),
|
|
2000
|
+
subtitle || id ? /* @__PURE__ */ jsxs33("div", { className: "pire-objheader-sub", children: [
|
|
1750
2001
|
subtitle,
|
|
1751
|
-
id ? /* @__PURE__ */
|
|
2002
|
+
id ? /* @__PURE__ */ jsx41("span", { className: "pire-objheader-id", children: id }) : null
|
|
1752
2003
|
] }) : null
|
|
1753
2004
|
] }),
|
|
1754
2005
|
badge,
|
|
1755
|
-
actions ? /* @__PURE__ */
|
|
2006
|
+
actions ? /* @__PURE__ */ jsx41("div", { className: "pire-objheader-actions", children: actions }) : null
|
|
1756
2007
|
] }),
|
|
1757
|
-
facts?.length ? /* @__PURE__ */
|
|
1758
|
-
/* @__PURE__ */
|
|
1759
|
-
/* @__PURE__ */
|
|
2008
|
+
facts?.length ? /* @__PURE__ */ jsx41("dl", { className: "pire-facts", style: { margin: 0 }, children: facts.map((fact) => /* @__PURE__ */ jsxs33("div", { children: [
|
|
2009
|
+
/* @__PURE__ */ jsx41("dt", { className: "pire-fact-label", children: fact.label }),
|
|
2010
|
+
/* @__PURE__ */ jsx41("dd", { className: "pire-fact-value", "data-numeric": fact.numeric ? "true" : void 0, style: { margin: 0 }, children: fact.value })
|
|
1760
2011
|
] }, fact.label)) }) : null
|
|
1761
2012
|
] });
|
|
1762
2013
|
}
|
|
1763
2014
|
|
|
1764
2015
|
// src/components/data/FilterBar.tsx
|
|
1765
|
-
import { jsx as
|
|
2016
|
+
import { jsx as jsx42, jsxs as jsxs34 } from "react/jsx-runtime";
|
|
1766
2017
|
function FilterBar({
|
|
1767
2018
|
children,
|
|
1768
2019
|
activeFilters = [],
|
|
@@ -1771,118 +2022,123 @@ function FilterBar({
|
|
|
1771
2022
|
onGo,
|
|
1772
2023
|
resultLabel,
|
|
1773
2024
|
actions,
|
|
2025
|
+
goLabel,
|
|
2026
|
+
clearAllLabel,
|
|
1774
2027
|
className,
|
|
1775
2028
|
...rest
|
|
1776
2029
|
}) {
|
|
1777
|
-
|
|
1778
|
-
|
|
2030
|
+
const label = useMessage("filterBarLabel", rest["aria-label"]);
|
|
2031
|
+
const go = useMessage("filterBarGo", goLabel);
|
|
2032
|
+
const clearAll = useMessage("filterBarClearAll", clearAllLabel);
|
|
2033
|
+
return /* @__PURE__ */ jsxs34("section", { className: cx("pire-filterbar", className), ...rest, "aria-label": label, children: [
|
|
2034
|
+
/* @__PURE__ */ jsxs34("div", { className: "pire-filterbar-controls", children: [
|
|
1779
2035
|
children,
|
|
1780
|
-
onGo ? /* @__PURE__ */
|
|
2036
|
+
onGo ? /* @__PURE__ */ jsx42(Button, { variant: "primary", onPress: onGo, children: go }) : null
|
|
1781
2037
|
] }),
|
|
1782
|
-
activeFilters.length || resultLabel || actions ? /* @__PURE__ */
|
|
1783
|
-
activeFilters.map((filter) => /* @__PURE__ */
|
|
1784
|
-
activeFilters.length && onClear ? /* @__PURE__ */
|
|
1785
|
-
resultLabel ? /* @__PURE__ */
|
|
1786
|
-
actions ? /* @__PURE__ */
|
|
2038
|
+
activeFilters.length || resultLabel || actions ? /* @__PURE__ */ jsxs34("div", { className: "pire-filterbar-foot", children: [
|
|
2039
|
+
activeFilters.map((filter) => /* @__PURE__ */ jsx42(Tag, { onRemove: onRemoveFilter ? () => onRemoveFilter(filter.id) : void 0, children: filter.label }, filter.id)),
|
|
2040
|
+
activeFilters.length && onClear ? /* @__PURE__ */ jsx42(Button, { variant: "tertiary", size: "sm", onPress: onClear, children: clearAll }) : null,
|
|
2041
|
+
resultLabel ? /* @__PURE__ */ jsx42("span", { className: "pire-filterbar-result", "aria-live": "polite", children: resultLabel }) : null,
|
|
2042
|
+
actions ? /* @__PURE__ */ jsx42("div", { className: "pire-filterbar-actions", children: actions }) : null
|
|
1787
2043
|
] }) : null
|
|
1788
2044
|
] });
|
|
1789
2045
|
}
|
|
1790
2046
|
|
|
1791
2047
|
// src/components/data/DescriptionList.tsx
|
|
1792
|
-
import { jsx as
|
|
2048
|
+
import { jsx as jsx43, jsxs as jsxs35 } from "react/jsx-runtime";
|
|
1793
2049
|
function DescriptionList({ items, layout = "rows", columns = 3, className, style, ...rest }) {
|
|
1794
|
-
return /* @__PURE__ */
|
|
2050
|
+
return /* @__PURE__ */ jsx43(
|
|
1795
2051
|
"dl",
|
|
1796
2052
|
{
|
|
1797
2053
|
className: cx("pire-dl", className),
|
|
1798
2054
|
"data-layout": layout,
|
|
1799
2055
|
style: { ...layout === "grid" ? { "--pire-dl-cols": columns } : null, ...style },
|
|
1800
2056
|
...rest,
|
|
1801
|
-
children: items.map((item, i) => /* @__PURE__ */
|
|
1802
|
-
/* @__PURE__ */
|
|
2057
|
+
children: items.map((item, i) => /* @__PURE__ */ jsxs35("div", { className: "pire-dl-row", "data-emphasis": item.emphasis ? "true" : void 0, children: [
|
|
2058
|
+
/* @__PURE__ */ jsxs35("dt", { className: "pire-dl-term", children: [
|
|
1803
2059
|
item.label,
|
|
1804
2060
|
item.hint
|
|
1805
2061
|
] }),
|
|
1806
|
-
/* @__PURE__ */
|
|
2062
|
+
/* @__PURE__ */ jsx43("dd", { className: "pire-dl-value", "data-numeric": item.numeric ? "true" : void 0, children: item.value })
|
|
1807
2063
|
] }, i))
|
|
1808
2064
|
}
|
|
1809
2065
|
);
|
|
1810
2066
|
}
|
|
1811
2067
|
|
|
1812
2068
|
// src/components/data/Timeline.tsx
|
|
1813
|
-
import { jsx as
|
|
2069
|
+
import { jsx as jsx44, jsxs as jsxs36 } from "react/jsx-runtime";
|
|
1814
2070
|
function Timeline({ entries, reverse = false, className, ...rest }) {
|
|
1815
2071
|
const list = reverse ? [...entries].reverse() : entries;
|
|
1816
|
-
return /* @__PURE__ */
|
|
1817
|
-
/* @__PURE__ */
|
|
1818
|
-
/* @__PURE__ */
|
|
1819
|
-
entry.actor ? /* @__PURE__ */
|
|
2072
|
+
return /* @__PURE__ */ jsx44("ol", { className: cx("pire-timeline", className), ...rest, children: list.map((entry, i) => /* @__PURE__ */ jsxs36("li", { className: "pire-timeline-item", children: [
|
|
2073
|
+
/* @__PURE__ */ jsx44("span", { className: "pire-timeline-time", children: entry.time }),
|
|
2074
|
+
/* @__PURE__ */ jsx44("span", { className: "pire-timeline-text", children: entry.event }),
|
|
2075
|
+
entry.actor ? /* @__PURE__ */ jsx44("span", { className: "pire-timeline-actor", children: entry.actor }) : null
|
|
1820
2076
|
] }, entry.id ?? i)) });
|
|
1821
2077
|
}
|
|
1822
2078
|
|
|
1823
2079
|
// src/components/data/LinkList.tsx
|
|
1824
2080
|
import { Button as AriaButton11 } from "react-aria-components";
|
|
1825
|
-
import { jsx as
|
|
2081
|
+
import { jsx as jsx45, jsxs as jsxs37 } from "react/jsx-runtime";
|
|
1826
2082
|
function LinkList({ items, onSelect, className, ...rest }) {
|
|
1827
|
-
return /* @__PURE__ */
|
|
1828
|
-
item.icon ? /* @__PURE__ */
|
|
1829
|
-
item.key ? /* @__PURE__ */
|
|
1830
|
-
item.text ? /* @__PURE__ */
|
|
2083
|
+
return /* @__PURE__ */ jsx45("div", { className: cx("pire-linklist", className), role: "list", ...rest, children: items.map((item) => /* @__PURE__ */ jsxs37(AriaButton11, { className: "pire-linklist-item", onPress: () => onSelect?.(item.id), children: [
|
|
2084
|
+
item.icon ? /* @__PURE__ */ jsx45(Icon, { name: item.icon, size: 16, style: { color: "var(--text-secondary)" } }) : null,
|
|
2085
|
+
item.key ? /* @__PURE__ */ jsx45("span", { className: "pire-linklist-key", children: item.key }) : null,
|
|
2086
|
+
item.text ? /* @__PURE__ */ jsx45("span", { className: "pire-linklist-text", children: item.text }) : null,
|
|
1831
2087
|
item.trailing
|
|
1832
2088
|
] }, item.id)) });
|
|
1833
2089
|
}
|
|
1834
2090
|
|
|
1835
2091
|
// src/components/layout/PageHeader.tsx
|
|
1836
|
-
import { jsx as
|
|
2092
|
+
import { jsx as jsx46, jsxs as jsxs38 } from "react/jsx-runtime";
|
|
1837
2093
|
function PageHeader({ title, subtitle, actions, className, ...rest }) {
|
|
1838
|
-
return /* @__PURE__ */
|
|
1839
|
-
/* @__PURE__ */
|
|
1840
|
-
/* @__PURE__ */
|
|
1841
|
-
subtitle ? /* @__PURE__ */
|
|
2094
|
+
return /* @__PURE__ */ jsxs38("header", { className: cx("pire-pageheader", className), ...rest, children: [
|
|
2095
|
+
/* @__PURE__ */ jsxs38("div", { style: { minWidth: 0 }, children: [
|
|
2096
|
+
/* @__PURE__ */ jsx46("h1", { className: "pire-pageheader-title", children: title }),
|
|
2097
|
+
subtitle ? /* @__PURE__ */ jsx46("p", { className: "pire-pageheader-sub", children: subtitle }) : null
|
|
1842
2098
|
] }),
|
|
1843
|
-
actions ? /* @__PURE__ */
|
|
2099
|
+
actions ? /* @__PURE__ */ jsx46("div", { className: "pire-pageheader-actions", children: actions }) : null
|
|
1844
2100
|
] });
|
|
1845
2101
|
}
|
|
1846
2102
|
|
|
1847
2103
|
// src/components/layout/SectionHeader.tsx
|
|
1848
|
-
import { jsx as
|
|
2104
|
+
import { jsx as jsx47, jsxs as jsxs39 } from "react/jsx-runtime";
|
|
1849
2105
|
function SectionHeader({ title, meta, actions, className, ...rest }) {
|
|
1850
|
-
return /* @__PURE__ */
|
|
1851
|
-
/* @__PURE__ */
|
|
1852
|
-
meta ? /* @__PURE__ */
|
|
1853
|
-
actions ? /* @__PURE__ */
|
|
2106
|
+
return /* @__PURE__ */ jsxs39("div", { className: cx("pire-sectionhead", className), ...rest, children: [
|
|
2107
|
+
/* @__PURE__ */ jsx47("span", { className: "pire-eyebrow", children: title }),
|
|
2108
|
+
meta ? /* @__PURE__ */ jsx47("span", { style: { font: "var(--type-caption)", color: "var(--text-tertiary)" }, children: meta }) : null,
|
|
2109
|
+
actions ? /* @__PURE__ */ jsx47("div", { className: "pire-sectionhead-actions", children: actions }) : null
|
|
1854
2110
|
] });
|
|
1855
2111
|
}
|
|
1856
2112
|
|
|
1857
2113
|
// src/components/layout/SelectionBar.tsx
|
|
1858
|
-
import { jsx as
|
|
2114
|
+
import { jsx as jsx48, jsxs as jsxs40 } from "react/jsx-runtime";
|
|
1859
2115
|
function SelectionBar({ count, noun = "record", children, actions, className, ...rest }) {
|
|
1860
2116
|
if (!count) return null;
|
|
1861
|
-
return /* @__PURE__ */
|
|
1862
|
-
/* @__PURE__ */
|
|
2117
|
+
return /* @__PURE__ */ jsxs40("div", { className: cx("pire-selectionbar", className), role: "status", "aria-live": "polite", ...rest, children: [
|
|
2118
|
+
/* @__PURE__ */ jsxs40("span", { className: "pire-selectionbar-count", children: [
|
|
1863
2119
|
count.toLocaleString(),
|
|
1864
2120
|
" ",
|
|
1865
2121
|
noun,
|
|
1866
2122
|
count === 1 ? "" : "s",
|
|
1867
2123
|
" selected"
|
|
1868
2124
|
] }),
|
|
1869
|
-
children ? /* @__PURE__ */
|
|
1870
|
-
actions ? /* @__PURE__ */
|
|
2125
|
+
children ? /* @__PURE__ */ jsx48("span", { style: { color: "var(--text-secondary)", font: "var(--type-caption)" }, children }) : null,
|
|
2126
|
+
actions ? /* @__PURE__ */ jsx48("div", { className: "pire-selectionbar-actions", children: actions }) : null
|
|
1871
2127
|
] });
|
|
1872
2128
|
}
|
|
1873
2129
|
|
|
1874
2130
|
// src/components/layout/FooterBar.tsx
|
|
1875
|
-
import { jsx as
|
|
2131
|
+
import { jsx as jsx49, jsxs as jsxs41 } from "react/jsx-runtime";
|
|
1876
2132
|
function FooterBar({ note, actions, children, className, ...rest }) {
|
|
1877
|
-
return /* @__PURE__ */
|
|
1878
|
-
note ? /* @__PURE__ */
|
|
2133
|
+
return /* @__PURE__ */ jsxs41("footer", { className: cx("pire-footerbar", className), ...rest, children: [
|
|
2134
|
+
note ? /* @__PURE__ */ jsx49("span", { className: "pire-footerbar-note", children: note }) : null,
|
|
1879
2135
|
children,
|
|
1880
|
-
actions ? /* @__PURE__ */
|
|
2136
|
+
actions ? /* @__PURE__ */ jsx49("div", { className: "pire-footerbar-actions", children: actions }) : null
|
|
1881
2137
|
] });
|
|
1882
2138
|
}
|
|
1883
2139
|
|
|
1884
2140
|
// src/components/patterns/ConfirmDialog.tsx
|
|
1885
|
-
import { Fragment as Fragment4, jsx as
|
|
2141
|
+
import { Fragment as Fragment4, jsx as jsx50, jsxs as jsxs42 } from "react/jsx-runtime";
|
|
1886
2142
|
function ConfirmDialog({
|
|
1887
2143
|
isOpen,
|
|
1888
2144
|
title,
|
|
@@ -1896,7 +2152,7 @@ function ConfirmDialog({
|
|
|
1896
2152
|
onConfirm,
|
|
1897
2153
|
onCancel
|
|
1898
2154
|
}) {
|
|
1899
|
-
return /* @__PURE__ */
|
|
2155
|
+
return /* @__PURE__ */ jsxs42(
|
|
1900
2156
|
Dialog,
|
|
1901
2157
|
{
|
|
1902
2158
|
isOpen,
|
|
@@ -1906,12 +2162,12 @@ function ConfirmDialog({
|
|
|
1906
2162
|
onClose: onCancel,
|
|
1907
2163
|
isDismissable: !isBusy,
|
|
1908
2164
|
showClose: false,
|
|
1909
|
-
footer: /* @__PURE__ */
|
|
1910
|
-
/* @__PURE__ */
|
|
1911
|
-
/* @__PURE__ */
|
|
2165
|
+
footer: /* @__PURE__ */ jsxs42(Fragment4, { children: [
|
|
2166
|
+
/* @__PURE__ */ jsx50(Button, { variant: "tertiary", isDisabled: isBusy, onPress: onCancel, children: cancelLabel }),
|
|
2167
|
+
/* @__PURE__ */ jsx50(Button, { variant: tone === "danger" ? "danger" : "primary", isDisabled: isBusy, onPress: onConfirm, children: isBusy ? "Working\u2026" : confirmLabel })
|
|
1912
2168
|
] }),
|
|
1913
2169
|
children: [
|
|
1914
|
-
consequence ? /* @__PURE__ */
|
|
2170
|
+
consequence ? /* @__PURE__ */ jsx50(InlineMessage, { kind: tone === "danger" ? "error" : "warning", style: { marginBottom: children ? "var(--sp-3)" : 0 }, children: consequence }) : null,
|
|
1915
2171
|
children
|
|
1916
2172
|
]
|
|
1917
2173
|
}
|
|
@@ -1919,10 +2175,11 @@ function ConfirmDialog({
|
|
|
1919
2175
|
}
|
|
1920
2176
|
|
|
1921
2177
|
// src/components/patterns/SidePanel.tsx
|
|
1922
|
-
import { ModalOverlay as ModalOverlay2, Modal as Modal2, Dialog as AriaDialog3, Heading as
|
|
1923
|
-
import { jsx as
|
|
2178
|
+
import { ModalOverlay as ModalOverlay2, Modal as Modal2, Dialog as AriaDialog3, Heading as Heading4 } from "react-aria-components";
|
|
2179
|
+
import { jsx as jsx51, jsxs as jsxs43 } from "react/jsx-runtime";
|
|
1924
2180
|
function SidePanel({ isOpen, title, subtitle, width = 400, children, footer, onClose, className }) {
|
|
1925
|
-
|
|
2181
|
+
const msg = usePireMessages();
|
|
2182
|
+
return /* @__PURE__ */ jsx51(
|
|
1926
2183
|
ModalOverlay2,
|
|
1927
2184
|
{
|
|
1928
2185
|
className: "pire-sidepanel-overlay",
|
|
@@ -1931,34 +2188,34 @@ function SidePanel({ isOpen, title, subtitle, width = 400, children, footer, onC
|
|
|
1931
2188
|
onOpenChange: (o) => {
|
|
1932
2189
|
if (!o) onClose?.();
|
|
1933
2190
|
},
|
|
1934
|
-
children: /* @__PURE__ */
|
|
1935
|
-
/* @__PURE__ */
|
|
1936
|
-
/* @__PURE__ */
|
|
1937
|
-
/* @__PURE__ */
|
|
1938
|
-
subtitle ? /* @__PURE__ */
|
|
2191
|
+
children: /* @__PURE__ */ jsx51(Modal2, { className: cx("pire-sidepanel", className), style: { width }, children: /* @__PURE__ */ jsxs43(AriaDialog3, { className: "pire-dialog", style: { height: "100%" }, children: [
|
|
2192
|
+
/* @__PURE__ */ jsxs43("header", { className: "pire-dialog-head", children: [
|
|
2193
|
+
/* @__PURE__ */ jsxs43("div", { style: { flex: 1, minWidth: 0 }, children: [
|
|
2194
|
+
/* @__PURE__ */ jsx51(Heading4, { slot: "title", className: "pire-dialog-title", children: title }),
|
|
2195
|
+
subtitle ? /* @__PURE__ */ jsx51("p", { className: "pire-dialog-sub", style: { margin: 0 }, children: subtitle }) : null
|
|
1939
2196
|
] }),
|
|
1940
|
-
/* @__PURE__ */
|
|
2197
|
+
/* @__PURE__ */ jsx51(IconButton, { icon: "x", label: msg.sidePanelClose, size: "sm", onPress: onClose })
|
|
1941
2198
|
] }),
|
|
1942
|
-
/* @__PURE__ */
|
|
1943
|
-
footer ? /* @__PURE__ */
|
|
2199
|
+
/* @__PURE__ */ jsx51("div", { className: "pire-dialog-body", style: { flex: 1 }, children }),
|
|
2200
|
+
footer ? /* @__PURE__ */ jsx51("footer", { className: "pire-dialog-foot", children: footer }) : null
|
|
1944
2201
|
] }) })
|
|
1945
2202
|
}
|
|
1946
2203
|
);
|
|
1947
2204
|
}
|
|
1948
2205
|
|
|
1949
2206
|
// src/components/patterns/EmptyState.tsx
|
|
1950
|
-
import { jsx as
|
|
2207
|
+
import { jsx as jsx52, jsxs as jsxs44 } from "react/jsx-runtime";
|
|
1951
2208
|
function EmptyState({ icon = "file-text", title, action, compact, children, className, ...rest }) {
|
|
1952
|
-
return /* @__PURE__ */
|
|
1953
|
-
/* @__PURE__ */
|
|
1954
|
-
title ? /* @__PURE__ */
|
|
1955
|
-
children ? /* @__PURE__ */
|
|
2209
|
+
return /* @__PURE__ */ jsxs44("div", { className: cx("pire-empty", className), "data-compact": compact ? "true" : void 0, ...rest, children: [
|
|
2210
|
+
/* @__PURE__ */ jsx52(Icon, { name: icon, size: 24, className: "pire-empty-icon" }),
|
|
2211
|
+
title ? /* @__PURE__ */ jsx52("p", { className: "pire-empty-title", style: { margin: 0 }, children: title }) : null,
|
|
2212
|
+
children ? /* @__PURE__ */ jsx52("p", { className: "pire-empty-body", style: { margin: 0 }, children }) : null,
|
|
1956
2213
|
action
|
|
1957
2214
|
] });
|
|
1958
2215
|
}
|
|
1959
2216
|
|
|
1960
2217
|
// src/index.ts
|
|
1961
|
-
import { DialogTrigger, MenuTrigger,
|
|
2218
|
+
import { DialogTrigger, MenuTrigger, SubmenuTrigger, Popover as Popover5, RouterProvider, I18nProvider } from "react-aria-components";
|
|
1962
2219
|
export {
|
|
1963
2220
|
Avatar,
|
|
1964
2221
|
Badge,
|
|
@@ -1977,25 +2234,31 @@ export {
|
|
|
1977
2234
|
FilterBar,
|
|
1978
2235
|
FooterBar,
|
|
1979
2236
|
FormField,
|
|
2237
|
+
Heading,
|
|
1980
2238
|
I18nProvider,
|
|
1981
2239
|
Icon,
|
|
1982
2240
|
IconButton,
|
|
1983
2241
|
InlineMessage,
|
|
1984
2242
|
Input,
|
|
1985
2243
|
KpiTile,
|
|
2244
|
+
Link,
|
|
1986
2245
|
LinkList,
|
|
1987
2246
|
Menu,
|
|
1988
2247
|
MenuItem,
|
|
2248
|
+
MenuSection,
|
|
2249
|
+
MenuSeparator,
|
|
1989
2250
|
MenuTrigger,
|
|
1990
2251
|
MultiComboBox,
|
|
1991
2252
|
NumberField,
|
|
1992
2253
|
ObjectHeader,
|
|
1993
2254
|
PageHeader,
|
|
1994
2255
|
Pagination,
|
|
2256
|
+
PireIntlProvider,
|
|
1995
2257
|
Popover5 as Popover,
|
|
1996
2258
|
ProgressBar,
|
|
1997
2259
|
Radio,
|
|
1998
2260
|
RadioGroup,
|
|
2261
|
+
RouterProvider,
|
|
1999
2262
|
SectionHeader,
|
|
2000
2263
|
SegmentedControl,
|
|
2001
2264
|
Select,
|
|
@@ -2006,9 +2269,12 @@ export {
|
|
|
2006
2269
|
SidePanel,
|
|
2007
2270
|
Skeleton,
|
|
2008
2271
|
SkeletonTableRow,
|
|
2272
|
+
Strong,
|
|
2273
|
+
SubmenuTrigger,
|
|
2009
2274
|
Switch,
|
|
2010
2275
|
Tabs,
|
|
2011
2276
|
Tag,
|
|
2277
|
+
Text,
|
|
2012
2278
|
TextArea,
|
|
2013
2279
|
Timeline,
|
|
2014
2280
|
Toast,
|
|
@@ -2017,6 +2283,9 @@ export {
|
|
|
2017
2283
|
ValueHelpDialog,
|
|
2018
2284
|
ValueHelpField,
|
|
2019
2285
|
configureIcons,
|
|
2286
|
+
enMessages,
|
|
2287
|
+
esMessages,
|
|
2288
|
+
usePireMessages,
|
|
2020
2289
|
useToast
|
|
2021
2290
|
};
|
|
2022
2291
|
//# sourceMappingURL=index.js.map
|