import { jsx, jsxs } from "react/jsx-runtime";
import { Card, CardContent, CardHeader } from "../ui/card.js";
import { Skeleton } from "../ui/skeleton.js";
function SettingsPageSkeleton({
  title = "",
  description = "",
  sectionsCount = 3,
  itemsPerSection = 4
}) {
  return /* @__PURE__ */ jsxs("div", { className: "container mx-auto p-6 max-w-4xl", children: [
    /* @__PURE__ */ jsx("div", { className: "mb-8", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-4", children: [
      /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
        title ? /* @__PURE__ */ jsx("h1", { className: "text-3xl font-bold tracking-tight", children: title }) : /* @__PURE__ */ jsx(Skeleton, { className: "h-8 w-48" }),
        description ? /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: description }) : /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-96" })
      ] }),
      /* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-32" }),
      " "
    ] }) }),
    /* @__PURE__ */ jsx("div", { className: "space-y-6", children: Array.from({ length: sectionsCount }).map((_, sectionIndex) => /* @__PURE__ */ jsxs(Card, { children: [
      /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-3", children: [
        /* @__PURE__ */ jsx(Skeleton, { className: "h-5 w-5 rounded" }),
        " ",
        /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
          /* @__PURE__ */ jsx(Skeleton, { className: "h-6 w-40" }),
          " ",
          /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-64" }),
          " "
        ] })
      ] }) }),
      /* @__PURE__ */ jsx(CardContent, { className: "space-y-4", children: Array.from({ length: itemsPerSection }).map((_2, itemIndex) => /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between p-4 border rounded-lg", children: [
        /* @__PURE__ */ jsxs("div", { className: "space-y-2 flex-1", children: [
          /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-32" }),
          " ",
          /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-48" }),
          " "
        ] }),
        /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-4", children: [
          /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
            /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-12" }),
            " ",
            /* @__PURE__ */ jsx(Skeleton, { className: "h-6 w-12 rounded-full" }),
            " "
          ] }),
          /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
            /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-12" }),
            " ",
            /* @__PURE__ */ jsx(Skeleton, { className: "h-6 w-12 rounded-full" }),
            " "
          ] })
        ] })
      ] }, itemIndex)) })
    ] }, sectionIndex)) })
  ] });
}
function NotificationsPageSkeleton() {
  return /* @__PURE__ */ jsx(
    SettingsPageSkeleton,
    {
      title: "Notificaciones",
      description: "Configura c\xF3mo y cu\xE1ndo quieres recibir notificaciones.",
      sectionsCount: 3,
      itemsPerSection: 3
    }
  );
}
function SecurityPageSkeleton() {
  return /* @__PURE__ */ jsxs("div", { className: "container mx-auto p-6 max-w-4xl", children: [
    /* @__PURE__ */ jsx("div", { className: "mb-8", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-4", children: [
      /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
        /* @__PURE__ */ jsx("h1", { className: "text-3xl font-bold tracking-tight", children: "Seguridad" }),
        /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Mant\xE9n tu cuenta segura con estas configuraciones de seguridad." })
      ] }),
      /* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-32" }),
      " "
    ] }) }),
    /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
      /* @__PURE__ */ jsxs(Card, { children: [
        /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-3", children: [
          /* @__PURE__ */ jsx(Skeleton, { className: "h-5 w-5 rounded" }),
          /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
            /* @__PURE__ */ jsx(Skeleton, { className: "h-6 w-40" }),
            /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-64" })
          ] })
        ] }) }),
        /* @__PURE__ */ jsxs(CardContent, { className: "space-y-6", children: [
          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between p-4 border rounded-lg", children: [
            /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
              /* @__PURE__ */ jsx(Skeleton, { className: "h-5 w-48" }),
              /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-72" })
            ] }),
            /* @__PURE__ */ jsx(Skeleton, { className: "h-6 w-12 rounded-full" })
          ] }),
          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between p-4 border rounded-lg", children: [
            /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
              /* @__PURE__ */ jsx(Skeleton, { className: "h-5 w-36" }),
              /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-64" })
            ] }),
            /* @__PURE__ */ jsx(Skeleton, { className: "h-6 w-12 rounded-full" })
          ] })
        ] })
      ] }),
      /* @__PURE__ */ jsxs(Card, { children: [
        /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-3", children: [
          /* @__PURE__ */ jsx(Skeleton, { className: "h-5 w-5 rounded" }),
          /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
            /* @__PURE__ */ jsx(Skeleton, { className: "h-6 w-32" }),
            /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-48" })
          ] })
        ] }) }),
        /* @__PURE__ */ jsx(CardContent, { className: "space-y-4", children: Array.from({ length: 3 }).map((_, index) => /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between p-4 border rounded-lg", children: [
          /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-4", children: [
            /* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-10 rounded-full" }),
            /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
              /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-24" }),
              /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-32" }),
              /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-20" })
            ] })
          ] }),
          /* @__PURE__ */ jsx(Skeleton, { className: "h-8 w-20" })
        ] }, index)) })
      ] })
    ] })
  ] });
}
export {
  NotificationsPageSkeleton,
  SecurityPageSkeleton,
  SettingsPageSkeleton
};
