@mlw-packages/react-components 1.7.15 → 1.7.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +95 -154
- package/dist/index.d.ts +95 -154
- package/dist/index.js +929 -1064
- package/dist/index.mjs +721 -849
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -729,7 +729,6 @@ __export(index_exports, {
|
|
|
729
729
|
StartHour: () => StartHour,
|
|
730
730
|
StatusIndicator: () => StatusIndicator,
|
|
731
731
|
SwitchBase: () => SwitchBase,
|
|
732
|
-
TITLE_CLASSNAME: () => TITLE_CLASSNAME,
|
|
733
732
|
TableBase: () => TableBase,
|
|
734
733
|
TableBodyBase: () => TableBodyBase,
|
|
735
734
|
TableCaptionBase: () => TableCaptionBase,
|
|
@@ -761,31 +760,16 @@ __export(index_exports, {
|
|
|
761
760
|
VisibilityButton: () => VisibilityButton,
|
|
762
761
|
WeekCellsHeight: () => WeekCellsHeight,
|
|
763
762
|
WeekView: () => WeekView,
|
|
764
|
-
adaptDataForTooltip: () => adaptDataForTooltip,
|
|
765
763
|
addHoursToDate: () => addHoursToDate,
|
|
766
764
|
badgeVariants: () => badgeVariants,
|
|
767
|
-
buildPercentFormatter: () => buildPercentFormatter,
|
|
768
765
|
buttonVariantsBase: () => buttonVariantsBase,
|
|
769
766
|
compactTick: () => compactTick,
|
|
770
|
-
computeAllKeys: () => computeAllKeys,
|
|
771
|
-
computeAxisLabelWidth: () => computeAxisLabelWidth,
|
|
772
|
-
computeChartWidth: () => computeChartWidth,
|
|
773
|
-
computeEstimatedAxisNeeded: () => computeEstimatedAxisNeeded,
|
|
774
|
-
computeLabelSample: () => computeLabelSample,
|
|
775
|
-
computeLeftRightKeys: () => computeLeftRightKeys,
|
|
776
|
-
computeNiceMax: () => computeNiceMax,
|
|
777
|
-
computeProcessedData: () => computeProcessedData,
|
|
778
|
-
computeSeriesOrder: () => computeSeriesOrder,
|
|
779
767
|
convert12HourTo24Hour: () => convert12HourTo24Hour,
|
|
780
|
-
createFinalValueFormatter: () => createFinalValueFormatter,
|
|
781
|
-
createYTickFormatter: () => createYTickFormatter,
|
|
782
768
|
detectDataFields: () => detectDataFields,
|
|
783
769
|
detectXAxis: () => detectXAxis,
|
|
784
770
|
display12HourValue: () => display12HourValue,
|
|
785
|
-
estimateTextWidth: () => estimateTextWidth,
|
|
786
771
|
formatFieldName: () => formatFieldName,
|
|
787
772
|
generateAdditionalColors: () => generateAdditionalColors,
|
|
788
|
-
generateColors: () => generateColors,
|
|
789
773
|
getAgendaEventsForDay: () => getAgendaEventsForDay,
|
|
790
774
|
getAllEventsForDay: () => getAllEventsForDay,
|
|
791
775
|
getArrowByType: () => getArrowByType,
|
|
@@ -806,9 +790,8 @@ __export(index_exports, {
|
|
|
806
790
|
isValid12Hour: () => isValid12Hour,
|
|
807
791
|
isValidHour: () => isValidHour,
|
|
808
792
|
isValidMinuteOrSecond: () => isValidMinuteOrSecond,
|
|
809
|
-
maxForKeys: () => maxForKeys,
|
|
810
|
-
minForKeys: () => minForKeys,
|
|
811
793
|
niceCeil: () => niceCeil,
|
|
794
|
+
renderInsideBarLabel: () => renderInsideBarLabel,
|
|
812
795
|
renderPillLabel: () => pillLabelRenderer_default,
|
|
813
796
|
resolveChartMargins: () => resolveChartMargins,
|
|
814
797
|
resolveContainerPaddingLeft: () => resolveContainerPaddingLeft,
|
|
@@ -821,12 +804,10 @@ __export(index_exports, {
|
|
|
821
804
|
toast: () => toast2,
|
|
822
805
|
useCalendarDnd: () => useCalendarDnd,
|
|
823
806
|
useChartHighlights: () => useChartHighlights,
|
|
824
|
-
useChartLayout: () => useChartLayout,
|
|
825
807
|
useCurrentTimeIndicator: () => useCurrentTimeIndicator,
|
|
826
808
|
useDrag: () => useDrag,
|
|
827
809
|
useEventVisibility: () => useEventVisibility,
|
|
828
810
|
useIsMobile: () => useIsMobile,
|
|
829
|
-
useMeasureWidth: () => useMeasureWidth,
|
|
830
811
|
useTheme: () => useTheme
|
|
831
812
|
});
|
|
832
813
|
module.exports = __toCommonJS(index_exports);
|
|
@@ -2406,7 +2387,7 @@ function AvatarCombobox({
|
|
|
2406
2387
|
}
|
|
2407
2388
|
|
|
2408
2389
|
// src/components/charts/Chart.tsx
|
|
2409
|
-
var
|
|
2390
|
+
var import_react21 = require("react");
|
|
2410
2391
|
var import_recharts = require("recharts");
|
|
2411
2392
|
|
|
2412
2393
|
// src/components/charts/utils/helpers.ts
|
|
@@ -3815,107 +3796,8 @@ var TooltipSimple = ({
|
|
|
3815
3796
|
};
|
|
3816
3797
|
var TooltipSimple_default = TooltipSimple;
|
|
3817
3798
|
|
|
3818
|
-
// src/components/charts/NoData.tsx
|
|
3819
|
-
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
3820
|
-
var NoData = ({
|
|
3821
|
-
paddingLeft = 0,
|
|
3822
|
-
height = 360,
|
|
3823
|
-
message = "Sem dados para exibir",
|
|
3824
|
-
className
|
|
3825
|
-
}) => {
|
|
3826
|
-
const svgHeight = typeof height === "number" ? height : 360;
|
|
3827
|
-
const bars = [
|
|
3828
|
-
{ x: 120, w: 120, h: svgHeight * 0.45, label: "Label 0" },
|
|
3829
|
-
{ x: 260, w: 120, h: svgHeight * 0.75, label: "Label 1" },
|
|
3830
|
-
{ x: 400, w: 120, h: svgHeight * 0.65, label: "Label 2" },
|
|
3831
|
-
{ x: 540, w: 120, h: svgHeight * 0.55, label: "Label 3" },
|
|
3832
|
-
{ x: 680, w: 120, h: svgHeight * 0.25, label: "Label 4" }
|
|
3833
|
-
];
|
|
3834
|
-
const styleVars = {
|
|
3835
|
-
["--pl"]: `${paddingLeft}px`,
|
|
3836
|
-
["--svg-h"]: typeof height === "number" ? `${height}px` : String(height)
|
|
3837
|
-
};
|
|
3838
|
-
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
3839
|
-
"div",
|
|
3840
|
-
{
|
|
3841
|
-
className: cn(
|
|
3842
|
-
"rounded-lg bg-card p-2 relative overflow-visible w-full",
|
|
3843
|
-
className
|
|
3844
|
-
),
|
|
3845
|
-
style: styleVars,
|
|
3846
|
-
role: "img",
|
|
3847
|
-
"aria-label": message,
|
|
3848
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "w-full flex items-center justify-center pl-[var(--pl)] pr-3 h-[var(--svg-h)]", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "w-full max-w-[900px] relative", children: [
|
|
3849
|
-
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
|
|
3850
|
-
"svg",
|
|
3851
|
-
{
|
|
3852
|
-
className: "w-full h-[var(--svg-h)]",
|
|
3853
|
-
width: "100%",
|
|
3854
|
-
viewBox: `0 0 900 ${svgHeight}`,
|
|
3855
|
-
preserveAspectRatio: "none",
|
|
3856
|
-
children: [
|
|
3857
|
-
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
3858
|
-
"rect",
|
|
3859
|
-
{
|
|
3860
|
-
x: 0,
|
|
3861
|
-
y: 0,
|
|
3862
|
-
width: 900,
|
|
3863
|
-
height: svgHeight,
|
|
3864
|
-
fill: "transparent"
|
|
3865
|
-
}
|
|
3866
|
-
),
|
|
3867
|
-
Array.from({ length: 5 }).map((_, i) => {
|
|
3868
|
-
const y = 40 + (svgHeight - 80) / 4 * i;
|
|
3869
|
-
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
3870
|
-
"line",
|
|
3871
|
-
{
|
|
3872
|
-
x1: 60,
|
|
3873
|
-
x2: 840,
|
|
3874
|
-
y1: y,
|
|
3875
|
-
y2: y,
|
|
3876
|
-
stroke: "rgba(0,0,0,0.06)",
|
|
3877
|
-
strokeWidth: 1
|
|
3878
|
-
},
|
|
3879
|
-
`g-${i}`
|
|
3880
|
-
);
|
|
3881
|
-
}),
|
|
3882
|
-
bars.map((b, i) => /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("g", { children: [
|
|
3883
|
-
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
3884
|
-
"rect",
|
|
3885
|
-
{
|
|
3886
|
-
x: b.x,
|
|
3887
|
-
y: svgHeight - 60 - b.h,
|
|
3888
|
-
width: b.w,
|
|
3889
|
-
height: b.h,
|
|
3890
|
-
rx: 6,
|
|
3891
|
-
fill: "rgba(0,0,0,0.06)",
|
|
3892
|
-
stroke: "rgba(0,0,0,0.04)"
|
|
3893
|
-
}
|
|
3894
|
-
),
|
|
3895
|
-
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
3896
|
-
"text",
|
|
3897
|
-
{
|
|
3898
|
-
x: b.x + b.w / 2,
|
|
3899
|
-
y: svgHeight - 20,
|
|
3900
|
-
fill: "rgba(0,0,0,0.35)",
|
|
3901
|
-
fontSize: 12,
|
|
3902
|
-
textAnchor: "middle",
|
|
3903
|
-
children: b.label
|
|
3904
|
-
}
|
|
3905
|
-
)
|
|
3906
|
-
] }, `barg-${i}`))
|
|
3907
|
-
]
|
|
3908
|
-
}
|
|
3909
|
-
),
|
|
3910
|
-
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "absolute inset-0 flex items-center justify-center pointer-events-none h-[var(--svg-h)]", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "pointer-events-auto bg-transparent px-3", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "text-2xl font-extrabold text-black/80", children: message }) }) })
|
|
3911
|
-
] }) })
|
|
3912
|
-
}
|
|
3913
|
-
);
|
|
3914
|
-
};
|
|
3915
|
-
var NoData_default = NoData;
|
|
3916
|
-
|
|
3917
3799
|
// src/components/charts/utils/pillLabelRenderer.tsx
|
|
3918
|
-
var
|
|
3800
|
+
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
3919
3801
|
var formatCompactNumber = (value) => {
|
|
3920
3802
|
const isNegative = value < 0;
|
|
3921
3803
|
const absValue = Math.abs(value);
|
|
@@ -3960,7 +3842,7 @@ var renderPillLabel = (color, variant, valueFormatter2) => {
|
|
|
3960
3842
|
40,
|
|
3961
3843
|
String(text).length * approxCharWidth + paddingX * 2
|
|
3962
3844
|
);
|
|
3963
|
-
const pillHeight =
|
|
3845
|
+
const pillHeight = 14;
|
|
3964
3846
|
const xNum = parseNumber(x);
|
|
3965
3847
|
const px = parseNumber(props.x);
|
|
3966
3848
|
const pWidth = parseNumber(props.width);
|
|
@@ -4006,8 +3888,8 @@ var renderPillLabel = (color, variant, valueFormatter2) => {
|
|
|
4006
3888
|
} else {
|
|
4007
3889
|
textColor = "#374151";
|
|
4008
3890
|
}
|
|
4009
|
-
return /* @__PURE__ */ (0,
|
|
4010
|
-
/* @__PURE__ */ (0,
|
|
3891
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("g", { children: [
|
|
3892
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
4011
3893
|
"rect",
|
|
4012
3894
|
{
|
|
4013
3895
|
x: rectX,
|
|
@@ -4020,13 +3902,13 @@ var renderPillLabel = (color, variant, valueFormatter2) => {
|
|
|
4020
3902
|
strokeWidth: rectStroke ? 1 : 0
|
|
4021
3903
|
}
|
|
4022
3904
|
),
|
|
4023
|
-
/* @__PURE__ */ (0,
|
|
3905
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
4024
3906
|
"text",
|
|
4025
3907
|
{
|
|
4026
3908
|
x: textX,
|
|
4027
|
-
y: textY +
|
|
3909
|
+
y: textY + 1,
|
|
4028
3910
|
fill: textColor,
|
|
4029
|
-
fontSize:
|
|
3911
|
+
fontSize: 10,
|
|
4030
3912
|
fontWeight: 700,
|
|
4031
3913
|
textAnchor: "middle",
|
|
4032
3914
|
dominantBaseline: "central",
|
|
@@ -4038,324 +3920,64 @@ var renderPillLabel = (color, variant, valueFormatter2) => {
|
|
|
4038
3920
|
};
|
|
4039
3921
|
};
|
|
4040
3922
|
var pillLabelRenderer_default = renderPillLabel;
|
|
4041
|
-
|
|
4042
|
-
|
|
4043
|
-
|
|
4044
|
-
|
|
4045
|
-
|
|
4046
|
-
const
|
|
4047
|
-
|
|
4048
|
-
|
|
4049
|
-
|
|
4050
|
-
|
|
4051
|
-
}
|
|
4052
|
-
}
|
|
4053
|
-
return max;
|
|
4054
|
-
}
|
|
4055
|
-
function minForKeys(processedData, keys) {
|
|
4056
|
-
let min = 0;
|
|
4057
|
-
for (const row of processedData) {
|
|
4058
|
-
const r = row;
|
|
4059
|
-
for (const key of keys) {
|
|
4060
|
-
const v = r[key];
|
|
4061
|
-
if (typeof v === "number" && Number.isFinite(v) && v < min)
|
|
4062
|
-
min = v;
|
|
4063
|
-
}
|
|
4064
|
-
}
|
|
4065
|
-
return min;
|
|
4066
|
-
}
|
|
4067
|
-
|
|
4068
|
-
// src/components/charts/utils/formatters.ts
|
|
4069
|
-
var TITLE_CLASSNAME = "text-xl font-semibold text-foreground mb-3";
|
|
4070
|
-
function buildPercentFormatter(decimals = 0) {
|
|
4071
|
-
return (v) => {
|
|
4072
|
-
const n = Number(String(v));
|
|
4073
|
-
if (Number.isNaN(n)) return String(v ?? "");
|
|
4074
|
-
const value = Math.abs(n) <= 1 ? n * 100 : n;
|
|
4075
|
-
return `${value.toFixed(decimals)}%`;
|
|
4076
|
-
};
|
|
4077
|
-
}
|
|
4078
|
-
function createFinalValueFormatter(valueFormatter2, formatBR) {
|
|
4079
|
-
const nf = new Intl.NumberFormat("pt-BR", {
|
|
4080
|
-
minimumFractionDigits: 2,
|
|
4081
|
-
maximumFractionDigits: 2
|
|
4082
|
-
});
|
|
4083
|
-
if (valueFormatter2) {
|
|
4084
|
-
if (formatBR) {
|
|
4085
|
-
const wrapped = (props) => {
|
|
4086
|
-
const { value, formattedValue } = props;
|
|
4087
|
-
let num = NaN;
|
|
4088
|
-
if (typeof value === "number") num = value;
|
|
4089
|
-
else if (typeof value === "string" && value.trim() !== "") {
|
|
4090
|
-
const parsed = Number(value);
|
|
4091
|
-
num = Number.isNaN(parsed) ? NaN : parsed;
|
|
4092
|
-
}
|
|
4093
|
-
const brFormatted = !Number.isNaN(num) ? nf.format(num) : String(formattedValue ?? value ?? "");
|
|
4094
|
-
return valueFormatter2({
|
|
4095
|
-
...props,
|
|
4096
|
-
formattedValue: brFormatted,
|
|
4097
|
-
value: void 0
|
|
4098
|
-
});
|
|
4099
|
-
};
|
|
4100
|
-
return wrapped;
|
|
4101
|
-
}
|
|
4102
|
-
return valueFormatter2;
|
|
4103
|
-
}
|
|
4104
|
-
if (!formatBR) return void 0;
|
|
4105
|
-
const builtIn = (props) => {
|
|
4106
|
-
const { value, formattedValue } = props;
|
|
4107
|
-
let num = NaN;
|
|
4108
|
-
if (typeof value === "number") num = value;
|
|
4109
|
-
else if (typeof value === "string" && value.trim() !== "") {
|
|
4110
|
-
const parsed = Number(value);
|
|
4111
|
-
num = Number.isNaN(parsed) ? NaN : parsed;
|
|
4112
|
-
}
|
|
4113
|
-
if (!Number.isNaN(num)) return String(nf.format(num));
|
|
4114
|
-
return String(formattedValue ?? value ?? "");
|
|
4115
|
-
};
|
|
4116
|
-
return builtIn;
|
|
4117
|
-
}
|
|
4118
|
-
function createYTickFormatter(finalValueFormatter) {
|
|
4119
|
-
const nf = new Intl.NumberFormat("pt-BR", {
|
|
4120
|
-
minimumFractionDigits: 2,
|
|
4121
|
-
maximumFractionDigits: 2
|
|
4122
|
-
});
|
|
4123
|
-
const stripCurrency = (s) => String(s).replace(/^\s*R\$\s?/, "");
|
|
4124
|
-
if (finalValueFormatter) {
|
|
4125
|
-
return (v) => {
|
|
4126
|
-
const num = Number(String(v));
|
|
4127
|
-
const formatted = Number.isNaN(num) ? String(v ?? "") : nf.format(num);
|
|
4128
|
-
const out = finalValueFormatter({
|
|
4129
|
-
value: v,
|
|
4130
|
-
formattedValue: formatted
|
|
4131
|
-
});
|
|
4132
|
-
return stripCurrency(String(out));
|
|
3923
|
+
var renderInsideBarLabel = (color, valueFormatter2) => {
|
|
3924
|
+
return (props) => {
|
|
3925
|
+
const { x, y, value, width, height, viewBox, cx, cy, index } = props;
|
|
3926
|
+
const defaultFormatted = typeof value === "number" ? formatCompactNumber(value) : String(value ?? "");
|
|
3927
|
+
const text = valueFormatter2 ? valueFormatter2({ value, formattedValue: defaultFormatted, ...props }) : defaultFormatted;
|
|
3928
|
+
const parseNumberLocal = (v) => {
|
|
3929
|
+
if (typeof v === "number") return v;
|
|
3930
|
+
if (typeof v === "string" && v.trim() !== "" && !Number.isNaN(Number(v)))
|
|
3931
|
+
return Number(v);
|
|
3932
|
+
return void 0;
|
|
4133
3933
|
};
|
|
4134
|
-
|
|
4135
|
-
|
|
4136
|
-
const
|
|
4137
|
-
|
|
4138
|
-
|
|
4139
|
-
|
|
4140
|
-
|
|
4141
|
-
|
|
4142
|
-
|
|
4143
|
-
|
|
4144
|
-
|
|
4145
|
-
|
|
4146
|
-
|
|
4147
|
-
|
|
4148
|
-
|
|
4149
|
-
}
|
|
4150
|
-
|
|
4151
|
-
|
|
4152
|
-
|
|
4153
|
-
|
|
4154
|
-
|
|
4155
|
-
|
|
4156
|
-
|
|
4157
|
-
else if (typeof
|
|
4158
|
-
|
|
4159
|
-
else
|
|
4160
|
-
|
|
4161
|
-
|
|
4162
|
-
|
|
4163
|
-
|
|
4164
|
-
|
|
4165
|
-
|
|
4166
|
-
|
|
4167
|
-
|
|
4168
|
-
|
|
4169
|
-
|
|
4170
|
-
|
|
4171
|
-
|
|
4172
|
-
|
|
4173
|
-
|
|
4174
|
-
ctx.font = "12px system-ui, -apple-system, 'Segoe UI', Roboto";
|
|
4175
|
-
const w = Math.ceil(ctx.measureText(s).width) + 12;
|
|
4176
|
-
return Math.min(300, w);
|
|
4177
|
-
}
|
|
4178
|
-
|
|
4179
|
-
// src/components/charts/utils/chartHelpers.ts
|
|
4180
|
-
function computeSeriesOrder(series, mapperConfig) {
|
|
4181
|
-
const seriesOrder = [];
|
|
4182
|
-
if (series) {
|
|
4183
|
-
if (series.bar)
|
|
4184
|
-
series.bar.forEach((k) => seriesOrder.push({ type: "bar", key: k }));
|
|
4185
|
-
if (series.line)
|
|
4186
|
-
series.line.forEach((k) => seriesOrder.push({ type: "line", key: k }));
|
|
4187
|
-
if (series.area)
|
|
4188
|
-
series.area.forEach((k) => seriesOrder.push({ type: "area", key: k }));
|
|
4189
|
-
} else {
|
|
4190
|
-
Object.keys(mapperConfig).forEach(
|
|
4191
|
-
(k) => seriesOrder.push({ type: "bar", key: k })
|
|
4192
|
-
);
|
|
4193
|
-
}
|
|
4194
|
-
return seriesOrder;
|
|
4195
|
-
}
|
|
4196
|
-
function computeProcessedData(data, xAxisKey) {
|
|
4197
|
-
return data.map((item) => ({
|
|
4198
|
-
...item,
|
|
4199
|
-
name: String(item[xAxisKey] ?? "N/A")
|
|
4200
|
-
}));
|
|
4201
|
-
}
|
|
4202
|
-
function computeAllKeys(seriesOrder) {
|
|
4203
|
-
return seriesOrder.map((s) => s.key).filter(Boolean);
|
|
4204
|
-
}
|
|
4205
|
-
function computeLeftRightKeys(allKeys, yAxisMap) {
|
|
4206
|
-
const normalize = (v) => {
|
|
4207
|
-
if (v === "left" || v === "right") return v;
|
|
4208
|
-
if (v === 1 || v === "1" || v === true) return "right";
|
|
4209
|
-
return "left";
|
|
4210
|
-
};
|
|
4211
|
-
const leftKeys = !yAxisMap ? allKeys : allKeys.filter((k) => normalize(yAxisMap?.[k]) === "left");
|
|
4212
|
-
const rightKeys = !yAxisMap ? [] : allKeys.filter((k) => normalize(yAxisMap?.[k]) === "right");
|
|
4213
|
-
return { leftKeys, rightKeys };
|
|
4214
|
-
}
|
|
4215
|
-
function computeNiceMax(value) {
|
|
4216
|
-
let padding = 0.08;
|
|
4217
|
-
if (value > 1e6) padding = 0.05;
|
|
4218
|
-
if (value > 1e7) padding = 0.03;
|
|
4219
|
-
if (value === 0) padding = 0.12;
|
|
4220
|
-
const padded = value * (1 + padding);
|
|
4221
|
-
return padded;
|
|
4222
|
-
}
|
|
4223
|
-
function computeChartWidth(dataLength, seriesCounts, niceMax, opts) {
|
|
4224
|
-
const basePerPoint = 60;
|
|
4225
|
-
const perBarExtra = seriesCounts.bar > 0 ? Math.max(0, seriesCounts.bar - 1) * 8 : 0;
|
|
4226
|
-
const perOtherExtra = (seriesCounts.line + seriesCounts.area) * 4;
|
|
4227
|
-
let sizeFactor = 1;
|
|
4228
|
-
if (niceMax > 1e5) sizeFactor = 1.1;
|
|
4229
|
-
if (niceMax > 1e6) sizeFactor = 1.2;
|
|
4230
|
-
if (niceMax > 1e7) sizeFactor = 1.3;
|
|
4231
|
-
const perPoint = Math.round(
|
|
4232
|
-
(basePerPoint + perBarExtra + perOtherExtra) * sizeFactor
|
|
4233
|
-
);
|
|
4234
|
-
const marginExtra = 120;
|
|
4235
|
-
const calculated = Math.max(1, dataLength) * perPoint + marginExtra;
|
|
4236
|
-
const minWidth = opts?.minWidth ?? 300;
|
|
4237
|
-
const maxWidth = opts?.maxWidth ?? 1800;
|
|
4238
|
-
return Math.max(minWidth, Math.min(maxWidth, calculated));
|
|
4239
|
-
}
|
|
4240
|
-
function computeLabelSample(keys, candidates, yTickFormatter) {
|
|
4241
|
-
if (!keys || keys.length === 0) return "";
|
|
4242
|
-
return String(
|
|
4243
|
-
candidates.map((v) => yTickFormatter(v)).sort((a, b) => String(b).length - String(a).length)[0] ?? ""
|
|
4244
|
-
);
|
|
4245
|
-
}
|
|
4246
|
-
function computeEstimatedAxisNeeded(labelSample, axisLabel, containerPaddingLeft = 16, defaultLeftMargin = 0) {
|
|
4247
|
-
const tickW = labelSample ? estimateTextWidth(labelSample) : 0;
|
|
4248
|
-
const axisW = axisLabel ? estimateTextWidth(axisLabel) + 8 : 0;
|
|
4249
|
-
return Math.max(
|
|
4250
|
-
defaultLeftMargin,
|
|
4251
|
-
Math.ceil(tickW + axisW + containerPaddingLeft / 2)
|
|
4252
|
-
);
|
|
4253
|
-
}
|
|
4254
|
-
function computeAxisLabelWidth(label) {
|
|
4255
|
-
return label ? estimateTextWidth(label) : 0;
|
|
4256
|
-
}
|
|
4257
|
-
|
|
4258
|
-
// src/components/charts/hooks/useMeasureWidth.ts
|
|
4259
|
-
var import_react21 = require("react");
|
|
4260
|
-
function useMeasureWidth() {
|
|
4261
|
-
const wrapperRef = (0, import_react21.useRef)(null);
|
|
4262
|
-
const [measuredWidth, setMeasuredWidth] = (0, import_react21.useState)(null);
|
|
4263
|
-
(0, import_react21.useLayoutEffect)(() => {
|
|
4264
|
-
const el = wrapperRef.current;
|
|
4265
|
-
if (!el) return;
|
|
4266
|
-
const ro = new ResizeObserver((entries) => {
|
|
4267
|
-
const r = entries[0];
|
|
4268
|
-
if (r && typeof r.contentRect.width === "number") {
|
|
4269
|
-
setMeasuredWidth(Math.round(r.contentRect.width));
|
|
3934
|
+
const px = parseNumberLocal(x);
|
|
3935
|
+
const py = parseNumberLocal(y);
|
|
3936
|
+
const pWidth = parseNumberLocal(width);
|
|
3937
|
+
const pHeight = parseNumberLocal(height);
|
|
3938
|
+
const cxNum = parseNumberLocal(cx);
|
|
3939
|
+
const vb = viewBox;
|
|
3940
|
+
let centerX;
|
|
3941
|
+
if (typeof px === "number" && typeof pWidth === "number") {
|
|
3942
|
+
centerX = px + pWidth / 2;
|
|
3943
|
+
} else if (typeof cxNum === "number") {
|
|
3944
|
+
centerX = cxNum;
|
|
3945
|
+
} else if (vb && typeof vb.x === "number" && typeof vb.width === "number") {
|
|
3946
|
+
const approxCols = Math.max(1, index + 1);
|
|
3947
|
+
const colWidth = vb.width / approxCols;
|
|
3948
|
+
centerX = (vb.x ?? 0) + colWidth * (index + 0.5);
|
|
3949
|
+
} else {
|
|
3950
|
+
centerX = typeof index === "number" ? index * 40 + 24 : 0;
|
|
3951
|
+
}
|
|
3952
|
+
let centerY;
|
|
3953
|
+
if (typeof py === "number" && typeof pHeight === "number") {
|
|
3954
|
+
centerY = py + pHeight / 2;
|
|
3955
|
+
} else if (typeof cy === "number") {
|
|
3956
|
+
centerY = cy;
|
|
3957
|
+
} else if (vb && typeof vb.y === "number" && typeof vb.height === "number") {
|
|
3958
|
+
centerY = (vb.y ?? 0) + (vb.height ?? 0) / 2;
|
|
3959
|
+
} else {
|
|
3960
|
+
centerY = 0;
|
|
3961
|
+
}
|
|
3962
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
3963
|
+
"text",
|
|
3964
|
+
{
|
|
3965
|
+
x: centerX,
|
|
3966
|
+
y: centerY,
|
|
3967
|
+
fill: "#ffffff",
|
|
3968
|
+
fontSize: 10,
|
|
3969
|
+
fontWeight: 700,
|
|
3970
|
+
textAnchor: "middle",
|
|
3971
|
+
dominantBaseline: "central",
|
|
3972
|
+
style: { pointerEvents: "none" },
|
|
3973
|
+
children: text
|
|
4270
3974
|
}
|
|
4271
|
-
|
|
4272
|
-
ro.observe(el);
|
|
4273
|
-
setMeasuredWidth(Math.round(el.getBoundingClientRect().width));
|
|
4274
|
-
return () => ro.disconnect();
|
|
4275
|
-
}, []);
|
|
4276
|
-
return { wrapperRef, measuredWidth };
|
|
4277
|
-
}
|
|
4278
|
-
|
|
4279
|
-
// src/components/charts/hooks/useChartLayout.ts
|
|
4280
|
-
var import_react22 = require("react");
|
|
4281
|
-
function useChartLayout(args) {
|
|
4282
|
-
const {
|
|
4283
|
-
width,
|
|
4284
|
-
measuredWidth,
|
|
4285
|
-
points,
|
|
4286
|
-
seriesCounts,
|
|
4287
|
-
niceMax,
|
|
4288
|
-
yAxes,
|
|
4289
|
-
yAxisLabel,
|
|
4290
|
-
chartMargin,
|
|
4291
|
-
showLabels,
|
|
4292
|
-
showLegend,
|
|
4293
|
-
xAxisLabel,
|
|
4294
|
-
leftLabelSample,
|
|
4295
|
-
rightLabelSample
|
|
4296
|
-
} = args;
|
|
4297
|
-
const containerPaddingLeft = 16;
|
|
4298
|
-
const defaultChartRightMargin = 30;
|
|
4299
|
-
const defaultChartLeftMargin = 0;
|
|
4300
|
-
const computedWidth = (0, import_react22.useMemo)(() => {
|
|
4301
|
-
if (typeof width === "number") return width;
|
|
4302
|
-
return computeChartWidth(points, seriesCounts, niceMax, {
|
|
4303
|
-
minWidth: 300,
|
|
4304
|
-
maxWidth: 1800
|
|
4305
|
-
});
|
|
4306
|
-
}, [
|
|
4307
|
-
width,
|
|
4308
|
-
points,
|
|
4309
|
-
seriesCounts.bar,
|
|
4310
|
-
seriesCounts.line,
|
|
4311
|
-
seriesCounts.area,
|
|
4312
|
-
niceMax
|
|
4313
|
-
]);
|
|
4314
|
-
const measuredInner = measuredWidth ? Math.max(0, measuredWidth - 32) : void 0;
|
|
4315
|
-
const effectiveChartWidth = typeof width === "number" ? width : measuredInner ?? computedWidth;
|
|
4316
|
-
const estimatedLeftNeeded = computeEstimatedAxisNeeded(
|
|
4317
|
-
leftLabelSample ?? "",
|
|
4318
|
-
yAxisLabel,
|
|
4319
|
-
containerPaddingLeft,
|
|
4320
|
-
defaultChartLeftMargin
|
|
4321
|
-
);
|
|
4322
|
-
const estimatedRightNeeded = computeEstimatedAxisNeeded(
|
|
4323
|
-
rightLabelSample ?? "",
|
|
4324
|
-
yAxes?.right?.label,
|
|
4325
|
-
containerPaddingLeft,
|
|
4326
|
-
defaultChartRightMargin
|
|
4327
|
-
);
|
|
4328
|
-
const finalChartLeftMargin = chartMargin?.left ?? Math.max(estimatedLeftNeeded, yAxisLabel ? 40 : defaultChartLeftMargin);
|
|
4329
|
-
const finalChartRightMargin = chartMargin?.right ?? Math.max(defaultChartRightMargin, estimatedRightNeeded);
|
|
4330
|
-
const finalChartTopMargin = chartMargin?.top ?? (showLabels ? 48 : 20);
|
|
4331
|
-
const baseBottom = chartMargin?.bottom ?? 5;
|
|
4332
|
-
const extraForXAxisLabel = xAxisLabel ? 22 : 0;
|
|
4333
|
-
const extraForLegend = showLegend ? 36 : 0;
|
|
4334
|
-
const finalChartBottomMargin = baseBottom + extraForXAxisLabel + extraForLegend;
|
|
4335
|
-
const chartInnerWidth = effectiveChartWidth - finalChartLeftMargin - finalChartRightMargin;
|
|
4336
|
-
const leftAxisLabelWidth = computeAxisLabelWidth(
|
|
4337
|
-
yAxes?.left?.label ?? yAxisLabel
|
|
4338
|
-
);
|
|
4339
|
-
const rightAxisLabelWidth = computeAxisLabelWidth(yAxes?.right?.label);
|
|
4340
|
-
const leftYAxisLabelDx = Math.ceil(leftAxisLabelWidth / 2) + 8;
|
|
4341
|
-
const rightYAxisLabelDx = Math.ceil(rightAxisLabelWidth / 2) + 8;
|
|
4342
|
-
return {
|
|
4343
|
-
containerPaddingLeft,
|
|
4344
|
-
computedWidth,
|
|
4345
|
-
measuredInner,
|
|
4346
|
-
effectiveChartWidth,
|
|
4347
|
-
chartInnerWidth,
|
|
4348
|
-
finalChartLeftMargin,
|
|
4349
|
-
finalChartRightMargin,
|
|
4350
|
-
finalChartTopMargin,
|
|
4351
|
-
finalChartBottomMargin,
|
|
4352
|
-
leftYAxisLabelDx,
|
|
4353
|
-
rightYAxisLabelDx
|
|
3975
|
+
);
|
|
4354
3976
|
};
|
|
4355
|
-
}
|
|
3977
|
+
};
|
|
4356
3978
|
|
|
4357
3979
|
// src/components/charts/Chart.tsx
|
|
4358
|
-
var
|
|
3980
|
+
var import_jsx_runtime28 = require("react/jsx-runtime");
|
|
4359
3981
|
var DEFAULT_COLORS2 = ["#55af7d", "#8e68ff", "#2273e1"];
|
|
4360
3982
|
var Chart = ({
|
|
4361
3983
|
data,
|
|
@@ -4372,6 +3994,7 @@ var Chart = ({
|
|
|
4372
3994
|
titlePosition = "left",
|
|
4373
3995
|
showLabels = false,
|
|
4374
3996
|
xAxis,
|
|
3997
|
+
biaxial,
|
|
4375
3998
|
xAxisLabel,
|
|
4376
3999
|
yAxisLabel,
|
|
4377
4000
|
labelMap,
|
|
@@ -4382,14 +4005,12 @@ var Chart = ({
|
|
|
4382
4005
|
enablePeriodsDropdown = false,
|
|
4383
4006
|
enableDraggableTooltips = false,
|
|
4384
4007
|
showTooltipTotal = false,
|
|
4008
|
+
periodLabel = "Per\xEDodo",
|
|
4385
4009
|
maxTooltips = 5,
|
|
4386
4010
|
formatBR = false,
|
|
4387
|
-
chartMargin
|
|
4388
|
-
yAxisMap,
|
|
4389
|
-
yAxes,
|
|
4390
|
-
periodLabel = "Per\xEDodo"
|
|
4011
|
+
chartMargin
|
|
4391
4012
|
}) => {
|
|
4392
|
-
const smartConfig = (0,
|
|
4013
|
+
const smartConfig = (0, import_react21.useMemo)(() => {
|
|
4393
4014
|
const resolvedXAxisKey = typeof xAxis === "string" ? xAxis : xAxis && xAxis.dataKey || detectXAxis(data);
|
|
4394
4015
|
const xAxisConfig2 = typeof xAxis === "string" ? {
|
|
4395
4016
|
dataKey: resolvedXAxisKey,
|
|
@@ -4413,39 +4034,103 @@ var Chart = ({
|
|
|
4413
4034
|
return { xAxisConfig: xAxisConfig2, mapperConfig: mapperConfig2 };
|
|
4414
4035
|
}, [data, xAxis, labelMap]);
|
|
4415
4036
|
const { xAxisConfig, mapperConfig } = smartConfig;
|
|
4416
|
-
const [activeTooltips, setActiveTooltips] = (0,
|
|
4417
|
-
const [highlightedSeries, setHighlightedSeries] = (0,
|
|
4037
|
+
const [activeTooltips, setActiveTooltips] = (0, import_react21.useState)([]);
|
|
4038
|
+
const [highlightedSeries, setHighlightedSeries] = (0, import_react21.useState)(
|
|
4418
4039
|
/* @__PURE__ */ new Set()
|
|
4419
4040
|
);
|
|
4420
|
-
const [showOnlyHighlighted, setShowOnlyHighlighted] = (0,
|
|
4421
|
-
(0,
|
|
4041
|
+
const [showOnlyHighlighted, setShowOnlyHighlighted] = (0, import_react21.useState)(false);
|
|
4042
|
+
(0, import_react21.useEffect)(() => {
|
|
4422
4043
|
if (highlightedSeries.size === 0 && showOnlyHighlighted) {
|
|
4423
4044
|
setShowOnlyHighlighted(false);
|
|
4424
4045
|
}
|
|
4425
4046
|
}, [highlightedSeries, showOnlyHighlighted]);
|
|
4426
|
-
const processedData =
|
|
4427
|
-
|
|
4428
|
-
xAxisConfig.dataKey
|
|
4429
|
-
);
|
|
4430
|
-
const
|
|
4431
|
-
const
|
|
4432
|
-
|
|
4433
|
-
|
|
4434
|
-
()
|
|
4435
|
-
|
|
4436
|
-
|
|
4437
|
-
|
|
4438
|
-
|
|
4047
|
+
const processedData = data.map((item) => ({
|
|
4048
|
+
...item,
|
|
4049
|
+
name: String(item[xAxisConfig.dataKey] || "N/A")
|
|
4050
|
+
}));
|
|
4051
|
+
const wrapperRef = (0, import_react21.useRef)(null);
|
|
4052
|
+
const [measuredWidth, setMeasuredWidth] = (0, import_react21.useState)(null);
|
|
4053
|
+
(0, import_react21.useLayoutEffect)(() => {
|
|
4054
|
+
const el = wrapperRef.current;
|
|
4055
|
+
if (!el) return;
|
|
4056
|
+
const ro = new ResizeObserver((entries) => {
|
|
4057
|
+
const r = entries[0];
|
|
4058
|
+
if (r && typeof r.contentRect.width === "number") {
|
|
4059
|
+
setMeasuredWidth(Math.round(r.contentRect.width));
|
|
4060
|
+
}
|
|
4061
|
+
});
|
|
4062
|
+
ro.observe(el);
|
|
4063
|
+
setMeasuredWidth(Math.round(el.getBoundingClientRect().width));
|
|
4064
|
+
return () => ro.disconnect();
|
|
4065
|
+
}, []);
|
|
4066
|
+
const seriesOrder = [];
|
|
4067
|
+
if (series) {
|
|
4068
|
+
if (series.bar)
|
|
4069
|
+
series.bar.forEach((k) => seriesOrder.push({ type: "bar", key: k }));
|
|
4070
|
+
if (series.line)
|
|
4071
|
+
series.line.forEach((k) => seriesOrder.push({ type: "line", key: k }));
|
|
4072
|
+
if (series.area)
|
|
4073
|
+
series.area.forEach((k) => seriesOrder.push({ type: "area", key: k }));
|
|
4074
|
+
} else {
|
|
4075
|
+
Object.keys(mapperConfig).forEach(
|
|
4076
|
+
(k) => seriesOrder.push({ type: "bar", key: k })
|
|
4077
|
+
);
|
|
4078
|
+
}
|
|
4079
|
+
const allKeys = seriesOrder.map((s) => s.key).filter(Boolean);
|
|
4080
|
+
const generateColors = (0, import_react21.useCallback)(
|
|
4081
|
+
(dataKeys) => {
|
|
4082
|
+
const colorMap = {};
|
|
4083
|
+
const allColors = generateAdditionalColors(colors2, dataKeys.length);
|
|
4084
|
+
dataKeys.forEach((key, index) => {
|
|
4085
|
+
colorMap[key] = mapperConfig[key]?.color || allColors[index] || colors2[index % colors2.length];
|
|
4086
|
+
});
|
|
4087
|
+
return colorMap;
|
|
4088
|
+
},
|
|
4089
|
+
[colors2, mapperConfig]
|
|
4090
|
+
);
|
|
4091
|
+
const finalColors = (0, import_react21.useMemo)(
|
|
4092
|
+
() => generateColors(allKeys),
|
|
4093
|
+
[generateColors, allKeys]
|
|
4094
|
+
);
|
|
4095
|
+
const biaxialConfigNormalized = (0, import_react21.useMemo)(() => {
|
|
4096
|
+
if (!biaxial) return null;
|
|
4097
|
+
if (typeof biaxial === "string") return { key: [biaxial] };
|
|
4098
|
+
if (Array.isArray(biaxial)) return { key: biaxial };
|
|
4099
|
+
return biaxial;
|
|
4100
|
+
}, [biaxial]);
|
|
4101
|
+
(0, import_react21.useMemo)(() => {
|
|
4102
|
+
if (!biaxialConfigNormalized) return;
|
|
4103
|
+
const leftLabelMissing = !yAxisLabel || String(yAxisLabel).trim() === "";
|
|
4104
|
+
const rightLabelMissing = !biaxialConfigNormalized.label || String(biaxialConfigNormalized.label).trim() === "";
|
|
4105
|
+
if (leftLabelMissing || rightLabelMissing) {
|
|
4106
|
+
throw new Error(
|
|
4107
|
+
"When using `biaxial`, you must provide both `yAxisLabel` (left axis) and `biaxial.label` (right axis)."
|
|
4108
|
+
);
|
|
4109
|
+
}
|
|
4110
|
+
}, [biaxialConfigNormalized, yAxisLabel]);
|
|
4111
|
+
const rightKeys = (0, import_react21.useMemo)(
|
|
4112
|
+
() => biaxialConfigNormalized?.key ?? [],
|
|
4113
|
+
[biaxialConfigNormalized]
|
|
4114
|
+
);
|
|
4115
|
+
const leftKeys = (0, import_react21.useMemo)(
|
|
4116
|
+
() => allKeys.filter((k) => !rightKeys.includes(k)),
|
|
4117
|
+
[allKeys, rightKeys]
|
|
4118
|
+
);
|
|
4119
|
+
const adaptDataForTooltip = (0, import_react21.useCallback)(
|
|
4120
|
+
(universalData) => ({
|
|
4121
|
+
...universalData,
|
|
4122
|
+
name: String(universalData[xAxisConfig.dataKey] || "N/A")
|
|
4123
|
+
}),
|
|
4439
4124
|
[xAxisConfig.dataKey]
|
|
4440
4125
|
);
|
|
4441
|
-
const activePeriods = (0,
|
|
4442
|
-
() => activeTooltips.map((t) =>
|
|
4443
|
-
[activeTooltips,
|
|
4126
|
+
const activePeriods = (0, import_react21.useMemo)(
|
|
4127
|
+
() => activeTooltips.map((t) => adaptDataForTooltip(t.data).name),
|
|
4128
|
+
[activeTooltips, adaptDataForTooltip]
|
|
4444
4129
|
);
|
|
4445
|
-
(0,
|
|
4130
|
+
(0, import_react21.useEffect)(() => {
|
|
4446
4131
|
window.dispatchEvent(new Event("recountTooltips"));
|
|
4447
4132
|
}, [activeTooltips.length]);
|
|
4448
|
-
const toggleHighlight = (0,
|
|
4133
|
+
const toggleHighlight = (0, import_react21.useCallback)((key) => {
|
|
4449
4134
|
setHighlightedSeries((prev) => {
|
|
4450
4135
|
const next = new Set(prev);
|
|
4451
4136
|
if (next.has(key)) next.delete(key);
|
|
@@ -4453,47 +4138,104 @@ var Chart = ({
|
|
|
4453
4138
|
return next;
|
|
4454
4139
|
});
|
|
4455
4140
|
}, []);
|
|
4456
|
-
const
|
|
4457
|
-
|
|
4458
|
-
|
|
4459
|
-
|
|
4460
|
-
|
|
4461
|
-
|
|
4462
|
-
|
|
4463
|
-
|
|
4464
|
-
|
|
4465
|
-
|
|
4466
|
-
|
|
4467
|
-
);
|
|
4468
|
-
const
|
|
4469
|
-
|
|
4470
|
-
|
|
4471
|
-
|
|
4472
|
-
|
|
4473
|
-
|
|
4474
|
-
|
|
4475
|
-
|
|
4476
|
-
|
|
4477
|
-
|
|
4478
|
-
|
|
4479
|
-
|
|
4480
|
-
|
|
4481
|
-
|
|
4482
|
-
|
|
4483
|
-
|
|
4484
|
-
|
|
4485
|
-
|
|
4486
|
-
|
|
4487
|
-
|
|
4488
|
-
|
|
4489
|
-
|
|
4490
|
-
|
|
4141
|
+
const maxLeftDataValue = (0, import_react21.useMemo)(() => {
|
|
4142
|
+
let max = 0;
|
|
4143
|
+
const numericKeys = leftKeys.length > 0 ? leftKeys : allKeys;
|
|
4144
|
+
for (const row of processedData) {
|
|
4145
|
+
const r = row;
|
|
4146
|
+
for (const key of numericKeys) {
|
|
4147
|
+
const v = r[key];
|
|
4148
|
+
if (typeof v === "number" && Number.isFinite(v) && v > max) max = v;
|
|
4149
|
+
}
|
|
4150
|
+
}
|
|
4151
|
+
return max;
|
|
4152
|
+
}, [processedData, leftKeys, allKeys]);
|
|
4153
|
+
const minLeftDataValue = (0, import_react21.useMemo)(() => {
|
|
4154
|
+
let min = 0;
|
|
4155
|
+
const numericKeys = leftKeys.length > 0 ? leftKeys : allKeys;
|
|
4156
|
+
for (const row of processedData) {
|
|
4157
|
+
const r = row;
|
|
4158
|
+
for (const key of numericKeys) {
|
|
4159
|
+
const v = r[key];
|
|
4160
|
+
if (typeof v === "number" && Number.isFinite(v) && v < min)
|
|
4161
|
+
min = v;
|
|
4162
|
+
}
|
|
4163
|
+
}
|
|
4164
|
+
return min;
|
|
4165
|
+
}, [processedData, leftKeys, allKeys]);
|
|
4166
|
+
const maxRightDataValue = (0, import_react21.useMemo)(() => {
|
|
4167
|
+
let max = 0;
|
|
4168
|
+
if (rightKeys.length === 0) return max;
|
|
4169
|
+
for (const row of processedData) {
|
|
4170
|
+
const r = row;
|
|
4171
|
+
for (const key of rightKeys) {
|
|
4172
|
+
const v = r[key];
|
|
4173
|
+
if (typeof v === "number" && Number.isFinite(v) && v > max) max = v;
|
|
4174
|
+
}
|
|
4175
|
+
}
|
|
4176
|
+
return max;
|
|
4177
|
+
}, [processedData, rightKeys]);
|
|
4178
|
+
const minRightDataValue = (0, import_react21.useMemo)(() => {
|
|
4179
|
+
let min = 0;
|
|
4180
|
+
if (rightKeys.length === 0) return min;
|
|
4181
|
+
for (const row of processedData) {
|
|
4182
|
+
const r = row;
|
|
4183
|
+
for (const key of rightKeys) {
|
|
4184
|
+
const v = r[key];
|
|
4185
|
+
if (typeof v === "number" && Number.isFinite(v) && v < min)
|
|
4186
|
+
min = v;
|
|
4187
|
+
}
|
|
4188
|
+
}
|
|
4189
|
+
return min;
|
|
4190
|
+
}, [processedData, rightKeys]);
|
|
4191
|
+
const computeNiceMax = (0, import_react21.useCallback)((maxValue) => {
|
|
4192
|
+
let padding = 0.08;
|
|
4193
|
+
if (maxValue > 1e6) padding = 0.05;
|
|
4194
|
+
if (maxValue > 1e7) padding = 0.03;
|
|
4195
|
+
if (maxValue === 0) padding = 0.12;
|
|
4196
|
+
const padded = maxValue * (1 + padding);
|
|
4197
|
+
return niceCeil(padded);
|
|
4198
|
+
}, []);
|
|
4199
|
+
const niceMaxLeft = (0, import_react21.useMemo)(
|
|
4200
|
+
() => computeNiceMax(maxLeftDataValue),
|
|
4201
|
+
[computeNiceMax, maxLeftDataValue]
|
|
4491
4202
|
);
|
|
4492
|
-
const
|
|
4493
|
-
() =>
|
|
4494
|
-
[
|
|
4203
|
+
const niceMaxRight = (0, import_react21.useMemo)(
|
|
4204
|
+
() => computeNiceMax(maxRightDataValue),
|
|
4205
|
+
[computeNiceMax, maxRightDataValue]
|
|
4495
4206
|
);
|
|
4496
|
-
const
|
|
4207
|
+
const computedWidth = (0, import_react21.useMemo)(() => {
|
|
4208
|
+
if (typeof width === "number") return width;
|
|
4209
|
+
const points = Math.max(1, processedData.length);
|
|
4210
|
+
const barCount = series?.bar?.length ?? 0;
|
|
4211
|
+
const lineCount = series?.line?.length ?? 0;
|
|
4212
|
+
const areaCount = series?.area?.length ?? 0;
|
|
4213
|
+
const basePerPoint = 60;
|
|
4214
|
+
const perBarExtra = barCount > 0 ? Math.max(0, barCount - 1) * 8 : 0;
|
|
4215
|
+
const perOtherExtra = (lineCount + areaCount) * 4;
|
|
4216
|
+
const overallNiceMax = Math.max(niceMaxLeft || 0, niceMaxRight || 0);
|
|
4217
|
+
let sizeFactor = 1;
|
|
4218
|
+
if (overallNiceMax > 1e5) sizeFactor = 1.1;
|
|
4219
|
+
if (overallNiceMax > 1e6) sizeFactor = 1.2;
|
|
4220
|
+
if (overallNiceMax > 1e7) sizeFactor = 1.3;
|
|
4221
|
+
const perPoint = Math.round(
|
|
4222
|
+
(basePerPoint + perBarExtra + perOtherExtra) * sizeFactor
|
|
4223
|
+
);
|
|
4224
|
+
const marginExtra = 120;
|
|
4225
|
+
const calculated = points * perPoint + marginExtra;
|
|
4226
|
+
const minWidth = 300;
|
|
4227
|
+
const maxWidth = 1800;
|
|
4228
|
+
return Math.max(minWidth, Math.min(maxWidth, calculated));
|
|
4229
|
+
}, [
|
|
4230
|
+
width,
|
|
4231
|
+
processedData.length,
|
|
4232
|
+
series?.bar?.length,
|
|
4233
|
+
series?.line?.length,
|
|
4234
|
+
series?.area?.length,
|
|
4235
|
+
niceMaxLeft,
|
|
4236
|
+
niceMaxRight
|
|
4237
|
+
]);
|
|
4238
|
+
const toggleTooltip = (0, import_react21.useCallback)(
|
|
4497
4239
|
(tooltipId, data2, basePosition) => {
|
|
4498
4240
|
const existingIndex = activeTooltips.findIndex((t) => t.id === tooltipId);
|
|
4499
4241
|
if (existingIndex !== -1) {
|
|
@@ -4522,7 +4264,7 @@ var Chart = ({
|
|
|
4522
4264
|
},
|
|
4523
4265
|
[activeTooltips, maxTooltips]
|
|
4524
4266
|
);
|
|
4525
|
-
const handleChartClick = (0,
|
|
4267
|
+
const handleChartClick = (0, import_react21.useCallback)(
|
|
4526
4268
|
(e) => {
|
|
4527
4269
|
if (!enableDraggableTooltips) return;
|
|
4528
4270
|
const ev = e;
|
|
@@ -4540,7 +4282,7 @@ var Chart = ({
|
|
|
4540
4282
|
},
|
|
4541
4283
|
[enableDraggableTooltips, xAxisConfig.dataKey, toggleTooltip]
|
|
4542
4284
|
);
|
|
4543
|
-
const handleBarClick = (0,
|
|
4285
|
+
const handleBarClick = (0, import_react21.useCallback)(
|
|
4544
4286
|
(data2, index, event) => {
|
|
4545
4287
|
if (!enableDraggableTooltips) return;
|
|
4546
4288
|
event.stopPropagation();
|
|
@@ -4554,7 +4296,7 @@ var Chart = ({
|
|
|
4554
4296
|
},
|
|
4555
4297
|
[enableDraggableTooltips, xAxisConfig.dataKey, toggleTooltip]
|
|
4556
4298
|
);
|
|
4557
|
-
const handleSeriesClick = (0,
|
|
4299
|
+
const handleSeriesClick = (0, import_react21.useCallback)(
|
|
4558
4300
|
(...args) => {
|
|
4559
4301
|
if (args.length >= 3) {
|
|
4560
4302
|
const [data2, index, event] = args;
|
|
@@ -4565,7 +4307,7 @@ var Chart = ({
|
|
|
4565
4307
|
},
|
|
4566
4308
|
[handleBarClick, handleChartClick]
|
|
4567
4309
|
);
|
|
4568
|
-
const onTooltipPositionChange = (0,
|
|
4310
|
+
const onTooltipPositionChange = (0, import_react21.useCallback)(
|
|
4569
4311
|
(id, position) => {
|
|
4570
4312
|
setActiveTooltips(
|
|
4571
4313
|
(prev) => prev.map((t) => t.id === id ? { ...t, position } : t)
|
|
@@ -4573,75 +4315,94 @@ var Chart = ({
|
|
|
4573
4315
|
},
|
|
4574
4316
|
[]
|
|
4575
4317
|
);
|
|
4576
|
-
const titleClassName =
|
|
4577
|
-
|
|
4578
|
-
|
|
4579
|
-
[valueFormatter2, formatBR]
|
|
4580
|
-
);
|
|
4581
|
-
const yTickFormatter = (0, import_react23.useMemo)(
|
|
4582
|
-
() => createYTickFormatter(finalValueFormatter),
|
|
4583
|
-
[finalValueFormatter]
|
|
4318
|
+
const titleClassName = (0, import_react21.useMemo)(
|
|
4319
|
+
() => "text-xl font-semibold text-foreground mb-3",
|
|
4320
|
+
[]
|
|
4584
4321
|
);
|
|
4322
|
+
const finalValueFormatter = (0, import_react21.useMemo)(() => {
|
|
4323
|
+
const nf = new Intl.NumberFormat("pt-BR", {
|
|
4324
|
+
minimumFractionDigits: 2,
|
|
4325
|
+
maximumFractionDigits: 2
|
|
4326
|
+
});
|
|
4327
|
+
if (valueFormatter2) {
|
|
4328
|
+
if (formatBR) {
|
|
4329
|
+
const wrapped = (props) => {
|
|
4330
|
+
const { value, formattedValue } = props;
|
|
4331
|
+
let num = NaN;
|
|
4332
|
+
if (typeof value === "number") num = value;
|
|
4333
|
+
else if (typeof value === "string" && value.trim() !== "") {
|
|
4334
|
+
const parsed = Number(value);
|
|
4335
|
+
num = Number.isNaN(parsed) ? NaN : parsed;
|
|
4336
|
+
}
|
|
4337
|
+
const brFormatted = !Number.isNaN(num) ? nf.format(num) : String(formattedValue ?? value ?? "");
|
|
4338
|
+
return valueFormatter2({
|
|
4339
|
+
...props,
|
|
4340
|
+
formattedValue: brFormatted,
|
|
4341
|
+
value: void 0
|
|
4342
|
+
});
|
|
4343
|
+
};
|
|
4344
|
+
return wrapped;
|
|
4345
|
+
}
|
|
4346
|
+
return valueFormatter2;
|
|
4347
|
+
}
|
|
4348
|
+
if (!formatBR) return void 0;
|
|
4349
|
+
const builtIn = (props) => {
|
|
4350
|
+
const { value, formattedValue } = props;
|
|
4351
|
+
let num = NaN;
|
|
4352
|
+
if (typeof value === "number") num = value;
|
|
4353
|
+
else if (typeof value === "string" && value.trim() !== "") {
|
|
4354
|
+
const parsed = Number(value);
|
|
4355
|
+
num = Number.isNaN(parsed) ? NaN : parsed;
|
|
4356
|
+
}
|
|
4357
|
+
if (!Number.isNaN(num)) return nf.format(num);
|
|
4358
|
+
return String(formattedValue ?? value ?? "");
|
|
4359
|
+
};
|
|
4360
|
+
return builtIn;
|
|
4361
|
+
}, [valueFormatter2, formatBR]);
|
|
4362
|
+
const yTickFormatter = (0, import_react21.useMemo)(() => {
|
|
4363
|
+
const nf = new Intl.NumberFormat("pt-BR", {
|
|
4364
|
+
minimumFractionDigits: 2,
|
|
4365
|
+
maximumFractionDigits: 2
|
|
4366
|
+
});
|
|
4367
|
+
const stripCurrency = (s) => String(s).replace(/^\s*R\$\s?/, "");
|
|
4368
|
+
if (finalValueFormatter) {
|
|
4369
|
+
return (v) => {
|
|
4370
|
+
const num = Number(String(v));
|
|
4371
|
+
const formatted = Number.isNaN(num) ? String(v ?? "") : nf.format(num);
|
|
4372
|
+
const out = finalValueFormatter({
|
|
4373
|
+
value: v,
|
|
4374
|
+
formattedValue: formatted
|
|
4375
|
+
});
|
|
4376
|
+
return stripCurrency(String(out));
|
|
4377
|
+
};
|
|
4378
|
+
}
|
|
4379
|
+
return (value) => {
|
|
4380
|
+
const num = Number(String(value));
|
|
4381
|
+
return Number.isNaN(num) ? String(value ?? "") : nf.format(num);
|
|
4382
|
+
};
|
|
4383
|
+
}, [finalValueFormatter]);
|
|
4585
4384
|
const finalEnableHighlights = enableHighlights;
|
|
4586
4385
|
const finalEnableShowOnly = enableShowOnly;
|
|
4587
4386
|
const finalEnablePeriodsDropdown = enablePeriodsDropdown && enableDraggableTooltips;
|
|
4588
|
-
const
|
|
4589
|
-
|
|
4590
|
-
|
|
4591
|
-
|
|
4592
|
-
|
|
4593
|
-
|
|
4594
|
-
|
|
4595
|
-
|
|
4596
|
-
const
|
|
4597
|
-
|
|
4598
|
-
|
|
4599
|
-
|
|
4600
|
-
|
|
4601
|
-
|
|
4602
|
-
|
|
4603
|
-
|
|
4604
|
-
const
|
|
4605
|
-
|
|
4606
|
-
|
|
4607
|
-
measuredInner,
|
|
4608
|
-
chartInnerWidth,
|
|
4609
|
-
finalChartLeftMargin,
|
|
4610
|
-
finalChartRightMargin,
|
|
4611
|
-
finalChartTopMargin,
|
|
4612
|
-
finalChartBottomMargin,
|
|
4613
|
-
leftYAxisLabelDx,
|
|
4614
|
-
rightYAxisLabelDx
|
|
4615
|
-
} = useChartLayout({
|
|
4616
|
-
width,
|
|
4617
|
-
measuredWidth,
|
|
4618
|
-
points: Math.max(1, processedData.length),
|
|
4619
|
-
seriesCounts: {
|
|
4620
|
-
bar: series?.bar?.length ?? 0,
|
|
4621
|
-
line: series?.line?.length ?? 0,
|
|
4622
|
-
area: series?.area?.length ?? 0
|
|
4623
|
-
},
|
|
4624
|
-
niceMax,
|
|
4625
|
-
yAxes,
|
|
4626
|
-
yAxisLabel,
|
|
4627
|
-
chartMargin,
|
|
4628
|
-
showLabels,
|
|
4629
|
-
showLegend,
|
|
4630
|
-
xAxisLabel,
|
|
4631
|
-
leftLabelSample,
|
|
4632
|
-
rightLabelSample
|
|
4633
|
-
});
|
|
4634
|
-
const leftAxisTickFormatter = (0, import_react23.useMemo)(() => {
|
|
4635
|
-
if (yAxes?.left?.percent)
|
|
4636
|
-
return buildPercentFormatter(yAxes.left.percentDecimals ?? 0);
|
|
4637
|
-
return yTickFormatter;
|
|
4638
|
-
}, [yAxes?.left, yTickFormatter]);
|
|
4639
|
-
const rightAxisTickFormatter = (0, import_react23.useMemo)(() => {
|
|
4640
|
-
if (yAxes?.right?.percent)
|
|
4641
|
-
return buildPercentFormatter(yAxes.right.percentDecimals ?? 0);
|
|
4642
|
-
return yTickFormatter;
|
|
4643
|
-
}, [yAxes?.right, yTickFormatter]);
|
|
4644
|
-
const openTooltipForPeriod = (0, import_react23.useCallback)(
|
|
4387
|
+
const defaultChartRightMargin = 30;
|
|
4388
|
+
const defaultChartLeftMargin = 0;
|
|
4389
|
+
const axisLabelMargin = 56;
|
|
4390
|
+
const containerPaddingLeft = 16;
|
|
4391
|
+
const finalChartRightMargin = chartMargin?.right ?? (rightKeys.length > 0 ? axisLabelMargin : defaultChartRightMargin);
|
|
4392
|
+
const finalChartLeftMargin = chartMargin?.left ?? (yAxisLabel ? axisLabelMargin : defaultChartLeftMargin);
|
|
4393
|
+
const composedChartLeftMargin = chartMargin?.left ?? defaultChartLeftMargin;
|
|
4394
|
+
const composedChartRightMargin = chartMargin?.right ?? defaultChartRightMargin;
|
|
4395
|
+
const finalChartTopMargin = chartMargin?.top ?? (showLabels ? 48 : 20);
|
|
4396
|
+
const baseBottom = chartMargin?.bottom ?? 5;
|
|
4397
|
+
const extraForXAxisLabel = xAxisLabel ? 22 : 0;
|
|
4398
|
+
const extraForLegend = showLegend ? 36 : 0;
|
|
4399
|
+
const finalChartBottomMargin = baseBottom + extraForXAxisLabel + extraForLegend;
|
|
4400
|
+
const measuredInner = measuredWidth ? Math.max(0, measuredWidth - 32) : void 0;
|
|
4401
|
+
const effectiveChartWidth = typeof width === "number" ? width : measuredInner ?? computedWidth;
|
|
4402
|
+
const chartInnerWidth = effectiveChartWidth - composedChartLeftMargin - composedChartRightMargin;
|
|
4403
|
+
const leftYAxisLabelDx = -Math.max(12, Math.round(finalChartLeftMargin / 2));
|
|
4404
|
+
const rightYAxisLabelDx = Math.max(12, Math.round(finalChartRightMargin / 2));
|
|
4405
|
+
const openTooltipForPeriod = (0, import_react21.useCallback)(
|
|
4645
4406
|
(periodName) => {
|
|
4646
4407
|
if (!enableDraggableTooltips) return;
|
|
4647
4408
|
const row = processedData.find((r) => String(r.name) === periodName);
|
|
@@ -4686,31 +4447,41 @@ var Chart = ({
|
|
|
4686
4447
|
);
|
|
4687
4448
|
if (!data) return null;
|
|
4688
4449
|
if (Array.isArray(data) && data.length === 0) {
|
|
4689
|
-
return /* @__PURE__ */ (0,
|
|
4690
|
-
|
|
4450
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4451
|
+
"div",
|
|
4691
4452
|
{
|
|
4692
|
-
|
|
4693
|
-
|
|
4694
|
-
|
|
4453
|
+
className: cn(
|
|
4454
|
+
"rounded-lg bg-card p-4 relative w-full text-muted-foreground"
|
|
4455
|
+
),
|
|
4456
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4457
|
+
"div",
|
|
4458
|
+
{
|
|
4459
|
+
style: {
|
|
4460
|
+
paddingLeft: `${containerPaddingLeft + finalChartLeftMargin}px`
|
|
4461
|
+
},
|
|
4462
|
+
children: "Sem dados para exibir"
|
|
4463
|
+
}
|
|
4464
|
+
)
|
|
4695
4465
|
}
|
|
4696
4466
|
);
|
|
4697
4467
|
}
|
|
4698
|
-
return /* @__PURE__ */ (0,
|
|
4468
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4699
4469
|
"div",
|
|
4700
4470
|
{
|
|
4701
4471
|
ref: wrapperRef,
|
|
4702
4472
|
style: {
|
|
4703
4473
|
width: "100%",
|
|
4704
|
-
|
|
4474
|
+
overflowX: "hidden",
|
|
4475
|
+
overflowY: "hidden",
|
|
4705
4476
|
minWidth: 0
|
|
4706
4477
|
},
|
|
4707
|
-
children: /* @__PURE__ */ (0,
|
|
4478
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
|
|
4708
4479
|
"div",
|
|
4709
4480
|
{
|
|
4710
4481
|
className: cn("rounded-lg bg-card p-2 relative", className),
|
|
4711
4482
|
style: { width: "100%", maxWidth: "100%", minWidth: 0 },
|
|
4712
4483
|
children: [
|
|
4713
|
-
title && /* @__PURE__ */ (0,
|
|
4484
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4714
4485
|
"div",
|
|
4715
4486
|
{
|
|
4716
4487
|
style: {
|
|
@@ -4721,10 +4492,10 @@ var Chart = ({
|
|
|
4721
4492
|
alignItems: "center",
|
|
4722
4493
|
marginTop: 4
|
|
4723
4494
|
},
|
|
4724
|
-
children: /* @__PURE__ */ (0,
|
|
4495
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("h3", { className: titleClassName, children: title })
|
|
4725
4496
|
}
|
|
4726
4497
|
),
|
|
4727
|
-
allKeys.length > 0 && (finalEnableHighlights || finalEnableShowOnly) && /* @__PURE__ */ (0,
|
|
4498
|
+
allKeys.length > 0 && (finalEnableHighlights || finalEnableShowOnly) && /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
|
|
4728
4499
|
"div",
|
|
4729
4500
|
{
|
|
4730
4501
|
className: "flex items-center w-full",
|
|
@@ -4736,7 +4507,7 @@ var Chart = ({
|
|
|
4736
4507
|
gap: "0.5rem"
|
|
4737
4508
|
},
|
|
4738
4509
|
children: [
|
|
4739
|
-
finalEnableHighlights && /* @__PURE__ */ (0,
|
|
4510
|
+
finalEnableHighlights && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4740
4511
|
Highlights_default,
|
|
4741
4512
|
{
|
|
4742
4513
|
allKeys,
|
|
@@ -4747,7 +4518,7 @@ var Chart = ({
|
|
|
4747
4518
|
containerWidth: chartInnerWidth
|
|
4748
4519
|
}
|
|
4749
4520
|
),
|
|
4750
|
-
finalEnableShowOnly && /* @__PURE__ */ (0,
|
|
4521
|
+
finalEnableShowOnly && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4751
4522
|
ShowOnly_default,
|
|
4752
4523
|
{
|
|
4753
4524
|
showOnlyHighlighted,
|
|
@@ -4756,7 +4527,7 @@ var Chart = ({
|
|
|
4756
4527
|
clearHighlights: () => setHighlightedSeries(/* @__PURE__ */ new Set())
|
|
4757
4528
|
}
|
|
4758
4529
|
),
|
|
4759
|
-
finalEnablePeriodsDropdown && /* @__PURE__ */ (0,
|
|
4530
|
+
finalEnablePeriodsDropdown && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4760
4531
|
"div",
|
|
4761
4532
|
{
|
|
4762
4533
|
style: {
|
|
@@ -4764,7 +4535,7 @@ var Chart = ({
|
|
|
4764
4535
|
display: "flex",
|
|
4765
4536
|
alignItems: "center"
|
|
4766
4537
|
},
|
|
4767
|
-
children: /* @__PURE__ */ (0,
|
|
4538
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4768
4539
|
PeriodsDropdown_default,
|
|
4769
4540
|
{
|
|
4770
4541
|
processedData,
|
|
@@ -4778,7 +4549,7 @@ var Chart = ({
|
|
|
4778
4549
|
]
|
|
4779
4550
|
}
|
|
4780
4551
|
),
|
|
4781
|
-
!(allKeys.length > 0 && (finalEnableHighlights || finalEnableShowOnly)) && finalEnablePeriodsDropdown && /* @__PURE__ */ (0,
|
|
4552
|
+
!(allKeys.length > 0 && (finalEnableHighlights || finalEnableShowOnly)) && finalEnablePeriodsDropdown && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4782
4553
|
"div",
|
|
4783
4554
|
{
|
|
4784
4555
|
style: {
|
|
@@ -4789,7 +4560,7 @@ var Chart = ({
|
|
|
4789
4560
|
display: "flex",
|
|
4790
4561
|
justifyContent: "flex-end"
|
|
4791
4562
|
},
|
|
4792
|
-
children: /* @__PURE__ */ (0,
|
|
4563
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4793
4564
|
PeriodsDropdown_default,
|
|
4794
4565
|
{
|
|
4795
4566
|
processedData,
|
|
@@ -4799,7 +4570,7 @@ var Chart = ({
|
|
|
4799
4570
|
)
|
|
4800
4571
|
}
|
|
4801
4572
|
),
|
|
4802
|
-
/* @__PURE__ */ (0,
|
|
4573
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_recharts.ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
|
|
4803
4574
|
import_recharts.ComposedChart,
|
|
4804
4575
|
{
|
|
4805
4576
|
data: processedData,
|
|
@@ -4812,110 +4583,58 @@ var Chart = ({
|
|
|
4812
4583
|
},
|
|
4813
4584
|
onClick: handleChartClick,
|
|
4814
4585
|
children: [
|
|
4815
|
-
showGrid && /* @__PURE__ */ (0,
|
|
4586
|
+
showGrid && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4816
4587
|
import_recharts.CartesianGrid,
|
|
4817
4588
|
{
|
|
4818
4589
|
strokeDasharray: "3 3",
|
|
4819
4590
|
stroke: gridColor || "hsl(var(--muted-foreground))",
|
|
4820
4591
|
opacity: 0.5
|
|
4821
|
-
}
|
|
4822
|
-
),
|
|
4823
|
-
/* @__PURE__ */ (0,
|
|
4824
|
-
import_recharts.XAxis,
|
|
4825
|
-
{
|
|
4826
|
-
dataKey: xAxisConfig.dataKey,
|
|
4827
|
-
stroke: "hsl(var(--muted-foreground))",
|
|
4828
|
-
fontSize: 12,
|
|
4829
|
-
tickLine: false,
|
|
4830
|
-
axisLine: false,
|
|
4831
|
-
tickFormatter: (value) => {
|
|
4832
|
-
if (categoryFormatter)
|
|
4833
|
-
return categoryFormatter(value);
|
|
4834
|
-
if (xAxisConfig.valueFormatter)
|
|
4835
|
-
return xAxisConfig.valueFormatter(value);
|
|
4836
|
-
return String(value ?? "");
|
|
4837
|
-
},
|
|
4838
|
-
label: xAxisLabel ? {
|
|
4839
|
-
value: xAxisLabel,
|
|
4840
|
-
position: "
|
|
4841
|
-
offset:
|
|
4842
|
-
style: {
|
|
4843
|
-
fontSize: 12,
|
|
4844
|
-
fill: "hsl(var(--muted-foreground))",
|
|
4845
|
-
fontWeight: 500
|
|
4846
|
-
}
|
|
4847
|
-
} : void 0
|
|
4848
|
-
}
|
|
4849
|
-
),
|
|
4850
|
-
|
|
4851
|
-
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
4852
|
-
import_recharts.YAxis,
|
|
4853
|
-
{
|
|
4854
|
-
yAxisId: "left",
|
|
4855
|
-
stroke: yAxes?.left?.stroke || "hsl(var(--muted-foreground))",
|
|
4856
|
-
width: yAxes?.left?.width,
|
|
4857
|
-
fontSize: 12,
|
|
4858
|
-
tickLine: false,
|
|
4859
|
-
axisLine: false,
|
|
4860
|
-
tickFormatter: leftAxisTickFormatter,
|
|
4861
|
-
domain: [Math.min(minLeft, 0), niceMaxLeft],
|
|
4862
|
-
tickCount: 6,
|
|
4863
|
-
label: yAxes?.left?.label ?? yAxisLabel ? {
|
|
4864
|
-
value: yAxes?.left?.label ?? yAxisLabel,
|
|
4865
|
-
angle: -90,
|
|
4866
|
-
position: "left",
|
|
4867
|
-
dx: -leftYAxisLabelDx,
|
|
4868
|
-
style: {
|
|
4869
|
-
fontSize: 12,
|
|
4870
|
-
fill: "hsl(var(--muted-foreground))",
|
|
4871
|
-
fontWeight: 500,
|
|
4872
|
-
textAnchor: "middle"
|
|
4873
|
-
}
|
|
4874
|
-
} : void 0
|
|
4875
|
-
}
|
|
4876
|
-
),
|
|
4877
|
-
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
4878
|
-
import_recharts.YAxis,
|
|
4879
|
-
{
|
|
4880
|
-
yAxisId: "right",
|
|
4881
|
-
orientation: "right",
|
|
4882
|
-
stroke: yAxes?.right?.stroke || "hsl(var(--muted-foreground))",
|
|
4883
|
-
width: yAxes?.right?.width,
|
|
4884
|
-
fontSize: 12,
|
|
4885
|
-
tickLine: false,
|
|
4886
|
-
axisLine: false,
|
|
4887
|
-
tickFormatter: rightAxisTickFormatter,
|
|
4888
|
-
domain: [Math.min(minRight, 0), niceMaxRight],
|
|
4889
|
-
tickCount: 6,
|
|
4890
|
-
label: yAxes?.right?.label ? {
|
|
4891
|
-
value: yAxes?.right?.label,
|
|
4892
|
-
angle: -90,
|
|
4893
|
-
position: "right",
|
|
4894
|
-
dx: rightYAxisLabelDx,
|
|
4895
|
-
style: {
|
|
4896
|
-
fontSize: 12,
|
|
4897
|
-
fill: "hsl(var(--muted-foreground))",
|
|
4898
|
-
fontWeight: 500,
|
|
4899
|
-
textAnchor: "middle"
|
|
4900
|
-
}
|
|
4901
|
-
} : void 0
|
|
4902
|
-
}
|
|
4903
|
-
)
|
|
4904
|
-
] }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_jsx_runtime29.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
4592
|
+
}
|
|
4593
|
+
),
|
|
4594
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4595
|
+
import_recharts.XAxis,
|
|
4596
|
+
{
|
|
4597
|
+
dataKey: xAxisConfig.dataKey,
|
|
4598
|
+
stroke: "hsl(var(--muted-foreground))",
|
|
4599
|
+
fontSize: 12,
|
|
4600
|
+
tickLine: false,
|
|
4601
|
+
axisLine: false,
|
|
4602
|
+
tickFormatter: (value) => {
|
|
4603
|
+
if (categoryFormatter)
|
|
4604
|
+
return categoryFormatter(value);
|
|
4605
|
+
if (xAxisConfig.valueFormatter)
|
|
4606
|
+
return xAxisConfig.valueFormatter(value);
|
|
4607
|
+
return String(value ?? "");
|
|
4608
|
+
},
|
|
4609
|
+
label: xAxisLabel ? {
|
|
4610
|
+
value: xAxisLabel,
|
|
4611
|
+
position: "insideBottomRight",
|
|
4612
|
+
offset: -5,
|
|
4613
|
+
style: {
|
|
4614
|
+
fontSize: 12,
|
|
4615
|
+
fill: "hsl(var(--muted-foreground))",
|
|
4616
|
+
fontWeight: 500
|
|
4617
|
+
}
|
|
4618
|
+
} : void 0
|
|
4619
|
+
}
|
|
4620
|
+
),
|
|
4621
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4905
4622
|
import_recharts.YAxis,
|
|
4906
4623
|
{
|
|
4624
|
+
yAxisId: "left",
|
|
4625
|
+
width: finalChartLeftMargin,
|
|
4907
4626
|
stroke: "hsl(var(--muted-foreground))",
|
|
4908
4627
|
fontSize: 12,
|
|
4909
4628
|
tickLine: false,
|
|
4910
4629
|
axisLine: false,
|
|
4911
4630
|
tickFormatter: yTickFormatter,
|
|
4912
|
-
domain: [Math.min(
|
|
4631
|
+
domain: [Math.min(minLeftDataValue, 0), niceMaxLeft],
|
|
4913
4632
|
tickCount: 6,
|
|
4914
4633
|
label: yAxisLabel ? {
|
|
4915
4634
|
value: yAxisLabel,
|
|
4916
4635
|
angle: -90,
|
|
4917
4636
|
position: "left",
|
|
4918
|
-
dx:
|
|
4637
|
+
dx: leftYAxisLabelDx,
|
|
4919
4638
|
style: {
|
|
4920
4639
|
fontSize: 12,
|
|
4921
4640
|
fill: "hsl(var(--muted-foreground))",
|
|
@@ -4924,44 +4643,94 @@ var Chart = ({
|
|
|
4924
4643
|
}
|
|
4925
4644
|
} : void 0
|
|
4926
4645
|
}
|
|
4927
|
-
)
|
|
4928
|
-
|
|
4646
|
+
),
|
|
4647
|
+
minLeftDataValue < 0 && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4929
4648
|
import_recharts.ReferenceLine,
|
|
4930
4649
|
{
|
|
4931
4650
|
y: 0,
|
|
4651
|
+
yAxisId: "left",
|
|
4932
4652
|
stroke: "hsl(var(--muted-foreground))",
|
|
4933
4653
|
strokeWidth: 1,
|
|
4934
4654
|
strokeDasharray: "4 4"
|
|
4935
4655
|
}
|
|
4936
4656
|
),
|
|
4937
|
-
|
|
4657
|
+
rightKeys.length > 0 && (() => {
|
|
4658
|
+
const decimals = typeof biaxialConfigNormalized?.decimals === "number" ? Math.max(0, Math.floor(biaxialConfigNormalized.decimals)) : 2;
|
|
4659
|
+
const rightTickFormatter = (v) => {
|
|
4660
|
+
if (biaxialConfigNormalized?.percentage) {
|
|
4661
|
+
const num = Number(String(v));
|
|
4662
|
+
const nf = new Intl.NumberFormat("pt-BR", {
|
|
4663
|
+
minimumFractionDigits: decimals,
|
|
4664
|
+
maximumFractionDigits: decimals
|
|
4665
|
+
});
|
|
4666
|
+
const out = Number.isNaN(num) ? String(v ?? "") : nf.format(num);
|
|
4667
|
+
return `${out}%`;
|
|
4668
|
+
}
|
|
4669
|
+
return yTickFormatter(v);
|
|
4670
|
+
};
|
|
4671
|
+
const firstRightKey = biaxialConfigNormalized?.key && biaxialConfigNormalized.key[0];
|
|
4672
|
+
const defaultRightColor = firstRightKey && finalColors[firstRightKey] || "hsl(var(--muted-foreground))";
|
|
4673
|
+
const rightAxisColor = (() => {
|
|
4674
|
+
if (!biaxialConfigNormalized) return defaultRightColor;
|
|
4675
|
+
if (typeof biaxialConfigNormalized.stroke === "string")
|
|
4676
|
+
return biaxialConfigNormalized.stroke;
|
|
4677
|
+
if (biaxialConfigNormalized.stroke && firstRightKey && typeof biaxialConfigNormalized.stroke === "object")
|
|
4678
|
+
return biaxialConfigNormalized.stroke[firstRightKey] || defaultRightColor;
|
|
4679
|
+
return defaultRightColor;
|
|
4680
|
+
})();
|
|
4681
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4682
|
+
import_recharts.YAxis,
|
|
4683
|
+
{
|
|
4684
|
+
yAxisId: "right",
|
|
4685
|
+
width: finalChartRightMargin,
|
|
4686
|
+
orientation: "right",
|
|
4687
|
+
stroke: "hsl(var(--muted-foreground))",
|
|
4688
|
+
fontSize: 12,
|
|
4689
|
+
tickLine: false,
|
|
4690
|
+
axisLine: false,
|
|
4691
|
+
tick: { fill: rightAxisColor },
|
|
4692
|
+
tickFormatter: rightTickFormatter,
|
|
4693
|
+
domain: [Math.min(minRightDataValue, 0), niceMaxRight],
|
|
4694
|
+
tickCount: 6,
|
|
4695
|
+
label: biaxialConfigNormalized?.label ? {
|
|
4696
|
+
value: biaxialConfigNormalized.label,
|
|
4697
|
+
angle: -90,
|
|
4698
|
+
position: "right",
|
|
4699
|
+
dx: rightYAxisLabelDx,
|
|
4700
|
+
style: {
|
|
4701
|
+
fontSize: 12,
|
|
4702
|
+
fill: "hsl(var(--muted-foreground))",
|
|
4703
|
+
fontWeight: 500,
|
|
4704
|
+
textAnchor: "middle"
|
|
4705
|
+
}
|
|
4706
|
+
} : void 0
|
|
4707
|
+
}
|
|
4708
|
+
);
|
|
4709
|
+
})(),
|
|
4710
|
+
showTooltip && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4938
4711
|
import_recharts.Tooltip,
|
|
4939
4712
|
{
|
|
4940
|
-
content: showTooltipTotal ? /* @__PURE__ */ (0,
|
|
4713
|
+
content: showTooltipTotal ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4941
4714
|
TooltipWithTotal_default,
|
|
4942
4715
|
{
|
|
4943
|
-
periodLabel,
|
|
4944
4716
|
finalColors,
|
|
4945
4717
|
valueFormatter: finalValueFormatter,
|
|
4946
4718
|
categoryFormatter,
|
|
4947
|
-
|
|
4948
|
-
isBiaxial: rightKeys.length > 0
|
|
4719
|
+
periodLabel
|
|
4949
4720
|
}
|
|
4950
|
-
) : /* @__PURE__ */ (0,
|
|
4721
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4951
4722
|
TooltipSimple_default,
|
|
4952
4723
|
{
|
|
4953
|
-
periodLabel,
|
|
4954
4724
|
finalColors,
|
|
4955
4725
|
valueFormatter: finalValueFormatter,
|
|
4956
4726
|
categoryFormatter,
|
|
4957
|
-
|
|
4958
|
-
isBiaxial: rightKeys.length > 0
|
|
4727
|
+
periodLabel
|
|
4959
4728
|
}
|
|
4960
4729
|
),
|
|
4961
4730
|
cursor: { fill: "hsl(var(--muted))", opacity: 0.1 }
|
|
4962
4731
|
}
|
|
4963
4732
|
),
|
|
4964
|
-
showLegend && /* @__PURE__ */ (0,
|
|
4733
|
+
showLegend && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4965
4734
|
import_recharts.Legend,
|
|
4966
4735
|
{
|
|
4967
4736
|
wrapperStyle: {
|
|
@@ -4973,25 +4742,23 @@ var Chart = ({
|
|
|
4973
4742
|
),
|
|
4974
4743
|
seriesOrder.map((s) => {
|
|
4975
4744
|
const key = s.key;
|
|
4976
|
-
const rawMapped = rightKeys.length > 0 ? yAxisMap?.[key] ?? "left" : void 0;
|
|
4977
|
-
const seriesYAxisId = (() => {
|
|
4978
|
-
if (rawMapped === void 0) return void 0;
|
|
4979
|
-
if (rawMapped === "left" || rawMapped === "right")
|
|
4980
|
-
return rawMapped;
|
|
4981
|
-
if (rawMapped === 1 || rawMapped === "1" || rawMapped === "right")
|
|
4982
|
-
return "right";
|
|
4983
|
-
return "left";
|
|
4984
|
-
})();
|
|
4985
4745
|
if (showOnlyHighlighted && !highlightedSeries.has(key))
|
|
4986
4746
|
return null;
|
|
4987
4747
|
const label = mapperConfig[key]?.label ?? labelMap?.[key] ?? formatFieldName(key);
|
|
4988
|
-
|
|
4748
|
+
let color = finalColors[key];
|
|
4749
|
+
if (rightKeys.includes(key) && biaxialConfigNormalized?.stroke) {
|
|
4750
|
+
if (typeof biaxialConfigNormalized.stroke === "string") {
|
|
4751
|
+
color = biaxialConfigNormalized.stroke;
|
|
4752
|
+
} else {
|
|
4753
|
+
color = biaxialConfigNormalized.stroke[key] ?? color;
|
|
4754
|
+
}
|
|
4755
|
+
}
|
|
4989
4756
|
if (s.type === "bar") {
|
|
4990
|
-
return /* @__PURE__ */ (0,
|
|
4757
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4991
4758
|
import_recharts.Bar,
|
|
4992
4759
|
{
|
|
4993
|
-
yAxisId: seriesYAxisId,
|
|
4994
4760
|
dataKey: key,
|
|
4761
|
+
yAxisId: rightKeys.includes(key) ? "right" : "left",
|
|
4995
4762
|
name: label,
|
|
4996
4763
|
fill: color,
|
|
4997
4764
|
radius: [4, 4, 0, 0],
|
|
@@ -5000,7 +4767,7 @@ var Chart = ({
|
|
|
5000
4767
|
cursor: "pointer",
|
|
5001
4768
|
opacity: highlightedSeries.size > 0 ? highlightedSeries.has(key) ? 1 : 0.25 : 1
|
|
5002
4769
|
},
|
|
5003
|
-
activeBar: /* @__PURE__ */ (0,
|
|
4770
|
+
activeBar: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
5004
4771
|
import_recharts.Rectangle,
|
|
5005
4772
|
{
|
|
5006
4773
|
fill: color,
|
|
@@ -5009,17 +4776,16 @@ var Chart = ({
|
|
|
5009
4776
|
opacity: 0.8
|
|
5010
4777
|
}
|
|
5011
4778
|
),
|
|
5012
|
-
children: showLabels && highlightedSeries.size === 0 || highlightedSeries.has(key) ? /* @__PURE__ */ (0,
|
|
4779
|
+
children: showLabels && highlightedSeries.size === 0 || highlightedSeries.has(key) ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
5013
4780
|
import_recharts.LabelList,
|
|
5014
4781
|
{
|
|
5015
4782
|
dataKey: key,
|
|
5016
|
-
position: "
|
|
5017
|
-
content:
|
|
4783
|
+
position: "insideTop",
|
|
4784
|
+
content: renderInsideBarLabel(
|
|
5018
4785
|
color,
|
|
5019
|
-
"filled",
|
|
5020
4786
|
finalValueFormatter
|
|
5021
4787
|
),
|
|
5022
|
-
offset:
|
|
4788
|
+
offset: 0
|
|
5023
4789
|
}
|
|
5024
4790
|
) : null
|
|
5025
4791
|
},
|
|
@@ -5027,11 +4793,11 @@ var Chart = ({
|
|
|
5027
4793
|
);
|
|
5028
4794
|
}
|
|
5029
4795
|
if (s.type === "line") {
|
|
5030
|
-
return /* @__PURE__ */ (0,
|
|
4796
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
5031
4797
|
import_recharts.Line,
|
|
5032
4798
|
{
|
|
5033
|
-
yAxisId: seriesYAxisId,
|
|
5034
4799
|
dataKey: key,
|
|
4800
|
+
yAxisId: rightKeys.includes(key) ? "right" : "left",
|
|
5035
4801
|
name: label,
|
|
5036
4802
|
stroke: color,
|
|
5037
4803
|
strokeWidth: 2,
|
|
@@ -5043,7 +4809,7 @@ var Chart = ({
|
|
|
5043
4809
|
pointerEvents: "all",
|
|
5044
4810
|
opacity: highlightedSeries.size > 0 ? highlightedSeries.has(key) ? 1 : 0.25 : 1
|
|
5045
4811
|
},
|
|
5046
|
-
children: showLabels && highlightedSeries.size === 0 || highlightedSeries.has(key) ? /* @__PURE__ */ (0,
|
|
4812
|
+
children: showLabels && highlightedSeries.size === 0 || highlightedSeries.has(key) ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
5047
4813
|
import_recharts.LabelList,
|
|
5048
4814
|
{
|
|
5049
4815
|
dataKey: key,
|
|
@@ -5061,11 +4827,11 @@ var Chart = ({
|
|
|
5061
4827
|
);
|
|
5062
4828
|
}
|
|
5063
4829
|
if (s.type === "area") {
|
|
5064
|
-
return /* @__PURE__ */ (0,
|
|
4830
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
5065
4831
|
import_recharts.Area,
|
|
5066
4832
|
{
|
|
5067
|
-
yAxisId: seriesYAxisId,
|
|
5068
4833
|
dataKey: key,
|
|
4834
|
+
yAxisId: rightKeys.includes(key) ? "right" : "left",
|
|
5069
4835
|
name: label,
|
|
5070
4836
|
stroke: color,
|
|
5071
4837
|
fill: color,
|
|
@@ -5077,7 +4843,7 @@ var Chart = ({
|
|
|
5077
4843
|
pointerEvents: "all",
|
|
5078
4844
|
opacity: highlightedSeries.size > 0 ? highlightedSeries.has(key) ? 1 : 0.25 : 1
|
|
5079
4845
|
},
|
|
5080
|
-
children: showLabels && highlightedSeries.size === 0 || highlightedSeries.has(key) ? /* @__PURE__ */ (0,
|
|
4846
|
+
children: showLabels && highlightedSeries.size === 0 || highlightedSeries.has(key) ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
5081
4847
|
import_recharts.LabelList,
|
|
5082
4848
|
{
|
|
5083
4849
|
dataKey: key,
|
|
@@ -5099,11 +4865,11 @@ var Chart = ({
|
|
|
5099
4865
|
]
|
|
5100
4866
|
}
|
|
5101
4867
|
) }),
|
|
5102
|
-
enableDraggableTooltips && activeTooltips.map((tooltip) => /* @__PURE__ */ (0,
|
|
4868
|
+
enableDraggableTooltips && activeTooltips.map((tooltip) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
5103
4869
|
DraggableTooltip_default,
|
|
5104
4870
|
{
|
|
5105
4871
|
id: tooltip.id,
|
|
5106
|
-
data:
|
|
4872
|
+
data: adaptDataForTooltip(tooltip.data),
|
|
5107
4873
|
position: tooltip.position,
|
|
5108
4874
|
title,
|
|
5109
4875
|
dataKeys: allKeys,
|
|
@@ -5124,7 +4890,7 @@ var Chart = ({
|
|
|
5124
4890
|
},
|
|
5125
4891
|
tooltip.id
|
|
5126
4892
|
)),
|
|
5127
|
-
enableDraggableTooltips && activeTooltips.length > 1 && /* @__PURE__ */ (0,
|
|
4893
|
+
enableDraggableTooltips && activeTooltips.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
5128
4894
|
CloseAllButton_default,
|
|
5129
4895
|
{
|
|
5130
4896
|
count: activeTooltips.length,
|
|
@@ -5142,9 +4908,9 @@ var Chart = ({
|
|
|
5142
4908
|
var Chart_default = Chart;
|
|
5143
4909
|
|
|
5144
4910
|
// src/components/charts/BarChart.tsx
|
|
5145
|
-
var
|
|
4911
|
+
var import_react22 = require("react");
|
|
5146
4912
|
var import_recharts2 = require("recharts");
|
|
5147
|
-
var
|
|
4913
|
+
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
5148
4914
|
var DEFAULT_COLORS3 = ["#55af7d", "#8e68ff", "#2273e1"];
|
|
5149
4915
|
var BarChart = ({
|
|
5150
4916
|
data,
|
|
@@ -5174,7 +4940,7 @@ var BarChart = ({
|
|
|
5174
4940
|
containerPaddingLeft,
|
|
5175
4941
|
16
|
|
5176
4942
|
);
|
|
5177
|
-
const smartConfig = (0,
|
|
4943
|
+
const smartConfig = (0, import_react22.useMemo)(() => {
|
|
5178
4944
|
const providedMapper = yAxis ?? mapper;
|
|
5179
4945
|
if (autoDetect === true || xAxis == null || providedMapper == null) {
|
|
5180
4946
|
const detectedXAxis = detectXAxis(data);
|
|
@@ -5224,20 +4990,20 @@ var BarChart = ({
|
|
|
5224
4990
|
return { xAxisConfig: xAxisConfig2, mapperConfig: mapperConfig2 };
|
|
5225
4991
|
}, [data, xAxis, mapper, yAxis, autoDetect, labelMap]);
|
|
5226
4992
|
const { xAxisConfig, mapperConfig } = smartConfig;
|
|
5227
|
-
const [activeTooltips, setActiveTooltips] = (0,
|
|
5228
|
-
const [isDragging, setIsDragging] = (0,
|
|
5229
|
-
const [dragOffset, setDragOffset] = (0,
|
|
4993
|
+
const [activeTooltips, setActiveTooltips] = (0, import_react22.useState)([]);
|
|
4994
|
+
const [isDragging, setIsDragging] = (0, import_react22.useState)(null);
|
|
4995
|
+
const [dragOffset, setDragOffset] = (0, import_react22.useState)({
|
|
5230
4996
|
x: 0,
|
|
5231
4997
|
y: 0
|
|
5232
4998
|
});
|
|
5233
|
-
const [globalTooltipCount, setGlobalTooltipCount] = (0,
|
|
5234
|
-
const [alignmentGuides, setAlignmentGuides] = (0,
|
|
4999
|
+
const [globalTooltipCount, setGlobalTooltipCount] = (0, import_react22.useState)(0);
|
|
5000
|
+
const [alignmentGuides, setAlignmentGuides] = (0, import_react22.useState)([]);
|
|
5235
5001
|
const processedData = data.map((item) => ({
|
|
5236
5002
|
...item,
|
|
5237
5003
|
name: String(item[xAxisConfig.dataKey] || "N/A")
|
|
5238
5004
|
// Garantir propriedade 'name' para tooltip
|
|
5239
5005
|
}));
|
|
5240
|
-
const
|
|
5006
|
+
const generateColors = (dataKeys2) => {
|
|
5241
5007
|
const colorMap = {};
|
|
5242
5008
|
const allColors = generateAdditionalColors(colors2, dataKeys2.length);
|
|
5243
5009
|
dataKeys2.forEach((key, index) => {
|
|
@@ -5246,15 +5012,15 @@ var BarChart = ({
|
|
|
5246
5012
|
return colorMap;
|
|
5247
5013
|
};
|
|
5248
5014
|
const dataKeys = Object.keys(mapperConfig);
|
|
5249
|
-
const finalColors =
|
|
5250
|
-
const
|
|
5015
|
+
const finalColors = generateColors(dataKeys);
|
|
5016
|
+
const adaptDataForTooltip = (universalData) => {
|
|
5251
5017
|
return {
|
|
5252
5018
|
...universalData,
|
|
5253
5019
|
name: String(universalData[xAxisConfig.dataKey] || "N/A")
|
|
5254
5020
|
// Garantir que tem a propriedade 'name'
|
|
5255
5021
|
};
|
|
5256
5022
|
};
|
|
5257
|
-
const maxDataValue = (0,
|
|
5023
|
+
const maxDataValue = (0, import_react22.useMemo)(() => {
|
|
5258
5024
|
let max = 0;
|
|
5259
5025
|
const keys = Object.keys(mapperConfig);
|
|
5260
5026
|
for (const row of processedData) {
|
|
@@ -5267,7 +5033,7 @@ var BarChart = ({
|
|
|
5267
5033
|
}
|
|
5268
5034
|
return max;
|
|
5269
5035
|
}, [processedData, mapperConfig]);
|
|
5270
|
-
const niceMax = (0,
|
|
5036
|
+
const niceMax = (0, import_react22.useMemo)(() => {
|
|
5271
5037
|
let padding2 = 0.08;
|
|
5272
5038
|
if (maxDataValue > 1e6) padding2 = 0.05;
|
|
5273
5039
|
if (maxDataValue > 1e7) padding2 = 0.03;
|
|
@@ -5308,7 +5074,7 @@ var BarChart = ({
|
|
|
5308
5074
|
const GUIDE_THRESHOLD2 = 60;
|
|
5309
5075
|
const STRONG_SNAP_THRESHOLD2 = 35;
|
|
5310
5076
|
const PRECISION_SNAP_THRESHOLD2 = 8;
|
|
5311
|
-
const updateAlignmentGuides = (0,
|
|
5077
|
+
const updateAlignmentGuides = (0, import_react22.useCallback)(
|
|
5312
5078
|
(draggedTooltipId, currentPosition) => {
|
|
5313
5079
|
if (!isDragging) return;
|
|
5314
5080
|
const getAllTooltips = () => {
|
|
@@ -5372,7 +5138,7 @@ var BarChart = ({
|
|
|
5372
5138
|
},
|
|
5373
5139
|
[isDragging, activeTooltips]
|
|
5374
5140
|
);
|
|
5375
|
-
const snapToGuides = (0,
|
|
5141
|
+
const snapToGuides = (0, import_react22.useCallback)(
|
|
5376
5142
|
(position) => {
|
|
5377
5143
|
const snappedPosition = { ...position };
|
|
5378
5144
|
let hasSnapped = false;
|
|
@@ -5434,7 +5200,7 @@ var BarChart = ({
|
|
|
5434
5200
|
setIsDragging(tooltipId);
|
|
5435
5201
|
setDragOffset({ x: offsetX, y: offsetY });
|
|
5436
5202
|
};
|
|
5437
|
-
(0,
|
|
5203
|
+
(0, import_react22.useEffect)(() => {
|
|
5438
5204
|
let rafId;
|
|
5439
5205
|
let lastMousePosition = { x: 0, y: 0 };
|
|
5440
5206
|
const handleGlobalMouseMove = (e) => {
|
|
@@ -5492,7 +5258,7 @@ var BarChart = ({
|
|
|
5492
5258
|
updateAlignmentGuides,
|
|
5493
5259
|
snapToGuides
|
|
5494
5260
|
]);
|
|
5495
|
-
(0,
|
|
5261
|
+
(0, import_react22.useEffect)(() => {
|
|
5496
5262
|
const handleCloseAllTooltips = () => {
|
|
5497
5263
|
setActiveTooltips([]);
|
|
5498
5264
|
setGlobalTooltipCount(0);
|
|
@@ -5502,7 +5268,7 @@ var BarChart = ({
|
|
|
5502
5268
|
window.removeEventListener("closeAllTooltips", handleCloseAllTooltips);
|
|
5503
5269
|
};
|
|
5504
5270
|
}, []);
|
|
5505
|
-
(0,
|
|
5271
|
+
(0, import_react22.useEffect)(() => {
|
|
5506
5272
|
const handleTooltipCountRequest = () => {
|
|
5507
5273
|
window.dispatchEvent(
|
|
5508
5274
|
new CustomEvent("tooltipCountResponse", {
|
|
@@ -5541,7 +5307,7 @@ var BarChart = ({
|
|
|
5541
5307
|
);
|
|
5542
5308
|
};
|
|
5543
5309
|
}, [activeTooltips]);
|
|
5544
|
-
(0,
|
|
5310
|
+
(0, import_react22.useEffect)(() => {
|
|
5545
5311
|
if (isDragging) return;
|
|
5546
5312
|
let totalCount = 0;
|
|
5547
5313
|
const handleCountResponse = (event) => {
|
|
@@ -5565,25 +5331,25 @@ var BarChart = ({
|
|
|
5565
5331
|
label
|
|
5566
5332
|
}) => {
|
|
5567
5333
|
if (!active || !payload) return null;
|
|
5568
|
-
return /* @__PURE__ */ (0,
|
|
5569
|
-
/* @__PURE__ */ (0,
|
|
5334
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "bg-card border border-border rounded-lg p-3 shadow-lg", children: [
|
|
5335
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)("p", { className: "font-medium text-foreground mb-2", children: label }),
|
|
5570
5336
|
payload.map(
|
|
5571
|
-
(entry, index) => /* @__PURE__ */ (0,
|
|
5572
|
-
/* @__PURE__ */ (0,
|
|
5337
|
+
(entry, index) => /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex items-center gap-2 text-sm", children: [
|
|
5338
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
5573
5339
|
"div",
|
|
5574
5340
|
{
|
|
5575
5341
|
className: "w-3 h-3 rounded-sm",
|
|
5576
5342
|
style: { backgroundColor: entry.color }
|
|
5577
5343
|
}
|
|
5578
5344
|
),
|
|
5579
|
-
/* @__PURE__ */ (0,
|
|
5345
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("span", { className: "text-muted-foreground", children: [
|
|
5580
5346
|
entry.name,
|
|
5581
5347
|
":"
|
|
5582
5348
|
] }),
|
|
5583
|
-
/* @__PURE__ */ (0,
|
|
5349
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "text-foreground font-medium", children: entry.value?.toLocaleString("pt-BR") })
|
|
5584
5350
|
] }, index)
|
|
5585
5351
|
),
|
|
5586
|
-
/* @__PURE__ */ (0,
|
|
5352
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)("p", { className: "text-xs text-muted-foreground mt-1", children: "Clique para fixar este tooltip" })
|
|
5587
5353
|
] });
|
|
5588
5354
|
};
|
|
5589
5355
|
const getTitleClassName = (position) => {
|
|
@@ -5597,7 +5363,7 @@ var BarChart = ({
|
|
|
5597
5363
|
return `${baseClasses} text-left`;
|
|
5598
5364
|
}
|
|
5599
5365
|
};
|
|
5600
|
-
return /* @__PURE__ */ (0,
|
|
5366
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
|
|
5601
5367
|
"div",
|
|
5602
5368
|
{
|
|
5603
5369
|
className: cn("rounded-lg bg-card p-4 relative", className),
|
|
@@ -5606,8 +5372,8 @@ var BarChart = ({
|
|
|
5606
5372
|
maxWidth: "100%"
|
|
5607
5373
|
},
|
|
5608
5374
|
children: [
|
|
5609
|
-
title && /* @__PURE__ */ (0,
|
|
5610
|
-
/* @__PURE__ */ (0,
|
|
5375
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { style: { paddingLeft: `${resolvedContainerPaddingLeft}px` }, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("h3", { className: getTitleClassName(titlePosition), children: title }) }),
|
|
5376
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
|
|
5611
5377
|
import_recharts2.BarChart,
|
|
5612
5378
|
{
|
|
5613
5379
|
data: processedData,
|
|
@@ -5616,7 +5382,7 @@ var BarChart = ({
|
|
|
5616
5382
|
margin: resolveChartMargins(margins, chartMargins, showLabels),
|
|
5617
5383
|
onClick: handleChartClick,
|
|
5618
5384
|
children: [
|
|
5619
|
-
showGrid && /* @__PURE__ */ (0,
|
|
5385
|
+
showGrid && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
5620
5386
|
import_recharts2.CartesianGrid,
|
|
5621
5387
|
{
|
|
5622
5388
|
strokeDasharray: "3 3",
|
|
@@ -5624,7 +5390,7 @@ var BarChart = ({
|
|
|
5624
5390
|
opacity: 0.5
|
|
5625
5391
|
}
|
|
5626
5392
|
),
|
|
5627
|
-
/* @__PURE__ */ (0,
|
|
5393
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
5628
5394
|
import_recharts2.XAxis,
|
|
5629
5395
|
{
|
|
5630
5396
|
dataKey: xAxisConfig.dataKey,
|
|
@@ -5635,7 +5401,7 @@ var BarChart = ({
|
|
|
5635
5401
|
tickFormatter: xAxisConfig.valueFormatter
|
|
5636
5402
|
}
|
|
5637
5403
|
),
|
|
5638
|
-
/* @__PURE__ */ (0,
|
|
5404
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
5639
5405
|
import_recharts2.YAxis,
|
|
5640
5406
|
{
|
|
5641
5407
|
stroke: "hsl(var(--muted-foreground))",
|
|
@@ -5647,14 +5413,14 @@ var BarChart = ({
|
|
|
5647
5413
|
tickCount: 6
|
|
5648
5414
|
}
|
|
5649
5415
|
),
|
|
5650
|
-
showTooltip && /* @__PURE__ */ (0,
|
|
5416
|
+
showTooltip && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
5651
5417
|
import_recharts2.Tooltip,
|
|
5652
5418
|
{
|
|
5653
|
-
content: /* @__PURE__ */ (0,
|
|
5419
|
+
content: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(CustomTooltip, {}),
|
|
5654
5420
|
cursor: { fill: "hsl(var(--muted))", opacity: 0.1 }
|
|
5655
5421
|
}
|
|
5656
5422
|
),
|
|
5657
|
-
showLegend && /* @__PURE__ */ (0,
|
|
5423
|
+
showLegend && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
5658
5424
|
import_recharts2.Legend,
|
|
5659
5425
|
{
|
|
5660
5426
|
wrapperStyle: {
|
|
@@ -5665,7 +5431,7 @@ var BarChart = ({
|
|
|
5665
5431
|
),
|
|
5666
5432
|
dataKeys.map((key) => {
|
|
5667
5433
|
const fieldConfig = mapperConfig[key];
|
|
5668
|
-
return /* @__PURE__ */ (0,
|
|
5434
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
5669
5435
|
import_recharts2.Bar,
|
|
5670
5436
|
{
|
|
5671
5437
|
dataKey: key,
|
|
@@ -5674,7 +5440,7 @@ var BarChart = ({
|
|
|
5674
5440
|
radius: [4, 4, 0, 0],
|
|
5675
5441
|
onClick: handleBarClick,
|
|
5676
5442
|
style: { cursor: "pointer" },
|
|
5677
|
-
activeBar: /* @__PURE__ */ (0,
|
|
5443
|
+
activeBar: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
5678
5444
|
import_recharts2.Rectangle,
|
|
5679
5445
|
{
|
|
5680
5446
|
fill: finalColors[key],
|
|
@@ -5683,7 +5449,7 @@ var BarChart = ({
|
|
|
5683
5449
|
opacity: 0.8
|
|
5684
5450
|
}
|
|
5685
5451
|
),
|
|
5686
|
-
children: showLabels && /* @__PURE__ */ (0,
|
|
5452
|
+
children: showLabels && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
5687
5453
|
import_recharts2.LabelList,
|
|
5688
5454
|
{
|
|
5689
5455
|
dataKey: key,
|
|
@@ -5720,8 +5486,8 @@ var BarChart = ({
|
|
|
5720
5486
|
guide.sourceTooltip.top + guide.sourceTooltip.height / 2,
|
|
5721
5487
|
guide.targetTooltip.top + guide.targetTooltip.height / 2
|
|
5722
5488
|
);
|
|
5723
|
-
return /* @__PURE__ */ (0,
|
|
5724
|
-
/* @__PURE__ */ (0,
|
|
5489
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { children: [
|
|
5490
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
5725
5491
|
"div",
|
|
5726
5492
|
{
|
|
5727
5493
|
className: "fixed pointer-events-none z-30",
|
|
@@ -5740,7 +5506,7 @@ var BarChart = ({
|
|
|
5740
5506
|
}
|
|
5741
5507
|
}
|
|
5742
5508
|
),
|
|
5743
|
-
/* @__PURE__ */ (0,
|
|
5509
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
5744
5510
|
"div",
|
|
5745
5511
|
{
|
|
5746
5512
|
className: "fixed pointer-events-none z-31",
|
|
@@ -5756,7 +5522,7 @@ var BarChart = ({
|
|
|
5756
5522
|
}
|
|
5757
5523
|
}
|
|
5758
5524
|
),
|
|
5759
|
-
/* @__PURE__ */ (0,
|
|
5525
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
5760
5526
|
"div",
|
|
5761
5527
|
{
|
|
5762
5528
|
className: "fixed pointer-events-none z-31",
|
|
@@ -5774,11 +5540,11 @@ var BarChart = ({
|
|
|
5774
5540
|
)
|
|
5775
5541
|
] }, index);
|
|
5776
5542
|
}),
|
|
5777
|
-
activeTooltips.map((tooltip, index) => /* @__PURE__ */ (0,
|
|
5543
|
+
activeTooltips.map((tooltip, index) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
5778
5544
|
DraggableTooltip_default,
|
|
5779
5545
|
{
|
|
5780
5546
|
id: tooltip.id,
|
|
5781
|
-
data:
|
|
5547
|
+
data: adaptDataForTooltip(tooltip.data),
|
|
5782
5548
|
position: tooltip.position,
|
|
5783
5549
|
isDragging: isDragging === tooltip.id,
|
|
5784
5550
|
title,
|
|
@@ -5807,9 +5573,9 @@ var BarChart = ({
|
|
|
5807
5573
|
var BarChart_default = BarChart;
|
|
5808
5574
|
|
|
5809
5575
|
// src/components/charts/LineChart.tsx
|
|
5810
|
-
var
|
|
5576
|
+
var import_react23 = require("react");
|
|
5811
5577
|
var import_recharts3 = require("recharts");
|
|
5812
|
-
var
|
|
5578
|
+
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
5813
5579
|
var defaultData = [
|
|
5814
5580
|
{ name: "A", value: 100 },
|
|
5815
5581
|
{ name: "B", value: 200 },
|
|
@@ -5841,15 +5607,15 @@ var CustomLineChart = ({
|
|
|
5841
5607
|
containerPaddingLeft,
|
|
5842
5608
|
16
|
|
5843
5609
|
);
|
|
5844
|
-
const [activeTooltips, setActiveTooltips] = (0,
|
|
5845
|
-
const [isDragging, setIsDragging] = (0,
|
|
5846
|
-
const [dragOffset, setDragOffset] = (0,
|
|
5610
|
+
const [activeTooltips, setActiveTooltips] = (0, import_react23.useState)([]);
|
|
5611
|
+
const [isDragging, setIsDragging] = (0, import_react23.useState)(null);
|
|
5612
|
+
const [dragOffset, setDragOffset] = (0, import_react23.useState)({
|
|
5847
5613
|
x: 0,
|
|
5848
5614
|
y: 0
|
|
5849
5615
|
});
|
|
5850
|
-
const [globalTooltipCount, setGlobalTooltipCount] = (0,
|
|
5851
|
-
const [alignmentGuides, setAlignmentGuides] = (0,
|
|
5852
|
-
const
|
|
5616
|
+
const [globalTooltipCount, setGlobalTooltipCount] = (0, import_react23.useState)(0);
|
|
5617
|
+
const [alignmentGuides, setAlignmentGuides] = (0, import_react23.useState)([]);
|
|
5618
|
+
const generateColors = (dataKeys2) => {
|
|
5853
5619
|
const colorMap = {};
|
|
5854
5620
|
const allColors = generateAdditionalColors(colors2, dataKeys2.length);
|
|
5855
5621
|
dataKeys2.forEach((key, index) => {
|
|
@@ -5857,12 +5623,12 @@ var CustomLineChart = ({
|
|
|
5857
5623
|
});
|
|
5858
5624
|
return colorMap;
|
|
5859
5625
|
};
|
|
5860
|
-
const dataKeys = (0,
|
|
5626
|
+
const dataKeys = (0, import_react23.useMemo)(
|
|
5861
5627
|
() => data.length > 0 ? Object.keys(data[0]).filter((key) => key !== "name") : [],
|
|
5862
5628
|
[data]
|
|
5863
5629
|
);
|
|
5864
|
-
const finalColors =
|
|
5865
|
-
const maxDataValue = (0,
|
|
5630
|
+
const finalColors = generateColors(dataKeys);
|
|
5631
|
+
const maxDataValue = (0, import_react23.useMemo)(() => {
|
|
5866
5632
|
let max = 0;
|
|
5867
5633
|
for (const row of data) {
|
|
5868
5634
|
const r = row;
|
|
@@ -5874,7 +5640,7 @@ var CustomLineChart = ({
|
|
|
5874
5640
|
}
|
|
5875
5641
|
return max;
|
|
5876
5642
|
}, [data, dataKeys]);
|
|
5877
|
-
const niceMax = (0,
|
|
5643
|
+
const niceMax = (0, import_react23.useMemo)(() => {
|
|
5878
5644
|
let padding2 = 0.08;
|
|
5879
5645
|
if (maxDataValue > 1e6) padding2 = 0.05;
|
|
5880
5646
|
if (maxDataValue > 1e7) padding2 = 0.03;
|
|
@@ -5908,7 +5674,7 @@ var CustomLineChart = ({
|
|
|
5908
5674
|
setActiveTooltips((prev) => [...prev, newTooltip]);
|
|
5909
5675
|
}
|
|
5910
5676
|
};
|
|
5911
|
-
return /* @__PURE__ */ (0,
|
|
5677
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
5912
5678
|
"circle",
|
|
5913
5679
|
{
|
|
5914
5680
|
cx,
|
|
@@ -5950,10 +5716,10 @@ var CustomLineChart = ({
|
|
|
5950
5716
|
const handleChartBackgroundClick = () => {
|
|
5951
5717
|
setActiveTooltips([]);
|
|
5952
5718
|
};
|
|
5953
|
-
const handleCloseAllTooltips = (0,
|
|
5719
|
+
const handleCloseAllTooltips = (0, import_react23.useCallback)(() => {
|
|
5954
5720
|
window.dispatchEvent(new CustomEvent("closeAllTooltips"));
|
|
5955
5721
|
}, []);
|
|
5956
|
-
const updateAlignmentGuides = (0,
|
|
5722
|
+
const updateAlignmentGuides = (0, import_react23.useCallback)(
|
|
5957
5723
|
(draggedTooltipId, draggedPosition) => {
|
|
5958
5724
|
const SNAP_THRESHOLD = 15;
|
|
5959
5725
|
const draggedTooltip = activeTooltips.find(
|
|
@@ -6034,7 +5800,7 @@ var CustomLineChart = ({
|
|
|
6034
5800
|
},
|
|
6035
5801
|
[activeTooltips]
|
|
6036
5802
|
);
|
|
6037
|
-
const snapToGuides = (0,
|
|
5803
|
+
const snapToGuides = (0, import_react23.useCallback)(
|
|
6038
5804
|
(position) => {
|
|
6039
5805
|
const SNAP_DISTANCE = 10;
|
|
6040
5806
|
const snappedPosition = { ...position };
|
|
@@ -6062,7 +5828,7 @@ var CustomLineChart = ({
|
|
|
6062
5828
|
setIsDragging(tooltipId);
|
|
6063
5829
|
setDragOffset({ x: offsetX, y: offsetY });
|
|
6064
5830
|
};
|
|
6065
|
-
(0,
|
|
5831
|
+
(0, import_react23.useEffect)(() => {
|
|
6066
5832
|
let rafId;
|
|
6067
5833
|
let lastMousePosition = { x: 0, y: 0 };
|
|
6068
5834
|
const handleGlobalMouseMove = (e) => {
|
|
@@ -6109,7 +5875,7 @@ var CustomLineChart = ({
|
|
|
6109
5875
|
updateAlignmentGuides,
|
|
6110
5876
|
snapToGuides
|
|
6111
5877
|
]);
|
|
6112
|
-
(0,
|
|
5878
|
+
(0, import_react23.useEffect)(() => {
|
|
6113
5879
|
const handleCloseAllTooltips2 = () => {
|
|
6114
5880
|
setActiveTooltips([]);
|
|
6115
5881
|
setGlobalTooltipCount(0);
|
|
@@ -6119,7 +5885,7 @@ var CustomLineChart = ({
|
|
|
6119
5885
|
window.removeEventListener("closeAllTooltips", handleCloseAllTooltips2);
|
|
6120
5886
|
};
|
|
6121
5887
|
}, []);
|
|
6122
|
-
(0,
|
|
5888
|
+
(0, import_react23.useEffect)(() => {
|
|
6123
5889
|
const handleTooltipCountRequest = () => {
|
|
6124
5890
|
window.dispatchEvent(
|
|
6125
5891
|
new CustomEvent("tooltipCountResponse", {
|
|
@@ -6163,7 +5929,7 @@ var CustomLineChart = ({
|
|
|
6163
5929
|
);
|
|
6164
5930
|
};
|
|
6165
5931
|
}, [activeTooltips]);
|
|
6166
|
-
(0,
|
|
5932
|
+
(0, import_react23.useEffect)(() => {
|
|
6167
5933
|
if (isDragging) return;
|
|
6168
5934
|
let totalCount = 0;
|
|
6169
5935
|
const handleCountResponse = (event) => {
|
|
@@ -6191,7 +5957,7 @@ var CustomLineChart = ({
|
|
|
6191
5957
|
return "text-left";
|
|
6192
5958
|
}
|
|
6193
5959
|
};
|
|
6194
|
-
return /* @__PURE__ */ (0,
|
|
5960
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: cn("relative", className), children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
|
|
6195
5961
|
"div",
|
|
6196
5962
|
{
|
|
6197
5963
|
className: "rounded-lg bg-card p-4 relative border border-border",
|
|
@@ -6201,8 +5967,8 @@ var CustomLineChart = ({
|
|
|
6201
5967
|
},
|
|
6202
5968
|
onClick: handleChartBackgroundClick,
|
|
6203
5969
|
children: [
|
|
6204
|
-
title && /* @__PURE__ */ (0,
|
|
6205
|
-
/* @__PURE__ */ (0,
|
|
5970
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { style: { paddingLeft: `${resolvedContainerPaddingLeft}px` }, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: cn("mb-4", getTitleClass()), children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("h3", { className: "text-lg font-semibold text-foreground", children: title }) }) }),
|
|
5971
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
|
|
6206
5972
|
import_recharts3.LineChart,
|
|
6207
5973
|
{
|
|
6208
5974
|
data,
|
|
@@ -6211,7 +5977,7 @@ var CustomLineChart = ({
|
|
|
6211
5977
|
margin: resolveChartMargins(margins, chartMargins, showLabels),
|
|
6212
5978
|
onClick: handleChartClick,
|
|
6213
5979
|
children: [
|
|
6214
|
-
showGrid && /* @__PURE__ */ (0,
|
|
5980
|
+
showGrid && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
6215
5981
|
import_recharts3.CartesianGrid,
|
|
6216
5982
|
{
|
|
6217
5983
|
strokeDasharray: "3 3",
|
|
@@ -6219,7 +5985,7 @@ var CustomLineChart = ({
|
|
|
6219
5985
|
opacity: 0.3
|
|
6220
5986
|
}
|
|
6221
5987
|
),
|
|
6222
|
-
/* @__PURE__ */ (0,
|
|
5988
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
6223
5989
|
import_recharts3.XAxis,
|
|
6224
5990
|
{
|
|
6225
5991
|
dataKey: "name",
|
|
@@ -6227,7 +5993,7 @@ var CustomLineChart = ({
|
|
|
6227
5993
|
fontSize: 12
|
|
6228
5994
|
}
|
|
6229
5995
|
),
|
|
6230
|
-
/* @__PURE__ */ (0,
|
|
5996
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
6231
5997
|
import_recharts3.YAxis,
|
|
6232
5998
|
{
|
|
6233
5999
|
className: "fill-muted-foreground text-xs",
|
|
@@ -6237,8 +6003,8 @@ var CustomLineChart = ({
|
|
|
6237
6003
|
tickCount: 6
|
|
6238
6004
|
}
|
|
6239
6005
|
),
|
|
6240
|
-
showTooltip && /* @__PURE__ */ (0,
|
|
6241
|
-
showLegend && /* @__PURE__ */ (0,
|
|
6006
|
+
showTooltip && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_recharts3.Tooltip, { content: () => null }),
|
|
6007
|
+
showLegend && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
6242
6008
|
import_recharts3.Legend,
|
|
6243
6009
|
{
|
|
6244
6010
|
wrapperStyle: {
|
|
@@ -6247,7 +6013,7 @@ var CustomLineChart = ({
|
|
|
6247
6013
|
}
|
|
6248
6014
|
}
|
|
6249
6015
|
),
|
|
6250
|
-
dataKeys.map((key) => /* @__PURE__ */ (0,
|
|
6016
|
+
dataKeys.map((key) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
6251
6017
|
import_recharts3.Line,
|
|
6252
6018
|
{
|
|
6253
6019
|
type: "monotone",
|
|
@@ -6255,8 +6021,8 @@ var CustomLineChart = ({
|
|
|
6255
6021
|
stroke: finalColors[key],
|
|
6256
6022
|
strokeWidth,
|
|
6257
6023
|
dot: showDots ? { r: 4, cursor: "pointer" } : false,
|
|
6258
|
-
activeDot: (props) => /* @__PURE__ */ (0,
|
|
6259
|
-
children: showLabels && /* @__PURE__ */ (0,
|
|
6024
|
+
activeDot: (props) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ClickableDot, { ...props, dataKey: key }),
|
|
6025
|
+
children: showLabels && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
6260
6026
|
import_recharts3.LabelList,
|
|
6261
6027
|
{
|
|
6262
6028
|
dataKey: key,
|
|
@@ -6293,8 +6059,8 @@ var CustomLineChart = ({
|
|
|
6293
6059
|
guide.sourceTooltip.top + guide.sourceTooltip.height / 2,
|
|
6294
6060
|
guide.targetTooltip.top + guide.targetTooltip.height / 2
|
|
6295
6061
|
);
|
|
6296
|
-
return /* @__PURE__ */ (0,
|
|
6297
|
-
/* @__PURE__ */ (0,
|
|
6062
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { children: [
|
|
6063
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
6298
6064
|
"div",
|
|
6299
6065
|
{
|
|
6300
6066
|
className: "fixed pointer-events-none z-30",
|
|
@@ -6313,7 +6079,7 @@ var CustomLineChart = ({
|
|
|
6313
6079
|
}
|
|
6314
6080
|
}
|
|
6315
6081
|
),
|
|
6316
|
-
/* @__PURE__ */ (0,
|
|
6082
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
6317
6083
|
"div",
|
|
6318
6084
|
{
|
|
6319
6085
|
className: "fixed pointer-events-none z-31",
|
|
@@ -6329,7 +6095,7 @@ var CustomLineChart = ({
|
|
|
6329
6095
|
}
|
|
6330
6096
|
}
|
|
6331
6097
|
),
|
|
6332
|
-
/* @__PURE__ */ (0,
|
|
6098
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
6333
6099
|
"div",
|
|
6334
6100
|
{
|
|
6335
6101
|
className: "fixed pointer-events-none z-31",
|
|
@@ -6347,7 +6113,7 @@ var CustomLineChart = ({
|
|
|
6347
6113
|
)
|
|
6348
6114
|
] }, index);
|
|
6349
6115
|
}),
|
|
6350
|
-
activeTooltips.map((tooltip, index) => /* @__PURE__ */ (0,
|
|
6116
|
+
activeTooltips.map((tooltip, index) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
6351
6117
|
DraggableTooltip_default,
|
|
6352
6118
|
{
|
|
6353
6119
|
id: tooltip.id,
|
|
@@ -6379,7 +6145,7 @@ var LineChart_default = CustomLineChart;
|
|
|
6379
6145
|
|
|
6380
6146
|
// src/components/charts/PieChart.tsx
|
|
6381
6147
|
var import_recharts4 = require("recharts");
|
|
6382
|
-
var
|
|
6148
|
+
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
6383
6149
|
var defaultData2 = [
|
|
6384
6150
|
{ name: "Vendas", value: 4e3 },
|
|
6385
6151
|
{ name: "Marketing", value: 3e3 },
|
|
@@ -6417,7 +6183,7 @@ var renderCustomizedLabel = ({
|
|
|
6417
6183
|
const radius = innerRadius + (outerRadius - innerRadius) * 0.5;
|
|
6418
6184
|
const x = cx + radius * Math.cos(-midAngle * RADIAN);
|
|
6419
6185
|
const y = cy + radius * Math.sin(-midAngle * RADIAN);
|
|
6420
|
-
return /* @__PURE__ */ (0,
|
|
6186
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
6421
6187
|
"text",
|
|
6422
6188
|
{
|
|
6423
6189
|
x,
|
|
@@ -6446,8 +6212,8 @@ var CustomPieChart = ({
|
|
|
6446
6212
|
centerY = "50%"
|
|
6447
6213
|
}) => {
|
|
6448
6214
|
const finalColors = colors2 || DEFAULT_COLORS5;
|
|
6449
|
-
return /* @__PURE__ */ (0,
|
|
6450
|
-
/* @__PURE__ */ (0,
|
|
6215
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: cn("w-full rounded-lg bg-card p-4", className), children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_recharts4.ResponsiveContainer, { width, height, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_recharts4.PieChart, { children: [
|
|
6216
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
6451
6217
|
import_recharts4.Pie,
|
|
6452
6218
|
{
|
|
6453
6219
|
data,
|
|
@@ -6459,7 +6225,7 @@ var CustomPieChart = ({
|
|
|
6459
6225
|
innerRadius,
|
|
6460
6226
|
fill: "#8884d8",
|
|
6461
6227
|
dataKey: "value",
|
|
6462
|
-
children: data.map((entry, index) => /* @__PURE__ */ (0,
|
|
6228
|
+
children: data.map((entry, index) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
6463
6229
|
import_recharts4.Cell,
|
|
6464
6230
|
{
|
|
6465
6231
|
fill: finalColors[index % finalColors.length]
|
|
@@ -6468,7 +6234,7 @@ var CustomPieChart = ({
|
|
|
6468
6234
|
))
|
|
6469
6235
|
}
|
|
6470
6236
|
),
|
|
6471
|
-
showTooltip && /* @__PURE__ */ (0,
|
|
6237
|
+
showTooltip && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
6472
6238
|
import_recharts4.Tooltip,
|
|
6473
6239
|
{
|
|
6474
6240
|
contentStyle: {
|
|
@@ -6479,19 +6245,19 @@ var CustomPieChart = ({
|
|
|
6479
6245
|
}
|
|
6480
6246
|
}
|
|
6481
6247
|
),
|
|
6482
|
-
showLegend && /* @__PURE__ */ (0,
|
|
6248
|
+
showLegend && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_recharts4.Legend, {})
|
|
6483
6249
|
] }) }) });
|
|
6484
6250
|
};
|
|
6485
6251
|
var PieChart_default = CustomPieChart;
|
|
6486
6252
|
|
|
6487
6253
|
// src/components/charts/hooks/useChartHighlights.tsx
|
|
6488
|
-
var
|
|
6254
|
+
var import_react24 = require("react");
|
|
6489
6255
|
var useChartHighlights = () => {
|
|
6490
|
-
const [highlightedSeries, setHighlightedSeries] = (0,
|
|
6256
|
+
const [highlightedSeries, setHighlightedSeries] = (0, import_react24.useState)(
|
|
6491
6257
|
/* @__PURE__ */ new Set()
|
|
6492
6258
|
);
|
|
6493
|
-
const [showOnlyHighlighted, setShowOnlyHighlighted] = (0,
|
|
6494
|
-
const toggleHighlight = (0,
|
|
6259
|
+
const [showOnlyHighlighted, setShowOnlyHighlighted] = (0, import_react24.useState)(false);
|
|
6260
|
+
const toggleHighlight = (0, import_react24.useCallback)((key) => {
|
|
6495
6261
|
setHighlightedSeries((prev) => {
|
|
6496
6262
|
const next = new Set(prev);
|
|
6497
6263
|
if (next.has(key)) {
|
|
@@ -6502,17 +6268,17 @@ var useChartHighlights = () => {
|
|
|
6502
6268
|
return next;
|
|
6503
6269
|
});
|
|
6504
6270
|
}, []);
|
|
6505
|
-
const clearHighlights = (0,
|
|
6271
|
+
const clearHighlights = (0, import_react24.useCallback)(() => {
|
|
6506
6272
|
setHighlightedSeries(/* @__PURE__ */ new Set());
|
|
6507
6273
|
setShowOnlyHighlighted(false);
|
|
6508
6274
|
}, []);
|
|
6509
|
-
const isHighlighted = (0,
|
|
6275
|
+
const isHighlighted = (0, import_react24.useCallback)(
|
|
6510
6276
|
(key) => {
|
|
6511
6277
|
return highlightedSeries.has(key);
|
|
6512
6278
|
},
|
|
6513
6279
|
[highlightedSeries]
|
|
6514
6280
|
);
|
|
6515
|
-
const getSeriesStyle = (0,
|
|
6281
|
+
const getSeriesStyle = (0, import_react24.useCallback)(
|
|
6516
6282
|
(key) => {
|
|
6517
6283
|
const hasHighlights = highlightedSeries.size > 0;
|
|
6518
6284
|
const isSeriesHighlighted = highlightedSeries.has(key);
|
|
@@ -6557,6 +6323,105 @@ var useChartHighlights = () => {
|
|
|
6557
6323
|
};
|
|
6558
6324
|
};
|
|
6559
6325
|
|
|
6326
|
+
// src/components/charts/NoData.tsx
|
|
6327
|
+
var import_jsx_runtime32 = require("react/jsx-runtime");
|
|
6328
|
+
var NoData = ({
|
|
6329
|
+
paddingLeft = 0,
|
|
6330
|
+
height = 360,
|
|
6331
|
+
message = "Sem dados para exibir",
|
|
6332
|
+
className
|
|
6333
|
+
}) => {
|
|
6334
|
+
const svgHeight = typeof height === "number" ? height : 360;
|
|
6335
|
+
const bars = [
|
|
6336
|
+
{ x: 120, w: 120, h: svgHeight * 0.45, label: "Label 0" },
|
|
6337
|
+
{ x: 260, w: 120, h: svgHeight * 0.75, label: "Label 1" },
|
|
6338
|
+
{ x: 400, w: 120, h: svgHeight * 0.65, label: "Label 2" },
|
|
6339
|
+
{ x: 540, w: 120, h: svgHeight * 0.55, label: "Label 3" },
|
|
6340
|
+
{ x: 680, w: 120, h: svgHeight * 0.25, label: "Label 4" }
|
|
6341
|
+
];
|
|
6342
|
+
const styleVars = {
|
|
6343
|
+
["--pl"]: `${paddingLeft}px`,
|
|
6344
|
+
["--svg-h"]: typeof height === "number" ? `${height}px` : String(height)
|
|
6345
|
+
};
|
|
6346
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6347
|
+
"div",
|
|
6348
|
+
{
|
|
6349
|
+
className: cn(
|
|
6350
|
+
"rounded-lg bg-card p-2 relative overflow-visible w-full",
|
|
6351
|
+
className
|
|
6352
|
+
),
|
|
6353
|
+
style: styleVars,
|
|
6354
|
+
role: "img",
|
|
6355
|
+
"aria-label": message,
|
|
6356
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "w-full flex items-center justify-center pl-[var(--pl)] pr-3 h-[var(--svg-h)]", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "w-full max-w-[900px] relative", children: [
|
|
6357
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
|
|
6358
|
+
"svg",
|
|
6359
|
+
{
|
|
6360
|
+
className: "w-full h-[var(--svg-h)]",
|
|
6361
|
+
width: "100%",
|
|
6362
|
+
viewBox: `0 0 900 ${svgHeight}`,
|
|
6363
|
+
preserveAspectRatio: "none",
|
|
6364
|
+
children: [
|
|
6365
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6366
|
+
"rect",
|
|
6367
|
+
{
|
|
6368
|
+
x: 0,
|
|
6369
|
+
y: 0,
|
|
6370
|
+
width: 900,
|
|
6371
|
+
height: svgHeight,
|
|
6372
|
+
fill: "transparent"
|
|
6373
|
+
}
|
|
6374
|
+
),
|
|
6375
|
+
Array.from({ length: 5 }).map((_, i) => {
|
|
6376
|
+
const y = 40 + (svgHeight - 80) / 4 * i;
|
|
6377
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6378
|
+
"line",
|
|
6379
|
+
{
|
|
6380
|
+
x1: 60,
|
|
6381
|
+
x2: 840,
|
|
6382
|
+
y1: y,
|
|
6383
|
+
y2: y,
|
|
6384
|
+
stroke: "rgba(0,0,0,0.06)",
|
|
6385
|
+
strokeWidth: 1
|
|
6386
|
+
},
|
|
6387
|
+
`g-${i}`
|
|
6388
|
+
);
|
|
6389
|
+
}),
|
|
6390
|
+
bars.map((b, i) => /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("g", { children: [
|
|
6391
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6392
|
+
"rect",
|
|
6393
|
+
{
|
|
6394
|
+
x: b.x,
|
|
6395
|
+
y: svgHeight - 60 - b.h,
|
|
6396
|
+
width: b.w,
|
|
6397
|
+
height: b.h,
|
|
6398
|
+
rx: 6,
|
|
6399
|
+
fill: "rgba(0,0,0,0.06)",
|
|
6400
|
+
stroke: "rgba(0,0,0,0.04)"
|
|
6401
|
+
}
|
|
6402
|
+
),
|
|
6403
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6404
|
+
"text",
|
|
6405
|
+
{
|
|
6406
|
+
x: b.x + b.w / 2,
|
|
6407
|
+
y: svgHeight - 20,
|
|
6408
|
+
fill: "rgba(0,0,0,0.35)",
|
|
6409
|
+
fontSize: 12,
|
|
6410
|
+
textAnchor: "middle",
|
|
6411
|
+
children: b.label
|
|
6412
|
+
}
|
|
6413
|
+
)
|
|
6414
|
+
] }, `barg-${i}`))
|
|
6415
|
+
]
|
|
6416
|
+
}
|
|
6417
|
+
),
|
|
6418
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "absolute inset-0 flex items-center justify-center pointer-events-none h-[var(--svg-h)]", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "pointer-events-auto bg-transparent px-3", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "text-2xl font-extrabold text-black/80", children: message }) }) })
|
|
6419
|
+
] }) })
|
|
6420
|
+
}
|
|
6421
|
+
);
|
|
6422
|
+
};
|
|
6423
|
+
var NoData_default = NoData;
|
|
6424
|
+
|
|
6560
6425
|
// src/components/ui/data/AvatarBase.tsx
|
|
6561
6426
|
var React16 = __toESM(require("react"));
|
|
6562
6427
|
var AvatarPrimitive = __toESM(require("@radix-ui/react-avatar"));
|
|
@@ -6650,7 +6515,7 @@ function Badge({
|
|
|
6650
6515
|
}
|
|
6651
6516
|
|
|
6652
6517
|
// src/components/ui/data/CalendarBase.tsx
|
|
6653
|
-
var
|
|
6518
|
+
var import_react25 = require("@phosphor-icons/react");
|
|
6654
6519
|
var import_react_day_picker = require("react-day-picker");
|
|
6655
6520
|
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
6656
6521
|
function CalendarBase({
|
|
@@ -6695,8 +6560,8 @@ function CalendarBase({
|
|
|
6695
6560
|
...classNames
|
|
6696
6561
|
},
|
|
6697
6562
|
components: {
|
|
6698
|
-
IconLeft: () => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6699
|
-
IconRight: () => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6563
|
+
IconLeft: () => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react25.CaretLeftIcon, { className: "h-4 w-4" }),
|
|
6564
|
+
IconRight: () => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react25.CaretRightIcon, { className: "h-4 w-4" })
|
|
6700
6565
|
},
|
|
6701
6566
|
...props
|
|
6702
6567
|
}
|
|
@@ -6774,7 +6639,7 @@ CardFooterBase.displayName = "CardFooter";
|
|
|
6774
6639
|
// src/components/ui/data/FileUploader.tsx
|
|
6775
6640
|
var React18 = __toESM(require("react"));
|
|
6776
6641
|
var import_framer_motion10 = require("framer-motion");
|
|
6777
|
-
var
|
|
6642
|
+
var import_react26 = require("@phosphor-icons/react");
|
|
6778
6643
|
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
6779
6644
|
var formatFileSize = (bytes) => {
|
|
6780
6645
|
if (bytes === 0) return "0 Bytes";
|
|
@@ -6790,38 +6655,38 @@ var getFileTypeIcon = (file) => {
|
|
|
6790
6655
|
const extension = getFileExtension(file.name).toLowerCase();
|
|
6791
6656
|
const mimeType = file.type.toLowerCase();
|
|
6792
6657
|
if (extension === "pdf" || mimeType === "application/pdf") {
|
|
6793
|
-
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
6658
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react26.FilePdfIcon, { size: 20, className: "text-red-500" });
|
|
6794
6659
|
}
|
|
6795
6660
|
if (["doc", "docx"].includes(extension) || mimeType.includes("word")) {
|
|
6796
|
-
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
6661
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react26.FileDocIcon, { size: 20, className: "text-blue-500" });
|
|
6797
6662
|
}
|
|
6798
6663
|
if (["xls", "xlsx"].includes(extension) || mimeType.includes("sheet")) {
|
|
6799
|
-
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
6664
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react26.FileXlsIcon, { size: 20, className: "text-green-500" });
|
|
6800
6665
|
}
|
|
6801
6666
|
if (["ppt", "pptx"].includes(extension) || mimeType.includes("presentation")) {
|
|
6802
|
-
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
6667
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react26.FilePptIcon, { size: 20, className: "text-orange-500" });
|
|
6803
6668
|
}
|
|
6804
6669
|
if (extension === "csv" || mimeType === "text/csv") {
|
|
6805
|
-
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
6670
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react26.FileCsvIcon, { size: 20, className: "text-green-600" });
|
|
6806
6671
|
}
|
|
6807
6672
|
if (["txt", "md", "json", "xml", "js", "ts", "html", "css"].includes(
|
|
6808
6673
|
extension
|
|
6809
6674
|
) || mimeType.includes("text")) {
|
|
6810
|
-
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
6675
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react26.FileTextIcon, { size: 20, className: "text-gray-500" });
|
|
6811
6676
|
}
|
|
6812
6677
|
if (mimeType.startsWith("image/")) {
|
|
6813
|
-
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
6678
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react26.FileImageIcon, { size: 20, className: "text-purple-500" });
|
|
6814
6679
|
}
|
|
6815
6680
|
if (mimeType.startsWith("video/")) {
|
|
6816
|
-
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
6681
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react26.FileVideoIcon, { size: 20, className: "text-pink-500" });
|
|
6817
6682
|
}
|
|
6818
6683
|
if (mimeType.startsWith("audio/")) {
|
|
6819
|
-
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
6684
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react26.FileAudioIcon, { size: 20, className: "text-indigo-500" });
|
|
6820
6685
|
}
|
|
6821
6686
|
if (["zip", "rar", "7z", "tar", "gz"].includes(extension)) {
|
|
6822
|
-
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
6687
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react26.FileZipIcon, { size: 20, className: "text-yellow-600" });
|
|
6823
6688
|
}
|
|
6824
|
-
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
6689
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react26.FileIcon, { size: 20, className: "text-muted-foreground" });
|
|
6825
6690
|
};
|
|
6826
6691
|
var createImagePreview = (file) => {
|
|
6827
6692
|
return new Promise((resolve) => {
|
|
@@ -7051,7 +6916,7 @@ var FileUploader = React18.forwardRef(
|
|
|
7051
6916
|
color: isDragging ? `hsl(var(--primary))` : `hsl(var(--muted-foreground))`
|
|
7052
6917
|
},
|
|
7053
6918
|
transition: { duration: 0.3 },
|
|
7054
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
6919
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react26.CloudArrowUpIcon, { size: 64 })
|
|
7055
6920
|
}
|
|
7056
6921
|
)
|
|
7057
6922
|
}
|
|
@@ -7093,7 +6958,7 @@ var FileUploader = React18.forwardRef(
|
|
|
7093
6958
|
),
|
|
7094
6959
|
transition: { duration: 0.3 },
|
|
7095
6960
|
children: [
|
|
7096
|
-
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "h-4 w-4 text-primary flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
6961
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "h-4 w-4 text-primary flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react26.CheckIcon, { size: 16, className: "text-emerald-500" }) }),
|
|
7097
6962
|
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
|
|
7098
6963
|
import_framer_motion10.motion.span,
|
|
7099
6964
|
{
|
|
@@ -7195,7 +7060,7 @@ var FileUploader = React18.forwardRef(
|
|
|
7195
7060
|
handleRemoveFile(file.id);
|
|
7196
7061
|
},
|
|
7197
7062
|
className: "",
|
|
7198
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
7063
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react26.XIcon, { size: 12 })
|
|
7199
7064
|
}
|
|
7200
7065
|
)
|
|
7201
7066
|
]
|
|
@@ -7319,7 +7184,7 @@ AlertDialogCancelBase.displayName = AlertDialogPrimitive.Cancel.displayName;
|
|
|
7319
7184
|
|
|
7320
7185
|
// src/components/ui/feedback/DestructiveDialog.tsx
|
|
7321
7186
|
var React20 = __toESM(require("react"));
|
|
7322
|
-
var
|
|
7187
|
+
var import_react27 = require("@phosphor-icons/react");
|
|
7323
7188
|
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
7324
7189
|
var DestructiveDialog = ({
|
|
7325
7190
|
title,
|
|
@@ -7339,7 +7204,7 @@ var DestructiveDialog = ({
|
|
|
7339
7204
|
className: cn("border border-destructive bg-background", className),
|
|
7340
7205
|
children: [
|
|
7341
7206
|
/* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "flex items-start gap-4", children: [
|
|
7342
|
-
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "flex items-center justify-center w-10 h-10 rounded-full ring-1 ring-destructive/30", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
7207
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "flex items-center justify-center w-10 h-10 rounded-full ring-1 ring-destructive/30", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_react27.XCircleIcon, { className: "w-6 h-6 text-destructive" }) }),
|
|
7343
7208
|
/* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "flex-1", children: [
|
|
7344
7209
|
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(AlertDialogTitleBase, { className: "text-lg sm:text-xl font-semibold text-destructive", children: title }),
|
|
7345
7210
|
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(AlertDialogDescriptionBase, { className: "mt-2 text-sm text-muted-foreground", children: description })
|
|
@@ -7548,7 +7413,7 @@ LoadingBase.displayName = "LoadingBase";
|
|
|
7548
7413
|
// src/components/ui/feedback/ModalBase.tsx
|
|
7549
7414
|
var React22 = __toESM(require("react"));
|
|
7550
7415
|
var DialogPrimitive2 = __toESM(require("@radix-ui/react-dialog"));
|
|
7551
|
-
var
|
|
7416
|
+
var import_react28 = require("@phosphor-icons/react");
|
|
7552
7417
|
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
7553
7418
|
var ModalBase = DialogPrimitive2.Root;
|
|
7554
7419
|
var ModalTriggerBase = DialogPrimitive2.Trigger;
|
|
@@ -7621,7 +7486,7 @@ var ModalContentBase = React22.forwardRef(
|
|
|
7621
7486
|
children: [
|
|
7622
7487
|
children,
|
|
7623
7488
|
/* @__PURE__ */ (0, import_jsx_runtime41.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: [
|
|
7624
|
-
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
7489
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_react28.XIcon, { className: "h-5 w-5 sm:h-4 sm:w-4 text-foreground" }),
|
|
7625
7490
|
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "sr-only", children: "Close" })
|
|
7626
7491
|
] })
|
|
7627
7492
|
]
|
|
@@ -7945,7 +7810,7 @@ function SkeletonBase({
|
|
|
7945
7810
|
}
|
|
7946
7811
|
|
|
7947
7812
|
// src/components/ui/feedback/SonnerBase.tsx
|
|
7948
|
-
var
|
|
7813
|
+
var import_react29 = require("@phosphor-icons/react");
|
|
7949
7814
|
var import_sonner2 = require("sonner");
|
|
7950
7815
|
var import_jsx_runtime44 = require("react/jsx-runtime");
|
|
7951
7816
|
var iconBaseClass = "w-5 h-auto";
|
|
@@ -7997,23 +7862,23 @@ var Toaster = ({ testId, ...props }) => {
|
|
|
7997
7862
|
};
|
|
7998
7863
|
var toast2 = {
|
|
7999
7864
|
success: (message) => import_sonner2.toast.success(message, {
|
|
8000
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
|
|
7865
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_react29.CheckCircleIcon, { className: `${iconBaseClass} text-green-600`, weight: "fill" }),
|
|
8001
7866
|
className: "sonner-success"
|
|
8002
7867
|
}),
|
|
8003
7868
|
error: (message) => import_sonner2.toast.error(message, {
|
|
8004
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
|
|
7869
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_react29.XCircleIcon, { className: `${iconBaseClass} text-red-600`, weight: "fill" }),
|
|
8005
7870
|
className: "sonner-error"
|
|
8006
7871
|
}),
|
|
8007
7872
|
warning: (message) => import_sonner2.toast.warning(message, {
|
|
8008
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
|
|
7873
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_react29.WarningIcon, { className: `${iconBaseClass} text-yellow-600`, weight: "fill" }),
|
|
8009
7874
|
className: "sonner-WarningIcon"
|
|
8010
7875
|
}),
|
|
8011
7876
|
info: (message) => import_sonner2.toast.info(message, {
|
|
8012
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
|
|
7877
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_react29.InfoIcon, { className: `${iconBaseClass} text-blue-600`, weight: "fill" }),
|
|
8013
7878
|
className: "sonner-InfoIcon"
|
|
8014
7879
|
}),
|
|
8015
7880
|
loading: (message) => (0, import_sonner2.toast)(message, {
|
|
8016
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
|
|
7881
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_react29.SpinnerIcon, { className: `${iconBaseClass} animate-spin text-neutral-500`, weight: "fill" }),
|
|
8017
7882
|
className: "sonner-loading"
|
|
8018
7883
|
})
|
|
8019
7884
|
};
|
|
@@ -8021,7 +7886,7 @@ var toast2 = {
|
|
|
8021
7886
|
// src/components/ui/form/CheckBoxBase.tsx
|
|
8022
7887
|
var React24 = __toESM(require("react"));
|
|
8023
7888
|
var CheckboxPrimitive = __toESM(require("@radix-ui/react-checkbox"));
|
|
8024
|
-
var
|
|
7889
|
+
var import_react30 = require("@phosphor-icons/react");
|
|
8025
7890
|
var import_framer_motion11 = require("framer-motion");
|
|
8026
7891
|
var import_jsx_runtime45 = require("react/jsx-runtime");
|
|
8027
7892
|
var CheckboxBase = React24.forwardRef(({ className, testid: dataTestId = "checkbox-base", checked: checkedProp, defaultChecked, onCheckedChange, ...props }, ref) => {
|
|
@@ -8060,8 +7925,8 @@ var CheckboxBase = React24.forwardRef(({ className, testid: dataTestId = "checkb
|
|
|
8060
7925
|
transition: { type: "spring", stiffness: 500, damping: 30 },
|
|
8061
7926
|
className: "flex items-center justify-center text-current",
|
|
8062
7927
|
children: [
|
|
8063
|
-
checkedState === true && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
|
|
8064
|
-
checkedState === "indeterminate" && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
|
|
7928
|
+
checkedState === true && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_react30.CheckIcon, { className: "h-4 w-4", weight: "bold" }),
|
|
7929
|
+
checkedState === "indeterminate" && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_react30.MinusIcon, { className: "h-4 w-4", weight: "bold" })
|
|
8065
7930
|
]
|
|
8066
7931
|
}
|
|
8067
7932
|
) })
|
|
@@ -8073,7 +7938,7 @@ CheckboxBase.displayName = CheckboxPrimitive.Root.displayName;
|
|
|
8073
7938
|
// src/components/ui/form/CollapsibleBase.tsx
|
|
8074
7939
|
var React25 = __toESM(require("react"));
|
|
8075
7940
|
var CollapsiblePrimitive = __toESM(require("@radix-ui/react-collapsible"));
|
|
8076
|
-
var
|
|
7941
|
+
var import_react31 = require("@phosphor-icons/react");
|
|
8077
7942
|
var import_jsx_runtime46 = require("react/jsx-runtime");
|
|
8078
7943
|
var CollapsibleBase = React25.forwardRef(({ ...props }, ref) => {
|
|
8079
7944
|
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(CollapsiblePrimitive.Root, { ref, "data-slot": "collapsible", ...props });
|
|
@@ -8095,7 +7960,7 @@ var CollapsibleTriggerBase = React25.forwardRef(({ className, children, leftIcon
|
|
|
8095
7960
|
leftIcon && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "flex-shrink-0 [&>svg]:size-4", children: leftIcon }),
|
|
8096
7961
|
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { children })
|
|
8097
7962
|
] }),
|
|
8098
|
-
showCaret && /* @__PURE__ */ (0, import_jsx_runtime46.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_runtime46.jsx)(
|
|
7963
|
+
showCaret && /* @__PURE__ */ (0, import_jsx_runtime46.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_runtime46.jsx)(import_react31.CaretUpDownIcon, { className: "h-4 w-4" }) })
|
|
8099
7964
|
]
|
|
8100
7965
|
}
|
|
8101
7966
|
);
|
|
@@ -8176,7 +8041,7 @@ HoverCardContentBase.displayName = HoverCardPrimitive.Content.displayName;
|
|
|
8176
8041
|
// src/components/ui/form/Input-OTP-Base.tsx
|
|
8177
8042
|
var React27 = __toESM(require("react"));
|
|
8178
8043
|
var import_input_otp = require("input-otp");
|
|
8179
|
-
var
|
|
8044
|
+
var import_react32 = require("@phosphor-icons/react");
|
|
8180
8045
|
var import_jsx_runtime48 = require("react/jsx-runtime");
|
|
8181
8046
|
function InputOTPBase({
|
|
8182
8047
|
className,
|
|
@@ -8231,7 +8096,7 @@ function InputOTPSlotBase({
|
|
|
8231
8096
|
);
|
|
8232
8097
|
}
|
|
8233
8098
|
function InputOTPSeparatorBase({ ...props }) {
|
|
8234
|
-
return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { "data-slot": "input-otp-separator", role: "separator", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
|
|
8099
|
+
return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { "data-slot": "input-otp-separator", role: "separator", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_react32.MinusIcon, {}) });
|
|
8235
8100
|
}
|
|
8236
8101
|
|
|
8237
8102
|
// src/components/ui/form/SliderBase.tsx
|
|
@@ -8319,7 +8184,7 @@ SlideBase.displayName = "SlideBase";
|
|
|
8319
8184
|
|
|
8320
8185
|
// src/components/ui/form/SmallButtons.tsx
|
|
8321
8186
|
var React29 = __toESM(require("react"));
|
|
8322
|
-
var
|
|
8187
|
+
var import_react33 = require("@phosphor-icons/react");
|
|
8323
8188
|
var import_jsx_runtime50 = require("react/jsx-runtime");
|
|
8324
8189
|
var EditButton = React29.forwardRef(
|
|
8325
8190
|
({
|
|
@@ -8350,7 +8215,7 @@ var EditButton = React29.forwardRef(
|
|
|
8350
8215
|
),
|
|
8351
8216
|
...props,
|
|
8352
8217
|
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8353
|
-
|
|
8218
|
+
import_react33.PencilSimpleIcon,
|
|
8354
8219
|
{
|
|
8355
8220
|
size: iconSize,
|
|
8356
8221
|
color: iconColor,
|
|
@@ -8390,7 +8255,7 @@ var ChangeButton = React29.forwardRef(
|
|
|
8390
8255
|
),
|
|
8391
8256
|
...props,
|
|
8392
8257
|
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8393
|
-
|
|
8258
|
+
import_react33.ArrowsLeftRightIcon,
|
|
8394
8259
|
{
|
|
8395
8260
|
size: iconSize,
|
|
8396
8261
|
color: iconColor,
|
|
@@ -8430,7 +8295,7 @@ var SaveButton = React29.forwardRef(
|
|
|
8430
8295
|
),
|
|
8431
8296
|
...props,
|
|
8432
8297
|
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8433
|
-
|
|
8298
|
+
import_react33.FloppyDiskIcon,
|
|
8434
8299
|
{
|
|
8435
8300
|
size: iconSize,
|
|
8436
8301
|
color: iconColor,
|
|
@@ -8470,7 +8335,7 @@ var AddButton = React29.forwardRef(
|
|
|
8470
8335
|
),
|
|
8471
8336
|
...props,
|
|
8472
8337
|
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8473
|
-
|
|
8338
|
+
import_react33.PlusIcon,
|
|
8474
8339
|
{
|
|
8475
8340
|
size: iconSize,
|
|
8476
8341
|
color: iconColor,
|
|
@@ -8510,7 +8375,7 @@ var CloseButton = React29.forwardRef(
|
|
|
8510
8375
|
),
|
|
8511
8376
|
...props,
|
|
8512
8377
|
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8513
|
-
|
|
8378
|
+
import_react33.XIcon,
|
|
8514
8379
|
{
|
|
8515
8380
|
size: iconSize,
|
|
8516
8381
|
color: iconColor,
|
|
@@ -8542,7 +8407,7 @@ var DownloadButton = ({
|
|
|
8542
8407
|
),
|
|
8543
8408
|
...props,
|
|
8544
8409
|
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8545
|
-
|
|
8410
|
+
import_react33.DownloadSimpleIcon,
|
|
8546
8411
|
{
|
|
8547
8412
|
size: 18,
|
|
8548
8413
|
className: "transition-transform duration-300 group-hover:translate-y-0.5"
|
|
@@ -8571,7 +8436,7 @@ var UploadButton = ({
|
|
|
8571
8436
|
),
|
|
8572
8437
|
...props,
|
|
8573
8438
|
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8574
|
-
|
|
8439
|
+
import_react33.UploadSimpleIcon,
|
|
8575
8440
|
{
|
|
8576
8441
|
size: 18,
|
|
8577
8442
|
className: "transition-transform duration-300 group-hover:-translate-y-0.5"
|
|
@@ -8600,7 +8465,7 @@ var CopyButton = ({
|
|
|
8600
8465
|
),
|
|
8601
8466
|
...props,
|
|
8602
8467
|
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8603
|
-
|
|
8468
|
+
import_react33.CopyIcon,
|
|
8604
8469
|
{
|
|
8605
8470
|
size: 18,
|
|
8606
8471
|
className: "transition-transform duration-200 group-hover:scale-110"
|
|
@@ -8629,7 +8494,7 @@ var RefreshButton = ({
|
|
|
8629
8494
|
),
|
|
8630
8495
|
...props,
|
|
8631
8496
|
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8632
|
-
|
|
8497
|
+
import_react33.ArrowClockwiseIcon,
|
|
8633
8498
|
{
|
|
8634
8499
|
size: 18,
|
|
8635
8500
|
className: "transition-transform duration-500 group-hover:rotate-180"
|
|
@@ -8658,7 +8523,7 @@ var SearchButton = ({
|
|
|
8658
8523
|
),
|
|
8659
8524
|
...props,
|
|
8660
8525
|
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8661
|
-
|
|
8526
|
+
import_react33.MagnifyingGlassIcon,
|
|
8662
8527
|
{
|
|
8663
8528
|
size: 18,
|
|
8664
8529
|
className: "transition-transform duration-200 group-hover:scale-110 group-hover:-rotate-12"
|
|
@@ -8687,7 +8552,7 @@ var BackButton = ({
|
|
|
8687
8552
|
),
|
|
8688
8553
|
...props,
|
|
8689
8554
|
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8690
|
-
|
|
8555
|
+
import_react33.ArrowLeftIcon,
|
|
8691
8556
|
{
|
|
8692
8557
|
size: 18,
|
|
8693
8558
|
className: "transition-transform duration-300 group-hover:-translate-x-1"
|
|
@@ -8716,7 +8581,7 @@ var SettingsButton = ({
|
|
|
8716
8581
|
),
|
|
8717
8582
|
...props,
|
|
8718
8583
|
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8719
|
-
|
|
8584
|
+
import_react33.GearIcon,
|
|
8720
8585
|
{
|
|
8721
8586
|
size: 18,
|
|
8722
8587
|
className: "transition-transform duration-500 group-hover:rotate-90"
|
|
@@ -8745,7 +8610,7 @@ var NotificationButton = ({
|
|
|
8745
8610
|
),
|
|
8746
8611
|
...props,
|
|
8747
8612
|
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8748
|
-
|
|
8613
|
+
import_react33.BellIcon,
|
|
8749
8614
|
{
|
|
8750
8615
|
size: 18,
|
|
8751
8616
|
className: "transition-transform duration-300 group-hover:scale-110 group-hover:-rotate-12"
|
|
@@ -8774,7 +8639,7 @@ var MoreButton = ({
|
|
|
8774
8639
|
),
|
|
8775
8640
|
...props,
|
|
8776
8641
|
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8777
|
-
|
|
8642
|
+
import_react33.DotsThreeIcon,
|
|
8778
8643
|
{
|
|
8779
8644
|
size: 18,
|
|
8780
8645
|
className: "transition-transform duration-200 group-hover:scale-110"
|
|
@@ -8803,7 +8668,7 @@ var CheckButton = ({
|
|
|
8803
8668
|
),
|
|
8804
8669
|
...props,
|
|
8805
8670
|
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8806
|
-
|
|
8671
|
+
import_react33.CheckIcon,
|
|
8807
8672
|
{
|
|
8808
8673
|
size: 18,
|
|
8809
8674
|
className: "transition-transform duration-200 group-hover:scale-110"
|
|
@@ -8839,7 +8704,7 @@ var FilterButton = ({
|
|
|
8839
8704
|
),
|
|
8840
8705
|
...props,
|
|
8841
8706
|
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8842
|
-
|
|
8707
|
+
import_react33.FunnelIcon,
|
|
8843
8708
|
{
|
|
8844
8709
|
size: iconSize,
|
|
8845
8710
|
color: iconColor,
|
|
@@ -8878,7 +8743,7 @@ var LikeButton = ({
|
|
|
8878
8743
|
),
|
|
8879
8744
|
...props,
|
|
8880
8745
|
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8881
|
-
|
|
8746
|
+
import_react33.HeartIcon,
|
|
8882
8747
|
{
|
|
8883
8748
|
size: iconSize,
|
|
8884
8749
|
color: iconColor,
|
|
@@ -8917,7 +8782,7 @@ var FavoriteButton = ({
|
|
|
8917
8782
|
),
|
|
8918
8783
|
...props,
|
|
8919
8784
|
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8920
|
-
|
|
8785
|
+
import_react33.StarIcon,
|
|
8921
8786
|
{
|
|
8922
8787
|
size: iconSize,
|
|
8923
8788
|
color: iconColor,
|
|
@@ -8955,14 +8820,14 @@ var VisibilityButton = ({
|
|
|
8955
8820
|
),
|
|
8956
8821
|
...props,
|
|
8957
8822
|
children: isVisible ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8958
|
-
|
|
8823
|
+
import_react33.EyeIcon,
|
|
8959
8824
|
{
|
|
8960
8825
|
size: iconSize,
|
|
8961
8826
|
color: iconColor,
|
|
8962
8827
|
className: "transition-opacity duration-200"
|
|
8963
8828
|
}
|
|
8964
8829
|
) : /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
8965
|
-
|
|
8830
|
+
import_react33.EyeSlashIcon,
|
|
8966
8831
|
{
|
|
8967
8832
|
size: iconSize,
|
|
8968
8833
|
color: iconColor,
|
|
@@ -9002,14 +8867,14 @@ var LockButton = ({
|
|
|
9002
8867
|
),
|
|
9003
8868
|
...props,
|
|
9004
8869
|
children: isLocked ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
9005
|
-
|
|
8870
|
+
import_react33.LockIcon,
|
|
9006
8871
|
{
|
|
9007
8872
|
size: iconSize,
|
|
9008
8873
|
color: iconColor,
|
|
9009
8874
|
className: "transition-all duration-200 group-hover:scale-110"
|
|
9010
8875
|
}
|
|
9011
8876
|
) : /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
9012
|
-
|
|
8877
|
+
import_react33.LockOpenIcon,
|
|
9013
8878
|
{
|
|
9014
8879
|
size: iconSize,
|
|
9015
8880
|
color: iconColor,
|
|
@@ -9055,7 +8920,7 @@ SwitchBase.displayName = SwitchPrimitives.Root.displayName;
|
|
|
9055
8920
|
// src/components/ui/form/TextAreaBase.tsx
|
|
9056
8921
|
var React31 = __toESM(require("react"));
|
|
9057
8922
|
var import_framer_motion12 = require("framer-motion");
|
|
9058
|
-
var
|
|
8923
|
+
var import_react34 = require("@phosphor-icons/react");
|
|
9059
8924
|
var import_jsx_runtime52 = require("react/jsx-runtime");
|
|
9060
8925
|
var TextAreaBase = React31.forwardRef(
|
|
9061
8926
|
({ className, clearable = false, onClear, ...props }, ref) => {
|
|
@@ -9152,7 +9017,7 @@ var TextAreaBase = React31.forwardRef(
|
|
|
9152
9017
|
),
|
|
9153
9018
|
disabled: props.disabled,
|
|
9154
9019
|
"aria-label": "Limpar texto",
|
|
9155
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
|
|
9020
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_react34.TrashIcon, { size: 16, weight: "regular" })
|
|
9156
9021
|
}
|
|
9157
9022
|
) }),
|
|
9158
9023
|
/* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
|
|
@@ -9230,7 +9095,7 @@ TextAreaBase.displayName = "TextAreaBase";
|
|
|
9230
9095
|
// src/components/ui/layout/CarouselBase.tsx
|
|
9231
9096
|
var React32 = __toESM(require("react"));
|
|
9232
9097
|
var import_embla_carousel_react = __toESM(require("embla-carousel-react"));
|
|
9233
|
-
var
|
|
9098
|
+
var import_react35 = require("@phosphor-icons/react");
|
|
9234
9099
|
var import_jsx_runtime53 = require("react/jsx-runtime");
|
|
9235
9100
|
var CarouselContext = React32.createContext(null);
|
|
9236
9101
|
function useCarousel() {
|
|
@@ -9391,7 +9256,7 @@ function CarouselPreviousBase({
|
|
|
9391
9256
|
onClick: scrollPrev,
|
|
9392
9257
|
...props,
|
|
9393
9258
|
children: [
|
|
9394
|
-
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
|
|
9259
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react35.ArrowLeftIcon, {}),
|
|
9395
9260
|
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "sr-only", children: "Previous slide" })
|
|
9396
9261
|
]
|
|
9397
9262
|
}
|
|
@@ -9421,7 +9286,7 @@ function CarouselNextBase({
|
|
|
9421
9286
|
onClick: scrollNext,
|
|
9422
9287
|
...props,
|
|
9423
9288
|
children: [
|
|
9424
|
-
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
|
|
9289
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react35.ArrowRightIcon, {}),
|
|
9425
9290
|
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "sr-only", children: "Next slide" })
|
|
9426
9291
|
]
|
|
9427
9292
|
}
|
|
@@ -9604,7 +9469,7 @@ TabsContentBase.displayName = TabsPrimitive.Content.displayName;
|
|
|
9604
9469
|
|
|
9605
9470
|
// src/components/ui/navigation/BreadcrumbBase.tsx
|
|
9606
9471
|
var import_react_slot4 = require("@radix-ui/react-slot");
|
|
9607
|
-
var
|
|
9472
|
+
var import_react36 = require("@phosphor-icons/react");
|
|
9608
9473
|
var import_jsx_runtime57 = require("react/jsx-runtime");
|
|
9609
9474
|
function BreadcrumbBase({ ...props }) {
|
|
9610
9475
|
return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("nav", { "aria-label": "breadcrumb", "data-slot": "breadcrumb", ...props });
|
|
@@ -9673,7 +9538,7 @@ function BreadcrumbSeparatorBase({
|
|
|
9673
9538
|
"aria-hidden": "true",
|
|
9674
9539
|
className: cn("[&>svg]:size-3.5", className),
|
|
9675
9540
|
...props,
|
|
9676
|
-
children: children ?? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
|
|
9541
|
+
children: children ?? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_react36.CaretRightIcon, {})
|
|
9677
9542
|
}
|
|
9678
9543
|
);
|
|
9679
9544
|
}
|
|
@@ -9690,7 +9555,7 @@ function BreadcrumbEllipsisBase({
|
|
|
9690
9555
|
className: cn("flex size-9 items-center justify-center", className),
|
|
9691
9556
|
...props,
|
|
9692
9557
|
children: [
|
|
9693
|
-
/* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
|
|
9558
|
+
/* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_react36.DotsThreeIcon, { className: "size-4" }),
|
|
9694
9559
|
/* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "sr-only", children: "More" })
|
|
9695
9560
|
]
|
|
9696
9561
|
}
|
|
@@ -9699,7 +9564,7 @@ function BreadcrumbEllipsisBase({
|
|
|
9699
9564
|
|
|
9700
9565
|
// src/components/ui/navigation/NavigationMenuBase.tsx
|
|
9701
9566
|
var NavigationMenuPrimitive = __toESM(require("@radix-ui/react-navigation-menu"));
|
|
9702
|
-
var
|
|
9567
|
+
var import_react37 = require("@phosphor-icons/react");
|
|
9703
9568
|
var import_jsx_runtime58 = require("react/jsx-runtime");
|
|
9704
9569
|
function NavigationMenuBase({
|
|
9705
9570
|
className,
|
|
@@ -9767,7 +9632,7 @@ function NavigationMenuTriggerBase({
|
|
|
9767
9632
|
children: [
|
|
9768
9633
|
children,
|
|
9769
9634
|
/* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
|
|
9770
|
-
|
|
9635
|
+
import_react37.CaretDownIcon,
|
|
9771
9636
|
{
|
|
9772
9637
|
className: "relative top-[1px] ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180",
|
|
9773
9638
|
"aria-hidden": "true"
|
|
@@ -9870,7 +9735,7 @@ function useIsMobile() {
|
|
|
9870
9735
|
var React37 = __toESM(require("react"));
|
|
9871
9736
|
var SheetPrimitive = __toESM(require("@radix-ui/react-dialog"));
|
|
9872
9737
|
var import_class_variance_authority4 = require("class-variance-authority");
|
|
9873
|
-
var
|
|
9738
|
+
var import_react38 = require("@phosphor-icons/react");
|
|
9874
9739
|
var import_jsx_runtime59 = require("react/jsx-runtime");
|
|
9875
9740
|
var SheetBase = SheetPrimitive.Root;
|
|
9876
9741
|
var SheetTriggerBase = SheetPrimitive.Trigger;
|
|
@@ -9914,7 +9779,7 @@ var SheetContentBase = React37.forwardRef(({ side = "right", className, children
|
|
|
9914
9779
|
...props,
|
|
9915
9780
|
children: [
|
|
9916
9781
|
/* @__PURE__ */ (0, import_jsx_runtime59.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: [
|
|
9917
|
-
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
|
|
9782
|
+
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_react38.XIcon, { className: "h-4 w-4" }),
|
|
9918
9783
|
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "sr-only", children: "Close" })
|
|
9919
9784
|
] }),
|
|
9920
9785
|
children
|
|
@@ -9971,7 +9836,7 @@ var SheetDescriptionBase = React37.forwardRef(({ className, ...props }, ref) =>
|
|
|
9971
9836
|
SheetDescriptionBase.displayName = SheetPrimitive.Description.displayName;
|
|
9972
9837
|
|
|
9973
9838
|
// src/components/ui/navigation/SidebarBase.tsx
|
|
9974
|
-
var
|
|
9839
|
+
var import_react39 = require("@phosphor-icons/react");
|
|
9975
9840
|
var import_jsx_runtime60 = require("react/jsx-runtime");
|
|
9976
9841
|
var SIDEBAR_COOKIE_NAME = "sidebar:state";
|
|
9977
9842
|
var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
|
|
@@ -10165,7 +10030,7 @@ var SidebarTriggerBase = React38.forwardRef(({ className, onClick, ...props }, r
|
|
|
10165
10030
|
...props,
|
|
10166
10031
|
children: [
|
|
10167
10032
|
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "sr-only", children: "Toggle SidebarBase" }),
|
|
10168
|
-
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
10033
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react39.SidebarSimpleIcon, {})
|
|
10169
10034
|
]
|
|
10170
10035
|
}
|
|
10171
10036
|
) });
|
|
@@ -10659,11 +10524,11 @@ function DrawerDescriptionBase({
|
|
|
10659
10524
|
}
|
|
10660
10525
|
|
|
10661
10526
|
// src/hooks/use-universal-tooltip.tsx
|
|
10662
|
-
var
|
|
10527
|
+
var import_react40 = require("react");
|
|
10663
10528
|
var import_jsx_runtime62 = require("react/jsx-runtime");
|
|
10664
|
-
var UniversalTooltipContext = (0,
|
|
10529
|
+
var UniversalTooltipContext = (0, import_react40.createContext)(null);
|
|
10665
10530
|
var useUniversalTooltip = () => {
|
|
10666
|
-
const context = (0,
|
|
10531
|
+
const context = (0, import_react40.useContext)(UniversalTooltipContext);
|
|
10667
10532
|
if (!context) {
|
|
10668
10533
|
throw new Error("useUniversalTooltip deve ser usado dentro de UniversalTooltipProvider");
|
|
10669
10534
|
}
|
|
@@ -10671,7 +10536,7 @@ var useUniversalTooltip = () => {
|
|
|
10671
10536
|
};
|
|
10672
10537
|
var useTooltip = () => {
|
|
10673
10538
|
const { addTooltip, removeTooltip, startDrag } = useUniversalTooltip();
|
|
10674
|
-
const createTooltip = (0,
|
|
10539
|
+
const createTooltip = (0, import_react40.useCallback)((element, content, options) => {
|
|
10675
10540
|
const rect = element.getBoundingClientRect();
|
|
10676
10541
|
let position;
|
|
10677
10542
|
switch (options?.position || "auto") {
|
|
@@ -10701,7 +10566,7 @@ var useTooltip = () => {
|
|
|
10701
10566
|
metadata: options?.metadata
|
|
10702
10567
|
});
|
|
10703
10568
|
}, [addTooltip]);
|
|
10704
|
-
const handleElementMouseDown = (0,
|
|
10569
|
+
const handleElementMouseDown = (0, import_react40.useCallback)((tooltipId, event) => {
|
|
10705
10570
|
const rect = event.target.getBoundingClientRect();
|
|
10706
10571
|
const offset = {
|
|
10707
10572
|
x: event.clientX - rect.left,
|
|
@@ -10860,7 +10725,7 @@ var import_date_fns = require("date-fns");
|
|
|
10860
10725
|
// src/components/picker/calendar.tsx
|
|
10861
10726
|
var React40 = __toESM(require("react"));
|
|
10862
10727
|
var import_react_day_picker2 = require("react-day-picker");
|
|
10863
|
-
var
|
|
10728
|
+
var import_react41 = require("@phosphor-icons/react");
|
|
10864
10729
|
var import_framer_motion14 = require("framer-motion");
|
|
10865
10730
|
var import_jsx_runtime64 = require("react/jsx-runtime");
|
|
10866
10731
|
function CalendarBase2({
|
|
@@ -10937,8 +10802,8 @@ function CalendarBase2({
|
|
|
10937
10802
|
...classNames
|
|
10938
10803
|
},
|
|
10939
10804
|
components: {
|
|
10940
|
-
IconLeft: () => /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
|
|
10941
|
-
IconRight: () => /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
|
|
10805
|
+
IconLeft: () => /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_react41.CaretLeftIcon, { className: "h-4 w-4" }),
|
|
10806
|
+
IconRight: () => /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_react41.CaretRightIcon, { className: "h-4 w-4" })
|
|
10942
10807
|
},
|
|
10943
10808
|
...props
|
|
10944
10809
|
}
|
|
@@ -10954,15 +10819,15 @@ CalendarBase2.displayName = "CalendarBase";
|
|
|
10954
10819
|
|
|
10955
10820
|
// src/components/picker/DateTimePicker.tsx
|
|
10956
10821
|
var import_locale = require("date-fns/locale");
|
|
10957
|
-
var
|
|
10822
|
+
var import_react44 = require("react");
|
|
10958
10823
|
|
|
10959
10824
|
// src/components/picker/TimePicker.tsx
|
|
10960
10825
|
var import_framer_motion15 = require("framer-motion");
|
|
10961
10826
|
var React42 = __toESM(require("react"));
|
|
10962
10827
|
|
|
10963
10828
|
// src/components/picker/TimePickerInput.tsx
|
|
10964
|
-
var
|
|
10965
|
-
var
|
|
10829
|
+
var import_react42 = require("@phosphor-icons/react");
|
|
10830
|
+
var import_react43 = __toESM(require("react"));
|
|
10966
10831
|
|
|
10967
10832
|
// src/components/picker/utils/time-picker-utils.ts
|
|
10968
10833
|
function isValidHour(value) {
|
|
@@ -11105,7 +10970,7 @@ function display12HourValue(hours) {
|
|
|
11105
10970
|
|
|
11106
10971
|
// src/components/picker/TimePickerInput.tsx
|
|
11107
10972
|
var import_jsx_runtime65 = require("react/jsx-runtime");
|
|
11108
|
-
var TimePickerInput =
|
|
10973
|
+
var TimePickerInput = import_react43.default.forwardRef(
|
|
11109
10974
|
({
|
|
11110
10975
|
className,
|
|
11111
10976
|
type = "tel",
|
|
@@ -11124,10 +10989,10 @@ var TimePickerInput = import_react45.default.forwardRef(
|
|
|
11124
10989
|
label,
|
|
11125
10990
|
...props
|
|
11126
10991
|
}, ref) => {
|
|
11127
|
-
const [flag, setFlag] =
|
|
11128
|
-
const [prevIntKey, setPrevIntKey] =
|
|
11129
|
-
const [isFocused, setIsFocused] =
|
|
11130
|
-
|
|
10992
|
+
const [flag, setFlag] = import_react43.default.useState(false);
|
|
10993
|
+
const [prevIntKey, setPrevIntKey] = import_react43.default.useState("0");
|
|
10994
|
+
const [isFocused, setIsFocused] = import_react43.default.useState(false);
|
|
10995
|
+
import_react43.default.useEffect(() => {
|
|
11131
10996
|
if (flag) {
|
|
11132
10997
|
const timer = setTimeout(() => {
|
|
11133
10998
|
setFlag(false);
|
|
@@ -11135,7 +11000,7 @@ var TimePickerInput = import_react45.default.forwardRef(
|
|
|
11135
11000
|
return () => clearTimeout(timer);
|
|
11136
11001
|
}
|
|
11137
11002
|
}, [flag]);
|
|
11138
|
-
const calculatedValue =
|
|
11003
|
+
const calculatedValue = import_react43.default.useMemo(() => {
|
|
11139
11004
|
return getDateByType(date, picker);
|
|
11140
11005
|
}, [date, picker]);
|
|
11141
11006
|
const calculateNewValue = (key) => {
|
|
@@ -11224,7 +11089,7 @@ var TimePickerInput = import_react45.default.forwardRef(
|
|
|
11224
11089
|
),
|
|
11225
11090
|
tabIndex: -1,
|
|
11226
11091
|
"aria-label": `Incrementar ${getPickerLabel().toLowerCase()}`,
|
|
11227
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
|
|
11092
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_react42.CaretUpIcon, { size: 14, className: "sm:w-4 sm:h-4" })
|
|
11228
11093
|
}
|
|
11229
11094
|
),
|
|
11230
11095
|
/* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "relative", children: [
|
|
@@ -11291,7 +11156,7 @@ var TimePickerInput = import_react45.default.forwardRef(
|
|
|
11291
11156
|
),
|
|
11292
11157
|
tabIndex: -1,
|
|
11293
11158
|
"aria-label": `Decrementar ${getPickerLabel().toLowerCase()}`,
|
|
11294
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
|
|
11159
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_react42.CaretDownIcon, { size: 14, className: "sm:w-4 sm:h-4" })
|
|
11295
11160
|
}
|
|
11296
11161
|
)
|
|
11297
11162
|
]
|
|
@@ -11400,7 +11265,7 @@ function TimePicker({
|
|
|
11400
11265
|
}
|
|
11401
11266
|
|
|
11402
11267
|
// src/components/picker/DateTimePicker.tsx
|
|
11403
|
-
var
|
|
11268
|
+
var import_react45 = require("@phosphor-icons/react");
|
|
11404
11269
|
var import_jsx_runtime67 = require("react/jsx-runtime");
|
|
11405
11270
|
function DateTimePicker({
|
|
11406
11271
|
label,
|
|
@@ -11415,9 +11280,9 @@ function DateTimePicker({
|
|
|
11415
11280
|
className,
|
|
11416
11281
|
error
|
|
11417
11282
|
}) {
|
|
11418
|
-
const [internalDate, setInternalDate] = (0,
|
|
11419
|
-
const [open, setOpen] = (0,
|
|
11420
|
-
const [timePickerOpen, setTimePickerOpen] = (0,
|
|
11283
|
+
const [internalDate, setInternalDate] = (0, import_react44.useState)(date);
|
|
11284
|
+
const [open, setOpen] = (0, import_react44.useState)(false);
|
|
11285
|
+
const [timePickerOpen, setTimePickerOpen] = (0, import_react44.useState)(false);
|
|
11421
11286
|
const handleSelect = (newDay) => {
|
|
11422
11287
|
if (!newDay) return;
|
|
11423
11288
|
if (!internalDate) {
|
|
@@ -11448,7 +11313,7 @@ function DateTimePicker({
|
|
|
11448
11313
|
if (!timeFormat) return "dd MMMM yyyy";
|
|
11449
11314
|
return `dd MMMM yyyy - ${timeFormat}`;
|
|
11450
11315
|
};
|
|
11451
|
-
(0,
|
|
11316
|
+
(0, import_react44.useEffect)(() => {
|
|
11452
11317
|
setInternalDate(date);
|
|
11453
11318
|
}, [date, open]);
|
|
11454
11319
|
return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className: cn("w-full sm:w-auto", className), children: [
|
|
@@ -11479,7 +11344,7 @@ function DateTimePicker({
|
|
|
11479
11344
|
children: date ? (0, import_date_fns.format)(date, getDisplayFormat(), { locale: import_locale.ptBR }) : "Selecione uma data"
|
|
11480
11345
|
}
|
|
11481
11346
|
),
|
|
11482
|
-
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
|
|
11347
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_react45.CalendarBlankIcon, { className: "flex-shrink-0 w-5 h-5 sm:w-6 sm:h-6" })
|
|
11483
11348
|
]
|
|
11484
11349
|
}
|
|
11485
11350
|
)
|
|
@@ -11529,7 +11394,7 @@ function DateTimePicker({
|
|
|
11529
11394
|
"shadow-sm hover:shadow-md no-active-animation"
|
|
11530
11395
|
),
|
|
11531
11396
|
children: [
|
|
11532
|
-
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
|
|
11397
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_react45.ClockIcon, { className: "text-primary flex-shrink-0 w-4 h-4 sm:w-5 sm:h-5" }),
|
|
11533
11398
|
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("span", { className: "text-black truncate", children: internalDate ? (0, import_date_fns.format)(internalDate, getTimeFormat() || "HH:mm", {
|
|
11534
11399
|
locale: import_locale.ptBR
|
|
11535
11400
|
}) : "00:00" })
|
|
@@ -11592,7 +11457,7 @@ var React43 = __toESM(require("react"));
|
|
|
11592
11457
|
var import_react_day_picker3 = require("react-day-picker");
|
|
11593
11458
|
var import_pt_BR = __toESM(require("date-fns/locale/pt-BR"));
|
|
11594
11459
|
var import_date_fns2 = require("date-fns");
|
|
11595
|
-
var
|
|
11460
|
+
var import_react46 = require("@phosphor-icons/react");
|
|
11596
11461
|
var import_framer_motion16 = require("framer-motion");
|
|
11597
11462
|
var import_ssr7 = require("@phosphor-icons/react/dist/ssr");
|
|
11598
11463
|
var import_jsx_runtime68 = require("react/jsx-runtime");
|
|
@@ -11654,7 +11519,7 @@ function RangePicker({
|
|
|
11654
11519
|
{
|
|
11655
11520
|
animate: open ? { rotate: 8, scale: 1.15 } : { rotate: 0, scale: 1 },
|
|
11656
11521
|
transition: { type: "spring", stiffness: 300, damping: 18 },
|
|
11657
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
|
|
11522
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react46.CalendarBlankIcon, { className: "flex-shrink-0 w-5 h-5 sm:w-6 sm:h-6" })
|
|
11658
11523
|
}
|
|
11659
11524
|
)
|
|
11660
11525
|
]
|
|
@@ -11731,8 +11596,8 @@ function RangePicker({
|
|
|
11731
11596
|
day_hidden: "invisible"
|
|
11732
11597
|
},
|
|
11733
11598
|
components: {
|
|
11734
|
-
IconLeft: () => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
|
|
11735
|
-
IconRight: () => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
|
|
11599
|
+
IconLeft: () => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react46.CaretLeftIcon, { className: "h-4 w-4" }),
|
|
11600
|
+
IconRight: () => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react46.CaretRightIcon, { className: "h-4 w-4" })
|
|
11736
11601
|
}
|
|
11737
11602
|
}
|
|
11738
11603
|
)
|
|
@@ -11804,7 +11669,7 @@ RangePicker.displayName = "RangePicker";
|
|
|
11804
11669
|
|
|
11805
11670
|
// src/components/ui/navigation/ContextMenuBase.tsx
|
|
11806
11671
|
var ContextMenuPrimitive = __toESM(require("@radix-ui/react-context-menu"));
|
|
11807
|
-
var
|
|
11672
|
+
var import_react47 = require("@phosphor-icons/react");
|
|
11808
11673
|
var import_jsx_runtime69 = require("react/jsx-runtime");
|
|
11809
11674
|
function ContextMenuBase(props) {
|
|
11810
11675
|
return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ContextMenuPrimitive.Root, { "data-slot": "context-menu", ...props });
|
|
@@ -11846,7 +11711,7 @@ function ContextMenuSubTriggerBase({
|
|
|
11846
11711
|
...props,
|
|
11847
11712
|
children: [
|
|
11848
11713
|
children,
|
|
11849
|
-
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
11714
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react47.CaretRightIcon, { className: "ml-auto" })
|
|
11850
11715
|
]
|
|
11851
11716
|
}
|
|
11852
11717
|
);
|
|
@@ -11941,7 +11806,7 @@ function ContextMenuCheckboxItemBase({
|
|
|
11941
11806
|
checked,
|
|
11942
11807
|
...props,
|
|
11943
11808
|
children: [
|
|
11944
|
-
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
11809
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react47.CheckIcon, { className: "size-4" }) }) }),
|
|
11945
11810
|
children
|
|
11946
11811
|
]
|
|
11947
11812
|
}
|
|
@@ -11966,7 +11831,7 @@ function ContextMenuRadioItemBase({
|
|
|
11966
11831
|
),
|
|
11967
11832
|
...props,
|
|
11968
11833
|
children: [
|
|
11969
|
-
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
11834
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react47.CircleIcon, { className: "size-2 fill-current" }) }) }),
|
|
11970
11835
|
children
|
|
11971
11836
|
]
|
|
11972
11837
|
}
|
|
@@ -12015,8 +11880,8 @@ function ContextMenuShortcutBase({
|
|
|
12015
11880
|
}
|
|
12016
11881
|
|
|
12017
11882
|
// src/components/ui/CodeBlock.tsx
|
|
12018
|
-
var
|
|
12019
|
-
var
|
|
11883
|
+
var import_react48 = require("@phosphor-icons/react");
|
|
11884
|
+
var import_react49 = __toESM(require("react"));
|
|
12020
11885
|
var import_react_syntax_highlighter = require("react-syntax-highlighter");
|
|
12021
11886
|
var import_jsx_runtime70 = require("react/jsx-runtime");
|
|
12022
11887
|
var CodeBlock = ({
|
|
@@ -12028,11 +11893,11 @@ var CodeBlock = ({
|
|
|
12028
11893
|
breadcrumb = [],
|
|
12029
11894
|
showStats = true
|
|
12030
11895
|
}) => {
|
|
12031
|
-
const [copied, setCopied] =
|
|
12032
|
-
const [activeTab, setActiveTab] =
|
|
12033
|
-
const [isExpanded, setIsExpanded] =
|
|
11896
|
+
const [copied, setCopied] = import_react49.default.useState(false);
|
|
11897
|
+
const [activeTab, setActiveTab] = import_react49.default.useState(0);
|
|
11898
|
+
const [isExpanded, setIsExpanded] = import_react49.default.useState(false);
|
|
12034
11899
|
const tabsExist = tabs.length > 0;
|
|
12035
|
-
const cssVars =
|
|
11900
|
+
const cssVars = import_react49.default.useMemo(
|
|
12036
11901
|
() => ({
|
|
12037
11902
|
container: {
|
|
12038
11903
|
backgroundColor: "hsl(var(--card))",
|
|
@@ -12097,12 +11962,12 @@ var CodeBlock = ({
|
|
|
12097
11962
|
case "jsx":
|
|
12098
11963
|
case "typescript":
|
|
12099
11964
|
case "tsx":
|
|
12100
|
-
return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
11965
|
+
return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_react48.CodeIcon, { size: "1em", className: "text-yellow-400" });
|
|
12101
11966
|
case "bash":
|
|
12102
11967
|
case "shell":
|
|
12103
|
-
return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
11968
|
+
return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_react48.TerminalIcon, { size: "1em", className: "text-green-400" });
|
|
12104
11969
|
default:
|
|
12105
|
-
return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
11970
|
+
return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_react48.FileArchiveIcon, { size: "1em", className: "text-blue-400" });
|
|
12106
11971
|
}
|
|
12107
11972
|
};
|
|
12108
11973
|
const getCodeStats = (source) => {
|
|
@@ -12127,8 +11992,8 @@ var CodeBlock = ({
|
|
|
12127
11992
|
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "w-3 h-3 rounded-full bg-green-500" })
|
|
12128
11993
|
] }),
|
|
12129
11994
|
breadcrumb.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "flex items-center min-w-0", children: [
|
|
12130
|
-
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
12131
|
-
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "flex items-center min-w-0 ml-2", children: breadcrumb.map((crumb, index) => /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(
|
|
11995
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_react48.FolderIcon, { size: "1em", style: cssVars.icon }),
|
|
11996
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "flex items-center min-w-0 ml-2", children: breadcrumb.map((crumb, index) => /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_react49.default.Fragment, { children: [
|
|
12132
11997
|
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
12133
11998
|
"span",
|
|
12134
11999
|
{
|
|
@@ -12138,7 +12003,7 @@ var CodeBlock = ({
|
|
|
12138
12003
|
}
|
|
12139
12004
|
),
|
|
12140
12005
|
index < breadcrumb.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
12141
|
-
|
|
12006
|
+
import_react48.ArrowRightIcon,
|
|
12142
12007
|
{
|
|
12143
12008
|
size: "0.75em",
|
|
12144
12009
|
style: cssVars.icon,
|
|
@@ -12169,7 +12034,7 @@ var CodeBlock = ({
|
|
|
12169
12034
|
onClick: () => setIsExpanded(!isExpanded),
|
|
12170
12035
|
className: `p-2 transition-colors hover:bg-gray-200 dark:hover:bg-slate-700`,
|
|
12171
12036
|
title: "Toggle fullscreen",
|
|
12172
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
12037
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_react48.ArrowsOutIcon, { size: "1em", style: cssVars.icon })
|
|
12173
12038
|
}
|
|
12174
12039
|
),
|
|
12175
12040
|
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
@@ -12178,7 +12043,7 @@ var CodeBlock = ({
|
|
|
12178
12043
|
onClick: downloadCode,
|
|
12179
12044
|
className: `p-2 transition-colors hover:bg-gray-200 dark:hover:bg-slate-700`,
|
|
12180
12045
|
title: "Download code",
|
|
12181
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
12046
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_react48.DownloadIcon, { size: "1em", style: cssVars.icon })
|
|
12182
12047
|
}
|
|
12183
12048
|
),
|
|
12184
12049
|
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
@@ -12188,12 +12053,12 @@ var CodeBlock = ({
|
|
|
12188
12053
|
className: `p-2 transition-colors hover:bg-gray-200 dark:hover:bg-slate-700`,
|
|
12189
12054
|
title: "Copy code",
|
|
12190
12055
|
children: copied ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
12191
|
-
|
|
12056
|
+
import_react48.CheckIcon,
|
|
12192
12057
|
{
|
|
12193
12058
|
size: "1em",
|
|
12194
12059
|
style: { color: "hsl(var(--primary))" }
|
|
12195
12060
|
}
|
|
12196
|
-
) : /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
12061
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_react48.CopyIcon, { size: "1em", style: cssVars.icon })
|
|
12197
12062
|
}
|
|
12198
12063
|
)
|
|
12199
12064
|
] })
|
|
@@ -12306,7 +12171,7 @@ var CodeBlock = ({
|
|
|
12306
12171
|
] })
|
|
12307
12172
|
] }),
|
|
12308
12173
|
/* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "flex items-center gap-1 shrink-0", children: [
|
|
12309
|
-
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
12174
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_react48.GearIcon, { size: "0.75em", style: cssVars.icon }),
|
|
12310
12175
|
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { children: "UTF-8" })
|
|
12311
12176
|
] })
|
|
12312
12177
|
]
|
|
@@ -12385,8 +12250,8 @@ function StatusIndicator({
|
|
|
12385
12250
|
}
|
|
12386
12251
|
|
|
12387
12252
|
// src/components/ui/form/DebouncedInput.tsx
|
|
12388
|
-
var
|
|
12389
|
-
var
|
|
12253
|
+
var import_react50 = require("react");
|
|
12254
|
+
var import_react51 = require("@phosphor-icons/react");
|
|
12390
12255
|
var import_jsx_runtime72 = require("react/jsx-runtime");
|
|
12391
12256
|
function DebouncedInput({
|
|
12392
12257
|
value: initialValue,
|
|
@@ -12401,12 +12266,12 @@ function DebouncedInput({
|
|
|
12401
12266
|
error,
|
|
12402
12267
|
...props
|
|
12403
12268
|
}) {
|
|
12404
|
-
const [value, setValue] = (0,
|
|
12405
|
-
const [isDebouncing, setIsDebouncing] = (0,
|
|
12406
|
-
(0,
|
|
12269
|
+
const [value, setValue] = (0, import_react50.useState)(initialValue);
|
|
12270
|
+
const [isDebouncing, setIsDebouncing] = (0, import_react50.useState)(false);
|
|
12271
|
+
(0, import_react50.useEffect)(() => {
|
|
12407
12272
|
setValue(initialValue);
|
|
12408
12273
|
}, [initialValue]);
|
|
12409
|
-
(0,
|
|
12274
|
+
(0, import_react50.useEffect)(() => {
|
|
12410
12275
|
if (value !== initialValue) {
|
|
12411
12276
|
setIsDebouncing(true);
|
|
12412
12277
|
}
|
|
@@ -12421,7 +12286,7 @@ function DebouncedInput({
|
|
|
12421
12286
|
}, [debounce, initialValue, onChange, value]);
|
|
12422
12287
|
const renderRightIcon = () => {
|
|
12423
12288
|
if (showLoadingIndicator && isDebouncing) {
|
|
12424
|
-
return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
|
|
12289
|
+
return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(import_react51.CircleNotchIcon, { className: "h-4 w-4 animate-spin text-muted-foreground" });
|
|
12425
12290
|
}
|
|
12426
12291
|
return rightIcon;
|
|
12427
12292
|
};
|
|
@@ -12444,15 +12309,15 @@ function DebouncedInput({
|
|
|
12444
12309
|
// src/components/event-calendar/AgendaView.tsx
|
|
12445
12310
|
var import_date_fns3 = require("date-fns");
|
|
12446
12311
|
var import_locale2 = require("date-fns/locale");
|
|
12447
|
-
var
|
|
12448
|
-
var
|
|
12312
|
+
var import_react52 = require("react");
|
|
12313
|
+
var import_react53 = require("@phosphor-icons/react");
|
|
12449
12314
|
var import_jsx_runtime73 = require("react/jsx-runtime");
|
|
12450
12315
|
function AgendaView({
|
|
12451
12316
|
currentDate,
|
|
12452
12317
|
events,
|
|
12453
12318
|
onEventSelect
|
|
12454
12319
|
}) {
|
|
12455
|
-
const days = (0,
|
|
12320
|
+
const days = (0, import_react52.useMemo)(() => {
|
|
12456
12321
|
console.log("Agenda view updating with date:", currentDate.toISOString());
|
|
12457
12322
|
return Array.from(
|
|
12458
12323
|
{ length: AgendaDaysToShow },
|
|
@@ -12468,7 +12333,7 @@ function AgendaView({
|
|
|
12468
12333
|
(day) => getAgendaEventsForDay(events, day).length > 0
|
|
12469
12334
|
);
|
|
12470
12335
|
return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: "border-border/70 border-t px-4", children: !hasEvents ? /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "flex min-h-[70svh] flex-col items-center justify-center py-16 text-center", children: [
|
|
12471
|
-
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
|
|
12336
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_react53.CalendarIcon, { className: "mb-2 text-muted-foreground/50", size: 32 }),
|
|
12472
12337
|
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)("h3", { className: "font-medium text-lg", children: "Nenhum evento encontrado" }),
|
|
12473
12338
|
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)("p", { className: "text-muted-foreground", children: "N\xE3o h\xE1 eventos agendados para este per\xEDodo." })
|
|
12474
12339
|
] }) : days.map((day) => {
|
|
@@ -12509,11 +12374,11 @@ function AgendaView({
|
|
|
12509
12374
|
// src/components/event-calendar/CalendarDND.tsx
|
|
12510
12375
|
var import_core = require("@dnd-kit/core");
|
|
12511
12376
|
var import_date_fns4 = require("date-fns");
|
|
12512
|
-
var
|
|
12377
|
+
var import_react55 = require("react");
|
|
12513
12378
|
|
|
12514
12379
|
// src/components/event-calendar/hooks.ts
|
|
12515
|
-
var
|
|
12516
|
-
var CalendarDndContext = (0,
|
|
12380
|
+
var import_react54 = require("react");
|
|
12381
|
+
var CalendarDndContext = (0, import_react54.createContext)({
|
|
12517
12382
|
activeEvent: null,
|
|
12518
12383
|
activeId: null,
|
|
12519
12384
|
activeView: null,
|
|
@@ -12523,7 +12388,7 @@ var CalendarDndContext = (0, import_react56.createContext)({
|
|
|
12523
12388
|
isMultiDay: false,
|
|
12524
12389
|
multiDayWidth: null
|
|
12525
12390
|
});
|
|
12526
|
-
var useCalendarDnd = () => (0,
|
|
12391
|
+
var useCalendarDnd = () => (0, import_react54.useContext)(CalendarDndContext);
|
|
12527
12392
|
|
|
12528
12393
|
// src/components/event-calendar/CalendarDND.tsx
|
|
12529
12394
|
var import_jsx_runtime74 = require("react/jsx-runtime");
|
|
@@ -12531,17 +12396,17 @@ function CalendarDndProvider({
|
|
|
12531
12396
|
children,
|
|
12532
12397
|
onEventUpdate
|
|
12533
12398
|
}) {
|
|
12534
|
-
const [activeEvent, setActiveEvent] = (0,
|
|
12535
|
-
const [activeId, setActiveId] = (0,
|
|
12536
|
-
const [activeView, setActiveView] = (0,
|
|
12399
|
+
const [activeEvent, setActiveEvent] = (0, import_react55.useState)(null);
|
|
12400
|
+
const [activeId, setActiveId] = (0, import_react55.useState)(null);
|
|
12401
|
+
const [activeView, setActiveView] = (0, import_react55.useState)(
|
|
12537
12402
|
null
|
|
12538
12403
|
);
|
|
12539
|
-
const [currentTime, setCurrentTime] = (0,
|
|
12540
|
-
const [eventHeight, setEventHeight] = (0,
|
|
12541
|
-
const [isMultiDay, setIsMultiDay] = (0,
|
|
12542
|
-
const [multiDayWidth, setMultiDayWidth] = (0,
|
|
12543
|
-
const [dragHandlePosition, setDragHandlePosition] = (0,
|
|
12544
|
-
const eventDimensions = (0,
|
|
12404
|
+
const [currentTime, setCurrentTime] = (0, import_react55.useState)(null);
|
|
12405
|
+
const [eventHeight, setEventHeight] = (0, import_react55.useState)(null);
|
|
12406
|
+
const [isMultiDay, setIsMultiDay] = (0, import_react55.useState)(false);
|
|
12407
|
+
const [multiDayWidth, setMultiDayWidth] = (0, import_react55.useState)(null);
|
|
12408
|
+
const [dragHandlePosition, setDragHandlePosition] = (0, import_react55.useState)(null);
|
|
12409
|
+
const eventDimensions = (0, import_react55.useRef)({ height: 0 });
|
|
12545
12410
|
const sensors = (0, import_core.useSensors)(
|
|
12546
12411
|
(0, import_core.useSensor)(import_core.MouseSensor, {
|
|
12547
12412
|
// Require the mouse to move by 5px before activating
|
|
@@ -12563,7 +12428,7 @@ function CalendarDndProvider({
|
|
|
12563
12428
|
}
|
|
12564
12429
|
})
|
|
12565
12430
|
);
|
|
12566
|
-
const dndContextId = (0,
|
|
12431
|
+
const dndContextId = (0, import_react55.useId)();
|
|
12567
12432
|
const handleDragStart = (event) => {
|
|
12568
12433
|
const { active } = event;
|
|
12569
12434
|
if (!active.data.current) {
|
|
@@ -12755,7 +12620,7 @@ var DefaultEndHour = 10;
|
|
|
12755
12620
|
|
|
12756
12621
|
// src/components/event-calendar/DayView.tsx
|
|
12757
12622
|
var import_date_fns5 = require("date-fns");
|
|
12758
|
-
var
|
|
12623
|
+
var import_react56 = require("react");
|
|
12759
12624
|
var import_jsx_runtime75 = require("react/jsx-runtime");
|
|
12760
12625
|
function DayView({
|
|
12761
12626
|
currentDate,
|
|
@@ -12763,14 +12628,14 @@ function DayView({
|
|
|
12763
12628
|
onEventSelect,
|
|
12764
12629
|
onEventCreate
|
|
12765
12630
|
}) {
|
|
12766
|
-
const hours = (0,
|
|
12631
|
+
const hours = (0, import_react56.useMemo)(() => {
|
|
12767
12632
|
const dayStart = (0, import_date_fns5.startOfDay)(currentDate);
|
|
12768
12633
|
return (0, import_date_fns5.eachHourOfInterval)({
|
|
12769
12634
|
end: (0, import_date_fns5.addHours)(dayStart, EndHour - 1),
|
|
12770
12635
|
start: (0, import_date_fns5.addHours)(dayStart, StartHour)
|
|
12771
12636
|
});
|
|
12772
12637
|
}, [currentDate]);
|
|
12773
|
-
const dayEvents = (0,
|
|
12638
|
+
const dayEvents = (0, import_react56.useMemo)(() => {
|
|
12774
12639
|
return events.filter((event) => {
|
|
12775
12640
|
const eventStart = new Date(event.start);
|
|
12776
12641
|
const eventEnd = new Date(event.end);
|
|
@@ -12779,17 +12644,17 @@ function DayView({
|
|
|
12779
12644
|
(a, b) => new Date(a.start).getTime() - new Date(b.start).getTime()
|
|
12780
12645
|
);
|
|
12781
12646
|
}, [currentDate, events]);
|
|
12782
|
-
const allDayEvents = (0,
|
|
12647
|
+
const allDayEvents = (0, import_react56.useMemo)(() => {
|
|
12783
12648
|
return dayEvents.filter((event) => {
|
|
12784
12649
|
return event.allDay || isMultiDayEvent(event);
|
|
12785
12650
|
});
|
|
12786
12651
|
}, [dayEvents]);
|
|
12787
|
-
const timeEvents = (0,
|
|
12652
|
+
const timeEvents = (0, import_react56.useMemo)(() => {
|
|
12788
12653
|
return dayEvents.filter((event) => {
|
|
12789
12654
|
return !event.allDay && !isMultiDayEvent(event);
|
|
12790
12655
|
});
|
|
12791
12656
|
}, [dayEvents]);
|
|
12792
|
-
const positionedEvents = (0,
|
|
12657
|
+
const positionedEvents = (0, import_react56.useMemo)(() => {
|
|
12793
12658
|
const result = [];
|
|
12794
12659
|
const dayStart = (0, import_date_fns5.startOfDay)(currentDate);
|
|
12795
12660
|
const sortedEvents = [...timeEvents].sort((a, b) => {
|
|
@@ -12970,7 +12835,7 @@ function DayView({
|
|
|
12970
12835
|
var import_core2 = require("@dnd-kit/core");
|
|
12971
12836
|
var import_utilities = require("@dnd-kit/utilities");
|
|
12972
12837
|
var import_date_fns6 = require("date-fns");
|
|
12973
|
-
var
|
|
12838
|
+
var import_react57 = require("react");
|
|
12974
12839
|
var import_jsx_runtime76 = require("react/jsx-runtime");
|
|
12975
12840
|
function DraggableEvent({
|
|
12976
12841
|
event,
|
|
@@ -12985,8 +12850,8 @@ function DraggableEvent({
|
|
|
12985
12850
|
"aria-hidden": ariaHidden
|
|
12986
12851
|
}) {
|
|
12987
12852
|
const { activeId } = useCalendarDnd();
|
|
12988
|
-
const elementRef = (0,
|
|
12989
|
-
const [dragHandlePosition, setDragHandlePosition] = (0,
|
|
12853
|
+
const elementRef = (0, import_react57.useRef)(null);
|
|
12854
|
+
const [dragHandlePosition, setDragHandlePosition] = (0, import_react57.useState)(null);
|
|
12990
12855
|
const eventStart = new Date(event.start);
|
|
12991
12856
|
const eventEnd = new Date(event.end);
|
|
12992
12857
|
const isMultiDayEvent2 = isMultiDay || event.allDay || (0, import_date_fns6.differenceInDays)(eventEnd, eventStart) >= 1;
|
|
@@ -13111,9 +12976,9 @@ function DroppableCell({
|
|
|
13111
12976
|
// src/components/event-calendar/EventCalendar.tsx
|
|
13112
12977
|
var import_date_fns7 = require("date-fns");
|
|
13113
12978
|
var import_locale3 = require("date-fns/locale");
|
|
13114
|
-
var
|
|
12979
|
+
var import_react58 = require("react");
|
|
13115
12980
|
var import_sonner3 = require("sonner");
|
|
13116
|
-
var
|
|
12981
|
+
var import_react59 = require("@phosphor-icons/react");
|
|
13117
12982
|
var import_jsx_runtime78 = require("react/jsx-runtime");
|
|
13118
12983
|
function EventCalendar({
|
|
13119
12984
|
events = [],
|
|
@@ -13123,11 +12988,11 @@ function EventCalendar({
|
|
|
13123
12988
|
className,
|
|
13124
12989
|
initialView = "month"
|
|
13125
12990
|
}) {
|
|
13126
|
-
const [currentDate, setCurrentDate] = (0,
|
|
13127
|
-
const [view, setView] = (0,
|
|
13128
|
-
const [isFading, setIsFading] = (0,
|
|
12991
|
+
const [currentDate, setCurrentDate] = (0, import_react58.useState)(/* @__PURE__ */ new Date());
|
|
12992
|
+
const [view, setView] = (0, import_react58.useState)(initialView);
|
|
12993
|
+
const [isFading, setIsFading] = (0, import_react58.useState)(false);
|
|
13129
12994
|
const FADE_DURATION = 220;
|
|
13130
|
-
const changeView = (0,
|
|
12995
|
+
const changeView = (0, import_react58.useCallback)(
|
|
13131
12996
|
(next) => {
|
|
13132
12997
|
if (next === view) return;
|
|
13133
12998
|
setIsFading(true);
|
|
@@ -13138,12 +13003,12 @@ function EventCalendar({
|
|
|
13138
13003
|
},
|
|
13139
13004
|
[view]
|
|
13140
13005
|
);
|
|
13141
|
-
const [isPaging, setIsPaging] = (0,
|
|
13142
|
-
const [pageDirection, setPageDirection] = (0,
|
|
13006
|
+
const [isPaging, setIsPaging] = (0, import_react58.useState)(false);
|
|
13007
|
+
const [pageDirection, setPageDirection] = (0, import_react58.useState)(
|
|
13143
13008
|
null
|
|
13144
13009
|
);
|
|
13145
13010
|
const PAGE_DURATION = 200;
|
|
13146
|
-
const pageTransition = (0,
|
|
13011
|
+
const pageTransition = (0, import_react58.useCallback)(
|
|
13147
13012
|
(applyDateChange, direction) => {
|
|
13148
13013
|
setIsPaging(true);
|
|
13149
13014
|
setPageDirection(direction);
|
|
@@ -13157,11 +13022,11 @@ function EventCalendar({
|
|
|
13157
13022
|
},
|
|
13158
13023
|
[]
|
|
13159
13024
|
);
|
|
13160
|
-
const [isEventDialogOpen, setIsEventDialogOpen] = (0,
|
|
13161
|
-
const [selectedEvent, setSelectedEvent] = (0,
|
|
13025
|
+
const [isEventDialogOpen, setIsEventDialogOpen] = (0, import_react58.useState)(false);
|
|
13026
|
+
const [selectedEvent, setSelectedEvent] = (0, import_react58.useState)(
|
|
13162
13027
|
null
|
|
13163
13028
|
);
|
|
13164
|
-
(0,
|
|
13029
|
+
(0, import_react58.useEffect)(() => {
|
|
13165
13030
|
const handleKeyDown = (e) => {
|
|
13166
13031
|
if (isEventDialogOpen || e.target instanceof HTMLInputElement || e.target instanceof HTMLTextAreaElement || e.target instanceof HTMLElement && e.target.isContentEditable) {
|
|
13167
13032
|
return;
|
|
@@ -13296,7 +13161,7 @@ function EventCalendar({
|
|
|
13296
13161
|
position: "bottom-left"
|
|
13297
13162
|
});
|
|
13298
13163
|
};
|
|
13299
|
-
const viewTitle = (0,
|
|
13164
|
+
const viewTitle = (0, import_react58.useMemo)(() => {
|
|
13300
13165
|
const capitalize = (s) => s && s.length > 0 ? s.charAt(0).toUpperCase() + s.slice(1) : s;
|
|
13301
13166
|
if (view === "month") {
|
|
13302
13167
|
return capitalize((0, import_date_fns7.format)(currentDate, "MMMM yyyy", { locale: import_locale3.ptBR }));
|
|
@@ -13362,7 +13227,7 @@ function EventCalendar({
|
|
|
13362
13227
|
variant: "outline",
|
|
13363
13228
|
children: [
|
|
13364
13229
|
/* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
|
|
13365
|
-
|
|
13230
|
+
import_react59.CalendarIcon,
|
|
13366
13231
|
{
|
|
13367
13232
|
"aria-hidden": "true",
|
|
13368
13233
|
className: "min-[480px]:hidden",
|
|
@@ -13381,7 +13246,7 @@ function EventCalendar({
|
|
|
13381
13246
|
onClick: handlePrevious,
|
|
13382
13247
|
size: "icon",
|
|
13383
13248
|
variant: "ghost",
|
|
13384
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
|
|
13249
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(import_react59.CaretLeft, { "aria-hidden": "true", size: 16 })
|
|
13385
13250
|
}
|
|
13386
13251
|
),
|
|
13387
13252
|
/* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
|
|
@@ -13391,7 +13256,7 @@ function EventCalendar({
|
|
|
13391
13256
|
onClick: handleNext,
|
|
13392
13257
|
size: "icon",
|
|
13393
13258
|
variant: "ghost",
|
|
13394
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
|
|
13259
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(import_react59.CaretRight, { "aria-hidden": "true", size: 16 })
|
|
13395
13260
|
}
|
|
13396
13261
|
)
|
|
13397
13262
|
] }),
|
|
@@ -13426,7 +13291,7 @@ function EventCalendar({
|
|
|
13426
13291
|
})() })
|
|
13427
13292
|
] }),
|
|
13428
13293
|
/* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
|
|
13429
|
-
|
|
13294
|
+
import_react59.ArrowDownIcon,
|
|
13430
13295
|
{
|
|
13431
13296
|
"aria-hidden": "true",
|
|
13432
13297
|
className: "-me-1 opacity-60",
|
|
@@ -13466,7 +13331,7 @@ function EventCalendar({
|
|
|
13466
13331
|
size: "sm",
|
|
13467
13332
|
children: [
|
|
13468
13333
|
/* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
|
|
13469
|
-
|
|
13334
|
+
import_react59.PlusIcon,
|
|
13470
13335
|
{
|
|
13471
13336
|
"aria-hidden": "true",
|
|
13472
13337
|
className: "sm:-ms-1 opacity-60",
|
|
@@ -13548,11 +13413,11 @@ function EventCalendar({
|
|
|
13548
13413
|
|
|
13549
13414
|
// src/components/event-calendar/EventDialog.tsx
|
|
13550
13415
|
var import_date_fns8 = require("date-fns");
|
|
13551
|
-
var
|
|
13416
|
+
var import_react60 = require("react");
|
|
13552
13417
|
var import_react_radio_group = require("@radix-ui/react-radio-group");
|
|
13553
13418
|
var import_framer_motion17 = require("framer-motion");
|
|
13554
13419
|
var import_locale4 = require("date-fns/locale");
|
|
13555
|
-
var
|
|
13420
|
+
var import_react61 = require("@phosphor-icons/react");
|
|
13556
13421
|
var import_jsx_runtime79 = require("react/jsx-runtime");
|
|
13557
13422
|
function EventDialog({
|
|
13558
13423
|
event,
|
|
@@ -13561,21 +13426,21 @@ function EventDialog({
|
|
|
13561
13426
|
onSave,
|
|
13562
13427
|
onDelete
|
|
13563
13428
|
}) {
|
|
13564
|
-
const [title, setTitle] = (0,
|
|
13565
|
-
const [description, setDescription] = (0,
|
|
13566
|
-
const [startDate, setStartDate] = (0,
|
|
13567
|
-
const [endDate, setEndDate] = (0,
|
|
13568
|
-
const [startTime, setStartTime] = (0,
|
|
13569
|
-
const [endTime, setEndTime] = (0,
|
|
13570
|
-
const [allDay, setAllDay] = (0,
|
|
13571
|
-
const [location, setLocation] = (0,
|
|
13572
|
-
const [color, setColor] = (0,
|
|
13573
|
-
const [error, setError] = (0,
|
|
13574
|
-
const [startDateOpen, setStartDateOpen] = (0,
|
|
13575
|
-
const [endDateOpen, setEndDateOpen] = (0,
|
|
13576
|
-
(0,
|
|
13429
|
+
const [title, setTitle] = (0, import_react60.useState)("");
|
|
13430
|
+
const [description, setDescription] = (0, import_react60.useState)("");
|
|
13431
|
+
const [startDate, setStartDate] = (0, import_react60.useState)(/* @__PURE__ */ new Date());
|
|
13432
|
+
const [endDate, setEndDate] = (0, import_react60.useState)(/* @__PURE__ */ new Date());
|
|
13433
|
+
const [startTime, setStartTime] = (0, import_react60.useState)(`${DefaultStartHour}:00`);
|
|
13434
|
+
const [endTime, setEndTime] = (0, import_react60.useState)(`${DefaultEndHour}:00`);
|
|
13435
|
+
const [allDay, setAllDay] = (0, import_react60.useState)(false);
|
|
13436
|
+
const [location, setLocation] = (0, import_react60.useState)("");
|
|
13437
|
+
const [color, setColor] = (0, import_react60.useState)("sky");
|
|
13438
|
+
const [error, setError] = (0, import_react60.useState)(null);
|
|
13439
|
+
const [startDateOpen, setStartDateOpen] = (0, import_react60.useState)(false);
|
|
13440
|
+
const [endDateOpen, setEndDateOpen] = (0, import_react60.useState)(false);
|
|
13441
|
+
(0, import_react60.useEffect)(() => {
|
|
13577
13442
|
}, [event]);
|
|
13578
|
-
const resetForm = (0,
|
|
13443
|
+
const resetForm = (0, import_react60.useCallback)(() => {
|
|
13579
13444
|
setTitle("");
|
|
13580
13445
|
setDescription("");
|
|
13581
13446
|
setStartDate(/* @__PURE__ */ new Date());
|
|
@@ -13587,12 +13452,12 @@ function EventDialog({
|
|
|
13587
13452
|
setColor("sky");
|
|
13588
13453
|
setError(null);
|
|
13589
13454
|
}, []);
|
|
13590
|
-
const formatTimeForInput = (0,
|
|
13455
|
+
const formatTimeForInput = (0, import_react60.useCallback)((date) => {
|
|
13591
13456
|
const hours = date.getHours().toString().padStart(2, "0");
|
|
13592
13457
|
const minutes = Math.floor(date.getMinutes() / 15) * 15;
|
|
13593
13458
|
return `${hours}:${minutes.toString().padStart(2, "0")}`;
|
|
13594
13459
|
}, []);
|
|
13595
|
-
(0,
|
|
13460
|
+
(0, import_react60.useEffect)(() => {
|
|
13596
13461
|
if (event) {
|
|
13597
13462
|
setTitle(event.title || "");
|
|
13598
13463
|
setDescription(event.description || "");
|
|
@@ -13610,7 +13475,7 @@ function EventDialog({
|
|
|
13610
13475
|
resetForm();
|
|
13611
13476
|
}
|
|
13612
13477
|
}, [event, formatTimeForInput, resetForm]);
|
|
13613
|
-
const timeOptions = (0,
|
|
13478
|
+
const timeOptions = (0, import_react60.useMemo)(() => {
|
|
13614
13479
|
const options = [];
|
|
13615
13480
|
for (let hour = StartHour; hour <= EndHour; hour++) {
|
|
13616
13481
|
for (let minute = 0; minute < 60; minute += 15) {
|
|
@@ -13799,7 +13664,7 @@ function EventDialog({
|
|
|
13799
13664
|
}
|
|
13800
13665
|
),
|
|
13801
13666
|
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
13802
|
-
|
|
13667
|
+
import_react61.CalendarIcon,
|
|
13803
13668
|
{
|
|
13804
13669
|
"aria-hidden": "true",
|
|
13805
13670
|
className: "shrink-0 text-muted-foreground/80",
|
|
@@ -13878,7 +13743,7 @@ function EventDialog({
|
|
|
13878
13743
|
}
|
|
13879
13744
|
),
|
|
13880
13745
|
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
13881
|
-
|
|
13746
|
+
import_react61.CalendarIcon,
|
|
13882
13747
|
{
|
|
13883
13748
|
"aria-hidden": "true",
|
|
13884
13749
|
className: "shrink-0 text-muted-foreground/80",
|
|
@@ -13936,7 +13801,7 @@ function EventDialog({
|
|
|
13936
13801
|
allDay ? "bg-primary border-transparent text-white" : " border border-input"
|
|
13937
13802
|
),
|
|
13938
13803
|
children: [
|
|
13939
|
-
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
13804
|
+
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)(import_react61.CalendarIcon, { size: 14, "aria-hidden": "true" }),
|
|
13940
13805
|
"Dia inteiro"
|
|
13941
13806
|
]
|
|
13942
13807
|
}
|
|
@@ -13995,7 +13860,7 @@ function EventDialog({
|
|
|
13995
13860
|
onClick: handleDelete,
|
|
13996
13861
|
size: "icon",
|
|
13997
13862
|
variant: "outline",
|
|
13998
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
13863
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(import_react61.TrashIcon, { "aria-hidden": "true", size: 16 })
|
|
13999
13864
|
}
|
|
14000
13865
|
),
|
|
14001
13866
|
/* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "flex flex-1 justify-end gap-2", children: [
|
|
@@ -14010,7 +13875,7 @@ function EventDialog({
|
|
|
14010
13875
|
|
|
14011
13876
|
// src/components/event-calendar/EventItem.tsx
|
|
14012
13877
|
var import_date_fns9 = require("date-fns");
|
|
14013
|
-
var
|
|
13878
|
+
var import_react62 = require("react");
|
|
14014
13879
|
var import_jsx_runtime80 = require("react/jsx-runtime");
|
|
14015
13880
|
var formatTimeWithOptionalMinutes = (date) => {
|
|
14016
13881
|
return (0, import_date_fns9.format)(date, "HH:mm");
|
|
@@ -14073,15 +13938,15 @@ function EventItem({
|
|
|
14073
13938
|
onTouchStart
|
|
14074
13939
|
}) {
|
|
14075
13940
|
const eventColor = event.color;
|
|
14076
|
-
const displayStart = (0,
|
|
13941
|
+
const displayStart = (0, import_react62.useMemo)(() => {
|
|
14077
13942
|
return currentTime || new Date(event.start);
|
|
14078
13943
|
}, [currentTime, event.start]);
|
|
14079
|
-
const displayEnd = (0,
|
|
13944
|
+
const displayEnd = (0, import_react62.useMemo)(() => {
|
|
14080
13945
|
return currentTime ? new Date(
|
|
14081
13946
|
new Date(currentTime).getTime() + (new Date(event.end).getTime() - new Date(event.start).getTime())
|
|
14082
13947
|
) : new Date(event.end);
|
|
14083
13948
|
}, [currentTime, event.start, event.end]);
|
|
14084
|
-
const durationMinutes = (0,
|
|
13949
|
+
const durationMinutes = (0, import_react62.useMemo)(() => {
|
|
14085
13950
|
return (0, import_date_fns9.differenceInMinutes)(displayEnd, displayStart);
|
|
14086
13951
|
}, [displayStart, displayEnd]);
|
|
14087
13952
|
const getEventTime = () => {
|
|
@@ -14204,9 +14069,9 @@ function EventItem({
|
|
|
14204
14069
|
// src/components/event-calendar/EventsPopUp.tsx
|
|
14205
14070
|
var import_date_fns10 = require("date-fns");
|
|
14206
14071
|
var import_locale5 = require("date-fns/locale");
|
|
14207
|
-
var
|
|
14072
|
+
var import_react63 = require("react");
|
|
14208
14073
|
var import_framer_motion18 = require("framer-motion");
|
|
14209
|
-
var
|
|
14074
|
+
var import_react64 = require("@phosphor-icons/react");
|
|
14210
14075
|
var import_jsx_runtime81 = require("react/jsx-runtime");
|
|
14211
14076
|
function EventsPopup({
|
|
14212
14077
|
date,
|
|
@@ -14215,8 +14080,8 @@ function EventsPopup({
|
|
|
14215
14080
|
onClose,
|
|
14216
14081
|
onEventSelect
|
|
14217
14082
|
}) {
|
|
14218
|
-
const popupRef = (0,
|
|
14219
|
-
(0,
|
|
14083
|
+
const popupRef = (0, import_react63.useRef)(null);
|
|
14084
|
+
(0, import_react63.useEffect)(() => {
|
|
14220
14085
|
const handleClickOutside = (event) => {
|
|
14221
14086
|
if (popupRef.current && !popupRef.current.contains(event.target)) {
|
|
14222
14087
|
onClose();
|
|
@@ -14227,7 +14092,7 @@ function EventsPopup({
|
|
|
14227
14092
|
document.removeEventListener("mousedown", handleClickOutside);
|
|
14228
14093
|
};
|
|
14229
14094
|
}, [onClose]);
|
|
14230
|
-
(0,
|
|
14095
|
+
(0, import_react63.useEffect)(() => {
|
|
14231
14096
|
const handleEscKey = (event) => {
|
|
14232
14097
|
if (event.key === "Escape") {
|
|
14233
14098
|
onClose();
|
|
@@ -14242,7 +14107,7 @@ function EventsPopup({
|
|
|
14242
14107
|
onEventSelect(event);
|
|
14243
14108
|
onClose();
|
|
14244
14109
|
};
|
|
14245
|
-
const adjustedPosition = (0,
|
|
14110
|
+
const adjustedPosition = (0, import_react63.useMemo)(() => {
|
|
14246
14111
|
const positionCopy = { ...position };
|
|
14247
14112
|
if (popupRef.current) {
|
|
14248
14113
|
const rect = popupRef.current.getBoundingClientRect();
|
|
@@ -14286,7 +14151,7 @@ function EventsPopup({
|
|
|
14286
14151
|
className: "rounded-full p-1 hover:bg-muted",
|
|
14287
14152
|
onClick: onClose,
|
|
14288
14153
|
type: "button",
|
|
14289
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
14154
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(import_react64.XIcon, { className: "h-4 w-4" })
|
|
14290
14155
|
}
|
|
14291
14156
|
)
|
|
14292
14157
|
] }),
|
|
@@ -14321,11 +14186,11 @@ function EventsPopup({
|
|
|
14321
14186
|
// src/components/event-calendar/hooks/use-current-time-indicator.ts
|
|
14322
14187
|
var import_date_fns11 = require("date-fns");
|
|
14323
14188
|
var import_locale6 = require("date-fns/locale");
|
|
14324
|
-
var
|
|
14189
|
+
var import_react65 = require("react");
|
|
14325
14190
|
function useCurrentTimeIndicator(currentDate, view) {
|
|
14326
|
-
const [currentTimePosition, setCurrentTimePosition] = (0,
|
|
14327
|
-
const [currentTimeVisible, setCurrentTimeVisible] = (0,
|
|
14328
|
-
(0,
|
|
14191
|
+
const [currentTimePosition, setCurrentTimePosition] = (0, import_react65.useState)(0);
|
|
14192
|
+
const [currentTimeVisible, setCurrentTimeVisible] = (0, import_react65.useState)(false);
|
|
14193
|
+
(0, import_react65.useEffect)(() => {
|
|
14329
14194
|
const calculateTimePosition = () => {
|
|
14330
14195
|
const now = /* @__PURE__ */ new Date();
|
|
14331
14196
|
const hours = now.getHours();
|
|
@@ -14356,15 +14221,15 @@ function useCurrentTimeIndicator(currentDate, view) {
|
|
|
14356
14221
|
}
|
|
14357
14222
|
|
|
14358
14223
|
// src/components/event-calendar/hooks/use-event-visibility.ts
|
|
14359
|
-
var
|
|
14224
|
+
var import_react66 = require("react");
|
|
14360
14225
|
function useEventVisibility({
|
|
14361
14226
|
eventHeight,
|
|
14362
14227
|
eventGap
|
|
14363
14228
|
}) {
|
|
14364
|
-
const contentRef = (0,
|
|
14365
|
-
const observerRef = (0,
|
|
14366
|
-
const [contentHeight, setContentHeight] = (0,
|
|
14367
|
-
(0,
|
|
14229
|
+
const contentRef = (0, import_react66.useRef)(null);
|
|
14230
|
+
const observerRef = (0, import_react66.useRef)(null);
|
|
14231
|
+
const [contentHeight, setContentHeight] = (0, import_react66.useState)(null);
|
|
14232
|
+
(0, import_react66.useLayoutEffect)(() => {
|
|
14368
14233
|
if (!contentRef.current) return;
|
|
14369
14234
|
const updateHeight = () => {
|
|
14370
14235
|
if (contentRef.current) {
|
|
@@ -14384,7 +14249,7 @@ function useEventVisibility({
|
|
|
14384
14249
|
}
|
|
14385
14250
|
};
|
|
14386
14251
|
}, []);
|
|
14387
|
-
const getVisibleEventCount = (0,
|
|
14252
|
+
const getVisibleEventCount = (0, import_react66.useMemo)(() => {
|
|
14388
14253
|
return (totalEvents) => {
|
|
14389
14254
|
if (!contentHeight) return totalEvents;
|
|
14390
14255
|
const maxEvents = Math.floor(contentHeight / (eventHeight + eventGap));
|
|
@@ -14404,7 +14269,7 @@ function useEventVisibility({
|
|
|
14404
14269
|
// src/components/event-calendar/MonthView.tsx
|
|
14405
14270
|
var import_date_fns12 = require("date-fns");
|
|
14406
14271
|
var import_locale7 = require("date-fns/locale");
|
|
14407
|
-
var
|
|
14272
|
+
var import_react67 = require("react");
|
|
14408
14273
|
var import_jsx_runtime82 = require("react/jsx-runtime");
|
|
14409
14274
|
function MonthView({
|
|
14410
14275
|
currentDate,
|
|
@@ -14412,21 +14277,21 @@ function MonthView({
|
|
|
14412
14277
|
onEventSelect,
|
|
14413
14278
|
onEventCreate
|
|
14414
14279
|
}) {
|
|
14415
|
-
const days = (0,
|
|
14280
|
+
const days = (0, import_react67.useMemo)(() => {
|
|
14416
14281
|
const monthStart = (0, import_date_fns12.startOfMonth)(currentDate);
|
|
14417
14282
|
const monthEnd = (0, import_date_fns12.endOfMonth)(monthStart);
|
|
14418
14283
|
const calendarStart = (0, import_date_fns12.startOfWeek)(monthStart, { weekStartsOn: 0 });
|
|
14419
14284
|
const calendarEnd = (0, import_date_fns12.endOfWeek)(monthEnd, { weekStartsOn: 0 });
|
|
14420
14285
|
return (0, import_date_fns12.eachDayOfInterval)({ end: calendarEnd, start: calendarStart });
|
|
14421
14286
|
}, [currentDate]);
|
|
14422
|
-
const weekdays = (0,
|
|
14287
|
+
const weekdays = (0, import_react67.useMemo)(() => {
|
|
14423
14288
|
return Array.from({ length: 7 }).map((_, i) => {
|
|
14424
14289
|
const date = (0, import_date_fns12.addDays)((0, import_date_fns12.startOfWeek)(/* @__PURE__ */ new Date(), { weekStartsOn: 0 }), i);
|
|
14425
14290
|
const short = (0, import_date_fns12.format)(date, "EEE", { locale: import_locale7.ptBR });
|
|
14426
14291
|
return short.charAt(0).toUpperCase() + short.slice(1);
|
|
14427
14292
|
});
|
|
14428
14293
|
}, []);
|
|
14429
|
-
const weeks = (0,
|
|
14294
|
+
const weeks = (0, import_react67.useMemo)(() => {
|
|
14430
14295
|
const result = [];
|
|
14431
14296
|
let week = [];
|
|
14432
14297
|
for (let i = 0; i < days.length; i++) {
|
|
@@ -14442,12 +14307,12 @@ function MonthView({
|
|
|
14442
14307
|
e.stopPropagation();
|
|
14443
14308
|
onEventSelect(event);
|
|
14444
14309
|
};
|
|
14445
|
-
const [isMounted, setIsMounted] = (0,
|
|
14310
|
+
const [isMounted, setIsMounted] = (0, import_react67.useState)(false);
|
|
14446
14311
|
const { contentRef, getVisibleEventCount } = useEventVisibility({
|
|
14447
14312
|
eventGap: EventGap,
|
|
14448
14313
|
eventHeight: EventHeight
|
|
14449
14314
|
});
|
|
14450
|
-
(0,
|
|
14315
|
+
(0, import_react67.useEffect)(() => {
|
|
14451
14316
|
setIsMounted(true);
|
|
14452
14317
|
}, []);
|
|
14453
14318
|
return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "contents", "data-slot": "month-view", children: [
|
|
@@ -14704,7 +14569,7 @@ function addHoursToDate(date, hours) {
|
|
|
14704
14569
|
// src/components/event-calendar/WeekView.tsx
|
|
14705
14570
|
var import_date_fns14 = require("date-fns");
|
|
14706
14571
|
var import_locale8 = require("date-fns/locale");
|
|
14707
|
-
var
|
|
14572
|
+
var import_react68 = require("react");
|
|
14708
14573
|
var import_jsx_runtime83 = require("react/jsx-runtime");
|
|
14709
14574
|
function WeekView({
|
|
14710
14575
|
currentDate,
|
|
@@ -14712,23 +14577,23 @@ function WeekView({
|
|
|
14712
14577
|
onEventSelect,
|
|
14713
14578
|
onEventCreate
|
|
14714
14579
|
}) {
|
|
14715
|
-
const days = (0,
|
|
14580
|
+
const days = (0, import_react68.useMemo)(() => {
|
|
14716
14581
|
const weekStart2 = (0, import_date_fns14.startOfWeek)(currentDate, { weekStartsOn: 0 });
|
|
14717
14582
|
const weekEnd = (0, import_date_fns14.endOfWeek)(currentDate, { weekStartsOn: 0 });
|
|
14718
14583
|
return (0, import_date_fns14.eachDayOfInterval)({ end: weekEnd, start: weekStart2 });
|
|
14719
14584
|
}, [currentDate]);
|
|
14720
|
-
const weekStart = (0,
|
|
14585
|
+
const weekStart = (0, import_react68.useMemo)(
|
|
14721
14586
|
() => (0, import_date_fns14.startOfWeek)(currentDate, { weekStartsOn: 0 }),
|
|
14722
14587
|
[currentDate]
|
|
14723
14588
|
);
|
|
14724
|
-
const hours = (0,
|
|
14589
|
+
const hours = (0, import_react68.useMemo)(() => {
|
|
14725
14590
|
const dayStart = (0, import_date_fns14.startOfDay)(currentDate);
|
|
14726
14591
|
return (0, import_date_fns14.eachHourOfInterval)({
|
|
14727
14592
|
end: (0, import_date_fns14.addHours)(dayStart, EndHour - 1),
|
|
14728
14593
|
start: (0, import_date_fns14.addHours)(dayStart, StartHour)
|
|
14729
14594
|
});
|
|
14730
14595
|
}, [currentDate]);
|
|
14731
|
-
const allDayEvents = (0,
|
|
14596
|
+
const allDayEvents = (0, import_react68.useMemo)(() => {
|
|
14732
14597
|
return events.filter((event) => {
|
|
14733
14598
|
return event.allDay || isMultiDayEvent(event);
|
|
14734
14599
|
}).filter((event) => {
|
|
@@ -14739,7 +14604,7 @@ function WeekView({
|
|
|
14739
14604
|
);
|
|
14740
14605
|
});
|
|
14741
14606
|
}, [events, days]);
|
|
14742
|
-
const processedDayEvents = (0,
|
|
14607
|
+
const processedDayEvents = (0, import_react68.useMemo)(() => {
|
|
14743
14608
|
const result = days.map((day) => {
|
|
14744
14609
|
const dayEvents = events.filter((event) => {
|
|
14745
14610
|
if (event.allDay || isMultiDayEvent(event)) return false;
|
|
@@ -14985,11 +14850,11 @@ function WeekView({
|
|
|
14985
14850
|
}
|
|
14986
14851
|
|
|
14987
14852
|
// src/components/ui/form/CheckBoxThree.tsx
|
|
14988
|
-
var
|
|
14853
|
+
var import_react69 = require("react");
|
|
14989
14854
|
var import_framer_motion19 = require("framer-motion");
|
|
14990
14855
|
var import_jsx_runtime84 = require("react/jsx-runtime");
|
|
14991
14856
|
function useCheckboxTree(initialTree) {
|
|
14992
|
-
const initialCheckedNodes = (0,
|
|
14857
|
+
const initialCheckedNodes = (0, import_react69.useMemo)(() => {
|
|
14993
14858
|
const checkedSet = /* @__PURE__ */ new Set();
|
|
14994
14859
|
const initializeCheckedNodes = (node) => {
|
|
14995
14860
|
if (node.defaultChecked) {
|
|
@@ -15000,8 +14865,8 @@ function useCheckboxTree(initialTree) {
|
|
|
15000
14865
|
initializeCheckedNodes(initialTree);
|
|
15001
14866
|
return checkedSet;
|
|
15002
14867
|
}, [initialTree]);
|
|
15003
|
-
const [checkedNodes, setCheckedNodes] = (0,
|
|
15004
|
-
const isChecked = (0,
|
|
14868
|
+
const [checkedNodes, setCheckedNodes] = (0, import_react69.useState)(initialCheckedNodes);
|
|
14869
|
+
const isChecked = (0, import_react69.useCallback)(
|
|
15005
14870
|
(node) => {
|
|
15006
14871
|
if (!node.children) {
|
|
15007
14872
|
return checkedNodes.has(node.id);
|
|
@@ -15019,7 +14884,7 @@ function useCheckboxTree(initialTree) {
|
|
|
15019
14884
|
},
|
|
15020
14885
|
[checkedNodes]
|
|
15021
14886
|
);
|
|
15022
|
-
const handleCheck = (0,
|
|
14887
|
+
const handleCheck = (0, import_react69.useCallback)(
|
|
15023
14888
|
(node) => {
|
|
15024
14889
|
const newCheckedNodes = new Set(checkedNodes);
|
|
15025
14890
|
const toggleNode = (n, check) => {
|
|
@@ -15049,9 +14914,9 @@ function CheckboxTree({ tree, renderNode }) {
|
|
|
15049
14914
|
onCheckedChange,
|
|
15050
14915
|
children
|
|
15051
14916
|
}) => {
|
|
15052
|
-
const [open, setOpen] = (0,
|
|
15053
|
-
const checkboxRef = (0,
|
|
15054
|
-
(0,
|
|
14917
|
+
const [open, setOpen] = (0, import_react69.useState)(() => !!node.children && status !== false);
|
|
14918
|
+
const checkboxRef = (0, import_react69.useRef)(null);
|
|
14919
|
+
(0, import_react69.useEffect)(() => {
|
|
15055
14920
|
if (checkboxRef.current) {
|
|
15056
14921
|
checkboxRef.current.indeterminate = status === "indeterminate";
|
|
15057
14922
|
}
|
|
@@ -15135,13 +15000,13 @@ function CheckboxTree({ tree, renderNode }) {
|
|
|
15135
15000
|
}
|
|
15136
15001
|
|
|
15137
15002
|
// src/hooks/use-drag.tsx
|
|
15138
|
-
var
|
|
15003
|
+
var import_react70 = require("react");
|
|
15139
15004
|
var useDrag = (options = {}) => {
|
|
15140
|
-
const [isDragging, setIsDragging] = (0,
|
|
15141
|
-
const [positions, setPositions] = (0,
|
|
15142
|
-
const dragStartPos = (0,
|
|
15143
|
-
const dragId = (0,
|
|
15144
|
-
const handleMouseDown = (0,
|
|
15005
|
+
const [isDragging, setIsDragging] = (0, import_react70.useState)(null);
|
|
15006
|
+
const [positions, setPositions] = (0, import_react70.useState)({});
|
|
15007
|
+
const dragStartPos = (0, import_react70.useRef)(null);
|
|
15008
|
+
const dragId = (0, import_react70.useRef)(null);
|
|
15009
|
+
const handleMouseDown = (0, import_react70.useCallback)((id, e) => {
|
|
15145
15010
|
e.preventDefault();
|
|
15146
15011
|
const currentPosition = positions[id] || { top: 0, left: 0 };
|
|
15147
15012
|
dragStartPos.current = {
|
|
@@ -15154,7 +15019,7 @@ var useDrag = (options = {}) => {
|
|
|
15154
15019
|
setIsDragging(id);
|
|
15155
15020
|
options.onDragStart?.(id);
|
|
15156
15021
|
}, [positions, options]);
|
|
15157
|
-
const handleMouseMove = (0,
|
|
15022
|
+
const handleMouseMove = (0, import_react70.useCallback)((e) => {
|
|
15158
15023
|
if (!isDragging || !dragStartPos.current || !dragId.current) return;
|
|
15159
15024
|
const deltaX = e.clientX - dragStartPos.current.x;
|
|
15160
15025
|
const deltaY = e.clientY - dragStartPos.current.y;
|
|
@@ -15170,7 +15035,7 @@ var useDrag = (options = {}) => {
|
|
|
15170
15035
|
}));
|
|
15171
15036
|
options.onDrag?.(dragId.current, newPosition);
|
|
15172
15037
|
}, [isDragging, options]);
|
|
15173
|
-
const handleMouseUp = (0,
|
|
15038
|
+
const handleMouseUp = (0, import_react70.useCallback)(() => {
|
|
15174
15039
|
if (dragId.current) {
|
|
15175
15040
|
options.onDragEnd?.(dragId.current);
|
|
15176
15041
|
}
|
|
@@ -15178,7 +15043,7 @@ var useDrag = (options = {}) => {
|
|
|
15178
15043
|
dragStartPos.current = null;
|
|
15179
15044
|
dragId.current = null;
|
|
15180
15045
|
}, [options]);
|
|
15181
|
-
(0,
|
|
15046
|
+
(0, import_react70.useEffect)(() => {
|
|
15182
15047
|
if (isDragging) {
|
|
15183
15048
|
document.addEventListener("mousemove", handleMouseMove);
|
|
15184
15049
|
document.addEventListener("mouseup", handleMouseUp);
|
|
@@ -15190,16 +15055,16 @@ var useDrag = (options = {}) => {
|
|
|
15190
15055
|
};
|
|
15191
15056
|
}
|
|
15192
15057
|
}, [isDragging, handleMouseMove, handleMouseUp]);
|
|
15193
|
-
const setPosition = (0,
|
|
15058
|
+
const setPosition = (0, import_react70.useCallback)((id, position) => {
|
|
15194
15059
|
setPositions((prev) => ({
|
|
15195
15060
|
...prev,
|
|
15196
15061
|
[id]: position
|
|
15197
15062
|
}));
|
|
15198
15063
|
}, []);
|
|
15199
|
-
const getPosition = (0,
|
|
15064
|
+
const getPosition = (0, import_react70.useCallback)((id) => {
|
|
15200
15065
|
return positions[id] || { top: 0, left: 0 };
|
|
15201
15066
|
}, [positions]);
|
|
15202
|
-
const isElementDragging = (0,
|
|
15067
|
+
const isElementDragging = (0, import_react70.useCallback)((id) => {
|
|
15203
15068
|
return isDragging === id;
|
|
15204
15069
|
}, [isDragging]);
|
|
15205
15070
|
return {
|