@wakastellar/ui 4.0.0 → 4.1.1

package/dist/blocks/settings/index.es.js

@@ -0,0 +1,348 @@
+"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, AlertDialogTrigger as l } from "../../components/alert-dialog/index.es.js";
+import { Button as u } from "../../components/button/index.es.js";
+import { Card as d, CardContent as f, CardDescription as p, CardHeader as m, CardTitle as h } from "../../components/card/index.es.js";
+import { Label as g } from "../../components/label/index.es.js";
+import { Input as _ } from "../../components/input/index.es.js";
+import { Select as v, SelectContent as y, SelectItem as b, SelectTrigger as x, SelectValue as S } from "../../components/select/index.es.js";
+import { Separator as C } from "../../components/separator/index.es.js";
+import { Switch as w } from "../../components/switch/index.es.js";
+import { Tabs as T, TabsContent as E, TabsList as D, TabsTrigger as O } from "../../components/tabs/index.es.js";
+import { Textarea as k } from "../../components/textarea/index.es.js";
+import * as A from "react";
+import { Bell as j, Loader2 as M, Lock as N, Mail as P, Palette as F, Save as I, Shield as L, Smartphone as R, Trash2 as z, User as B } from "lucide-react";
+import { jsx as V, jsxs as H } from "react/jsx-runtime";
+//#region src/blocks/settings/index.tsx
+function U({ field: e, value: t, onChange: n }) {
+	let r = (e) => {
+		n?.(e);
+	};
+	return e.type === "custom" && e.customComponent ? /* @__PURE__ */ V("div", {
+		className: "space-y-2",
+		children: e.customComponent
+	}) : /* @__PURE__ */ H("div", {
+		className: "space-y-2",
+		children: [
+			/* @__PURE__ */ H("div", {
+				className: "flex items-center justify-between",
+				children: [/* @__PURE__ */ H(g, {
+					htmlFor: e.id,
+					className: "text-sm font-medium",
+					children: [e.label, e.required && /* @__PURE__ */ V("span", {
+						className: "text-destructive ml-1",
+						children: "*"
+					})]
+				}), e.type === "switch" && /* @__PURE__ */ V(w, {
+					id: e.id,
+					checked: t,
+					onCheckedChange: r,
+					disabled: e.disabled
+				})]
+			}),
+			e.description && e.type !== "switch" && /* @__PURE__ */ V("p", {
+				className: "text-xs text-muted-foreground",
+				children: e.description
+			}),
+			e.type === "switch" && e.description && /* @__PURE__ */ V("p", {
+				className: "text-xs text-muted-foreground",
+				children: e.description
+			}),
+			e.type === "text" && /* @__PURE__ */ V(_, {
+				id: e.id,
+				type: "text",
+				value: t || "",
+				onChange: (e) => r(e.target.value),
+				placeholder: e.placeholder,
+				disabled: e.disabled
+			}),
+			e.type === "email" && /* @__PURE__ */ V(_, {
+				id: e.id,
+				type: "email",
+				value: t || "",
+				onChange: (e) => r(e.target.value),
+				placeholder: e.placeholder,
+				disabled: e.disabled
+			}),
+			e.type === "password" && /* @__PURE__ */ V(_, {
+				id: e.id,
+				type: "password",
+				value: t || "",
+				onChange: (e) => r(e.target.value),
+				placeholder: e.placeholder,
+				disabled: e.disabled
+			}),
+			e.type === "textarea" && /* @__PURE__ */ V(k, {
+				id: e.id,
+				value: t || "",
+				onChange: (e) => r(e.target.value),
+				placeholder: e.placeholder,
+				disabled: e.disabled,
+				rows: 3
+			}),
+			e.type === "select" && e.options && /* @__PURE__ */ H(v, {
+				value: t,
+				onValueChange: r,
+				disabled: e.disabled,
+				children: [/* @__PURE__ */ V(x, {
+					id: e.id,
+					children: /* @__PURE__ */ V(S, { placeholder: e.placeholder || "Sélectionner..." })
+				}), /* @__PURE__ */ V(y, { children: e.options.map((e) => /* @__PURE__ */ V(b, {
+					value: e.value,
+					children: e.label
+				}, e.value)) })]
+			})
+		]
+	});
+}
+function W({ section: e, values: t, onChange: n }) {
+	return /* @__PURE__ */ H(d, { children: [/* @__PURE__ */ V(m, { children: /* @__PURE__ */ H("div", {
+		className: "flex items-center gap-2",
+		children: [e.icon && /* @__PURE__ */ V("span", {
+			className: "text-muted-foreground",
+			children: e.icon
+		}), /* @__PURE__ */ H("div", { children: [/* @__PURE__ */ V(h, {
+			className: "text-base",
+			children: e.title
+		}), e.description && /* @__PURE__ */ V(p, { children: e.description })] })]
+	}) }), /* @__PURE__ */ V(f, {
+		className: "space-y-6",
+		children: e.fields.map((r, i) => /* @__PURE__ */ H(A.Fragment, { children: [/* @__PURE__ */ V(U, {
+			field: r,
+			value: t?.[r.id],
+			onChange: (e) => n?.(r.id, e)
+		}), i < e.fields.length - 1 && /* @__PURE__ */ V(C, { className: "my-4" })] }, r.id))
+	})] });
+}
+function G({ title: g = "Paramètres", description: _ = "Gérez les paramètres de votre compte et de l'application.", tabs: v, sections: y, useTabs: b = !0, defaultTab: x, values: S = {}, onChange: C, onSave: w, saving: k = !1, showSaveButton: j = !0, showDeleteAccount: N = !1, onDeleteAccount: P, className: F }) {
+	let [L, R] = A.useState(S), [B, U] = A.useState(!1);
+	A.useEffect(() => {
+		R(S);
+	}, [S]);
+	let G = (e, t) => {
+		R((n) => ({
+			...n,
+			[e]: t
+		})), U(!0), C?.(e, t);
+	}, K = async () => {
+		await w?.(L), U(!1);
+	}, q = (e) => /* @__PURE__ */ V("div", {
+		className: "space-y-6",
+		children: e.map((e) => /* @__PURE__ */ V(W, {
+			section: e,
+			values: L,
+			onChange: G
+		}, e.id))
+	});
+	return /* @__PURE__ */ H("div", {
+		className: e("space-y-6", F),
+		children: [
+			/* @__PURE__ */ H("div", {
+				className: "flex flex-col gap-4 md:flex-row md:items-center md:justify-between",
+				children: [/* @__PURE__ */ H("div", { children: [/* @__PURE__ */ V("h1", {
+					className: "text-2xl font-bold tracking-tight",
+					children: g
+				}), _ && /* @__PURE__ */ V("p", {
+					className: "text-muted-foreground mt-1",
+					children: _
+				})] }), j && w && /* @__PURE__ */ H(u, {
+					onClick: K,
+					disabled: k || !B,
+					children: [k ? /* @__PURE__ */ V(M, { className: "mr-2 h-4 w-4 animate-spin" }) : /* @__PURE__ */ V(I, { className: "mr-2 h-4 w-4" }), "Enregistrer"]
+				})]
+			}),
+			b && v && v.length > 0 ? /* @__PURE__ */ H(T, {
+				defaultValue: x || v[0].id,
+				className: "space-y-6",
+				children: [/* @__PURE__ */ V(D, {
+					className: "grid w-full grid-cols-2 md:w-auto md:inline-flex",
+					children: v.map((e) => /* @__PURE__ */ H(O, {
+						value: e.id,
+						className: "gap-2",
+						children: [e.icon, e.label]
+					}, e.id))
+				}), v.map((e) => /* @__PURE__ */ V(E, {
+					value: e.id,
+					className: "space-y-6",
+					children: q(e.sections)
+				}, e.id))]
+			}) : y && q(y),
+			N && P && /* @__PURE__ */ H(d, {
+				className: "border-destructive",
+				children: [/* @__PURE__ */ H(m, { children: [/* @__PURE__ */ H(h, {
+					className: "text-base text-destructive flex items-center gap-2",
+					children: [/* @__PURE__ */ V(z, { className: "h-4 w-4" }), "Zone dangereuse"]
+				}), /* @__PURE__ */ V(p, { children: "Actions irréversibles concernant votre compte." })] }), /* @__PURE__ */ V(f, { children: /* @__PURE__ */ H(t, { children: [/* @__PURE__ */ V(l, {
+					asChild: !0,
+					children: /* @__PURE__ */ H(u, {
+						variant: "destructive",
+						children: [/* @__PURE__ */ V(z, { className: "mr-2 h-4 w-4" }), "Supprimer mon compte"]
+					})
+				}), /* @__PURE__ */ H(i, { children: [/* @__PURE__ */ H(s, { children: [/* @__PURE__ */ V(c, { children: "Êtes-vous sûr ?" }), /* @__PURE__ */ V(a, { children: "Cette action est irréversible. Toutes vos données seront définitivement supprimées et ne pourront pas être récupérées." })] }), /* @__PURE__ */ H(o, { children: [/* @__PURE__ */ V(r, { children: "Annuler" }), /* @__PURE__ */ V(n, {
+					onClick: P,
+					className: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+					children: "Supprimer définitivement"
+				})] })] })] }) })]
+			})
+		]
+	});
+}
+var K = [
+	{
+		id: "profile",
+		label: "Profil",
+		icon: /* @__PURE__ */ V(B, { className: "h-4 w-4" }),
+		sections: [{
+			id: "personal",
+			title: "Informations personnelles",
+			description: "Mettez à jour vos informations personnelles.",
+			icon: /* @__PURE__ */ V(B, { className: "h-5 w-5" }),
+			fields: [
+				{
+					id: "name",
+					label: "Nom complet",
+					type: "text",
+					placeholder: "Jean Dupont",
+					required: !0
+				},
+				{
+					id: "email",
+					label: "Adresse email",
+					type: "email",
+					placeholder: "jean@exemple.com",
+					required: !0
+				},
+				{
+					id: "bio",
+					label: "Bio",
+					type: "textarea",
+					placeholder: "Parlez-nous de vous..."
+				}
+			]
+		}]
+	},
+	{
+		id: "notifications",
+		label: "Notifications",
+		icon: /* @__PURE__ */ V(j, { className: "h-4 w-4" }),
+		sections: [{
+			id: "email-notifs",
+			title: "Notifications par email",
+			description: "Gérez vos préférences de notification par email.",
+			icon: /* @__PURE__ */ V(P, { className: "h-5 w-5" }),
+			fields: [
+				{
+					id: "notif-marketing",
+					label: "Marketing",
+					description: "Recevoir des emails marketing et promotionnels.",
+					type: "switch"
+				},
+				{
+					id: "notif-security",
+					label: "Sécurité",
+					description: "Recevoir des alertes de sécurité importantes.",
+					type: "switch"
+				},
+				{
+					id: "notif-updates",
+					label: "Mises à jour",
+					description: "Recevoir les mises à jour de produit.",
+					type: "switch"
+				}
+			]
+		}]
+	},
+	{
+		id: "security",
+		label: "Sécurité",
+		icon: /* @__PURE__ */ V(L, { className: "h-4 w-4" }),
+		sections: [{
+			id: "password",
+			title: "Mot de passe",
+			description: "Changez votre mot de passe.",
+			icon: /* @__PURE__ */ V(N, { className: "h-5 w-5" }),
+			fields: [
+				{
+					id: "current-password",
+					label: "Mot de passe actuel",
+					type: "password",
+					placeholder: "••••••••"
+				},
+				{
+					id: "new-password",
+					label: "Nouveau mot de passe",
+					type: "password",
+					placeholder: "••••••••"
+				},
+				{
+					id: "confirm-password",
+					label: "Confirmer le mot de passe",
+					type: "password",
+					placeholder: "••••••••"
+				}
+			]
+		}, {
+			id: "two-factor",
+			title: "Authentification à deux facteurs",
+			description: "Ajoutez une couche de sécurité supplémentaire.",
+			icon: /* @__PURE__ */ V(R, { className: "h-5 w-5" }),
+			fields: [{
+				id: "2fa-enabled",
+				label: "Activer la 2FA",
+				description: "Utilisez une application d'authentification.",
+				type: "switch"
+			}]
+		}]
+	},
+	{
+		id: "preferences",
+		label: "Préférences",
+		icon: /* @__PURE__ */ V(F, { className: "h-4 w-4" }),
+		sections: [{
+			id: "appearance",
+			title: "Apparence",
+			description: "Personnalisez l'apparence de l'application.",
+			icon: /* @__PURE__ */ V(F, { className: "h-5 w-5" }),
+			fields: [{
+				id: "theme",
+				label: "Thème",
+				type: "select",
+				options: [
+					{
+						value: "light",
+						label: "Clair"
+					},
+					{
+						value: "dark",
+						label: "Sombre"
+					},
+					{
+						value: "system",
+						label: "Système"
+					}
+				]
+			}, {
+				id: "language",
+				label: "Langue",
+				type: "select",
+				options: [
+					{
+						value: "fr",
+						label: "Français"
+					},
+					{
+						value: "en",
+						label: "English"
+					},
+					{
+						value: "es",
+						label: "Español"
+					}
+				]
+			}]
+		}]
+	}
+];
+//#endregion
+export { G as WakaSettings, G as default, K as defaultSettingsTabs };

package/dist/blocks/sidebar/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("../../components/avatar/index.cjs.js"),r=require("../../components/button/index.cjs.js"),i=require("../../components/collapsible/index.cjs.js"),a=require("../../components/dropdown-menu/index.cjs.js"),o=require("../../components/scroll-area/index.cjs.js"),s=require("../../components/sheet/index.cjs.js");let c=require("react");c=e.__toESM(c);let l=require("lucide-react"),u=require("react/jsx-runtime");var d=c.createContext(null);function f(){let e=c.useContext(d);if(!e)throw Error(`Sidebar components must be used within WakaSidebar`);return e}function p({config:e}){let{LinkComponent:t}=f(),n=e.component?e.component:(0,u.jsxs)(`div`,{className:`flex items-center gap-3`,children:[e.src&&(0,u.jsx)(`img`,{src:e.src,alt:e.alt||`Logo`,className:`h-8 w-auto object-contain`}),e.title&&(0,u.jsx)(`span`,{className:`text-lg font-bold tracking-wide`,children:e.title})]});return e.href?t?(0,u.jsx)(t,{href:e.href,className:`block`,onClick:e.onClick,children:n}):(0,u.jsx)(`a`,{href:e.href,className:`block`,onClick:e.onClick,children:n}):e.onClick?(0,u.jsx)(`button`,{type:`button`,onClick:e.onClick,className:`block text-left`,children:n}):(0,u.jsx)(`div`,{children:n})}function m({item:e,isChild:n=!1,renderItem:r}){let{activeId:a,setActiveId:o,expandedIds:s,toggleExpanded:c,isMobile:d,closeOnNavigate:p,onClose:h,LinkComponent:g}=f(),_=e.children&&e.children.length>0,v=s.includes(e.id),y=a===e.id||e.active,b=()=>{e.disabled||(_?c(e.id):(o(e.id),e.onClick?.(),d&&p&&h()))};if(r)return(0,u.jsx)(u.Fragment,{children:r(e,n)});let x=(0,u.jsxs)(`div`,{className:t.cn(`flex items-center gap-3 rounded-lg px-3 py-2.5 text-sm font-medium transition-all duration-200`,`hover:bg-white/10`,y&&!_&&`bg-sidebar-active text-sidebar-active-foreground`,n&&`ml-6 text-[13px]`,e.disabled&&`opacity-50 cursor-not-allowed`),children:[e.icon&&(0,u.jsx)(`span`,{className:t.cn(`flex-shrink-0`,n?`h-4 w-4`:`h-5 w-5`),children:e.icon}),(0,u.jsx)(`span`,{className:`flex-1 truncate`,children:e.label}),e.badge!==void 0&&(0,u.jsx)(`span`,{className:`ml-auto flex h-5 min-w-[20px] items-center justify-center rounded-full bg-primary px-1.5 text-[10px] font-semibold text-primary-foreground`,children:e.badge}),_&&(0,u.jsx)(l.ChevronDown,{className:t.cn(`h-4 w-4 transition-transform duration-200`,v&&`rotate-180`)})]});if(_)return(0,u.jsxs)(i.Collapsible,{open:v,onOpenChange:()=>c(e.id),children:[(0,u.jsx)(i.CollapsibleTrigger,{asChild:!0,children:(0,u.jsx)(`button`,{type:`button`,className:`w-full text-left`,disabled:e.disabled,children:x})}),(0,u.jsx)(i.CollapsibleContent,{className:`space-y-1 pt-1`,children:e.children?.map(e=>(0,u.jsx)(m,{item:e,isChild:!0,renderItem:r},e.id))})]});if(e.href){let t={href:e.href,className:`block`,onClick:t=>{if(e.disabled){t.preventDefault();return}b()}};return g?(0,u.jsx)(g,{...t,children:x}):(0,u.jsx)(`a`,{...t,children:x})}return(0,u.jsx)(`button`,{type:`button`,className:`w-full text-left`,disabled:e.disabled,onClick:b,children:x})}function h({config:e}){let{LinkComponent:r}=f(),i=e.initials||e.name.split(` `).map(e=>e[0]).join(``).slice(0,2).toUpperCase(),o=[{id:`profile`,label:`Profil`,icon:(0,u.jsx)(l.User,{className:`h-4 w-4`})},{id:`settings`,label:`Paramètres`,icon:(0,u.jsx)(l.Settings,{className:`h-4 w-4`})},{id:`logout`,label:`Déconnexion`,icon:(0,u.jsx)(l.LogOut,{className:`h-4 w-4`}),variant:`destructive`}],s=e.actions??o;return(0,u.jsxs)(a.DropdownMenu,{children:[(0,u.jsx)(a.DropdownMenuTrigger,{asChild:!0,children:(0,u.jsxs)(`button`,{type:`button`,className:`flex w-full items-center gap-3 rounded-lg p-2 text-left transition-colors hover:bg-white/10`,children:[(0,u.jsxs)(n.Avatar,{className:`h-10 w-10 border-2 border-sidebar-active`,children:[(0,u.jsx)(n.AvatarImage,{src:e.avatarUrl,alt:e.name}),(0,u.jsx)(n.AvatarFallback,{className:`bg-sidebar-active text-sidebar-active-foreground text-sm font-medium`,children:i})]}),(0,u.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,u.jsx)(`p`,{className:`text-sm font-medium truncate`,children:e.name}),e.email&&(0,u.jsx)(`p`,{className:`text-xs text-sidebar-foreground/70 truncate`,children:e.email})]}),(0,u.jsx)(l.ChevronDown,{className:`h-4 w-4 flex-shrink-0 opacity-70`})]})}),(0,u.jsx)(a.DropdownMenuContent,{align:`end`,className:`w-56`,children:s.map((e,n)=>(0,u.jsxs)(c.Fragment,{children:[e.variant===`destructive`&&n>0&&(0,u.jsx)(a.DropdownMenuSeparator,{}),(0,u.jsx)(a.DropdownMenuItem,{onClick:e.onClick,className:t.cn(e.variant===`destructive`&&`text-destructive focus:text-destructive`),asChild:!!e.href,children:e.href?r?(0,u.jsxs)(r,{href:e.href,className:`flex items-center gap-2`,children:[e.icon,e.label]}):(0,u.jsxs)(`a`,{href:e.href,className:`flex items-center gap-2`,children:[e.icon,e.label]}):(0,u.jsxs)(`span`,{className:`flex items-center gap-2`,children:[e.icon,e.label]})})]},e.id))})]})}function g({logo:e,menu:t,user:n,userPosition:r=`bottom`,header:i,footer:a,renderItem:s}){return(0,u.jsxs)(`div`,{className:`flex h-full flex-col`,children:[e&&(0,u.jsx)(`div`,{className:`flex-shrink-0 p-4 pb-2`,children:(0,u.jsx)(p,{config:e})}),i&&(0,u.jsx)(`div`,{className:`flex-shrink-0 px-4 py-2`,children:i}),n&&r===`top`&&(0,u.jsx)(`div`,{className:`flex-shrink-0 px-3 py-2 border-b border-white/10`,children:(0,u.jsx)(h,{config:n})}),(0,u.jsx)(o.ScrollArea,{className:`flex-1 px-3 py-4`,children:(0,u.jsx)(`nav`,{className:`space-y-1`,children:t.map(e=>(0,u.jsx)(m,{item:e,renderItem:s},e.id))})}),a&&(0,u.jsx)(`div`,{className:`flex-shrink-0 px-4 py-2 border-t border-white/10`,children:a}),n&&r===`bottom`&&(0,u.jsx)(`div`,{className:`flex-shrink-0 p-3 border-t border-white/10`,children:(0,u.jsx)(h,{config:n})})]})}function _({logo:e,menu:n,user:i,width:a=260,mobileBreakpoint:o=768,open:f,onOpenChange:p,className:m,contentClassName:h,backgroundColor:_,textColor:v,activeColor:y,hoverColor:b,userPosition:x=`bottom`,showHamburger:S=!0,hamburgerPosition:C=`left`,renderItem:w,footer:T,header:E,position:D=`fixed`,LinkComponent:O}){let[k,A]=c.useState(!1),j=f!==void 0,M=j?f:k,N=j?p:A,[P,F]=c.useState(!1);c.useEffect(()=>{let e=()=>{F(window.innerWidth<o)};return e(),window.addEventListener(`resize`,e),()=>window.removeEventListener(`resize`,e)},[o]);let[I,L]=c.useState(()=>{let e=t=>{for(let n of t){if(n.active)return n.id;if(n.children){let t=e(n.children);if(t)return t}}return null};return e(n)}),[R,z]=c.useState(()=>{let e=(t,n=[])=>{for(let r of t){if(r.active)return n;if(r.children){let t=e(r.children,[...n,r.id]);if(t.length>n.length)return t}}return[]};return e(n)}),B={activeId:I,setActiveId:L,expandedIds:R,toggleExpanded:c.useCallback(e=>{z(t=>t.includes(e)?t.filter(t=>t!==e):[...t,e])},[]),isMobile:P,closeOnNavigate:!0,onClose:()=>N(!1),LinkComponent:O},V={"--sidebar-bg":_||`hsl(var(--sidebar-background, var(--card)))`,"--sidebar-text":v||`hsl(var(--sidebar-foreground, var(--muted-foreground)))`,"--sidebar-active":y||`hsl(var(--sidebar-primary, var(--primary)))`,"--sidebar-active-foreground":`hsl(var(--sidebar-primary-foreground, var(--primary-foreground)))`,"--sidebar-hover":b||`hsl(var(--sidebar-accent, var(--accent)))`},H=t.cn(`bg-[var(--sidebar-bg)] text-[var(--sidebar-text)]`,`[&_.bg-sidebar-active]:bg-[var(--sidebar-active)]`,`[&_.text-sidebar-active-foreground]:text-[var(--sidebar-active-foreground)]`,`[&_.border-sidebar-active]:border-[var(--sidebar-active)]`,h),U=(0,u.jsx)(d.Provider,{value:B,children:(0,u.jsx)(`div`,{className:t.cn(`h-full`,H),style:V,children:(0,u.jsx)(g,{logo:e,menu:n,user:i,userPosition:x,header:E,footer:T,renderItem:w})})});return(0,u.jsxs)(u.Fragment,{children:[S&&P&&(0,u.jsxs)(r.Button,{variant:`ghost`,size:`icon`,className:t.cn(`fixed top-3 z-50`,C===`left`?`left-3`:`right-3`),onClick:()=>N(!0),children:[(0,u.jsx)(l.Menu,{className:`h-6 w-6`}),(0,u.jsx)(`span`,{className:`sr-only`,children:`Ouvrir le menu`})]}),!P&&(0,u.jsx)(`aside`,{className:t.cn(D===`fixed`?`fixed left-0 top-0 h-screen z-40`:`relative h-full`,m),style:{width:a},children:U}),P&&(0,u.jsx)(s.Sheet,{open:M,onOpenChange:N,children:(0,u.jsxs)(s.SheetContent,{side:`left`,className:t.cn(`w-[280px] p-0 border-0`,m),style:V,"aria-describedby":`sidebar-description`,children:[(0,u.jsx)(s.SheetTitle,{className:`sr-only`,children:`Menu de navigation`}),(0,u.jsx)(s.SheetDescription,{id:`sidebar-description`,className:`sr-only`,children:`Menu principal de l'application`}),U]})})]})}function v(){let[e,t]=c.useState(!1);return{isOpen:e,setIsOpen:t,open:c.useCallback(()=>t(!0),[]),close:c.useCallback(()=>t(!1),[]),toggle:c.useCallback(()=>t(e=>!e),[])}}function y({sidebar:e,children:n,sidebarWidth:r=260,className:i,contentClassName:a}){let[o,s]=c.useState(!1),l=e.mobileBreakpoint||768;return c.useEffect(()=>{let e=()=>s(window.innerWidth<l);return e(),window.addEventListener(`resize`,e),()=>window.removeEventListener(`resize`,e)},[l]),(0,u.jsxs)(`div`,{className:t.cn(`min-h-screen bg-background`,i),children:[(0,u.jsx)(_,{...e,width:r}),(0,u.jsx)(`main`,{className:t.cn(`min-h-screen transition-all duration-300`,a),style:{marginLeft:o?0:r},children:n})]})}exports.SidebarLayout=y,exports.WakaSidebar=_,exports.default=_,exports.useSidebar=v;