@rudra-studio/rudra-charts 1.0.1

package/components/VerticalBarChart/index.js

@@ -0,0 +1,97 @@
+import { useEffect as e, useRef as t, useState as n } from "react";
+import * as r from "d3";
+import { jsx as i } from "react/jsx-runtime";
+//#region src/components/VerticalBarChart/index.tsx
+var a = ({ data: a = [
+	{
+		id: "1",
+		category: "Jan",
+		value: 420
+	},
+	{
+		id: "2",
+		category: "Feb",
+		value: 580
+	},
+	{
+		id: "3",
+		category: "Mar",
+		value: 310
+	},
+	{
+		id: "4",
+		category: "Apr",
+		value: 850
+	},
+	{
+		id: "5",
+		category: "May",
+		value: 650
+	},
+	{
+		id: "6",
+		category: "Jun",
+		value: 940
+	}
+], themeColors: o = [
+	"#3b82f6",
+	"#10b981",
+	"#f59e0b",
+	"#ef4444",
+	"#8b5cf6",
+	"#06b6d4"
+], showValues: s = !0, marginTop: c = 40, marginBottom: l = 40, marginLeft: u = 50, marginRight: d = 20, className: f = "" }) => {
+	let p = t(null), m = t(null), [h, g] = n({
+		width: 0,
+		height: 350
+	});
+	return e(() => {
+		let e = p.current;
+		if (!e) return;
+		let t = new ResizeObserver((e) => {
+			e[0] && g({
+				width: e[0].contentRect.width,
+				height: e[0].contentRect.height || 350
+			});
+		});
+		return t.observe(e), () => t.unobserve(e);
+	}, []), e(() => {
+		if (!m.current || h.width === 0 || a.length === 0) return;
+		let { width: e, height: t } = h, n = r.select(m.current), i = a.map((e) => e.category), f = r.max(a, (e) => e.value) || 100, p = r.scaleBand().domain(i).range([u, e - d]).padding(.25), g = r.scaleLinear().domain([0, f * 1.1]).nice().range([t - l, c]), _ = r.scaleOrdinal().domain(i).range(o);
+		n.select(".x-axis").empty() && (n.append("g").attr("class", "axis x-axis"), n.append("g").attr("class", "axis y-axis")), n.select(".x-axis").attr("transform", `translate(0,${t - l})`).transition().duration(500).call(r.axisBottom(p).tickSizeOuter(0)).attr("font-size", "12px").attr("font-family", "ui-sans-serif, system-ui").attr("color", "#64748b").call((e) => e.select(".domain").remove()), n.select(".y-axis").attr("transform", `translate(${u},0)`).transition().duration(500).call(r.axisLeft(g).ticks(5).tickSize(-(e - u - d))).attr("font-size", "12px").attr("font-family", "ui-sans-serif, system-ui").attr("color", "#64748b").call((e) => e.select(".domain").remove()).call((e) => e.selectAll(".tick line").attr("stroke-opacity", .1).attr("stroke-dasharray", "4,4"));
+		let v = n.select(".bars-group");
+		v.empty() && (v = n.append("g").attr("class", "bars-group"));
+		let y = v.selectAll(".bar").data(a, (e) => e.id);
+		y.exit().transition().duration(300).attr("y", g(0)).attr("height", 0).remove();
+		let b = y.enter().append("rect").attr("class", "bar").attr("x", (e) => p(e.category) || 0).attr("width", p.bandwidth()).attr("y", g(0)).attr("height", 0).attr("fill", (e) => _(e.category)).attr("rx", 4).attr("ry", 4).style("cursor", "pointer");
+		b.transition().duration(700).delay((e, t) => t * 50).ease(r.easeCubicOut).attr("y", (e) => g(e.value)).attr("height", (e) => g(0) - g(e.value)), y.transition().duration(750).ease(r.easeCubicOut).attr("x", (e) => p(e.category) || 0).attr("width", p.bandwidth()).attr("y", (e) => g(e.value)).attr("height", (e) => g(0) - g(e.value)).attr("fill", (e) => _(e.category)), b.merge(y).on("mouseenter", function() {
+			v.selectAll(".bar").transition().duration(200).attr("opacity", .4), r.select(this).transition().duration(200).attr("opacity", 1).attr("filter", "brightness(1.1)");
+		}).on("mouseleave", function() {
+			v.selectAll(".bar").transition().duration(200).attr("opacity", 1).attr("filter", "none");
+		});
+		let x = n.select(".labels-group");
+		x.empty() && (x = n.append("g").attr("class", "labels-group"));
+		let S = x.selectAll(".value-label").data(s ? a : [], (e) => e.id);
+		S.exit().transition().duration(300).attr("y", g(0)).style("opacity", 0).remove(), S.enter().append("text").attr("class", "value-label").attr("x", (e) => (p(e.category) || 0) + p.bandwidth() / 2).attr("y", g(0)).attr("text-anchor", "middle").attr("font-size", "12px").attr("font-weight", "600").attr("font-family", "ui-sans-serif, system-ui").attr("fill", "#475569").style("opacity", 0).style("pointer-events", "none").text((e) => e.value.toLocaleString()).transition().duration(700).delay((e, t) => t * 50).ease(r.easeCubicOut).attr("y", (e) => g(e.value) - 8).style("opacity", 1), S.transition().duration(750).ease(r.easeCubicOut).attr("x", (e) => (p(e.category) || 0) + p.bandwidth() / 2).attr("y", (e) => g(e.value) - 8).text((e) => e.value.toLocaleString());
+	}, [
+		a,
+		h,
+		o,
+		s,
+		c,
+		l,
+		u,
+		d
+	]), /* @__PURE__ */ i("div", {
+		ref: p,
+		className: `w-full min-h-[350px] h-full relative ${f}`,
+		children: /* @__PURE__ */ i("svg", {
+			ref: m,
+			width: "100%",
+			height: "100%",
+			className: "block absolute inset-0 overflow-visible"
+		})
+	});
+};
+//#endregion
+export { a as default };

package/components/WaterfallChart/index.d.ts

@@ -0,0 +1,26 @@
+import { default as React } from 'react';
+export interface WaterfallDataPoint {
+    id: string | number;
+    label: string;
+    value: number;
+    isTotal?: boolean;
+}
+export interface AnimatedWaterfallChartProps {
+    /** The sequence of positive and negative changes. */
+    data?: WaterfallDataPoint[];
+    /** Color for positive values (default: Emerald Green) */
+    colorPositive?: string;
+    /** Color for negative values (default: Red) */
+    colorNegative?: string;
+    /** Color for total/anchor columns (default: Blue) */
+    colorTotal?: string;
+    /** Draw thin connector lines between the steps */
+    showConnectorLines?: boolean;
+    marginTop?: number;
+    marginBottom?: number;
+    marginLeft?: number;
+    marginRight?: number;
+    className?: string;
+}
+export declare const AnimatedWaterfallChart: React.FC<AnimatedWaterfallChartProps>;
+export default AnimatedWaterfallChart;

package/components/WaterfallChart/index.js

@@ -0,0 +1,147 @@
+import { useEffect as e, useRef as t, useState as n } from "react";
+import * as r from "d3";
+import { jsx as i } from "react/jsx-runtime";
+//#region src/components/WaterfallChart/index.tsx
+var a = ({ data: a = [
+	{
+		id: 1,
+		label: "Gross Revenue",
+		value: 125e3,
+		isTotal: !0
+	},
+	{
+		id: 2,
+		label: "Cost of Goods",
+		value: -45e3
+	},
+	{
+		id: 3,
+		label: "Gross Margin",
+		value: 0,
+		isTotal: !0
+	},
+	{
+		id: 4,
+		label: "Marketing",
+		value: -15e3
+	},
+	{
+		id: 5,
+		label: "Sales",
+		value: -22e3
+	},
+	{
+		id: 6,
+		label: "Investments",
+		value: 8e3
+	},
+	{
+		id: 7,
+		label: "Taxes",
+		value: -9e3
+	},
+	{
+		id: 8,
+		label: "Net Profit",
+		value: 0,
+		isTotal: !0
+	}
+], colorPositive: o = "#10b981", colorNegative: s = "#ef4444", colorTotal: c = "#3b82f6", showConnectorLines: l = !0, marginTop: u = 40, marginBottom: d = 40, marginLeft: f = 60, marginRight: p = 20, className: m = "" }) => {
+	let h = t(null), g = t(null), [_, v] = n({
+		width: 0,
+		height: 350
+	});
+	return e(() => {
+		let e = h.current;
+		if (!e) return;
+		let t = new ResizeObserver((e) => {
+			e[0] && v({
+				width: e[0].contentRect.width,
+				height: e[0].contentRect.height || 350
+			});
+		});
+		return t.observe(e), () => t.unobserve(e);
+	}, []), e(() => {
+		if (!g.current || _.width === 0 || a.length === 0) return;
+		let { width: e, height: t } = _, n = r.select(g.current), i = 0, m = a.map((e) => {
+			if (e.isTotal) {
+				let t = e.value !== 0 && i === 0 ? e.value : i;
+				return i = t, {
+					...e,
+					start: 0,
+					end: t,
+					color: c,
+					displayValue: t
+				};
+			} else {
+				let t = i;
+				i += e.value;
+				let n = i;
+				return {
+					...e,
+					start: t,
+					end: n,
+					color: e.value >= 0 ? o : s,
+					displayValue: e.value
+				};
+			}
+		}), h = r.scaleBand().domain(m.map((e) => e.label)).range([f, e - p]).padding(.2), v = Math.min(0, r.min(m, (e) => Math.min(e.start, e.end)) || 0), y = Math.max(0, r.max(m, (e) => Math.max(e.start, e.end)) || 0), b = r.scaleLinear().domain([v, y * 1.1]).nice().range([t - d, u]);
+		n.select(".x-axis").empty() && (n.append("g").attr("class", "axis x-axis"), n.append("g").attr("class", "axis y-axis"));
+		let x = b(0);
+		n.select(".x-axis").attr("transform", `translate(0,${t - d})`).transition().duration(500).call(r.axisBottom(h).tickSizeOuter(0)).attr("font-size", "11px").attr("font-family", "ui-sans-serif, system-ui").attr("color", "#64748b").call((e) => e.select(".domain").remove());
+		let S = n.select(".zero-line");
+		if (S.empty() && (S = n.append("line").attr("class", "zero-line")), S.transition().duration(500).attr("x1", f).attr("x2", e - p).attr("y1", x).attr("y2", x).attr("stroke", "#94a3b8").attr("stroke-width", 1.5), n.select(".y-axis").attr("transform", `translate(${f},0)`).transition().duration(500).call(r.axisLeft(b).ticks(6).tickFormat(r.format("~s")).tickSize(-(e - f - p))).attr("font-size", "12px").attr("font-family", "ui-sans-serif, system-ui").attr("color", "#64748b").call((e) => e.select(".domain").remove()).call((e) => e.selectAll(".tick line").attr("stroke-opacity", .1).attr("stroke-dasharray", "4,4")), l) {
+			let e = n.select(".connectors-group");
+			e.empty() && (e = n.append("g").attr("class", "connectors-group"));
+			let t = m.slice(0, -1).map((e, t) => ({
+				id: e.id,
+				y: b(e.end),
+				x1: (h(e.label) || 0) + h.bandwidth() / 2,
+				x2: (h(m[t + 1].label) || 0) + h.bandwidth() / 2
+			})), r = e.selectAll(".connector").data(t, (e) => e.id);
+			r.exit().remove(), r.enter().append("line").attr("class", "connector").attr("stroke", "#cbd5e1").attr("stroke-width", 1.5).attr("stroke-dasharray", "2,2").merge(r).transition().duration(750).attr("x1", (e) => e.x1).attr("x2", (e) => e.x2).attr("y1", (e) => e.y).attr("y2", (e) => e.y);
+		}
+		let C = n.select(".bars-group");
+		C.empty() && (C = n.append("g").attr("class", "bars-group"));
+		let w = C.selectAll(".bar").data(m, (e) => e.id);
+		w.exit().transition().duration(300).attr("height", 0).remove();
+		let T = w.enter().append("rect").attr("class", "bar").attr("x", (e) => h(e.label) || 0).attr("width", h.bandwidth()).attr("y", (e) => b(e.start)).attr("height", 0).attr("fill", (e) => e.color).attr("rx", 2).style("cursor", "pointer");
+		T.transition().duration(500).delay((e, t) => t * 150).ease(r.easeCubicOut).attr("y", (e) => Math.min(b(e.start), b(e.end))).attr("height", (e) => Math.abs(b(e.start) - b(e.end))), w.transition().duration(750).ease(r.easeCubicOut).attr("x", (e) => h(e.label) || 0).attr("width", h.bandwidth()).attr("y", (e) => Math.min(b(e.start), b(e.end))).attr("height", (e) => Math.abs(b(e.start) - b(e.end))).attr("fill", (e) => e.color);
+		let E = n.select(".labels-group");
+		E.empty() && (E = n.append("g").attr("class", "labels-group"));
+		let D = E.selectAll(".value-label").data(m, (e) => e.id);
+		D.exit().remove(), D.enter().append("text").attr("class", "value-label").attr("x", (e) => (h(e.label) || 0) + h.bandwidth() / 2).attr("y", (e) => b(e.start)).attr("text-anchor", "middle").attr("font-size", "11px").attr("font-weight", "600").attr("font-family", "ui-sans-serif, system-ui").attr("fill", (e) => e.color).style("opacity", 0).text((e) => (e.displayValue > 0 && !e.isTotal ? "+" : "") + r.format("~s")(e.displayValue)).transition().duration(500).delay((e, t) => t * 150 + 200).attr("y", (e) => {
+			let t = Math.min(b(e.start), b(e.end));
+			return e.end < e.start ? t + Math.abs(b(e.start) - b(e.end)) + 14 : t - 6;
+		}).style("opacity", 1), D.transition().duration(750).attr("x", (e) => (h(e.label) || 0) + h.bandwidth() / 2).attr("y", (e) => {
+			let t = Math.min(b(e.start), b(e.end));
+			return e.end < e.start ? t + Math.abs(b(e.start) - b(e.end)) + 14 : t - 6;
+		}).text((e) => (e.displayValue > 0 && !e.isTotal ? "+" : "") + r.format("~s")(e.displayValue)), T.merge(w).on("mouseenter", function() {
+			C.selectAll(".bar").transition().duration(200).attr("opacity", .4), r.select(this).transition().duration(200).attr("opacity", 1).attr("filter", "brightness(1.1)");
+		}).on("mouseleave", function() {
+			C.selectAll(".bar").transition().duration(200).attr("opacity", 1).attr("filter", "none");
+		});
+	}, [
+		a,
+		_,
+		o,
+		s,
+		c,
+		l,
+		u,
+		d,
+		f,
+		p
+	]), /* @__PURE__ */ i("div", {
+		ref: h,
+		className: `w-full min-h-[350px] h-full relative ${m}`,
+		children: /* @__PURE__ */ i("svg", {
+			ref: g,
+			width: "100%",
+			height: "100%",
+			className: "block absolute inset-0 overflow-visible"
+		})
+	});
+};
+//#endregion
+export { a as default };

package/index.d.ts

@@ -0,0 +1,38 @@
+export type { AnimatedLineChartProps, LineDataPoint, LineSeries } from './components/AnimatedLineChart';
+export { default as AnimatedLineChart } from './components/AnimatedLineChart';
+export type { AnimatedBubbleChartProps, BubbleDataPoint } from './components/BubbleChart';
+export { default as AnimatedBubbleChart } from './components/BubbleChart';
+export type { AnimatedCandlestickChartProps, CandlestickDataPoint } from './components/CandleStickChart';
+export { default as AnimatedCandlestickChart } from './components/CandleStickChart';
+export type { AnimatedDonutChartProps, PieDataPoint } from './components/DonutChart';
+export { default as AnimatedDonutChart } from './components/DonutChart';
+export type { AnimatedFunnelChartProps, FunnelDataPoint } from './components/FunnelChart';
+export { default as AnimatedFunnelChart } from './components/FunnelChart';
+export type { AnimatedGaugeChartProps, GaugeZone } from './components/GaugeChart';
+export { default as AnimatedGaugeChart } from './components/GaugeChart';
+export type { AnimatedHeatmapProps, HeatmapDataPoint } from './components/HeatMap';
+export { default as AnimatedHeatmap } from './components/HeatMap';
+export type { AnimatedHistogramProps, HistogramDataPoint } from './components/Histogram';
+export { default as AnimatedHistogram } from './components/Histogram';
+export type { AnimatedHorizontalBarChartProps, HorizontalChartData } from './components/HorizontalBarChart';
+export { default as AnimatedHorizontalBarChart } from './components/HorizontalBarChart';
+export type { AnimatedHundredPercentBarChartProps, HundredPercentDataPoint } from './components/HundredPercentBarChart';
+export { default as AnimatedHundredPercentBarChart } from './components/HundredPercentBarChart';
+export type { AnimatedMultiLineChartProps, MultiLineDataPoint } from './components/MultiLineChart';
+export { default as AnimatedMultiLineChart } from './components/MultiLineChart';
+export type { AnimatedWorkflowChartProps, WorkflowLink, WorkflowNode, WorkflowStatus } from './components/PipelineChart';
+export { default as AnimatedWorkflowChart } from './components/PipelineChart';
+export type { AnimatedScatterPlotProps, ScatterDataPoint } from './components/ScatterPlot';
+export { default as AnimatedScatterPlot } from './components/ScatterPlot';
+export type { AnimatedRadarChartProps, RadarAxis, RadarDataPoint } from './components/SpiderChart';
+export { default as AnimatedRadarChart } from './components/SpiderChart';
+export type { AnimatedStackedAreaChartProps, StackedAreaDataPoint } from './components/StackedArea';
+export { default as AnimatedStackedAreaChart } from './components/StackedArea';
+export type { AnimatedStackedBarChartProps, StackedBarDataPoint } from './components/StackedBarChart';
+export { default as AnimatedStackedBarChart } from './components/StackedBarChart';
+export type { AnimatedTreemapProps, TreemapDataNode } from './components/TreeMap';
+export { default as AnimatedTreemap } from './components/TreeMap';
+export type { AnimatedVerticalBarChartProps, ColumnDataPoint } from './components/VerticalBarChart';
+export { default as AnimatedVerticalBarChart } from './components/VerticalBarChart';
+export type { AnimatedWaterfallChartProps, WaterfallDataPoint } from './components/WaterfallChart';
+export { default as AnimatedWaterfallChart } from './components/WaterfallChart';

package/index.js

@@ -0,0 +1,23 @@
+/* empty css       */
+import e from "./components/AnimatedLineChart/index.js";
+import t from "./components/BubbleChart/index.js";
+import n from "./components/CandleStickChart/index.js";
+import r from "./components/DonutChart/index.js";
+import i from "./components/FunnelChart/index.js";
+import a from "./components/GaugeChart/index.js";
+import o from "./components/HeatMap/index.js";
+import s from "./components/Histogram/index.js";
+import c from "./components/HorizontalBarChart/index.js";
+import l from "./components/HundredPercentBarChart/index.js";
+import u from "./components/MultiLineChart/index.js";
+import d from "./components/PipelineChart/index.js";
+import f from "./components/ScatterPlot/index.js";
+import p from "./components/SpiderChart/index.js";
+import m from "./components/StackedArea/index.js";
+import h from "./components/StackedBarChart/index.js";
+import g from "./components/TreeMap/index.js";
+import _ from "./components/VerticalBarChart/index.js";
+import v from "./components/WaterfallChart/index.js";
+export { t as AnimatedBubbleChart, n as AnimatedCandlestickChart, r as AnimatedDonutChart, i as AnimatedFunnelChart, a as AnimatedGaugeChart, o as AnimatedHeatmap, s as AnimatedHistogram, c as AnimatedHorizontalBarChart, l as AnimatedHundredPercentBarChart, e as AnimatedLineChart, u as AnimatedMultiLineChart, p as AnimatedRadarChart, f as AnimatedScatterPlot, m as AnimatedStackedAreaChart, h as AnimatedStackedBarChart, g as AnimatedTreemap, _ as AnimatedVerticalBarChart, v as AnimatedWaterfallChart, d as AnimatedWorkflowChart };
+
+try{if(typeof document!=="undefined"){const e=document.createElement("style");e.textContent="*,:before,:after{box-sizing:border-box;border:0 solid #e5e7eb}:before,:after{--tw-content:\"\"}html,:host{-webkit-text-size-adjust:100%;tab-size:4;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}body{line-height:inherit;margin:0}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-feature-settings:normal;font-variation-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-feature-settings:inherit;font-variation-settings:inherit;font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:#0000;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{margin:0;padding:0;list-style:none}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder{opacity:1;color:#9ca3af}textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:before,:after,::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.container{width:100%}@media (width>=640px){.container{max-width:640px}}@media (width>=768px){.container{max-width:768px}}@media (width>=1024px){.container{max-width:1024px}}@media (width>=1280px){.container{max-width:1280px}}@media (width>=1536px){.container{max-width:1536px}}.visible{visibility:visible}.invisible{visibility:hidden}.absolute{position:absolute}.relative{position:relative}.inset-0{inset:0}.block{display:block}.grid{display:grid}.hidden{display:none}.h-full{height:100%}.min-h-\\[300px\\]{min-height:300px}.min-h-\\[350px\\]{min-height:350px}.min-h-\\[400px\\]{min-height:400px}.w-full{width:100%}.transform{transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.resize{resize:both}.overflow-hidden{overflow:hidden}.overflow-visible{overflow:visible}.rounded{border-radius:.25rem}.rounded-lg{border-radius:.5rem}.border{border-width:1px}.border-slate-200{--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.uppercase{text-transform:uppercase}.ring{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow,0 0 #0000)}.drop-shadow{--tw-drop-shadow:drop-shadow(0 1px 2px #0000001a) drop-shadow(0 1px 1px #0000000f);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter,backdrop-filter;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}";const target = window.__RUDRA_SHADOW_ROOT__ || document.head; target.appendChild(e);}}catch(err){}

package/package.json

@@ -0,0 +1,46 @@
+{
+  "dependencies": {
+    "@react-three/fiber": "9.6.1",
+    "d3": "7",
+    "gsap": "3.12.2",
+    "lucide-react": "^1.8.0",
+    "motion": "12.0.0",
+    "tailwindcss": "3.4.4",
+    "three": "0.184.0"
+  },
+  "devDependencies": {
+    "autoprefixer": "^10.4.0",
+    "postcss": "^8.4.0",
+    "sass": "^1.72.0",
+    "tailwindcss": "^3.4.0"
+  },
+  "exports": {
+    ".": {
+      "import": "./index.js",
+      "require": "./index.js",
+      "types": "./index.d.ts"
+    },
+    "./*": {
+      "import": "./*.js",
+      "require": "./*.js",
+      "types": "./*.d.ts"
+    }
+  },
+  "jsdelivr": "./index.umd.js",
+  "main": "./index.js",
+  "name": "@rudra-studio/rudra-charts",
+  "peerDependencies": {
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "tailwindcss": ">=3.0.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "test": "echo 'Skipping unit tests for now...' && exit 0"
+  },
+  "types": "./index.d.ts",
+  "unpkg": "./index.umd.js",
+  "version": "1.0.1"
+}