@rudra-studio/rudra-layout 1.0.12 → 1.0.14

package/components/Box/index.d.ts

@@ -0,0 +1,16 @@
+import { default as React } from 'react';
+export interface BoxProps extends React.HTMLAttributes<HTMLDivElement> {
+    children?: React.ReactNode;
+    direction?: 'row' | 'col';
+    horizontalAlign?: 'start' | 'center' | 'end' | 'between' | 'stretch';
+    verticalAlign?: 'start' | 'center' | 'end' | 'between' | 'stretch';
+    gap?: 'none' | 'sm' | 'md' | 'lg' | 'xl';
+    wrap?: boolean;
+    customAttributes?: {
+        name: string;
+        value: string;
+    }[];
+    className?: string;
+}
+export declare const Box: React.FC<BoxProps>;
+export default Box;

package/components/Box/index.js

@@ -0,0 +1,42 @@
+import "react";
+import { jsx as e } from "react/jsx-runtime";
+//#region src/components/Box/index.tsx
+var t = ({ children: t, direction: n = "row", horizontalAlign: r = "start", verticalAlign: i = "stretch", gap: a = "none", wrap: o = !1, customAttributes: s = [], className: c = "", ...l }) => {
+	let u = {
+		none: "gap-0",
+		sm: "gap-2",
+		md: "gap-4",
+		lg: "gap-6",
+		xl: "gap-8"
+	}, d = "", f = "", p = {
+		start: "justify-start",
+		center: "justify-center",
+		end: "justify-end",
+		between: "justify-between",
+		stretch: "justify-stretch"
+	}, m = {
+		start: "items-start",
+		center: "items-center",
+		end: "items-end",
+		between: "items-stretch",
+		stretch: "items-stretch"
+	};
+	n === "row" ? (d = p[r] || "justify-start", f = m[i] || "items-stretch") : (d = p[i] || "justify-start", f = m[r] || "items-stretch");
+	let h = s?.reduce((e, t) => (t && t.name && t.name.trim() !== "" && (e[t.name.trim()] = t.value), e), {});
+	return /* @__PURE__ */ e("div", {
+		className: `
+        flex 
+        ${n === "row" ? "flex-row" : "flex-col"} 
+        ${o ? "flex-wrap" : "flex-nowrap"} 
+        ${d} 
+        ${f} 
+        ${u[a]} 
+        ${c}
+      `,
+		...h,
+		...l,
+		children: t
+	});
+};
+//#endregion
+export { t as default };

package/components/Carousel/index.d.ts

@@ -0,0 +1,10 @@
+import { default as React } from 'react';
+export interface RudraCarouselProps {
+    children: React.ReactNode[];
+    variant?: 'inline-arrows' | 'bottom-controls';
+    itemsPerView?: 'one' | 'multiple' | 'fractional';
+    gap?: 'none' | 'sm' | 'md' | 'lg';
+    className?: string;
+}
+declare const RudraCarousel: React.FC<RudraCarouselProps>;
+export default RudraCarousel;

package/components/Carousel/index.js

@@ -0,0 +1,100 @@
+import e, { useEffect as t, useRef as n, useState as r } from "react";
+import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
+import { ChevronLeft as s, ChevronRight as c } from "lucide-react";
+//#region src/components/Carousel/index.tsx
+var l = ({ children: l, variant: u = "inline-arrows", itemsPerView: d = "one", gap: f = "md", className: p }) => {
+	let m = n(null), [h, g] = r(!0), [_, v] = r(!1), [y, b] = r(0), x = e.Children.count(l), S = () => {
+		switch (d) {
+			case "one": return "w-full";
+			case "multiple": return "w-full sm:w-[calc(50%-1rem)] md:w-[calc(33.333%-1rem)] lg:w-[calc(25%-1rem)]";
+			case "fractional": return "w-[85%] sm:w-[38%] md:w-[28%] lg:w-[21%]";
+			default: return "w-full";
+		}
+	}, C = () => {
+		switch (f) {
+			case "none": return "gap-0";
+			case "sm": return "gap-2";
+			case "lg": return "gap-8";
+			default: return "gap-4";
+		}
+	}, w = () => {
+		if (!m.current) return;
+		let { scrollLeft: e, scrollWidth: t, clientWidth: n } = m.current;
+		g(e <= 10), v(Math.ceil(e + n) >= t - 10);
+		let r = t - n;
+		if (r > 0) {
+			let t = e / r;
+			b(Math.round(t * (x - 1)));
+		} else b(0);
+	};
+	t(() => {
+		w();
+	}, [l, d]);
+	let T = (e) => {
+		if (!m.current) return;
+		let t = m.current.clientWidth * .8;
+		m.current.scrollBy({
+			left: e === "left" ? -t : t,
+			behavior: "smooth"
+		});
+	}, E = (e) => {
+		if (!m.current) return;
+		let { scrollWidth: t, clientWidth: n } = m.current, r = (t - n) * (e / (x - 1 || 1));
+		m.current.scrollTo({
+			left: r,
+			behavior: "smooth"
+		});
+	};
+	return !l || x === 0 ? null : /* @__PURE__ */ o("div", {
+		className: `relative w-full flex flex-col group ${p}`,
+		children: [
+			/* @__PURE__ */ a("div", {
+				ref: m,
+				onScroll: w,
+				className: `flex ${C()} overflow-x-auto snap-x snap-mandatory [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none] relative z-10 py-4`,
+				children: e.Children.map(l, (e, t) => /* @__PURE__ */ a("div", {
+					className: `shrink-0 snap-center sm:snap-start transition-transform ${S()}`,
+					children: e
+				}, t))
+			}),
+			u === "inline-arrows" && /* @__PURE__ */ o(i, { children: [/* @__PURE__ */ a("button", {
+				onClick: () => T("left"),
+				disabled: h,
+				className: "absolute left-0 sm:-left-4 top-1/2 -translate-y-1/2 z-20 w-10 h-10 bg-white border border-slate-200 shadow-lg rounded-full flex items-center justify-center text-slate-600 transition-all duration-300 hover:bg-slate-50 hover:scale-110 disabled:opacity-0 disabled:pointer-events-none",
+				children: /* @__PURE__ */ a(s, { size: 20 })
+			}), /* @__PURE__ */ a("button", {
+				onClick: () => T("right"),
+				disabled: _,
+				className: "absolute right-0 sm:-right-4 top-1/2 -translate-y-1/2 z-20 w-10 h-10 bg-white border border-slate-200 shadow-lg rounded-full flex items-center justify-center text-slate-600 transition-all duration-300 hover:bg-slate-50 hover:scale-110 disabled:opacity-0 disabled:pointer-events-none",
+				children: /* @__PURE__ */ a(c, { size: 20 })
+			})] }),
+			u === "bottom-controls" && /* @__PURE__ */ o("div", {
+				className: "flex items-center justify-between w-full mt-4 px-2",
+				children: [
+					/* @__PURE__ */ a("button", {
+						onClick: () => T("left"),
+						disabled: h,
+						className: "w-8 h-8 flex items-center justify-center text-slate-400 hover:text-blue-600 hover:bg-blue-50 rounded-full transition-colors disabled:opacity-30 disabled:pointer-events-none",
+						children: /* @__PURE__ */ a(s, { size: 20 })
+					}),
+					/* @__PURE__ */ a("div", {
+						className: "flex items-center gap-2",
+						children: Array.from({ length: x }).map((e, t) => /* @__PURE__ */ a("button", {
+							onClick: () => E(t),
+							className: `transition-all duration-300 rounded-full ${y === t ? "w-6 h-1.5 bg-blue-600" : "w-1.5 h-1.5 bg-slate-300 hover:bg-slate-400"}`,
+							"aria-label": `Go to slide ${t + 1}`
+						}, t))
+					}),
+					/* @__PURE__ */ a("button", {
+						onClick: () => T("right"),
+						disabled: _,
+						className: "w-8 h-8 flex items-center justify-center text-slate-400 hover:text-blue-600 hover:bg-blue-50 rounded-full transition-colors disabled:opacity-30 disabled:pointer-events-none",
+						children: /* @__PURE__ */ a(c, { size: 20 })
+					})
+				]
+			})
+		]
+	});
+};
+//#endregion
+export { l as default };

package/components/DataCarousel/index.d.ts

@@ -0,0 +1,13 @@
+import { default as React } from 'react';
+export interface RepeaterCarouselProps {
+    /** The data array to iterate over */
+    items?: any[];
+    /** The template to render for each item in the array */
+    template?: React.ReactNode | ((payload: any) => React.ReactNode);
+    variant?: 'inline-arrows' | 'bottom-controls';
+    itemsPerView?: 'one' | 'multiple' | 'fractional';
+    gap?: 'none' | 'sm' | 'md' | 'lg';
+    className?: string;
+}
+declare const RepeaterCarousel: React.FC<RepeaterCarouselProps>;
+export default RepeaterCarousel;

package/components/DataCarousel/index.js

@@ -0,0 +1,104 @@
+import { useEffect as e, useRef as t, useState as n } from "react";
+import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
+import { ChevronLeft as o, ChevronRight as s } from "lucide-react";
+//#region src/components/DataCarousel/index.tsx
+var c = ({ items: c = [], template: l, variant: u = "inline-arrows", itemsPerView: d = "one", gap: f = "md", className: p = "" }) => {
+	let m = t(null), [h, g] = n(!0), [_, v] = n(!1), [y, b] = n(0), x = c?.length || 0, S = () => {
+		switch (d) {
+			case "one": return "w-full";
+			case "multiple": return "w-full sm:w-[calc(50%-1rem)] md:w-[calc(33.333%-1rem)] lg:w-[calc(25%-1rem)]";
+			case "fractional": return "w-[85%] sm:w-[38%] md:w-[28%] lg:w-[21%]";
+			default: return "w-full";
+		}
+	}, C = () => {
+		switch (f) {
+			case "none": return "gap-0";
+			case "sm": return "gap-2";
+			case "lg": return "gap-8";
+			default: return "gap-4";
+		}
+	}, w = () => {
+		if (!m.current) return;
+		let { scrollLeft: e, scrollWidth: t, clientWidth: n } = m.current;
+		g(e <= 10), v(Math.ceil(e + n) >= t - 10);
+		let r = t - n;
+		if (r > 0) {
+			let t = e / r;
+			b(Math.round(t * (x - 1)));
+		} else b(0);
+	};
+	e(() => {
+		w();
+	}, [c, d]);
+	let T = (e) => {
+		if (!m.current) return;
+		let t = m.current.clientWidth * .8;
+		m.current.scrollBy({
+			left: e === "left" ? -t : t,
+			behavior: "smooth"
+		});
+	}, E = (e) => {
+		if (!m.current) return;
+		let { scrollWidth: t, clientWidth: n } = m.current, r = (t - n) * (e / (x - 1 || 1));
+		m.current.scrollTo({
+			left: r,
+			behavior: "smooth"
+		});
+	};
+	return x === 0 ? null : /* @__PURE__ */ a("div", {
+		className: `relative w-full flex flex-col group ${p}`,
+		children: [
+			/* @__PURE__ */ i("div", {
+				ref: m,
+				onScroll: w,
+				className: `flex ${C()} overflow-x-auto snap-x snap-mandatory [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none] relative z-10 py-4`,
+				children: c.map((e, t) => /* @__PURE__ */ i("div", {
+					className: `shrink-0 snap-center sm:snap-start transition-transform ${S()}`,
+					children: typeof l == "function" ? l({
+						item: e,
+						index: t,
+						_builderIndex: t
+					}) : l
+				}, t))
+			}),
+			u === "inline-arrows" && /* @__PURE__ */ a(r, { children: [/* @__PURE__ */ i("button", {
+				onClick: () => T("left"),
+				disabled: h,
+				className: "absolute left-0 sm:-left-4 top-1/2 -translate-y-1/2 z-20 w-10 h-10 bg-white border border-slate-200 shadow-lg rounded-full flex items-center justify-center text-slate-600 transition-all duration-300 hover:bg-slate-50 hover:scale-110 disabled:opacity-0 disabled:pointer-events-none",
+				children: /* @__PURE__ */ i(o, { size: 20 })
+			}), /* @__PURE__ */ i("button", {
+				onClick: () => T("right"),
+				disabled: _,
+				className: "absolute right-0 sm:-right-4 top-1/2 -translate-y-1/2 z-20 w-10 h-10 bg-white border border-slate-200 shadow-lg rounded-full flex items-center justify-center text-slate-600 transition-all duration-300 hover:bg-slate-50 hover:scale-110 disabled:opacity-0 disabled:pointer-events-none",
+				children: /* @__PURE__ */ i(s, { size: 20 })
+			})] }),
+			u === "bottom-controls" && /* @__PURE__ */ a("div", {
+				className: "flex items-center justify-between w-full mt-4 px-2",
+				children: [
+					/* @__PURE__ */ i("button", {
+						onClick: () => T("left"),
+						disabled: h,
+						className: "w-8 h-8 flex items-center justify-center text-slate-400 hover:text-blue-600 hover:bg-blue-50 rounded-full transition-colors disabled:opacity-30 disabled:pointer-events-none",
+						children: /* @__PURE__ */ i(o, { size: 20 })
+					}),
+					/* @__PURE__ */ i("div", {
+						className: "flex items-center gap-2",
+						children: Array.from({ length: x }).map((e, t) => /* @__PURE__ */ i("button", {
+							onClick: () => E(t),
+							className: `transition-all duration-300 rounded-full ${y === t ? "w-6 h-1.5 bg-blue-600" : "w-1.5 h-1.5 bg-slate-300 hover:bg-slate-400"}`,
+							"aria-label": `Go to slide ${t + 1}`
+						}, t))
+					}),
+					/* @__PURE__ */ i("button", {
+						onClick: () => T("right"),
+						disabled: _,
+						className: "w-8 h-8 flex items-center justify-center text-slate-400 hover:text-blue-600 hover:bg-blue-50 rounded-full transition-colors disabled:opacity-30 disabled:pointer-events-none",
+						children: /* @__PURE__ */ i(s, { size: 20 })
+					})
+				]
+			})
+		]
+	});
+};
+//#endregion
+export { c as default };

package/components/RepeaterTable/index.d.ts

@@ -9,18 +9,18 @@ export interface RepeaterTableProps {
     data?: any[];
     /**
      * @optional
-     * @type|json
-     * @schema { "type": "array", "items": { "type": "object", "properties": { "label": { "type": "string", "default": "Header" }, "accessor": { "type": "string", "default": "id" } } } }
+     * @type|complex
+     * @schema { "type": "array", "items": { "type": "object", "properties": { "label": { "type": "string", "default": "Header" }, "accessor": { "type": "string", "default": "id" }, "template": { "type": "nodeFunction" } } } }
      */
-    headers?: {
+    columns?: {
         label: string;
         accessor: string;
+        template?: (context: TableRowPayload) => React.ReactNode;
     }[];
-    cellTemplates?: (React.ReactNode | ((context: TableRowPayload) => React.ReactNode))[];
     expandedContent?: React.ReactNode | ((context: TableRowPayload) => React.ReactNode);
     pageSize?: number;
     globalFilterPlaceholder?: string;
     className?: string;
 }
-export default function RepeaterTable({ data, headers, cellTemplates, expandedContent, pageSize, globalFilterPlaceholder, className, }: RepeaterTableProps): import("react/jsx-runtime").JSX.Element;
+export default function RepeaterTable({ data, columns, expandedContent, pageSize, globalFilterPlaceholder, className, }: RepeaterTableProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/components/RepeaterTable/index.js

@@ -1,146 +1,124 @@
 import e, { useEffect as t, useMemo as n, useRef as r, useState as i } from "react";
 import { jsx as a, jsxs as o } from "react/jsx-runtime";
-import { flexRender as s, getCoreRowModel as c, getExpandedRowModel as l, getFilteredRowModel as u, getPaginationRowModel as d, useReactTable as f } from "@tanstack/react-table";
-import { ChevronDown as p, ChevronLeft as m, ChevronRight as h, ChevronsLeft as g, ChevronsRight as _, LayoutTemplate as v, Search as y } from "lucide-react";
+import { ChevronDown as s, ChevronLeft as c, ChevronRight as l, ChevronsLeft as u, ChevronsRight as d, LayoutTemplate as f, Search as p } from "lucide-react";
+import { flexRender as m, getCoreRowModel as h, getExpandedRowModel as g, getFilteredRowModel as _, getPaginationRowModel as v, useReactTable as y } from "@tanstack/react-table";
 //#region src/components/RepeaterTable/index.tsx
-function b({ data: b = [], headers: x = [], cellTemplates: S = [], expandedContent: C, pageSize: w = 5, globalFilterPlaceholder: T = "Search anywhere...", className: E = "" }) {
-	let [D, O] = i([]), [k, A] = i(""), [j, M] = i({}), N = r(x), P = r(S);
+function b({ data: b = [], columns: x = [], expandedContent: S, pageSize: C = 5, globalFilterPlaceholder: w = "Search anywhere...", className: T = "" }) {
+	let [E, D] = i([]), [O, k] = i(""), [A, j] = i({}), M = r(x);
 	t(() => {
-		N.current = x;
-	}, [x]), t(() => {
-		P.current = S;
-	}, [S]);
-	let F = n(() => {
-		let e = Math.max(N.current.length, P.current.length);
-		return Array.from({ length: e }).map((e, t) => {
-			let n = N.current[t] || {
-				label: `Column ${t + 1}`,
-				accessor: `col_${t}`
+		M.current = x;
+	}, [x]);
+	let N = n(() => (Array.isArray(M.current) ? M.current : []).map((e, t) => ({
+		id: `col_${t}`,
+		accessorFn: (t) => t[e.accessor] ?? t,
+		header: () => /* @__PURE__ */ a("div", {
+			className: "font-semibold text-slate-700 dark:text-slate-200 uppercase text-xs",
+			children: e.label
+		}),
+		cell: ({ row: n }) => {
+			let r = M.current?.[t]?.template, i = t === 0, c = {
+				item: n.original,
+				index: n.index,
+				isExpanded: n.getIsExpanded(),
+				toggleExpanded: n.getToggleExpandedHandler()
 			};
-			return {
-				id: `col_${t}`,
-				accessorFn: (e) => e[n.accessor] ?? e,
-				header: () => /* @__PURE__ */ a("div", {
-					className: "font-semibold text-slate-700 dark:text-slate-200 uppercase text-xs",
-					children: n.label
-				}),
-				cell: ({ row: e }) => {
-					let r = P.current[t], i = t === 0, s = {
-						item: e.original,
-						index: e.index,
-						isExpanded: e.getIsExpanded(),
-						toggleExpanded: e.getToggleExpandedHandler()
-					};
-					return /* @__PURE__ */ o("div", {
-						className: "flex items-center gap-3",
-						children: [i && C && /* @__PURE__ */ a("button", {
-							onClick: e.getToggleExpandedHandler(),
-							className: "p-1 hover:bg-slate-200 dark:hover:bg-white/10 rounded text-slate-500 transition-colors shrink-0",
-							children: e.getIsExpanded() ? /* @__PURE__ */ a(p, { size: 16 }) : /* @__PURE__ */ a(h, { size: 16 })
-						}), /* @__PURE__ */ a("div", {
-							className: "flex-1 w-full min-w-0",
-							children: typeof r == "function" ? r(s) : r || /* @__PURE__ */ o("div", {
-								className: "py-2 px-3 border border-dashed border-slate-300 dark:border-slate-700 rounded text-slate-400 dark:text-slate-500 text-xs italic flex items-center gap-2",
-								children: [
-									/* @__PURE__ */ a(v, { size: 12 }),
-									" Drop ",
-									n.label,
-									" Cell"
-								]
-							})
-						})]
-					});
-				}
-			};
-		});
-	}, [
-		x.length,
-		S.length,
-		C
-	]), I = f({
+			return /* @__PURE__ */ o("div", {
+				className: "flex items-center gap-3",
+				children: [i && S && /* @__PURE__ */ a("button", {
+					onClick: n.getToggleExpandedHandler(),
+					className: "p-1 hover:bg-slate-200 dark:hover:bg-white/10 rounded text-slate-500 transition-colors shrink-0",
+					children: n.getIsExpanded() ? /* @__PURE__ */ a(s, { size: 16 }) : /* @__PURE__ */ a(l, { size: 16 })
+				}), /* @__PURE__ */ a("div", {
+					className: "flex-1 w-full min-w-0",
+					children: typeof r == "function" ? r(c) : r || /* @__PURE__ */ o("div", {
+						className: "py-2 px-3 border border-dashed border-slate-300 dark:border-slate-700 rounded text-slate-400 dark:text-slate-500 text-xs italic flex items-center gap-2",
+						children: [
+							/* @__PURE__ */ a(f, { size: 12 }),
+							" Drop ",
+							e.label,
+							" Cell"
+						]
+					})
+				})]
+			});
+		}
+	})), [x?.length, S]), P = y({
 		data: Array.isArray(b) ? b : [],
-		columns: F,
+		columns: N,
 		state: {
-			sorting: D,
-			globalFilter: k,
-			expanded: j
+			sorting: E,
+			globalFilter: O,
+			expanded: A
 		},
-		initialState: { pagination: { pageSize: w } },
-		onSortingChange: O,
-		onExpandedChange: M,
-		onGlobalFilterChange: A,
-		getCoreRowModel: c(),
-		getFilteredRowModel: u(),
-		getPaginationRowModel: d(),
-		getExpandedRowModel: l(),
+		initialState: { pagination: { pageSize: C } },
+		onSortingChange: D,
+		onExpandedChange: j,
+		onGlobalFilterChange: k,
+		getCoreRowModel: h(),
+		getFilteredRowModel: _(),
+		getPaginationRowModel: v(),
+		getExpandedRowModel: g(),
 		globalFilterFn: (e, t, n) => {
 			let r = String(n).toLowerCase();
 			return Object.values(e.original).some((e) => String(e).toLowerCase().includes(r));
 		}
 	});
 	return t(() => {
-		I.setPageSize(w);
-	}, [w, I]), b.length === 0 && x.length === 0 && S.length === 0 ? /* @__PURE__ */ o("div", {
+		P.setPageSize(C);
+	}, [C, P]), b.length === 0 && (!x || x.length === 0) ? /* @__PURE__ */ o("div", {
 		className: "w-full p-12 border-2 border-dashed border-slate-200 dark:border-slate-800 bg-white dark:bg-[#0A0A0A] rounded-2xl flex flex-col items-center justify-center text-slate-400",
-		children: [
-			/* @__PURE__ */ a(v, {
-				size: 32,
-				className: "mb-4 opacity-50"
-			}),
-			/* @__PURE__ */ a("p", {
-				className: "text-sm font-medium text-slate-600 dark:text-slate-400",
-				children: "Repeater Table Empty"
-			}),
-			/* @__PURE__ */ a("p", {
-				className: "text-xs mt-1 text-slate-500",
-				children: "Provide Data and configure Headers to begin."
-			})
-		]
+		children: [/* @__PURE__ */ a(f, {
+			size: 32,
+			className: "mb-4 opacity-50"
+		}), /* @__PURE__ */ a("p", {
+			className: "text-sm font-medium text-slate-600 dark:text-slate-400",
+			children: "Repeater Table Empty"
+		})]
 	}) : /* @__PURE__ */ o("div", {
-		className: `space-y-4 w-full ${E}`,
+		className: `space-y-4 w-full ${T}`,
 		children: [
 			/* @__PURE__ */ o("div", {
 				className: "relative w-full sm:w-96",
-				children: [/* @__PURE__ */ a(y, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-slate-400 dark:text-slate-500" }), /* @__PURE__ */ a("input", {
-					value: k ?? "",
-					onChange: (e) => A(e.target.value),
-					placeholder: T,
-					className: "w-full bg-white dark:bg-[#0A0A0A] border border-slate-200 dark:border-white/10 rounded-xl pl-10 pr-4 py-2 text-sm text-slate-900 dark:text-slate-200 placeholder:text-slate-400 focus:outline-none focus:border-blue-500 transition-colors shadow-sm dark:shadow-none"
+				children: [/* @__PURE__ */ a(p, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-slate-400 dark:text-slate-500" }), /* @__PURE__ */ a("input", {
+					value: O ?? "",
+					onChange: (e) => k(e.target.value),
+					placeholder: w,
+					className: "w-full bg-white dark:bg-[#0A0A0A] border border-slate-200 dark:border-white/10 rounded-xl pl-10 pr-4 py-2 text-sm text-slate-900 dark:text-slate-200 placeholder:text-slate-400 outline-none"
 				})]
 			}),
 			/* @__PURE__ */ a("div", {
-				className: "rounded-2xl border border-slate-200 dark:border-white/10 bg-white dark:bg-[#0A0A0A] overflow-hidden shadow-sm dark:shadow-none",
+				className: "rounded-2xl border border-slate-200 dark:border-white/10 bg-white dark:bg-[#0A0A0A] overflow-hidden",
 				children: /* @__PURE__ */ a("div", {
 					className: "overflow-x-auto custom-scrollbar",
 					children: /* @__PURE__ */ o("table", {
 						className: "w-full text-sm text-left",
 						children: [/* @__PURE__ */ a("thead", {
 							className: "bg-slate-50 dark:bg-white/5 border-b border-slate-200 dark:border-white/10 text-slate-500 dark:text-slate-400 tracking-wider",
-							children: I.getHeaderGroups().map((e) => /* @__PURE__ */ a("tr", { children: e.headers.map((e) => /* @__PURE__ */ a("th", {
+							children: P.getHeaderGroups().map((e) => /* @__PURE__ */ a("tr", { children: e.headers.map((e) => /* @__PURE__ */ a("th", {
 								className: "px-6 py-4 whitespace-nowrap",
-								children: s(e.column.columnDef.header, e.getContext())
+								children: m(e.column.columnDef.header, e.getContext())
 							}, e.id)) }, e.id))
 						}), /* @__PURE__ */ a("tbody", {
 							className: "divide-y divide-slate-200 dark:divide-white/5",
-							children: I.getRowModel().rows.map((t) => /* @__PURE__ */ o(e.Fragment, { children: [/* @__PURE__ */ a("tr", {
+							children: P.getRowModel().rows.map((t) => /* @__PURE__ */ o(e.Fragment, { children: [/* @__PURE__ */ a("tr", {
 								className: "hover:bg-slate-50 dark:hover:bg-white/5 transition-colors group",
 								children: t.getVisibleCells().map((e) => /* @__PURE__ */ a("td", {
 									className: "px-6 py-4 text-slate-700 dark:text-slate-300",
-									children: s(e.column.columnDef.cell, e.getContext())
+									children: m(e.column.columnDef.cell, e.getContext())
 								}, e.id))
-							}), t.getIsExpanded() && C && /* @__PURE__ */ a("tr", {
+							}), t.getIsExpanded() && S && /* @__PURE__ */ a("tr", {
 								className: "bg-slate-50/50 dark:bg-white/[0.02]",
 								children: /* @__PURE__ */ a("td", {
-									colSpan: F.length,
+									colSpan: N.length,
 									className: "p-0 border-b border-slate-200 dark:border-white/5",
 									children: /* @__PURE__ */ a("div", {
 										className: "p-6",
-										children: typeof C == "function" ? C({
+										children: typeof S == "function" ? S({
 											item: t.original,
 											index: t.index,
 											isExpanded: !0,
 											toggleExpanded: t.getToggleExpandedHandler()
-										}) : C
+										}) : S
 									})
 								})
 							})] }, t.id))
@@ -156,41 +134,41 @@ function b({ data: b = [], headers: x = [], cellTemplates: S = [], expandedConte
 						"Page ",
 						/* @__PURE__ */ a("span", {
 							className: "font-semibold text-slate-700 dark:text-slate-200",
-							children: I.getState().pagination.pageIndex + 1
+							children: P.getState().pagination.pageIndex + 1
 						}),
 						" of",
 						" ",
 						/* @__PURE__ */ a("span", {
 							className: "font-semibold text-slate-700 dark:text-slate-200",
-							children: I.getPageCount() || 1
+							children: P.getPageCount() || 1
 						})
 					]
 				}), /* @__PURE__ */ o("div", {
 					className: "flex items-center gap-1.5",
 					children: [
 						/* @__PURE__ */ a("button", {
-							onClick: () => I.setPageIndex(0),
-							disabled: !I.getCanPreviousPage(),
+							onClick: () => P.setPageIndex(0),
+							disabled: !P.getCanPreviousPage(),
 							className: "p-1.5 rounded-lg text-slate-600 dark:text-slate-400 hover:bg-slate-100 dark:hover:bg-white/5 disabled:opacity-30 transition-colors",
-							children: /* @__PURE__ */ a(g, { size: 16 })
+							children: /* @__PURE__ */ a(u, { size: 16 })
 						}),
 						/* @__PURE__ */ a("button", {
-							onClick: () => I.previousPage(),
-							disabled: !I.getCanPreviousPage(),
+							onClick: () => P.previousPage(),
+							disabled: !P.getCanPreviousPage(),
 							className: "p-1.5 rounded-lg text-slate-600 dark:text-slate-400 hover:bg-slate-100 dark:hover:bg-white/5 disabled:opacity-30 transition-colors",
-							children: /* @__PURE__ */ a(m, { size: 16 })
+							children: /* @__PURE__ */ a(c, { size: 16 })
 						}),
 						/* @__PURE__ */ a("button", {
-							onClick: () => I.nextPage(),
-							disabled: !I.getCanNextPage(),
+							onClick: () => P.nextPage(),
+							disabled: !P.getCanNextPage(),
 							className: "p-1.5 rounded-lg text-slate-600 dark:text-slate-400 hover:bg-slate-100 dark:hover:bg-white/5 disabled:opacity-30 transition-colors",
-							children: /* @__PURE__ */ a(h, { size: 16 })
+							children: /* @__PURE__ */ a(l, { size: 16 })
 						}),
 						/* @__PURE__ */ a("button", {
-							onClick: () => I.setPageIndex(I.getPageCount() - 1),
-							disabled: !I.getCanNextPage(),
+							onClick: () => P.setPageIndex(P.getPageCount() - 1),
+							disabled: !P.getCanNextPage(),
 							className: "p-1.5 rounded-lg text-slate-600 dark:text-slate-400 hover:bg-slate-100 dark:hover:bg-white/5 disabled:opacity-30 transition-colors",
-							children: /* @__PURE__ */ a(_, { size: 16 })
+							children: /* @__PURE__ */ a(d, { size: 16 })
 						})
 					]
 				})]

package/components/StructuredGrid/index.d.ts

@@ -0,0 +1,16 @@
+import { default as React } from 'react';
+export interface ComplexGridProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** The data defining the names of the slots and their dropped content */
+    gridData?: {
+        name: string;
+        node: React.ReactNode;
+    }[];
+    templateColumns?: string;
+    templateRows?: string;
+    templateAreas?: string;
+    gap?: 'none' | 'sm' | 'md' | 'lg' | 'xl';
+    minHeight?: string;
+    className?: string;
+}
+export declare const ComplexGrid: React.FC<ComplexGridProps>;
+export default ComplexGrid;

package/components/StructuredGrid/index.js

@@ -0,0 +1,47 @@
+import { useMemo as e } from "react";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/components/StructuredGrid/index.tsx
+var r = ({ gridData: r = [], templateColumns: i = "1fr 1fr", templateRows: a = "auto auto", templateAreas: o = "\"area1 area2\" \"area3 area4\"", gap: s = "md", minHeight: c = "300px", className: l = "", ...u }) => {
+	let d = {
+		none: "gap-0",
+		sm: "gap-4",
+		md: "gap-6",
+		lg: "gap-8",
+		xl: "gap-12"
+	}, f = e(() => {
+		if (!o) return [];
+		let e = o.replace(/"|'/g, "").split(/\s+/).filter((e) => e.trim() !== "" && e.trim() !== ".");
+		return Array.from(new Set(e));
+	}, [o]), p = (e) => r?.find((t) => t && t.name === e)?.node || null, m = {
+		display: "grid",
+		gridTemplateColumns: i,
+		gridTemplateRows: a,
+		gridTemplateAreas: o,
+		minHeight: c,
+		...u.style
+	};
+	return /* @__PURE__ */ t("div", {
+		className: `w-full ${d[s]} ${l}`,
+		style: m,
+		...u,
+		children: f.map((e) => {
+			let r = p(e), i = !r;
+			return /* @__PURE__ */ n("div", {
+				style: { gridArea: e },
+				className: `
+              relative min-h-[50px] transition-colors
+              ${i ? "border border-dashed border-slate-300 bg-slate-50/50 hover:bg-slate-100 hover:border-blue-400" : ""}
+            `,
+				children: [i && /* @__PURE__ */ t("div", {
+					className: "absolute inset-0 flex items-center justify-center pointer-events-none opacity-40",
+					children: /* @__PURE__ */ t("span", {
+						className: "font-mono text-xs font-bold uppercase tracking-wider text-slate-500",
+						children: e
+					})
+				}), r]
+			}, e);
+		})
+	});
+};
+//#endregion
+export { r as default };

package/components/Table/index.js

@@ -1,7 +1,7 @@
 import { useCallback as e, useEffect as t, useRef as n, useState as r } from "react";
 import { jsx as i, jsxs as a } from "react/jsx-runtime";
-import { flexRender as o, getCoreRowModel as s, getFilteredRowModel as c, getPaginationRowModel as l, getSortedRowModel as u, useReactTable as d } from "@tanstack/react-table";
-import { ChevronDown as f, ChevronLeft as p, ChevronRight as m, ChevronUp as h, ChevronsLeft as g, ChevronsRight as _, ChevronsUpDown as v, Loader2 as y, Search as b, SlidersHorizontal as x } from "lucide-react";
+import { ChevronDown as o, ChevronLeft as s, ChevronRight as c, ChevronUp as l, ChevronsLeft as u, ChevronsRight as d, ChevronsUpDown as f, Loader2 as p, Search as m, SlidersHorizontal as h } from "lucide-react";
+import { flexRender as g, getCoreRowModel as _, getFilteredRowModel as v, getPaginationRowModel as y, getSortedRowModel as b, useReactTable as x } from "@tanstack/react-table";
 //#region src/components/Table/index.tsx
 function S({ columns: S = [], data: C = [], pageSize: w = 10, mode: T = "pagination", onLoadMore: E, isFetching: D = !1, hasMore: O = !1, globalFilterPlaceholder: k = "Search all records..." }) {
 	let [A, j] = r([]), [M, N] = r([]), [P, F] = r(""), [I, L] = r(!1), R = n(null), z = e((e) => {
@@ -12,7 +12,7 @@ function S({ columns: S = [], data: C = [], pageSize: w = 10, mode: T = "paginat
 		D,
 		O,
 		E
-	]), B = d({
+	]), B = x({
 		data: C,
 		columns: S,
 		state: {
@@ -25,10 +25,10 @@ function S({ columns: S = [], data: C = [], pageSize: w = 10, mode: T = "paginat
 		onColumnFiltersChange: N,
 		onGlobalFilterChange: F,
 		globalFilterFn: "includesString",
-		getCoreRowModel: s(),
-		getFilteredRowModel: c(),
-		getSortedRowModel: u(),
-		getPaginationRowModel: T === "pagination" ? l() : void 0
+		getCoreRowModel: _(),
+		getFilteredRowModel: v(),
+		getSortedRowModel: b(),
+		getPaginationRowModel: T === "pagination" ? y() : void 0
 	});
 	return t(() => {
 		B.setPageSize(w);
@@ -39,7 +39,7 @@ function S({ columns: S = [], data: C = [], pageSize: w = 10, mode: T = "paginat
 				className: "flex flex-col sm:flex-row items-center justify-between gap-4",
 				children: [/* @__PURE__ */ a("div", {
 					className: "relative w-full sm:w-96",
-					children: [/* @__PURE__ */ i(b, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-slate-400 dark:text-slate-500" }), /* @__PURE__ */ i("input", {
+					children: [/* @__PURE__ */ i(m, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-slate-400 dark:text-slate-500" }), /* @__PURE__ */ i("input", {
 						value: P ?? "",
 						onChange: (e) => F(e.target.value),
 						placeholder: k,
@@ -48,7 +48,7 @@ function S({ columns: S = [], data: C = [], pageSize: w = 10, mode: T = "paginat
 				}), /* @__PURE__ */ a("button", {
 					onClick: () => L(!I),
 					className: `flex items-center gap-2 px-4 py-2 border rounded-xl text-sm font-medium transition-colors w-full sm:w-auto shadow-sm dark:shadow-none ${I ? "bg-blue-50 dark:bg-white/10 border-blue-200 dark:border-white/20 text-blue-700 dark:text-white" : "border-slate-200 dark:border-white/10 bg-white dark:bg-[#0A0A0A] hover:bg-slate-50 dark:hover:bg-white/5 text-slate-700 dark:text-slate-300"}`,
-					children: [/* @__PURE__ */ i(x, { size: 14 }), /* @__PURE__ */ i("span", { children: "Filters" })]
+					children: [/* @__PURE__ */ i(h, { size: 14 }), /* @__PURE__ */ i("span", { children: "Filters" })]
 				})]
 			}),
 			/* @__PURE__ */ a("div", {
@@ -66,16 +66,16 @@ function S({ columns: S = [], data: C = [], pageSize: w = 10, mode: T = "paginat
 									children: [/* @__PURE__ */ a("div", {
 										className: e.column.getCanSort() ? "cursor-pointer select-none flex items-center gap-2 hover:text-slate-900 dark:hover:text-white transition-colors" : "flex items-center gap-2",
 										onClick: e.column.getToggleSortingHandler(),
-										children: [o(e.column.columnDef.header, e.getContext()), {
-											asc: /* @__PURE__ */ i(h, {
+										children: [g(e.column.columnDef.header, e.getContext()), {
+											asc: /* @__PURE__ */ i(l, {
 												size: 14,
 												className: "text-blue-500 dark:text-cyan-400"
 											}),
-											desc: /* @__PURE__ */ i(f, {
+											desc: /* @__PURE__ */ i(o, {
 												size: 14,
 												className: "text-blue-500 dark:text-cyan-400"
 											})
-										}[e.column.getIsSorted()] ?? (e.column.getCanSort() ? /* @__PURE__ */ i(v, {
+										}[e.column.getIsSorted()] ?? (e.column.getCanSort() ? /* @__PURE__ */ i(f, {
 											size: 14,
 											className: "opacity-0 group-hover:opacity-50"
 										}) : null)]
@@ -95,7 +95,7 @@ function S({ columns: S = [], data: C = [], pageSize: w = 10, mode: T = "paginat
 								className: "hover:bg-slate-50 dark:hover:bg-white/5 transition-colors group",
 								children: e.getVisibleCells().map((e) => /* @__PURE__ */ i("td", {
 									className: "px-6 py-4 text-slate-700 dark:text-slate-300 whitespace-nowrap",
-									children: o(e.column.columnDef.cell, e.getContext())
+									children: g(e.column.columnDef.cell, e.getContext())
 								}, e.id))
 							}, e.id)) : /* @__PURE__ */ i("tr", { children: /* @__PURE__ */ i("td", {
 								colSpan: S.length,
@@ -109,7 +109,7 @@ function S({ columns: S = [], data: C = [], pageSize: w = 10, mode: T = "paginat
 					className: "flex items-center justify-center p-4 text-slate-500 border-t border-slate-200 dark:border-white/10",
 					children: D ? /* @__PURE__ */ a("span", {
 						className: "flex items-center gap-2 text-sm",
-						children: [/* @__PURE__ */ i(y, {
+						children: [/* @__PURE__ */ i(p, {
 							className: "animate-spin",
 							size: 14
 						}), " Loading more..."]
@@ -146,25 +146,25 @@ function S({ columns: S = [], data: C = [], pageSize: w = 10, mode: T = "paginat
 							onClick: () => B.setPageIndex(0),
 							disabled: !B.getCanPreviousPage(),
 							className: "p-1.5 rounded-lg text-slate-600 dark:text-slate-400 hover:bg-slate-100 dark:hover:bg-white/5 disabled:opacity-30 transition-colors",
-							children: /* @__PURE__ */ i(g, { size: 16 })
+							children: /* @__PURE__ */ i(u, { size: 16 })
 						}),
 						/* @__PURE__ */ i("button", {
 							onClick: () => B.previousPage(),
 							disabled: !B.getCanPreviousPage(),
 							className: "p-1.5 rounded-lg text-slate-600 dark:text-slate-400 hover:bg-slate-100 dark:hover:bg-white/5 disabled:opacity-30 transition-colors",
-							children: /* @__PURE__ */ i(p, { size: 16 })
+							children: /* @__PURE__ */ i(s, { size: 16 })
 						}),
 						/* @__PURE__ */ i("button", {
 							onClick: () => B.nextPage(),
 							disabled: !B.getCanNextPage(),
 							className: "p-1.5 rounded-lg text-slate-600 dark:text-slate-400 hover:bg-slate-100 dark:hover:bg-white/5 disabled:opacity-30 transition-colors",
-							children: /* @__PURE__ */ i(m, { size: 16 })
+							children: /* @__PURE__ */ i(c, { size: 16 })
 						}),
 						/* @__PURE__ */ i("button", {
 							onClick: () => B.setPageIndex(B.getPageCount() - 1),
 							disabled: !B.getCanNextPage(),
 							className: "p-1.5 rounded-lg text-slate-600 dark:text-slate-400 hover:bg-slate-100 dark:hover:bg-white/5 disabled:opacity-30 transition-colors",
-							children: /* @__PURE__ */ i(_, { size: 16 })
+							children: /* @__PURE__ */ i(d, { size: 16 })
 						})
 					]
 				})]

package/index.d.ts

@@ -1,3 +1,9 @@
+export type { BoxProps } from './components/Box';
+export { default as Box } from './components/Box';
+export type { RudraCarouselProps } from './components/Carousel';
+export { default as RudraCarousel } from './components/Carousel';
+export type { RepeaterCarouselProps } from './components/DataCarousel';
+export { default as RepeaterCarousel } from './components/DataCarousel';
 export type { GridProps } from './components/Grid';
 export { default as Grid } from './components/Grid';
 export type { RepeaterProps } from './components/Repeater';
@@ -6,5 +12,7 @@ export type { RepeaterTableProps } from './components/RepeaterTable';
 export { default as RepeaterTable } from './components/RepeaterTable';
 export type { StackProps } from './components/Stack';
 export { default as Stack } from './components/Stack';
+export type { ComplexGridProps } from './components/StructuredGrid';
+export { default as ComplexGrid } from './components/StructuredGrid';
 export type { DataTableProps } from './components/Table';
 export { default as DataTable } from './components/Table';

package/index.js

@@ -1,9 +1,13 @@
 /* empty css       */
-import e from "./components/Grid/index.js";
-import t from "./components/Repeater/index.js";
-import n from "./components/RepeaterTable/index.js";
-import r from "./components/Stack/index.js";
-import i from "./components/Table/index.js";
-export { i as DataTable, e as Grid, t as Repeater, n as RepeaterTable, r as Stack };
+import e from "./components/Box/index.js";
+import t from "./components/Carousel/index.js";
+import n from "./components/DataCarousel/index.js";
+import r from "./components/Grid/index.js";
+import i from "./components/Repeater/index.js";
+import a from "./components/RepeaterTable/index.js";
+import o from "./components/Stack/index.js";
+import s from "./components/StructuredGrid/index.js";
+import c from "./components/Table/index.js";
+export { e as Box, s as ComplexGrid, c as DataTable, r as Grid, i as Repeater, n as RepeaterCarousel, a as RepeaterTable, t as RudraCarousel, o as Stack };
 
-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: }.absolute{position:absolute}.relative{position:relative}.left-3{left:.75rem}.top-1\\/2{top:50%}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mt-1{margin-top:.25rem}.mt-4{margin-top:1rem}.flex{display:flex}.\\!table{display:table!important}.table{display:table}.grid{display:grid}.h-4{height:1rem}.w-4{width:1rem}.w-full{width:100%}.min-w-0{min-width:0}.min-w-\\[120px\\]{min-width:120px}.flex-1{flex:1}.shrink-0{flex-shrink:0}.-translate-y-1\\/2{--tw-translate-y:-50%;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))}@keyframes spin{to{transform:rotate(360deg)}}.animate-spin{animation:1s linear infinite spin}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;user-select:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-\\[repeat\\(auto-fit\\,minmax\\(250px\\,1fr\\)\\)\\]{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.items-stretch{align-items:stretch}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.gap-0{gap:0}.gap-1{gap:.25rem}.gap-1\\.5{gap:.375rem}.gap-12{gap:3rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.divide-y>:not([hidden])~:not([hidden]){--tw-divide-y-reverse:0;border-top-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px * var(--tw-divide-y-reverse))}.divide-slate-200>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgb(226 232 240/var(--tw-divide-opacity))}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.whitespace-nowrap{white-space:nowrap}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:1rem}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.border{border-width:1px}.border-2{border-width:2px}.border-b{border-bottom-width:1px}.border-t{border-top-width:1px}.border-dashed{border-style:dashed}.border-blue-200{--tw-border-opacity:1;border-color:rgb(191 219 254/var(--tw-border-opacity))}.border-purple-200{--tw-border-opacity:1;border-color:rgb(233 213 255/var(--tw-border-opacity))}.border-purple-300{--tw-border-opacity:1;border-color:rgb(216 180 254/var(--tw-border-opacity))}.border-slate-200{--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity))}.border-slate-300{--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity))}.bg-blue-50{--tw-bg-opacity:1;background-color:rgb(239 246 255/var(--tw-bg-opacity))}.bg-purple-50{--tw-bg-opacity:1;background-color:rgb(250 245 255/var(--tw-bg-opacity))}.bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity))}.bg-slate-50\\/50{background-color:#f8fafc80}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.p-0{padding:0}.p-1{padding:.25rem}.p-1\\.5{padding:.375rem}.p-12{padding:3rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\\.5{padding-top:.375rem;padding-bottom:.375rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-4{padding-top:1rem;padding-bottom:1rem}.pl-10{padding-left:2.5rem}.pr-4{padding-right:1rem}.text-left{text-align:left}.text-center{text-align:center}.align-top{vertical-align:top}.text-\\[10px\\]{font-size:10px}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-normal{font-weight:400}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.normal-case{text-transform:none}.italic{font-style:italic}.tracking-wider{letter-spacing:.05em}.text-blue-500{--tw-text-opacity:1;color:rgb(59 130 246/var(--tw-text-opacity))}.text-blue-700{--tw-text-opacity:1;color:rgb(29 78 216/var(--tw-text-opacity))}.text-purple-600{--tw-text-opacity:1;color:rgb(147 51 234/var(--tw-text-opacity))}.text-slate-400{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity))}.text-slate-500{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity))}.text-slate-600{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity))}.text-slate-700{--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity))}.text-slate-900{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity))}.opacity-0{opacity:0}.opacity-50{opacity:.5}.opacity-70{opacity:.7}.shadow-inner{--tw-shadow:inset 0 2px 4px 0 #0000000d;--tw-shadow-colored:inset 0 2px 4px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000), var(--tw-ring-shadow,0 0 #0000), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 #0000000d;--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000), var(--tw-ring-shadow,0 0 #0000), var(--tw-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-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.placeholder\\:text-slate-400::placeholder{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity))}.hover\\:bg-slate-100:hover{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity))}.hover\\:bg-slate-200:hover{--tw-bg-opacity:1;background-color:rgb(226 232 240/var(--tw-bg-opacity))}.hover\\:bg-slate-50:hover{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity))}.hover\\:text-slate-900:hover{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity))}.focus\\:border-blue-500:focus{--tw-border-opacity:1;border-color:rgb(59 130 246/var(--tw-border-opacity))}.focus\\:outline-none:focus{outline-offset:2px;outline:2px solid #0000}.disabled\\:opacity-30:disabled{opacity:.3}.group:hover .group-hover\\:opacity-50{opacity:.5}@media (width>=640px){.sm\\:w-96{width:24rem}.sm\\:w-auto{width:auto}.sm\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\\:flex-row{flex-direction:row}}@media (width>=768px){.md\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width>=1024px){.lg\\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (width>=1280px){.xl\\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (prefers-color-scheme:dark){.dark\\:divide-white\\/5>:not([hidden])~:not([hidden]){border-color:#ffffff0d}.dark\\:border-slate-700{--tw-border-opacity:1;border-color:rgb(51 65 85/var(--tw-border-opacity))}.dark\\:border-slate-800{--tw-border-opacity:1;border-color:rgb(30 41 59/var(--tw-border-opacity))}.dark\\:border-white\\/10{border-color:#ffffff1a}.dark\\:border-white\\/20{border-color:#fff3}.dark\\:border-white\\/5{border-color:#ffffff0d}.dark\\:bg-\\[\\#0A0A0A\\]{--tw-bg-opacity:1;background-color:rgb(10 10 10/var(--tw-bg-opacity))}.dark\\:bg-black\\/40{background-color:#0006}.dark\\:bg-white\\/10{background-color:#ffffff1a}.dark\\:bg-white\\/5{background-color:#ffffff0d}.dark\\:bg-white\\/\\[0\\.02\\]{background-color:#ffffff05}.dark\\:text-cyan-400{--tw-text-opacity:1;color:rgb(34 211 238/var(--tw-text-opacity))}.dark\\:text-slate-200{--tw-text-opacity:1;color:rgb(226 232 240/var(--tw-text-opacity))}.dark\\:text-slate-300{--tw-text-opacity:1;color:rgb(203 213 225/var(--tw-text-opacity))}.dark\\:text-slate-400{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity))}.dark\\:text-slate-500{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity))}.dark\\:text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.dark\\:shadow-none{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000), var(--tw-ring-shadow,0 0 #0000), var(--tw-shadow)}.dark\\:placeholder\\:text-slate-600::placeholder{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity))}.dark\\:hover\\:bg-white\\/10:hover{background-color:#ffffff1a}.dark\\:hover\\:bg-white\\/5:hover{background-color:#ffffff0d}.dark\\:hover\\:text-white:hover{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.dark\\:focus\\:border-cyan-500\\/50:focus{border-color:#06b6d480}}";const target = window.__RUDRA_SHADOW_ROOT__ || document.head; target.appendChild(e);}}catch(err){}
+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}}.pointer-events-none{pointer-events:none}.absolute{position:absolute}.relative{position:relative}.inset-0{inset:0}.left-0{left:0}.left-3{left:.75rem}.right-0{right:0}.top-1\\/2{top:50%}.z-10{z-index:10}.z-20{z-index:20}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mt-4{margin-top:1rem}.inline{display:inline}.flex{display:flex}.\\!table{display:table!important}.table{display:table}.grid{display:grid}.h-1{height:.25rem}.h-1\\.5{height:.375rem}.h-10{height:2.5rem}.h-4{height:1rem}.h-8{height:2rem}.min-h-\\[50px\\]{min-height:50px}.w-1{width:.25rem}.w-1\\.5{width:.375rem}.w-10{width:2.5rem}.w-4{width:1rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-\\[85\\%\\]{width:85%}.w-full{width:100%}.min-w-0{min-width:0}.min-w-\\[120px\\]{min-width:120px}.flex-1{flex:1}.shrink-0{flex-shrink:0}.-translate-y-1\\/2{--tw-translate-y:-50%;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))}@keyframes spin{to{transform:rotate(360deg)}}.animate-spin{animation:1s linear infinite spin}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;user-select:none}.snap-x{scroll-snap-type:x var(--tw-scroll-snap-strictness)}.snap-mandatory{--tw-scroll-snap-strictness:mandatory}.snap-center{scroll-snap-align:center}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-\\[repeat\\(auto-fit\\,minmax\\(250px\\,1fr\\)\\)\\]{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.items-stretch{align-items:stretch}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.justify-stretch{justify-content:stretch}.gap-0{gap:0}.gap-1{gap:.25rem}.gap-1\\.5{gap:.375rem}.gap-12{gap:3rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.divide-y>:not([hidden])~:not([hidden]){--tw-divide-y-reverse:0;border-top-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px * var(--tw-divide-y-reverse))}.divide-slate-200>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgb(226 232 240/var(--tw-divide-opacity))}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.whitespace-nowrap{white-space:nowrap}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:1rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.border{border-width:1px}.border-2{border-width:2px}.border-b{border-bottom-width:1px}.border-t{border-top-width:1px}.border-dashed{border-style:dashed}.border-blue-200{--tw-border-opacity:1;border-color:rgb(191 219 254/var(--tw-border-opacity))}.border-purple-200{--tw-border-opacity:1;border-color:rgb(233 213 255/var(--tw-border-opacity))}.border-purple-300{--tw-border-opacity:1;border-color:rgb(216 180 254/var(--tw-border-opacity))}.border-slate-200{--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity))}.border-slate-300{--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity))}.bg-blue-50{--tw-bg-opacity:1;background-color:rgb(239 246 255/var(--tw-bg-opacity))}.bg-blue-600{--tw-bg-opacity:1;background-color:rgb(37 99 235/var(--tw-bg-opacity))}.bg-purple-50{--tw-bg-opacity:1;background-color:rgb(250 245 255/var(--tw-bg-opacity))}.bg-slate-300{--tw-bg-opacity:1;background-color:rgb(203 213 225/var(--tw-bg-opacity))}.bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity))}.bg-slate-50\\/50{background-color:#f8fafc80}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.p-0{padding:0}.p-1{padding:.25rem}.p-1\\.5{padding:.375rem}.p-12{padding:3rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\\.5{padding-top:.375rem;padding-bottom:.375rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-4{padding-top:1rem;padding-bottom:1rem}.pl-10{padding-left:2.5rem}.pr-4{padding-right:1rem}.text-left{text-align:left}.text-center{text-align:center}.align-top{vertical-align:top}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.text-\\[10px\\]{font-size:10px}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-normal{font-weight:400}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.normal-case{text-transform:none}.italic{font-style:italic}.tracking-wider{letter-spacing:.05em}.text-blue-500{--tw-text-opacity:1;color:rgb(59 130 246/var(--tw-text-opacity))}.text-blue-700{--tw-text-opacity:1;color:rgb(29 78 216/var(--tw-text-opacity))}.text-purple-600{--tw-text-opacity:1;color:rgb(147 51 234/var(--tw-text-opacity))}.text-slate-400{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity))}.text-slate-500{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity))}.text-slate-600{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity))}.text-slate-700{--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity))}.text-slate-900{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity))}.opacity-0{opacity:0}.opacity-40{opacity:.4}.opacity-50{opacity:.5}.opacity-70{opacity:.7}.shadow-inner{--tw-shadow:inset 0 2px 4px 0 #0000000d;--tw-shadow-colored:inset 0 2px 4px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000), var(--tw-ring-shadow,0 0 #0000), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000), var(--tw-ring-shadow,0 0 #0000), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 #0000000d;--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000), var(--tw-ring-shadow,0 0 #0000), var(--tw-shadow)}.outline-none{outline-offset:2px;outline:2px solid #0000}.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-all{transition-property:all;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-transform{transition-property:transform;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.\\[-ms-overflow-style\\:none\\]{-ms-overflow-style:none}.\\[scrollbar-width\\:none\\]{scrollbar-width:none}.placeholder\\:text-slate-400::placeholder{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity))}.hover\\:scale-110:hover{--tw-scale-x:1.1;--tw-scale-y:1.1;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))}.hover\\:border-blue-400:hover{--tw-border-opacity:1;border-color:rgb(96 165 250/var(--tw-border-opacity))}.hover\\:bg-blue-50:hover{--tw-bg-opacity:1;background-color:rgb(239 246 255/var(--tw-bg-opacity))}.hover\\:bg-slate-100:hover{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity))}.hover\\:bg-slate-200:hover{--tw-bg-opacity:1;background-color:rgb(226 232 240/var(--tw-bg-opacity))}.hover\\:bg-slate-400:hover{--tw-bg-opacity:1;background-color:rgb(148 163 184/var(--tw-bg-opacity))}.hover\\:bg-slate-50:hover{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity))}.hover\\:text-blue-600:hover{--tw-text-opacity:1;color:rgb(37 99 235/var(--tw-text-opacity))}.hover\\:text-slate-900:hover{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity))}.focus\\:border-blue-500:focus{--tw-border-opacity:1;border-color:rgb(59 130 246/var(--tw-border-opacity))}.focus\\:outline-none:focus{outline-offset:2px;outline:2px solid #0000}.disabled\\:pointer-events-none:disabled{pointer-events:none}.disabled\\:opacity-0:disabled{opacity:0}.disabled\\:opacity-30:disabled{opacity:.3}.group:hover .group-hover\\:opacity-50{opacity:.5}@media (width>=640px){.sm\\:-left-4{left:-1rem}.sm\\:-right-4{right:-1rem}.sm\\:w-96{width:24rem}.sm\\:w-\\[38\\%\\]{width:38%}.sm\\:w-\\[calc\\(50\\%-1rem\\)\\]{width:calc(50% - 1rem)}.sm\\:w-auto{width:auto}.sm\\:snap-start{scroll-snap-align:start}.sm\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\\:flex-row{flex-direction:row}}@media (width>=768px){.md\\:w-\\[28\\%\\]{width:28%}.md\\:w-\\[calc\\(33\\.333\\%-1rem\\)\\]{width:calc(33.333% - 1rem)}.md\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width>=1024px){.lg\\:w-\\[21\\%\\]{width:21%}.lg\\:w-\\[calc\\(25\\%-1rem\\)\\]{width:calc(25% - 1rem)}.lg\\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (width>=1280px){.xl\\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (prefers-color-scheme:dark){.dark\\:divide-white\\/5>:not([hidden])~:not([hidden]){border-color:#ffffff0d}.dark\\:border-slate-700{--tw-border-opacity:1;border-color:rgb(51 65 85/var(--tw-border-opacity))}.dark\\:border-slate-800{--tw-border-opacity:1;border-color:rgb(30 41 59/var(--tw-border-opacity))}.dark\\:border-white\\/10{border-color:#ffffff1a}.dark\\:border-white\\/20{border-color:#fff3}.dark\\:border-white\\/5{border-color:#ffffff0d}.dark\\:bg-\\[\\#0A0A0A\\]{--tw-bg-opacity:1;background-color:rgb(10 10 10/var(--tw-bg-opacity))}.dark\\:bg-black\\/40{background-color:#0006}.dark\\:bg-white\\/10{background-color:#ffffff1a}.dark\\:bg-white\\/5{background-color:#ffffff0d}.dark\\:bg-white\\/\\[0\\.02\\]{background-color:#ffffff05}.dark\\:text-cyan-400{--tw-text-opacity:1;color:rgb(34 211 238/var(--tw-text-opacity))}.dark\\:text-slate-200{--tw-text-opacity:1;color:rgb(226 232 240/var(--tw-text-opacity))}.dark\\:text-slate-300{--tw-text-opacity:1;color:rgb(203 213 225/var(--tw-text-opacity))}.dark\\:text-slate-400{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity))}.dark\\:text-slate-500{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity))}.dark\\:text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.dark\\:shadow-none{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000), var(--tw-ring-shadow,0 0 #0000), var(--tw-shadow)}.dark\\:placeholder\\:text-slate-600::placeholder{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity))}.dark\\:hover\\:bg-white\\/10:hover{background-color:#ffffff1a}.dark\\:hover\\:bg-white\\/5:hover{background-color:#ffffff0d}.dark\\:hover\\:text-white:hover{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.dark\\:focus\\:border-cyan-500\\/50:focus{border-color:#06b6d480}}.\\[\\&\\:\\:-webkit-scrollbar\\]\\:hidden::-webkit-scrollbar{display:none}";const target = window.__RUDRA_SHADOW_ROOT__ || document.head; target.appendChild(e);}}catch(err){}

package/package.json

@@ -42,5 +42,5 @@
   },
   "types": "./index.d.ts",
   "unpkg": "./index.umd.js",
-  "version": "1.0.12"
+  "version": "1.0.14"
 }