@thorprovider/blocks 1.0.0 → 3.0.0

package/dist/blocks/application/app-shells/app-shell-1.mjs

@@ -0,0 +1,123 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Bell, Plus, Search } from "lucide-react";
+import {
+  Breadcrumb,
+  BreadcrumbItem,
+  BreadcrumbLink,
+  BreadcrumbList,
+  BreadcrumbPage,
+  BreadcrumbSeparator
+} from "../../../ui/breadcrumb.mjs";
+import { Button } from "../../../ui/button.mjs";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "../../../ui/card.mjs";
+import { Input } from "../../../ui/input.mjs";
+import { Separator } from "../../../ui/separator.mjs";
+import { SidebarInset, SidebarProvider, SidebarTrigger } from "../../../ui/sidebar.mjs";
+import AppShell1Sidebar from "./app-shell-1-sidebar.mjs";
+function AppHeader({ breadcrumb }) {
+  return /* @__PURE__ */ jsxs("header", { className: "flex h-14 shrink-0 items-center gap-3 border-b px-4 sm:px-6", children: [
+    /* @__PURE__ */ jsx(SidebarTrigger, { "aria-label": "Toggle navigation", className: "min-h-11 min-w-11" }),
+    /* @__PURE__ */ jsx(Separator, { orientation: "vertical", className: "data-vertical:h-5 data-vertical:self-center" }),
+    breadcrumb && breadcrumb.length > 0 ? /* @__PURE__ */ jsx(Breadcrumb, { children: /* @__PURE__ */ jsx(BreadcrumbList, { children: breadcrumb.map((item, index) => {
+      const isLast = index === breadcrumb.length - 1;
+      return /* @__PURE__ */ jsxs("div", { className: "contents", children: [
+        /* @__PURE__ */ jsx(BreadcrumbItem, { className: isLast ? void 0 : "hidden sm:flex", children: isLast ? /* @__PURE__ */ jsx(BreadcrumbPage, { children: item.label }) : item.href ? /* @__PURE__ */ jsx(BreadcrumbLink, { href: item.href, children: item.label }) : /* @__PURE__ */ jsx("span", { children: item.label }) }),
+        !isLast ? /* @__PURE__ */ jsx(BreadcrumbSeparator, { className: "hidden sm:flex" }) : null
+      ] }, item.label);
+    }) }) }) : null,
+    /* @__PURE__ */ jsx("div", { className: "ml-auto hidden w-56 md:block", children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+      /* @__PURE__ */ jsx(Search, { className: "pointer-events-none absolute left-2.5 top-1/2 size-4 -translate-y-1/2 text-muted-foreground" }),
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          "aria-label": "Buscar en el espacio de trabajo",
+          placeholder: "Buscar\u2026",
+          className: "h-9 pl-9"
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ jsxs(Button, { variant: "ghost", size: "icon", "aria-label": "Notifications, 3 unread", children: [
+      /* @__PURE__ */ jsx(Bell, {}),
+      /* @__PURE__ */ jsx("span", { className: "sr-only", children: "3 unread" })
+    ] })
+  ] });
+}
+function AppContent({
+  pageTitle,
+  pageDescription,
+  action,
+  stats,
+  children
+}) {
+  return /* @__PURE__ */ jsxs("main", { className: "flex flex-1 flex-col gap-6 p-4 sm:p-6", children: [
+    pageTitle || pageDescription || action ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-4", children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        pageTitle ? /* @__PURE__ */ jsx("h1", { className: "text-2xl font-semibold tracking-tight", children: pageTitle }) : null,
+        pageDescription ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: pageDescription }) : null
+      ] }),
+      action ? /* @__PURE__ */ jsx(Button, { asChild: true, children: /* @__PURE__ */ jsxs("a", { href: action.href, children: [
+        /* @__PURE__ */ jsx(Plus, { "data-icon": "inline-start" }),
+        action.label
+      ] }) }) : null
+    ] }) : null,
+    stats && stats.length > 0 ? /* @__PURE__ */ jsx("div", { className: "grid gap-6 sm:grid-cols-2 lg:grid-cols-3", children: stats.map((stat) => /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsxs(CardHeader, { children: [
+      /* @__PURE__ */ jsx(CardDescription, { children: stat.label }),
+      /* @__PURE__ */ jsx(CardTitle, { className: "text-3xl", children: stat.value })
+    ] }) }, stat.label)) }) : null,
+    /* @__PURE__ */ jsxs(Card, { className: "min-h-72", children: [
+      /* @__PURE__ */ jsxs(CardHeader, { children: [
+        /* @__PURE__ */ jsx(CardTitle, { children: "Project activity" }),
+        /* @__PURE__ */ jsx(CardDescription, { children: "Your product content goes inside this shell." })
+      ] }),
+      /* @__PURE__ */ jsx(CardContent, { className: "flex flex-1", children: children ?? /* @__PURE__ */ jsxs("div", { className: "flex flex-1 items-center justify-center rounded-lg border border-dashed text-sm text-muted-foreground", children: [
+        /* @__PURE__ */ jsx(Search, { className: "mr-2 size-4" }),
+        "Replace with your screen"
+      ] }) })
+    ] })
+  ] });
+}
+function AppShell1({
+  brandName,
+  navGroupLabel,
+  navItems,
+  user,
+  breadcrumb,
+  pageTitle,
+  pageDescription,
+  action,
+  stats,
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(SidebarProvider, { className, children: [
+    /* @__PURE__ */ jsx(
+      AppShell1Sidebar,
+      {
+        brandName,
+        navGroupLabel,
+        navItems,
+        user
+      }
+    ),
+    /* @__PURE__ */ jsxs(SidebarInset, { children: [
+      /* @__PURE__ */ jsx(AppHeader, { breadcrumb }),
+      /* @__PURE__ */ jsx(
+        AppContent,
+        {
+          pageTitle,
+          pageDescription,
+          action,
+          stats,
+          children
+        }
+      )
+    ] })
+  ] });
+}
+var app_shell_1_default = AppShell1;
+export {
+  AppShell1,
+  app_shell_1_default as default
+};
+//# sourceMappingURL=app-shell-1.mjs.map

package/dist/blocks/application/app-shells/app-shell-1.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/blocks/application/app-shells/app-shell-1.tsx"],"sourcesContent":["'use client'\n\nimport { Bell, Plus, Search } from 'lucide-react'\nimport type { ReactNode } from 'react'\n\nimport type { CTA } from '../../../lib/types'\nimport {\n  Breadcrumb,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  BreadcrumbList,\n  BreadcrumbPage,\n  BreadcrumbSeparator,\n} from '../../../ui/breadcrumb'\nimport { Button } from '../../../ui/button'\nimport { Card, CardContent, CardDescription, CardHeader, CardTitle } from '../../../ui/card'\nimport { Input } from '../../../ui/input'\nimport { Separator } from '../../../ui/separator'\nimport { SidebarInset, SidebarProvider, SidebarTrigger } from '../../../ui/sidebar'\nimport AppShell1Sidebar from './app-shell-1-sidebar'\nimport type { AppShell1NavItem, AppShell1User } from './app-shell-1-sidebar'\n\nexport interface AppShell1BreadcrumbItem {\n  label: string\n  href?: string\n}\n\nexport interface AppShell1Stat {\n  label: string\n  value: string\n}\n\nexport interface AppShell1Props {\n  brandName?: string\n  navGroupLabel?: string\n  navItems?: AppShell1NavItem[]\n  user?: AppShell1User\n  breadcrumb?: AppShell1BreadcrumbItem[]\n  pageTitle?: string\n  pageDescription?: string\n  action?: CTA\n  stats?: AppShell1Stat[]\n  children?: ReactNode\n  className?: string\n}\n\nfunction AppHeader({ breadcrumb }: { breadcrumb?: AppShell1BreadcrumbItem[] }) {\n  return (\n    <header className=\"flex h-14 shrink-0 items-center gap-3 border-b px-4 sm:px-6\">\n      <SidebarTrigger aria-label=\"Toggle navigation\" className=\"min-h-11 min-w-11\" />\n      <Separator orientation=\"vertical\" className=\"data-vertical:h-5 data-vertical:self-center\" />\n      {breadcrumb && breadcrumb.length > 0 ? (\n        <Breadcrumb>\n          <BreadcrumbList>\n            {breadcrumb.map((item, index) => {\n              const isLast = index === breadcrumb.length - 1\n              return (\n                <div key={item.label} className=\"contents\">\n                  <BreadcrumbItem className={isLast ? undefined : 'hidden sm:flex'}>\n                    {isLast ? (\n                      <BreadcrumbPage>{item.label}</BreadcrumbPage>\n                    ) : item.href ? (\n                      <BreadcrumbLink href={item.href}>{item.label}</BreadcrumbLink>\n                    ) : (\n                      <span>{item.label}</span>\n                    )}\n                  </BreadcrumbItem>\n                  {!isLast ? (\n                    <BreadcrumbSeparator className=\"hidden sm:flex\" />\n                  ) : null}\n                </div>\n              )\n            })}\n          </BreadcrumbList>\n        </Breadcrumb>\n      ) : null}\n      <div className=\"ml-auto hidden w-56 md:block\">\n        <div className=\"relative\">\n          <Search className=\"pointer-events-none absolute left-2.5 top-1/2 size-4 -translate-y-1/2 text-muted-foreground\" />\n          <Input\n            aria-label=\"Buscar en el espacio de trabajo\"\n            placeholder=\"Buscar…\"\n            className=\"h-9 pl-9\"\n          />\n        </div>\n      </div>\n      <Button variant=\"ghost\" size=\"icon\" aria-label=\"Notifications, 3 unread\">\n        <Bell />\n        <span className=\"sr-only\">3 unread</span>\n      </Button>\n    </header>\n  )\n}\n\nfunction AppContent({\n  pageTitle,\n  pageDescription,\n  action,\n  stats,\n  children,\n}: {\n  pageTitle?: string\n  pageDescription?: string\n  action?: CTA\n  stats?: AppShell1Stat[]\n  children?: ReactNode\n}) {\n  return (\n    <main className=\"flex flex-1 flex-col gap-6 p-4 sm:p-6\">\n      {pageTitle || pageDescription || action ? (\n        <div className=\"flex items-center justify-between gap-4\">\n          <div>\n            {pageTitle ? (\n              <h1 className=\"text-2xl font-semibold tracking-tight\">{pageTitle}</h1>\n            ) : null}\n            {pageDescription ? (\n              <p className=\"text-sm text-muted-foreground\">{pageDescription}</p>\n            ) : null}\n          </div>\n          {action ? (\n            <Button asChild>\n              <a href={action.href}>\n                <Plus data-icon=\"inline-start\" />\n                {action.label}\n              </a>\n            </Button>\n          ) : null}\n        </div>\n      ) : null}\n      {stats && stats.length > 0 ? (\n        <div className=\"grid gap-6 sm:grid-cols-2 lg:grid-cols-3\">\n          {stats.map(stat => (\n            <Card key={stat.label}>\n              <CardHeader>\n                <CardDescription>{stat.label}</CardDescription>\n                <CardTitle className=\"text-3xl\">{stat.value}</CardTitle>\n              </CardHeader>\n            </Card>\n          ))}\n        </div>\n      ) : null}\n      <Card className=\"min-h-72\">\n        <CardHeader>\n          <CardTitle>Project activity</CardTitle>\n          <CardDescription>Your product content goes inside this shell.</CardDescription>\n        </CardHeader>\n        <CardContent className=\"flex flex-1\">\n          {children ?? (\n            <div className=\"flex flex-1 items-center justify-center rounded-lg border border-dashed text-sm text-muted-foreground\">\n              <Search className=\"mr-2 size-4\" />\n              Replace with your screen\n            </div>\n          )}\n        </CardContent>\n      </Card>\n    </main>\n  )\n}\n\nexport function AppShell1({\n  brandName,\n  navGroupLabel,\n  navItems,\n  user,\n  breadcrumb,\n  pageTitle,\n  pageDescription,\n  action,\n  stats,\n  children,\n  className,\n}: AppShell1Props) {\n  return (\n    <SidebarProvider className={className}>\n      <AppShell1Sidebar\n        brandName={brandName}\n        navGroupLabel={navGroupLabel}\n        navItems={navItems}\n        user={user}\n      />\n      <SidebarInset>\n        <AppHeader breadcrumb={breadcrumb} />\n        <AppContent\n          pageTitle={pageTitle}\n          pageDescription={pageDescription}\n          action={action}\n          stats={stats}\n        >\n          {children}\n        </AppContent>\n      </SidebarInset>\n    </SidebarProvider>\n  )\n}\n\nexport default AppShell1"],"mappings":"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","names":[]}

package/dist/blocks/application/login-forms/login-page.d.ts

@@ -0,0 +1,42 @@
+import { type LucideIcon } from 'lucide-react';
+export interface LoginPageFormData {
+    email: string;
+    password: string;
+    remember: boolean;
+}
+export interface LoginPageProvider {
+    /** Must be unique within one `providers` list. */
+    id: string;
+    label: string;
+}
+export interface LoginPageProps {
+    presentation: 'card' | 'social';
+    logoText?: string;
+    welcomeTitleLabel?: string;
+    welcomeDescriptionLabel?: string;
+    emailLabel?: string;
+    emailPlaceholder?: string;
+    passwordLabel?: string;
+    passwordPlaceholder?: string;
+    rememberMeLabel?: string;
+    forgotPasswordLabel?: string;
+    signInLabel?: string;
+    orContinueWithLabel?: string;
+    dontHaveAccountLabel?: string;
+    createAccountLabel?: string;
+    showPasswordAriaLabel?: string;
+    hidePasswordAriaLabel?: string;
+    providers?: LoginPageProvider[];
+    providerIcons?: Record<string, LucideIcon>;
+    onSubmit?: (data: {
+        email: string;
+        password: string;
+        remember: boolean;
+    }) => void;
+    onForgotPassword?: () => void;
+    onCreateAccount?: () => void;
+    onProviderSelect?: (providerId: string) => void;
+}
+export declare function LoginPage({ presentation, logoText, welcomeTitleLabel, welcomeDescriptionLabel, emailLabel, emailPlaceholder, passwordLabel, passwordPlaceholder, rememberMeLabel, forgotPasswordLabel, signInLabel, orContinueWithLabel, dontHaveAccountLabel, createAccountLabel, showPasswordAriaLabel, hidePasswordAriaLabel, providers, providerIcons, onSubmit, onForgotPassword, onCreateAccount, onProviderSelect, }: LoginPageProps): import("react").JSX.Element;
+export default LoginPage;
+//# sourceMappingURL=login-page.d.ts.map

package/dist/blocks/application/login-forms/login-page.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"login-page.d.ts","sourceRoot":"","sources":["../../../../src/blocks/application/login-forms/login-page.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAqB,KAAK,UAAU,EAAE,MAAM,cAAc,CAAA;AAQjE,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,OAAO,CAAA;CAClB;AAED,MAAM,WAAW,iBAAiB;IAChC,kDAAkD;IAClD,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;CACd;AAED,MAAM,WAAW,cAAc;IAC7B,YAAY,EAAE,MAAM,GAAG,QAAQ,CAAA;IAC/B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,uBAAuB,CAAC,EAAE,MAAM,CAAA;IAChC,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAC7B,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B,SAAS,CAAC,EAAE,iBAAiB,EAAE,CAAA;IAC/B,aAAa,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,UAAU,CAAC,CAAA;IAC1C,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,KAAK,IAAI,CAAA;IACjF,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC7B,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,gBAAgB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAA;CAChD;AAED,wBAAgB,SAAS,CAAC,EACxB,YAAY,EACZ,QAAQ,EACR,iBAAyC,EACzC,uBAAwD,EACxD,UAAiC,EACjC,gBAAsC,EACtC,aAA4B,EAC5B,mBAAgC,EAChC,eAA8B,EAC9B,mBAAiD,EACjD,WAA8B,EAC9B,mBAAsC,EACtC,oBAA+C,EAC/C,kBAAsC,EACtC,qBAA4C,EAC5C,qBAA4C,EAC5C,SAAc,EACd,aAAkB,EAClB,QAAQ,EACR,gBAAgB,EAChB,eAAe,EACf,gBAAgB,GACjB,EAAE,cAAc,+BAsKhB;AAED,eAAe,SAAS,CAAA"}

package/dist/blocks/application/login-forms/login-page.js

@@ -0,0 +1,209 @@
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var login_page_exports = {};
+__export(login_page_exports, {
+  LoginPage: () => LoginPage,
+  default: () => login_page_default
+});
+module.exports = __toCommonJS(login_page_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
+var import_lucide_react = require("lucide-react");
+var import_button = require("../../../ui/button.js");
+var import_card = require("../../../ui/card.js");
+var import_input = require("../../../ui/input.js");
+var import_label = require("../../../ui/label.js");
+var import_checkbox_check = require("../../e-commerce/checkout-forms/checkbox-check.js");
+function LoginPage({
+  presentation,
+  logoText,
+  welcomeTitleLabel = "Bienvenido de nuevo",
+  welcomeDescriptionLabel = "Inicia sesi\xF3n para continuar",
+  emailLabel = "Correo electr\xF3nico",
+  emailPlaceholder = "taller@correo.com",
+  passwordLabel = "Contrase\xF1a",
+  passwordPlaceholder = "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022",
+  rememberMeLabel = "Recu\xE9rdame",
+  forgotPasswordLabel = "\xBFOlvidaste tu contrase\xF1a?",
+  signInLabel = "Iniciar sesi\xF3n",
+  orContinueWithLabel = "O contin\xFAa con",
+  dontHaveAccountLabel = "\xBFNo tienes una cuenta?",
+  createAccountLabel = "Crea una cuenta",
+  showPasswordAriaLabel = "Mostrar contrase\xF1a",
+  hidePasswordAriaLabel = "Ocultar contrase\xF1a",
+  providers = [],
+  providerIcons = {},
+  onSubmit,
+  onForgotPassword,
+  onCreateAccount,
+  onProviderSelect
+}) {
+  if (presentation !== "card" && presentation !== "social") {
+    throw new Error('LoginPage requires a valid presentation: "card" or "social".');
+  }
+  const providerIds = /* @__PURE__ */ new Set();
+  for (const provider of providers ?? []) {
+    if (providerIds.has(provider.id)) {
+      throw new Error("LoginPage provider ids must be unique.");
+    }
+    providerIds.add(provider.id);
+  }
+  const id = (0, import_react.useId)();
+  const [email, setEmail] = (0, import_react.useState)("");
+  const [password, setPassword] = (0, import_react.useState)("");
+  const [remember, setRemember] = (0, import_react.useState)(false);
+  const [showPassword, setShowPassword] = (0, import_react.useState)(false);
+  const handleSubmit = (event) => {
+    event.preventDefault();
+    onSubmit?.({ email, password, remember });
+  };
+  const fields = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("form", { onSubmit: handleSubmit, className: "flex flex-col gap-5", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_label.Label, { htmlFor: `${id}-email`, children: emailLabel }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_input.Input,
+        {
+          id: `${id}-email`,
+          type: "email",
+          autoComplete: "email",
+          placeholder: emailPlaceholder,
+          value: email,
+          onChange: (event) => setEmail(event.target.value)
+        }
+      )
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_label.Label, { htmlFor: `${id}-password`, children: passwordLabel }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_input.Input,
+          {
+            id: `${id}-password`,
+            type: showPassword ? "text" : "password",
+            autoComplete: "current-password",
+            placeholder: passwordPlaceholder,
+            value: password,
+            onChange: (event) => setPassword(event.target.value),
+            className: "pe-10"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_button.Button,
+          {
+            type: "button",
+            variant: "ghost",
+            size: "icon",
+            "aria-label": showPassword ? hidePasswordAriaLabel : showPasswordAriaLabel,
+            className: "absolute end-0 top-1/2 size-9 -translate-y-1/2 cursor-pointer hover:bg-transparent",
+            onClick: () => setShowPassword((value) => !value),
+            children: showPassword ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.EyeOff, { "aria-hidden": "true" }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Eye, { "aria-hidden": "true" })
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-wrap items-center justify-between gap-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_checkbox_check.CheckboxCheck,
+          {
+            id: `${id}-remember`,
+            checked: remember,
+            onCheckedChange: (value) => setRemember(value === true)
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_label.Label, { htmlFor: `${id}-remember`, className: "text-sm font-normal text-muted-foreground", children: rememberMeLabel })
+      ] }),
+      onForgotPassword && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_button.Button, { type: "button", variant: "link", className: "h-auto cursor-pointer p-0 text-sm", onClick: onForgotPassword, children: forgotPasswordLabel })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_button.Button, { type: "submit", className: "h-9 w-full cursor-pointer px-4 py-2", children: signInLabel })
+  ] });
+  const providerSection = providers.length > 0 && onProviderSelect && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col gap-4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-3", "aria-hidden": "true", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "h-px flex-1 bg-border" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-muted-foreground text-xs uppercase", children: orContinueWithLabel }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "h-px flex-1 bg-border" })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "div",
+      {
+        className: presentation === "card" ? "grid grid-cols-3 gap-3" : "grid grid-cols-2 gap-4",
+        role: "group",
+        "aria-label": orContinueWithLabel,
+        children: providers.map((provider) => {
+          const Icon = providerIcons[provider.id];
+          return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+            import_button.Button,
+            {
+              type: "button",
+              variant: "outline",
+              "aria-label": provider.label,
+              className: "h-9 w-full cursor-pointer px-3 py-2",
+              onClick: () => onProviderSelect(provider.id),
+              children: [
+                Icon ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, { "aria-hidden": "true", className: "size-5" }) : provider.label,
+                presentation === "social" && Icon ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: provider.label }) : null
+              ]
+            },
+            provider.id
+          );
+        })
+      }
+    )
+  ] });
+  const createAccount = onCreateAccount && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "flex justify-center gap-1 text-center text-sm", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: dontHaveAccountLabel }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_button.Button, { type: "button", variant: "link", className: "h-auto cursor-pointer p-0 text-sm", onClick: onCreateAccount, children: createAccountLabel })
+  ] });
+  if (presentation === "card") {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "w-full max-w-md", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_card.Card, { className: "w-full p-8 shadow-2xl", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("header", { className: "mb-8 flex flex-col items-center text-center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "bg-secondary mb-4 flex size-14 items-center justify-center rounded-full border", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Lock, { "aria-hidden": "true", className: "size-6" }) }),
+        logoText && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-muted-foreground mb-2 text-sm font-semibold", children: logoText }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", { className: "mb-2 text-2xl font-bold tracking-tight", children: welcomeTitleLabel }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-muted-foreground text-sm", children: welcomeDescriptionLabel })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col gap-6", children: [
+        fields,
+        providerSection,
+        createAccount
+      ] })
+    ] }) });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex w-full max-w-md flex-col gap-6", children: [
+    logoText && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-center text-2xl font-medium", children: logoText }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_card.Card, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_card.CardHeader, { className: "text-center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_card.CardTitle, { className: "text-2xl font-bold text-balance", children: welcomeTitleLabel }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_card.CardDescription, { children: welcomeDescriptionLabel })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_card.CardContent, { className: "flex flex-col gap-5", children: [
+        fields,
+        providerSection,
+        createAccount
+      ] })
+    ] })
+  ] });
+}
+var login_page_default = LoginPage;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  LoginPage
+});
+//# sourceMappingURL=login-page.js.map

package/dist/blocks/application/login-forms/login-page.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/blocks/application/login-forms/login-page.tsx"],"sourcesContent":["'use client'\n\nimport { useId, useState, type FormEvent } from 'react'\nimport { Eye, EyeOff, Lock, type LucideIcon } from 'lucide-react'\n\nimport { Button } from '../../../ui/button'\nimport { Card, CardContent, CardDescription, CardHeader, CardTitle } from '../../../ui/card'\nimport { Input } from '../../../ui/input'\nimport { Label } from '../../../ui/label'\nimport { CheckboxCheck } from '../../e-commerce/checkout-forms/checkbox-check'\n\nexport interface LoginPageFormData {\n  email: string\n  password: string\n  remember: boolean\n}\n\nexport interface LoginPageProvider {\n  /** Must be unique within one `providers` list. */\n  id: string\n  label: string\n}\n\nexport interface LoginPageProps {\n  presentation: 'card' | 'social'\n  logoText?: string\n  welcomeTitleLabel?: string\n  welcomeDescriptionLabel?: string\n  emailLabel?: string\n  emailPlaceholder?: string\n  passwordLabel?: string\n  passwordPlaceholder?: string\n  rememberMeLabel?: string\n  forgotPasswordLabel?: string\n  signInLabel?: string\n  orContinueWithLabel?: string\n  dontHaveAccountLabel?: string\n  createAccountLabel?: string\n  showPasswordAriaLabel?: string\n  hidePasswordAriaLabel?: string\n  providers?: LoginPageProvider[]\n  providerIcons?: Record<string, LucideIcon>\n  onSubmit?: (data: { email: string; password: string; remember: boolean }) => void\n  onForgotPassword?: () => void\n  onCreateAccount?: () => void\n  onProviderSelect?: (providerId: string) => void\n}\n\nexport function LoginPage({\n  presentation,\n  logoText,\n  welcomeTitleLabel = 'Bienvenido de nuevo',\n  welcomeDescriptionLabel = 'Inicia sesión para continuar',\n  emailLabel = 'Correo electrónico',\n  emailPlaceholder = 'taller@correo.com',\n  passwordLabel = 'Contraseña',\n  passwordPlaceholder = '••••••••',\n  rememberMeLabel = 'Recuérdame',\n  forgotPasswordLabel = '¿Olvidaste tu contraseña?',\n  signInLabel = 'Iniciar sesión',\n  orContinueWithLabel = 'O continúa con',\n  dontHaveAccountLabel = '¿No tienes una cuenta?',\n  createAccountLabel = 'Crea una cuenta',\n  showPasswordAriaLabel = 'Mostrar contraseña',\n  hidePasswordAriaLabel = 'Ocultar contraseña',\n  providers = [],\n  providerIcons = {},\n  onSubmit,\n  onForgotPassword,\n  onCreateAccount,\n  onProviderSelect,\n}: LoginPageProps) {\n  if (presentation !== 'card' && presentation !== 'social') {\n    throw new Error('LoginPage requires a valid presentation: \"card\" or \"social\".')\n  }\n\n  const providerIds = new Set<string>()\n  for (const provider of providers ?? []) {\n    if (providerIds.has(provider.id)) {\n      throw new Error('LoginPage provider ids must be unique.')\n    }\n    providerIds.add(provider.id)\n  }\n\n  const id = useId()\n  const [email, setEmail] = useState('')\n  const [password, setPassword] = useState('')\n  const [remember, setRemember] = useState(false)\n  const [showPassword, setShowPassword] = useState(false)\n\n  const handleSubmit = (event: FormEvent<HTMLFormElement>) => {\n    event.preventDefault()\n    onSubmit?.({ email, password, remember })\n  }\n\n  const fields = (\n    <form onSubmit={handleSubmit} className='flex flex-col gap-5'>\n      <div className='flex flex-col gap-2'>\n        <Label htmlFor={`${id}-email`}>{emailLabel}</Label>\n        <Input\n          id={`${id}-email`}\n          type='email'\n          autoComplete='email'\n          placeholder={emailPlaceholder}\n          value={email}\n          onChange={event => setEmail(event.target.value)}\n        />\n      </div>\n\n      <div className='flex flex-col gap-2'>\n        <Label htmlFor={`${id}-password`}>{passwordLabel}</Label>\n        <div className='relative'>\n          <Input\n            id={`${id}-password`}\n            type={showPassword ? 'text' : 'password'}\n            autoComplete='current-password'\n            placeholder={passwordPlaceholder}\n            value={password}\n            onChange={event => setPassword(event.target.value)}\n            className='pe-10'\n          />\n          <Button\n            type='button'\n            variant='ghost'\n            size='icon'\n            aria-label={showPassword ? hidePasswordAriaLabel : showPasswordAriaLabel}\n            className='absolute end-0 top-1/2 size-9 -translate-y-1/2 cursor-pointer hover:bg-transparent'\n            onClick={() => setShowPassword(value => !value)}\n          >\n            {showPassword ? <EyeOff aria-hidden='true' /> : <Eye aria-hidden='true' />}\n          </Button>\n        </div>\n      </div>\n\n      <div className='flex flex-wrap items-center justify-between gap-3'>\n        <div className='flex items-center gap-2'>\n          <CheckboxCheck\n            id={`${id}-remember`}\n            checked={remember}\n            onCheckedChange={value => setRemember(value === true)}\n          />\n          <Label htmlFor={`${id}-remember`} className='text-sm font-normal text-muted-foreground'>\n            {rememberMeLabel}\n          </Label>\n        </div>\n        {onForgotPassword && (\n          <Button type='button' variant='link' className='h-auto cursor-pointer p-0 text-sm' onClick={onForgotPassword}>\n            {forgotPasswordLabel}\n          </Button>\n        )}\n      </div>\n\n      <Button type='submit' className='h-9 w-full cursor-pointer px-4 py-2'>\n        {signInLabel}\n      </Button>\n    </form>\n  )\n\n  const providerSection = providers.length > 0 && onProviderSelect && (\n    <div className='flex flex-col gap-4'>\n      <div className='flex items-center gap-3' aria-hidden='true'>\n        <span className='h-px flex-1 bg-border' />\n        <span className='text-muted-foreground text-xs uppercase'>{orContinueWithLabel}</span>\n        <span className='h-px flex-1 bg-border' />\n      </div>\n      <div\n        className={presentation === 'card' ? 'grid grid-cols-3 gap-3' : 'grid grid-cols-2 gap-4'}\n        role='group'\n        aria-label={orContinueWithLabel}\n      >\n        {providers.map(provider => {\n          const Icon = providerIcons[provider.id] as LucideIcon | undefined\n          return (\n            <Button\n              key={provider.id}\n              type='button'\n              variant='outline'\n              aria-label={provider.label}\n              className='h-9 w-full cursor-pointer px-3 py-2'\n              onClick={() => onProviderSelect(provider.id)}\n            >\n              {Icon ? <Icon aria-hidden='true' className='size-5' /> : provider.label}\n              {presentation === 'social' && Icon ? <span>{provider.label}</span> : null}\n            </Button>\n          )\n        })}\n      </div>\n    </div>\n  )\n\n  const createAccount = onCreateAccount && (\n    <p className='flex justify-center gap-1 text-center text-sm'>\n      <span>{dontHaveAccountLabel}</span>\n      <Button type='button' variant='link' className='h-auto cursor-pointer p-0 text-sm' onClick={onCreateAccount}>\n        {createAccountLabel}\n      </Button>\n    </p>\n  )\n\n  if (presentation === 'card') {\n    return (\n      <div className='w-full max-w-md'>\n        <Card className='w-full p-8 shadow-2xl'>\n          <header className='mb-8 flex flex-col items-center text-center'>\n            <div className='bg-secondary mb-4 flex size-14 items-center justify-center rounded-full border'>\n              <Lock aria-hidden='true' className='size-6' />\n            </div>\n            {logoText && <p className='text-muted-foreground mb-2 text-sm font-semibold'>{logoText}</p>}\n            <h1 className='mb-2 text-2xl font-bold tracking-tight'>{welcomeTitleLabel}</h1>\n            <p className='text-muted-foreground text-sm'>{welcomeDescriptionLabel}</p>\n          </header>\n          <div className='flex flex-col gap-6'>\n            {fields}\n            {providerSection}\n            {createAccount}\n          </div>\n        </Card>\n      </div>\n    )\n  }\n\n  return (\n    <div className='flex w-full max-w-md flex-col gap-6'>\n      {logoText && <div className='text-center text-2xl font-medium'>{logoText}</div>}\n      <Card>\n        <CardHeader className='text-center'>\n          <CardTitle className='text-2xl font-bold text-balance'>{welcomeTitleLabel}</CardTitle>\n          <CardDescription>{welcomeDescriptionLabel}</CardDescription>\n        </CardHeader>\n        <CardContent className='flex flex-col gap-5'>\n          {fields}\n          {providerSection}\n          {createAccount}\n        </CardContent>\n      </Card>\n    </div>\n  )\n}\n\nexport default LoginPage\n"],"mappings":"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","names":[]}

package/dist/blocks/application/login-forms/login-page.mjs

@@ -0,0 +1,185 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useId, useState } from "react";
+import { Eye, EyeOff, Lock } from "lucide-react";
+import { Button } from "../../../ui/button.mjs";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "../../../ui/card.mjs";
+import { Input } from "../../../ui/input.mjs";
+import { Label } from "../../../ui/label.mjs";
+import { CheckboxCheck } from "../../e-commerce/checkout-forms/checkbox-check.mjs";
+function LoginPage({
+  presentation,
+  logoText,
+  welcomeTitleLabel = "Bienvenido de nuevo",
+  welcomeDescriptionLabel = "Inicia sesi\xF3n para continuar",
+  emailLabel = "Correo electr\xF3nico",
+  emailPlaceholder = "taller@correo.com",
+  passwordLabel = "Contrase\xF1a",
+  passwordPlaceholder = "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022",
+  rememberMeLabel = "Recu\xE9rdame",
+  forgotPasswordLabel = "\xBFOlvidaste tu contrase\xF1a?",
+  signInLabel = "Iniciar sesi\xF3n",
+  orContinueWithLabel = "O contin\xFAa con",
+  dontHaveAccountLabel = "\xBFNo tienes una cuenta?",
+  createAccountLabel = "Crea una cuenta",
+  showPasswordAriaLabel = "Mostrar contrase\xF1a",
+  hidePasswordAriaLabel = "Ocultar contrase\xF1a",
+  providers = [],
+  providerIcons = {},
+  onSubmit,
+  onForgotPassword,
+  onCreateAccount,
+  onProviderSelect
+}) {
+  if (presentation !== "card" && presentation !== "social") {
+    throw new Error('LoginPage requires a valid presentation: "card" or "social".');
+  }
+  const providerIds = /* @__PURE__ */ new Set();
+  for (const provider of providers ?? []) {
+    if (providerIds.has(provider.id)) {
+      throw new Error("LoginPage provider ids must be unique.");
+    }
+    providerIds.add(provider.id);
+  }
+  const id = useId();
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const [remember, setRemember] = useState(false);
+  const [showPassword, setShowPassword] = useState(false);
+  const handleSubmit = (event) => {
+    event.preventDefault();
+    onSubmit?.({ email, password, remember });
+  };
+  const fields = /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col gap-5", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ jsx(Label, { htmlFor: `${id}-email`, children: emailLabel }),
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          id: `${id}-email`,
+          type: "email",
+          autoComplete: "email",
+          placeholder: emailPlaceholder,
+          value: email,
+          onChange: (event) => setEmail(event.target.value)
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ jsx(Label, { htmlFor: `${id}-password`, children: passwordLabel }),
+      /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            id: `${id}-password`,
+            type: showPassword ? "text" : "password",
+            autoComplete: "current-password",
+            placeholder: passwordPlaceholder,
+            value: password,
+            onChange: (event) => setPassword(event.target.value),
+            className: "pe-10"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            variant: "ghost",
+            size: "icon",
+            "aria-label": showPassword ? hidePasswordAriaLabel : showPasswordAriaLabel,
+            className: "absolute end-0 top-1/2 size-9 -translate-y-1/2 cursor-pointer hover:bg-transparent",
+            onClick: () => setShowPassword((value) => !value),
+            children: showPassword ? /* @__PURE__ */ jsx(EyeOff, { "aria-hidden": "true" }) : /* @__PURE__ */ jsx(Eye, { "aria-hidden": "true" })
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx(
+          CheckboxCheck,
+          {
+            id: `${id}-remember`,
+            checked: remember,
+            onCheckedChange: (value) => setRemember(value === true)
+          }
+        ),
+        /* @__PURE__ */ jsx(Label, { htmlFor: `${id}-remember`, className: "text-sm font-normal text-muted-foreground", children: rememberMeLabel })
+      ] }),
+      onForgotPassword && /* @__PURE__ */ jsx(Button, { type: "button", variant: "link", className: "h-auto cursor-pointer p-0 text-sm", onClick: onForgotPassword, children: forgotPasswordLabel })
+    ] }),
+    /* @__PURE__ */ jsx(Button, { type: "submit", className: "h-9 w-full cursor-pointer px-4 py-2", children: signInLabel })
+  ] });
+  const providerSection = providers.length > 0 && onProviderSelect && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", "aria-hidden": "true", children: [
+      /* @__PURE__ */ jsx("span", { className: "h-px flex-1 bg-border" }),
+      /* @__PURE__ */ jsx("span", { className: "text-muted-foreground text-xs uppercase", children: orContinueWithLabel }),
+      /* @__PURE__ */ jsx("span", { className: "h-px flex-1 bg-border" })
+    ] }),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: presentation === "card" ? "grid grid-cols-3 gap-3" : "grid grid-cols-2 gap-4",
+        role: "group",
+        "aria-label": orContinueWithLabel,
+        children: providers.map((provider) => {
+          const Icon = providerIcons[provider.id];
+          return /* @__PURE__ */ jsxs(
+            Button,
+            {
+              type: "button",
+              variant: "outline",
+              "aria-label": provider.label,
+              className: "h-9 w-full cursor-pointer px-3 py-2",
+              onClick: () => onProviderSelect(provider.id),
+              children: [
+                Icon ? /* @__PURE__ */ jsx(Icon, { "aria-hidden": "true", className: "size-5" }) : provider.label,
+                presentation === "social" && Icon ? /* @__PURE__ */ jsx("span", { children: provider.label }) : null
+              ]
+            },
+            provider.id
+          );
+        })
+      }
+    )
+  ] });
+  const createAccount = onCreateAccount && /* @__PURE__ */ jsxs("p", { className: "flex justify-center gap-1 text-center text-sm", children: [
+    /* @__PURE__ */ jsx("span", { children: dontHaveAccountLabel }),
+    /* @__PURE__ */ jsx(Button, { type: "button", variant: "link", className: "h-auto cursor-pointer p-0 text-sm", onClick: onCreateAccount, children: createAccountLabel })
+  ] });
+  if (presentation === "card") {
+    return /* @__PURE__ */ jsx("div", { className: "w-full max-w-md", children: /* @__PURE__ */ jsxs(Card, { className: "w-full p-8 shadow-2xl", children: [
+      /* @__PURE__ */ jsxs("header", { className: "mb-8 flex flex-col items-center text-center", children: [
+        /* @__PURE__ */ jsx("div", { className: "bg-secondary mb-4 flex size-14 items-center justify-center rounded-full border", children: /* @__PURE__ */ jsx(Lock, { "aria-hidden": "true", className: "size-6" }) }),
+        logoText && /* @__PURE__ */ jsx("p", { className: "text-muted-foreground mb-2 text-sm font-semibold", children: logoText }),
+        /* @__PURE__ */ jsx("h1", { className: "mb-2 text-2xl font-bold tracking-tight", children: welcomeTitleLabel }),
+        /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-sm", children: welcomeDescriptionLabel })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
+        fields,
+        providerSection,
+        createAccount
+      ] })
+    ] }) });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-md flex-col gap-6", children: [
+    logoText && /* @__PURE__ */ jsx("div", { className: "text-center text-2xl font-medium", children: logoText }),
+    /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsxs(CardHeader, { className: "text-center", children: [
+        /* @__PURE__ */ jsx(CardTitle, { className: "text-2xl font-bold text-balance", children: welcomeTitleLabel }),
+        /* @__PURE__ */ jsx(CardDescription, { children: welcomeDescriptionLabel })
+      ] }),
+      /* @__PURE__ */ jsxs(CardContent, { className: "flex flex-col gap-5", children: [
+        fields,
+        providerSection,
+        createAccount
+      ] })
+    ] })
+  ] });
+}
+var login_page_default = LoginPage;
+export {
+  LoginPage,
+  login_page_default as default
+};
+//# sourceMappingURL=login-page.mjs.map