@mlw-packages/react-components 1.9.3 → 1.9.4

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.
Files changed (6) hide show
  1. package/dist/index.css +6 -18
  2. package/dist/index.d.mts +16 -1
  3. package/dist/index.d.ts +16 -1
  4. package/dist/index.js +244 -69
  5. package/dist/index.mjs +244 -69
  6. package/package.json +1 -1
package/dist/index.css CHANGED
@@ -1118,6 +1118,9 @@ body {
1118
1118
  .w-1\.5 {
1119
1119
  width: 0.375rem;
1120
1120
  }
1121
+ .w-1\/2 {
1122
+ width: 50%;
1123
+ }
1121
1124
  .w-10 {
1122
1125
  width: 2.5rem;
1123
1126
  }
@@ -1382,9 +1385,6 @@ body {
1382
1385
  .max-w-\[1100px\] {
1383
1386
  max-width: 1100px;
1384
1387
  }
1385
- .max-w-\[120px\] {
1386
- max-width: 120px;
1387
- }
1388
1388
  .max-w-\[210px\] {
1389
1389
  max-width: 210px;
1390
1390
  }
@@ -2992,6 +2992,9 @@ body {
2992
2992
  .pl-24 {
2993
2993
  padding-left: 6rem;
2994
2994
  }
2995
+ .pl-3 {
2996
+ padding-left: 0.75rem;
2997
+ }
2995
2998
  .pl-4 {
2996
2999
  padding-left: 1rem;
2997
3000
  }
@@ -6215,12 +6218,6 @@ body {
6215
6218
  .sm\:mb-2 {
6216
6219
  margin-bottom: 0.5rem;
6217
6220
  }
6218
- .sm\:ml-3 {
6219
- margin-left: 0.75rem;
6220
- }
6221
- .sm\:mt-0 {
6222
- margin-top: 0px;
6223
- }
6224
6221
  .sm\:inline {
6225
6222
  display: inline;
6226
6223
  }
@@ -6281,9 +6278,6 @@ body {
6281
6278
  .sm\:max-w-md {
6282
6279
  max-width: 28rem;
6283
6280
  }
6284
- .sm\:max-w-none {
6285
- max-width: none;
6286
- }
6287
6281
  .sm\:max-w-sm {
6288
6282
  max-width: 24rem;
6289
6283
  }
@@ -6368,9 +6362,6 @@ body {
6368
6362
  border-top-right-radius: 0px;
6369
6363
  border-bottom-right-radius: 0px;
6370
6364
  }
6371
- .sm\:border-l {
6372
- border-left-width: 1px;
6373
- }
6374
6365
  .sm\:p-1\.5 {
6375
6366
  padding: 0.375rem;
6376
6367
  }
@@ -6405,9 +6396,6 @@ body {
6405
6396
  .sm\:pe-4 {
6406
6397
  padding-inline-end: 1rem;
6407
6398
  }
6408
- .sm\:pl-3 {
6409
- padding-left: 0.75rem;
6410
- }
6411
6399
  .sm\:pr-0 {
6412
6400
  padding-right: 0px;
6413
6401
  }
package/dist/index.d.mts CHANGED
@@ -1988,17 +1988,31 @@ interface Props {
1988
1988
  }
1989
1989
  declare const TooltipSimple: React__default.FC<Props>;
1990
1990
 
1991
+ interface IntegrationProperties {
1992
+ tipo?: string;
1993
+ Tipo?: string;
1994
+ Setor?: string;
1995
+ Destino?: string;
1996
+ Contato?: string;
1997
+ Ambiente?: string;
1998
+ Nome?: string;
1999
+ Protocolos?: string;
2000
+ Sustentacao?: string;
2001
+ Origem?: string;
2002
+ }
1991
2003
  interface Connection {
1992
2004
  id: string;
1993
2005
  name: string;
1994
2006
  type: "entrada" | "saida";
1995
2007
  status?: "active" | "inactive" | "warning";
2008
+ integration?: IntegrationProperties;
1996
2009
  }
1997
2010
  interface SystemData {
1998
2011
  name: string;
1999
- description: string;
2012
+ description?: string;
2000
2013
  connections: Connection[];
2001
2014
  }
2015
+
2002
2016
  interface Position$1 {
2003
2017
  top: number;
2004
2018
  left: number;
@@ -2008,6 +2022,7 @@ interface SystemTooltipProps {
2008
2022
  data: SystemData;
2009
2023
  position: Position$1;
2010
2024
  title?: string;
2025
+ isLoading?: boolean;
2011
2026
  onMouseDown?: (id: string, e: React__default.MouseEvent | React__default.TouchEvent) => void;
2012
2027
  onClose: (id: string) => void;
2013
2028
  onPositionChange?: (id: string, position: Position$1) => void;
package/dist/index.d.ts CHANGED
@@ -1988,17 +1988,31 @@ interface Props {
1988
1988
  }
1989
1989
  declare const TooltipSimple: React__default.FC<Props>;
1990
1990
 
1991
+ interface IntegrationProperties {
1992
+ tipo?: string;
1993
+ Tipo?: string;
1994
+ Setor?: string;
1995
+ Destino?: string;
1996
+ Contato?: string;
1997
+ Ambiente?: string;
1998
+ Nome?: string;
1999
+ Protocolos?: string;
2000
+ Sustentacao?: string;
2001
+ Origem?: string;
2002
+ }
1991
2003
  interface Connection {
1992
2004
  id: string;
1993
2005
  name: string;
1994
2006
  type: "entrada" | "saida";
1995
2007
  status?: "active" | "inactive" | "warning";
2008
+ integration?: IntegrationProperties;
1996
2009
  }
1997
2010
  interface SystemData {
1998
2011
  name: string;
1999
- description: string;
2012
+ description?: string;
2000
2013
  connections: Connection[];
2001
2014
  }
2015
+
2002
2016
  interface Position$1 {
2003
2017
  top: number;
2004
2018
  left: number;
@@ -2008,6 +2022,7 @@ interface SystemTooltipProps {
2008
2022
  data: SystemData;
2009
2023
  position: Position$1;
2010
2024
  title?: string;
2025
+ isLoading?: boolean;
2011
2026
  onMouseDown?: (id: string, e: React__default.MouseEvent | React__default.TouchEvent) => void;
2012
2027
  onClose: (id: string) => void;
2013
2028
  onPositionChange?: (id: string, position: Position$1) => void;
package/dist/index.js CHANGED
@@ -14346,6 +14346,42 @@ var computeYAxisTickWidth = (chartMarginLeft, yAxisLabel, axisLabelMargin, yTick
14346
14346
  const estimated = Math.max(48, Math.min(220, maxLen * 8 + 24));
14347
14347
  return estimated;
14348
14348
  };
14349
+ var CustomYAxisTick = (props) => {
14350
+ const { x = 0, y = 0, payload } = props;
14351
+ const text = String(payload?.value || "");
14352
+ const maxCharsPerLine = 20;
14353
+ const words = text.split(" ");
14354
+ const lines = [];
14355
+ let currentLine = "";
14356
+ words.forEach((word) => {
14357
+ const testLine = currentLine ? `${currentLine} ${word}` : word;
14358
+ if (testLine.length > maxCharsPerLine && currentLine) {
14359
+ lines.push(currentLine);
14360
+ currentLine = word;
14361
+ } else {
14362
+ currentLine = testLine;
14363
+ }
14364
+ });
14365
+ if (currentLine) {
14366
+ lines.push(currentLine);
14367
+ }
14368
+ const lineHeight = 12;
14369
+ const totalHeight = lines.length * lineHeight;
14370
+ const startY = y - totalHeight / 2 + lineHeight / 2;
14371
+ return /* @__PURE__ */ jsxRuntime.jsx("g", { children: lines.map((line, index) => /* @__PURE__ */ jsxRuntime.jsx(
14372
+ "text",
14373
+ {
14374
+ x,
14375
+ y: startY + index * lineHeight,
14376
+ textAnchor: "end",
14377
+ fill: "hsl(var(--muted-foreground))",
14378
+ fontSize: 11,
14379
+ children: line
14380
+ },
14381
+ index
14382
+ )) });
14383
+ };
14384
+ var CustomYAxisTick_default = CustomYAxisTick;
14349
14385
  var menuVariants = {
14350
14386
  hidden: { opacity: 0, y: -6, scale: 0.98 },
14351
14387
  visible: { opacity: 1, y: 0, scale: 1 },
@@ -15631,12 +15667,14 @@ var SystemTooltip = ({
15631
15667
  data,
15632
15668
  position,
15633
15669
  title = "Conex\xF5es",
15670
+ isLoading = false,
15634
15671
  onMouseDown,
15635
15672
  onClose,
15636
15673
  onPositionChange
15637
15674
  }) => {
15638
15675
  const [localPos, setLocalPos] = React33.useState(position);
15639
15676
  const [dragging, setDragging] = React33.useState(false);
15677
+ const [expandedId, setExpandedId] = React33.useState(null);
15640
15678
  const offsetRef = React33.useRef({ x: 0, y: 0 });
15641
15679
  const lastMouse = React33.useRef({ x: 0, y: 0 });
15642
15680
  React33.useEffect(() => setLocalPos(position), [position]);
@@ -15758,54 +15796,157 @@ var SystemTooltip = ({
15758
15796
  ]
15759
15797
  }
15760
15798
  ),
15761
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-4 pt-4 pb-3", children: [
15799
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-4 pt-4 pb-3", children: isLoading ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
15800
+ /* @__PURE__ */ jsxRuntime.jsx(SkeletonBase, { className: "h-6 w-3/4" }),
15801
+ /* @__PURE__ */ jsxRuntime.jsx(SkeletonBase, { className: "h-4 w-1/2" })
15802
+ ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
15762
15803
  /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-xl font-bold text-foreground tracking-tight truncate", children: data.name }),
15763
- /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-sm font-bold text-muted-foreground tracking-tight truncate", children: data.description })
15764
- ] }),
15804
+ data.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground tracking-tight truncate", children: data.description })
15805
+ ] }) }),
15765
15806
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-3 pb-4 space-y-4 max-h-[300px] overflow-y-auto [&::-webkit-scrollbar]:w- [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:bg-muted-foreground/20 [&::-webkit-scrollbar-thumb]:rounded-full hover:[&::-webkit-scrollbar-thumb]:bg-muted-foreground/40 transition-colors", children: [
15766
15807
  /* @__PURE__ */ jsxRuntime.jsx(SeparatorBase, { className: "w-full" }),
15767
- entries.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
15768
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 px-1", children: [
15769
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-1.5 h-1.5 rounded-full bg-emerald-500" }),
15770
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-bold text-muted-foreground uppercase", children: "Entradas" })
15808
+ isLoading ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
15809
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
15810
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 px-1", children: [
15811
+ /* @__PURE__ */ jsxRuntime.jsx(SkeletonBase, { className: "w-1.5 h-1.5 rounded-full" }),
15812
+ /* @__PURE__ */ jsxRuntime.jsx(SkeletonBase, { className: "h-3 w-16" })
15813
+ ] }),
15814
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxRuntime.jsx(SkeletonBase, { className: "h-10 w-full rounded-lg" }, i)) })
15771
15815
  ] }),
15772
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children: entries.map((conn) => /* @__PURE__ */ jsxRuntime.jsxs(
15773
- "div",
15774
- {
15775
- className: "group flex items-center justify-between p-2 rounded-lg bg-emerald-500/5 border border-emerald-500/10 hover:border-emerald-500/30 transition-all",
15776
- children: [
15777
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2 overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium truncate", children: conn.name }) }),
15778
- " ",
15779
- /* @__PURE__ */ jsxRuntime.jsx(
15780
- react.ArrowRight,
15781
- {
15782
- size: 14,
15783
- className: "text-emerald-500 shrink-0 rotate-180"
15784
- }
15785
- )
15786
- ]
15787
- },
15788
- conn.id
15789
- )) })
15790
- ] }),
15791
- exits.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
15792
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 px-1", children: [
15793
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-1.5 h-1.5 rounded-full bg-blue-500" }),
15794
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-bold text-muted-foreground uppercase", children: "Sa\xEDdas" })
15816
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
15817
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 px-1", children: [
15818
+ /* @__PURE__ */ jsxRuntime.jsx(SkeletonBase, { className: "w-1.5 h-1.5 rounded-full" }),
15819
+ /* @__PURE__ */ jsxRuntime.jsx(SkeletonBase, { className: "h-3 w-16" })
15820
+ ] }),
15821
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children: [1, 2].map((i) => /* @__PURE__ */ jsxRuntime.jsx(SkeletonBase, { className: "h-10 w-full rounded-lg" }, i)) })
15822
+ ] })
15823
+ ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
15824
+ entries.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
15825
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 px-1", children: [
15826
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-1.5 h-1.5 rounded-full bg-emerald-500" }),
15827
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-bold text-muted-foreground uppercase", children: "Entradas" })
15828
+ ] }),
15829
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children: entries.map((conn) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1", children: [
15830
+ /* @__PURE__ */ jsxRuntime.jsxs(
15831
+ "div",
15832
+ {
15833
+ className: "group flex items-center justify-between p-2 rounded-lg bg-emerald-500/5 border border-emerald-500/10 hover:border-emerald-500/30 transition-all cursor-pointer",
15834
+ onClick: () => setExpandedId(expandedId === conn.id ? null : conn.id),
15835
+ children: [
15836
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2 overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium truncate", children: conn.name }) }),
15837
+ /* @__PURE__ */ jsxRuntime.jsx(
15838
+ react.ArrowRight,
15839
+ {
15840
+ size: 14,
15841
+ className: "text-emerald-500 shrink-0 rotate-180"
15842
+ }
15843
+ )
15844
+ ]
15845
+ }
15846
+ ),
15847
+ expandedId === conn.id && conn.integration && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-2 p-2 rounded-lg bg-muted/30 border border-border/20 text-xs space-y-1", children: [
15848
+ conn.integration.Nome && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
15849
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: "Nome:" }),
15850
+ " ",
15851
+ conn.integration.Nome
15852
+ ] }),
15853
+ (conn.integration.tipo || conn.integration.Tipo) && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
15854
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: "Tipo:" }),
15855
+ " ",
15856
+ conn.integration.tipo || conn.integration.Tipo
15857
+ ] }),
15858
+ conn.integration.Protocolos && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
15859
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: "Protocolos:" }),
15860
+ " ",
15861
+ conn.integration.Protocolos
15862
+ ] }),
15863
+ conn.integration.Ambiente && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
15864
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: "Ambiente:" }),
15865
+ " ",
15866
+ conn.integration.Ambiente
15867
+ ] }),
15868
+ conn.integration.Setor && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
15869
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: "Setor:" }),
15870
+ " ",
15871
+ conn.integration.Setor
15872
+ ] }),
15873
+ conn.integration.Contato && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
15874
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: "Contato:" }),
15875
+ " ",
15876
+ conn.integration.Contato
15877
+ ] }),
15878
+ conn.integration.Sustentacao && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
15879
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: "Sustenta\xE7\xE3o:" }),
15880
+ " ",
15881
+ conn.integration.Sustentacao
15882
+ ] })
15883
+ ] })
15884
+ ] }, conn.id)) })
15795
15885
  ] }),
15796
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children: exits.map((conn) => /* @__PURE__ */ jsxRuntime.jsxs(
15797
- "div",
15798
- {
15799
- className: "group flex items-center justify-between p-2 rounded-lg bg-blue-500/5 border border-blue-500/10 hover:border-blue-500/30 transition-all",
15800
- children: [
15801
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2 overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium truncate", children: conn.name }) }),
15802
- /* @__PURE__ */ jsxRuntime.jsx(react.ArrowRight, { size: 14, className: "text-blue-500 shrink-0" })
15803
- ]
15804
- },
15805
- conn.id
15806
- )) })
15807
- ] }),
15808
- data.connections.length === 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col items-center justify-center p-6 text-center", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground", children: "Nenhuma conex\xE3o encontrada" }) })
15886
+ exits.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
15887
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 px-1", children: [
15888
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-1.5 h-1.5 rounded-full bg-blue-500" }),
15889
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-bold text-muted-foreground uppercase", children: "Sa\xEDdas" })
15890
+ ] }),
15891
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children: exits.map((conn) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1", children: [
15892
+ /* @__PURE__ */ jsxRuntime.jsxs(
15893
+ "div",
15894
+ {
15895
+ className: "group flex items-center justify-between p-2 rounded-lg bg-blue-500/5 border border-blue-500/10 hover:border-blue-500/30 transition-all cursor-pointer",
15896
+ onClick: () => setExpandedId(expandedId === conn.id ? null : conn.id),
15897
+ children: [
15898
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2 overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium truncate", children: conn.name }) }),
15899
+ /* @__PURE__ */ jsxRuntime.jsx(
15900
+ react.ArrowRight,
15901
+ {
15902
+ size: 14,
15903
+ className: "text-blue-500 shrink-0"
15904
+ }
15905
+ )
15906
+ ]
15907
+ }
15908
+ ),
15909
+ expandedId === conn.id && conn.integration && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-2 p-2 rounded-lg bg-muted/30 border border-border/20 text-xs space-y-1", children: [
15910
+ conn.integration.Nome && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
15911
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: "Nome:" }),
15912
+ " ",
15913
+ conn.integration.Nome
15914
+ ] }),
15915
+ (conn.integration.tipo || conn.integration.Tipo) && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
15916
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: "Tipo:" }),
15917
+ " ",
15918
+ conn.integration.tipo || conn.integration.Tipo
15919
+ ] }),
15920
+ conn.integration.Protocolos && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
15921
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: "Protocolos:" }),
15922
+ " ",
15923
+ conn.integration.Protocolos
15924
+ ] }),
15925
+ conn.integration.Ambiente && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
15926
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: "Ambiente:" }),
15927
+ " ",
15928
+ conn.integration.Ambiente
15929
+ ] }),
15930
+ conn.integration.Setor && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
15931
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: "Setor:" }),
15932
+ " ",
15933
+ conn.integration.Setor
15934
+ ] }),
15935
+ conn.integration.Contato && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
15936
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: "Contato:" }),
15937
+ " ",
15938
+ conn.integration.Contato
15939
+ ] }),
15940
+ conn.integration.Sustentacao && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
15941
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: "Sustenta\xE7\xE3o:" }),
15942
+ " ",
15943
+ conn.integration.Sustentacao
15944
+ ] })
15945
+ ] })
15946
+ ] }, conn.id)) })
15947
+ ] }),
15948
+ data.connections.length === 0 && !isLoading && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col items-center justify-center p-6 text-center", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground", children: "Nenhuma conex\xE3o encontrada" }) })
15949
+ ] })
15809
15950
  ] })
15810
15951
  ]
15811
15952
  },
@@ -16065,10 +16206,10 @@ var HorizontalLegend = ({
16065
16206
  const label = mapperConfig[key]?.label ?? labelMap?.[key] ?? formatFieldName2(key);
16066
16207
  return legendUppercase ? label.toUpperCase() : label;
16067
16208
  };
16068
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(className), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 sm:gap-3 md:gap-4 flex-wrap", children: [
16209
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(className), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-center gap-2 sm:gap-3 md:gap-4 overflow-x-auto", children: [
16069
16210
  allKeys.map((key) => {
16070
16211
  const displayLabel = formatLegendLabel(key);
16071
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5 sm:gap-2", children: [
16212
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5 sm:gap-2 flex-shrink-0", children: [
16072
16213
  /* @__PURE__ */ jsxRuntime.jsx(
16073
16214
  "div",
16074
16215
  {
@@ -16076,10 +16217,10 @@ var HorizontalLegend = ({
16076
16217
  style: { backgroundColor: finalColors[key] }
16077
16218
  }
16078
16219
  ),
16079
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs sm:text-sm tracking-[0] break-words", children: displayLabel })
16220
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs sm:text-sm tracking-[0] whitespace-nowrap", children: displayLabel })
16080
16221
  ] }, key);
16081
16222
  }),
16082
- orderBy && maxPeriodLabel && minPeriodLabel && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 sm:gap-3 md:gap-4 w-full sm:w-auto justify-center mt-2 sm:mt-0 sm:ml-3 sm:pl-3 md:ml-4 md:pl-4 sm:border-l border-border", children: [
16223
+ orderBy && maxPeriodLabel && minPeriodLabel && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 sm:gap-3 md:gap-4 ml-3 pl-3 md:ml-4 md:pl-4 border-l border-border flex-shrink-0", children: [
16083
16224
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 sm:gap-1.5", children: [
16084
16225
  /* @__PURE__ */ jsxRuntime.jsx(
16085
16226
  react.FunnelSimpleIcon,
@@ -16088,7 +16229,7 @@ var HorizontalLegend = ({
16088
16229
  weight: "bold"
16089
16230
  }
16090
16231
  ),
16091
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs sm:text-sm tracking-[0] font-medium truncate max-w-[120px] sm:max-w-none", children: maxPeriodLabel })
16232
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs sm:text-sm tracking-[0] font-medium whitespace-nowrap", children: maxPeriodLabel })
16092
16233
  ] }),
16093
16234
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 sm:gap-1.5", children: [
16094
16235
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -16098,7 +16239,7 @@ var HorizontalLegend = ({
16098
16239
  weight: "bold"
16099
16240
  }
16100
16241
  ),
16101
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs sm:text-sm tracking-[0] font-medium truncate max-w-[120px] sm:max-w-none", children: minPeriodLabel })
16242
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs sm:text-sm tracking-[0] font-medium whitespace-nowrap", children: minPeriodLabel })
16102
16243
  ] })
16103
16244
  ] })
16104
16245
  ] }) });
@@ -17206,23 +17347,27 @@ var Chart = ({
17206
17347
  const CONTAINER_PADDING_LEFT = -6;
17207
17348
  const finalChartRightMargin = chartMargin?.right ?? (rightKeys.length > 0 ? AXIS_LABEL_MARGIN : 30);
17208
17349
  const finalChartLeftMargin = chartMargin?.left ?? (yAxisLabel ? AXIS_LABEL_MARGIN : 0);
17209
- const yAxisTickWidth = React33.useMemo(
17210
- () => computeYAxisTickWidth(
17350
+ const yAxisTickWidth = React33.useMemo(() => {
17351
+ if (horizontal) {
17352
+ if (typeof chartMargin?.left === "number") return chartMargin.left;
17353
+ return 130;
17354
+ }
17355
+ return computeYAxisTickWidth(
17211
17356
  chartMargin?.left,
17212
17357
  yAxisLabel,
17213
17358
  AXIS_LABEL_MARGIN,
17214
17359
  yTickFormatter,
17215
17360
  minLeftDataValue,
17216
17361
  niceMaxLeft
17217
- ),
17218
- [
17219
- chartMargin?.left,
17220
- yAxisLabel,
17221
- yTickFormatter,
17222
- minLeftDataValue,
17223
- niceMaxLeft
17224
- ]
17225
- );
17362
+ );
17363
+ }, [
17364
+ horizontal,
17365
+ chartMargin?.left,
17366
+ yAxisLabel,
17367
+ yTickFormatter,
17368
+ minLeftDataValue,
17369
+ niceMaxLeft
17370
+ ]);
17226
17371
  const HORIZONTAL_PADDING_CLASS = "px-24";
17227
17372
  const teste = "pl-24 pr-4";
17228
17373
  const effectiveChartWidth = typeof width === "number" ? width : measuredWidth ? Math.max(0, measuredWidth - 32) : computedWidth;
@@ -17264,14 +17409,43 @@ var Chart = ({
17264
17409
  );
17265
17410
  }
17266
17411
  if (Array.isArray(data) && data.length === 0) {
17267
- return /* @__PURE__ */ jsxRuntime.jsx(
17268
- NoData_default,
17269
- {
17270
- title,
17271
- paddingLeft: CONTAINER_PADDING_LEFT + finalChartLeftMargin,
17272
- height
17273
- }
17274
- );
17412
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
17413
+ /* @__PURE__ */ jsxRuntime.jsx(
17414
+ NoData_default,
17415
+ {
17416
+ title,
17417
+ paddingLeft: CONTAINER_PADDING_LEFT + finalChartLeftMargin,
17418
+ height
17419
+ }
17420
+ ),
17421
+ /* @__PURE__ */ jsxRuntime.jsx("div", { style: { height: 0 }, children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: effectiveChartWidth, height, children: [
17422
+ xAxisLabel && /* @__PURE__ */ jsxRuntime.jsx(
17423
+ "text",
17424
+ {
17425
+ x: effectiveChartWidth - 40,
17426
+ y: height - 10,
17427
+ fontSize: 12,
17428
+ fill: "hsl(var(--muted-foreground))",
17429
+ fontWeight: 500,
17430
+ textAnchor: "end",
17431
+ children: xAxisLabel
17432
+ }
17433
+ ),
17434
+ yAxisLabel && /* @__PURE__ */ jsxRuntime.jsx(
17435
+ "text",
17436
+ {
17437
+ x: 20,
17438
+ y: 40,
17439
+ fontSize: 12,
17440
+ fill: "hsl(var(--muted-foreground))",
17441
+ fontWeight: 500,
17442
+ textAnchor: "start",
17443
+ transform: `rotate(-90 20 40)`,
17444
+ children: yAxisLabel
17445
+ }
17446
+ )
17447
+ ] }) })
17448
+ ] });
17275
17449
  }
17276
17450
  return /* @__PURE__ */ jsxRuntime.jsx(
17277
17451
  "div",
@@ -17487,9 +17661,10 @@ var Chart = ({
17487
17661
  yAxisId: "left",
17488
17662
  width: yAxisTickWidth,
17489
17663
  stroke: "hsl(var(--muted-foreground))",
17490
- fontSize: 12,
17664
+ fontSize: 11,
17491
17665
  tickLine: false,
17492
17666
  axisLine: false,
17667
+ tick: /* @__PURE__ */ jsxRuntime.jsx(CustomYAxisTick_default, { width: yAxisTickWidth - 10 }),
17493
17668
  tickFormatter: (value) => {
17494
17669
  if (categoryFormatter)
17495
17670
  return categoryFormatter(value);
package/dist/index.mjs CHANGED
@@ -14303,6 +14303,42 @@ var computeYAxisTickWidth = (chartMarginLeft, yAxisLabel, axisLabelMargin, yTick
14303
14303
  const estimated = Math.max(48, Math.min(220, maxLen * 8 + 24));
14304
14304
  return estimated;
14305
14305
  };
14306
+ var CustomYAxisTick = (props) => {
14307
+ const { x = 0, y = 0, payload } = props;
14308
+ const text = String(payload?.value || "");
14309
+ const maxCharsPerLine = 20;
14310
+ const words = text.split(" ");
14311
+ const lines = [];
14312
+ let currentLine = "";
14313
+ words.forEach((word) => {
14314
+ const testLine = currentLine ? `${currentLine} ${word}` : word;
14315
+ if (testLine.length > maxCharsPerLine && currentLine) {
14316
+ lines.push(currentLine);
14317
+ currentLine = word;
14318
+ } else {
14319
+ currentLine = testLine;
14320
+ }
14321
+ });
14322
+ if (currentLine) {
14323
+ lines.push(currentLine);
14324
+ }
14325
+ const lineHeight = 12;
14326
+ const totalHeight = lines.length * lineHeight;
14327
+ const startY = y - totalHeight / 2 + lineHeight / 2;
14328
+ return /* @__PURE__ */ jsx("g", { children: lines.map((line, index) => /* @__PURE__ */ jsx(
14329
+ "text",
14330
+ {
14331
+ x,
14332
+ y: startY + index * lineHeight,
14333
+ textAnchor: "end",
14334
+ fill: "hsl(var(--muted-foreground))",
14335
+ fontSize: 11,
14336
+ children: line
14337
+ },
14338
+ index
14339
+ )) });
14340
+ };
14341
+ var CustomYAxisTick_default = CustomYAxisTick;
14306
14342
  var menuVariants = {
14307
14343
  hidden: { opacity: 0, y: -6, scale: 0.98 },
14308
14344
  visible: { opacity: 1, y: 0, scale: 1 },
@@ -15588,12 +15624,14 @@ var SystemTooltip = ({
15588
15624
  data,
15589
15625
  position,
15590
15626
  title = "Conex\xF5es",
15627
+ isLoading = false,
15591
15628
  onMouseDown,
15592
15629
  onClose,
15593
15630
  onPositionChange
15594
15631
  }) => {
15595
15632
  const [localPos, setLocalPos] = useState(position);
15596
15633
  const [dragging, setDragging] = useState(false);
15634
+ const [expandedId, setExpandedId] = useState(null);
15597
15635
  const offsetRef = useRef({ x: 0, y: 0 });
15598
15636
  const lastMouse = useRef({ x: 0, y: 0 });
15599
15637
  useEffect(() => setLocalPos(position), [position]);
@@ -15715,54 +15753,157 @@ var SystemTooltip = ({
15715
15753
  ]
15716
15754
  }
15717
15755
  ),
15718
- /* @__PURE__ */ jsxs("div", { className: "px-4 pt-4 pb-3", children: [
15756
+ /* @__PURE__ */ jsx("div", { className: "px-4 pt-4 pb-3", children: isLoading ? /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
15757
+ /* @__PURE__ */ jsx(SkeletonBase, { className: "h-6 w-3/4" }),
15758
+ /* @__PURE__ */ jsx(SkeletonBase, { className: "h-4 w-1/2" })
15759
+ ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
15719
15760
  /* @__PURE__ */ jsx("h3", { className: "text-xl font-bold text-foreground tracking-tight truncate", children: data.name }),
15720
- /* @__PURE__ */ jsx("h3", { className: "text-sm font-bold text-muted-foreground tracking-tight truncate", children: data.description })
15721
- ] }),
15761
+ data.description && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground tracking-tight truncate", children: data.description })
15762
+ ] }) }),
15722
15763
  /* @__PURE__ */ jsxs("div", { className: "px-3 pb-4 space-y-4 max-h-[300px] overflow-y-auto [&::-webkit-scrollbar]:w- [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:bg-muted-foreground/20 [&::-webkit-scrollbar-thumb]:rounded-full hover:[&::-webkit-scrollbar-thumb]:bg-muted-foreground/40 transition-colors", children: [
15723
15764
  /* @__PURE__ */ jsx(SeparatorBase, { className: "w-full" }),
15724
- entries.length > 0 && /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
15725
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-1", children: [
15726
- /* @__PURE__ */ jsx("div", { className: "w-1.5 h-1.5 rounded-full bg-emerald-500" }),
15727
- /* @__PURE__ */ jsx("span", { className: "text-[10px] font-bold text-muted-foreground uppercase", children: "Entradas" })
15765
+ isLoading ? /* @__PURE__ */ jsxs(Fragment, { children: [
15766
+ /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
15767
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-1", children: [
15768
+ /* @__PURE__ */ jsx(SkeletonBase, { className: "w-1.5 h-1.5 rounded-full" }),
15769
+ /* @__PURE__ */ jsx(SkeletonBase, { className: "h-3 w-16" })
15770
+ ] }),
15771
+ /* @__PURE__ */ jsx("div", { className: "space-y-1", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsx(SkeletonBase, { className: "h-10 w-full rounded-lg" }, i)) })
15728
15772
  ] }),
15729
- /* @__PURE__ */ jsx("div", { className: "space-y-1", children: entries.map((conn) => /* @__PURE__ */ jsxs(
15730
- "div",
15731
- {
15732
- className: "group flex items-center justify-between p-2 rounded-lg bg-emerald-500/5 border border-emerald-500/10 hover:border-emerald-500/30 transition-all",
15733
- children: [
15734
- /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 overflow-hidden", children: /* @__PURE__ */ jsx("span", { className: "text-sm font-medium truncate", children: conn.name }) }),
15735
- " ",
15736
- /* @__PURE__ */ jsx(
15737
- ArrowRight,
15738
- {
15739
- size: 14,
15740
- className: "text-emerald-500 shrink-0 rotate-180"
15741
- }
15742
- )
15743
- ]
15744
- },
15745
- conn.id
15746
- )) })
15747
- ] }),
15748
- exits.length > 0 && /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
15749
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-1", children: [
15750
- /* @__PURE__ */ jsx("div", { className: "w-1.5 h-1.5 rounded-full bg-blue-500" }),
15751
- /* @__PURE__ */ jsx("span", { className: "text-[10px] font-bold text-muted-foreground uppercase", children: "Sa\xEDdas" })
15773
+ /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
15774
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-1", children: [
15775
+ /* @__PURE__ */ jsx(SkeletonBase, { className: "w-1.5 h-1.5 rounded-full" }),
15776
+ /* @__PURE__ */ jsx(SkeletonBase, { className: "h-3 w-16" })
15777
+ ] }),
15778
+ /* @__PURE__ */ jsx("div", { className: "space-y-1", children: [1, 2].map((i) => /* @__PURE__ */ jsx(SkeletonBase, { className: "h-10 w-full rounded-lg" }, i)) })
15779
+ ] })
15780
+ ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
15781
+ entries.length > 0 && /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
15782
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-1", children: [
15783
+ /* @__PURE__ */ jsx("div", { className: "w-1.5 h-1.5 rounded-full bg-emerald-500" }),
15784
+ /* @__PURE__ */ jsx("span", { className: "text-[10px] font-bold text-muted-foreground uppercase", children: "Entradas" })
15785
+ ] }),
15786
+ /* @__PURE__ */ jsx("div", { className: "space-y-1", children: entries.map((conn) => /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
15787
+ /* @__PURE__ */ jsxs(
15788
+ "div",
15789
+ {
15790
+ className: "group flex items-center justify-between p-2 rounded-lg bg-emerald-500/5 border border-emerald-500/10 hover:border-emerald-500/30 transition-all cursor-pointer",
15791
+ onClick: () => setExpandedId(expandedId === conn.id ? null : conn.id),
15792
+ children: [
15793
+ /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 overflow-hidden", children: /* @__PURE__ */ jsx("span", { className: "text-sm font-medium truncate", children: conn.name }) }),
15794
+ /* @__PURE__ */ jsx(
15795
+ ArrowRight,
15796
+ {
15797
+ size: 14,
15798
+ className: "text-emerald-500 shrink-0 rotate-180"
15799
+ }
15800
+ )
15801
+ ]
15802
+ }
15803
+ ),
15804
+ expandedId === conn.id && conn.integration && /* @__PURE__ */ jsxs("div", { className: "ml-2 p-2 rounded-lg bg-muted/30 border border-border/20 text-xs space-y-1", children: [
15805
+ conn.integration.Nome && /* @__PURE__ */ jsxs("div", { children: [
15806
+ /* @__PURE__ */ jsx("span", { className: "font-semibold", children: "Nome:" }),
15807
+ " ",
15808
+ conn.integration.Nome
15809
+ ] }),
15810
+ (conn.integration.tipo || conn.integration.Tipo) && /* @__PURE__ */ jsxs("div", { children: [
15811
+ /* @__PURE__ */ jsx("span", { className: "font-semibold", children: "Tipo:" }),
15812
+ " ",
15813
+ conn.integration.tipo || conn.integration.Tipo
15814
+ ] }),
15815
+ conn.integration.Protocolos && /* @__PURE__ */ jsxs("div", { children: [
15816
+ /* @__PURE__ */ jsx("span", { className: "font-semibold", children: "Protocolos:" }),
15817
+ " ",
15818
+ conn.integration.Protocolos
15819
+ ] }),
15820
+ conn.integration.Ambiente && /* @__PURE__ */ jsxs("div", { children: [
15821
+ /* @__PURE__ */ jsx("span", { className: "font-semibold", children: "Ambiente:" }),
15822
+ " ",
15823
+ conn.integration.Ambiente
15824
+ ] }),
15825
+ conn.integration.Setor && /* @__PURE__ */ jsxs("div", { children: [
15826
+ /* @__PURE__ */ jsx("span", { className: "font-semibold", children: "Setor:" }),
15827
+ " ",
15828
+ conn.integration.Setor
15829
+ ] }),
15830
+ conn.integration.Contato && /* @__PURE__ */ jsxs("div", { children: [
15831
+ /* @__PURE__ */ jsx("span", { className: "font-semibold", children: "Contato:" }),
15832
+ " ",
15833
+ conn.integration.Contato
15834
+ ] }),
15835
+ conn.integration.Sustentacao && /* @__PURE__ */ jsxs("div", { children: [
15836
+ /* @__PURE__ */ jsx("span", { className: "font-semibold", children: "Sustenta\xE7\xE3o:" }),
15837
+ " ",
15838
+ conn.integration.Sustentacao
15839
+ ] })
15840
+ ] })
15841
+ ] }, conn.id)) })
15752
15842
  ] }),
15753
- /* @__PURE__ */ jsx("div", { className: "space-y-1", children: exits.map((conn) => /* @__PURE__ */ jsxs(
15754
- "div",
15755
- {
15756
- className: "group flex items-center justify-between p-2 rounded-lg bg-blue-500/5 border border-blue-500/10 hover:border-blue-500/30 transition-all",
15757
- children: [
15758
- /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 overflow-hidden", children: /* @__PURE__ */ jsx("span", { className: "text-sm font-medium truncate", children: conn.name }) }),
15759
- /* @__PURE__ */ jsx(ArrowRight, { size: 14, className: "text-blue-500 shrink-0" })
15760
- ]
15761
- },
15762
- conn.id
15763
- )) })
15764
- ] }),
15765
- data.connections.length === 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-col items-center justify-center p-6 text-center", children: /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Nenhuma conex\xE3o encontrada" }) })
15843
+ exits.length > 0 && /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
15844
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-1", children: [
15845
+ /* @__PURE__ */ jsx("div", { className: "w-1.5 h-1.5 rounded-full bg-blue-500" }),
15846
+ /* @__PURE__ */ jsx("span", { className: "text-[10px] font-bold text-muted-foreground uppercase", children: "Sa\xEDdas" })
15847
+ ] }),
15848
+ /* @__PURE__ */ jsx("div", { className: "space-y-1", children: exits.map((conn) => /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
15849
+ /* @__PURE__ */ jsxs(
15850
+ "div",
15851
+ {
15852
+ className: "group flex items-center justify-between p-2 rounded-lg bg-blue-500/5 border border-blue-500/10 hover:border-blue-500/30 transition-all cursor-pointer",
15853
+ onClick: () => setExpandedId(expandedId === conn.id ? null : conn.id),
15854
+ children: [
15855
+ /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 overflow-hidden", children: /* @__PURE__ */ jsx("span", { className: "text-sm font-medium truncate", children: conn.name }) }),
15856
+ /* @__PURE__ */ jsx(
15857
+ ArrowRight,
15858
+ {
15859
+ size: 14,
15860
+ className: "text-blue-500 shrink-0"
15861
+ }
15862
+ )
15863
+ ]
15864
+ }
15865
+ ),
15866
+ expandedId === conn.id && conn.integration && /* @__PURE__ */ jsxs("div", { className: "ml-2 p-2 rounded-lg bg-muted/30 border border-border/20 text-xs space-y-1", children: [
15867
+ conn.integration.Nome && /* @__PURE__ */ jsxs("div", { children: [
15868
+ /* @__PURE__ */ jsx("span", { className: "font-semibold", children: "Nome:" }),
15869
+ " ",
15870
+ conn.integration.Nome
15871
+ ] }),
15872
+ (conn.integration.tipo || conn.integration.Tipo) && /* @__PURE__ */ jsxs("div", { children: [
15873
+ /* @__PURE__ */ jsx("span", { className: "font-semibold", children: "Tipo:" }),
15874
+ " ",
15875
+ conn.integration.tipo || conn.integration.Tipo
15876
+ ] }),
15877
+ conn.integration.Protocolos && /* @__PURE__ */ jsxs("div", { children: [
15878
+ /* @__PURE__ */ jsx("span", { className: "font-semibold", children: "Protocolos:" }),
15879
+ " ",
15880
+ conn.integration.Protocolos
15881
+ ] }),
15882
+ conn.integration.Ambiente && /* @__PURE__ */ jsxs("div", { children: [
15883
+ /* @__PURE__ */ jsx("span", { className: "font-semibold", children: "Ambiente:" }),
15884
+ " ",
15885
+ conn.integration.Ambiente
15886
+ ] }),
15887
+ conn.integration.Setor && /* @__PURE__ */ jsxs("div", { children: [
15888
+ /* @__PURE__ */ jsx("span", { className: "font-semibold", children: "Setor:" }),
15889
+ " ",
15890
+ conn.integration.Setor
15891
+ ] }),
15892
+ conn.integration.Contato && /* @__PURE__ */ jsxs("div", { children: [
15893
+ /* @__PURE__ */ jsx("span", { className: "font-semibold", children: "Contato:" }),
15894
+ " ",
15895
+ conn.integration.Contato
15896
+ ] }),
15897
+ conn.integration.Sustentacao && /* @__PURE__ */ jsxs("div", { children: [
15898
+ /* @__PURE__ */ jsx("span", { className: "font-semibold", children: "Sustenta\xE7\xE3o:" }),
15899
+ " ",
15900
+ conn.integration.Sustentacao
15901
+ ] })
15902
+ ] })
15903
+ ] }, conn.id)) })
15904
+ ] }),
15905
+ data.connections.length === 0 && !isLoading && /* @__PURE__ */ jsx("div", { className: "flex flex-col items-center justify-center p-6 text-center", children: /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Nenhuma conex\xE3o encontrada" }) })
15906
+ ] })
15766
15907
  ] })
15767
15908
  ]
15768
15909
  },
@@ -16022,10 +16163,10 @@ var HorizontalLegend = ({
16022
16163
  const label = mapperConfig[key]?.label ?? labelMap?.[key] ?? formatFieldName2(key);
16023
16164
  return legendUppercase ? label.toUpperCase() : label;
16024
16165
  };
16025
- return /* @__PURE__ */ jsx("div", { className: cn(className), children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 sm:gap-3 md:gap-4 flex-wrap", children: [
16166
+ return /* @__PURE__ */ jsx("div", { className: cn(className), children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2 sm:gap-3 md:gap-4 overflow-x-auto", children: [
16026
16167
  allKeys.map((key) => {
16027
16168
  const displayLabel = formatLegendLabel(key);
16028
- return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 sm:gap-2", children: [
16169
+ return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 sm:gap-2 flex-shrink-0", children: [
16029
16170
  /* @__PURE__ */ jsx(
16030
16171
  "div",
16031
16172
  {
@@ -16033,10 +16174,10 @@ var HorizontalLegend = ({
16033
16174
  style: { backgroundColor: finalColors[key] }
16034
16175
  }
16035
16176
  ),
16036
- /* @__PURE__ */ jsx("span", { className: "text-xs sm:text-sm tracking-[0] break-words", children: displayLabel })
16177
+ /* @__PURE__ */ jsx("span", { className: "text-xs sm:text-sm tracking-[0] whitespace-nowrap", children: displayLabel })
16037
16178
  ] }, key);
16038
16179
  }),
16039
- orderBy && maxPeriodLabel && minPeriodLabel && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 sm:gap-3 md:gap-4 w-full sm:w-auto justify-center mt-2 sm:mt-0 sm:ml-3 sm:pl-3 md:ml-4 md:pl-4 sm:border-l border-border", children: [
16180
+ orderBy && maxPeriodLabel && minPeriodLabel && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 sm:gap-3 md:gap-4 ml-3 pl-3 md:ml-4 md:pl-4 border-l border-border flex-shrink-0", children: [
16040
16181
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1 sm:gap-1.5", children: [
16041
16182
  /* @__PURE__ */ jsx(
16042
16183
  FunnelSimpleIcon,
@@ -16045,7 +16186,7 @@ var HorizontalLegend = ({
16045
16186
  weight: "bold"
16046
16187
  }
16047
16188
  ),
16048
- /* @__PURE__ */ jsx("span", { className: "text-xs sm:text-sm tracking-[0] font-medium truncate max-w-[120px] sm:max-w-none", children: maxPeriodLabel })
16189
+ /* @__PURE__ */ jsx("span", { className: "text-xs sm:text-sm tracking-[0] font-medium whitespace-nowrap", children: maxPeriodLabel })
16049
16190
  ] }),
16050
16191
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1 sm:gap-1.5", children: [
16051
16192
  /* @__PURE__ */ jsx(
@@ -16055,7 +16196,7 @@ var HorizontalLegend = ({
16055
16196
  weight: "bold"
16056
16197
  }
16057
16198
  ),
16058
- /* @__PURE__ */ jsx("span", { className: "text-xs sm:text-sm tracking-[0] font-medium truncate max-w-[120px] sm:max-w-none", children: minPeriodLabel })
16199
+ /* @__PURE__ */ jsx("span", { className: "text-xs sm:text-sm tracking-[0] font-medium whitespace-nowrap", children: minPeriodLabel })
16059
16200
  ] })
16060
16201
  ] })
16061
16202
  ] }) });
@@ -17163,23 +17304,27 @@ var Chart = ({
17163
17304
  const CONTAINER_PADDING_LEFT = -6;
17164
17305
  const finalChartRightMargin = chartMargin?.right ?? (rightKeys.length > 0 ? AXIS_LABEL_MARGIN : 30);
17165
17306
  const finalChartLeftMargin = chartMargin?.left ?? (yAxisLabel ? AXIS_LABEL_MARGIN : 0);
17166
- const yAxisTickWidth = useMemo(
17167
- () => computeYAxisTickWidth(
17307
+ const yAxisTickWidth = useMemo(() => {
17308
+ if (horizontal) {
17309
+ if (typeof chartMargin?.left === "number") return chartMargin.left;
17310
+ return 130;
17311
+ }
17312
+ return computeYAxisTickWidth(
17168
17313
  chartMargin?.left,
17169
17314
  yAxisLabel,
17170
17315
  AXIS_LABEL_MARGIN,
17171
17316
  yTickFormatter,
17172
17317
  minLeftDataValue,
17173
17318
  niceMaxLeft
17174
- ),
17175
- [
17176
- chartMargin?.left,
17177
- yAxisLabel,
17178
- yTickFormatter,
17179
- minLeftDataValue,
17180
- niceMaxLeft
17181
- ]
17182
- );
17319
+ );
17320
+ }, [
17321
+ horizontal,
17322
+ chartMargin?.left,
17323
+ yAxisLabel,
17324
+ yTickFormatter,
17325
+ minLeftDataValue,
17326
+ niceMaxLeft
17327
+ ]);
17183
17328
  const HORIZONTAL_PADDING_CLASS = "px-24";
17184
17329
  const teste = "pl-24 pr-4";
17185
17330
  const effectiveChartWidth = typeof width === "number" ? width : measuredWidth ? Math.max(0, measuredWidth - 32) : computedWidth;
@@ -17221,14 +17366,43 @@ var Chart = ({
17221
17366
  );
17222
17367
  }
17223
17368
  if (Array.isArray(data) && data.length === 0) {
17224
- return /* @__PURE__ */ jsx(
17225
- NoData_default,
17226
- {
17227
- title,
17228
- paddingLeft: CONTAINER_PADDING_LEFT + finalChartLeftMargin,
17229
- height
17230
- }
17231
- );
17369
+ return /* @__PURE__ */ jsxs("div", { children: [
17370
+ /* @__PURE__ */ jsx(
17371
+ NoData_default,
17372
+ {
17373
+ title,
17374
+ paddingLeft: CONTAINER_PADDING_LEFT + finalChartLeftMargin,
17375
+ height
17376
+ }
17377
+ ),
17378
+ /* @__PURE__ */ jsx("div", { style: { height: 0 }, children: /* @__PURE__ */ jsxs("svg", { width: effectiveChartWidth, height, children: [
17379
+ xAxisLabel && /* @__PURE__ */ jsx(
17380
+ "text",
17381
+ {
17382
+ x: effectiveChartWidth - 40,
17383
+ y: height - 10,
17384
+ fontSize: 12,
17385
+ fill: "hsl(var(--muted-foreground))",
17386
+ fontWeight: 500,
17387
+ textAnchor: "end",
17388
+ children: xAxisLabel
17389
+ }
17390
+ ),
17391
+ yAxisLabel && /* @__PURE__ */ jsx(
17392
+ "text",
17393
+ {
17394
+ x: 20,
17395
+ y: 40,
17396
+ fontSize: 12,
17397
+ fill: "hsl(var(--muted-foreground))",
17398
+ fontWeight: 500,
17399
+ textAnchor: "start",
17400
+ transform: `rotate(-90 20 40)`,
17401
+ children: yAxisLabel
17402
+ }
17403
+ )
17404
+ ] }) })
17405
+ ] });
17232
17406
  }
17233
17407
  return /* @__PURE__ */ jsx(
17234
17408
  "div",
@@ -17444,9 +17618,10 @@ var Chart = ({
17444
17618
  yAxisId: "left",
17445
17619
  width: yAxisTickWidth,
17446
17620
  stroke: "hsl(var(--muted-foreground))",
17447
- fontSize: 12,
17621
+ fontSize: 11,
17448
17622
  tickLine: false,
17449
17623
  axisLine: false,
17624
+ tick: /* @__PURE__ */ jsx(CustomYAxisTick_default, { width: yAxisTickWidth - 10 }),
17450
17625
  tickFormatter: (value) => {
17451
17626
  if (categoryFormatter)
17452
17627
  return categoryFormatter(value);
package/package.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
7
- "version": "1.9.3",
7
+ "version": "1.9.4",
8
8
  "homepage": "https://main--68e80310a069c2f10b546ef3.chromatic.com/",
9
9
  "repository": {
10
10
  "type": "git",