shadcn-glass-ui 1.0.11 → 2.0.0

package/dist/index.js

@@ -1,9 +1,850 @@
-import { t as cn } from "./utils-CGCOTvxT.js";
-import { $ as ComboBoxGlass, A as ThemeToggleGlass, B as TabsGlass, C as ProgressGlass, D as FlagAlertGlass, E as LanguageBarGlass, F as ExpandableHeaderGlass, G as NotificationGlass, H as SkeletonGlass, I as TooltipGlass, J as modalSizes, K as notificationVariants, L as tooltipPositions, M as SortDropdownGlass, N as SearchBoxGlass, O as StatusIndicatorGlass, P as IconButtonGlass, Q as DropdownGlass, R as ToggleGlass, S as RainbowProgressGlass, T as ProfileAvatarGlass, U as skeletonVariants, V as SliderGlass, W as PopoverGlass, X as GlassCard, Y as InputGlass, Z as cardIntensity, _ as ContributionMetricsGlass, a as HeaderBrandingGlass, at as BadgeGlass, b as AICardGlass, c as YearCardGlass, ct as avatarSizes, d as TrustScoreDisplayGlass, dt as InteractiveCard, et as inputVariants, f as RepositoryMetadataGlass, ft as FormFieldWrapper, g as MetricCardGlass, h as MetricsGridGlass, i as HeaderNavGlass, it as buttonGlassVariants, j as StatItemGlass, k as BaseProgressGlass, l as UserStatsLineGlass, lt as statusSizes, m as RepositoryCardGlass, mt as alertVariants, n as ProjectsListGlass, nt as CheckboxGlass, o as FlagsSectionGlass, ot as badgeVariants, p as RepositoryHeaderGlass, pt as TouchTarget, q as ModalGlass, r as ProfileHeaderGlass, rt as ButtonGlass, s as CareerStatsGlass, st as AvatarGlass, t as TrustScoreCardGlass, tt as CircularProgressGlass, u as UserInfoGlass, ut as AlertGlass, v as CircularMetricGlass, w as progressSizes, x as SegmentedControlGlass, y as CareerStatsHeaderGlass, z as toggleSizes } from "./trust-score-card-glass-CowcDyxH.js";
+import { $ as BaseProgressGlass, A as useChartHeight, At as ButtonGlass, B as adaptEventsOfChild, Bt as TouchTarget, C as sparklineContainerVariants, Ct as GlassCard, D as Tooltip, Dt as inputVariants, E as Cell, Et as ComboBoxGlass, F as selectLegendPayload, Ft as avatarSizes, G as SegmentedControlGlass, H as isNumber, I as useAppDispatch, It as statusSizes, J as progressSizes, K as RainbowProgressGlass, L as useAppSelector, Lt as AlertGlass, M as useMargin, Mt as BadgeGlass, N as ResponsiveContainer, Nt as badgeVariants, O as setLegendSettings, Ot as CircularProgressGlass, P as useElementOffset, Pt as AvatarGlass, Q as StatusIndicatorGlass, R as getUniqPayload, Rt as InteractiveCard, S as sparklineBarVariants, St as InputGlass, T as Bar, Tt as DropdownGlass, U as useLegendPortal, V as Symbols, Vt as alertVariants, W as Surface, X as LanguageBarGlass, Y as ProfileAvatarGlass, Z as FlagAlertGlass, _ as ContributionMetricsGlass, _t as PopoverGlass, a as HeaderBrandingGlass, at as insightCardVariants, b as AICardGlass, bt as ModalGlass, c as YearCardGlass, ct as ExpandableHeaderGlass, d as TrustScoreDisplayGlass, dt as ToggleGlass, et as ThemeToggleGlass, f as RepositoryMetadataGlass, ft as toggleSizes, g as MetricCardGlass, gt as skeletonVariants, h as MetricsGridGlass, ht as SkeletonGlass, i as HeaderNavGlass, it as InsightCardGlass, j as useChartWidth, jt as buttonGlassVariants, k as setLegendSize, kt as CheckboxGlass, l as UserStatsLineGlass, lt as TooltipGlass, m as RepositoryCardGlass, mt as SliderGlass, n as ProjectsListGlass, nt as SortDropdownGlass, o as FlagsSectionGlass, ot as insightVariantConfig, p as RepositoryHeaderGlass, pt as TabsGlass, q as ProgressGlass, r as ProfileHeaderGlass, rt as SearchBoxGlass, s as CareerStatsGlass, st as IconButtonGlass, t as TrustScoreCardGlass, tt as StatItemGlass, u as UserInfoGlass, ut as tooltipPositions, v as CircularMetricGlass, vt as NotificationGlass, w as BarChart, wt as cardIntensity, x as SparklineGlass, xt as modalSizes, y as CareerStatsHeaderGlass, yt as notificationVariants, z as resolveDefaultProps, zt as FormFieldWrapper } from "./trust-score-card-glass-BcZbul0P.js";
+import { t as cn } from "./utils-CcyeqpKQ.js";
 import { n as useHover, t as useFocus } from "./use-focus-CX0TJJIj.js";
 import { a as getThemeConfig, i as getNextTheme, n as THEME_CONFIG, o as useTheme, r as ThemeProvider, t as THEMES } from "./theme-context-BZoCplcU.js";
 import { n as useResponsive, t as useWallpaperTint } from "./use-wallpaper-tint-DUgmytlY.js";
+import * as React from "react";
+import { createContext, forwardRef, useCallback, useContext, useEffect, useLayoutEffect, useMemo, useState } from "react";
+import { Check } from "lucide-react";
+import { clsx } from "clsx";
 import { cva } from "class-variance-authority";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { createPortal } from "react-dom";
+const stepperRootVariants = cva("flex w-full", {
+	variants: { orientation: {
+		horizontal: "flex-col",
+		vertical: "flex-col"
+	} },
+	defaultVariants: { orientation: "horizontal" }
+});
+const stepperListVariants = cva("flex", {
+	variants: { orientation: {
+		horizontal: "flex-row items-center w-full",
+		vertical: "flex-col gap-0"
+	} },
+	defaultVariants: { orientation: "horizontal" }
+});
+const stepperStepContainerVariants = cva("relative flex transition-all duration-300", {
+	variants: { orientation: {
+		horizontal: "flex-col items-center flex-1",
+		vertical: "flex-row items-start gap-3"
+	} },
+	defaultVariants: { orientation: "horizontal" }
+});
+const stepperIndicatorVariants = cva("relative flex items-center justify-center rounded-full font-medium transition-all duration-300 shrink-0", {
+	variants: {
+		size: {
+			sm: "w-8 h-8 text-xs",
+			md: "w-10 h-10 text-sm",
+			lg: "w-12 h-12 text-base"
+		},
+		variant: {
+			numbered: "",
+			icon: "",
+			dots: ""
+		}
+	},
+	defaultVariants: {
+		size: "md",
+		variant: "numbered"
+	},
+	compoundVariants: [
+		{
+			variant: "dots",
+			size: "sm",
+			className: "!w-2.5 !h-2.5"
+		},
+		{
+			variant: "dots",
+			size: "md",
+			className: "!w-3 !h-3"
+		},
+		{
+			variant: "dots",
+			size: "lg",
+			className: "!w-4 !h-4"
+		}
+	]
+});
+const stepperConnectorVariants = cva("transition-all duration-500 ease-out", {
+	variants: { orientation: {
+		horizontal: "h-0.5 flex-1 mx-2 md:mx-3",
+		vertical: "w-0.5 min-h-6 ml-5 my-1"
+	} },
+	defaultVariants: { orientation: "horizontal" }
+});
+const stepperLabelVariants = cva("font-medium transition-colors duration-300 whitespace-nowrap", {
+	variants: {
+		size: {
+			sm: "text-xs",
+			md: "text-sm",
+			lg: "text-base"
+		},
+		orientation: {
+			horizontal: "mt-2 text-center",
+			vertical: ""
+		}
+	},
+	defaultVariants: {
+		size: "md",
+		orientation: "horizontal"
+	}
+});
+const stepperDescriptionVariants = cva("transition-colors duration-300", {
+	variants: {
+		size: {
+			sm: "text-[10px]",
+			md: "text-xs",
+			lg: "text-sm"
+		},
+		orientation: {
+			horizontal: "text-center max-w-[100px] md:max-w-[120px]",
+			vertical: "max-w-[200px]"
+		}
+	},
+	defaultVariants: {
+		size: "md",
+		orientation: "horizontal"
+	}
+});
+const stepperContentVariants = cva("animate-in fade-in-0 duration-200", {
+	variants: { orientation: {
+		horizontal: "mt-6",
+		vertical: "mt-4"
+	} },
+	defaultVariants: { orientation: "horizontal" }
+});
+var StepperContext = createContext(null);
+var useStepperContext = () => {
+	const context = useContext(StepperContext);
+	if (!context) throw new Error("Stepper compound components must be used within StepperGlass.Root");
+	return context;
+};
+function getStepStatus(stepValue, currentValue, steps, linear, disabled) {
+	if (disabled) return "disabled";
+	const stepIndex = steps.indexOf(stepValue);
+	const currentIndex = steps.indexOf(currentValue);
+	if (stepIndex === -1 || currentIndex === -1) return "pending";
+	if (stepIndex === currentIndex) return "active";
+	if (stepIndex < currentIndex) return "completed";
+	if (linear && stepIndex > currentIndex) return "disabled";
+	return "pending";
+}
+var StepperRoot = ({ value, onValueChange, orientation = "horizontal", variant = "numbered", size = "md", linear = false, children, className }) => {
+	const [steps, setSteps] = useState([]);
+	const registerStep = useCallback((stepValue, index) => {
+		setSteps((prev) => {
+			if (prev.includes(stepValue)) return prev;
+			const newSteps = [...prev];
+			newSteps.splice(index, 0, stepValue);
+			return newSteps;
+		});
+	}, []);
+	const unregisterStep = useCallback((stepValue) => {
+		setSteps((prev) => prev.filter((s) => s !== stepValue));
+	}, []);
+	const contextValue = useMemo(() => ({
+		value,
+		onValueChange,
+		orientation,
+		variant,
+		size,
+		linear,
+		steps,
+		registerStep,
+		unregisterStep
+	}), [
+		value,
+		onValueChange,
+		orientation,
+		variant,
+		size,
+		linear,
+		steps,
+		registerStep,
+		unregisterStep
+	]);
+	return /* @__PURE__ */ jsx(StepperContext.Provider, {
+		value: contextValue,
+		children: /* @__PURE__ */ jsx("div", {
+			className: cn(stepperRootVariants({ orientation }), className),
+			"aria-label": "Progress steps",
+			children
+		})
+	});
+};
+var StepperList = forwardRef(({ children, className, ...props }, ref) => {
+	const { orientation } = useStepperContext();
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		role: "tablist",
+		"aria-orientation": orientation,
+		className: cn(stepperListVariants({ orientation }), className),
+		...props,
+		children
+	});
+});
+StepperList.displayName = "StepperList";
+var StepperStep = forwardRef(({ value: stepValue, label, description, icon, completedIcon, disabled: forcedDisabled, className, index: providedIndex }, ref) => {
+	const { value: currentValue, onValueChange, orientation, variant, size, linear, steps, registerStep, unregisterStep } = useStepperContext();
+	const { isFocusVisible, focusProps } = useFocus({ focusVisible: true });
+	const [mountIndex] = useState(() => providedIndex ?? Date.now());
+	useLayoutEffect(() => {
+		registerStep(stepValue, mountIndex);
+		return () => unregisterStep(stepValue);
+	}, [
+		stepValue,
+		mountIndex,
+		registerStep,
+		unregisterStep
+	]);
+	const status = getStepStatus(stepValue, currentValue, steps, linear, forcedDisabled);
+	const stepIndex = steps.indexOf(stepValue);
+	const isLast = stepIndex === steps.length - 1;
+	const isClickable = status !== "disabled";
+	const indicatorStyles = {
+		background: status === "completed" ? "var(--stepper-step-completed-bg)" : status === "active" ? "var(--stepper-step-active-bg)" : status === "disabled" ? "var(--stepper-step-disabled-bg)" : "var(--stepper-step-bg)",
+		border: `2px solid ${status === "completed" ? "var(--stepper-step-completed-border)" : status === "active" ? "var(--stepper-step-active-border)" : status === "disabled" ? "var(--stepper-step-disabled-border)" : "var(--stepper-step-border)"}`,
+		color: status === "completed" ? "var(--stepper-step-completed-text)" : status === "active" ? "var(--stepper-step-active-text)" : status === "disabled" ? "var(--stepper-step-disabled-text)" : "var(--stepper-step-text)",
+		boxShadow: status === "active" ? "var(--stepper-step-active-glow)" : status === "completed" ? "var(--stepper-step-glow)" : isFocusVisible ? "var(--focus-glow)" : "none",
+		backdropFilter: "blur(var(--blur-sm))"
+	};
+	const connectorStyles = { background: stepIndex < steps.indexOf(currentValue) ? "var(--stepper-connector-active-bg)" : "var(--stepper-connector-bg)" };
+	const labelStyles = { color: status === "active" || status === "completed" ? "var(--stepper-label-text)" : "var(--stepper-description-text)" };
+	const descriptionStyles = { color: "var(--stepper-description-text)" };
+	const renderIndicatorContent = () => {
+		if (status === "completed") {
+			if (completedIcon) return completedIcon;
+			return /* @__PURE__ */ jsx(Check, { className: "w-4 h-4" });
+		}
+		if (variant === "icon" && icon) return icon;
+		if (variant === "dots") return null;
+		return stepIndex >= 0 ? stepIndex + 1 : "";
+	};
+	const handleClick = () => {
+		if (isClickable && onValueChange) onValueChange(stepValue);
+	};
+	const handleKeyDown = (e) => {
+		if (!isClickable) return;
+		const stepList = e.currentTarget.closest("[role=\"tablist\"]");
+		if (!stepList) return;
+		const allSteps = Array.from(stepList.querySelectorAll("[role=\"tab\"]:not([aria-disabled=\"true\"])"));
+		const currentIdx = allSteps.indexOf(e.currentTarget);
+		let nextIdx = currentIdx;
+		const isHorizontal = orientation === "horizontal";
+		switch (e.key) {
+			case isHorizontal ? "ArrowRight" : "ArrowDown":
+				e.preventDefault();
+				nextIdx = (currentIdx + 1) % allSteps.length;
+				break;
+			case isHorizontal ? "ArrowLeft" : "ArrowUp":
+				e.preventDefault();
+				nextIdx = currentIdx - 1 < 0 ? allSteps.length - 1 : currentIdx - 1;
+				break;
+			case "Home":
+				e.preventDefault();
+				nextIdx = 0;
+				break;
+			case "End":
+				e.preventDefault();
+				nextIdx = allSteps.length - 1;
+				break;
+			default: return;
+		}
+		const nextStep = allSteps[nextIdx];
+		if (nextStep) {
+			nextStep.focus();
+			const nextValue = nextStep.getAttribute("data-value");
+			if (nextValue && onValueChange) onValueChange(nextValue);
+		}
+	};
+	if (orientation === "horizontal") return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("div", {
+		className: cn(stepperStepContainerVariants({ orientation }), className),
+		children: [/* @__PURE__ */ jsx("button", {
+			ref,
+			type: "button",
+			role: "tab",
+			"aria-selected": status === "active",
+			"aria-disabled": !isClickable,
+			"aria-current": status === "active" ? "step" : void 0,
+			"data-value": stepValue,
+			"data-status": status,
+			onClick: handleClick,
+			onKeyDown: handleKeyDown,
+			onFocus: focusProps.onFocus,
+			onBlur: focusProps.onBlur,
+			disabled: !isClickable,
+			className: cn(stepperIndicatorVariants({
+				size,
+				variant
+			}), !isClickable && "cursor-not-allowed opacity-60", isClickable && "cursor-pointer hover:scale-105", "min-w-[44px] min-h-[44px]"),
+			style: indicatorStyles,
+			children: renderIndicatorContent()
+		}), label && /* @__PURE__ */ jsxs("div", {
+			className: "flex flex-col items-center",
+			children: [/* @__PURE__ */ jsx("span", {
+				className: cn(stepperLabelVariants({
+					size,
+					orientation
+				})),
+				style: labelStyles,
+				children: label
+			}), description && /* @__PURE__ */ jsx("span", {
+				className: cn(stepperDescriptionVariants({
+					size,
+					orientation
+				})),
+				style: descriptionStyles,
+				children: description
+			})]
+		})]
+	}), !isLast && /* @__PURE__ */ jsx("div", {
+		className: cn(stepperConnectorVariants({ orientation })),
+		style: connectorStyles,
+		"aria-hidden": "true"
+	})] });
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex flex-col",
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: cn(stepperStepContainerVariants({ orientation }), className),
+			children: [/* @__PURE__ */ jsx("button", {
+				ref,
+				type: "button",
+				role: "tab",
+				"aria-selected": status === "active",
+				"aria-disabled": !isClickable,
+				"aria-current": status === "active" ? "step" : void 0,
+				"data-value": stepValue,
+				"data-status": status,
+				onClick: handleClick,
+				onKeyDown: handleKeyDown,
+				onFocus: focusProps.onFocus,
+				onBlur: focusProps.onBlur,
+				disabled: !isClickable,
+				className: cn(stepperIndicatorVariants({
+					size,
+					variant
+				}), !isClickable && "cursor-not-allowed opacity-60", isClickable && "cursor-pointer hover:scale-105", "min-w-[44px] min-h-[44px]"),
+				style: indicatorStyles,
+				children: renderIndicatorContent()
+			}), label && /* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col justify-center",
+				children: [/* @__PURE__ */ jsx("span", {
+					className: cn(stepperLabelVariants({
+						size,
+						orientation
+					})),
+					style: labelStyles,
+					children: label
+				}), description && /* @__PURE__ */ jsx("span", {
+					className: cn(stepperDescriptionVariants({
+						size,
+						orientation
+					})),
+					style: descriptionStyles,
+					children: description
+				})]
+			})]
+		}), !isLast && /* @__PURE__ */ jsx("div", {
+			className: cn(stepperConnectorVariants({ orientation })),
+			style: connectorStyles,
+			"aria-hidden": "true"
+		})]
+	});
+});
+StepperStep.displayName = "StepperStep";
+var StepperContent = ({ value, children, className }) => {
+	const { value: currentValue, orientation } = useStepperContext();
+	const isActive = currentValue === value;
+	if (!isActive) return null;
+	return /* @__PURE__ */ jsx("div", {
+		role: "tabpanel",
+		"aria-hidden": !isActive,
+		className: cn(stepperContentVariants({ orientation }), className),
+		children
+	});
+};
+const StepperGlass = {
+	Root: StepperRoot,
+	List: StepperList,
+	Step: StepperStep,
+	Content: StepperContent
+};
+function _extends$1() {
+	return _extends$1 = Object.assign ? Object.assign.bind() : function(n) {
+		for (var e = 1; e < arguments.length; e++) {
+			var t = arguments[e];
+			for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
+		}
+		return n;
+	}, _extends$1.apply(null, arguments);
+}
+function ownKeys$1(e, r) {
+	var t = Object.keys(e);
+	if (Object.getOwnPropertySymbols) {
+		var o = Object.getOwnPropertySymbols(e);
+		r && (o = o.filter(function(r$1) {
+			return Object.getOwnPropertyDescriptor(e, r$1).enumerable;
+		})), t.push.apply(t, o);
+	}
+	return t;
+}
+function _objectSpread$1(e) {
+	for (var r = 1; r < arguments.length; r++) {
+		var t = null != arguments[r] ? arguments[r] : {};
+		r % 2 ? ownKeys$1(Object(t), !0).forEach(function(r$1) {
+			_defineProperty$1(e, r$1, t[r$1]);
+		}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function(r$1) {
+			Object.defineProperty(e, r$1, Object.getOwnPropertyDescriptor(t, r$1));
+		});
+	}
+	return e;
+}
+function _defineProperty$1(e, r, t) {
+	return (r = _toPropertyKey$1(r)) in e ? Object.defineProperty(e, r, {
+		value: t,
+		enumerable: !0,
+		configurable: !0,
+		writable: !0
+	}) : e[r] = t, e;
+}
+function _toPropertyKey$1(t) {
+	var i = _toPrimitive$1(t, "string");
+	return "symbol" == typeof i ? i : i + "";
+}
+function _toPrimitive$1(t, r) {
+	if ("object" != typeof t || !t) return t;
+	var e = t[Symbol.toPrimitive];
+	if (void 0 !== e) {
+		var i = e.call(t, r || "default");
+		if ("object" != typeof i) return i;
+		throw new TypeError("@@toPrimitive must return a primitive value.");
+	}
+	return ("string" === r ? String : Number)(t);
+}
+var SIZE = 32;
+var defaultLegendContentDefaultProps = {
+	align: "center",
+	iconSize: 14,
+	inactiveColor: "#ccc",
+	layout: "horizontal",
+	verticalAlign: "middle"
+};
+function Icon(_ref) {
+	var { data, iconType, inactiveColor } = _ref;
+	var halfSize = SIZE / 2;
+	var sixthSize = SIZE / 6;
+	var thirdSize = SIZE / 3;
+	var color = data.inactive ? inactiveColor : data.color;
+	var preferredIcon = iconType !== null && iconType !== void 0 ? iconType : data.type;
+	if (preferredIcon === "none") return null;
+	if (preferredIcon === "plainline") {
+		var _data$payload;
+		return /* @__PURE__ */ React.createElement("line", {
+			strokeWidth: 4,
+			fill: "none",
+			stroke: color,
+			strokeDasharray: (_data$payload = data.payload) === null || _data$payload === void 0 ? void 0 : _data$payload.strokeDasharray,
+			x1: 0,
+			y1: halfSize,
+			x2: SIZE,
+			y2: halfSize,
+			className: "recharts-legend-icon"
+		});
+	}
+	if (preferredIcon === "line") return /* @__PURE__ */ React.createElement("path", {
+		strokeWidth: 4,
+		fill: "none",
+		stroke: color,
+		d: "M0,".concat(halfSize, "h").concat(thirdSize, "\n            A").concat(sixthSize, ",").concat(sixthSize, ",0,1,1,").concat(2 * thirdSize, ",").concat(halfSize, "\n            H").concat(SIZE, "M").concat(2 * thirdSize, ",").concat(halfSize, "\n            A").concat(sixthSize, ",").concat(sixthSize, ",0,1,1,").concat(thirdSize, ",").concat(halfSize),
+		className: "recharts-legend-icon"
+	});
+	if (preferredIcon === "rect") return /* @__PURE__ */ React.createElement("path", {
+		stroke: "none",
+		fill: color,
+		d: "M0,".concat(SIZE / 8, "h").concat(SIZE, "v").concat(SIZE * 3 / 4, "h").concat(-SIZE, "z"),
+		className: "recharts-legend-icon"
+	});
+	if (/* @__PURE__ */ React.isValidElement(data.legendIcon)) {
+		var iconProps = _objectSpread$1({}, data);
+		delete iconProps.legendIcon;
+		return /* @__PURE__ */ React.cloneElement(data.legendIcon, iconProps);
+	}
+	return /* @__PURE__ */ React.createElement(Symbols, {
+		fill: color,
+		cx: halfSize,
+		cy: halfSize,
+		size: SIZE,
+		sizeType: "diameter",
+		type: preferredIcon
+	});
+}
+function Items(props) {
+	var { payload, iconSize, layout, formatter, inactiveColor, iconType } = props;
+	var viewBox = {
+		x: 0,
+		y: 0,
+		width: SIZE,
+		height: SIZE
+	};
+	var itemStyle = {
+		display: layout === "horizontal" ? "inline-block" : "block",
+		marginRight: 10
+	};
+	var svgStyle = {
+		display: "inline-block",
+		verticalAlign: "middle",
+		marginRight: 4
+	};
+	return payload.map((entry, i) => {
+		var finalFormatter = entry.formatter || formatter;
+		var className = clsx({
+			"recharts-legend-item": true,
+			["legend-item-".concat(i)]: true,
+			inactive: entry.inactive
+		});
+		if (entry.type === "none") return null;
+		var color = entry.inactive ? inactiveColor : entry.color;
+		var finalValue = finalFormatter ? finalFormatter(entry.value, entry, i) : entry.value;
+		return /* @__PURE__ */ React.createElement("li", _extends$1({
+			className,
+			style: itemStyle,
+			key: "legend-item-".concat(i)
+		}, adaptEventsOfChild(props, entry, i)), /* @__PURE__ */ React.createElement(Surface, {
+			width: iconSize,
+			height: iconSize,
+			viewBox,
+			style: svgStyle,
+			"aria-label": "".concat(finalValue, " legend icon")
+		}, /* @__PURE__ */ React.createElement(Icon, {
+			data: entry,
+			iconType,
+			inactiveColor
+		})), /* @__PURE__ */ React.createElement("span", {
+			className: "recharts-legend-item-text",
+			style: { color }
+		}, finalValue));
+	});
+}
+var DefaultLegendContent = (outsideProps) => {
+	var props = resolveDefaultProps(outsideProps, defaultLegendContentDefaultProps);
+	var { payload, layout, align } = props;
+	if (!payload || !payload.length) return null;
+	var finalStyle = {
+		padding: 0,
+		margin: 0,
+		textAlign: layout === "horizontal" ? align : "left"
+	};
+	return /* @__PURE__ */ React.createElement("ul", {
+		className: "recharts-default-legend",
+		style: finalStyle
+	}, /* @__PURE__ */ React.createElement(Items, _extends$1({}, props, { payload })));
+};
+function useLegendPayload() {
+	return useAppSelector(selectLegendPayload);
+}
+var _excluded = ["contextPayload"];
+function _extends() {
+	return _extends = Object.assign ? Object.assign.bind() : function(n) {
+		for (var e = 1; e < arguments.length; e++) {
+			var t = arguments[e];
+			for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
+		}
+		return n;
+	}, _extends.apply(null, arguments);
+}
+function ownKeys(e, r) {
+	var t = Object.keys(e);
+	if (Object.getOwnPropertySymbols) {
+		var o = Object.getOwnPropertySymbols(e);
+		r && (o = o.filter(function(r$1) {
+			return Object.getOwnPropertyDescriptor(e, r$1).enumerable;
+		})), t.push.apply(t, o);
+	}
+	return t;
+}
+function _objectSpread(e) {
+	for (var r = 1; r < arguments.length; r++) {
+		var t = null != arguments[r] ? arguments[r] : {};
+		r % 2 ? ownKeys(Object(t), !0).forEach(function(r$1) {
+			_defineProperty(e, r$1, t[r$1]);
+		}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function(r$1) {
+			Object.defineProperty(e, r$1, Object.getOwnPropertyDescriptor(t, r$1));
+		});
+	}
+	return e;
+}
+function _defineProperty(e, r, t) {
+	return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
+		value: t,
+		enumerable: !0,
+		configurable: !0,
+		writable: !0
+	}) : e[r] = t, e;
+}
+function _toPropertyKey(t) {
+	var i = _toPrimitive(t, "string");
+	return "symbol" == typeof i ? i : i + "";
+}
+function _toPrimitive(t, r) {
+	if ("object" != typeof t || !t) return t;
+	var e = t[Symbol.toPrimitive];
+	if (void 0 !== e) {
+		var i = e.call(t, r || "default");
+		if ("object" != typeof i) return i;
+		throw new TypeError("@@toPrimitive must return a primitive value.");
+	}
+	return ("string" === r ? String : Number)(t);
+}
+function _objectWithoutProperties(e, t) {
+	if (null == e) return {};
+	var o, r, i = _objectWithoutPropertiesLoose(e, t);
+	if (Object.getOwnPropertySymbols) {
+		var n = Object.getOwnPropertySymbols(e);
+		for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]);
+	}
+	return i;
+}
+function _objectWithoutPropertiesLoose(r, e) {
+	if (null == r) return {};
+	var t = {};
+	for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
+		if (-1 !== e.indexOf(n)) continue;
+		t[n] = r[n];
+	}
+	return t;
+}
+function defaultUniqBy(entry) {
+	return entry.value;
+}
+function LegendContent(props) {
+	var { contextPayload } = props, otherProps = _objectWithoutProperties(props, _excluded);
+	var finalPayload = getUniqPayload(contextPayload, props.payloadUniqBy, defaultUniqBy);
+	var contentProps = _objectSpread(_objectSpread({}, otherProps), {}, { payload: finalPayload });
+	if (/* @__PURE__ */ React.isValidElement(props.content)) return /* @__PURE__ */ React.cloneElement(props.content, contentProps);
+	if (typeof props.content === "function") return /* @__PURE__ */ React.createElement(props.content, contentProps);
+	return /* @__PURE__ */ React.createElement(DefaultLegendContent, contentProps);
+}
+function getDefaultPosition(style, props, margin, chartWidth, chartHeight, box) {
+	var { layout, align, verticalAlign } = props;
+	var hPos, vPos;
+	if (!style || (style.left === void 0 || style.left === null) && (style.right === void 0 || style.right === null)) if (align === "center" && layout === "vertical") hPos = { left: ((chartWidth || 0) - box.width) / 2 };
+	else hPos = align === "right" ? { right: margin && margin.right || 0 } : { left: margin && margin.left || 0 };
+	if (!style || (style.top === void 0 || style.top === null) && (style.bottom === void 0 || style.bottom === null)) if (verticalAlign === "middle") vPos = { top: ((chartHeight || 0) - box.height) / 2 };
+	else vPos = verticalAlign === "bottom" ? { bottom: margin && margin.bottom || 0 } : { top: margin && margin.top || 0 };
+	return _objectSpread(_objectSpread({}, hPos), vPos);
+}
+function LegendSettingsDispatcher(props) {
+	var dispatch = useAppDispatch();
+	useEffect(() => {
+		dispatch(setLegendSettings(props));
+	}, [dispatch, props]);
+	return null;
+}
+function LegendSizeDispatcher(props) {
+	var dispatch = useAppDispatch();
+	useEffect(() => {
+		dispatch(setLegendSize(props));
+		return () => {
+			dispatch(setLegendSize({
+				width: 0,
+				height: 0
+			}));
+		};
+	}, [dispatch, props]);
+	return null;
+}
+function getWidthOrHeight(layout, height, width, maxWidth) {
+	if (layout === "vertical" && isNumber(height)) return { height };
+	if (layout === "horizontal") return { width: width || maxWidth };
+	return null;
+}
+var legendDefaultProps = {
+	align: "center",
+	iconSize: 14,
+	itemSorter: "value",
+	layout: "horizontal",
+	verticalAlign: "bottom"
+};
+function Legend(outsideProps) {
+	var props = resolveDefaultProps(outsideProps, legendDefaultProps);
+	var contextPayload = useLegendPayload();
+	var legendPortalFromContext = useLegendPortal();
+	var margin = useMargin();
+	var { width: widthFromProps, height: heightFromProps, wrapperStyle, portal: portalFromProps } = props;
+	var [lastBoundingBox, updateBoundingBox] = useElementOffset([contextPayload]);
+	var chartWidth = useChartWidth();
+	var chartHeight = useChartHeight();
+	if (chartWidth == null || chartHeight == null) return null;
+	var maxWidth = chartWidth - ((margin === null || margin === void 0 ? void 0 : margin.left) || 0) - ((margin === null || margin === void 0 ? void 0 : margin.right) || 0);
+	var widthOrHeight = getWidthOrHeight(props.layout, heightFromProps, widthFromProps, maxWidth);
+	var outerStyle = portalFromProps ? wrapperStyle : _objectSpread(_objectSpread({
+		position: "absolute",
+		width: (widthOrHeight === null || widthOrHeight === void 0 ? void 0 : widthOrHeight.width) || widthFromProps || "auto",
+		height: (widthOrHeight === null || widthOrHeight === void 0 ? void 0 : widthOrHeight.height) || heightFromProps || "auto"
+	}, getDefaultPosition(wrapperStyle, props, margin, chartWidth, chartHeight, lastBoundingBox)), wrapperStyle);
+	var legendPortal = portalFromProps !== null && portalFromProps !== void 0 ? portalFromProps : legendPortalFromContext;
+	if (legendPortal == null || contextPayload == null) return null;
+	return /* @__PURE__ */ createPortal(/* @__PURE__ */ React.createElement("div", {
+		className: "recharts-legend-wrapper",
+		style: outerStyle,
+		ref: updateBoundingBox
+	}, /* @__PURE__ */ React.createElement(LegendSettingsDispatcher, {
+		layout: props.layout,
+		align: props.align,
+		verticalAlign: props.verticalAlign,
+		itemSorter: props.itemSorter
+	}), !portalFromProps && /* @__PURE__ */ React.createElement(LegendSizeDispatcher, {
+		width: lastBoundingBox.width,
+		height: lastBoundingBox.height
+	}), /* @__PURE__ */ React.createElement(LegendContent, _extends({}, props, widthOrHeight, {
+		margin,
+		chartWidth,
+		chartHeight,
+		contextPayload
+	}))), legendPortal);
+}
+Legend.displayName = "Legend";
+var ChartContext = React.createContext(null);
+function useChart() {
+	const context = React.useContext(ChartContext);
+	if (!context) throw new Error("useChart must be used within a <ChartContainer />");
+	return context;
+}
+var ChartContainer = React.forwardRef(({ id, className, children, config, ...props }, ref) => {
+	const uniqueId = React.useId();
+	const chartId = `chart-${id || uniqueId.replace(/:/g, "")}`;
+	return /* @__PURE__ */ jsx(ChartContext.Provider, {
+		value: { config },
+		children: /* @__PURE__ */ jsxs("div", {
+			"data-chart": chartId,
+			ref,
+			className: cn("flex aspect-video justify-center text-xs [&_.recharts-cartesian-axis-tick_text]:fill-[var(--text-muted)] [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-[var(--glass-border)] [&_.recharts-curve.recharts-tooltip-cursor]:stroke-[var(--glass-border)] [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-none [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-[var(--glass-border)] [&_.recharts-radial-bar-background-sector]:fill-[var(--glass-frost-5)] [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-[var(--glass-frost-10)] [&_.recharts-reference-line_[stroke='#ccc']]:stroke-[var(--glass-border)] [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-sector]:outline-none [&_.recharts-surface]:outline-none", className),
+			...props,
+			children: [/* @__PURE__ */ jsx(ChartStyle, {
+				id: chartId,
+				config
+			}), /* @__PURE__ */ jsx(ResponsiveContainer, { children })]
+		})
+	});
+});
+ChartContainer.displayName = "ChartContainer";
+var ChartStyle = ({ id, config }) => {
+	const colorConfig = Object.entries(config).filter(([, itemConfig]) => itemConfig.color || itemConfig.theme);
+	if (!colorConfig.length) return null;
+	return /* @__PURE__ */ jsx("style", { dangerouslySetInnerHTML: { __html: `
+[data-chart="${id}"] {
+${colorConfig.map(([key, itemConfig]) => {
+		const color = itemConfig.color || itemConfig.theme?.light;
+		return color ? `  --color-${key}: ${color};` : null;
+	}).filter(Boolean).join("\n")}
+}
+
+[data-theme="glass"] [data-chart="${id}"],
+.dark [data-chart="${id}"] {
+${colorConfig.map(([key, itemConfig]) => {
+		const color = itemConfig.theme?.dark || itemConfig.color;
+		return color ? `  --color-${key}: ${color};` : null;
+	}).filter(Boolean).join("\n")}
+}
+` } });
+};
+var ChartTooltip = Tooltip;
+var ChartTooltipContent = React.forwardRef(({ active, payload, className, indicator = "dot", hideLabel = false, hideIndicator = false, label, labelFormatter, labelClassName, nameKey, labelKey, valueFormatter }, ref) => {
+	const { config } = useChart();
+	const tooltipLabel = React.useMemo(() => {
+		if (hideLabel || !payload?.length) return null;
+		const [item] = payload;
+		const itemConfig = getPayloadConfigFromPayload(config, item, `${labelKey || item?.dataKey || item?.name || "value"}`);
+		const value = !labelKey && typeof label === "string" ? config[label]?.label || label : itemConfig?.label;
+		if (labelFormatter && typeof label === "string") return /* @__PURE__ */ jsx("div", {
+			className: cn("font-medium", labelClassName),
+			children: labelFormatter(label, payload)
+		});
+		if (!value) return null;
+		return /* @__PURE__ */ jsx("div", {
+			className: cn("font-medium", labelClassName),
+			children: value
+		});
+	}, [
+		label,
+		labelFormatter,
+		payload,
+		hideLabel,
+		labelClassName,
+		config,
+		labelKey
+	]);
+	if (!active || !payload?.length) return null;
+	const nestLabel = payload.length === 1 && indicator !== "dot";
+	return /* @__PURE__ */ jsxs("div", {
+		ref,
+		className: cn("grid min-w-[8rem] items-start gap-1.5 rounded-lg border border-[var(--glass-border)] bg-[var(--glass-bg)] px-2.5 py-1.5 text-xs shadow-xl backdrop-blur-md", className),
+		children: [!nestLabel ? tooltipLabel : null, /* @__PURE__ */ jsx("div", {
+			className: "grid gap-1.5",
+			children: payload.map((item, index) => {
+				const itemConfig = getPayloadConfigFromPayload(config, item, `${nameKey || item.name || item.dataKey || "value"}`);
+				const indicatorColor = item.fill || item.color;
+				return /* @__PURE__ */ jsxs("div", {
+					className: cn("flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5 [&>svg]:text-[var(--text-muted)]", indicator === "dot" && "items-center"),
+					children: [itemConfig?.icon ? /* @__PURE__ */ jsx(itemConfig.icon, {}) : !hideIndicator && /* @__PURE__ */ jsx("div", {
+						className: cn("shrink-0 rounded-[2px] border-[--color-border] bg-[--color-bg]", {
+							"h-2.5 w-2.5": indicator === "dot",
+							"w-1": indicator === "line",
+							"w-0 border-[1.5px] border-dashed bg-transparent": indicator === "dashed",
+							"my-0.5": nestLabel && indicator === "dashed"
+						}),
+						style: {
+							"--color-bg": indicatorColor,
+							"--color-border": indicatorColor
+						}
+					}), /* @__PURE__ */ jsxs("div", {
+						className: cn("flex flex-1 justify-between leading-none", nestLabel ? "items-end" : "items-center"),
+						children: [/* @__PURE__ */ jsxs("div", {
+							className: "grid gap-1.5",
+							children: [nestLabel ? tooltipLabel : null, /* @__PURE__ */ jsx("span", {
+								className: "text-[var(--text-muted)]",
+								children: itemConfig?.label || item.name
+							})]
+						}), item.value !== void 0 && /* @__PURE__ */ jsx("span", {
+							className: "font-mono font-medium tabular-nums text-[var(--text-primary)]",
+							children: valueFormatter ? valueFormatter(item.value) : item.value.toLocaleString()
+						})]
+					})]
+				}, `${item.dataKey}-${index}`);
+			})
+		})]
+	});
+});
+ChartTooltipContent.displayName = "ChartTooltipContent";
+var ChartLegend = Legend;
+var ChartLegendContent = React.forwardRef(({ className, hideIcon = false, payload, verticalAlign = "bottom", nameKey }, ref) => {
+	const { config } = useChart();
+	if (!payload?.length) return null;
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		className: cn("flex items-center justify-center gap-4", verticalAlign === "top" ? "pb-3" : "pt-3", className),
+		children: payload.map((item) => {
+			const itemConfig = getPayloadConfigFromPayload(config, item, `${nameKey || item.dataKey || "value"}`);
+			return /* @__PURE__ */ jsxs("div", {
+				className: cn("flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3 [&>svg]:text-[var(--text-muted)]"),
+				children: [itemConfig?.icon && !hideIcon ? /* @__PURE__ */ jsx(itemConfig.icon, {}) : /* @__PURE__ */ jsx("div", {
+					className: "h-2 w-2 shrink-0 rounded-[2px]",
+					style: { backgroundColor: item.color }
+				}), itemConfig?.label]
+			}, item.value);
+		})
+	});
+});
+ChartLegendContent.displayName = "ChartLegendContent";
+function getPayloadConfigFromPayload(config, payload, key) {
+	if (typeof payload !== "object" || payload === null) return;
+	const payloadPayload = "payload" in payload && typeof payload.payload === "object" && payload.payload !== null ? payload.payload : void 0;
+	let configLabelKey = key;
+	if (key in config) return config[key];
+	if (payloadPayload && key in payloadPayload) configLabelKey = payloadPayload[key];
+	return configLabelKey in config ? config[configLabelKey] : config[key];
+}
 const dropdownAlign = cva("absolute mt-2 min-w-[160px] md:min-w-[200px] rounded-2xl py-1.5 md:py-2", {
 	variants: { align: {
 		left: "left-0",
@@ -51,6 +892,6 @@ const buttonVariants = cva("inline-flex items-center justify-center gap-2 whites
 		size: "default"
 	}
 });
-export { AICardGlass, AlertGlass, AvatarGlass, BadgeGlass, BaseProgressGlass, ButtonGlass, CareerStatsGlass, CareerStatsHeaderGlass, CheckboxGlass, CircularMetricGlass, CircularProgressGlass, ComboBoxGlass, ContributionMetricsGlass, DropdownGlass, ExpandableHeaderGlass, FlagAlertGlass, FlagsSectionGlass, FormFieldWrapper, GlassCard, HeaderBrandingGlass, HeaderNavGlass, IconButtonGlass, InputGlass, InteractiveCard, LanguageBarGlass, MetricCardGlass, MetricsGridGlass, ModalGlass, NotificationGlass, PopoverGlass, ProfileAvatarGlass, ProfileHeaderGlass, ProgressGlass, ProjectsListGlass, RainbowProgressGlass, RepositoryCardGlass, RepositoryHeaderGlass, RepositoryMetadataGlass, SearchBoxGlass, SegmentedControlGlass, SkeletonGlass, SliderGlass, SortDropdownGlass, StatItemGlass, StatusIndicatorGlass, THEMES, THEME_CONFIG, TabsGlass, ThemeProvider, ThemeToggleGlass, ToggleGlass, TooltipGlass, TouchTarget, TrustScoreCardGlass, TrustScoreDisplayGlass, UserInfoGlass, UserStatsLineGlass, YearCardGlass, alertVariants, avatarSizes, badgeVariants, buttonGlassVariants, cardIntensity, cn, dropdownAlign, getNextTheme, getThemeConfig, inputVariants, modalSizes, notificationVariants, progressSizes, alertVariants$1 as shadcnAlertVariants, badgeVariants$1 as shadcnBadgeVariants, buttonVariants as shadcnButtonVariants, skeletonVariants, statusSizes, toggleSizes, tooltipPositions, useFocus, useHover, useResponsive, useTheme, useWallpaperTint };
+export { AICardGlass, AlertGlass, AvatarGlass, BadgeGlass, Bar, BarChart, BaseProgressGlass, ButtonGlass, CareerStatsGlass, CareerStatsHeaderGlass, Cell, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, CheckboxGlass, CircularMetricGlass, CircularProgressGlass, ComboBoxGlass, ContributionMetricsGlass, DropdownGlass, ExpandableHeaderGlass, FlagAlertGlass, FlagsSectionGlass, FormFieldWrapper, GlassCard, HeaderBrandingGlass, HeaderNavGlass, IconButtonGlass, InputGlass, InsightCardGlass, InteractiveCard, LanguageBarGlass, MetricCardGlass, MetricsGridGlass, ModalGlass, NotificationGlass, PopoverGlass, ProfileAvatarGlass, ProfileHeaderGlass, ProgressGlass, ProjectsListGlass, RainbowProgressGlass, RepositoryCardGlass, RepositoryHeaderGlass, RepositoryMetadataGlass, ResponsiveContainer, SearchBoxGlass, SegmentedControlGlass, SkeletonGlass, SliderGlass, SortDropdownGlass, SparklineGlass, StatItemGlass, StatusIndicatorGlass, StepperGlass, THEMES, THEME_CONFIG, TabsGlass, ThemeProvider, ThemeToggleGlass, ToggleGlass, TooltipGlass, TouchTarget, TrustScoreCardGlass, TrustScoreDisplayGlass, UserInfoGlass, UserStatsLineGlass, YearCardGlass, alertVariants, avatarSizes, badgeVariants, buttonGlassVariants, cardIntensity, cn, dropdownAlign, getNextTheme, getThemeConfig, inputVariants, insightCardVariants, insightVariantConfig, modalSizes, notificationVariants, progressSizes, alertVariants$1 as shadcnAlertVariants, badgeVariants$1 as shadcnBadgeVariants, buttonVariants as shadcnButtonVariants, skeletonVariants, sparklineBarVariants, sparklineContainerVariants, statusSizes, stepperConnectorVariants, stepperContentVariants, stepperDescriptionVariants, stepperIndicatorVariants, stepperLabelVariants, stepperListVariants, stepperRootVariants, stepperStepContainerVariants, toggleSizes, tooltipPositions, useChart, useFocus, useHover, useResponsive, useTheme, useWallpaperTint };
 
 //# sourceMappingURL=index.js.map