@chakra-ui/charts 3.32.0 → 3.34.0

package/dist/cjs/chart/chart.cjs

@@ -5,7 +5,6 @@
 var jsxRuntime = require('react/jsx-runtime');
 var react = require('@chakra-ui/react');
 var React = require('react');
-var recharts = require('recharts');
 var useChart = require('../use-chart.cjs');
 
 const ChartContext = React.createContext({});
@@ -29,6 +28,10 @@ const baseCss = react.defineStyle({
   },
   "& svg": {
     overflow: "visible"
+  },
+  "& .recharts-wrapper": {
+    width: "100%",
+    height: "100%"
   }
 });
 function ChartRoot(props) {
@@ -40,7 +43,7 @@ function ChartRoot(props) {
       textStyle: "xs",
       css: [baseCss, css],
       ...rest,
-      children: /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { children })
+      children
     }
   ) });
 }

package/dist/cjs/index.cjs

@@ -3,11 +3,11 @@
 
 var useChart = require('./use-chart.cjs');
 var chart = require('./chart/chart.cjs');
-var namespace = require('./chart/namespace.cjs');
+var namespace$2 = require('./chart/namespace.cjs');
 var barList = require('./bar-list/bar-list.cjs');
-var namespace$1 = require('./bar-list/namespace.cjs');
+var namespace = require('./bar-list/namespace.cjs');
 var barSegment = require('./bar-segment/bar-segment.cjs');
-var namespace$2 = require('./bar-segment/namespace.cjs');
+var namespace$1 = require('./bar-segment/namespace.cjs');
 
 
 
@@ -17,7 +17,7 @@ exports.ChartLegend = chart.ChartLegend;
 exports.ChartRadialText = chart.ChartRadialText;
 exports.ChartRoot = chart.ChartRoot;
 exports.ChartTooltip = chart.ChartTooltip;
-exports.Chart = namespace;
+exports.Chart = namespace$2;
 exports.BarListBar = barList.BarListBar;
 exports.BarListContent = barList.BarListContent;
 exports.BarListLabel = barList.BarListLabel;
@@ -25,7 +25,7 @@ exports.BarListRoot = barList.BarListRoot;
 exports.BarListTitle = barList.BarListTitle;
 exports.BarListTooltip = barList.BarListTooltip;
 exports.BarListValue = barList.BarListValue;
-exports.BarList = namespace$1;
+exports.BarList = namespace;
 exports.BarSegmentBar = barSegment.BarSegmentBar;
 exports.BarSegmentContent = barSegment.BarSegmentContent;
 exports.BarSegmentLabel = barSegment.BarSegmentLabel;
@@ -33,4 +33,4 @@ exports.BarSegmentLegend = barSegment.BarSegmentLegend;
 exports.BarSegmentReference = barSegment.BarSegmentReference;
 exports.BarSegmentRoot = barSegment.BarSegmentRoot;
 exports.BarSegmentValue = barSegment.BarSegmentValue;
-exports.BarSegment = namespace$2;
+exports.BarSegment = namespace$1;

package/dist/esm/bar-segment/bar-segment.js

@@ -1,7 +1,7 @@
 "use strict";
 "use client";
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { Stack, HStack, Box, FormatNumber, ColorSwatch, Text, Span, Flex } from '@chakra-ui/react';
+import { Stack, HStack, Box, ColorSwatch, Text, Span, Flex, FormatNumber } from '@chakra-ui/react';
 import * as React from 'react';
 
 const ChartContext = React.createContext({});

package/dist/esm/chart/chart.js

@@ -2,8 +2,7 @@
 "use client";
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { defineStyle, Stack, Text, Flex, HStack, ColorSwatch, Span, Box, Separator } from '@chakra-ui/react';
-import { createContext, useContext, useMemo } from 'react';
-import { ResponsiveContainer } from 'recharts';
+import { createContext, useMemo, useContext } from 'react';
 import { getProp } from '../use-chart.js';
 
 const ChartContext = createContext({});
@@ -27,6 +26,10 @@ const baseCss = defineStyle({
   },
   "& svg": {
     overflow: "visible"
+  },
+  "& .recharts-wrapper": {
+    width: "100%",
+    height: "100%"
   }
 });
 function ChartRoot(props) {
@@ -38,7 +41,7 @@ function ChartRoot(props) {
       textStyle: "xs",
       css: [baseCss, css],
       ...rest,
-      children: /* @__PURE__ */ jsx(ResponsiveContainer, { children })
+      children
     }
   ) });
 }

package/dist/esm/index.js

@@ -1,11 +1,11 @@
 "use strict";
 export { useChart } from './use-chart.js';
 export { ChartGradient, ChartLegend, ChartRadialText, ChartRoot, ChartTooltip } from './chart/chart.js';
-import * as namespace from './chart/namespace.js';
-export { namespace as Chart };
+import * as namespace$2 from './chart/namespace.js';
+export { namespace$2 as Chart };
 export { BarListBar, BarListContent, BarListLabel, BarListRoot, BarListTitle, BarListTooltip, BarListValue } from './bar-list/bar-list.js';
-import * as namespace$1 from './bar-list/namespace.js';
-export { namespace$1 as BarList };
+import * as namespace from './bar-list/namespace.js';
+export { namespace as BarList };
 export { BarSegmentBar, BarSegmentContent, BarSegmentLabel, BarSegmentLegend, BarSegmentReference, BarSegmentRoot, BarSegmentValue } from './bar-segment/bar-segment.js';
-import * as namespace$2 from './bar-segment/namespace.js';
-export { namespace$2 as BarSegment };
+import * as namespace$1 from './bar-segment/namespace.js';
+export { namespace$1 as BarSegment };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@chakra-ui/charts",
-  "version": "3.32.0",
+  "version": "3.34.0",
   "description": "Data visualization components for Chakra UI",
   "type": "module",
   "main": "dist/cjs/index.cjs",
@@ -43,10 +43,10 @@
     "./package.json": "./package.json"
   },
   "devDependencies": {
-    "recharts": "^3.4.1",
+    "recharts": "^3.7.0",
     "react": "19.2.4",
     "react-dom": "19.2.4",
-    "@chakra-ui/react": "3.32.0"
+    "@chakra-ui/react": "3.34.0"
   },
   "peerDependencies": {
     "@chakra-ui/react": ">=3",