@efiche/design 0.2.1 → 0.2.2
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.cjs +20 -12
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.mts +8 -0
- package/dist/index.d.ts +8 -0
- package/dist/index.js +20 -12
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/dist/index.cjs
CHANGED
|
@@ -157,10 +157,12 @@ var LineChart = ({
|
|
|
157
157
|
height = 250,
|
|
158
158
|
legend = false,
|
|
159
159
|
grid = true,
|
|
160
|
-
theme = "light"
|
|
160
|
+
theme = "light",
|
|
161
|
+
className,
|
|
162
|
+
style
|
|
161
163
|
}) => {
|
|
162
164
|
const { gridColor, axisStroke, axisTick, tooltipStyle } = getChartTheme(theme);
|
|
163
|
-
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_recharts.ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_recharts.LineChart, { data, children: [
|
|
165
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className, style: __spreadValues({ minWidth: 250, width: "100%" }, style), children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_recharts.ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_recharts.LineChart, { data, children: [
|
|
164
166
|
grid && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_recharts.CartesianGrid, { strokeDasharray: "3 3", stroke: gridColor }),
|
|
165
167
|
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_recharts.XAxis, { dataKey: xKey, stroke: axisStroke, tick: axisTick }),
|
|
166
168
|
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_recharts.YAxis, { stroke: axisStroke, tick: axisTick }),
|
|
@@ -183,7 +185,7 @@ var LineChart = ({
|
|
|
183
185
|
line.dataKey
|
|
184
186
|
);
|
|
185
187
|
})
|
|
186
|
-
] }) });
|
|
188
|
+
] }) }) });
|
|
187
189
|
};
|
|
188
190
|
var LineChart_default = LineChart;
|
|
189
191
|
|
|
@@ -197,10 +199,12 @@ var BarChart = ({
|
|
|
197
199
|
height = 250,
|
|
198
200
|
legend = false,
|
|
199
201
|
grid = true,
|
|
200
|
-
theme = "light"
|
|
202
|
+
theme = "light",
|
|
203
|
+
className,
|
|
204
|
+
style
|
|
201
205
|
}) => {
|
|
202
206
|
const { gridColor, axisStroke, axisTick, tooltipStyle } = getChartTheme(theme);
|
|
203
|
-
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_recharts2.ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_recharts2.BarChart, { data, children: [
|
|
207
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className, style: __spreadValues({ minWidth: 250, width: "100%" }, style), children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_recharts2.ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_recharts2.BarChart, { data, children: [
|
|
204
208
|
grid && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_recharts2.CartesianGrid, { strokeDasharray: "3 3", stroke: gridColor }),
|
|
205
209
|
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_recharts2.XAxis, { dataKey: xKey, stroke: axisStroke, tick: axisTick }),
|
|
206
210
|
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_recharts2.YAxis, { stroke: axisStroke, tick: axisTick }),
|
|
@@ -222,7 +226,7 @@ var BarChart = ({
|
|
|
222
226
|
bar.dataKey
|
|
223
227
|
);
|
|
224
228
|
})
|
|
225
|
-
] }) });
|
|
229
|
+
] }) }) });
|
|
226
230
|
};
|
|
227
231
|
var BarChart_default = BarChart;
|
|
228
232
|
|
|
@@ -236,10 +240,12 @@ var AreaChart = ({
|
|
|
236
240
|
height = 250,
|
|
237
241
|
legend = false,
|
|
238
242
|
grid = true,
|
|
239
|
-
theme = "light"
|
|
243
|
+
theme = "light",
|
|
244
|
+
className,
|
|
245
|
+
style
|
|
240
246
|
}) => {
|
|
241
247
|
const { gridColor, axisStroke, axisTick, tooltipStyle } = getChartTheme(theme);
|
|
242
|
-
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_recharts3.ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_recharts3.AreaChart, { data, children: [
|
|
248
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className, style: __spreadValues({ minWidth: 250, width: "100%" }, style), children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_recharts3.ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_recharts3.AreaChart, { data, children: [
|
|
243
249
|
grid && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_recharts3.CartesianGrid, { strokeDasharray: "3 3", stroke: gridColor }),
|
|
244
250
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_recharts3.XAxis, { dataKey: xKey, stroke: axisStroke, tick: axisTick }),
|
|
245
251
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_recharts3.YAxis, { stroke: axisStroke, tick: axisTick }),
|
|
@@ -264,7 +270,7 @@ var AreaChart = ({
|
|
|
264
270
|
area.dataKey
|
|
265
271
|
);
|
|
266
272
|
})
|
|
267
|
-
] }) });
|
|
273
|
+
] }) }) });
|
|
268
274
|
};
|
|
269
275
|
var AreaChart_default = AreaChart;
|
|
270
276
|
|
|
@@ -277,7 +283,9 @@ var PieChart = ({
|
|
|
277
283
|
donut = false,
|
|
278
284
|
legend = false,
|
|
279
285
|
label = false,
|
|
280
|
-
theme = "light"
|
|
286
|
+
theme = "light",
|
|
287
|
+
className,
|
|
288
|
+
style
|
|
281
289
|
}) => {
|
|
282
290
|
const { tooltipStyle } = getChartTheme(theme);
|
|
283
291
|
const dataWithColors = data.map((item, i) => {
|
|
@@ -288,7 +296,7 @@ var PieChart = ({
|
|
|
288
296
|
});
|
|
289
297
|
const outerRadius = 90;
|
|
290
298
|
const innerRadius = donut ? 55 : 0;
|
|
291
|
-
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_recharts4.ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_recharts4.PieChart, { children: [
|
|
299
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className, style: __spreadValues({ minWidth: 250, width: "100%" }, style), children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_recharts4.ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_recharts4.PieChart, { children: [
|
|
292
300
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
293
301
|
import_recharts4.Pie,
|
|
294
302
|
{
|
|
@@ -304,7 +312,7 @@ var PieChart = ({
|
|
|
304
312
|
),
|
|
305
313
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_recharts4.Tooltip, { contentStyle: tooltipStyle }),
|
|
306
314
|
legend && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_recharts4.Legend, {})
|
|
307
|
-
] }) });
|
|
315
|
+
] }) }) });
|
|
308
316
|
};
|
|
309
317
|
var PieChart_default = PieChart;
|
|
310
318
|
|