@ultraviolet/ui 3.11.0 → 3.12.0

package/dist/components/Pagination/styles.css.d.ts

@@ -1,4 +1,6 @@
-export declare const pageNumbersContainer: string;
-export declare const pageButton: Record<"medium" | "small", string>;
-export declare const ellipsisClass: Record<"medium" | "small", string>;
+export declare const paginationStyle: {
+    pageNumbersContainer: string;
+    pageButton: Record<"medium" | "small", string>;
+    ellipsisClass: Record<"medium" | "small", string>;
+};
 //# sourceMappingURL=styles.css.d.ts.map

package/dist/components/Pagination/styles.css.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/styles.css.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,oBAAoB,QAE/B,CAAA;AAEF,eAAO,MAAM,UAAU,oCAGrB,CAAA;AAOF,eAAO,MAAM,aAAa,oCAexB,CAAA"}
+{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/styles.css.ts"],"names":[],"mappings":"AAkCA,eAAO,MAAM,eAAe;;;;CAI3B,CAAA"}

package/dist/components/Pagination/styles.css.js

@@ -1,15 +1,23 @@
-/* empty css                      */
+import { __esmMin } from "../../_virtual/_rolldown/runtime.js";
+import { init_styles_css_ts_vanilla } from "./styles.css.ts.vanilla.js";
 
 //#region src/components/Pagination/styles.css.ts
-var pageNumbersContainer = "uv_a0295u0";
-var pageButton = {
-	medium: "uv_a0295u1",
-	small: "uv_a0295u2"
-};
-var ellipsisClass = {
-	medium: "uv_a0295u4 uv_a0295u3",
-	small: "uv_a0295u5 uv_a0295u3"
-};
+var paginationStyle;
+var init_styles_css = __esmMin(() => {
+	init_styles_css_ts_vanilla();
+	paginationStyle = {
+		pageNumbersContainer: "uv_a0295u0",
+		pageButton: {
+			medium: "uv_a0295u1",
+			small: "uv_a0295u2"
+		},
+		ellipsisClass: {
+			medium: "uv_a0295u4 uv_a0295u3",
+			small: "uv_a0295u5 uv_a0295u3"
+		}
+	};
+});
 
 //#endregion
-export { ellipsisClass, pageButton, pageNumbersContainer };
+init_styles_css();
+export { init_styles_css, paginationStyle };

package/dist/components/Pagination/styles.css.ts.vanilla.js

@@ -0,0 +1,8 @@
+import { __esmMin } from "../../_virtual/_rolldown/runtime.js";
+
+//#region src/components/Pagination/styles.css.ts.vanilla.css
+var init_styles_css_ts_vanilla = __esmMin(() => {});
+
+//#endregion
+init_styles_css_ts_vanilla();
+export { init_styles_css_ts_vanilla };

package/dist/components/PasswordCheck/index.js

@@ -1,41 +1,44 @@
 'use client';
-import { __name } from "../../_virtual/_rolldown/runtime.js";
-import { Stack } from "../Stack/index.js";
-import { Text } from "../Text/index.js";
-import { passwordCheckContainer } from "./styles.css.js";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
+import { Stack, init_Stack } from "../Stack/index.js";
+import { Text, init_Text } from "../Text/index.js";
+import { init_styles_css, passwordCheckStyle } from "./styles.css.js";
 import { cn } from "@ultraviolet/utils";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { CheckCircleIcon } from "@ultraviolet/icons/CheckCircleIcon";
 import { CloseIcon } from "@ultraviolet/icons/CloseIcon";
 
 //#region src/components/PasswordCheck/index.tsx
-/**
-* PasswordCheck is a component that display a list of password rules with a check or a cross depending on the validity
-* of the rule.
-*/
-const PasswordCheck = ({ rules, className, "data-testid": dataTestId, style }) => /* @__PURE__ */ jsx("div", {
-	className: cn(className, passwordCheckContainer),
-	"data-testid": dataTestId,
-	style,
-	children: rules.map((rule) => /* @__PURE__ */ jsxs(Stack, {
-		alignItems: "center",
-		direction: "row",
-		gap: 1,
-		children: [rule.valid ? /* @__PURE__ */ jsx(CheckCircleIcon, {
-			prominence: "weak",
-			sentiment: "success",
-			size: "small"
-		}) : /* @__PURE__ */ jsx(CloseIcon, {
-			prominence: "weak",
-			sentiment: "neutral",
-			size: "small"
-		}), /* @__PURE__ */ jsx(Text, {
-			as: "p",
-			variant: "caption",
-			children: rule.text
-		})]
-	}, rule.name))
+var PasswordCheck;
+var init_PasswordCheck = __esmMin(() => {
+	init_Stack();
+	init_Text();
+	init_styles_css();
+	PasswordCheck = ({ rules, className, "data-testid": dataTestId, style }) => /* @__PURE__ */ jsx("div", {
+		className: cn(className, passwordCheckStyle.container),
+		"data-testid": dataTestId,
+		style,
+		children: rules.map((rule) => /* @__PURE__ */ jsxs(Stack, {
+			alignItems: "center",
+			direction: "row",
+			gap: 1,
+			children: [rule.valid ? /* @__PURE__ */ jsx(CheckCircleIcon, {
+				prominence: "weak",
+				sentiment: "success",
+				size: "small"
+			}) : /* @__PURE__ */ jsx(CloseIcon, {
+				prominence: "weak",
+				sentiment: "neutral",
+				size: "small"
+			}), /* @__PURE__ */ jsx(Text, {
+				as: "p",
+				variant: "caption",
+				children: rule.text
+			})]
+		}, rule.name))
+	});
 });
 
 //#endregion
-export { PasswordCheck };
+init_PasswordCheck();
+export { PasswordCheck, init_PasswordCheck };

package/dist/components/PasswordCheck/styles.css.d.ts

@@ -1,2 +1,4 @@
-export declare const passwordCheckContainer: string;
+export declare const passwordCheckStyle: {
+    container: string;
+};
 //# sourceMappingURL=styles.css.d.ts.map

package/dist/components/PasswordCheck/styles.css.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../../../src/components/PasswordCheck/styles.css.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,sBAAsB,QAIjC,CAAA"}
+{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../../../src/components/PasswordCheck/styles.css.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,kBAAkB;;CAAgB,CAAA"}

package/dist/components/PasswordCheck/styles.css.js

@@ -1,7 +1,13 @@
-/* empty css                      */
+import { __esmMin } from "../../_virtual/_rolldown/runtime.js";
+import { init_styles_css_ts_vanilla } from "./styles.css.ts.vanilla.js";
 
 //#region src/components/PasswordCheck/styles.css.ts
-var passwordCheckContainer = "uv_4g08in0";
+var passwordCheckStyle;
+var init_styles_css = __esmMin(() => {
+	init_styles_css_ts_vanilla();
+	passwordCheckStyle = { container: "uv_4g08in0" };
+});
 
 //#endregion
-export { passwordCheckContainer };
+init_styles_css();
+export { init_styles_css, passwordCheckStyle };

package/dist/components/PasswordCheck/styles.css.ts.vanilla.js

@@ -0,0 +1,8 @@
+import { __esmMin } from "../../_virtual/_rolldown/runtime.js";
+
+//#region src/components/PasswordCheck/styles.css.ts.vanilla.css
+var init_styles_css_ts_vanilla = __esmMin(() => {});
+
+//#endregion
+init_styles_css_ts_vanilla();
+export { init_styles_css_ts_vanilla };

package/dist/components/PieChart/Legends.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Legends.d.ts","sourceRoot":"","sources":["../../../src/components/PieChart/Legends.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAEnC,KAAK,YAAY,GAAG;IAClB,IAAI,CAAC,EAAE,IAAI,EAAE,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,aAAa,EAAE,CAAC,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,MAAM,EAAE,MAAM,EAAE,CAAA;CACjB,CAAA;AAED,eAAO,MAAM,OAAO,sGA0DnB,CAAA"}
+{"version":3,"file":"Legends.d.ts","sourceRoot":"","sources":["../../../src/components/PieChart/Legends.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAEnC,KAAK,YAAY,GAAG;IAClB,IAAI,CAAC,EAAE,IAAI,EAAE,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,aAAa,EAAE,CAAC,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,MAAM,EAAE,MAAM,EAAE,CAAA;CACjB,CAAA;AAED,eAAO,MAAM,OAAO,sGAgEnB,CAAA"}

package/dist/components/PieChart/Legends.js

@@ -1,57 +1,64 @@
 'use client';
-import { __name } from "../../_virtual/_rolldown/runtime.js";
-import { Tooltip } from "../Tooltip/index.js";
-import { bulletPie, colorBullet, labelPie, linePie, listItemPie, listPie, progressiveLinePie, textPie, toggleBoxPie, valuePie } from "./styles.css.js";
-import { Tooltip as Tooltip$1 } from "./Tooltip.js";
+import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
+import { Tooltip, init_Tooltip } from "../Tooltip/index.js";
+import { colorBullet, init_styles_css, pieChartStyle } from "./styles.css.js";
+import { Tooltip as Tooltip$1, init_Tooltip as init_Tooltip$1 } from "./Tooltip.js";
 import { assignInlineVars } from "@vanilla-extract/dynamic";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/PieChart/Legends.tsx
-const Legends = ({ focused, data, onFocusChange, colors }) => /* @__PURE__ */ jsx("ul", {
-	className: listPie,
-	children: data === null || data === void 0 ? void 0 : data.map((item, index) => {
-		const isSegmentFocused = focused !== void 0 && item.id === focused;
-		const id = `chart-legend-${item.id}`;
-		return /* @__PURE__ */ jsx(Tooltip, {
-			id,
-			text: /* @__PURE__ */ jsx(Tooltip$1, { data: item }),
-			visible: isSegmentFocused,
-			children: /* @__PURE__ */ jsxs("li", {
-				className: listItemPie({ isFocused: isSegmentFocused }),
-				children: [
-					/* @__PURE__ */ jsx("div", {
-						className: toggleBoxPie,
-						"data-testid": id,
-						onBlur: () => onFocusChange(),
-						onFocus: () => onFocusChange(item.id),
-						onMouseOut: () => onFocusChange(),
-						onMouseOver: () => onFocusChange(item.id)
-					}),
-					/* @__PURE__ */ jsx("div", {
-						className: bulletPie({ isFocused: isSegmentFocused }),
-						color: colors[index],
-						id: `chart-legend-${item.id}`,
-						style: assignInlineVars({ [colorBullet]: colors[index] })
-					}),
-					/* @__PURE__ */ jsxs("div", {
-						className: labelPie,
-						children: [/* @__PURE__ */ jsx("span", {
-							className: textPie({ isFocused: isSegmentFocused }),
-							children: item.name
-						}), /* @__PURE__ */ jsx("span", {
-							className: linePie,
-							children: /* @__PURE__ */ jsx("span", { className: progressiveLinePie({ isFocused: isSegmentFocused }) })
-						})]
-					}),
-					/* @__PURE__ */ jsx("div", {
-						className: valuePie[isSegmentFocused ? "isFocused" : "default"],
-						children: item.value
-					})
-				]
-			})
-		}, item.id);
-	})
+var Legends;
+var init_Legends = __esmMin(() => {
+	init_Tooltip();
+	init_styles_css();
+	init_Tooltip$1();
+	Legends = ({ focused, data, onFocusChange, colors }) => /* @__PURE__ */ jsx("ul", {
+		className: pieChartStyle.list,
+		children: data === null || data === void 0 ? void 0 : data.map((item, index) => {
+			const isSegmentFocused = focused !== void 0 && item.id === focused;
+			const id = `chart-legend-${item.id}`;
+			return /* @__PURE__ */ jsx(Tooltip, {
+				id,
+				text: /* @__PURE__ */ jsx(Tooltip$1, { data: item }),
+				visible: isSegmentFocused,
+				children: /* @__PURE__ */ jsxs("li", {
+					className: pieChartStyle.listItem({ isFocused: isSegmentFocused }),
+					children: [
+						/* @__PURE__ */ jsx("div", {
+							className: pieChartStyle.toggleBox,
+							"data-testid": id,
+							onBlur: () => onFocusChange(),
+							onFocus: () => onFocusChange(item.id),
+							onMouseOut: () => onFocusChange(),
+							onMouseOver: () => onFocusChange(item.id)
+						}),
+						/* @__PURE__ */ jsx("div", {
+							className: pieChartStyle.bullet({ isFocused: isSegmentFocused }),
+							color: colors[index],
+							id: `chart-legend-${item.id}`,
+							style: assignInlineVars({ [colorBullet]: colors[index] })
+						}),
+						/* @__PURE__ */ jsxs("div", {
+							className: pieChartStyle.label,
+							children: [/* @__PURE__ */ jsx("span", {
+								className: pieChartStyle.text({ isFocused: isSegmentFocused }),
+								children: item.name
+							}), /* @__PURE__ */ jsx("span", {
+								className: pieChartStyle.line,
+								children: /* @__PURE__ */ jsx("span", { className: pieChartStyle.progressiveLine({ isFocused: isSegmentFocused }) })
+							})]
+						}),
+						/* @__PURE__ */ jsx("div", {
+							className: pieChartStyle.value[isSegmentFocused ? "isFocused" : "default"],
+							children: item.value
+						})
+					]
+				})
+			}, item.id);
+		})
+	});
 });
 
 //#endregion
-export { Legends };
+init_Legends();
+export { Legends, init_Legends };

package/dist/components/PieChart/Tooltip.js

@@ -1,47 +1,53 @@
 'use client';
-import { __name } from "../../_virtual/_rolldown/runtime.js";
-import { Text } from "../Text/index.js";
-import { itemTooltipPie, listTooltipPie } from "./styles.css.js";
+import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
+import { Text, init_Text } from "../Text/index.js";
+import { init_styles_css, pieChartStyle } from "./styles.css.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/PieChart/Tooltip.tsx
-const Tooltip = ({ data }) => {
-	var _data$details;
-	return /* @__PURE__ */ jsx("div", {
-		role: "tooltip",
-		tabIndex: -1,
-		children: /* @__PURE__ */ jsxs("ul", {
-			className: listTooltipPie,
-			children: [/* @__PURE__ */ jsxs("li", {
-				className: itemTooltipPie,
-				children: [/* @__PURE__ */ jsx(Text, {
-					as: "p",
-					prominence: "stronger",
-					variant: "body",
-					children: data.name
-				}), /* @__PURE__ */ jsx(Text, {
-					as: "p",
-					prominence: "stronger",
-					variant: "body",
-					children: data.value
-				})]
-			}), (_data$details = data.details) === null || _data$details === void 0 ? void 0 : _data$details.map((detail) => /* @__PURE__ */ jsxs("li", {
-				className: itemTooltipPie,
-				children: [/* @__PURE__ */ jsx(Text, {
-					as: "p",
-					prominence: "stronger",
-					variant: "bodySmall",
-					children: detail.name
-				}), /* @__PURE__ */ jsx(Text, {
-					as: "p",
-					prominence: "stronger",
-					variant: "bodySmall",
-					children: detail.value
-				})]
-			}, detail.name))]
-		})
-	});
-};
+var Tooltip;
+var init_Tooltip = __esmMin(() => {
+	init_Text();
+	init_styles_css();
+	Tooltip = ({ data }) => {
+		var _data$details;
+		return /* @__PURE__ */ jsx("div", {
+			role: "tooltip",
+			tabIndex: -1,
+			children: /* @__PURE__ */ jsxs("ul", {
+				className: pieChartStyle.listTooltip,
+				children: [/* @__PURE__ */ jsxs("li", {
+					className: pieChartStyle.itemTooltip,
+					children: [/* @__PURE__ */ jsx(Text, {
+						as: "p",
+						prominence: "stronger",
+						variant: "body",
+						children: data.name
+					}), /* @__PURE__ */ jsx(Text, {
+						as: "p",
+						prominence: "stronger",
+						variant: "body",
+						children: data.value
+					})]
+				}), (_data$details = data.details) === null || _data$details === void 0 ? void 0 : _data$details.map((detail) => /* @__PURE__ */ jsxs("li", {
+					className: pieChartStyle.itemTooltip,
+					children: [/* @__PURE__ */ jsx(Text, {
+						as: "p",
+						prominence: "stronger",
+						variant: "bodySmall",
+						children: detail.name
+					}), /* @__PURE__ */ jsx(Text, {
+						as: "p",
+						prominence: "stronger",
+						variant: "bodySmall",
+						children: detail.value
+					})]
+				}, detail.name))]
+			})
+		});
+	};
+});
 
 //#endregion
-export { Tooltip };
+init_Tooltip();
+export { Tooltip, init_Tooltip };

package/dist/components/PieChart/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PieChart/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,YAAY,CAAA;AAKrC,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAYrD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAEnC,KAAK,aAAa,GAAG;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IACpC,IAAI,CAAC,EAAE,IAAI,EAAE,CAAA;IACb,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,MAAM,CAAC,EAAE,GAAG,CAAA;IACZ,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,CAAA;AAKD;;;;GAIG;AACH,eAAO,MAAM,QAAQ,mJA0GpB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PieChart/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,YAAY,CAAA;AAKrC,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAOrD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAEnC,KAAK,aAAa,GAAG;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IACpC,IAAI,CAAC,EAAE,IAAI,EAAE,CAAA;IACb,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,MAAM,CAAC,EAAE,GAAG,CAAA;IACZ,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,CAAA;AAKD;;;;GAIG;AACH,eAAO,MAAM,QAAQ,mJA4GpB,CAAA"}

package/dist/components/PieChart/index.js

@@ -1,11 +1,11 @@
 'use client';
-import { __name } from "../../_virtual/_rolldown/runtime.js";
-import { _objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.114.0/helpers/objectSpread2.js";
-import { Text } from "../Text/index.js";
-import { getLegendColor } from "../../helpers/legend.js";
-import { getNivoTheme } from "../../helpers/nivoTheme.js";
-import { containerPie, contentPie, emptyLegendPie, heightContainerPie } from "./styles.css.js";
-import { Legends } from "./Legends.js";
+import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
+import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.115.0/helpers/objectSpread2.js";
+import { Text, init_Text } from "../Text/index.js";
+import { getLegendColor, init_legend } from "../../helpers/legend.js";
+import { getNivoTheme, init_nivoTheme } from "../../helpers/nivoTheme.js";
+import { heightContainerPie, init_styles_css, pieChartStyle } from "./styles.css.js";
+import { Legends, init_Legends } from "./Legends.js";
 import { useCallback, useState } from "react";
 import { useTheme } from "@ultraviolet/themes";
 import { assignInlineVars } from "@vanilla-extract/dynamic";
@@ -13,91 +13,96 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { Pie } from "@nivo/pie";
 
 //#region src/components/PieChart/index.tsx
-const DEFAULT_CHARTPROPS = {};
-const DEFAULT_MARGIN = {
-	bottom: 10,
-	left: 10,
-	right: 10,
-	top: 10
-};
-/**
-* PieChart component is a wrapper around the Nivo Pie component to display a pie chart.
-* See https://nivo.rocks/pie/ for more information.
-* @experimental This component is experimental and may be subject to breaking changes in the future.
-*/
-const PieChart = ({ height = 206, width = 206, data = void 0, emptyLegend, content, withLegend = false, margin = DEFAULT_MARGIN, chartProps = DEFAULT_CHARTPROPS, style }) => {
-	const theme = useTheme();
-	const [currentFocusIndex, setCurrentFocusIndex] = useState();
-	const emptyTooltip = useCallback(() => /* @__PURE__ */ jsx("span", {}), []);
-	const isEmpty = !data || data.length === 0;
-	const EmptyLegendDisplayed = useCallback(() => emptyLegend ? /* @__PURE__ */ jsx("div", {
-		className: emptyLegendPie,
-		children: /* @__PURE__ */ jsx(Text, {
-			as: "p",
-			variant: "body",
-			children: emptyLegend
-		})
-	}) : null, [emptyLegend]);
-	const localColors = getLegendColor(theme);
-	const LegendDisplayer = useCallback(() => isEmpty ? /* @__PURE__ */ jsx(EmptyLegendDisplayed, {}) : /* @__PURE__ */ jsx(Legends, {
-		colors: localColors,
-		data,
-		focused: currentFocusIndex,
-		onFocusChange: setCurrentFocusIndex
-	}), [
-		isEmpty,
-		currentFocusIndex,
-		data,
-		EmptyLegendDisplayed,
-		localColors
-	]);
-	return /* @__PURE__ */ jsxs("div", {
-		className: containerPie,
-		style: _objectSpread2(_objectSpread2({}, assignInlineVars({ [heightContainerPie]: height ? `${height}px` : "" })), style),
-		children: [/* @__PURE__ */ jsxs("div", {
-			style: { position: "relative" },
-			children: [/* @__PURE__ */ jsx(Pie, _objectSpread2({
-				activeOuterRadiusOffset: isEmpty ? 0 : 4,
-				colors: localColors,
-				cornerRadius: 0,
-				data: isEmpty ? [{
-					id: "empty",
-					percent: 100
-				}] : data,
-				defs: [{
-					background: "inherit",
-					color: theme.colors.neutral.textStrong,
-					id: "lines",
-					lineWidth: 2,
-					rotation: 0,
-					spacing: 5,
-					type: "patternLines"
-				}],
-				enableArcLabels: false,
-				enableArcLinkLabels: false,
-				height,
-				innerRadius: .8,
-				margin,
-				onMouseEnter: (datum, event) => {
-					if (!isEmpty) {
-						const pie = event.currentTarget;
-						pie.style.cursor = "pointer";
-						setCurrentFocusIndex(datum.id.toString());
-					}
-				},
-				onMouseLeave: () => setCurrentFocusIndex(void 0),
-				padAngle: 1,
-				theme: getNivoTheme(theme),
-				tooltip: emptyTooltip,
-				value: "percent",
-				width
-			}, chartProps)), content ? /* @__PURE__ */ jsx("div", {
-				className: contentPie,
-				children: content
-			}) : null]
-		}), withLegend ? /* @__PURE__ */ jsx(LegendDisplayer, {}) : null]
-	});
-};
+var DEFAULT_CHARTPROPS, DEFAULT_MARGIN, PieChart;
+var init_PieChart = __esmMin(() => {
+	init_legend();
+	init_nivoTheme();
+	init_Text();
+	init_Legends();
+	init_styles_css();
+	init_objectSpread2();
+	DEFAULT_CHARTPROPS = {};
+	DEFAULT_MARGIN = {
+		bottom: 10,
+		left: 10,
+		right: 10,
+		top: 10
+	};
+	PieChart = ({ height = 206, width = 206, data = void 0, emptyLegend, content, withLegend = false, margin = DEFAULT_MARGIN, chartProps = DEFAULT_CHARTPROPS, style }) => {
+		const theme = useTheme();
+		const [currentFocusIndex, setCurrentFocusIndex] = useState();
+		const emptyTooltip = useCallback(() => /* @__PURE__ */ jsx("span", {}), []);
+		const isEmpty = !data || data.length === 0;
+		const EmptyLegendDisplayed = useCallback(() => emptyLegend ? /* @__PURE__ */ jsx("div", {
+			className: pieChartStyle.emptyLegend,
+			children: /* @__PURE__ */ jsx(Text, {
+				as: "p",
+				variant: "body",
+				children: emptyLegend
+			})
+		}) : null, [emptyLegend]);
+		const localColors = getLegendColor(theme);
+		const LegendDisplayer = useCallback(() => isEmpty ? /* @__PURE__ */ jsx(EmptyLegendDisplayed, {}) : /* @__PURE__ */ jsx(Legends, {
+			colors: localColors,
+			data,
+			focused: currentFocusIndex,
+			onFocusChange: setCurrentFocusIndex
+		}), [
+			isEmpty,
+			currentFocusIndex,
+			data,
+			EmptyLegendDisplayed,
+			localColors
+		]);
+		return /* @__PURE__ */ jsxs("div", {
+			className: pieChartStyle.container,
+			style: _objectSpread2(_objectSpread2({}, assignInlineVars({ [heightContainerPie]: height ? `${height}px` : "" })), style),
+			children: [/* @__PURE__ */ jsxs("div", {
+				style: { position: "relative" },
+				children: [/* @__PURE__ */ jsx(Pie, _objectSpread2({
+					activeOuterRadiusOffset: isEmpty ? 0 : 4,
+					colors: localColors,
+					cornerRadius: 0,
+					data: isEmpty ? [{
+						id: "empty",
+						percent: 100
+					}] : data,
+					defs: [{
+						background: "inherit",
+						color: theme.colors.neutral.textStrong,
+						id: "lines",
+						lineWidth: 2,
+						rotation: 0,
+						spacing: 5,
+						type: "patternLines"
+					}],
+					enableArcLabels: false,
+					enableArcLinkLabels: false,
+					height,
+					innerRadius: .8,
+					margin,
+					onMouseEnter: (datum, event) => {
+						if (!isEmpty) {
+							const pie = event.currentTarget;
+							pie.style.cursor = "pointer";
+							setCurrentFocusIndex(datum.id.toString());
+						}
+					},
+					onMouseLeave: () => setCurrentFocusIndex(void 0),
+					padAngle: 1,
+					theme: getNivoTheme(theme),
+					tooltip: emptyTooltip,
+					value: "percent",
+					width
+				}, chartProps)), content ? /* @__PURE__ */ jsx("div", {
+					className: pieChartStyle.content,
+					children: content
+				}) : null]
+			}), withLegend ? /* @__PURE__ */ jsx(LegendDisplayer, {}) : null]
+		});
+	};
+});
 
 //#endregion
-export { PieChart };
+init_PieChart();
+export { PieChart, init_PieChart };