@wakastellar/ui 4.0.0 → 4.1.1

package/dist/components/waka-theme-creator/index.es.js

@@ -0,0 +1,457 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import { AlertDialog as t, AlertDialogAction as n, AlertDialogCancel as r, AlertDialogContent as i, AlertDialogDescription as a, AlertDialogFooter as o, AlertDialogHeader as s, AlertDialogTitle as c } from "../alert-dialog/index.es.js";
+import { Badge as l } from "../badge/index.es.js";
+import { Button as u } from "../button/index.es.js";
+import { Card as d, CardContent as f, CardDescription as p, CardHeader as m, CardTitle as h } from "../card/index.es.js";
+import { Label as g } from "../label/index.es.js";
+import { Input as _ } from "../input/index.es.js";
+import { Textarea as ee } from "../textarea/index.es.js";
+import { useToast as te } from "../../hooks/use-toast.es.js";
+import * as v from "react";
+import { Check as ne, Copy as re, Download as ie, Eye as ae, FileCode as oe, History as se, Loader2 as y, Palette as ce, Plus as le, Upload as ue } from "lucide-react";
+import { Fragment as b, jsx as x, jsxs as S } from "react/jsx-runtime";
+//#region src/components/waka-theme-creator/index.tsx
+function C({ s3Config: C, onSave: w, onDelete: de, onLoadTheme: T, existingThemes: E = [], className: fe }) {
+	let { toast: D } = te(), [O, k] = v.useState(""), [A, j] = v.useState(""), [M, N] = v.useState(""), [P, F] = v.useState("#3b82f6"), [I, L] = v.useState(""), [R, z] = v.useState(""), [B, V] = v.useState(""), [H, U] = v.useState(!1), [W, pe] = v.useState(!1), [me, he] = v.useState(!1), [ge, _e] = v.useState(!1), [G, ve] = v.useState(!1), [K, ye] = v.useState(null), [q, J] = v.useState([]), [Y, X] = v.useState("1.0.0"), Z = v.useRef(null), Q = v.useCallback((e) => {
+		if (!e.trim()) return {
+			valid: !1,
+			error: "Le CSS ne peut pas être vide"
+		};
+		let t = e.includes(":root") || e.includes(".dark"), n = e.includes("@theme inline");
+		return !t && !n ? {
+			valid: !1,
+			error: "Le CSS doit contenir :root, .dark ou @theme inline"
+		} : e.includes("--") ? { valid: !0 } : {
+			valid: !1,
+			error: "Le CSS doit contenir des variables CSS (--variable)"
+		};
+	}, []), be = v.useCallback(() => {
+		let e = Q(R);
+		if (!e.valid) {
+			D({
+				title: "CSS invalide",
+				description: e.error,
+				variant: "destructive"
+			});
+			return;
+		}
+		Z.current && Z.current.parentNode && Z.current.parentNode.removeChild(Z.current);
+		let t = document.createElement("style");
+		t.setAttribute("data-theme-preview", O), t.textContent = R, document.head.appendChild(t), Z.current = t, document.documentElement.setAttribute("data-theme", O), pe(!0), D({
+			title: "Prévisualisation activée",
+			description: `Le thème "${A}" est maintenant actif`
+		});
+	}, [
+		R,
+		O,
+		A,
+		Q,
+		D
+	]), $ = v.useCallback(() => {
+		Z.current && Z.current.parentNode && Z.current.parentNode.removeChild(Z.current), document.documentElement.removeAttribute("data-theme"), pe(!1), D({
+			title: "Prévisualisation arrêtée",
+			description: "Thème par défaut restauré"
+		});
+	}, [D]), xe = v.useCallback(async () => {
+		let e = Q(R);
+		if (!e.valid) {
+			D({
+				title: "CSS invalide",
+				description: e.error,
+				variant: "destructive"
+			});
+			return;
+		}
+		if (!O || !A) {
+			D({
+				title: "Informations manquantes",
+				description: "Veuillez renseigner l'ID et le nom du thème",
+				variant: "destructive"
+			});
+			return;
+		}
+		U(!0);
+		try {
+			let { baseUrl: e, method: t = "PUT", headers: n = {}, prefix: r = "", extension: i = "css" } = C, a = encodeURIComponent(O.replace(/\s+/g, "-").toLowerCase()), o = `${e.replace(/\/$/, "")}/${r}${a}.${i}`;
+			console.log(`[ThemeCreator] Uploading theme to: ${o}`);
+			let s = await fetch(o, {
+				method: t,
+				headers: {
+					"Content-Type": "text/css",
+					...n
+				},
+				body: R
+			});
+			if (!s.ok) throw Error(`Upload failed: ${s.status} ${s.statusText}`);
+			let c = {
+				version: Y,
+				createdAt: /* @__PURE__ */ new Date(),
+				createdBy: I || "Anonymous",
+				changelog: B || "No changelog provided",
+				css: R
+			}, l = [...q, c];
+			J(l);
+			let u = {
+				id: O,
+				label: A,
+				description: M,
+				previewColor: P,
+				author: I,
+				versions: l,
+				currentVersion: Y
+			}, d = `${e.replace(/\/$/, "")}/${r}${O}.json`;
+			await fetch(d, {
+				method: t,
+				headers: {
+					"Content-Type": "application/json",
+					...n
+				},
+				body: JSON.stringify(u, null, 2)
+			}), D({
+				title: "Thème publié !",
+				description: `Le thème "${A}" v${Y} a été uploadé sur S3`
+			}), w?.(u), V("");
+		} catch (e) {
+			console.error("[ThemeCreator] Upload error:", e), D({
+				title: "Erreur d'upload",
+				description: e instanceof Error ? e.message : "Une erreur est survenue",
+				variant: "destructive"
+			});
+		} finally {
+			U(!1);
+		}
+	}, [
+		R,
+		O,
+		A,
+		M,
+		P,
+		I,
+		Y,
+		B,
+		q,
+		C,
+		Q,
+		D,
+		w
+	]), Se = v.useCallback(async () => {
+		try {
+			await navigator.clipboard.writeText(R), he(!0), setTimeout(() => he(!1), 2e3), D({
+				title: "CSS copié !",
+				description: "Le code CSS a été copié dans le presse-papiers"
+			});
+		} catch {
+			D({
+				title: "Erreur de copie",
+				description: "Impossible de copier le CSS",
+				variant: "destructive"
+			});
+		}
+	}, [R, D]), Ce = v.useCallback(async (e) => {
+		ve(!0);
+		try {
+			let t = e;
+			if (T && (!e.versions || e.versions.length === 0 || !e.versions[0].css)) {
+				let n = await T(e.id);
+				if (n) t = n, D({
+					title: "Thème chargé",
+					description: `Thème "${t.label}" chargé depuis S3`
+				});
+				else {
+					D({
+						title: "Erreur",
+						description: `Impossible de charger le thème "${e.label}"`,
+						variant: "destructive"
+					});
+					return;
+				}
+			}
+			k(t.id), j(t.label), N(t.description || ""), F(t.previewColor || "#3b82f6"), L(t.author || ""), J(t.versions), X(t.currentVersion);
+			let n = t.versions[t.versions.length - 1];
+			n && z(n.css), ye(t);
+		} catch (e) {
+			console.error("[WakaThemeCreator] Error loading theme:", e), D({
+				title: "Erreur",
+				description: "Erreur lors du chargement du thème",
+				variant: "destructive"
+			});
+		} finally {
+			ve(!1);
+		}
+	}, [T, D]), we = v.useCallback(() => {
+		k(""), j(""), N(""), F("#3b82f6"), L(""), z(""), V(""), J([]), X("1.0.0"), ye(null), W && $();
+	}, [W, $]), Te = v.useCallback(() => {
+		let e = new Blob([R], { type: "text/css" }), t = URL.createObjectURL(e), n = document.createElement("a");
+		n.href = t, n.download = `${O || "theme"}.css`, document.body.appendChild(n), n.click(), document.body.removeChild(n), URL.revokeObjectURL(t), D({
+			title: "CSS téléchargé",
+			description: `Fichier ${O || "theme"}.css téléchargé`
+		});
+	}, [
+		R,
+		O,
+		D
+	]);
+	return /* @__PURE__ */ S("div", {
+		className: e("w-full max-w-6xl mx-auto space-y-6", fe),
+		children: [
+			/* @__PURE__ */ S("div", {
+				className: "flex items-center justify-between",
+				children: [/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("h1", {
+					className: "text-3xl font-bold",
+					children: "Créateur de Thèmes"
+				}), /* @__PURE__ */ x("p", {
+					className: "text-muted-foreground",
+					children: "Créez et publiez des thèmes TweakCN sur S3"
+				})] }), /* @__PURE__ */ S("div", {
+					className: "flex gap-2",
+					children: [/* @__PURE__ */ S(u, {
+						variant: "outline",
+						onClick: we,
+						children: [/* @__PURE__ */ x(le, { className: "mr-2 h-4 w-4" }), "Nouveau thème"]
+					}), W && /* @__PURE__ */ x(u, {
+						variant: "destructive",
+						onClick: $,
+						children: "Arrêter la prévisualisation"
+					})]
+				})]
+			}),
+			/* @__PURE__ */ S("div", {
+				className: "grid grid-cols-1 lg:grid-cols-3 gap-6",
+				children: [/* @__PURE__ */ S(d, {
+					className: "lg:col-span-1",
+					children: [/* @__PURE__ */ S(m, { children: [/* @__PURE__ */ x(h, { children: "Thèmes existants" }), /* @__PURE__ */ x(p, { children: "Chargez un thème pour le modifier" })] }), /* @__PURE__ */ x(f, {
+						className: "space-y-2",
+						children: E.length === 0 ? /* @__PURE__ */ x("p", {
+							className: "text-sm text-muted-foreground text-center py-4",
+							children: "Aucun thème existant"
+						}) : E.map((t) => /* @__PURE__ */ S("button", {
+							onClick: () => Ce(t),
+							disabled: G,
+							className: e("w-full flex items-center gap-3 p-3 rounded-lg border-2 transition-all text-left", K?.id === t.id ? "border-primary bg-primary/10" : "border-border hover:border-primary/50", G && "opacity-50 cursor-not-allowed"),
+							children: [/* @__PURE__ */ x("div", {
+								className: "w-8 h-8 rounded-full flex-shrink-0",
+								style: { backgroundColor: t.previewColor || "#3b82f6" }
+							}), /* @__PURE__ */ S("div", {
+								className: "flex-1 min-w-0",
+								children: [/* @__PURE__ */ S("div", {
+									className: "font-medium truncate flex items-center gap-2",
+									children: [t.label, G && K?.id === t.id && /* @__PURE__ */ x(y, { className: "h-4 w-4 animate-spin" })]
+								}), /* @__PURE__ */ S("div", {
+									className: "text-xs text-muted-foreground",
+									children: [
+										"v",
+										t.currentVersion || "1.0.0",
+										" • ",
+										t.versions?.length || 0,
+										" versions"
+									]
+								})]
+							})]
+						}, t.id))
+					})]
+				}), /* @__PURE__ */ S("div", {
+					className: "lg:col-span-2 space-y-6",
+					children: [
+						/* @__PURE__ */ S(d, { children: [/* @__PURE__ */ x(m, { children: /* @__PURE__ */ S(h, {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ x(ce, { className: "h-5 w-5" }), "Informations du thème"]
+						}) }), /* @__PURE__ */ S(f, {
+							className: "space-y-4",
+							children: [
+								/* @__PURE__ */ S("div", {
+									className: "grid grid-cols-2 gap-4",
+									children: [/* @__PURE__ */ S("div", {
+										className: "space-y-2",
+										children: [/* @__PURE__ */ x(g, {
+											htmlFor: "theme-id",
+											children: "ID du thème *"
+										}), /* @__PURE__ */ x(_, {
+											id: "theme-id",
+											placeholder: "ex: forest",
+											value: O,
+											onChange: (e) => k(e.target.value)
+										})]
+									}), /* @__PURE__ */ S("div", {
+										className: "space-y-2",
+										children: [/* @__PURE__ */ x(g, {
+											htmlFor: "theme-label",
+											children: "Nom d'affichage *"
+										}), /* @__PURE__ */ x(_, {
+											id: "theme-label",
+											placeholder: "ex: Forêt",
+											value: A,
+											onChange: (e) => j(e.target.value)
+										})]
+									})]
+								}),
+								/* @__PURE__ */ S("div", {
+									className: "space-y-2",
+									children: [/* @__PURE__ */ x(g, {
+										htmlFor: "theme-description",
+										children: "Description"
+									}), /* @__PURE__ */ x(_, {
+										id: "theme-description",
+										placeholder: "Thème inspiré de la nature",
+										value: M,
+										onChange: (e) => N(e.target.value)
+									})]
+								}),
+								/* @__PURE__ */ S("div", {
+									className: "grid grid-cols-2 gap-4",
+									children: [/* @__PURE__ */ S("div", {
+										className: "space-y-2",
+										children: [/* @__PURE__ */ x(g, {
+											htmlFor: "theme-color",
+											children: "Couleur de prévisualisation"
+										}), /* @__PURE__ */ S("div", {
+											className: "flex gap-2",
+											children: [/* @__PURE__ */ x(_, {
+												id: "theme-color",
+												type: "color",
+												value: P,
+												onChange: (e) => F(e.target.value),
+												className: "w-16 h-10 p-1"
+											}), /* @__PURE__ */ x(_, {
+												value: P,
+												onChange: (e) => F(e.target.value),
+												placeholder: "#3b82f6"
+											})]
+										})]
+									}), /* @__PURE__ */ S("div", {
+										className: "space-y-2",
+										children: [/* @__PURE__ */ x(g, {
+											htmlFor: "theme-author",
+											children: "Auteur"
+										}), /* @__PURE__ */ x(_, {
+											id: "theme-author",
+											placeholder: "Votre nom",
+											value: I,
+											onChange: (e) => L(e.target.value)
+										})]
+									})]
+								}),
+								/* @__PURE__ */ S("div", {
+									className: "grid grid-cols-2 gap-4",
+									children: [/* @__PURE__ */ S("div", {
+										className: "space-y-2",
+										children: [/* @__PURE__ */ x(g, {
+											htmlFor: "theme-version",
+											children: "Version"
+										}), /* @__PURE__ */ x(_, {
+											id: "theme-version",
+											placeholder: "1.0.0",
+											value: Y,
+											onChange: (e) => X(e.target.value)
+										})]
+									}), /* @__PURE__ */ S("div", {
+										className: "space-y-2",
+										children: [/* @__PURE__ */ x(g, {
+											htmlFor: "theme-changelog",
+											children: "Changelog"
+										}), /* @__PURE__ */ x(_, {
+											id: "theme-changelog",
+											placeholder: "Modifications apportées",
+											value: B,
+											onChange: (e) => V(e.target.value)
+										})]
+									})]
+								})
+							]
+						})] }),
+						/* @__PURE__ */ S(d, { children: [/* @__PURE__ */ S(m, { children: [/* @__PURE__ */ S(h, {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ x(oe, { className: "h-5 w-5" }), "Code CSS TweakCN"]
+						}), /* @__PURE__ */ x(p, { children: "Collez le CSS généré par TweakCN ici" })] }), /* @__PURE__ */ S(f, {
+							className: "space-y-4",
+							children: [/* @__PURE__ */ x(ee, {
+								placeholder: ":root {\n  --background: oklch(0.9911 0 0);\n  --foreground: oklch(0.2046 0 0);\n  --primary: oklch(0.8348 0.1302 160.9080);\n  --primary-foreground: oklch(0.2626 0.0147 166.4589);\n  --secondary: oklch(0.9940 0 0);\n  --secondary-foreground: oklch(0.2046 0 0);\n  --muted: oklch(0.9461 0 0);\n  --muted-foreground: oklch(0.2435 0 0);\n  --accent: oklch(0.9461 0 0);\n  --accent-foreground: oklch(0.2435 0 0);\n  --destructive: oklch(0.5523 0.1927 32.7272);\n  --destructive-foreground: oklch(0.9934 0.0032 17.2118);\n  --border: oklch(0.9037 0 0);\n  --ring: oklch(0.8348 0.1302 160.9080);\n  --radius: 0.5rem;\n}\n\n.dark {\n  --background: oklch(0.1822 0 0);\n  --foreground: oklch(0.9288 0.0126 255.5078);\n  --primary: oklch(0.4365 0.1044 156.7556);\n  --primary-foreground: oklch(0.9213 0.0135 167.1556);\n}\n\n@theme inline {\n  --color-background: var(--background);\n  --color-foreground: var(--foreground);\n  --color-primary: var(--primary);\n  --color-primary-foreground: var(--primary-foreground);\n  /* ... autres couleurs ... */\n}",
+								value: R,
+								onChange: (e) => z(e.target.value),
+								className: "font-mono text-sm min-h-[300px]"
+							}), /* @__PURE__ */ S("div", {
+								className: "flex flex-wrap gap-2",
+								children: [
+									/* @__PURE__ */ S(u, {
+										onClick: be,
+										disabled: W,
+										children: [/* @__PURE__ */ x(ae, { className: "mr-2 h-4 w-4" }), "Prévisualiser"]
+									}),
+									/* @__PURE__ */ x(u, {
+										variant: "outline",
+										onClick: Se,
+										children: me ? /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x(ne, { className: "mr-2 h-4 w-4" }), "Copié !"] }) : /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x(re, { className: "mr-2 h-4 w-4" }), "Copier CSS"] })
+									}),
+									/* @__PURE__ */ S(u, {
+										variant: "outline",
+										onClick: Te,
+										children: [/* @__PURE__ */ x(ie, { className: "mr-2 h-4 w-4" }), "Télécharger"]
+									}),
+									/* @__PURE__ */ x("div", {
+										className: "ml-auto",
+										children: /* @__PURE__ */ x(u, {
+											onClick: xe,
+											disabled: H,
+											children: H ? /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x(y, { className: "mr-2 h-4 w-4 animate-spin" }), "Publication..."] }) : /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x(ue, { className: "mr-2 h-4 w-4" }), "Publier sur S3"] })
+										})
+									})
+								]
+							})]
+						})] }),
+						q.length > 0 && /* @__PURE__ */ S(d, { children: [/* @__PURE__ */ x(m, { children: /* @__PURE__ */ S(h, {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ x(se, { className: "h-5 w-5" }), "Historique des versions"]
+						}) }), /* @__PURE__ */ x(f, { children: /* @__PURE__ */ x("div", {
+							className: "space-y-3",
+							children: q.slice().reverse().map((e, t) => /* @__PURE__ */ S("div", {
+								className: "flex items-start gap-3 p-3 border rounded-lg",
+								children: [
+									/* @__PURE__ */ S(l, {
+										variant: "outline",
+										children: ["v", e.version]
+									}),
+									/* @__PURE__ */ S("div", {
+										className: "flex-1",
+										children: [/* @__PURE__ */ x("p", {
+											className: "text-sm font-medium",
+											children: e.changelog || "Aucune description"
+										}), /* @__PURE__ */ S("p", {
+											className: "text-xs text-muted-foreground",
+											children: [
+												"Par ",
+												e.createdBy,
+												" • ",
+												e.createdAt.toLocaleDateString()
+											]
+										})]
+									}),
+									/* @__PURE__ */ x(u, {
+										variant: "ghost",
+										size: "sm",
+										onClick: () => z(e.css),
+										children: "Charger"
+									})
+								]
+							}, t))
+						}) })] })
+					]
+				})]
+			}),
+			/* @__PURE__ */ x(t, {
+				open: ge,
+				onOpenChange: _e,
+				children: /* @__PURE__ */ S(i, { children: [/* @__PURE__ */ S(s, { children: [/* @__PURE__ */ x(c, { children: "Supprimer le thème ?" }), /* @__PURE__ */ x(a, { children: "Cette action est irréversible. Le thème sera supprimé de S3." })] }), /* @__PURE__ */ S(o, { children: [/* @__PURE__ */ x(r, { children: "Annuler" }), /* @__PURE__ */ x(n, {
+					onClick: () => {
+						K && (de?.(K.id), we()), _e(!1);
+					},
+					className: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+					children: "Supprimer"
+				})] })] })
+			})
+		]
+	});
+}
+C.displayName = "WakaThemeCreator";
+//#endregion
+export { C as WakaThemeCreator };

package/dist/components/waka-theme-manager/index.cjs.js

@@ -0,0 +1 @@
+"use client";"use client";const e=require("../../_virtual/_rolldown/runtime.cjs.js"),t=require("../../utils/cn.cjs.js"),n=require("../badge/index.cjs.js"),r=require("../button/index.cjs.js"),i=require("../card/index.cjs.js"),a=require("../label/index.cjs.js"),o=require("../input/index.cjs.js"),s=require("../separator/index.cjs.js"),c=require("../textarea/index.cjs.js"),l=require("../../context/theme-provider.cjs.js");let u=require("react");u=e.__toESM(u);let d=require("lucide-react"),f=require("class-variance-authority"),p=require("react/jsx-runtime");function m(){try{return l.useTheme()}catch{return null}}var h=(0,f.cva)(`w-full`,{variants:{size:{sm:`max-w-2xl`,base:`max-w-4xl`,lg:`max-w-6xl`,full:`max-w-full`}},defaultVariants:{size:`base`}}),g=u.forwardRef(({className:e,size:l,onThemeChange:f,onThemeLoad:g,onThemeSave:_,initialTheme:v,showPreview:y=!0,showExport:b=!0,showImport:x=!0,allowCustomColors:S=!0,...C},w)=>{let T=m(),E=T?.currentTheme,D=T?.themes||[],O=T?.changeTheme,[k,A]=(0,u.useState)(v||{name:`Custom Theme`,description:`Thème personnalisé`,colors:{background:`#ffffff`,foreground:`#0a0a0a`,card:`#ffffff`,cardForeground:`#0a0a0a`,popover:`#ffffff`,popoverForeground:`#0a0a0a`,primary:`#0a0a0a`,primaryForeground:`#fafafa`,secondary:`#f4f4f5`,secondaryForeground:`#0a0a0a`,muted:`#f4f4f5`,mutedForeground:`#737373`,accent:`#f4f4f5`,accentForeground:`#0a0a0a`,destructive:`#ef4444`,destructiveForeground:`#fafafa`,border:`#e4e4e7`,input:`#e4e4e7`,ring:`#0a0a0a`}}),[j,M]=(0,u.useState)(!1),[N,P]=(0,u.useState)(null),[F,I]=(0,u.useState)(null),[L,R]=(0,u.useState)(``),[z,B]=(0,u.useState)(!1),[V,H]=(0,u.useState)(`auto`),U=(0,u.useCallback)(e=>{let t=document.documentElement;if(Object.entries(e.colors).forEach(([e,n])=>{let r=`--${e.replace(/([A-Z])/g,`-$1`).toLowerCase()}`;t.style.setProperty(r,n)}),O){let t=e.name.toLowerCase().replace(/\s+/g,`-`);O(t)}},[O]),W=async e=>{M(!0),P(null),I(null);try{let t=await fetch(e);if(!t.ok)throw Error(`Erreur HTTP: ${t.status}`);let n=await t.json();if(!n.name||!n.colors)throw Error(`Format de thème invalide`);let r={name:n.name,description:n.description||``,author:n.author||``,version:n.version||`1.0.0`,colors:{background:n.colors.background||`#ffffff`,foreground:n.colors.foreground||`#0a0a0a`,card:n.colors.card||`#ffffff`,cardForeground:n.colors.cardForeground||`#0a0a0a`,popover:n.colors.popover||`#ffffff`,popoverForeground:n.colors.popoverForeground||`#0a0a0a`,primary:n.colors.primary||`#0a0a0a`,primaryForeground:n.colors.primaryForeground||`#fafafa`,secondary:n.colors.secondary||`#f4f4f5`,secondaryForeground:n.colors.secondaryForeground||`#0a0a0a`,muted:n.colors.muted||`#f4f4f5`,mutedForeground:n.colors.mutedForeground||`#737373`,accent:n.colors.accent||`#f4f4f5`,accentForeground:n.colors.accentForeground||`#0a0a0a`,destructive:n.colors.destructive||`#ef4444`,destructiveForeground:n.colors.destructiveForeground||`#fafafa`,border:n.colors.border||`#e4e4e7`,input:n.colors.input||`#e4e4e7`,ring:n.colors.ring||`#0a0a0a`,chart1:n.colors.chart1,chart2:n.colors.chart2,chart3:n.colors.chart3,chart4:n.colors.chart4,chart5:n.colors.chart5}};A(r),U(r),g?.(r),I(`Thème chargé avec succès !`)}catch(e){P(e instanceof Error?e.message:`Erreur lors du chargement du thème`)}finally{M(!1)}},G=()=>{let e=JSON.stringify(k,null,2),t=new Blob([e],{type:`application/json`}),n=URL.createObjectURL(t),r=document.createElement(`a`);r.href=n,r.download=`${k.name.toLowerCase().replace(/\s+/g,`-`)}-theme.json`,document.body.appendChild(r),r.click(),document.body.removeChild(r),URL.revokeObjectURL(n)},K=async()=>{try{await navigator.clipboard.writeText(JSON.stringify(k,null,2)),B(!0),setTimeout(()=>B(!1),2e3)}catch{P(`Impossible de copier le thème`)}},q=(e,t)=>{let n={...k,colors:{...k.colors,[e]:t}};A(n),U(n),f?.(n)},J=()=>{_?.(k),I(`Thème sauvegardé !`)};return(0,u.useEffect)(()=>{U(k)},[k,U]),(0,u.useEffect)(()=>{let e=document.documentElement;V===`dark`?e.classList.add(`dark`):V===`light`?e.classList.remove(`dark`):window.matchMedia(`(prefers-color-scheme: dark)`).matches?e.classList.add(`dark`):e.classList.remove(`dark`)},[V]),(0,p.jsx)(`div`,{ref:w,className:t.cn(h({size:l}),e),...C,children:(0,p.jsxs)(`div`,{className:`space-y-6`,children:[(0,p.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,p.jsxs)(`div`,{children:[(0,p.jsx)(`h2`,{className:`text-2xl font-bold`,children:`Gestionnaire de Thèmes TweakCN`}),(0,p.jsx)(`p`,{className:`text-muted-foreground`,children:`Créez, importez et prévisualisez vos thèmes personnalisés`})]}),(0,p.jsx)(`div`,{className:`flex items-center gap-2`,children:(0,p.jsxs)(n.Badge,{variant:`outline`,className:`flex items-center gap-1`,children:[(0,p.jsx)(d.Palette,{className:`h-3 w-3`}),k.name]})})]}),N&&(0,p.jsxs)(`div`,{className:`flex items-center gap-2 p-3 bg-destructive/10 border border-destructive/20 rounded-lg text-destructive`,children:[(0,p.jsx)(d.AlertCircle,{className:`h-4 w-4`}),(0,p.jsx)(`span`,{className:`text-sm`,children:N})]}),F&&(0,p.jsxs)(`div`,{className:`flex items-center gap-2 p-3 bg-green-500/10 border border-green-500/20 rounded-lg text-green-600`,children:[(0,p.jsx)(d.CheckCircle,{className:`h-4 w-4`}),(0,p.jsx)(`span`,{className:`text-sm`,children:F})]}),(0,p.jsxs)(`div`,{className:`grid grid-cols-1 lg:grid-cols-2 gap-6`,children:[(0,p.jsxs)(`div`,{className:`space-y-6`,children:[(0,p.jsxs)(i.Card,{children:[(0,p.jsx)(i.CardHeader,{children:(0,p.jsxs)(i.CardTitle,{className:`flex items-center gap-2`,children:[(0,p.jsx)(d.Settings,{className:`h-5 w-5`}),`Informations du thème`]})}),(0,p.jsxs)(i.CardContent,{className:`space-y-4`,children:[(0,p.jsxs)(`div`,{className:`grid grid-cols-2 gap-4`,children:[(0,p.jsxs)(`div`,{children:[(0,p.jsx)(a.Label,{htmlFor:`theme-name`,children:`Nom`}),(0,p.jsx)(o.Input,{id:`theme-name`,value:k.name,onChange:e=>A({...k,name:e.target.value}),placeholder:`Mon thème`})]}),(0,p.jsxs)(`div`,{children:[(0,p.jsx)(a.Label,{htmlFor:`theme-author`,children:`Auteur`}),(0,p.jsx)(o.Input,{id:`theme-author`,value:k.author||``,onChange:e=>A({...k,author:e.target.value}),placeholder:`Votre nom`})]})]}),(0,p.jsxs)(`div`,{children:[(0,p.jsx)(a.Label,{htmlFor:`theme-description`,children:`Description`}),(0,p.jsx)(c.Textarea,{id:`theme-description`,value:k.description||``,onChange:e=>A({...k,description:e.target.value}),placeholder:`Description du thème...`,rows:3})]})]})]}),(x||b)&&(0,p.jsxs)(i.Card,{children:[(0,p.jsx)(i.CardHeader,{children:(0,p.jsxs)(i.CardTitle,{className:`flex items-center gap-2`,children:[(0,p.jsx)(d.Upload,{className:`h-5 w-5`}),`Import / Export`]})}),(0,p.jsxs)(i.CardContent,{className:`space-y-4`,children:[x&&(0,p.jsxs)(`div`,{children:[(0,p.jsx)(a.Label,{htmlFor:`import-url`,children:`URL du thème JSON`}),(0,p.jsxs)(`div`,{className:`flex gap-2`,children:[(0,p.jsx)(o.Input,{id:`import-url`,value:L,onChange:e=>R(e.target.value),placeholder:`https://example.com/theme.json`,className:`flex-1`}),(0,p.jsx)(r.Button,{onClick:()=>W(L),disabled:!L||j,size:`sm`,children:j?(0,p.jsx)(d.RefreshCw,{className:`h-4 w-4 animate-spin`}):(0,p.jsx)(d.Download,{className:`h-4 w-4`})})]})]}),b&&(0,p.jsxs)(`div`,{className:`flex gap-2`,children:[(0,p.jsxs)(r.Button,{onClick:G,variant:`outline`,className:`flex-1`,children:[(0,p.jsx)(d.Download,{className:`h-4 w-4 mr-2`}),`Exporter JSON`]}),(0,p.jsx)(r.Button,{onClick:K,variant:`outline`,children:z?(0,p.jsx)(d.Check,{className:`h-4 w-4`}):(0,p.jsx)(d.Copy,{className:`h-4 w-4`})})]})]})]}),y&&(0,p.jsxs)(i.Card,{children:[(0,p.jsx)(i.CardHeader,{children:(0,p.jsxs)(i.CardTitle,{className:`flex items-center gap-2`,children:[(0,p.jsx)(d.Eye,{className:`h-5 w-5`}),`Prévisualisation`]})}),(0,p.jsx)(i.CardContent,{children:(0,p.jsxs)(`div`,{className:`space-y-4`,children:[(0,p.jsxs)(`div`,{className:`flex gap-2`,children:[(0,p.jsxs)(r.Button,{variant:V===`light`?`default`:`outline`,size:`sm`,onClick:()=>H(`light`),children:[(0,p.jsx)(d.Sun,{className:`h-4 w-4 mr-2`}),`Clair`]}),(0,p.jsxs)(r.Button,{variant:V===`dark`?`default`:`outline`,size:`sm`,onClick:()=>H(`dark`),children:[(0,p.jsx)(d.Moon,{className:`h-4 w-4 mr-2`}),`Sombre`]}),(0,p.jsxs)(r.Button,{variant:V===`auto`?`default`:`outline`,size:`sm`,onClick:()=>H(`auto`),children:[(0,p.jsx)(d.Monitor,{className:`h-4 w-4 mr-2`}),`Auto`]})]}),E&&(0,p.jsxs)(`div`,{className:`text-sm text-muted-foreground`,children:[(0,p.jsxs)(`div`,{className:`flex justify-between`,children:[(0,p.jsx)(`span`,{children:`Thème actuel:`}),(0,p.jsx)(`span`,{className:`font-medium`,children:E})]}),(0,p.jsxs)(`div`,{className:`flex justify-between`,children:[(0,p.jsx)(`span`,{children:`Mode sombre:`}),(0,p.jsx)(`span`,{className:`font-medium`,children:`Géré par le système`})]}),(0,p.jsxs)(`div`,{className:`flex justify-between`,children:[(0,p.jsx)(`span`,{children:`Thèmes disponibles:`}),(0,p.jsx)(`span`,{className:`font-medium`,children:D.length})]})]})]})})]}),(0,p.jsxs)(`div`,{className:`flex gap-2`,children:[(0,p.jsx)(r.Button,{onClick:J,className:`flex-1`,children:`Sauvegarder le thème`}),(0,p.jsxs)(r.Button,{variant:`outline`,onClick:()=>window.open(`https://tweakcn.com`,`_blank`),children:[(0,p.jsx)(d.ExternalLink,{className:`h-4 w-4 mr-2`}),`TweakCN`]})]})]}),S&&(0,p.jsx)(`div`,{className:`space-y-6`,children:(0,p.jsxs)(i.Card,{children:[(0,p.jsxs)(i.CardHeader,{children:[(0,p.jsxs)(i.CardTitle,{className:`flex items-center gap-2`,children:[(0,p.jsx)(d.Palette,{className:`h-5 w-5`}),`Couleurs du thème`]}),(0,p.jsx)(i.CardDescription,{children:`Cliquez sur une couleur pour la modifier`})]}),(0,p.jsx)(i.CardContent,{children:(0,p.jsx)(`div`,{className:`grid grid-cols-2 gap-4`,children:Object.entries(k.colors).map(([e,t])=>(0,p.jsxs)(`div`,{className:`space-y-2`,children:[(0,p.jsx)(a.Label,{htmlFor:`color-${e}`,className:`text-sm font-medium`,children:e.replace(/([A-Z])/g,` $1`).replace(/^./,e=>e.toUpperCase())}),(0,p.jsxs)(`div`,{className:`flex gap-2`,children:[(0,p.jsx)(`div`,{className:`w-10 h-10 rounded border border-border cursor-pointer`,style:{backgroundColor:t},onClick:()=>{document.getElementById(`color-${e}`)?.click()}}),(0,p.jsx)(o.Input,{id:`color-${e}`,type:`color`,value:t,onChange:t=>q(e,t.target.value),className:`flex-1 h-10`})]})]},e))})})]})})]}),y&&(0,p.jsxs)(i.Card,{children:[(0,p.jsx)(i.CardHeader,{children:(0,p.jsxs)(i.CardTitle,{className:`flex items-center gap-2`,children:[(0,p.jsx)(d.Eye,{className:`h-5 w-5`}),`Prévisualisation en temps réel`]})}),(0,p.jsx)(i.CardContent,{children:(0,p.jsxs)(`div`,{className:`grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4`,children:[(0,p.jsxs)(`div`,{className:`space-y-2`,children:[(0,p.jsx)(`h4`,{className:`font-medium`,children:`Boutons`}),(0,p.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,p.jsx)(r.Button,{size:`sm`,children:`Primary`}),(0,p.jsx)(r.Button,{variant:`secondary`,size:`sm`,children:`Secondary`}),(0,p.jsx)(r.Button,{variant:`outline`,size:`sm`,children:`Outline`}),(0,p.jsx)(r.Button,{variant:`destructive`,size:`sm`,children:`Destructive`})]})]}),(0,p.jsxs)(`div`,{className:`space-y-2`,children:[(0,p.jsx)(`h4`,{className:`font-medium`,children:`Cards`}),(0,p.jsxs)(i.Card,{className:`p-3`,children:[(0,p.jsx)(i.CardTitle,{className:`text-sm`,children:`Exemple de carte`}),(0,p.jsx)(i.CardDescription,{className:`text-xs`,children:`Contenu de la carte avec le nouveau thème`})]})]}),(0,p.jsxs)(`div`,{className:`space-y-2`,children:[(0,p.jsx)(`h4`,{className:`font-medium`,children:`Inputs`}),(0,p.jsxs)(`div`,{className:`space-y-2`,children:[(0,p.jsx)(o.Input,{placeholder:`Input normal`}),(0,p.jsx)(o.Input,{placeholder:`Input avec erreur`,className:`border-destructive`})]})]}),(0,p.jsxs)(`div`,{className:`space-y-2`,children:[(0,p.jsx)(`h4`,{className:`font-medium`,children:`Badges`}),(0,p.jsxs)(`div`,{className:`flex flex-wrap gap-1`,children:[(0,p.jsx)(n.Badge,{children:`Default`}),(0,p.jsx)(n.Badge,{variant:`secondary`,children:`Secondary`}),(0,p.jsx)(n.Badge,{variant:`destructive`,children:`Destructive`}),(0,p.jsx)(n.Badge,{variant:`outline`,children:`Outline`})]})]}),(0,p.jsxs)(`div`,{className:`space-y-2`,children:[(0,p.jsx)(`h4`,{className:`font-medium`,children:`Séparateur`}),(0,p.jsx)(s.Separator,{}),(0,p.jsx)(`p`,{className:`text-sm text-muted-foreground`,children:`Texte avec couleur muted`})]}),(0,p.jsxs)(`div`,{className:`space-y-2`,children:[(0,p.jsx)(`h4`,{className:`font-medium`,children:`Progress`}),(0,p.jsx)(`div`,{className:`w-full bg-muted rounded-full h-2`,children:(0,p.jsx)(`div`,{className:`bg-primary h-2 rounded-full`,style:{width:`60%`}})})]})]})})]})]})})});g.displayName=`WakaThemeManager`,exports.WakaThemeManager=g,exports.themeManagerVariants=h;

package/dist/components/waka-theme-manager/index.d.ts

@@ -1,8 +1,8 @@
 import * as React from "react";
 import { type VariantProps } from "class-variance-authority";
-declare const themeManagerVariants: (props?: {
-    size?: "sm" | "lg" | "base" | "full";
-} & import("class-variance-authority/types").ClassProp) => string;
+declare const themeManagerVariants: (props?: ({
+    size?: "sm" | "lg" | "base" | "full" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export interface TweakCNTheme {
     name: string;
     description?: string;