@mlw-packages/react-components 1.7.4 → 1.7.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -15
- package/dist/index.css +226 -151
- package/dist/index.d.mts +52 -12
- package/dist/index.d.ts +52 -12
- package/dist/index.js +775 -526
- package/dist/index.mjs +735 -475
- package/package.json +3 -1
package/dist/index.js
CHANGED
|
@@ -32,9 +32,9 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
|
|
|
32
32
|
));
|
|
33
33
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
34
34
|
|
|
35
|
-
// node_modules/picocolors/picocolors.browser.js
|
|
35
|
+
// node_modules/.pnpm/picocolors@1.1.1/node_modules/picocolors/picocolors.browser.js
|
|
36
36
|
var require_picocolors_browser = __commonJS({
|
|
37
|
-
"node_modules/picocolors/picocolors.browser.js"(exports, module2) {
|
|
37
|
+
"node_modules/.pnpm/picocolors@1.1.1/node_modules/picocolors/picocolors.browser.js"(exports, module2) {
|
|
38
38
|
"use strict";
|
|
39
39
|
var x = String;
|
|
40
40
|
var create = function() {
|
|
@@ -45,9 +45,9 @@ var require_picocolors_browser = __commonJS({
|
|
|
45
45
|
}
|
|
46
46
|
});
|
|
47
47
|
|
|
48
|
-
// node_modules/tailwindcss/lib/util/log.js
|
|
48
|
+
// node_modules/.pnpm/tailwindcss@3.4.18_yaml@2.8.1/node_modules/tailwindcss/lib/util/log.js
|
|
49
49
|
var require_log = __commonJS({
|
|
50
|
-
"node_modules/tailwindcss/lib/util/log.js"(exports) {
|
|
50
|
+
"node_modules/.pnpm/tailwindcss@3.4.18_yaml@2.8.1/node_modules/tailwindcss/lib/util/log.js"(exports) {
|
|
51
51
|
"use strict";
|
|
52
52
|
Object.defineProperty(exports, "__esModule", {
|
|
53
53
|
value: true
|
|
@@ -112,9 +112,9 @@ var require_log = __commonJS({
|
|
|
112
112
|
}
|
|
113
113
|
});
|
|
114
114
|
|
|
115
|
-
// node_modules/tailwindcss/lib/public/colors.js
|
|
115
|
+
// node_modules/.pnpm/tailwindcss@3.4.18_yaml@2.8.1/node_modules/tailwindcss/lib/public/colors.js
|
|
116
116
|
var require_colors = __commonJS({
|
|
117
|
-
"node_modules/tailwindcss/lib/public/colors.js"(exports) {
|
|
117
|
+
"node_modules/.pnpm/tailwindcss@3.4.18_yaml@2.8.1/node_modules/tailwindcss/lib/public/colors.js"(exports) {
|
|
118
118
|
"use strict";
|
|
119
119
|
Object.defineProperty(exports, "__esModule", {
|
|
120
120
|
value: true
|
|
@@ -473,9 +473,9 @@ var require_colors = __commonJS({
|
|
|
473
473
|
}
|
|
474
474
|
});
|
|
475
475
|
|
|
476
|
-
// node_modules/tailwindcss/colors.js
|
|
476
|
+
// node_modules/.pnpm/tailwindcss@3.4.18_yaml@2.8.1/node_modules/tailwindcss/colors.js
|
|
477
477
|
var require_colors2 = __commonJS({
|
|
478
|
-
"node_modules/tailwindcss/colors.js"(exports, module2) {
|
|
478
|
+
"node_modules/.pnpm/tailwindcss@3.4.18_yaml@2.8.1/node_modules/tailwindcss/colors.js"(exports, module2) {
|
|
479
479
|
"use strict";
|
|
480
480
|
var colors2 = require_colors();
|
|
481
481
|
module2.exports = (colors2.__esModule ? colors2 : { default: colors2 }).default;
|
|
@@ -530,6 +530,7 @@ __export(index_exports, {
|
|
|
530
530
|
CheckboxBase: () => CheckboxBase,
|
|
531
531
|
CloseAllButton: () => CloseAllButton_default,
|
|
532
532
|
CloseButton: () => CloseButton,
|
|
533
|
+
CodeBlock: () => CodeBlock,
|
|
533
534
|
CollapsibleBase: () => CollapsibleBase,
|
|
534
535
|
CollapsibleContentBase: () => CollapsibleContentBase,
|
|
535
536
|
CollapsibleTriggerBase: () => CollapsibleTriggerBase,
|
|
@@ -705,6 +706,7 @@ __export(index_exports, {
|
|
|
705
706
|
SidebarTriggerBase: () => SidebarTriggerBase,
|
|
706
707
|
SkeletonBase: () => SkeletonBase,
|
|
707
708
|
SlideBase: () => SlideBase,
|
|
709
|
+
StatusIndicator: () => StatusIndicator,
|
|
708
710
|
SwitchBase: () => SwitchBase,
|
|
709
711
|
TableBase: () => TableBase,
|
|
710
712
|
TableBodyBase: () => TableBodyBase,
|
|
@@ -775,7 +777,7 @@ __export(index_exports, {
|
|
|
775
777
|
module.exports = __toCommonJS(index_exports);
|
|
776
778
|
|
|
777
779
|
// src/components/ui/FilterBase.tsx
|
|
778
|
-
var
|
|
780
|
+
var import_react9 = require("react");
|
|
779
781
|
|
|
780
782
|
// src/components/ui/form/ButtonBase.tsx
|
|
781
783
|
var React = __toESM(require("react"));
|
|
@@ -790,6 +792,7 @@ function cn(...inputs) {
|
|
|
790
792
|
}
|
|
791
793
|
|
|
792
794
|
// src/components/ui/form/ButtonBase.tsx
|
|
795
|
+
var import_react = require("@phosphor-icons/react");
|
|
793
796
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
794
797
|
var buttonVariantsBase = (0, import_class_variance_authority.cva)(
|
|
795
798
|
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive active:scale-95",
|
|
@@ -825,16 +828,38 @@ var ButtonBase = React.forwardRef(
|
|
|
825
828
|
size,
|
|
826
829
|
asChild = false,
|
|
827
830
|
testid = `button-${variant ?? "default"}`,
|
|
831
|
+
isLoading = false,
|
|
832
|
+
children,
|
|
828
833
|
...props
|
|
829
834
|
}, ref) => {
|
|
830
835
|
const Comp = asChild ? import_react_slot.Slot : "button";
|
|
831
|
-
|
|
836
|
+
const mergedDisabled = Boolean(props.disabled) || isLoading;
|
|
837
|
+
const isActivelyLoading = isLoading && !props.disabled;
|
|
838
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
832
839
|
Comp,
|
|
833
840
|
{
|
|
834
|
-
className: cn(
|
|
841
|
+
className: cn(
|
|
842
|
+
buttonVariantsBase({ variant, size, className }),
|
|
843
|
+
"relative"
|
|
844
|
+
),
|
|
835
845
|
ref,
|
|
836
846
|
"data-testid": testid ?? `button-${variant ?? "default"}`,
|
|
837
|
-
|
|
847
|
+
"aria-busy": isActivelyLoading || void 0,
|
|
848
|
+
disabled: mergedDisabled,
|
|
849
|
+
...props,
|
|
850
|
+
children: [
|
|
851
|
+
children,
|
|
852
|
+
isActivelyLoading && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "absolute inset-0 flex items-center justify-center pointer-events-none rounded-md", children: [
|
|
853
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "absolute inset-0 rounded-md backdrop-blur overflow-hidden" }),
|
|
854
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
855
|
+
import_react.CircleNotchIcon,
|
|
856
|
+
{
|
|
857
|
+
weight: "bold",
|
|
858
|
+
className: "relative animate-spin h-4 w-4 text-current"
|
|
859
|
+
}
|
|
860
|
+
)
|
|
861
|
+
] })
|
|
862
|
+
]
|
|
838
863
|
}
|
|
839
864
|
);
|
|
840
865
|
}
|
|
@@ -876,7 +901,7 @@ ButtonGroupBase.displayName = "ButtonGroup";
|
|
|
876
901
|
// src/components/ui/feedback/DialogBase.tsx
|
|
877
902
|
var React2 = __toESM(require("react"));
|
|
878
903
|
var DialogPrimitive = __toESM(require("@radix-ui/react-dialog"));
|
|
879
|
-
var
|
|
904
|
+
var import_react2 = require("@phosphor-icons/react");
|
|
880
905
|
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
881
906
|
var DialogBase = DialogPrimitive.Root;
|
|
882
907
|
var DialogTriggerBase = DialogPrimitive.Trigger;
|
|
@@ -911,7 +936,7 @@ var DialogContentBase = React2.forwardRef(
|
|
|
911
936
|
children: [
|
|
912
937
|
children,
|
|
913
938
|
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(DialogPrimitive.Close, { className: "absolute right-3 top-3 sm:right-4 sm:top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground z-10 touch-manipulation", children: [
|
|
914
|
-
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
939
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react2.XIcon, { className: "h-5 w-5 sm:h-4 sm:w-4" }),
|
|
915
940
|
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "sr-only", children: "Close" })
|
|
916
941
|
] })
|
|
917
942
|
]
|
|
@@ -1059,12 +1084,12 @@ var InputBase = React4.forwardRef(
|
|
|
1059
1084
|
InputBase.displayName = "Input";
|
|
1060
1085
|
|
|
1061
1086
|
// src/components/selects/Combobox.tsx
|
|
1062
|
-
var
|
|
1087
|
+
var import_react6 = require("react");
|
|
1063
1088
|
|
|
1064
1089
|
// src/components/ui/navigation/CommandBase.tsx
|
|
1065
1090
|
var React5 = __toESM(require("react"));
|
|
1066
1091
|
var import_cmdk = require("cmdk");
|
|
1067
|
-
var
|
|
1092
|
+
var import_react3 = require("@phosphor-icons/react");
|
|
1068
1093
|
var import_framer_motion = require("framer-motion");
|
|
1069
1094
|
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
1070
1095
|
var CommandBase = React5.forwardRef(({ className, testid: dataTestId = "command-base", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
@@ -1101,7 +1126,7 @@ var CommandDialogBase = ({ children, open, ...props }) => {
|
|
|
1101
1126
|
) }) }) });
|
|
1102
1127
|
};
|
|
1103
1128
|
var CommandInputBase = React5.forwardRef(({ className, testid: dataTestId = "command-input", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
|
|
1104
|
-
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
1129
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react3.MagnifyingGlassIcon, { className: "mr-2 h-4 w-4 shrink-0 text-primary" }),
|
|
1105
1130
|
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
1106
1131
|
import_cmdk.Command.Input,
|
|
1107
1132
|
{
|
|
@@ -1222,8 +1247,8 @@ PopoverContentBase.displayName = PopoverPrimitive.Content.displayName;
|
|
|
1222
1247
|
|
|
1223
1248
|
// src/components/selects/ComboboxBase.tsx
|
|
1224
1249
|
var import_framer_motion2 = require("framer-motion");
|
|
1225
|
-
var
|
|
1226
|
-
var
|
|
1250
|
+
var import_react4 = require("react");
|
|
1251
|
+
var import_react5 = require("@phosphor-icons/react");
|
|
1227
1252
|
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
1228
1253
|
function ComboboxBase({
|
|
1229
1254
|
items,
|
|
@@ -1236,7 +1261,7 @@ function ComboboxBase({
|
|
|
1236
1261
|
error,
|
|
1237
1262
|
testIds = {}
|
|
1238
1263
|
}) {
|
|
1239
|
-
const [open, setOpen] = (0,
|
|
1264
|
+
const [open, setOpen] = (0, import_react4.useState)(false);
|
|
1240
1265
|
return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
|
|
1241
1266
|
"div",
|
|
1242
1267
|
{
|
|
@@ -1270,7 +1295,7 @@ function ComboboxBase({
|
|
|
1270
1295
|
animate: { rotate: open ? 180 : 0 },
|
|
1271
1296
|
transition: { duration: 0.3 },
|
|
1272
1297
|
className: "flex",
|
|
1273
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
1298
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react5.CaretDownIcon, { className: " flex-shrink-0" })
|
|
1274
1299
|
}
|
|
1275
1300
|
)
|
|
1276
1301
|
]
|
|
@@ -1325,7 +1350,7 @@ function ComboboxBase({
|
|
|
1325
1350
|
},
|
|
1326
1351
|
className: "ml-auto ",
|
|
1327
1352
|
children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
1328
|
-
|
|
1353
|
+
import_react5.CheckIcon,
|
|
1329
1354
|
{
|
|
1330
1355
|
className: cn(
|
|
1331
1356
|
"ml-auto",
|
|
@@ -1369,7 +1394,7 @@ function Combobox({
|
|
|
1369
1394
|
error
|
|
1370
1395
|
}) {
|
|
1371
1396
|
const selectedItem = items.find((item) => item.value === selected);
|
|
1372
|
-
const renderSelected = (0,
|
|
1397
|
+
const renderSelected = (0, import_react6.useMemo)(() => {
|
|
1373
1398
|
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
1374
1399
|
"span",
|
|
1375
1400
|
{
|
|
@@ -1379,11 +1404,11 @@ function Combobox({
|
|
|
1379
1404
|
}
|
|
1380
1405
|
);
|
|
1381
1406
|
}, [placeholder, selectedItem, testIds?.selected]);
|
|
1382
|
-
const checkIsSelected = (0,
|
|
1407
|
+
const checkIsSelected = (0, import_react6.useCallback)(
|
|
1383
1408
|
(value) => selected == null ? false : selected == value,
|
|
1384
1409
|
[selected]
|
|
1385
1410
|
);
|
|
1386
|
-
const handleSelection = (0,
|
|
1411
|
+
const handleSelection = (0, import_react6.useCallback)(
|
|
1387
1412
|
(value) => {
|
|
1388
1413
|
onChange(value === selected ? null : value);
|
|
1389
1414
|
},
|
|
@@ -1407,8 +1432,8 @@ function Combobox({
|
|
|
1407
1432
|
}
|
|
1408
1433
|
|
|
1409
1434
|
// src/components/selects/MultiCombobox.tsx
|
|
1410
|
-
var
|
|
1411
|
-
var
|
|
1435
|
+
var import_react7 = require("react");
|
|
1436
|
+
var import_react8 = require("@phosphor-icons/react");
|
|
1412
1437
|
var import_framer_motion3 = require("framer-motion");
|
|
1413
1438
|
var import_jsx_runtime10 = require("react/jsx-runtime");
|
|
1414
1439
|
function MultiCombobox({
|
|
@@ -1426,11 +1451,11 @@ function MultiCombobox({
|
|
|
1426
1451
|
showClearAll = false
|
|
1427
1452
|
}) {
|
|
1428
1453
|
const selectedItems = items.filter((item) => selected.includes(item.value));
|
|
1429
|
-
const checkIsSelected = (0,
|
|
1454
|
+
const checkIsSelected = (0, import_react7.useCallback)(
|
|
1430
1455
|
(value) => selected.includes(value),
|
|
1431
1456
|
[selected]
|
|
1432
1457
|
);
|
|
1433
|
-
const handleSelection = (0,
|
|
1458
|
+
const handleSelection = (0, import_react7.useCallback)(
|
|
1434
1459
|
(value) => {
|
|
1435
1460
|
const isSelected = selected.includes(value);
|
|
1436
1461
|
if (isSelected) {
|
|
@@ -1452,10 +1477,10 @@ function MultiCombobox({
|
|
|
1452
1477
|
onChange([]);
|
|
1453
1478
|
},
|
|
1454
1479
|
className: "text-xs hover:bg-red-50 hover:text-red-500 transition-colors rounded-md mr-2",
|
|
1455
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
1480
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react8.XIcon, {})
|
|
1456
1481
|
}
|
|
1457
1482
|
) }) : null;
|
|
1458
|
-
const renderSelected = (0,
|
|
1483
|
+
const renderSelected = (0, import_react7.useMemo)(() => {
|
|
1459
1484
|
if (selectedItems.length === 0) {
|
|
1460
1485
|
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
1461
1486
|
"span",
|
|
@@ -1499,7 +1524,7 @@ function MultiCombobox({
|
|
|
1499
1524
|
whileHover: { scale: 1.1 },
|
|
1500
1525
|
whileTap: { scale: 0.95 },
|
|
1501
1526
|
className: "cursor-pointer text-xs flex items-center justify-center hover:text-red-500 transition-colors flex-shrink-0 rounded hover:bg-red-50 ",
|
|
1502
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
1527
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react8.XIcon, { size: 14 })
|
|
1503
1528
|
}
|
|
1504
1529
|
)
|
|
1505
1530
|
]
|
|
@@ -1563,14 +1588,14 @@ var TooltipContentBase = React7.forwardRef(({ className, sideOffset = 4, ...prop
|
|
|
1563
1588
|
TooltipContentBase.displayName = TooltipPrimitive.Content.displayName;
|
|
1564
1589
|
|
|
1565
1590
|
// src/components/ui/FilterBase.tsx
|
|
1566
|
-
var
|
|
1591
|
+
var import_react10 = require("@phosphor-icons/react");
|
|
1567
1592
|
var import_colors = __toESM(require_colors2());
|
|
1568
1593
|
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
1569
1594
|
|
|
1570
1595
|
// src/components/ui/SelectBase.tsx
|
|
1571
1596
|
var React8 = __toESM(require("react"));
|
|
1572
1597
|
var SelectPrimitive = __toESM(require("@radix-ui/react-select"));
|
|
1573
|
-
var
|
|
1598
|
+
var import_react11 = require("@phosphor-icons/react");
|
|
1574
1599
|
var import_framer_motion4 = require("framer-motion");
|
|
1575
1600
|
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
1576
1601
|
var SelectBase = SelectPrimitive.Root;
|
|
@@ -1595,7 +1620,7 @@ var SelectTriggerBase = React8.forwardRef(({ className, children, open, error, .
|
|
|
1595
1620
|
animate: { rotate: open ? 180 : 0 },
|
|
1596
1621
|
transition: { duration: 0.3 },
|
|
1597
1622
|
className: "flex items-center",
|
|
1598
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
1623
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react11.CaretDownIcon, { className: "h-4 w-4 opacity-50" })
|
|
1599
1624
|
}
|
|
1600
1625
|
)
|
|
1601
1626
|
]
|
|
@@ -1613,7 +1638,7 @@ var SelectScrollUpButtonBase = React8.forwardRef(({ className, ...props }, ref)
|
|
|
1613
1638
|
className
|
|
1614
1639
|
),
|
|
1615
1640
|
...props,
|
|
1616
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
1641
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react11.CaretUpIcon, { className: "h-4 w-4" })
|
|
1617
1642
|
}
|
|
1618
1643
|
));
|
|
1619
1644
|
SelectScrollUpButtonBase.displayName = SelectPrimitive.ScrollUpButton.displayName;
|
|
@@ -1626,7 +1651,7 @@ var SelectScrollDownButtonBase = React8.forwardRef(({ className, ...props }, ref
|
|
|
1626
1651
|
className
|
|
1627
1652
|
),
|
|
1628
1653
|
...props,
|
|
1629
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
1654
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react11.CaretDownIcon, { className: "h-4 w-4" })
|
|
1630
1655
|
}
|
|
1631
1656
|
));
|
|
1632
1657
|
SelectScrollDownButtonBase.displayName = SelectPrimitive.ScrollDownButton.displayName;
|
|
@@ -1708,7 +1733,7 @@ var SelectItemBase = React8.forwardRef(({ className, children, ...props }, ref)
|
|
|
1708
1733
|
initial: { scale: 0 },
|
|
1709
1734
|
animate: { scale: 1 },
|
|
1710
1735
|
transition: { type: "spring", stiffness: 500, damping: 30 },
|
|
1711
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
1736
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react11.CheckIcon, { className: "h-4 w-4" })
|
|
1712
1737
|
}
|
|
1713
1738
|
) }) }),
|
|
1714
1739
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SelectPrimitive.ItemText, { children })
|
|
@@ -1729,12 +1754,12 @@ var SelectSeparatorBase = React8.forwardRef(({ className, ...props }, ref) => /*
|
|
|
1729
1754
|
SelectSeparatorBase.displayName = SelectPrimitive.Separator.displayName;
|
|
1730
1755
|
|
|
1731
1756
|
// src/components/mode-toggle.tsx
|
|
1732
|
-
var
|
|
1757
|
+
var import_react14 = require("@phosphor-icons/react");
|
|
1733
1758
|
|
|
1734
1759
|
// src/components/ui/navigation/DropDownMenuBase.tsx
|
|
1735
1760
|
var React9 = __toESM(require("react"));
|
|
1736
1761
|
var DropdownMenuPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"));
|
|
1737
|
-
var
|
|
1762
|
+
var import_react12 = require("@phosphor-icons/react");
|
|
1738
1763
|
var import_framer_motion5 = require("framer-motion");
|
|
1739
1764
|
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
1740
1765
|
var DropDownMenuBase = DropdownMenuPrimitive.Root;
|
|
@@ -1755,7 +1780,7 @@ var DropDownMenuSubTriggerBase = React9.forwardRef(({ className, inset, children
|
|
|
1755
1780
|
...props,
|
|
1756
1781
|
children: [
|
|
1757
1782
|
children,
|
|
1758
|
-
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
1783
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react12.CaretRightIcon, { className: "ml-auto" })
|
|
1759
1784
|
]
|
|
1760
1785
|
}
|
|
1761
1786
|
));
|
|
@@ -1835,7 +1860,7 @@ var DropDownMenuCheckboxItemBase = React9.forwardRef(({ className, children, che
|
|
|
1835
1860
|
checked,
|
|
1836
1861
|
...props,
|
|
1837
1862
|
children: [
|
|
1838
|
-
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
1863
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react12.CheckIcon, { className: "h-4 w-4" }) }) }),
|
|
1839
1864
|
children
|
|
1840
1865
|
]
|
|
1841
1866
|
}
|
|
@@ -1851,7 +1876,7 @@ var DropDownMenuRadioItemBase = React9.forwardRef(({ className, children, ...pro
|
|
|
1851
1876
|
),
|
|
1852
1877
|
...props,
|
|
1853
1878
|
children: [
|
|
1854
|
-
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
1879
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react12.CircleIcon, { className: "h-2 w-2 fill-current" }) }) }),
|
|
1855
1880
|
children
|
|
1856
1881
|
]
|
|
1857
1882
|
}
|
|
@@ -1894,21 +1919,21 @@ var DropDownMenuShortcutBase = ({
|
|
|
1894
1919
|
DropDownMenuShortcutBase.displayName = "DropDownMenuShortcutBase";
|
|
1895
1920
|
|
|
1896
1921
|
// src/components/theme-provider.tsx
|
|
1897
|
-
var
|
|
1922
|
+
var import_react13 = require("react");
|
|
1898
1923
|
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
1899
1924
|
var initialState = {
|
|
1900
1925
|
theme: "system",
|
|
1901
1926
|
setTheme: () => null
|
|
1902
1927
|
};
|
|
1903
|
-
var ThemeProviderContext = (0,
|
|
1928
|
+
var ThemeProviderContext = (0, import_react13.createContext)(initialState);
|
|
1904
1929
|
function ThemeProviderBase({
|
|
1905
1930
|
children,
|
|
1906
1931
|
defaultTheme = "system",
|
|
1907
1932
|
storageKey = "app-ui-theme",
|
|
1908
1933
|
...props
|
|
1909
1934
|
}) {
|
|
1910
|
-
const [theme, setThemeState] = (0,
|
|
1911
|
-
(0,
|
|
1935
|
+
const [theme, setThemeState] = (0, import_react13.useState)(defaultTheme);
|
|
1936
|
+
(0, import_react13.useEffect)(() => {
|
|
1912
1937
|
const root = window.document.documentElement;
|
|
1913
1938
|
root.classList.remove(
|
|
1914
1939
|
"light",
|
|
@@ -1934,7 +1959,7 @@ function ThemeProviderBase({
|
|
|
1934
1959
|
document.body.style.color = "";
|
|
1935
1960
|
}
|
|
1936
1961
|
}, [theme]);
|
|
1937
|
-
(0,
|
|
1962
|
+
(0, import_react13.useEffect)(() => {
|
|
1938
1963
|
const stored = localStorage.getItem(storageKey);
|
|
1939
1964
|
if (stored) setThemeState(stored);
|
|
1940
1965
|
}, [storageKey]);
|
|
@@ -1948,7 +1973,7 @@ function ThemeProviderBase({
|
|
|
1948
1973
|
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(ThemeProviderContext.Provider, { ...props, value, children });
|
|
1949
1974
|
}
|
|
1950
1975
|
var useTheme = () => {
|
|
1951
|
-
const context = (0,
|
|
1976
|
+
const context = (0, import_react13.useContext)(ThemeProviderContext);
|
|
1952
1977
|
if (context === void 0)
|
|
1953
1978
|
throw new Error("useTheme must be used within a ThemeProvider");
|
|
1954
1979
|
return context;
|
|
@@ -1982,13 +2007,13 @@ function ModeToggleBase({
|
|
|
1982
2007
|
children: [
|
|
1983
2008
|
/* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
|
|
1984
2009
|
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
1985
|
-
|
|
2010
|
+
import_react14.SunIcon,
|
|
1986
2011
|
{
|
|
1987
2012
|
className: `h-[1.2rem] w-[1.2rem] transition-transform duration-300 ${isDark ? "rotate-90 scale-0" : "rotate-0 scale-100"}`
|
|
1988
2013
|
}
|
|
1989
2014
|
),
|
|
1990
2015
|
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
1991
|
-
|
|
2016
|
+
import_react14.MoonIcon,
|
|
1992
2017
|
{
|
|
1993
2018
|
className: `absolute h-[1.2rem] w-[1.2rem] transition-transform duration-300 ${isDark ? "rotate-0 scale-100" : "rotate-90 scale-0"}`
|
|
1994
2019
|
}
|
|
@@ -2010,7 +2035,7 @@ function ModeToggleBase({
|
|
|
2010
2035
|
className: "flex items-center justify-between hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground",
|
|
2011
2036
|
children: [
|
|
2012
2037
|
themeLabels[theme],
|
|
2013
|
-
currentTheme === theme && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
2038
|
+
currentTheme === theme && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react14.CheckIcon, { className: "h-4 w-4 opacity-100" })
|
|
2014
2039
|
]
|
|
2015
2040
|
},
|
|
2016
2041
|
theme
|
|
@@ -2063,7 +2088,8 @@ function Select({
|
|
|
2063
2088
|
placeholder,
|
|
2064
2089
|
onChange,
|
|
2065
2090
|
error,
|
|
2066
|
-
testIds = {}
|
|
2091
|
+
testIds = {},
|
|
2092
|
+
disabled
|
|
2067
2093
|
}) {
|
|
2068
2094
|
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { "data-testid": testIds.root ?? "select-root", children: [
|
|
2069
2095
|
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
|
|
@@ -2080,6 +2106,7 @@ function Select({
|
|
|
2080
2106
|
error && "border-red-500"
|
|
2081
2107
|
),
|
|
2082
2108
|
"data-testid": testIds.trigger ?? "select-trigger",
|
|
2109
|
+
disabled,
|
|
2083
2110
|
children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
2084
2111
|
SelectValueBase,
|
|
2085
2112
|
{
|
|
@@ -2130,7 +2157,7 @@ function Select({
|
|
|
2130
2157
|
}
|
|
2131
2158
|
|
|
2132
2159
|
// src/components/charts/Chart.tsx
|
|
2133
|
-
var
|
|
2160
|
+
var import_react19 = require("react");
|
|
2134
2161
|
var import_recharts = require("recharts");
|
|
2135
2162
|
|
|
2136
2163
|
// src/components/charts/utils/helpers.ts
|
|
@@ -2277,7 +2304,7 @@ var resolveChartMargins = (margins, chartMargins, showLabels) => {
|
|
|
2277
2304
|
var import_sonner = require("sonner");
|
|
2278
2305
|
|
|
2279
2306
|
// src/components/charts/components/controls/PeriodsDropdown.tsx
|
|
2280
|
-
var
|
|
2307
|
+
var import_react15 = require("react");
|
|
2281
2308
|
var import_framer_motion6 = require("framer-motion");
|
|
2282
2309
|
var import_ssr = require("@phosphor-icons/react/dist/ssr");
|
|
2283
2310
|
var import_ssr2 = require("@phosphor-icons/react/dist/ssr");
|
|
@@ -2300,11 +2327,11 @@ function PeriodsDropdown({
|
|
|
2300
2327
|
activePeriods
|
|
2301
2328
|
}) {
|
|
2302
2329
|
const periods = processedData.map((d) => String(d.name));
|
|
2303
|
-
const [open, setOpen] = (0,
|
|
2304
|
-
const wrapperRef = (0,
|
|
2305
|
-
const firstItemRef = (0,
|
|
2306
|
-
const listRef = (0,
|
|
2307
|
-
(0,
|
|
2330
|
+
const [open, setOpen] = (0, import_react15.useState)(false);
|
|
2331
|
+
const wrapperRef = (0, import_react15.useRef)(null);
|
|
2332
|
+
const firstItemRef = (0, import_react15.useRef)(null);
|
|
2333
|
+
const listRef = (0, import_react15.useRef)(null);
|
|
2334
|
+
(0, import_react15.useEffect)(() => {
|
|
2308
2335
|
const handleClickOutside = (e) => {
|
|
2309
2336
|
if (!wrapperRef.current) return;
|
|
2310
2337
|
if (!wrapperRef.current.contains(e.target)) setOpen(false);
|
|
@@ -2319,7 +2346,7 @@ function PeriodsDropdown({
|
|
|
2319
2346
|
document.removeEventListener("keydown", handleEscape);
|
|
2320
2347
|
};
|
|
2321
2348
|
}, []);
|
|
2322
|
-
(0,
|
|
2349
|
+
(0, import_react15.useEffect)(() => {
|
|
2323
2350
|
if (open && firstItemRef.current) {
|
|
2324
2351
|
firstItemRef.current.focus();
|
|
2325
2352
|
}
|
|
@@ -2412,7 +2439,7 @@ var PeriodsDropdown_default = PeriodsDropdown;
|
|
|
2412
2439
|
|
|
2413
2440
|
// src/components/charts/components/controls/ShowOnly.tsx
|
|
2414
2441
|
var import_framer_motion7 = require("framer-motion");
|
|
2415
|
-
var
|
|
2442
|
+
var import_react16 = require("@phosphor-icons/react");
|
|
2416
2443
|
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
2417
2444
|
var ShowOnly = ({
|
|
2418
2445
|
showOnlyHighlighted,
|
|
@@ -2441,10 +2468,10 @@ var ShowOnly = ({
|
|
|
2441
2468
|
!hasHighlights ? "opacity-60 cursor-not-allowed pointer-events-none" : showOnlyHighlighted ? "bg-primary/10 text-primary shadow-sm border border-primary/20" : "bg-transparent text-muted-foreground border border-transparent hover:bg-muted/10 hover:text-foreground"
|
|
2442
2469
|
),
|
|
2443
2470
|
children: showOnlyHighlighted ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
|
|
2444
|
-
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2471
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react16.EyeSlash, { size: 16, weight: "regular" }),
|
|
2445
2472
|
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "sr-only", children: "Exibir todos" })
|
|
2446
2473
|
] }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
|
|
2447
|
-
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2474
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react16.Eye, { size: 16, weight: "bold" }),
|
|
2448
2475
|
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "sr-only", children: "Mostrar somente destacados" })
|
|
2449
2476
|
] })
|
|
2450
2477
|
}
|
|
@@ -2649,9 +2676,9 @@ var CloseAllButton = ({
|
|
|
2649
2676
|
var CloseAllButton_default = CloseAllButton;
|
|
2650
2677
|
|
|
2651
2678
|
// src/components/charts/components/tooltips/DraggableTooltip.tsx
|
|
2652
|
-
var
|
|
2679
|
+
var import_react17 = __toESM(require("react"));
|
|
2653
2680
|
var import_framer_motion9 = require("framer-motion");
|
|
2654
|
-
var
|
|
2681
|
+
var import_react18 = require("@phosphor-icons/react");
|
|
2655
2682
|
var import_ssr5 = require("@phosphor-icons/react/dist/ssr");
|
|
2656
2683
|
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
2657
2684
|
var ALIGNMENT_THRESHOLD = 25;
|
|
@@ -2730,12 +2757,12 @@ var DraggableTooltipComponent = ({
|
|
|
2730
2757
|
valueFormatter: valueFormatter2,
|
|
2731
2758
|
categoryFormatter
|
|
2732
2759
|
}) => {
|
|
2733
|
-
const visibleKeys = (0,
|
|
2760
|
+
const visibleKeys = (0, import_react17.useMemo)(
|
|
2734
2761
|
() => showOnlyHighlighted && highlightedSeries && highlightedSeries.size > 0 ? dataKeys.filter((k) => highlightedSeries.has(k)) : dataKeys,
|
|
2735
2762
|
[showOnlyHighlighted, highlightedSeries, dataKeys]
|
|
2736
2763
|
);
|
|
2737
|
-
const TotalDisplay =
|
|
2738
|
-
const total = (0,
|
|
2764
|
+
const TotalDisplay = import_react17.default.memo(({ data: data2, visibleKeys: visibleKeys2, valueFormatter: localformatter }) => {
|
|
2765
|
+
const total = (0, import_react17.useMemo)(() => {
|
|
2739
2766
|
const numeric = visibleKeys2.map((k) => data2[k]).filter((v) => typeof v === "number");
|
|
2740
2767
|
return numeric.reduce((s, v) => s + (v || 0), 0);
|
|
2741
2768
|
}, [data2, visibleKeys2]);
|
|
@@ -2757,14 +2784,14 @@ var DraggableTooltipComponent = ({
|
|
|
2757
2784
|
)
|
|
2758
2785
|
] });
|
|
2759
2786
|
});
|
|
2760
|
-
const [localPos, setLocalPos] = (0,
|
|
2761
|
-
const [dragging, setDragging] = (0,
|
|
2762
|
-
const offsetRef = (0,
|
|
2763
|
-
const lastMouse = (0,
|
|
2764
|
-
const [alignmentGuides, setAlignmentGuides] = (0,
|
|
2765
|
-
const [globalTooltipCountLocal, setGlobalTooltipCountLocal] = (0,
|
|
2766
|
-
(0,
|
|
2767
|
-
const getAllTooltips = (0,
|
|
2787
|
+
const [localPos, setLocalPos] = (0, import_react17.useState)(position);
|
|
2788
|
+
const [dragging, setDragging] = (0, import_react17.useState)(false);
|
|
2789
|
+
const offsetRef = (0, import_react17.useRef)({ x: 0, y: 0 });
|
|
2790
|
+
const lastMouse = (0, import_react17.useRef)({ x: 0, y: 0 });
|
|
2791
|
+
const [alignmentGuides, setAlignmentGuides] = (0, import_react17.useState)([]);
|
|
2792
|
+
const [globalTooltipCountLocal, setGlobalTooltipCountLocal] = (0, import_react17.useState)(0);
|
|
2793
|
+
(0, import_react17.useEffect)(() => setLocalPos(position), [position]);
|
|
2794
|
+
const getAllTooltips = (0, import_react17.useCallback)(() => {
|
|
2768
2795
|
const response = [];
|
|
2769
2796
|
const ev = new CustomEvent("requestGlobalTooltips", {
|
|
2770
2797
|
detail: { requesterId: id, response }
|
|
@@ -2772,7 +2799,7 @@ var DraggableTooltipComponent = ({
|
|
|
2772
2799
|
window.dispatchEvent(ev);
|
|
2773
2800
|
return response;
|
|
2774
2801
|
}, [id]);
|
|
2775
|
-
const updateAlignmentGuides = (0,
|
|
2802
|
+
const updateAlignmentGuides = (0, import_react17.useCallback)(
|
|
2776
2803
|
(currentPosition) => {
|
|
2777
2804
|
const allTooltips = getAllTooltips();
|
|
2778
2805
|
const otherTooltips = allTooltips.filter((t) => t.id !== id);
|
|
@@ -2821,7 +2848,7 @@ var DraggableTooltipComponent = ({
|
|
|
2821
2848
|
},
|
|
2822
2849
|
[getAllTooltips, id]
|
|
2823
2850
|
);
|
|
2824
|
-
const snapToGuides = (0,
|
|
2851
|
+
const snapToGuides = (0, import_react17.useCallback)(
|
|
2825
2852
|
(position2) => {
|
|
2826
2853
|
const snappedPosition = { ...position2 };
|
|
2827
2854
|
let hasSnapped = false;
|
|
@@ -2868,7 +2895,7 @@ var DraggableTooltipComponent = ({
|
|
|
2868
2895
|
},
|
|
2869
2896
|
[alignmentGuides]
|
|
2870
2897
|
);
|
|
2871
|
-
(0,
|
|
2898
|
+
(0, import_react17.useEffect)(() => {
|
|
2872
2899
|
let rafId = null;
|
|
2873
2900
|
const handleMouseMove = (e) => {
|
|
2874
2901
|
if (!dragging) return;
|
|
@@ -2910,7 +2937,7 @@ var DraggableTooltipComponent = ({
|
|
|
2910
2937
|
document.body.style.userSelect = "";
|
|
2911
2938
|
};
|
|
2912
2939
|
}, [dragging, snapToGuides, updateAlignmentGuides, id, onPositionChange]);
|
|
2913
|
-
(0,
|
|
2940
|
+
(0, import_react17.useEffect)(() => {
|
|
2914
2941
|
const handleCloseAll = () => onClose(id);
|
|
2915
2942
|
const handleRequestTooltipCount = () => {
|
|
2916
2943
|
window.dispatchEvent(
|
|
@@ -2941,7 +2968,7 @@ var DraggableTooltipComponent = ({
|
|
|
2941
2968
|
});
|
|
2942
2969
|
};
|
|
2943
2970
|
}, [id, localPos, onClose]);
|
|
2944
|
-
(0,
|
|
2971
|
+
(0, import_react17.useEffect)(() => {
|
|
2945
2972
|
if (dragging) return;
|
|
2946
2973
|
let total = 0;
|
|
2947
2974
|
const timeoutId = setTimeout(() => {
|
|
@@ -2959,7 +2986,7 @@ var DraggableTooltipComponent = ({
|
|
|
2959
2986
|
}, 0);
|
|
2960
2987
|
return () => clearTimeout(timeoutId);
|
|
2961
2988
|
}, [localPos, dragging]);
|
|
2962
|
-
(0,
|
|
2989
|
+
(0, import_react17.useEffect)(() => {
|
|
2963
2990
|
const recount = () => {
|
|
2964
2991
|
if (dragging) return;
|
|
2965
2992
|
let total = 0;
|
|
@@ -2977,7 +3004,7 @@ var DraggableTooltipComponent = ({
|
|
|
2977
3004
|
window.addEventListener("recountTooltips", recount);
|
|
2978
3005
|
return () => window.removeEventListener("recountTooltips", recount);
|
|
2979
3006
|
}, [dragging]);
|
|
2980
|
-
const handleMouseDownLocal = (0,
|
|
3007
|
+
const handleMouseDownLocal = (0, import_react17.useCallback)(
|
|
2981
3008
|
(e) => {
|
|
2982
3009
|
e.preventDefault();
|
|
2983
3010
|
e.stopPropagation();
|
|
@@ -2988,7 +3015,7 @@ var DraggableTooltipComponent = ({
|
|
|
2988
3015
|
},
|
|
2989
3016
|
[id, onMouseDown]
|
|
2990
3017
|
);
|
|
2991
|
-
const handleTouchStartLocal = (0,
|
|
3018
|
+
const handleTouchStartLocal = (0, import_react17.useCallback)(
|
|
2992
3019
|
(e) => {
|
|
2993
3020
|
e.stopPropagation();
|
|
2994
3021
|
const touch = e.touches[0];
|
|
@@ -3003,7 +3030,7 @@ var DraggableTooltipComponent = ({
|
|
|
3003
3030
|
},
|
|
3004
3031
|
[id, onMouseDown]
|
|
3005
3032
|
);
|
|
3006
|
-
const handleCloseClick = (0,
|
|
3033
|
+
const handleCloseClick = (0, import_react17.useCallback)(
|
|
3007
3034
|
(e) => {
|
|
3008
3035
|
e.stopPropagation();
|
|
3009
3036
|
onClose(id);
|
|
@@ -3119,7 +3146,7 @@ var DraggableTooltipComponent = ({
|
|
|
3119
3146
|
onTouchStart: handleTouchStartLocal,
|
|
3120
3147
|
style: { touchAction: "none" },
|
|
3121
3148
|
children: [
|
|
3122
|
-
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
3149
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react18.DotsSixVerticalIcon, { size: 16 }),
|
|
3123
3150
|
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex flex-col gap-1", children: title && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex items-center gap-2 pb-0.5", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "font-bold text-foreground text-base", children: title }) }) }),
|
|
3124
3151
|
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
3125
3152
|
"button",
|
|
@@ -3149,7 +3176,7 @@ var DraggableTooltipComponent = ({
|
|
|
3149
3176
|
] }) }),
|
|
3150
3177
|
/* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "p-3 pt-2 space-y-2", children: [
|
|
3151
3178
|
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "text-xs font-medium text-muted-foreground uppercase tracking-wide mb-2", children: dataLabel }),
|
|
3152
|
-
(0,
|
|
3179
|
+
(0, import_react17.useMemo)(
|
|
3153
3180
|
() => visibleKeys.map((key) => {
|
|
3154
3181
|
const value = data[key];
|
|
3155
3182
|
if (value === void 0) return null;
|
|
@@ -3267,7 +3294,7 @@ var DraggableTooltipComponent = ({
|
|
|
3267
3294
|
)
|
|
3268
3295
|
] });
|
|
3269
3296
|
};
|
|
3270
|
-
var DraggableTooltip =
|
|
3297
|
+
var DraggableTooltip = import_react17.default.memo(DraggableTooltipComponent);
|
|
3271
3298
|
DraggableTooltip.displayName = "DraggableTooltip";
|
|
3272
3299
|
var DraggableTooltip_default = DraggableTooltip;
|
|
3273
3300
|
|
|
@@ -3641,7 +3668,7 @@ var Chart = ({
|
|
|
3641
3668
|
formatBR = false,
|
|
3642
3669
|
chartMargin
|
|
3643
3670
|
}) => {
|
|
3644
|
-
const smartConfig = (0,
|
|
3671
|
+
const smartConfig = (0, import_react19.useMemo)(() => {
|
|
3645
3672
|
const resolvedXAxisKey = typeof xAxis === "string" ? xAxis : xAxis && xAxis.dataKey || detectXAxis(data);
|
|
3646
3673
|
const xAxisConfig2 = typeof xAxis === "string" ? {
|
|
3647
3674
|
dataKey: resolvedXAxisKey,
|
|
@@ -3665,12 +3692,12 @@ var Chart = ({
|
|
|
3665
3692
|
return { xAxisConfig: xAxisConfig2, mapperConfig: mapperConfig2 };
|
|
3666
3693
|
}, [data, xAxis, labelMap]);
|
|
3667
3694
|
const { xAxisConfig, mapperConfig } = smartConfig;
|
|
3668
|
-
const [activeTooltips, setActiveTooltips] = (0,
|
|
3669
|
-
const [highlightedSeries, setHighlightedSeries] = (0,
|
|
3695
|
+
const [activeTooltips, setActiveTooltips] = (0, import_react19.useState)([]);
|
|
3696
|
+
const [highlightedSeries, setHighlightedSeries] = (0, import_react19.useState)(
|
|
3670
3697
|
/* @__PURE__ */ new Set()
|
|
3671
3698
|
);
|
|
3672
|
-
const [showOnlyHighlighted, setShowOnlyHighlighted] = (0,
|
|
3673
|
-
(0,
|
|
3699
|
+
const [showOnlyHighlighted, setShowOnlyHighlighted] = (0, import_react19.useState)(false);
|
|
3700
|
+
(0, import_react19.useEffect)(() => {
|
|
3674
3701
|
if (highlightedSeries.size === 0 && showOnlyHighlighted) {
|
|
3675
3702
|
setShowOnlyHighlighted(false);
|
|
3676
3703
|
}
|
|
@@ -3679,9 +3706,9 @@ var Chart = ({
|
|
|
3679
3706
|
...item,
|
|
3680
3707
|
name: String(item[xAxisConfig.dataKey] || "N/A")
|
|
3681
3708
|
}));
|
|
3682
|
-
const wrapperRef = (0,
|
|
3683
|
-
const [measuredWidth, setMeasuredWidth] = (0,
|
|
3684
|
-
(0,
|
|
3709
|
+
const wrapperRef = (0, import_react19.useRef)(null);
|
|
3710
|
+
const [measuredWidth, setMeasuredWidth] = (0, import_react19.useState)(null);
|
|
3711
|
+
(0, import_react19.useLayoutEffect)(() => {
|
|
3685
3712
|
const el = wrapperRef.current;
|
|
3686
3713
|
if (!el) return;
|
|
3687
3714
|
const ro = new ResizeObserver((entries) => {
|
|
@@ -3708,7 +3735,7 @@ var Chart = ({
|
|
|
3708
3735
|
);
|
|
3709
3736
|
}
|
|
3710
3737
|
const allKeys = seriesOrder.map((s) => s.key).filter(Boolean);
|
|
3711
|
-
const generateColors = (0,
|
|
3738
|
+
const generateColors = (0, import_react19.useCallback)(
|
|
3712
3739
|
(dataKeys) => {
|
|
3713
3740
|
const colorMap = {};
|
|
3714
3741
|
const allColors = generateAdditionalColors(colors2, dataKeys.length);
|
|
@@ -3719,25 +3746,25 @@ var Chart = ({
|
|
|
3719
3746
|
},
|
|
3720
3747
|
[colors2, mapperConfig]
|
|
3721
3748
|
);
|
|
3722
|
-
const finalColors = (0,
|
|
3749
|
+
const finalColors = (0, import_react19.useMemo)(
|
|
3723
3750
|
() => generateColors(allKeys),
|
|
3724
3751
|
[generateColors, allKeys]
|
|
3725
3752
|
);
|
|
3726
|
-
const adaptDataForTooltip = (0,
|
|
3753
|
+
const adaptDataForTooltip = (0, import_react19.useCallback)(
|
|
3727
3754
|
(universalData) => ({
|
|
3728
3755
|
...universalData,
|
|
3729
3756
|
name: String(universalData[xAxisConfig.dataKey] || "N/A")
|
|
3730
3757
|
}),
|
|
3731
3758
|
[xAxisConfig.dataKey]
|
|
3732
3759
|
);
|
|
3733
|
-
const activePeriods = (0,
|
|
3760
|
+
const activePeriods = (0, import_react19.useMemo)(
|
|
3734
3761
|
() => activeTooltips.map((t) => adaptDataForTooltip(t.data).name),
|
|
3735
3762
|
[activeTooltips, adaptDataForTooltip]
|
|
3736
3763
|
);
|
|
3737
|
-
(0,
|
|
3764
|
+
(0, import_react19.useEffect)(() => {
|
|
3738
3765
|
window.dispatchEvent(new Event("recountTooltips"));
|
|
3739
3766
|
}, [activeTooltips.length]);
|
|
3740
|
-
const toggleHighlight = (0,
|
|
3767
|
+
const toggleHighlight = (0, import_react19.useCallback)((key) => {
|
|
3741
3768
|
setHighlightedSeries((prev) => {
|
|
3742
3769
|
const next = new Set(prev);
|
|
3743
3770
|
if (next.has(key)) next.delete(key);
|
|
@@ -3745,7 +3772,7 @@ var Chart = ({
|
|
|
3745
3772
|
return next;
|
|
3746
3773
|
});
|
|
3747
3774
|
}, []);
|
|
3748
|
-
const maxDataValue = (0,
|
|
3775
|
+
const maxDataValue = (0, import_react19.useMemo)(() => {
|
|
3749
3776
|
let max = 0;
|
|
3750
3777
|
const numericKeys = allKeys;
|
|
3751
3778
|
for (const row of processedData) {
|
|
@@ -3757,7 +3784,7 @@ var Chart = ({
|
|
|
3757
3784
|
}
|
|
3758
3785
|
return max;
|
|
3759
3786
|
}, [processedData, allKeys]);
|
|
3760
|
-
const minDataValue = (0,
|
|
3787
|
+
const minDataValue = (0, import_react19.useMemo)(() => {
|
|
3761
3788
|
let min = 0;
|
|
3762
3789
|
const numericKeys = allKeys;
|
|
3763
3790
|
for (const row of processedData) {
|
|
@@ -3770,7 +3797,7 @@ var Chart = ({
|
|
|
3770
3797
|
}
|
|
3771
3798
|
return min;
|
|
3772
3799
|
}, [processedData, allKeys]);
|
|
3773
|
-
const niceMax = (0,
|
|
3800
|
+
const niceMax = (0, import_react19.useMemo)(() => {
|
|
3774
3801
|
let padding = 0.08;
|
|
3775
3802
|
if (maxDataValue > 1e6) padding = 0.05;
|
|
3776
3803
|
if (maxDataValue > 1e7) padding = 0.03;
|
|
@@ -3778,7 +3805,7 @@ var Chart = ({
|
|
|
3778
3805
|
const padded = maxDataValue * (1 + padding);
|
|
3779
3806
|
return niceCeil(padded);
|
|
3780
3807
|
}, [maxDataValue]);
|
|
3781
|
-
const computedWidth = (0,
|
|
3808
|
+
const computedWidth = (0, import_react19.useMemo)(() => {
|
|
3782
3809
|
if (typeof width === "number") return width;
|
|
3783
3810
|
const points = Math.max(1, processedData.length);
|
|
3784
3811
|
const barCount = series?.bar?.length ?? 0;
|
|
@@ -3807,7 +3834,7 @@ var Chart = ({
|
|
|
3807
3834
|
series?.area?.length,
|
|
3808
3835
|
niceMax
|
|
3809
3836
|
]);
|
|
3810
|
-
const toggleTooltip = (0,
|
|
3837
|
+
const toggleTooltip = (0, import_react19.useCallback)(
|
|
3811
3838
|
(tooltipId, data2, basePosition) => {
|
|
3812
3839
|
const existingIndex = activeTooltips.findIndex((t) => t.id === tooltipId);
|
|
3813
3840
|
if (existingIndex !== -1) {
|
|
@@ -3836,7 +3863,7 @@ var Chart = ({
|
|
|
3836
3863
|
},
|
|
3837
3864
|
[activeTooltips, maxTooltips]
|
|
3838
3865
|
);
|
|
3839
|
-
const handleChartClick = (0,
|
|
3866
|
+
const handleChartClick = (0, import_react19.useCallback)(
|
|
3840
3867
|
(e) => {
|
|
3841
3868
|
if (!enableDraggableTooltips) return;
|
|
3842
3869
|
const ev = e;
|
|
@@ -3854,7 +3881,7 @@ var Chart = ({
|
|
|
3854
3881
|
},
|
|
3855
3882
|
[enableDraggableTooltips, xAxisConfig.dataKey, toggleTooltip]
|
|
3856
3883
|
);
|
|
3857
|
-
const handleBarClick = (0,
|
|
3884
|
+
const handleBarClick = (0, import_react19.useCallback)(
|
|
3858
3885
|
(data2, index, event) => {
|
|
3859
3886
|
if (!enableDraggableTooltips) return;
|
|
3860
3887
|
event.stopPropagation();
|
|
@@ -3868,7 +3895,7 @@ var Chart = ({
|
|
|
3868
3895
|
},
|
|
3869
3896
|
[enableDraggableTooltips, xAxisConfig.dataKey, toggleTooltip]
|
|
3870
3897
|
);
|
|
3871
|
-
const handleSeriesClick = (0,
|
|
3898
|
+
const handleSeriesClick = (0, import_react19.useCallback)(
|
|
3872
3899
|
(...args) => {
|
|
3873
3900
|
if (args.length >= 3) {
|
|
3874
3901
|
const [data2, index, event] = args;
|
|
@@ -3879,7 +3906,7 @@ var Chart = ({
|
|
|
3879
3906
|
},
|
|
3880
3907
|
[handleBarClick, handleChartClick]
|
|
3881
3908
|
);
|
|
3882
|
-
const onTooltipPositionChange = (0,
|
|
3909
|
+
const onTooltipPositionChange = (0, import_react19.useCallback)(
|
|
3883
3910
|
(id, position) => {
|
|
3884
3911
|
setActiveTooltips(
|
|
3885
3912
|
(prev) => prev.map((t) => t.id === id ? { ...t, position } : t)
|
|
@@ -3887,11 +3914,11 @@ var Chart = ({
|
|
|
3887
3914
|
},
|
|
3888
3915
|
[]
|
|
3889
3916
|
);
|
|
3890
|
-
const titleClassName = (0,
|
|
3917
|
+
const titleClassName = (0, import_react19.useMemo)(
|
|
3891
3918
|
() => "text-xl font-semibold text-foreground mb-3",
|
|
3892
3919
|
[]
|
|
3893
3920
|
);
|
|
3894
|
-
const finalValueFormatter = (0,
|
|
3921
|
+
const finalValueFormatter = (0, import_react19.useMemo)(() => {
|
|
3895
3922
|
const nf = new Intl.NumberFormat("pt-BR", {
|
|
3896
3923
|
minimumFractionDigits: 2,
|
|
3897
3924
|
maximumFractionDigits: 2
|
|
@@ -3931,7 +3958,7 @@ var Chart = ({
|
|
|
3931
3958
|
};
|
|
3932
3959
|
return builtIn;
|
|
3933
3960
|
}, [valueFormatter2, formatBR]);
|
|
3934
|
-
const yTickFormatter = (0,
|
|
3961
|
+
const yTickFormatter = (0, import_react19.useMemo)(() => {
|
|
3935
3962
|
const nf = new Intl.NumberFormat("pt-BR", {
|
|
3936
3963
|
minimumFractionDigits: 2,
|
|
3937
3964
|
maximumFractionDigits: 2
|
|
@@ -3969,7 +3996,7 @@ var Chart = ({
|
|
|
3969
3996
|
const measuredInner = measuredWidth ? Math.max(0, measuredWidth - 32) : void 0;
|
|
3970
3997
|
const effectiveChartWidth = typeof width === "number" ? width : measuredInner ?? computedWidth;
|
|
3971
3998
|
const chartInnerWidth = effectiveChartWidth - finalChartLeftMargin - finalChartRightMargin;
|
|
3972
|
-
const openTooltipForPeriod = (0,
|
|
3999
|
+
const openTooltipForPeriod = (0, import_react19.useCallback)(
|
|
3973
4000
|
(periodName) => {
|
|
3974
4001
|
if (!enableDraggableTooltips) return;
|
|
3975
4002
|
const row = processedData.find((r) => String(r.name) === periodName);
|
|
@@ -4199,9 +4226,7 @@ var Chart = ({
|
|
|
4199
4226
|
label: yAxisLabel ? {
|
|
4200
4227
|
value: yAxisLabel,
|
|
4201
4228
|
angle: -90,
|
|
4202
|
-
|
|
4203
|
-
// to avoid overlapping the Y values / bars.
|
|
4204
|
-
position: "left",
|
|
4229
|
+
position: "leftTop",
|
|
4205
4230
|
style: {
|
|
4206
4231
|
fontSize: 12,
|
|
4207
4232
|
fill: "hsl(var(--muted-foreground))",
|
|
@@ -4410,7 +4435,7 @@ var Chart = ({
|
|
|
4410
4435
|
var Chart_default = Chart;
|
|
4411
4436
|
|
|
4412
4437
|
// src/components/charts/BarChart.tsx
|
|
4413
|
-
var
|
|
4438
|
+
var import_react20 = require("react");
|
|
4414
4439
|
var import_recharts2 = require("recharts");
|
|
4415
4440
|
var import_jsx_runtime28 = require("react/jsx-runtime");
|
|
4416
4441
|
var DEFAULT_COLORS2 = ["#55af7d", "#8e68ff", "#2273e1"];
|
|
@@ -4442,7 +4467,7 @@ var BarChart = ({
|
|
|
4442
4467
|
containerPaddingLeft,
|
|
4443
4468
|
16
|
|
4444
4469
|
);
|
|
4445
|
-
const smartConfig = (0,
|
|
4470
|
+
const smartConfig = (0, import_react20.useMemo)(() => {
|
|
4446
4471
|
const providedMapper = yAxis ?? mapper;
|
|
4447
4472
|
if (autoDetect === true || xAxis == null || providedMapper == null) {
|
|
4448
4473
|
const detectedXAxis = detectXAxis(data);
|
|
@@ -4492,14 +4517,14 @@ var BarChart = ({
|
|
|
4492
4517
|
return { xAxisConfig: xAxisConfig2, mapperConfig: mapperConfig2 };
|
|
4493
4518
|
}, [data, xAxis, mapper, yAxis, autoDetect, labelMap]);
|
|
4494
4519
|
const { xAxisConfig, mapperConfig } = smartConfig;
|
|
4495
|
-
const [activeTooltips, setActiveTooltips] = (0,
|
|
4496
|
-
const [isDragging, setIsDragging] = (0,
|
|
4497
|
-
const [dragOffset, setDragOffset] = (0,
|
|
4520
|
+
const [activeTooltips, setActiveTooltips] = (0, import_react20.useState)([]);
|
|
4521
|
+
const [isDragging, setIsDragging] = (0, import_react20.useState)(null);
|
|
4522
|
+
const [dragOffset, setDragOffset] = (0, import_react20.useState)({
|
|
4498
4523
|
x: 0,
|
|
4499
4524
|
y: 0
|
|
4500
4525
|
});
|
|
4501
|
-
const [globalTooltipCount, setGlobalTooltipCount] = (0,
|
|
4502
|
-
const [alignmentGuides, setAlignmentGuides] = (0,
|
|
4526
|
+
const [globalTooltipCount, setGlobalTooltipCount] = (0, import_react20.useState)(0);
|
|
4527
|
+
const [alignmentGuides, setAlignmentGuides] = (0, import_react20.useState)([]);
|
|
4503
4528
|
const processedData = data.map((item) => ({
|
|
4504
4529
|
...item,
|
|
4505
4530
|
name: String(item[xAxisConfig.dataKey] || "N/A")
|
|
@@ -4522,7 +4547,7 @@ var BarChart = ({
|
|
|
4522
4547
|
// Garantir que tem a propriedade 'name'
|
|
4523
4548
|
};
|
|
4524
4549
|
};
|
|
4525
|
-
const maxDataValue = (0,
|
|
4550
|
+
const maxDataValue = (0, import_react20.useMemo)(() => {
|
|
4526
4551
|
let max = 0;
|
|
4527
4552
|
const keys = Object.keys(mapperConfig);
|
|
4528
4553
|
for (const row of processedData) {
|
|
@@ -4535,7 +4560,7 @@ var BarChart = ({
|
|
|
4535
4560
|
}
|
|
4536
4561
|
return max;
|
|
4537
4562
|
}, [processedData, mapperConfig]);
|
|
4538
|
-
const niceMax = (0,
|
|
4563
|
+
const niceMax = (0, import_react20.useMemo)(() => {
|
|
4539
4564
|
let padding2 = 0.08;
|
|
4540
4565
|
if (maxDataValue > 1e6) padding2 = 0.05;
|
|
4541
4566
|
if (maxDataValue > 1e7) padding2 = 0.03;
|
|
@@ -4576,7 +4601,7 @@ var BarChart = ({
|
|
|
4576
4601
|
const GUIDE_THRESHOLD2 = 60;
|
|
4577
4602
|
const STRONG_SNAP_THRESHOLD2 = 35;
|
|
4578
4603
|
const PRECISION_SNAP_THRESHOLD2 = 8;
|
|
4579
|
-
const updateAlignmentGuides = (0,
|
|
4604
|
+
const updateAlignmentGuides = (0, import_react20.useCallback)(
|
|
4580
4605
|
(draggedTooltipId, currentPosition) => {
|
|
4581
4606
|
if (!isDragging) return;
|
|
4582
4607
|
const getAllTooltips = () => {
|
|
@@ -4640,7 +4665,7 @@ var BarChart = ({
|
|
|
4640
4665
|
},
|
|
4641
4666
|
[isDragging, activeTooltips]
|
|
4642
4667
|
);
|
|
4643
|
-
const snapToGuides = (0,
|
|
4668
|
+
const snapToGuides = (0, import_react20.useCallback)(
|
|
4644
4669
|
(position) => {
|
|
4645
4670
|
const snappedPosition = { ...position };
|
|
4646
4671
|
let hasSnapped = false;
|
|
@@ -4702,7 +4727,7 @@ var BarChart = ({
|
|
|
4702
4727
|
setIsDragging(tooltipId);
|
|
4703
4728
|
setDragOffset({ x: offsetX, y: offsetY });
|
|
4704
4729
|
};
|
|
4705
|
-
(0,
|
|
4730
|
+
(0, import_react20.useEffect)(() => {
|
|
4706
4731
|
let rafId;
|
|
4707
4732
|
let lastMousePosition = { x: 0, y: 0 };
|
|
4708
4733
|
const handleGlobalMouseMove = (e) => {
|
|
@@ -4760,7 +4785,7 @@ var BarChart = ({
|
|
|
4760
4785
|
updateAlignmentGuides,
|
|
4761
4786
|
snapToGuides
|
|
4762
4787
|
]);
|
|
4763
|
-
(0,
|
|
4788
|
+
(0, import_react20.useEffect)(() => {
|
|
4764
4789
|
const handleCloseAllTooltips = () => {
|
|
4765
4790
|
setActiveTooltips([]);
|
|
4766
4791
|
setGlobalTooltipCount(0);
|
|
@@ -4770,7 +4795,7 @@ var BarChart = ({
|
|
|
4770
4795
|
window.removeEventListener("closeAllTooltips", handleCloseAllTooltips);
|
|
4771
4796
|
};
|
|
4772
4797
|
}, []);
|
|
4773
|
-
(0,
|
|
4798
|
+
(0, import_react20.useEffect)(() => {
|
|
4774
4799
|
const handleTooltipCountRequest = () => {
|
|
4775
4800
|
window.dispatchEvent(
|
|
4776
4801
|
new CustomEvent("tooltipCountResponse", {
|
|
@@ -4809,7 +4834,7 @@ var BarChart = ({
|
|
|
4809
4834
|
);
|
|
4810
4835
|
};
|
|
4811
4836
|
}, [activeTooltips]);
|
|
4812
|
-
(0,
|
|
4837
|
+
(0, import_react20.useEffect)(() => {
|
|
4813
4838
|
if (isDragging) return;
|
|
4814
4839
|
let totalCount = 0;
|
|
4815
4840
|
const handleCountResponse = (event) => {
|
|
@@ -5075,7 +5100,7 @@ var BarChart = ({
|
|
|
5075
5100
|
var BarChart_default = BarChart;
|
|
5076
5101
|
|
|
5077
5102
|
// src/components/charts/LineChart.tsx
|
|
5078
|
-
var
|
|
5103
|
+
var import_react21 = require("react");
|
|
5079
5104
|
var import_recharts3 = require("recharts");
|
|
5080
5105
|
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
5081
5106
|
var defaultData = [
|
|
@@ -5109,14 +5134,14 @@ var CustomLineChart = ({
|
|
|
5109
5134
|
containerPaddingLeft,
|
|
5110
5135
|
16
|
|
5111
5136
|
);
|
|
5112
|
-
const [activeTooltips, setActiveTooltips] = (0,
|
|
5113
|
-
const [isDragging, setIsDragging] = (0,
|
|
5114
|
-
const [dragOffset, setDragOffset] = (0,
|
|
5137
|
+
const [activeTooltips, setActiveTooltips] = (0, import_react21.useState)([]);
|
|
5138
|
+
const [isDragging, setIsDragging] = (0, import_react21.useState)(null);
|
|
5139
|
+
const [dragOffset, setDragOffset] = (0, import_react21.useState)({
|
|
5115
5140
|
x: 0,
|
|
5116
5141
|
y: 0
|
|
5117
5142
|
});
|
|
5118
|
-
const [globalTooltipCount, setGlobalTooltipCount] = (0,
|
|
5119
|
-
const [alignmentGuides, setAlignmentGuides] = (0,
|
|
5143
|
+
const [globalTooltipCount, setGlobalTooltipCount] = (0, import_react21.useState)(0);
|
|
5144
|
+
const [alignmentGuides, setAlignmentGuides] = (0, import_react21.useState)([]);
|
|
5120
5145
|
const generateColors = (dataKeys2) => {
|
|
5121
5146
|
const colorMap = {};
|
|
5122
5147
|
const allColors = generateAdditionalColors(colors2, dataKeys2.length);
|
|
@@ -5125,12 +5150,12 @@ var CustomLineChart = ({
|
|
|
5125
5150
|
});
|
|
5126
5151
|
return colorMap;
|
|
5127
5152
|
};
|
|
5128
|
-
const dataKeys = (0,
|
|
5153
|
+
const dataKeys = (0, import_react21.useMemo)(
|
|
5129
5154
|
() => data.length > 0 ? Object.keys(data[0]).filter((key) => key !== "name") : [],
|
|
5130
5155
|
[data]
|
|
5131
5156
|
);
|
|
5132
5157
|
const finalColors = generateColors(dataKeys);
|
|
5133
|
-
const maxDataValue = (0,
|
|
5158
|
+
const maxDataValue = (0, import_react21.useMemo)(() => {
|
|
5134
5159
|
let max = 0;
|
|
5135
5160
|
for (const row of data) {
|
|
5136
5161
|
const r = row;
|
|
@@ -5142,7 +5167,7 @@ var CustomLineChart = ({
|
|
|
5142
5167
|
}
|
|
5143
5168
|
return max;
|
|
5144
5169
|
}, [data, dataKeys]);
|
|
5145
|
-
const niceMax = (0,
|
|
5170
|
+
const niceMax = (0, import_react21.useMemo)(() => {
|
|
5146
5171
|
let padding2 = 0.08;
|
|
5147
5172
|
if (maxDataValue > 1e6) padding2 = 0.05;
|
|
5148
5173
|
if (maxDataValue > 1e7) padding2 = 0.03;
|
|
@@ -5218,10 +5243,10 @@ var CustomLineChart = ({
|
|
|
5218
5243
|
const handleChartBackgroundClick = () => {
|
|
5219
5244
|
setActiveTooltips([]);
|
|
5220
5245
|
};
|
|
5221
|
-
const handleCloseAllTooltips = (0,
|
|
5246
|
+
const handleCloseAllTooltips = (0, import_react21.useCallback)(() => {
|
|
5222
5247
|
window.dispatchEvent(new CustomEvent("closeAllTooltips"));
|
|
5223
5248
|
}, []);
|
|
5224
|
-
const updateAlignmentGuides = (0,
|
|
5249
|
+
const updateAlignmentGuides = (0, import_react21.useCallback)(
|
|
5225
5250
|
(draggedTooltipId, draggedPosition) => {
|
|
5226
5251
|
const SNAP_THRESHOLD = 15;
|
|
5227
5252
|
const draggedTooltip = activeTooltips.find(
|
|
@@ -5302,7 +5327,7 @@ var CustomLineChart = ({
|
|
|
5302
5327
|
},
|
|
5303
5328
|
[activeTooltips]
|
|
5304
5329
|
);
|
|
5305
|
-
const snapToGuides = (0,
|
|
5330
|
+
const snapToGuides = (0, import_react21.useCallback)(
|
|
5306
5331
|
(position) => {
|
|
5307
5332
|
const SNAP_DISTANCE = 10;
|
|
5308
5333
|
const snappedPosition = { ...position };
|
|
@@ -5330,7 +5355,7 @@ var CustomLineChart = ({
|
|
|
5330
5355
|
setIsDragging(tooltipId);
|
|
5331
5356
|
setDragOffset({ x: offsetX, y: offsetY });
|
|
5332
5357
|
};
|
|
5333
|
-
(0,
|
|
5358
|
+
(0, import_react21.useEffect)(() => {
|
|
5334
5359
|
let rafId;
|
|
5335
5360
|
let lastMousePosition = { x: 0, y: 0 };
|
|
5336
5361
|
const handleGlobalMouseMove = (e) => {
|
|
@@ -5377,7 +5402,7 @@ var CustomLineChart = ({
|
|
|
5377
5402
|
updateAlignmentGuides,
|
|
5378
5403
|
snapToGuides
|
|
5379
5404
|
]);
|
|
5380
|
-
(0,
|
|
5405
|
+
(0, import_react21.useEffect)(() => {
|
|
5381
5406
|
const handleCloseAllTooltips2 = () => {
|
|
5382
5407
|
setActiveTooltips([]);
|
|
5383
5408
|
setGlobalTooltipCount(0);
|
|
@@ -5387,7 +5412,7 @@ var CustomLineChart = ({
|
|
|
5387
5412
|
window.removeEventListener("closeAllTooltips", handleCloseAllTooltips2);
|
|
5388
5413
|
};
|
|
5389
5414
|
}, []);
|
|
5390
|
-
(0,
|
|
5415
|
+
(0, import_react21.useEffect)(() => {
|
|
5391
5416
|
const handleTooltipCountRequest = () => {
|
|
5392
5417
|
window.dispatchEvent(
|
|
5393
5418
|
new CustomEvent("tooltipCountResponse", {
|
|
@@ -5431,7 +5456,7 @@ var CustomLineChart = ({
|
|
|
5431
5456
|
);
|
|
5432
5457
|
};
|
|
5433
5458
|
}, [activeTooltips]);
|
|
5434
|
-
(0,
|
|
5459
|
+
(0, import_react21.useEffect)(() => {
|
|
5435
5460
|
if (isDragging) return;
|
|
5436
5461
|
let totalCount = 0;
|
|
5437
5462
|
const handleCountResponse = (event) => {
|
|
@@ -5753,13 +5778,13 @@ var CustomPieChart = ({
|
|
|
5753
5778
|
var PieChart_default = CustomPieChart;
|
|
5754
5779
|
|
|
5755
5780
|
// src/components/charts/hooks/useChartHighlights.tsx
|
|
5756
|
-
var
|
|
5781
|
+
var import_react22 = require("react");
|
|
5757
5782
|
var useChartHighlights = () => {
|
|
5758
|
-
const [highlightedSeries, setHighlightedSeries] = (0,
|
|
5783
|
+
const [highlightedSeries, setHighlightedSeries] = (0, import_react22.useState)(
|
|
5759
5784
|
/* @__PURE__ */ new Set()
|
|
5760
5785
|
);
|
|
5761
|
-
const [showOnlyHighlighted, setShowOnlyHighlighted] = (0,
|
|
5762
|
-
const toggleHighlight = (0,
|
|
5786
|
+
const [showOnlyHighlighted, setShowOnlyHighlighted] = (0, import_react22.useState)(false);
|
|
5787
|
+
const toggleHighlight = (0, import_react22.useCallback)((key) => {
|
|
5763
5788
|
setHighlightedSeries((prev) => {
|
|
5764
5789
|
const next = new Set(prev);
|
|
5765
5790
|
if (next.has(key)) {
|
|
@@ -5770,17 +5795,17 @@ var useChartHighlights = () => {
|
|
|
5770
5795
|
return next;
|
|
5771
5796
|
});
|
|
5772
5797
|
}, []);
|
|
5773
|
-
const clearHighlights = (0,
|
|
5798
|
+
const clearHighlights = (0, import_react22.useCallback)(() => {
|
|
5774
5799
|
setHighlightedSeries(/* @__PURE__ */ new Set());
|
|
5775
5800
|
setShowOnlyHighlighted(false);
|
|
5776
5801
|
}, []);
|
|
5777
|
-
const isHighlighted = (0,
|
|
5802
|
+
const isHighlighted = (0, import_react22.useCallback)(
|
|
5778
5803
|
(key) => {
|
|
5779
5804
|
return highlightedSeries.has(key);
|
|
5780
5805
|
},
|
|
5781
5806
|
[highlightedSeries]
|
|
5782
5807
|
);
|
|
5783
|
-
const getSeriesStyle = (0,
|
|
5808
|
+
const getSeriesStyle = (0, import_react22.useCallback)(
|
|
5784
5809
|
(key) => {
|
|
5785
5810
|
const hasHighlights = highlightedSeries.size > 0;
|
|
5786
5811
|
const isSeriesHighlighted = highlightedSeries.has(key);
|
|
@@ -5867,210 +5892,58 @@ AvatarFallbackBase.displayName = AvatarPrimitive.Fallback.displayName;
|
|
|
5867
5892
|
var import_react_slot3 = require("@radix-ui/react-slot");
|
|
5868
5893
|
var import_class_variance_authority2 = require("class-variance-authority");
|
|
5869
5894
|
var import_jsx_runtime32 = require("react/jsx-runtime");
|
|
5870
|
-
var tailwindColors = {
|
|
5871
|
-
// Red
|
|
5872
|
-
"red-50": "#fef2f2",
|
|
5873
|
-
"red-100": "#fee2e2",
|
|
5874
|
-
"red-200": "#fecaca",
|
|
5875
|
-
"red-300": "#fca5a5",
|
|
5876
|
-
"red-400": "#f87171",
|
|
5877
|
-
"red-500": "#ef4444",
|
|
5878
|
-
"red-600": "#dc2626",
|
|
5879
|
-
"red-700": "#b91c1c",
|
|
5880
|
-
"red-800": "#991b1b",
|
|
5881
|
-
"red-900": "#7f1d1d",
|
|
5882
|
-
// Orange
|
|
5883
|
-
"orange-50": "#fff7ed",
|
|
5884
|
-
"orange-100": "#ffedd5",
|
|
5885
|
-
"orange-200": "#fed7aa",
|
|
5886
|
-
"orange-300": "#fdba74",
|
|
5887
|
-
"orange-400": "#fb923c",
|
|
5888
|
-
"orange-500": "#f97316",
|
|
5889
|
-
"orange-600": "#ea580c",
|
|
5890
|
-
"orange-700": "#c2410c",
|
|
5891
|
-
"orange-800": "#9a3412",
|
|
5892
|
-
"orange-900": "#7c2d12",
|
|
5893
|
-
// Yellow
|
|
5894
|
-
"yellow-50": "#fefce8",
|
|
5895
|
-
"yellow-100": "#fef3c7",
|
|
5896
|
-
"yellow-200": "#fde68a",
|
|
5897
|
-
"yellow-300": "#fcd34d",
|
|
5898
|
-
"yellow-400": "#fbbf24",
|
|
5899
|
-
"yellow-500": "#f59e0b",
|
|
5900
|
-
"yellow-600": "#d97706",
|
|
5901
|
-
"yellow-700": "#b45309",
|
|
5902
|
-
"yellow-800": "#92400e",
|
|
5903
|
-
"yellow-900": "#78350f",
|
|
5904
|
-
// Green
|
|
5905
|
-
"green-50": "#f0fdf4",
|
|
5906
|
-
"green-100": "#dcfce7",
|
|
5907
|
-
"green-200": "#bbf7d0",
|
|
5908
|
-
"green-300": "#86efac",
|
|
5909
|
-
"green-400": "#4ade80",
|
|
5910
|
-
"green-500": "#22c55e",
|
|
5911
|
-
"green-600": "#16a34a",
|
|
5912
|
-
"green-700": "#15803d",
|
|
5913
|
-
"green-800": "#166534",
|
|
5914
|
-
"green-900": "#14532d",
|
|
5915
|
-
// Blue
|
|
5916
|
-
"blue-50": "#eff6ff",
|
|
5917
|
-
"blue-100": "#dbeafe",
|
|
5918
|
-
"blue-200": "#bfdbfe",
|
|
5919
|
-
"blue-300": "#93c5fd",
|
|
5920
|
-
"blue-400": "#60a5fa",
|
|
5921
|
-
"blue-500": "#3b82f6",
|
|
5922
|
-
"blue-600": "#2563eb",
|
|
5923
|
-
"blue-700": "#1d4ed8",
|
|
5924
|
-
"blue-800": "#1e40af",
|
|
5925
|
-
"blue-900": "#1e3a8a",
|
|
5926
|
-
// Purple
|
|
5927
|
-
"purple-50": "#faf5ff",
|
|
5928
|
-
"purple-100": "#f3e8ff",
|
|
5929
|
-
"purple-200": "#e9d5ff",
|
|
5930
|
-
"purple-300": "#d8b4fe",
|
|
5931
|
-
"purple-400": "#c084fc",
|
|
5932
|
-
"purple-500": "#a855f7",
|
|
5933
|
-
"purple-600": "#9333ea",
|
|
5934
|
-
"purple-700": "#7c3aed",
|
|
5935
|
-
"purple-800": "#6b21a8",
|
|
5936
|
-
"purple-900": "#581c87",
|
|
5937
|
-
// Pink
|
|
5938
|
-
"pink-50": "#fdf2f8",
|
|
5939
|
-
"pink-100": "#fce7f3",
|
|
5940
|
-
"pink-200": "#fbcfe8",
|
|
5941
|
-
"pink-300": "#f9a8d4",
|
|
5942
|
-
"pink-400": "#f472b6",
|
|
5943
|
-
"pink-500": "#ec4899",
|
|
5944
|
-
"pink-600": "#db2777",
|
|
5945
|
-
"pink-700": "#be185d",
|
|
5946
|
-
"pink-800": "#9d174d",
|
|
5947
|
-
"pink-900": "#831843",
|
|
5948
|
-
// Gray
|
|
5949
|
-
"gray-50": "#f9fafb",
|
|
5950
|
-
"gray-100": "#f3f4f6",
|
|
5951
|
-
"gray-200": "#e5e7eb",
|
|
5952
|
-
"gray-300": "#d1d5db",
|
|
5953
|
-
"gray-400": "#9ca3af",
|
|
5954
|
-
"gray-500": "#6b7280",
|
|
5955
|
-
"gray-600": "#4b5563",
|
|
5956
|
-
"gray-700": "#374151",
|
|
5957
|
-
"gray-800": "#1f2937",
|
|
5958
|
-
"gray-900": "#111827",
|
|
5959
|
-
// Indigo
|
|
5960
|
-
"indigo-50": "#eef2ff",
|
|
5961
|
-
"indigo-100": "#e0e7ff",
|
|
5962
|
-
"indigo-200": "#c7d2fe",
|
|
5963
|
-
"indigo-300": "#a5b4fc",
|
|
5964
|
-
"indigo-400": "#818cf8",
|
|
5965
|
-
"indigo-500": "#6366f1",
|
|
5966
|
-
"indigo-600": "#4f46e5",
|
|
5967
|
-
"indigo-700": "#4338ca",
|
|
5968
|
-
"indigo-800": "#3730a3",
|
|
5969
|
-
"indigo-900": "#312e81",
|
|
5970
|
-
// Teal
|
|
5971
|
-
"teal-50": "#f0fdfa",
|
|
5972
|
-
"teal-100": "#ccfbf1",
|
|
5973
|
-
"teal-200": "#99f6e4",
|
|
5974
|
-
"teal-300": "#5eead4",
|
|
5975
|
-
"teal-400": "#2dd4bf",
|
|
5976
|
-
"teal-500": "#14b8a6",
|
|
5977
|
-
"teal-600": "#0d9488",
|
|
5978
|
-
"teal-700": "#0f766e",
|
|
5979
|
-
"teal-800": "#115e59",
|
|
5980
|
-
"teal-900": "#134e4a",
|
|
5981
|
-
// Emerald
|
|
5982
|
-
"emerald-50": "#ecfdf5",
|
|
5983
|
-
"emerald-100": "#d1fae5",
|
|
5984
|
-
"emerald-200": "#a7f3d0",
|
|
5985
|
-
"emerald-300": "#6ee7b7",
|
|
5986
|
-
"emerald-400": "#34d399",
|
|
5987
|
-
"emerald-500": "#10b981",
|
|
5988
|
-
"emerald-600": "#059669",
|
|
5989
|
-
"emerald-700": "#047857",
|
|
5990
|
-
"emerald-800": "#065f46",
|
|
5991
|
-
"emerald-900": "#064e3b",
|
|
5992
|
-
// Cyan
|
|
5993
|
-
"cyan-50": "#ecfeff",
|
|
5994
|
-
"cyan-100": "#cffafe",
|
|
5995
|
-
"cyan-200": "#a5f3fc",
|
|
5996
|
-
"cyan-300": "#67e8f9",
|
|
5997
|
-
"cyan-400": "#22d3ee",
|
|
5998
|
-
"cyan-500": "#06b6d4",
|
|
5999
|
-
"cyan-600": "#0891b2",
|
|
6000
|
-
"cyan-700": "#0e7490",
|
|
6001
|
-
"cyan-800": "#155e75",
|
|
6002
|
-
"cyan-900": "#164e63"
|
|
6003
|
-
};
|
|
6004
|
-
var getTailwindColor = (color) => {
|
|
6005
|
-
if (color.startsWith("#") || color.startsWith("rgb") || color.startsWith("hsl")) {
|
|
6006
|
-
return color;
|
|
6007
|
-
}
|
|
6008
|
-
if (tailwindColors[color]) {
|
|
6009
|
-
return tailwindColors[color];
|
|
6010
|
-
}
|
|
6011
|
-
if (!color.includes("-")) {
|
|
6012
|
-
const defaultColor = `${color}-500`;
|
|
6013
|
-
if (tailwindColors[defaultColor]) {
|
|
6014
|
-
return tailwindColors[defaultColor];
|
|
6015
|
-
}
|
|
6016
|
-
}
|
|
6017
|
-
return color;
|
|
6018
|
-
};
|
|
6019
5895
|
var badgeVariants = (0, import_class_variance_authority2.cva)(
|
|
6020
|
-
"inline-flex items-center justify-center rounded-md border
|
|
5896
|
+
"inline-flex items-center justify-center rounded-md border text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
|
|
6021
5897
|
{
|
|
6022
5898
|
variants: {
|
|
6023
|
-
|
|
6024
|
-
|
|
6025
|
-
|
|
6026
|
-
|
|
6027
|
-
outline: "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground"
|
|
6028
|
-
},
|
|
6029
|
-
status: {
|
|
6030
|
-
success: "bg-green-500 border-white dark:border-zinc-900",
|
|
6031
|
-
desactivated: "bg-gray-400 border-white dark:border-zinc-900",
|
|
6032
|
-
destructive: "bg-red-500 border-white dark:border-zinc-900",
|
|
6033
|
-
away: "bg-yellow-400 border-white dark:border-zinc-900",
|
|
6034
|
-
custom: "border-white dark:border-zinc-900"
|
|
5899
|
+
size: {
|
|
5900
|
+
sm: "px-1 py-0.5 text-xs",
|
|
5901
|
+
md: "px-2 py-1 text-xs",
|
|
5902
|
+
lg: "px-3 py-1 text-sm"
|
|
6035
5903
|
}
|
|
6036
5904
|
},
|
|
6037
5905
|
defaultVariants: {
|
|
6038
|
-
|
|
5906
|
+
size: "md"
|
|
6039
5907
|
}
|
|
6040
5908
|
}
|
|
6041
5909
|
);
|
|
6042
5910
|
function BadgeBase({
|
|
6043
5911
|
className,
|
|
6044
|
-
|
|
6045
|
-
|
|
6046
|
-
statusColor,
|
|
5912
|
+
color,
|
|
5913
|
+
size = "md",
|
|
6047
5914
|
asChild = false,
|
|
6048
5915
|
children,
|
|
6049
5916
|
style,
|
|
6050
5917
|
...props
|
|
6051
5918
|
}) {
|
|
6052
5919
|
const Comp = asChild ? import_react_slot3.Slot : "span";
|
|
6053
|
-
const
|
|
6054
|
-
const
|
|
6055
|
-
|
|
5920
|
+
const customStyle = style;
|
|
5921
|
+
const colorClasses = {
|
|
5922
|
+
green: "bg-green-50 text-green-500 border-green-200",
|
|
5923
|
+
gray: "bg-gray-50 text-gray-500 border-gray-200",
|
|
5924
|
+
red: "bg-red-50 text-red-500 border-red-200",
|
|
5925
|
+
yellow: "bg-yellow-50 text-yellow-600 border-yellow-200",
|
|
5926
|
+
blue: "bg-blue-50 text-blue-500 border-blue-200",
|
|
5927
|
+
purple: "bg-purple-50 text-purple-500 border-purple-200"
|
|
5928
|
+
};
|
|
6056
5929
|
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6057
5930
|
Comp,
|
|
6058
5931
|
{
|
|
6059
5932
|
"data-slot": "badge",
|
|
6060
5933
|
className: cn(
|
|
6061
|
-
badgeVariants({
|
|
6062
|
-
|
|
5934
|
+
badgeVariants({ size }),
|
|
5935
|
+
color ? colorClasses[color] : void 0,
|
|
6063
5936
|
className
|
|
6064
5937
|
),
|
|
6065
5938
|
style: customStyle,
|
|
6066
5939
|
...props,
|
|
6067
|
-
children
|
|
5940
|
+
children
|
|
6068
5941
|
}
|
|
6069
5942
|
);
|
|
6070
5943
|
}
|
|
6071
5944
|
|
|
6072
5945
|
// src/components/ui/data/CalendarBase.tsx
|
|
6073
|
-
var
|
|
5946
|
+
var import_react23 = require("@phosphor-icons/react");
|
|
6074
5947
|
var import_react_day_picker = require("react-day-picker");
|
|
6075
5948
|
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
6076
5949
|
function CalendarBase({
|
|
@@ -6115,8 +5988,8 @@ function CalendarBase({
|
|
|
6115
5988
|
...classNames
|
|
6116
5989
|
},
|
|
6117
5990
|
components: {
|
|
6118
|
-
IconLeft: () => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
6119
|
-
IconRight: () => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
5991
|
+
IconLeft: () => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react23.CaretLeftIcon, { className: "h-4 w-4" }),
|
|
5992
|
+
IconRight: () => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react23.CaretRightIcon, { className: "h-4 w-4" })
|
|
6120
5993
|
},
|
|
6121
5994
|
...props
|
|
6122
5995
|
}
|
|
@@ -6194,7 +6067,7 @@ CardFooterBase.displayName = "CardFooter";
|
|
|
6194
6067
|
// src/components/ui/data/FileUploader.tsx
|
|
6195
6068
|
var React18 = __toESM(require("react"));
|
|
6196
6069
|
var import_framer_motion10 = require("framer-motion");
|
|
6197
|
-
var
|
|
6070
|
+
var import_react24 = require("@phosphor-icons/react");
|
|
6198
6071
|
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
6199
6072
|
var formatFileSize = (bytes) => {
|
|
6200
6073
|
if (bytes === 0) return "0 Bytes";
|
|
@@ -6210,38 +6083,38 @@ var getFileTypeIcon = (file) => {
|
|
|
6210
6083
|
const extension = getFileExtension(file.name).toLowerCase();
|
|
6211
6084
|
const mimeType = file.type.toLowerCase();
|
|
6212
6085
|
if (extension === "pdf" || mimeType === "application/pdf") {
|
|
6213
|
-
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6086
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react24.FilePdfIcon, { size: 20, className: "text-red-500" });
|
|
6214
6087
|
}
|
|
6215
6088
|
if (["doc", "docx"].includes(extension) || mimeType.includes("word")) {
|
|
6216
|
-
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6089
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react24.FileDocIcon, { size: 20, className: "text-blue-500" });
|
|
6217
6090
|
}
|
|
6218
6091
|
if (["xls", "xlsx"].includes(extension) || mimeType.includes("sheet")) {
|
|
6219
|
-
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6092
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react24.FileXlsIcon, { size: 20, className: "text-green-500" });
|
|
6220
6093
|
}
|
|
6221
6094
|
if (["ppt", "pptx"].includes(extension) || mimeType.includes("presentation")) {
|
|
6222
|
-
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6095
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react24.FilePptIcon, { size: 20, className: "text-orange-500" });
|
|
6223
6096
|
}
|
|
6224
6097
|
if (extension === "csv" || mimeType === "text/csv") {
|
|
6225
|
-
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6098
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react24.FileCsvIcon, { size: 20, className: "text-green-600" });
|
|
6226
6099
|
}
|
|
6227
6100
|
if (["txt", "md", "json", "xml", "js", "ts", "html", "css"].includes(
|
|
6228
6101
|
extension
|
|
6229
6102
|
) || mimeType.includes("text")) {
|
|
6230
|
-
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6103
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react24.FileTextIcon, { size: 20, className: "text-gray-500" });
|
|
6231
6104
|
}
|
|
6232
6105
|
if (mimeType.startsWith("image/")) {
|
|
6233
|
-
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6106
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react24.FileImageIcon, { size: 20, className: "text-purple-500" });
|
|
6234
6107
|
}
|
|
6235
6108
|
if (mimeType.startsWith("video/")) {
|
|
6236
|
-
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6109
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react24.FileVideoIcon, { size: 20, className: "text-pink-500" });
|
|
6237
6110
|
}
|
|
6238
6111
|
if (mimeType.startsWith("audio/")) {
|
|
6239
|
-
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6112
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react24.FileAudioIcon, { size: 20, className: "text-indigo-500" });
|
|
6240
6113
|
}
|
|
6241
6114
|
if (["zip", "rar", "7z", "tar", "gz"].includes(extension)) {
|
|
6242
|
-
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6115
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react24.FileZipIcon, { size: 20, className: "text-yellow-600" });
|
|
6243
6116
|
}
|
|
6244
|
-
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6117
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react24.FileIcon, { size: 20, className: "text-muted-foreground" });
|
|
6245
6118
|
};
|
|
6246
6119
|
var createImagePreview = (file) => {
|
|
6247
6120
|
return new Promise((resolve) => {
|
|
@@ -6471,7 +6344,7 @@ var FileUploader = React18.forwardRef(
|
|
|
6471
6344
|
color: isDragging ? `hsl(var(--primary))` : `hsl(var(--muted-foreground))`
|
|
6472
6345
|
},
|
|
6473
6346
|
transition: { duration: 0.3 },
|
|
6474
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6347
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react24.CloudArrowUpIcon, { size: 64 })
|
|
6475
6348
|
}
|
|
6476
6349
|
)
|
|
6477
6350
|
}
|
|
@@ -6513,7 +6386,7 @@ var FileUploader = React18.forwardRef(
|
|
|
6513
6386
|
),
|
|
6514
6387
|
transition: { duration: 0.3 },
|
|
6515
6388
|
children: [
|
|
6516
|
-
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "h-4 w-4 text-primary flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6389
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "h-4 w-4 text-primary flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react24.CheckIcon, { size: 16, className: "text-emerald-500" }) }),
|
|
6517
6390
|
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
|
|
6518
6391
|
import_framer_motion10.motion.span,
|
|
6519
6392
|
{
|
|
@@ -6615,7 +6488,7 @@ var FileUploader = React18.forwardRef(
|
|
|
6615
6488
|
handleRemoveFile(file.id);
|
|
6616
6489
|
},
|
|
6617
6490
|
className: "",
|
|
6618
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6491
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react24.XIcon, { size: 12 })
|
|
6619
6492
|
}
|
|
6620
6493
|
)
|
|
6621
6494
|
]
|
|
@@ -6739,7 +6612,7 @@ AlertDialogCancelBase.displayName = AlertDialogPrimitive.Cancel.displayName;
|
|
|
6739
6612
|
|
|
6740
6613
|
// src/components/ui/feedback/DestructiveDialog.tsx
|
|
6741
6614
|
var React20 = __toESM(require("react"));
|
|
6742
|
-
var
|
|
6615
|
+
var import_react25 = require("@phosphor-icons/react");
|
|
6743
6616
|
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
6744
6617
|
var DestructiveDialog = ({
|
|
6745
6618
|
title,
|
|
@@ -6758,7 +6631,7 @@ var DestructiveDialog = ({
|
|
|
6758
6631
|
className: cn("border border-destructive bg-background"),
|
|
6759
6632
|
children: [
|
|
6760
6633
|
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex items-start gap-4", children: [
|
|
6761
|
-
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "flex items-center justify-center w-10 h-10 rounded-full ring-1 ring-destructive/30", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
6634
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "flex items-center justify-center w-10 h-10 rounded-full ring-1 ring-destructive/30", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react25.XCircleIcon, { className: "w-6 h-6 text-destructive" }) }),
|
|
6762
6635
|
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex-1", children: [
|
|
6763
6636
|
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(AlertDialogTitleBase, { className: "text-lg sm:text-xl font-semibold text-destructive", children: title }),
|
|
6764
6637
|
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(AlertDialogDescriptionBase, { className: "mt-2 text-sm text-muted-foreground", children: description })
|
|
@@ -6967,7 +6840,7 @@ LoadingBase.displayName = "LoadingBase";
|
|
|
6967
6840
|
// src/components/ui/feedback/ModalBase.tsx
|
|
6968
6841
|
var React22 = __toESM(require("react"));
|
|
6969
6842
|
var DialogPrimitive2 = __toESM(require("@radix-ui/react-dialog"));
|
|
6970
|
-
var
|
|
6843
|
+
var import_react26 = require("@phosphor-icons/react");
|
|
6971
6844
|
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
6972
6845
|
var ModalBase = DialogPrimitive2.Root;
|
|
6973
6846
|
var ModalTriggerBase = DialogPrimitive2.Trigger;
|
|
@@ -7040,7 +6913,7 @@ var ModalContentBase = React22.forwardRef(
|
|
|
7040
6913
|
children: [
|
|
7041
6914
|
children,
|
|
7042
6915
|
/* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(DialogPrimitive2.Close, { className: "absolute right-3 top-3 sm:right-4 sm:top-4 rounded-md bg-muted/10 p-1.5 opacity-80 hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none z-10 hover:bg-muted/20 transition-colors", children: [
|
|
7043
|
-
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
6916
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_react26.XIcon, { className: "h-5 w-5 sm:h-4 sm:w-4 text-foreground" }),
|
|
7044
6917
|
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "sr-only", children: "Close" })
|
|
7045
6918
|
] })
|
|
7046
6919
|
]
|
|
@@ -7177,7 +7050,6 @@ var ProgressBase = React23.forwardRef(
|
|
|
7177
7050
|
{
|
|
7178
7051
|
className: cn(
|
|
7179
7052
|
"h-full transition-all duration-500 ease-in-out rounded-lg",
|
|
7180
|
-
// quando não usa autocolor, Indicator deve mostrar a cor primária
|
|
7181
7053
|
autocolor && autocolor.length >= 2 ? "bg-transparent" : "bg-primary"
|
|
7182
7054
|
),
|
|
7183
7055
|
style: { width: `${indicatorWidth}%` }
|
|
@@ -7214,8 +7086,8 @@ var ProgressBase = React23.forwardRef(
|
|
|
7214
7086
|
{
|
|
7215
7087
|
"aria-hidden": "true",
|
|
7216
7088
|
className: "absolute top-0 bottom-0 w-0.5 bg-black/70 transition-all duration-500 ease-in-out pointer-events-none",
|
|
7217
|
-
style: { left:
|
|
7218
|
-
children: value >
|
|
7089
|
+
style: { left: `${100 / value * 100}%` },
|
|
7090
|
+
children: value > 120 && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "absolute left-full ml-2 top-1/2 -translate-y-1/2 text-xs whitespace-nowrap font-extrabold", children: `+${Math.round(
|
|
7219
7091
|
value - 100
|
|
7220
7092
|
)}%` })
|
|
7221
7093
|
}
|
|
@@ -7365,7 +7237,7 @@ function SkeletonBase({
|
|
|
7365
7237
|
}
|
|
7366
7238
|
|
|
7367
7239
|
// src/components/ui/feedback/SonnerBase.tsx
|
|
7368
|
-
var
|
|
7240
|
+
var import_react27 = require("@phosphor-icons/react");
|
|
7369
7241
|
var import_sonner2 = require("sonner");
|
|
7370
7242
|
var import_jsx_runtime42 = require("react/jsx-runtime");
|
|
7371
7243
|
var iconBaseClass = "w-5 h-auto";
|
|
@@ -7417,23 +7289,23 @@ var Toaster = ({ testId, ...props }) => {
|
|
|
7417
7289
|
};
|
|
7418
7290
|
var toast2 = {
|
|
7419
7291
|
success: (message) => import_sonner2.toast.success(message, {
|
|
7420
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
7292
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react27.CheckCircleIcon, { className: `${iconBaseClass} text-green-600`, weight: "fill" }),
|
|
7421
7293
|
className: "sonner-success"
|
|
7422
7294
|
}),
|
|
7423
7295
|
error: (message) => import_sonner2.toast.error(message, {
|
|
7424
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
7296
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react27.XCircleIcon, { className: `${iconBaseClass} text-red-600`, weight: "fill" }),
|
|
7425
7297
|
className: "sonner-error"
|
|
7426
7298
|
}),
|
|
7427
7299
|
warning: (message) => import_sonner2.toast.warning(message, {
|
|
7428
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
7300
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react27.WarningIcon, { className: `${iconBaseClass} text-yellow-600`, weight: "fill" }),
|
|
7429
7301
|
className: "sonner-WarningIcon"
|
|
7430
7302
|
}),
|
|
7431
7303
|
info: (message) => import_sonner2.toast.info(message, {
|
|
7432
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
7304
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react27.InfoIcon, { className: `${iconBaseClass} text-blue-600`, weight: "fill" }),
|
|
7433
7305
|
className: "sonner-InfoIcon"
|
|
7434
7306
|
}),
|
|
7435
7307
|
loading: (message) => (0, import_sonner2.toast)(message, {
|
|
7436
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
7308
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react27.SpinnerIcon, { className: `${iconBaseClass} animate-spin text-neutral-500`, weight: "fill" }),
|
|
7437
7309
|
className: "sonner-loading"
|
|
7438
7310
|
})
|
|
7439
7311
|
};
|
|
@@ -7441,7 +7313,7 @@ var toast2 = {
|
|
|
7441
7313
|
// src/components/ui/form/CheckBoxBase.tsx
|
|
7442
7314
|
var React24 = __toESM(require("react"));
|
|
7443
7315
|
var CheckboxPrimitive = __toESM(require("@radix-ui/react-checkbox"));
|
|
7444
|
-
var
|
|
7316
|
+
var import_react28 = require("@phosphor-icons/react");
|
|
7445
7317
|
var import_framer_motion11 = require("framer-motion");
|
|
7446
7318
|
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
7447
7319
|
var CheckboxBase = React24.forwardRef(({ className, testid: dataTestId = "checkbox-base", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
|
|
@@ -7462,7 +7334,7 @@ var CheckboxBase = React24.forwardRef(({ className, testid: dataTestId = "checkb
|
|
|
7462
7334
|
exit: { scale: 0, opacity: 0, rotate: 90 },
|
|
7463
7335
|
transition: { type: "spring", stiffness: 500, damping: 30 },
|
|
7464
7336
|
className: "flex items-center justify-center text-current",
|
|
7465
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
|
|
7337
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_react28.CheckIcon, { className: "h-4 w-4", weight: "bold" })
|
|
7466
7338
|
}
|
|
7467
7339
|
) })
|
|
7468
7340
|
}
|
|
@@ -7472,7 +7344,7 @@ CheckboxBase.displayName = CheckboxPrimitive.Root.displayName;
|
|
|
7472
7344
|
// src/components/ui/form/CollapsibleBase.tsx
|
|
7473
7345
|
var React25 = __toESM(require("react"));
|
|
7474
7346
|
var CollapsiblePrimitive = __toESM(require("@radix-ui/react-collapsible"));
|
|
7475
|
-
var
|
|
7347
|
+
var import_react29 = require("@phosphor-icons/react");
|
|
7476
7348
|
var import_jsx_runtime44 = require("react/jsx-runtime");
|
|
7477
7349
|
var CollapsibleBase = React25.forwardRef(({ ...props }, ref) => {
|
|
7478
7350
|
return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(CollapsiblePrimitive.Root, { ref, "data-slot": "collapsible", ...props });
|
|
@@ -7494,7 +7366,7 @@ var CollapsibleTriggerBase = React25.forwardRef(({ className, children, leftIcon
|
|
|
7494
7366
|
leftIcon && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "flex-shrink-0 [&>svg]:size-4", children: leftIcon }),
|
|
7495
7367
|
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { children })
|
|
7496
7368
|
] }),
|
|
7497
|
-
showCaret && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "caret-icon flex-shrink-0 transition-transform duration-500 ease-[cubic-bezier(0.4,0,0.2,1)]", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
|
|
7369
|
+
showCaret && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "caret-icon flex-shrink-0 transition-transform duration-500 ease-[cubic-bezier(0.4,0,0.2,1)]", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_react29.CaretUpDownIcon, { className: "h-4 w-4" }) })
|
|
7498
7370
|
]
|
|
7499
7371
|
}
|
|
7500
7372
|
);
|
|
@@ -7518,8 +7390,8 @@ var CollapsibleContentBase = React25.forwardRef(({ className, children, ...props
|
|
|
7518
7390
|
CollapsibleContentBase.displayName = CollapsiblePrimitive.CollapsibleContent.displayName;
|
|
7519
7391
|
|
|
7520
7392
|
// src/components/ui/form/DebounceInput.tsx
|
|
7521
|
-
var
|
|
7522
|
-
var
|
|
7393
|
+
var import_react30 = require("react");
|
|
7394
|
+
var import_react31 = require("@phosphor-icons/react");
|
|
7523
7395
|
var import_jsx_runtime45 = require("react/jsx-runtime");
|
|
7524
7396
|
|
|
7525
7397
|
// src/components/ui/form/HoverCardBase.tsx
|
|
@@ -7561,7 +7433,7 @@ function HoverCardContentBase({
|
|
|
7561
7433
|
// src/components/ui/form/Input-OTP-Base.tsx
|
|
7562
7434
|
var React26 = __toESM(require("react"));
|
|
7563
7435
|
var import_input_otp = require("input-otp");
|
|
7564
|
-
var
|
|
7436
|
+
var import_react32 = require("@phosphor-icons/react");
|
|
7565
7437
|
var import_jsx_runtime47 = require("react/jsx-runtime");
|
|
7566
7438
|
function InputOTPBase({
|
|
7567
7439
|
className,
|
|
@@ -7616,7 +7488,7 @@ function InputOTPSlotBase({
|
|
|
7616
7488
|
);
|
|
7617
7489
|
}
|
|
7618
7490
|
function InputOTPSeparatorBase({ ...props }) {
|
|
7619
|
-
return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { "data-slot": "input-otp-separator", role: "separator", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
7491
|
+
return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { "data-slot": "input-otp-separator", role: "separator", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_react32.MinusIcon, {}) });
|
|
7620
7492
|
}
|
|
7621
7493
|
|
|
7622
7494
|
// src/components/ui/form/SliderBase.tsx
|
|
@@ -7704,7 +7576,7 @@ SlideBase.displayName = "SlideBase";
|
|
|
7704
7576
|
|
|
7705
7577
|
// src/components/ui/form/SmallButtons.tsx
|
|
7706
7578
|
var React28 = __toESM(require("react"));
|
|
7707
|
-
var
|
|
7579
|
+
var import_react33 = require("@phosphor-icons/react");
|
|
7708
7580
|
var import_jsx_runtime49 = require("react/jsx-runtime");
|
|
7709
7581
|
var EditButton = React28.forwardRef(
|
|
7710
7582
|
({
|
|
@@ -7735,7 +7607,7 @@ var EditButton = React28.forwardRef(
|
|
|
7735
7607
|
),
|
|
7736
7608
|
...props,
|
|
7737
7609
|
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
7738
|
-
|
|
7610
|
+
import_react33.PencilSimpleIcon,
|
|
7739
7611
|
{
|
|
7740
7612
|
size: iconSize,
|
|
7741
7613
|
color: iconColor,
|
|
@@ -7775,7 +7647,7 @@ var ChangeButton = React28.forwardRef(
|
|
|
7775
7647
|
),
|
|
7776
7648
|
...props,
|
|
7777
7649
|
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
7778
|
-
|
|
7650
|
+
import_react33.ArrowsLeftRightIcon,
|
|
7779
7651
|
{
|
|
7780
7652
|
size: iconSize,
|
|
7781
7653
|
color: iconColor,
|
|
@@ -7815,7 +7687,7 @@ var SaveButton = React28.forwardRef(
|
|
|
7815
7687
|
),
|
|
7816
7688
|
...props,
|
|
7817
7689
|
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
7818
|
-
|
|
7690
|
+
import_react33.FloppyDiskIcon,
|
|
7819
7691
|
{
|
|
7820
7692
|
size: iconSize,
|
|
7821
7693
|
color: iconColor,
|
|
@@ -7855,7 +7727,7 @@ var AddButton = React28.forwardRef(
|
|
|
7855
7727
|
),
|
|
7856
7728
|
...props,
|
|
7857
7729
|
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
7858
|
-
|
|
7730
|
+
import_react33.PlusIcon,
|
|
7859
7731
|
{
|
|
7860
7732
|
size: iconSize,
|
|
7861
7733
|
color: iconColor,
|
|
@@ -7895,7 +7767,7 @@ var CloseButton = React28.forwardRef(
|
|
|
7895
7767
|
),
|
|
7896
7768
|
...props,
|
|
7897
7769
|
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
7898
|
-
|
|
7770
|
+
import_react33.XIcon,
|
|
7899
7771
|
{
|
|
7900
7772
|
size: iconSize,
|
|
7901
7773
|
color: iconColor,
|
|
@@ -7927,7 +7799,7 @@ var DownloadButton = ({
|
|
|
7927
7799
|
),
|
|
7928
7800
|
...props,
|
|
7929
7801
|
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
7930
|
-
|
|
7802
|
+
import_react33.DownloadSimpleIcon,
|
|
7931
7803
|
{
|
|
7932
7804
|
size: 18,
|
|
7933
7805
|
className: "transition-transform duration-300 group-hover:translate-y-0.5"
|
|
@@ -7956,7 +7828,7 @@ var UploadButton = ({
|
|
|
7956
7828
|
),
|
|
7957
7829
|
...props,
|
|
7958
7830
|
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
7959
|
-
|
|
7831
|
+
import_react33.UploadSimpleIcon,
|
|
7960
7832
|
{
|
|
7961
7833
|
size: 18,
|
|
7962
7834
|
className: "transition-transform duration-300 group-hover:-translate-y-0.5"
|
|
@@ -7985,7 +7857,7 @@ var CopyButton = ({
|
|
|
7985
7857
|
),
|
|
7986
7858
|
...props,
|
|
7987
7859
|
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
7988
|
-
|
|
7860
|
+
import_react33.CopyIcon,
|
|
7989
7861
|
{
|
|
7990
7862
|
size: 18,
|
|
7991
7863
|
className: "transition-transform duration-200 group-hover:scale-110"
|
|
@@ -8014,7 +7886,7 @@ var RefreshButton = ({
|
|
|
8014
7886
|
),
|
|
8015
7887
|
...props,
|
|
8016
7888
|
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
8017
|
-
|
|
7889
|
+
import_react33.ArrowClockwiseIcon,
|
|
8018
7890
|
{
|
|
8019
7891
|
size: 18,
|
|
8020
7892
|
className: "transition-transform duration-500 group-hover:rotate-180"
|
|
@@ -8043,7 +7915,7 @@ var SearchButton = ({
|
|
|
8043
7915
|
),
|
|
8044
7916
|
...props,
|
|
8045
7917
|
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
8046
|
-
|
|
7918
|
+
import_react33.MagnifyingGlassIcon,
|
|
8047
7919
|
{
|
|
8048
7920
|
size: 18,
|
|
8049
7921
|
className: "transition-transform duration-200 group-hover:scale-110 group-hover:-rotate-12"
|
|
@@ -8072,7 +7944,7 @@ var BackButton = ({
|
|
|
8072
7944
|
),
|
|
8073
7945
|
...props,
|
|
8074
7946
|
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
8075
|
-
|
|
7947
|
+
import_react33.ArrowLeftIcon,
|
|
8076
7948
|
{
|
|
8077
7949
|
size: 18,
|
|
8078
7950
|
className: "transition-transform duration-300 group-hover:-translate-x-1"
|
|
@@ -8101,7 +7973,7 @@ var SettingsButton = ({
|
|
|
8101
7973
|
),
|
|
8102
7974
|
...props,
|
|
8103
7975
|
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
8104
|
-
|
|
7976
|
+
import_react33.GearIcon,
|
|
8105
7977
|
{
|
|
8106
7978
|
size: 18,
|
|
8107
7979
|
className: "transition-transform duration-500 group-hover:rotate-90"
|
|
@@ -8130,7 +8002,7 @@ var NotificationButton = ({
|
|
|
8130
8002
|
),
|
|
8131
8003
|
...props,
|
|
8132
8004
|
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
8133
|
-
|
|
8005
|
+
import_react33.BellIcon,
|
|
8134
8006
|
{
|
|
8135
8007
|
size: 18,
|
|
8136
8008
|
className: "transition-transform duration-300 group-hover:scale-110 group-hover:-rotate-12"
|
|
@@ -8159,7 +8031,7 @@ var MoreButton = ({
|
|
|
8159
8031
|
),
|
|
8160
8032
|
...props,
|
|
8161
8033
|
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
8162
|
-
|
|
8034
|
+
import_react33.DotsThreeIcon,
|
|
8163
8035
|
{
|
|
8164
8036
|
size: 18,
|
|
8165
8037
|
className: "transition-transform duration-200 group-hover:scale-110"
|
|
@@ -8188,7 +8060,7 @@ var CheckButton = ({
|
|
|
8188
8060
|
),
|
|
8189
8061
|
...props,
|
|
8190
8062
|
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
8191
|
-
|
|
8063
|
+
import_react33.CheckIcon,
|
|
8192
8064
|
{
|
|
8193
8065
|
size: 18,
|
|
8194
8066
|
className: "transition-transform duration-200 group-hover:scale-110"
|
|
@@ -8224,7 +8096,7 @@ var FilterButton = ({
|
|
|
8224
8096
|
),
|
|
8225
8097
|
...props,
|
|
8226
8098
|
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
8227
|
-
|
|
8099
|
+
import_react33.FunnelIcon,
|
|
8228
8100
|
{
|
|
8229
8101
|
size: iconSize,
|
|
8230
8102
|
color: iconColor,
|
|
@@ -8263,7 +8135,7 @@ var LikeButton = ({
|
|
|
8263
8135
|
),
|
|
8264
8136
|
...props,
|
|
8265
8137
|
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
8266
|
-
|
|
8138
|
+
import_react33.HeartIcon,
|
|
8267
8139
|
{
|
|
8268
8140
|
size: iconSize,
|
|
8269
8141
|
color: iconColor,
|
|
@@ -8302,7 +8174,7 @@ var FavoriteButton = ({
|
|
|
8302
8174
|
),
|
|
8303
8175
|
...props,
|
|
8304
8176
|
children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
8305
|
-
|
|
8177
|
+
import_react33.StarIcon,
|
|
8306
8178
|
{
|
|
8307
8179
|
size: iconSize,
|
|
8308
8180
|
color: iconColor,
|
|
@@ -8340,14 +8212,14 @@ var VisibilityButton = ({
|
|
|
8340
8212
|
),
|
|
8341
8213
|
...props,
|
|
8342
8214
|
children: isVisible ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
8343
|
-
|
|
8215
|
+
import_react33.EyeIcon,
|
|
8344
8216
|
{
|
|
8345
8217
|
size: iconSize,
|
|
8346
8218
|
color: iconColor,
|
|
8347
8219
|
className: "transition-opacity duration-200"
|
|
8348
8220
|
}
|
|
8349
8221
|
) : /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
8350
|
-
|
|
8222
|
+
import_react33.EyeSlashIcon,
|
|
8351
8223
|
{
|
|
8352
8224
|
size: iconSize,
|
|
8353
8225
|
color: iconColor,
|
|
@@ -8387,14 +8259,14 @@ var LockButton = ({
|
|
|
8387
8259
|
),
|
|
8388
8260
|
...props,
|
|
8389
8261
|
children: isLocked ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
8390
|
-
|
|
8262
|
+
import_react33.LockIcon,
|
|
8391
8263
|
{
|
|
8392
8264
|
size: iconSize,
|
|
8393
8265
|
color: iconColor,
|
|
8394
8266
|
className: "transition-all duration-200 group-hover:scale-110"
|
|
8395
8267
|
}
|
|
8396
8268
|
) : /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
8397
|
-
|
|
8269
|
+
import_react33.LockOpenIcon,
|
|
8398
8270
|
{
|
|
8399
8271
|
size: iconSize,
|
|
8400
8272
|
color: iconColor,
|
|
@@ -8440,7 +8312,7 @@ SwitchBase.displayName = SwitchPrimitives.Root.displayName;
|
|
|
8440
8312
|
// src/components/ui/form/TextAreaBase.tsx
|
|
8441
8313
|
var React30 = __toESM(require("react"));
|
|
8442
8314
|
var import_framer_motion12 = require("framer-motion");
|
|
8443
|
-
var
|
|
8315
|
+
var import_react34 = require("@phosphor-icons/react");
|
|
8444
8316
|
var import_jsx_runtime51 = require("react/jsx-runtime");
|
|
8445
8317
|
var TextAreaBase = React30.forwardRef(
|
|
8446
8318
|
({ className, clearable = false, onClear, ...props }, ref) => {
|
|
@@ -8537,7 +8409,7 @@ var TextAreaBase = React30.forwardRef(
|
|
|
8537
8409
|
),
|
|
8538
8410
|
disabled: props.disabled,
|
|
8539
8411
|
"aria-label": "Limpar texto",
|
|
8540
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
8412
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_react34.TrashIcon, { size: 16, weight: "regular" })
|
|
8541
8413
|
}
|
|
8542
8414
|
) }),
|
|
8543
8415
|
/* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
|
|
@@ -8615,7 +8487,7 @@ TextAreaBase.displayName = "TextAreaBase";
|
|
|
8615
8487
|
// src/components/ui/layout/CarouselBase.tsx
|
|
8616
8488
|
var React31 = __toESM(require("react"));
|
|
8617
8489
|
var import_embla_carousel_react = __toESM(require("embla-carousel-react"));
|
|
8618
|
-
var
|
|
8490
|
+
var import_react35 = require("@phosphor-icons/react");
|
|
8619
8491
|
var import_jsx_runtime52 = require("react/jsx-runtime");
|
|
8620
8492
|
var CarouselContext = React31.createContext(null);
|
|
8621
8493
|
function useCarousel() {
|
|
@@ -8774,7 +8646,7 @@ function CarouselPrevious({
|
|
|
8774
8646
|
onClick: scrollPrev,
|
|
8775
8647
|
...props,
|
|
8776
8648
|
children: [
|
|
8777
|
-
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
|
|
8649
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_react35.ArrowLeftIcon, {}),
|
|
8778
8650
|
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "sr-only", children: "Previous slide" })
|
|
8779
8651
|
]
|
|
8780
8652
|
}
|
|
@@ -8802,7 +8674,7 @@ function CarouselNextBase({
|
|
|
8802
8674
|
onClick: scrollNext,
|
|
8803
8675
|
...props,
|
|
8804
8676
|
children: [
|
|
8805
|
-
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
|
|
8677
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_react35.ArrowRightIcon, {}),
|
|
8806
8678
|
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "sr-only", children: "Next slide" })
|
|
8807
8679
|
]
|
|
8808
8680
|
}
|
|
@@ -8982,7 +8854,7 @@ TabsContentBase.displayName = TabsPrimitive.Content.displayName;
|
|
|
8982
8854
|
|
|
8983
8855
|
// src/components/ui/navigation/BreadcrumbBase.tsx
|
|
8984
8856
|
var import_react_slot4 = require("@radix-ui/react-slot");
|
|
8985
|
-
var
|
|
8857
|
+
var import_react36 = require("@phosphor-icons/react");
|
|
8986
8858
|
var import_jsx_runtime56 = require("react/jsx-runtime");
|
|
8987
8859
|
function BreadcrumbBase({ ...props }) {
|
|
8988
8860
|
return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("nav", { "aria-label": "breadcrumb", "data-slot": "breadcrumb", ...props });
|
|
@@ -9051,7 +8923,7 @@ function BreadcrumbSeparatorBase({
|
|
|
9051
8923
|
"aria-hidden": "true",
|
|
9052
8924
|
className: cn("[&>svg]:size-3.5", className),
|
|
9053
8925
|
...props,
|
|
9054
|
-
children: children ?? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
|
|
8926
|
+
children: children ?? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_react36.CaretRightIcon, {})
|
|
9055
8927
|
}
|
|
9056
8928
|
);
|
|
9057
8929
|
}
|
|
@@ -9068,7 +8940,7 @@ function BreadcrumbEllipsisBase({
|
|
|
9068
8940
|
className: cn("flex size-9 items-center justify-center", className),
|
|
9069
8941
|
...props,
|
|
9070
8942
|
children: [
|
|
9071
|
-
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
|
|
8943
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_react36.DotsThreeIcon, { className: "size-4" }),
|
|
9072
8944
|
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "sr-only", children: "More" })
|
|
9073
8945
|
]
|
|
9074
8946
|
}
|
|
@@ -9077,7 +8949,7 @@ function BreadcrumbEllipsisBase({
|
|
|
9077
8949
|
|
|
9078
8950
|
// src/components/ui/navigation/NavigationMenuBase.tsx
|
|
9079
8951
|
var NavigationMenuPrimitive = __toESM(require("@radix-ui/react-navigation-menu"));
|
|
9080
|
-
var
|
|
8952
|
+
var import_react37 = require("@phosphor-icons/react");
|
|
9081
8953
|
var import_jsx_runtime57 = require("react/jsx-runtime");
|
|
9082
8954
|
function NavigationMenuBase({
|
|
9083
8955
|
className,
|
|
@@ -9145,7 +9017,7 @@ function NavigationMenuTriggerBase({
|
|
|
9145
9017
|
children: [
|
|
9146
9018
|
children,
|
|
9147
9019
|
/* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
|
|
9148
|
-
|
|
9020
|
+
import_react37.CaretDownIcon,
|
|
9149
9021
|
{
|
|
9150
9022
|
className: "relative top-[1px] ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180",
|
|
9151
9023
|
"aria-hidden": "true"
|
|
@@ -9248,7 +9120,7 @@ function useIsMobile() {
|
|
|
9248
9120
|
var React36 = __toESM(require("react"));
|
|
9249
9121
|
var SheetPrimitive = __toESM(require("@radix-ui/react-dialog"));
|
|
9250
9122
|
var import_class_variance_authority4 = require("class-variance-authority");
|
|
9251
|
-
var
|
|
9123
|
+
var import_react38 = require("@phosphor-icons/react");
|
|
9252
9124
|
var import_jsx_runtime58 = require("react/jsx-runtime");
|
|
9253
9125
|
var SheetBase = SheetPrimitive.Root;
|
|
9254
9126
|
var SheetTriggerBase = SheetPrimitive.Trigger;
|
|
@@ -9292,7 +9164,7 @@ var SheetContentBase = React36.forwardRef(({ side = "right", className, children
|
|
|
9292
9164
|
...props,
|
|
9293
9165
|
children: [
|
|
9294
9166
|
/* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(SheetPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary", children: [
|
|
9295
|
-
/* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
|
|
9167
|
+
/* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_react38.XIcon, { className: "h-4 w-4" }),
|
|
9296
9168
|
/* @__PURE__ */ (0, import_jsx_runtime58.jsx)("span", { className: "sr-only", children: "Close" })
|
|
9297
9169
|
] }),
|
|
9298
9170
|
children
|
|
@@ -9349,7 +9221,7 @@ var SheetDescriptionBase = React36.forwardRef(({ className, ...props }, ref) =>
|
|
|
9349
9221
|
SheetDescriptionBase.displayName = SheetPrimitive.Description.displayName;
|
|
9350
9222
|
|
|
9351
9223
|
// src/components/ui/navigation/SidebarBase.tsx
|
|
9352
|
-
var
|
|
9224
|
+
var import_react39 = require("@phosphor-icons/react");
|
|
9353
9225
|
var import_jsx_runtime59 = require("react/jsx-runtime");
|
|
9354
9226
|
var SIDEBAR_COOKIE_NAME = "sidebar:state";
|
|
9355
9227
|
var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
|
|
@@ -9543,7 +9415,7 @@ var SidebarTriggerBase = React37.forwardRef(({ className, onClick, ...props }, r
|
|
|
9543
9415
|
...props,
|
|
9544
9416
|
children: [
|
|
9545
9417
|
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "sr-only", children: "Toggle SidebarBase" }),
|
|
9546
|
-
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
|
|
9418
|
+
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_react39.SidebarSimpleIcon, {})
|
|
9547
9419
|
]
|
|
9548
9420
|
}
|
|
9549
9421
|
) });
|
|
@@ -10037,11 +9909,11 @@ function DrawerDescriptionBase({
|
|
|
10037
9909
|
}
|
|
10038
9910
|
|
|
10039
9911
|
// src/hooks/use-universal-tooltip.tsx
|
|
10040
|
-
var
|
|
9912
|
+
var import_react40 = require("react");
|
|
10041
9913
|
var import_jsx_runtime61 = require("react/jsx-runtime");
|
|
10042
|
-
var UniversalTooltipContext = (0,
|
|
9914
|
+
var UniversalTooltipContext = (0, import_react40.createContext)(null);
|
|
10043
9915
|
var useUniversalTooltip = () => {
|
|
10044
|
-
const context = (0,
|
|
9916
|
+
const context = (0, import_react40.useContext)(UniversalTooltipContext);
|
|
10045
9917
|
if (!context) {
|
|
10046
9918
|
throw new Error("useUniversalTooltip deve ser usado dentro de UniversalTooltipProvider");
|
|
10047
9919
|
}
|
|
@@ -10049,7 +9921,7 @@ var useUniversalTooltip = () => {
|
|
|
10049
9921
|
};
|
|
10050
9922
|
var useTooltip = () => {
|
|
10051
9923
|
const { addTooltip, removeTooltip, startDrag } = useUniversalTooltip();
|
|
10052
|
-
const createTooltip = (0,
|
|
9924
|
+
const createTooltip = (0, import_react40.useCallback)((element, content, options) => {
|
|
10053
9925
|
const rect = element.getBoundingClientRect();
|
|
10054
9926
|
let position;
|
|
10055
9927
|
switch (options?.position || "auto") {
|
|
@@ -10079,7 +9951,7 @@ var useTooltip = () => {
|
|
|
10079
9951
|
metadata: options?.metadata
|
|
10080
9952
|
});
|
|
10081
9953
|
}, [addTooltip]);
|
|
10082
|
-
const handleElementMouseDown = (0,
|
|
9954
|
+
const handleElementMouseDown = (0, import_react40.useCallback)((tooltipId, event) => {
|
|
10083
9955
|
const rect = event.target.getBoundingClientRect();
|
|
10084
9956
|
const offset = {
|
|
10085
9957
|
x: event.clientX - rect.left,
|
|
@@ -10238,7 +10110,7 @@ var import_date_fns = require("date-fns");
|
|
|
10238
10110
|
// src/components/picker/calendar.tsx
|
|
10239
10111
|
var React39 = __toESM(require("react"));
|
|
10240
10112
|
var import_react_day_picker2 = require("react-day-picker");
|
|
10241
|
-
var
|
|
10113
|
+
var import_react41 = require("@phosphor-icons/react");
|
|
10242
10114
|
var import_framer_motion14 = require("framer-motion");
|
|
10243
10115
|
var import_jsx_runtime63 = require("react/jsx-runtime");
|
|
10244
10116
|
function CalendarBase2({
|
|
@@ -10261,7 +10133,7 @@ function CalendarBase2({
|
|
|
10261
10133
|
"div",
|
|
10262
10134
|
{
|
|
10263
10135
|
className: cn(
|
|
10264
|
-
"rounded-md border bg-background p-2 overflow-hidden flex flex-col",
|
|
10136
|
+
"rounded-md border bg-background p-2 sm:p-3 md:p-4 overflow-hidden flex flex-col",
|
|
10265
10137
|
className
|
|
10266
10138
|
),
|
|
10267
10139
|
children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "relative flex-1 flex flex-col min-h-0", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_framer_motion14.AnimatePresence, { initial: false, mode: "wait", custom: direction, children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
|
|
@@ -10274,51 +10146,46 @@ function CalendarBase2({
|
|
|
10274
10146
|
showOutsideDays,
|
|
10275
10147
|
month,
|
|
10276
10148
|
onMonthChange: handleMonthChange,
|
|
10277
|
-
className: "w-full h-full
|
|
10149
|
+
className: "w-full h-full flex flex-col",
|
|
10278
10150
|
classNames: {
|
|
10279
|
-
months: "flex
|
|
10280
|
-
month: "
|
|
10281
|
-
caption: "flex
|
|
10282
|
-
caption_label: "text-[clamp(0.
|
|
10283
|
-
nav: "
|
|
10151
|
+
months: "flex flex-col sm:flex-row gap-3 sm:gap-4 w-full",
|
|
10152
|
+
month: "flex-1 min-w-0",
|
|
10153
|
+
caption: "flex items-center justify-between gap-2 pr-1 min-h-[2.25rem] mb-2",
|
|
10154
|
+
caption_label: "text-[clamp(0.85rem,1.4vw,1.125rem)] sm:text-[clamp(0.9rem,1.6vw,1.125rem)] font-semibold capitalize text-left",
|
|
10155
|
+
nav: "flex items-center gap-2",
|
|
10284
10156
|
nav_button: cn(
|
|
10285
10157
|
buttonVariantsBase({ variant: "outline" }),
|
|
10286
|
-
"h-8 w-8
|
|
10287
|
-
"[@media(min-width:400px)]:h-9 [@media(min-width:400px)]:w-9"
|
|
10158
|
+
"h-8 w-8 sm:h-9 sm:w-9 md:h-10 md:w-10 flex items-center justify-center p-0 rounded-md transition-transform duration-150 ease-out focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary/40 active:scale-95"
|
|
10288
10159
|
),
|
|
10289
|
-
nav_button_previous: "
|
|
10290
|
-
nav_button_next: "
|
|
10291
|
-
table: "w-full
|
|
10292
|
-
head_row: "
|
|
10293
|
-
head_cell: "text-muted-foreground rounded-md
|
|
10294
|
-
row: "
|
|
10160
|
+
nav_button_previous: "",
|
|
10161
|
+
nav_button_next: "",
|
|
10162
|
+
table: "w-full min-w-0 flex-1 grid grid-rows-[auto_1fr] gap-2",
|
|
10163
|
+
head_row: "grid grid-cols-7 gap-1 mb-1",
|
|
10164
|
+
head_cell: "text-muted-foreground rounded-md font-semibold text-[clamp(0.575rem,1.2vw,0.75rem)] sm:text-[clamp(0.65rem,1.1vw,0.825rem)] text-center pb-1 uppercase tracking-wider",
|
|
10165
|
+
row: "grid grid-cols-7 gap-1",
|
|
10295
10166
|
cell: cn(
|
|
10296
|
-
"
|
|
10167
|
+
"min-w-0 h-9 sm:h-10 md:h-10 p-0 relative flex items-center justify-center",
|
|
10297
10168
|
"[&:has([aria-selected].day-range-end)]:rounded-r-lg",
|
|
10298
10169
|
"[&:has([aria-selected].day-range-start)]:rounded-l-lg",
|
|
10299
10170
|
"[&:has([aria-selected].day-outside)]:bg-muted/50",
|
|
10300
|
-
"[&:has([aria-selected])]:bg-muted"
|
|
10301
|
-
"first:[&:has([aria-selected])]:rounded-l-lg",
|
|
10302
|
-
"last:[&:has([aria-selected])]:rounded-r-lg",
|
|
10303
|
-
"focus-within:relative focus-within:z-20"
|
|
10171
|
+
"[&:has([aria-selected])]:bg-muted"
|
|
10304
10172
|
),
|
|
10305
10173
|
day: cn(
|
|
10306
10174
|
buttonVariantsBase({ variant: "ghost" }),
|
|
10307
|
-
"w-full h-full p-0",
|
|
10308
|
-
"aria-selected:opacity-100 hover:bg-muted
|
|
10309
|
-
" transition-all duration-200 ease-out hover:scale-105 active:scale-95"
|
|
10175
|
+
"w-full h-full p-0 m-0 flex items-center justify-center text-[clamp(0.775rem,1.2vw,0.95rem)] sm:text-sm",
|
|
10176
|
+
"aria-selected:opacity-100 hover:bg-muted transition-all duration-150 ease-out active:scale-95"
|
|
10310
10177
|
),
|
|
10311
10178
|
day_selected: "bg-primary text-primary-foreground hover:bg-primary/90 focus:bg-primary/90 font-semibold hover:text-white",
|
|
10312
10179
|
day_today: "bg-muted text-foreground font-bold ring-2 ring-primary/30 ring-inset",
|
|
10313
|
-
day_outside: "
|
|
10180
|
+
day_outside: "text-muted-foreground/40 opacity-60 aria-selected:bg-muted/50 aria-selected:text-foreground",
|
|
10314
10181
|
day_disabled: "text-muted-foreground/30 opacity-40 cursor-not-allowed",
|
|
10315
10182
|
day_range_middle: "aria-selected:bg-muted aria-selected:text-foreground",
|
|
10316
10183
|
day_hidden: "invisible",
|
|
10317
10184
|
...classNames
|
|
10318
10185
|
},
|
|
10319
10186
|
components: {
|
|
10320
|
-
IconLeft: () => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
|
|
10321
|
-
IconRight: () => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
|
|
10187
|
+
IconLeft: () => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react41.CaretLeftIcon, { className: "h-4 w-4" }),
|
|
10188
|
+
IconRight: () => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react41.CaretRightIcon, { className: "h-4 w-4" })
|
|
10322
10189
|
},
|
|
10323
10190
|
...props
|
|
10324
10191
|
}
|
|
@@ -10333,15 +10200,15 @@ CalendarBase2.displayName = "CalendarBase";
|
|
|
10333
10200
|
|
|
10334
10201
|
// src/components/picker/DateTimePicker.tsx
|
|
10335
10202
|
var import_locale = require("date-fns/locale");
|
|
10336
|
-
var
|
|
10203
|
+
var import_react44 = require("react");
|
|
10337
10204
|
|
|
10338
10205
|
// src/components/picker/TimePicker.tsx
|
|
10339
10206
|
var import_framer_motion15 = require("framer-motion");
|
|
10340
10207
|
var React41 = __toESM(require("react"));
|
|
10341
10208
|
|
|
10342
10209
|
// src/components/picker/TimePickerInput.tsx
|
|
10343
|
-
var
|
|
10344
|
-
var
|
|
10210
|
+
var import_react42 = require("@phosphor-icons/react");
|
|
10211
|
+
var import_react43 = __toESM(require("react"));
|
|
10345
10212
|
|
|
10346
10213
|
// src/components/picker/utils/time-picker-utils.ts
|
|
10347
10214
|
function isValidHour(value) {
|
|
@@ -10484,7 +10351,7 @@ function display12HourValue(hours) {
|
|
|
10484
10351
|
|
|
10485
10352
|
// src/components/picker/TimePickerInput.tsx
|
|
10486
10353
|
var import_jsx_runtime64 = require("react/jsx-runtime");
|
|
10487
|
-
var TimePickerInput =
|
|
10354
|
+
var TimePickerInput = import_react43.default.forwardRef(
|
|
10488
10355
|
({
|
|
10489
10356
|
className,
|
|
10490
10357
|
type = "tel",
|
|
@@ -10503,10 +10370,10 @@ var TimePickerInput = import_react42.default.forwardRef(
|
|
|
10503
10370
|
label,
|
|
10504
10371
|
...props
|
|
10505
10372
|
}, ref) => {
|
|
10506
|
-
const [flag, setFlag] =
|
|
10507
|
-
const [prevIntKey, setPrevIntKey] =
|
|
10508
|
-
const [isFocused, setIsFocused] =
|
|
10509
|
-
|
|
10373
|
+
const [flag, setFlag] = import_react43.default.useState(false);
|
|
10374
|
+
const [prevIntKey, setPrevIntKey] = import_react43.default.useState("0");
|
|
10375
|
+
const [isFocused, setIsFocused] = import_react43.default.useState(false);
|
|
10376
|
+
import_react43.default.useEffect(() => {
|
|
10510
10377
|
if (flag) {
|
|
10511
10378
|
const timer = setTimeout(() => {
|
|
10512
10379
|
setFlag(false);
|
|
@@ -10514,7 +10381,7 @@ var TimePickerInput = import_react42.default.forwardRef(
|
|
|
10514
10381
|
return () => clearTimeout(timer);
|
|
10515
10382
|
}
|
|
10516
10383
|
}, [flag]);
|
|
10517
|
-
const calculatedValue =
|
|
10384
|
+
const calculatedValue = import_react43.default.useMemo(() => {
|
|
10518
10385
|
return getDateByType(date, picker);
|
|
10519
10386
|
}, [date, picker]);
|
|
10520
10387
|
const calculateNewValue = (key) => {
|
|
@@ -10603,7 +10470,7 @@ var TimePickerInput = import_react42.default.forwardRef(
|
|
|
10603
10470
|
),
|
|
10604
10471
|
tabIndex: -1,
|
|
10605
10472
|
"aria-label": `Incrementar ${getPickerLabel().toLowerCase()}`,
|
|
10606
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
|
|
10473
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_react42.CaretUpIcon, { size: 14, className: "sm:w-4 sm:h-4" })
|
|
10607
10474
|
}
|
|
10608
10475
|
),
|
|
10609
10476
|
/* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: "relative", children: [
|
|
@@ -10670,7 +10537,7 @@ var TimePickerInput = import_react42.default.forwardRef(
|
|
|
10670
10537
|
),
|
|
10671
10538
|
tabIndex: -1,
|
|
10672
10539
|
"aria-label": `Decrementar ${getPickerLabel().toLowerCase()}`,
|
|
10673
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
|
|
10540
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_react42.CaretDownIcon, { size: 14, className: "sm:w-4 sm:h-4" })
|
|
10674
10541
|
}
|
|
10675
10542
|
)
|
|
10676
10543
|
]
|
|
@@ -10779,7 +10646,7 @@ function TimePicker({
|
|
|
10779
10646
|
}
|
|
10780
10647
|
|
|
10781
10648
|
// src/components/picker/DateTimePicker.tsx
|
|
10782
|
-
var
|
|
10649
|
+
var import_react45 = require("@phosphor-icons/react");
|
|
10783
10650
|
var import_jsx_runtime66 = require("react/jsx-runtime");
|
|
10784
10651
|
function DateTimePicker({
|
|
10785
10652
|
label,
|
|
@@ -10788,17 +10655,15 @@ function DateTimePicker({
|
|
|
10788
10655
|
displayFormat,
|
|
10789
10656
|
hideTime,
|
|
10790
10657
|
hideSeconds,
|
|
10791
|
-
hideHour,
|
|
10792
|
-
hideMinute,
|
|
10793
10658
|
fromDate,
|
|
10794
10659
|
toDate,
|
|
10795
10660
|
disabled,
|
|
10796
10661
|
className,
|
|
10797
10662
|
error
|
|
10798
10663
|
}) {
|
|
10799
|
-
const [internalDate, setInternalDate] = (0,
|
|
10800
|
-
const [open, setOpen] = (0,
|
|
10801
|
-
const [timePickerOpen, setTimePickerOpen] = (0,
|
|
10664
|
+
const [internalDate, setInternalDate] = (0, import_react44.useState)(date);
|
|
10665
|
+
const [open, setOpen] = (0, import_react44.useState)(false);
|
|
10666
|
+
const [timePickerOpen, setTimePickerOpen] = (0, import_react44.useState)(false);
|
|
10802
10667
|
const handleSelect = (newDay) => {
|
|
10803
10668
|
if (!newDay) return;
|
|
10804
10669
|
if (!internalDate) {
|
|
@@ -10818,20 +10683,18 @@ function DateTimePicker({
|
|
|
10818
10683
|
};
|
|
10819
10684
|
const getTimeFormat = () => {
|
|
10820
10685
|
if (hideTime) return "";
|
|
10821
|
-
if (hideHour && hideMinute) return "";
|
|
10822
|
-
if (hideHour) return hideSeconds ? "mm" : "mm:ss";
|
|
10823
|
-
if (hideMinute) return hideSeconds ? "HH" : "HH':00'";
|
|
10824
10686
|
return hideSeconds ? "HH:mm" : "HH:mm:ss";
|
|
10825
10687
|
};
|
|
10826
10688
|
const getDisplayFormat = () => {
|
|
10827
|
-
if (displayFormat) {
|
|
10828
|
-
return displayFormat;
|
|
10829
|
-
}
|
|
10830
10689
|
const timeFormat = getTimeFormat();
|
|
10831
|
-
if (
|
|
10832
|
-
|
|
10690
|
+
if (displayFormat === true) {
|
|
10691
|
+
if (!timeFormat) return "dd/MM/yyyy";
|
|
10692
|
+
return `dd/MM/yyyy ${timeFormat}`;
|
|
10693
|
+
}
|
|
10694
|
+
if (!timeFormat) return "dd MMMM yyyy";
|
|
10695
|
+
return `dd MMMM yyyy ${timeFormat}`;
|
|
10833
10696
|
};
|
|
10834
|
-
(0,
|
|
10697
|
+
(0, import_react44.useEffect)(() => {
|
|
10835
10698
|
if (date) {
|
|
10836
10699
|
setInternalDate(date);
|
|
10837
10700
|
}
|
|
@@ -10839,20 +10702,37 @@ function DateTimePicker({
|
|
|
10839
10702
|
return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: cn("space-y-2 w-full sm:w-auto", className), children: [
|
|
10840
10703
|
label && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(LabelBase_default, { children: label }),
|
|
10841
10704
|
/* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(PopoverBase, { open, onOpenChange: setOpen, children: [
|
|
10842
|
-
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
10843
|
-
|
|
10705
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
10706
|
+
PopoverTriggerBase,
|
|
10844
10707
|
{
|
|
10845
|
-
|
|
10846
|
-
|
|
10847
|
-
|
|
10848
|
-
|
|
10849
|
-
|
|
10850
|
-
|
|
10851
|
-
|
|
10852
|
-
|
|
10853
|
-
|
|
10708
|
+
disabled,
|
|
10709
|
+
asChild: true,
|
|
10710
|
+
className: cn(error && "border-red-500"),
|
|
10711
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
|
|
10712
|
+
ButtonBase,
|
|
10713
|
+
{
|
|
10714
|
+
variant: "outline",
|
|
10715
|
+
className: cn(
|
|
10716
|
+
"w-full justify-start text-left min-w-0 overflow-hidden ",
|
|
10717
|
+
!date && "text-muted-foreground"
|
|
10718
|
+
),
|
|
10719
|
+
children: [
|
|
10720
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
10721
|
+
"span",
|
|
10722
|
+
{
|
|
10723
|
+
className: cn(
|
|
10724
|
+
"truncate flex-1",
|
|
10725
|
+
!date && "text-muted-foreground"
|
|
10726
|
+
),
|
|
10727
|
+
children: date ? (0, import_date_fns.format)(date, getDisplayFormat(), { locale: import_locale.ptBR }) : "Selecione uma data"
|
|
10728
|
+
}
|
|
10729
|
+
),
|
|
10730
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_react45.CalendarBlankIcon, { className: "flex-shrink-0 w-5 h-5 sm:w-6 sm:h-6" })
|
|
10731
|
+
]
|
|
10732
|
+
}
|
|
10733
|
+
)
|
|
10854
10734
|
}
|
|
10855
|
-
)
|
|
10735
|
+
),
|
|
10856
10736
|
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(ErrorMessage_default, { error }),
|
|
10857
10737
|
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
10858
10738
|
PopoverContentBase,
|
|
@@ -10872,15 +10752,13 @@ function DateTimePicker({
|
|
|
10872
10752
|
selected: internalDate,
|
|
10873
10753
|
onSelect: (d) => handleSelect(d),
|
|
10874
10754
|
initialFocus: true,
|
|
10755
|
+
defaultMonth: fromDate ?? toDate ?? internalDate,
|
|
10875
10756
|
fromDate,
|
|
10876
10757
|
toDate,
|
|
10877
|
-
className: cn(
|
|
10878
|
-
"w-full",
|
|
10879
|
-
(hideTime || hideHour && hideMinute) && "border-0"
|
|
10880
|
-
)
|
|
10758
|
+
className: cn("w-full", hideTime && "border-0")
|
|
10881
10759
|
}
|
|
10882
10760
|
),
|
|
10883
|
-
!hideTime &&
|
|
10761
|
+
!hideTime && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "flex justify-center w-full px-2", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
|
|
10884
10762
|
PopoverBase,
|
|
10885
10763
|
{
|
|
10886
10764
|
open: timePickerOpen,
|
|
@@ -10902,7 +10780,7 @@ function DateTimePicker({
|
|
|
10902
10780
|
"min-h-[36px] sm:min-h-[40px]"
|
|
10903
10781
|
),
|
|
10904
10782
|
children: [
|
|
10905
|
-
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
10783
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_react45.ClockIcon, { className: "text-primary flex-shrink-0 w-4 h-4 sm:w-5 sm:h-5" }),
|
|
10906
10784
|
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("span", { className: "text-black truncate", children: internalDate ? (0, import_date_fns.format)(internalDate, getTimeFormat() || "HH:mm", {
|
|
10907
10785
|
locale: import_locale.ptBR
|
|
10908
10786
|
}) : "00:00" })
|
|
@@ -10954,10 +10832,13 @@ function DateTimePicker({
|
|
|
10954
10832
|
// src/components/picker/RangePicker.tsx
|
|
10955
10833
|
var React42 = __toESM(require("react"));
|
|
10956
10834
|
var import_react_day_picker3 = require("react-day-picker");
|
|
10957
|
-
var
|
|
10835
|
+
var import_pt_BR = __toESM(require("date-fns/locale/pt-BR"));
|
|
10836
|
+
var import_date_fns2 = require("date-fns");
|
|
10837
|
+
var import_react46 = require("@phosphor-icons/react");
|
|
10958
10838
|
var import_framer_motion16 = require("framer-motion");
|
|
10959
10839
|
var import_ssr7 = require("@phosphor-icons/react/dist/ssr");
|
|
10960
10840
|
var import_jsx_runtime67 = require("react/jsx-runtime");
|
|
10841
|
+
var dateFnsLocale = import_pt_BR.default?.default ?? import_pt_BR.default;
|
|
10961
10842
|
function RangePicker({
|
|
10962
10843
|
value,
|
|
10963
10844
|
onChange,
|
|
@@ -10999,7 +10880,9 @@ function RangePicker({
|
|
|
10999
10880
|
className: "text-sm font-medium",
|
|
11000
10881
|
transition: { duration: 0.2 },
|
|
11001
10882
|
animate: controls,
|
|
11002
|
-
children: range?.from && range?.to ? `${range.from
|
|
10883
|
+
children: range?.from && range?.to ? `${(0, import_date_fns2.format)(range.from, "P", {
|
|
10884
|
+
locale: dateFnsLocale
|
|
10885
|
+
})} - ${(0, import_date_fns2.format)(range.to, "P", { locale: dateFnsLocale })}` : label
|
|
11003
10886
|
}
|
|
11004
10887
|
),
|
|
11005
10888
|
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
|
|
@@ -11007,7 +10890,7 @@ function RangePicker({
|
|
|
11007
10890
|
{
|
|
11008
10891
|
animate: open ? { rotate: 8, scale: 1.15 } : { rotate: 0, scale: 1 },
|
|
11009
10892
|
transition: { type: "spring", stiffness: 300, damping: 18 },
|
|
11010
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
|
|
10893
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_react46.CalendarBlankIcon, { className: "w-4 h-4 transition-transform group-hover:scale-110" })
|
|
11011
10894
|
}
|
|
11012
10895
|
)
|
|
11013
10896
|
]
|
|
@@ -11043,53 +10926,49 @@ function RangePicker({
|
|
|
11043
10926
|
mode: "range",
|
|
11044
10927
|
selected: range,
|
|
11045
10928
|
onSelect: handleSelect,
|
|
10929
|
+
locale: dateFnsLocale,
|
|
11046
10930
|
showOutsideDays: true,
|
|
11047
10931
|
fromDate: minDate,
|
|
11048
10932
|
toDate: maxDate,
|
|
11049
10933
|
className: "min-w-0 flex flex-col",
|
|
11050
10934
|
classNames: {
|
|
11051
|
-
months: "flex
|
|
11052
|
-
month: "
|
|
11053
|
-
caption: "flex
|
|
11054
|
-
caption_label: "text-[clamp(0.
|
|
11055
|
-
nav: "
|
|
10935
|
+
months: "flex flex-col sm:flex-row gap-3 sm:gap-4 w-full",
|
|
10936
|
+
month: "flex-1 min-w-0",
|
|
10937
|
+
caption: "flex items-center justify-between gap-2 pr-1 min-h-[2.25rem] mb-2",
|
|
10938
|
+
caption_label: "text-[clamp(0.85rem,1.4vw,1.125rem)] sm:text-[clamp(0.9rem,1.6vw,1.125rem)] font-semibold capitalize text-left",
|
|
10939
|
+
nav: "flex items-center gap-2",
|
|
11056
10940
|
nav_button: cn(
|
|
11057
10941
|
buttonVariantsBase({ variant: "outline" }),
|
|
11058
|
-
"h-8 w-8
|
|
11059
|
-
"[@media(min-width:400px)]:h-9 [@media(min-width:400px)]:w-9"
|
|
10942
|
+
"h-8 w-8 sm:h-9 sm:w-9 md:h-10 md:w-10 flex items-center justify-center p-0 rounded-md transition-transform duration-150 ease-out focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary/40 active:scale-95"
|
|
11060
10943
|
),
|
|
11061
|
-
nav_button_previous: "
|
|
11062
|
-
nav_button_next: "
|
|
11063
|
-
table: "w-full
|
|
11064
|
-
head_row: "
|
|
11065
|
-
head_cell: "text-muted-foreground rounded-md
|
|
11066
|
-
row: "
|
|
10944
|
+
nav_button_previous: "",
|
|
10945
|
+
nav_button_next: "",
|
|
10946
|
+
table: "w-full min-w-0 flex-1 grid grid-rows-[auto_1fr] gap-2",
|
|
10947
|
+
head_row: "grid grid-cols-7 gap-1 mb-1",
|
|
10948
|
+
head_cell: "text-muted-foreground rounded-md font-semibold text-[clamp(0.575rem,1.2vw,0.75rem)] sm:text-[clamp(0.65rem,1.1vw,0.825rem)] text-center pb-1 uppercase tracking-wider",
|
|
10949
|
+
row: "grid grid-cols-7 gap-1",
|
|
11067
10950
|
cell: cn(
|
|
11068
|
-
"
|
|
10951
|
+
"min-w-0 h-9 p-0 relative flex items-center justify-center",
|
|
11069
10952
|
"[&:has([aria-selected].day-range-end)]:rounded-r-lg",
|
|
11070
10953
|
"[&:has([aria-selected].day-range-start)]:rounded-l-lg",
|
|
11071
10954
|
"[&:has([aria-selected].day-outside)]:bg-muted/50",
|
|
11072
|
-
"[&:has([aria-selected])]:bg-muted"
|
|
11073
|
-
"first:[&:has([aria-selected])]:rounded-l-lg",
|
|
11074
|
-
"last:[&:has([aria-selected])]:rounded-r-lg",
|
|
11075
|
-
"focus-within:relative focus-within:z-20"
|
|
10955
|
+
"[&:has([aria-selected])]:bg-muted"
|
|
11076
10956
|
),
|
|
11077
10957
|
day: cn(
|
|
11078
10958
|
buttonVariantsBase({ variant: "ghost" }),
|
|
11079
|
-
"w-full h-full
|
|
11080
|
-
"aria-selected:opacity-100 hover:bg-muted
|
|
11081
|
-
"transition-all duration-200 ease-out !scale-100 aria-selected:!scale-100 hover:!scale-100 active:!scale-100"
|
|
10959
|
+
"w-full h-full p-0 m-0 flex items-center justify-center text-[clamp(0.775rem,1.2vw,0.95rem)] sm:text-sm",
|
|
10960
|
+
"aria-selected:opacity-100 hover:bg-muted transition-all duration-150 ease-out active:scale-95"
|
|
11082
10961
|
),
|
|
11083
|
-
day_selected: "bg-primary text-primary-foreground hover:bg-primary/90 focus:bg-primary/90 font-semibold hover:text-white
|
|
11084
|
-
day_today: "bg-muted text-foreground font-bold ring-2 ring-primary/
|
|
11085
|
-
day_outside: "
|
|
10962
|
+
day_selected: "bg-primary text-primary-foreground hover:bg-primary/90 focus:bg-primary/90 font-semibold hover:text-white",
|
|
10963
|
+
day_today: "bg-muted text-foreground font-bold ring-2 ring-primary/30 ring-inset",
|
|
10964
|
+
day_outside: "text-muted-foreground/40 opacity-60 aria-selected:bg-muted/50 aria-selected:text-foreground",
|
|
11086
10965
|
day_disabled: "text-muted-foreground/30 opacity-40 cursor-not-allowed",
|
|
11087
10966
|
day_range_middle: "aria-selected:bg-muted aria-selected:text-foreground",
|
|
11088
10967
|
day_hidden: "invisible"
|
|
11089
10968
|
},
|
|
11090
10969
|
components: {
|
|
11091
|
-
IconLeft: () => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
|
|
11092
|
-
IconRight: () => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
|
|
10970
|
+
IconLeft: () => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_react46.CaretLeftIcon, { className: "h-4 w-4" }),
|
|
10971
|
+
IconRight: () => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_react46.CaretRightIcon, { className: "h-4 w-4" })
|
|
11093
10972
|
}
|
|
11094
10973
|
}
|
|
11095
10974
|
)
|
|
@@ -11161,7 +11040,7 @@ RangePicker.displayName = "RangePicker";
|
|
|
11161
11040
|
|
|
11162
11041
|
// src/components/ui/navigation/ContextMenuBase.tsx
|
|
11163
11042
|
var ContextMenuPrimitive = __toESM(require("@radix-ui/react-context-menu"));
|
|
11164
|
-
var
|
|
11043
|
+
var import_react47 = require("@phosphor-icons/react");
|
|
11165
11044
|
var import_jsx_runtime68 = require("react/jsx-runtime");
|
|
11166
11045
|
function ContextMenuBase(props) {
|
|
11167
11046
|
return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ContextMenuPrimitive.Root, { "data-slot": "context-menu", ...props });
|
|
@@ -11203,7 +11082,7 @@ function ContextMenuSubTriggerBase({
|
|
|
11203
11082
|
...props,
|
|
11204
11083
|
children: [
|
|
11205
11084
|
children,
|
|
11206
|
-
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
|
|
11085
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react47.CaretRightIcon, { className: "ml-auto" })
|
|
11207
11086
|
]
|
|
11208
11087
|
}
|
|
11209
11088
|
);
|
|
@@ -11298,7 +11177,7 @@ function ContextMenuCheckboxItemBase({
|
|
|
11298
11177
|
checked,
|
|
11299
11178
|
...props,
|
|
11300
11179
|
children: [
|
|
11301
|
-
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
|
|
11180
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react47.CheckIcon, { className: "size-4" }) }) }),
|
|
11302
11181
|
children
|
|
11303
11182
|
]
|
|
11304
11183
|
}
|
|
@@ -11323,7 +11202,7 @@ function ContextMenuRadioItemBase({
|
|
|
11323
11202
|
),
|
|
11324
11203
|
...props,
|
|
11325
11204
|
children: [
|
|
11326
|
-
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
|
|
11205
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react47.CircleIcon, { className: "size-2 fill-current" }) }) }),
|
|
11327
11206
|
children
|
|
11328
11207
|
]
|
|
11329
11208
|
}
|
|
@@ -11371,14 +11250,384 @@ function ContextMenuShortcutBase({
|
|
|
11371
11250
|
);
|
|
11372
11251
|
}
|
|
11373
11252
|
|
|
11253
|
+
// src/components/ui/CodeBlock.tsx
|
|
11254
|
+
var import_react48 = require("@phosphor-icons/react");
|
|
11255
|
+
var import_react49 = __toESM(require("react"));
|
|
11256
|
+
var import_react_syntax_highlighter = require("react-syntax-highlighter");
|
|
11257
|
+
var import_jsx_runtime69 = require("react/jsx-runtime");
|
|
11258
|
+
var CodeBlock = ({
|
|
11259
|
+
language,
|
|
11260
|
+
filename,
|
|
11261
|
+
code,
|
|
11262
|
+
highlightLines = [],
|
|
11263
|
+
tabs = [],
|
|
11264
|
+
breadcrumb = [],
|
|
11265
|
+
showStats = true
|
|
11266
|
+
}) => {
|
|
11267
|
+
const [copied, setCopied] = import_react49.default.useState(false);
|
|
11268
|
+
const [activeTab, setActiveTab] = import_react49.default.useState(0);
|
|
11269
|
+
const [isExpanded, setIsExpanded] = import_react49.default.useState(false);
|
|
11270
|
+
const tabsExist = tabs.length > 0;
|
|
11271
|
+
const cssVars = import_react49.default.useMemo(
|
|
11272
|
+
() => ({
|
|
11273
|
+
container: {
|
|
11274
|
+
backgroundColor: "hsl(var(--card))",
|
|
11275
|
+
borderColor: "hsl(var(--border))"
|
|
11276
|
+
},
|
|
11277
|
+
header: {
|
|
11278
|
+
backgroundColor: "hsl(var(--popover))",
|
|
11279
|
+
borderBottomColor: "hsl(var(--border))"
|
|
11280
|
+
},
|
|
11281
|
+
filename: { color: "hsl(var(--card-foreground))" },
|
|
11282
|
+
mutedText: { color: "hsl(var(--muted-foreground))" },
|
|
11283
|
+
icon: { color: "hsl(var(--muted-foreground))" },
|
|
11284
|
+
lineNumbers: {
|
|
11285
|
+
color: "hsl(var(--muted-foreground))",
|
|
11286
|
+
borderRight: `1px solid hsl(var(--border))`
|
|
11287
|
+
},
|
|
11288
|
+
highlightBorder: `3px solid hsl(var(--primary))`
|
|
11289
|
+
}),
|
|
11290
|
+
[]
|
|
11291
|
+
);
|
|
11292
|
+
const sanitizeCode = (input) => {
|
|
11293
|
+
if (!input) return "";
|
|
11294
|
+
let out = input.replace(
|
|
11295
|
+
/(^['"]use client['"];?\s*|\b'use client';|\b"use client";)/g,
|
|
11296
|
+
""
|
|
11297
|
+
);
|
|
11298
|
+
out = out.replace(/style=\{[\s\S]*?\}/g, "");
|
|
11299
|
+
out = out.replace(/style=(["'`])(?:\\.|(?!\1)[\s\S])*?\1/g, "");
|
|
11300
|
+
return out;
|
|
11301
|
+
};
|
|
11302
|
+
const getActiveRawCode = () => (tabsExist ? tabs[activeTab].code : code) || "";
|
|
11303
|
+
const activeRawCode = getActiveRawCode();
|
|
11304
|
+
const activeCodeSanitized = sanitizeCode(activeRawCode);
|
|
11305
|
+
const copyToClipboard = async () => {
|
|
11306
|
+
const textToCopy = activeCodeSanitized;
|
|
11307
|
+
if (textToCopy) {
|
|
11308
|
+
await navigator.clipboard.writeText(textToCopy);
|
|
11309
|
+
setCopied(true);
|
|
11310
|
+
setTimeout(() => setCopied(false), 2e3);
|
|
11311
|
+
}
|
|
11312
|
+
};
|
|
11313
|
+
const downloadCode = () => {
|
|
11314
|
+
const textToDownload = activeCodeSanitized;
|
|
11315
|
+
const activeFilename = tabsExist ? tabs[activeTab].name : filename;
|
|
11316
|
+
if (textToDownload) {
|
|
11317
|
+
const blob = new Blob([textToDownload], { type: "text/plain" });
|
|
11318
|
+
const url = URL.createObjectURL(blob);
|
|
11319
|
+
const a = document.createElement("a");
|
|
11320
|
+
a.href = url;
|
|
11321
|
+
a.download = activeFilename;
|
|
11322
|
+
document.body.appendChild(a);
|
|
11323
|
+
a.click();
|
|
11324
|
+
document.body.removeChild(a);
|
|
11325
|
+
URL.revokeObjectURL(url);
|
|
11326
|
+
}
|
|
11327
|
+
};
|
|
11328
|
+
const activeLanguage = tabsExist ? tabs[activeTab].language || language : language;
|
|
11329
|
+
const activeHighlightLines = tabsExist ? tabs[activeTab].highlightLines || [] : highlightLines;
|
|
11330
|
+
const getLanguageIcon = (lang) => {
|
|
11331
|
+
switch (lang.toLowerCase()) {
|
|
11332
|
+
case "javascript":
|
|
11333
|
+
case "jsx":
|
|
11334
|
+
case "typescript":
|
|
11335
|
+
case "tsx":
|
|
11336
|
+
return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react48.CodeIcon, { size: "1em", className: "text-yellow-400" });
|
|
11337
|
+
case "bash":
|
|
11338
|
+
case "shell":
|
|
11339
|
+
return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react48.TerminalIcon, { size: "1em", className: "text-green-400" });
|
|
11340
|
+
default:
|
|
11341
|
+
return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react48.FileArchiveIcon, { size: "1em", className: "text-blue-400" });
|
|
11342
|
+
}
|
|
11343
|
+
};
|
|
11344
|
+
const getCodeStats = (source) => {
|
|
11345
|
+
const lines = source.split("\n").length;
|
|
11346
|
+
const chars = source.length;
|
|
11347
|
+
const words = source.split(/\s+/).filter((word) => word.length > 0).length;
|
|
11348
|
+
return { lines, chars, words };
|
|
11349
|
+
};
|
|
11350
|
+
const stats = showStats ? getCodeStats(activeCodeSanitized) : null;
|
|
11351
|
+
return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(
|
|
11352
|
+
"div",
|
|
11353
|
+
{
|
|
11354
|
+
className: `relative w-full rounded-xl overflow-hidden shadow-sm border no-underline-code`,
|
|
11355
|
+
style: cssVars.container,
|
|
11356
|
+
children: [
|
|
11357
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("style", { children: `.no-underline-code a { text-decoration: none !important; text-shadow: none !important; box-shadow: none !important; } .no-underline-code code a { text-decoration: none !important; }` }),
|
|
11358
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: `flex items-stretch min-h-[3rem]`, style: cssVars.header, children: [
|
|
11359
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "flex-1 flex items-center min-w-0 px-3", children: [
|
|
11360
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "flex gap-2 mr-3 shrink-0", children: [
|
|
11361
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "w-3 h-3 rounded-full bg-red-500" }),
|
|
11362
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "w-3 h-3 rounded-full bg-yellow-500" }),
|
|
11363
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "w-3 h-3 rounded-full bg-green-500" })
|
|
11364
|
+
] }),
|
|
11365
|
+
breadcrumb.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "flex items-center min-w-0", children: [
|
|
11366
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react48.FolderIcon, { size: "1em", style: cssVars.icon }),
|
|
11367
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "flex items-center min-w-0 ml-2", children: breadcrumb.map((crumb, index) => /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(import_react49.default.Fragment, { children: [
|
|
11368
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
11369
|
+
"span",
|
|
11370
|
+
{
|
|
11371
|
+
className: "text-xs truncate",
|
|
11372
|
+
style: cssVars.mutedText,
|
|
11373
|
+
children: crumb
|
|
11374
|
+
}
|
|
11375
|
+
),
|
|
11376
|
+
index < breadcrumb.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
11377
|
+
import_react48.ArrowRightIcon,
|
|
11378
|
+
{
|
|
11379
|
+
size: "0.75em",
|
|
11380
|
+
style: cssVars.icon,
|
|
11381
|
+
className: "shrink-0 mx-1"
|
|
11382
|
+
}
|
|
11383
|
+
)
|
|
11384
|
+
] }, index)) })
|
|
11385
|
+
] })
|
|
11386
|
+
] }),
|
|
11387
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "flex items-center justify-end shrink-0 px-2", children: [
|
|
11388
|
+
stats && /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(
|
|
11389
|
+
"div",
|
|
11390
|
+
{
|
|
11391
|
+
className: `text-xs mx-2 truncate hidden md:block`,
|
|
11392
|
+
style: cssVars.mutedText,
|
|
11393
|
+
children: [
|
|
11394
|
+
stats.lines,
|
|
11395
|
+
"L \u2022 ",
|
|
11396
|
+
stats.words,
|
|
11397
|
+
"W"
|
|
11398
|
+
]
|
|
11399
|
+
}
|
|
11400
|
+
),
|
|
11401
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "flex", children: [
|
|
11402
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
11403
|
+
"button",
|
|
11404
|
+
{
|
|
11405
|
+
onClick: () => setIsExpanded(!isExpanded),
|
|
11406
|
+
className: `p-2 transition-colors hover:bg-gray-200 dark:hover:bg-slate-700`,
|
|
11407
|
+
title: "Toggle fullscreen",
|
|
11408
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react48.ArrowsOutIcon, { size: "1em", style: cssVars.icon })
|
|
11409
|
+
}
|
|
11410
|
+
),
|
|
11411
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
11412
|
+
"button",
|
|
11413
|
+
{
|
|
11414
|
+
onClick: downloadCode,
|
|
11415
|
+
className: `p-2 transition-colors hover:bg-gray-200 dark:hover:bg-slate-700`,
|
|
11416
|
+
title: "Download code",
|
|
11417
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react48.DownloadIcon, { size: "1em", style: cssVars.icon })
|
|
11418
|
+
}
|
|
11419
|
+
),
|
|
11420
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
11421
|
+
"button",
|
|
11422
|
+
{
|
|
11423
|
+
onClick: copyToClipboard,
|
|
11424
|
+
className: `p-2 transition-colors hover:bg-gray-200 dark:hover:bg-slate-700`,
|
|
11425
|
+
title: "Copy code",
|
|
11426
|
+
children: copied ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
11427
|
+
import_react48.CheckIcon,
|
|
11428
|
+
{
|
|
11429
|
+
size: "1em",
|
|
11430
|
+
style: { color: "hsl(var(--primary))" }
|
|
11431
|
+
}
|
|
11432
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react48.CopyIcon, { size: "1em", style: cssVars.icon })
|
|
11433
|
+
}
|
|
11434
|
+
)
|
|
11435
|
+
] })
|
|
11436
|
+
] })
|
|
11437
|
+
] }),
|
|
11438
|
+
tabsExist && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
11439
|
+
"div",
|
|
11440
|
+
{
|
|
11441
|
+
className: `flex border-b overflow-x-auto`,
|
|
11442
|
+
style: {
|
|
11443
|
+
borderColor: "hsl(var(--border))",
|
|
11444
|
+
backgroundColor: "hsl(var(--popover))"
|
|
11445
|
+
},
|
|
11446
|
+
children: tabs.map((tab, index) => /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(
|
|
11447
|
+
"button",
|
|
11448
|
+
{
|
|
11449
|
+
onClick: () => setActiveTab(index),
|
|
11450
|
+
className: `flex items-center gap-2 px-4 py-2 text-sm transition-all duration-200 border-b-2 shrink-0 ${activeTab === index ? "border-blue-500" : "border-transparent"}`,
|
|
11451
|
+
style: activeTab === index ? {
|
|
11452
|
+
backgroundColor: "hsl(var(--card))",
|
|
11453
|
+
color: "hsl(var(--card-foreground))"
|
|
11454
|
+
} : void 0,
|
|
11455
|
+
children: [
|
|
11456
|
+
getLanguageIcon(tab.language || language),
|
|
11457
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: "truncate max-w-[10rem]", children: tab.name })
|
|
11458
|
+
]
|
|
11459
|
+
},
|
|
11460
|
+
index
|
|
11461
|
+
))
|
|
11462
|
+
}
|
|
11463
|
+
),
|
|
11464
|
+
!tabsExist && filename && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
11465
|
+
"div",
|
|
11466
|
+
{
|
|
11467
|
+
className: "flex items-center px-3 py-2 border-b",
|
|
11468
|
+
style: {
|
|
11469
|
+
borderColor: "hsl(var(--border))",
|
|
11470
|
+
backgroundColor: "hsl(var(--popover))"
|
|
11471
|
+
},
|
|
11472
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "flex items-center gap-2 min-w-0", children: [
|
|
11473
|
+
getLanguageIcon(language),
|
|
11474
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
11475
|
+
"span",
|
|
11476
|
+
{
|
|
11477
|
+
className: "text-sm font-medium truncate",
|
|
11478
|
+
style: cssVars.filename,
|
|
11479
|
+
children: filename
|
|
11480
|
+
}
|
|
11481
|
+
)
|
|
11482
|
+
] })
|
|
11483
|
+
}
|
|
11484
|
+
),
|
|
11485
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
11486
|
+
"div",
|
|
11487
|
+
{
|
|
11488
|
+
className: `relative ${isExpanded ? "max-h-screen overflow-auto" : "max-h-96 overflow-auto"}`,
|
|
11489
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
11490
|
+
import_react_syntax_highlighter.Prism,
|
|
11491
|
+
{
|
|
11492
|
+
language: activeLanguage,
|
|
11493
|
+
customStyle: {
|
|
11494
|
+
margin: 0,
|
|
11495
|
+
padding: "1rem",
|
|
11496
|
+
fontSize: "0.875rem",
|
|
11497
|
+
lineHeight: "1.5",
|
|
11498
|
+
backgroundColor: "hsl(var(--card))"
|
|
11499
|
+
},
|
|
11500
|
+
wrapLines: true,
|
|
11501
|
+
showLineNumbers: true,
|
|
11502
|
+
lineNumberStyle: {
|
|
11503
|
+
...cssVars.lineNumbers,
|
|
11504
|
+
minWidth: "3em",
|
|
11505
|
+
paddingRight: "1em",
|
|
11506
|
+
marginRight: "1em"
|
|
11507
|
+
},
|
|
11508
|
+
lineProps: (lineNumber) => ({
|
|
11509
|
+
style: {
|
|
11510
|
+
backgroundColor: activeHighlightLines.includes(lineNumber) ? "hsl(var(--highlight))" : "transparent",
|
|
11511
|
+
display: "block",
|
|
11512
|
+
width: "100%",
|
|
11513
|
+
borderLeft: activeHighlightLines.includes(lineNumber) ? cssVars.highlightBorder : "none",
|
|
11514
|
+
paddingLeft: "0.5rem"
|
|
11515
|
+
}
|
|
11516
|
+
}),
|
|
11517
|
+
PreTag: "div",
|
|
11518
|
+
children: String(activeCodeSanitized)
|
|
11519
|
+
}
|
|
11520
|
+
)
|
|
11521
|
+
}
|
|
11522
|
+
),
|
|
11523
|
+
showStats && stats && /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(
|
|
11524
|
+
"div",
|
|
11525
|
+
{
|
|
11526
|
+
className: "px-3 py-2 border-t text-xs flex items-center justify-between min-h-[2.5rem]",
|
|
11527
|
+
style: {
|
|
11528
|
+
borderTopColor: "hsl(var(--border))",
|
|
11529
|
+
backgroundColor: "hsl(var(--popover))",
|
|
11530
|
+
color: "hsl(var(--muted-foreground))"
|
|
11531
|
+
},
|
|
11532
|
+
children: [
|
|
11533
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "flex items-center gap-3 min-w-0", children: [
|
|
11534
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: "truncate", children: activeLanguage.toUpperCase() }),
|
|
11535
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("span", { className: "truncate hidden sm:inline", children: [
|
|
11536
|
+
stats.lines,
|
|
11537
|
+
" lines"
|
|
11538
|
+
] }),
|
|
11539
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("span", { className: "truncate hidden md:inline", children: [
|
|
11540
|
+
stats.chars,
|
|
11541
|
+
" chars"
|
|
11542
|
+
] })
|
|
11543
|
+
] }),
|
|
11544
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "flex items-center gap-1 shrink-0", children: [
|
|
11545
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react48.GearIcon, { size: "0.75em", style: cssVars.icon }),
|
|
11546
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { children: "UTF-8" })
|
|
11547
|
+
] })
|
|
11548
|
+
]
|
|
11549
|
+
}
|
|
11550
|
+
)
|
|
11551
|
+
]
|
|
11552
|
+
}
|
|
11553
|
+
);
|
|
11554
|
+
};
|
|
11555
|
+
|
|
11556
|
+
// src/components/ui/data/StatusIndicator.tsx
|
|
11557
|
+
var import_jsx_runtime70 = require("react/jsx-runtime");
|
|
11558
|
+
function StatusIndicator({
|
|
11559
|
+
color = "green",
|
|
11560
|
+
size = "sm",
|
|
11561
|
+
position = "top-right",
|
|
11562
|
+
show = true,
|
|
11563
|
+
children,
|
|
11564
|
+
className,
|
|
11565
|
+
...props
|
|
11566
|
+
}) {
|
|
11567
|
+
const absolutePositionClasses = {
|
|
11568
|
+
"top-right": "absolute top-0 right-0 translate-x-1/2 -translate-y-1/2",
|
|
11569
|
+
"top-left": "absolute top-0 left-0 -translate-x-1/2 -translate-y-1/2",
|
|
11570
|
+
"bottom-right": "absolute bottom-0 right-0 translate-x-1/2 translate-y-1/2",
|
|
11571
|
+
"bottom-left": "absolute bottom-0 left-0 -translate-x-1/2 translate-y-1/2"
|
|
11572
|
+
};
|
|
11573
|
+
const sizeClasses = {
|
|
11574
|
+
xs: "h-2 w-2",
|
|
11575
|
+
sm: "h-2.5 w-2.5",
|
|
11576
|
+
md: "h-3 w-3",
|
|
11577
|
+
lg: "h-4 w-4"
|
|
11578
|
+
};
|
|
11579
|
+
const colorClasses = {
|
|
11580
|
+
green: "bg-green-500",
|
|
11581
|
+
gray: "bg-gray-400",
|
|
11582
|
+
red: "bg-red-500",
|
|
11583
|
+
yellow: "bg-yellow-400",
|
|
11584
|
+
blue: "bg-blue-500",
|
|
11585
|
+
purple: "bg-purple-500",
|
|
11586
|
+
retire: "bg-slate-300/70 ring-1 ring-slate-200"
|
|
11587
|
+
};
|
|
11588
|
+
const dotClass = cn(
|
|
11589
|
+
"rounded-full inline-block",
|
|
11590
|
+
sizeClasses[size],
|
|
11591
|
+
colorClasses[color],
|
|
11592
|
+
"flex-shrink-0"
|
|
11593
|
+
);
|
|
11594
|
+
if (position === "inline") {
|
|
11595
|
+
return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(
|
|
11596
|
+
"span",
|
|
11597
|
+
{
|
|
11598
|
+
className: cn("inline-flex items-center gap-2", className),
|
|
11599
|
+
...props,
|
|
11600
|
+
children: [
|
|
11601
|
+
show && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { className: dotClass, "aria-hidden": !show }),
|
|
11602
|
+
children && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { className: "truncate", children })
|
|
11603
|
+
]
|
|
11604
|
+
}
|
|
11605
|
+
);
|
|
11606
|
+
}
|
|
11607
|
+
return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: cn("relative inline-flex", className), ...props, children: [
|
|
11608
|
+
show && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
11609
|
+
"span",
|
|
11610
|
+
{
|
|
11611
|
+
"aria-hidden": !show,
|
|
11612
|
+
className: cn(
|
|
11613
|
+
"pointer-events-none z-10",
|
|
11614
|
+
absolutePositionClasses[position]
|
|
11615
|
+
),
|
|
11616
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { className: dotClass })
|
|
11617
|
+
}
|
|
11618
|
+
),
|
|
11619
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "min-w-0", children })
|
|
11620
|
+
] });
|
|
11621
|
+
}
|
|
11622
|
+
|
|
11374
11623
|
// src/hooks/use-drag.tsx
|
|
11375
|
-
var
|
|
11624
|
+
var import_react50 = require("react");
|
|
11376
11625
|
var useDrag = (options = {}) => {
|
|
11377
|
-
const [isDragging, setIsDragging] = (0,
|
|
11378
|
-
const [positions, setPositions] = (0,
|
|
11379
|
-
const dragStartPos = (0,
|
|
11380
|
-
const dragId = (0,
|
|
11381
|
-
const handleMouseDown = (0,
|
|
11626
|
+
const [isDragging, setIsDragging] = (0, import_react50.useState)(null);
|
|
11627
|
+
const [positions, setPositions] = (0, import_react50.useState)({});
|
|
11628
|
+
const dragStartPos = (0, import_react50.useRef)(null);
|
|
11629
|
+
const dragId = (0, import_react50.useRef)(null);
|
|
11630
|
+
const handleMouseDown = (0, import_react50.useCallback)((id, e) => {
|
|
11382
11631
|
e.preventDefault();
|
|
11383
11632
|
const currentPosition = positions[id] || { top: 0, left: 0 };
|
|
11384
11633
|
dragStartPos.current = {
|
|
@@ -11391,7 +11640,7 @@ var useDrag = (options = {}) => {
|
|
|
11391
11640
|
setIsDragging(id);
|
|
11392
11641
|
options.onDragStart?.(id);
|
|
11393
11642
|
}, [positions, options]);
|
|
11394
|
-
const handleMouseMove = (0,
|
|
11643
|
+
const handleMouseMove = (0, import_react50.useCallback)((e) => {
|
|
11395
11644
|
if (!isDragging || !dragStartPos.current || !dragId.current) return;
|
|
11396
11645
|
const deltaX = e.clientX - dragStartPos.current.x;
|
|
11397
11646
|
const deltaY = e.clientY - dragStartPos.current.y;
|
|
@@ -11407,7 +11656,7 @@ var useDrag = (options = {}) => {
|
|
|
11407
11656
|
}));
|
|
11408
11657
|
options.onDrag?.(dragId.current, newPosition);
|
|
11409
11658
|
}, [isDragging, options]);
|
|
11410
|
-
const handleMouseUp = (0,
|
|
11659
|
+
const handleMouseUp = (0, import_react50.useCallback)(() => {
|
|
11411
11660
|
if (dragId.current) {
|
|
11412
11661
|
options.onDragEnd?.(dragId.current);
|
|
11413
11662
|
}
|
|
@@ -11415,7 +11664,7 @@ var useDrag = (options = {}) => {
|
|
|
11415
11664
|
dragStartPos.current = null;
|
|
11416
11665
|
dragId.current = null;
|
|
11417
11666
|
}, [options]);
|
|
11418
|
-
(0,
|
|
11667
|
+
(0, import_react50.useEffect)(() => {
|
|
11419
11668
|
if (isDragging) {
|
|
11420
11669
|
document.addEventListener("mousemove", handleMouseMove);
|
|
11421
11670
|
document.addEventListener("mouseup", handleMouseUp);
|
|
@@ -11427,16 +11676,16 @@ var useDrag = (options = {}) => {
|
|
|
11427
11676
|
};
|
|
11428
11677
|
}
|
|
11429
11678
|
}, [isDragging, handleMouseMove, handleMouseUp]);
|
|
11430
|
-
const setPosition = (0,
|
|
11679
|
+
const setPosition = (0, import_react50.useCallback)((id, position) => {
|
|
11431
11680
|
setPositions((prev) => ({
|
|
11432
11681
|
...prev,
|
|
11433
11682
|
[id]: position
|
|
11434
11683
|
}));
|
|
11435
11684
|
}, []);
|
|
11436
|
-
const getPosition = (0,
|
|
11685
|
+
const getPosition = (0, import_react50.useCallback)((id) => {
|
|
11437
11686
|
return positions[id] || { top: 0, left: 0 };
|
|
11438
11687
|
}, [positions]);
|
|
11439
|
-
const isElementDragging = (0,
|
|
11688
|
+
const isElementDragging = (0, import_react50.useCallback)((id) => {
|
|
11440
11689
|
return isDragging === id;
|
|
11441
11690
|
}, [isDragging]);
|
|
11442
11691
|
return {
|