@stackcraftmx/calcita 0.0.0-stage → 0.23.0

package/dist/access/accessRules.js

@@ -0,0 +1,49 @@
+function allowOnlyUnrestricted(access) {
+  return !access;
+}
+function createAccessChecker({ abilities = [], roles = [], policies = {}, context = {} } = {}) {
+  const abilitySet = new Set(abilities);
+  const roleSet = new Set(roles);
+  const passesPolicy = (policyName) => {
+    const policy = policies[policyName];
+    if (typeof policy !== "function") {
+      throw new Error(`La política «${policyName}» no está definida en createAccessChecker({policies})`);
+    }
+    return Boolean(policy(context));
+  };
+  return (access) => {
+    if (!access) {
+      return true;
+    }
+    if (access.ability && !abilitySet.has(access.ability)) {
+      return false;
+    }
+    if (access.anyOf && !access.anyOf.some((ability) => abilitySet.has(ability))) {
+      return false;
+    }
+    if (access.allOf && !access.allOf.every((ability) => abilitySet.has(ability))) {
+      return false;
+    }
+    if (access.role && !roleSet.has(access.role)) {
+      return false;
+    }
+    if (access.anyRole && !access.anyRole.some((role) => roleSet.has(role))) {
+      return false;
+    }
+    if (access.policy && !passesPolicy(access.policy)) {
+      return false;
+    }
+    if (access.policies && !access.policies.every(passesPolicy)) {
+      return false;
+    }
+    if (access.check && !access.check(context)) {
+      return false;
+    }
+    return true;
+  };
+}
+export {
+  allowOnlyUnrestricted,
+  createAccessChecker
+};
+//# sourceMappingURL=accessRules.js.map

package/dist/access/accessRules.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"accessRules.js","sources":["../../src/access/accessRules.js"],"sourcesContent":["// Quién puede ver qué: el menú, las rutas y los botones preguntan lo mismo con la misma regla («access»).\n//\n// El framework NO sabe de roles ni de permisos: cada proyecto declara sus reglas como le acomode y le da a ToolkitProvider\n// una función canAccess(access) → boolean. Para no programarla cada vez, createAccessChecker la arma con las formas de\n// siempre, y se pueden combinar (todas las que vengan tienen que cumplirse):\n//\n//   RBAC por permisos (las `abilities` que manda la sesión):\n//     {ability: 'orders.view'}                  ese permiso\n//     {anyOf: ['orders.view', 'orders.admin']}  alguno de esos\n//     {allOf: ['orders.view', 'reports.view']}  todos\n//   RBAC por roles:\n//     {role: 'admin'}  ·  {anyRole: ['admin', 'supervisor']}\n//   ABAC (atributos: dueño del registro, organización, horario…):\n//     {policy: 'ownsRecord'}  ·  {policies: ['ownsRecord', 'sameOrganization']}   políticas con nombre, que el proyecto\n//                                                                                  define una vez en createAccessChecker\n//     {check: (context) => context.user.id === record.ownerId}                    la regla escrita ahí mismo\n//\n// Sin access (undefined) lo ve cualquiera con sesión. Sin sesión o sin la lista, nada: falla CERRADO.\n//\n// OJO: esto solo decide lo que se PINTA. Lo que cada quien puede hacer lo vuelve a decidir el backend en cada petición;\n// cambiar esto en el navegador no abre nada.\n//\n// Funciones puras, sin React: function (regla de la casa). Se prueban con node --test (accessRules.test.js).\n\n/**\n * El canAccess de un proyecto que no usa permisos: sin access lo ve cualquiera; con access, nadie (falla cerrado, para\n * que una regla escrita y sin conectar se note en lugar de abrir todo).\n *\n * @param {object|undefined|null} access\n * @returns {boolean}\n */\nexport function allowOnlyUnrestricted(access) {\n    return !access;\n}\n\n/**\n * Arma el canAccess(access) del proyecto con sus permisos, sus roles y sus políticas.\n *\n * @param {object} [options]\n * @param {string[]} [options.abilities] los permisos de la sesión (p. ej. los `abilities` que manda el backend)\n * @param {string[]} [options.roles] los roles de la sesión\n * @param {Record<string, (context: any) => boolean>} [options.policies] las políticas con nombre (ABAC); reciben el context\n * @param {object} [options.context] lo que reciben las políticas y los check (la persona, su organización…)\n * @returns {(access: object|undefined|null) => boolean}\n */\nexport function createAccessChecker({abilities = [], roles = [], policies = {}, context = {}} = {}) {\n    const abilitySet = new Set(abilities);\n    const roleSet = new Set(roles);\n\n    const passesPolicy = (policyName) => {\n        const policy = policies[policyName];\n        // una política que nadie definió es un error de configuración: truena en vez de abrir o cerrar en silencio\n        if (typeof policy !== 'function') {\n            throw new Error(`La política «${policyName}» no está definida en createAccessChecker({policies})`);\n        }\n        return Boolean(policy(context));\n    };\n\n    return (access) => {\n        if (!access) {\n            return true;\n        }\n        if (access.ability && !abilitySet.has(access.ability)) {\n            return false;\n        }\n        if (access.anyOf && !access.anyOf.some((ability) => abilitySet.has(ability))) {\n            return false;\n        }\n        if (access.allOf && !access.allOf.every((ability) => abilitySet.has(ability))) {\n            return false;\n        }\n        if (access.role && !roleSet.has(access.role)) {\n            return false;\n        }\n        if (access.anyRole && !access.anyRole.some((role) => roleSet.has(role))) {\n            return false;\n        }\n        if (access.policy && !passesPolicy(access.policy)) {\n            return false;\n        }\n        if (access.policies && !access.policies.every(passesPolicy)) {\n            return false;\n        }\n        if (access.check && !access.check(context)) {\n            return false;\n        }\n        return true;\n    };\n}\n"],"names":[],"mappings":"AA+BO,SAAS,sBAAsB,QAAQ;AAC1C,SAAO,CAAC;AACZ;AAYO,SAAS,oBAAoB,EAAC,YAAY,CAAA,GAAI,QAAQ,CAAA,GAAI,WAAW,IAAI,UAAU,CAAA,EAAE,IAAI,CAAA,GAAI;AAChG,QAAM,aAAa,IAAI,IAAI,SAAS;AACpC,QAAM,UAAU,IAAI,IAAI,KAAK;AAE7B,QAAM,eAAe,CAAC,eAAe;AACjC,UAAM,SAAS,SAAS,UAAU;AAElC,QAAI,OAAO,WAAW,YAAY;AAC9B,YAAM,IAAI,MAAM,gBAAgB,UAAU,uDAAuD;AAAA,IACrG;AACA,WAAO,QAAQ,OAAO,OAAO,CAAC;AAAA,EAClC;AAEA,SAAO,CAAC,WAAW;AACf,QAAI,CAAC,QAAQ;AACT,aAAO;AAAA,IACX;AACA,QAAI,OAAO,WAAW,CAAC,WAAW,IAAI,OAAO,OAAO,GAAG;AACnD,aAAO;AAAA,IACX;AACA,QAAI,OAAO,SAAS,CAAC,OAAO,MAAM,KAAK,CAAC,YAAY,WAAW,IAAI,OAAO,CAAC,GAAG;AAC1E,aAAO;AAAA,IACX;AACA,QAAI,OAAO,SAAS,CAAC,OAAO,MAAM,MAAM,CAAC,YAAY,WAAW,IAAI,OAAO,CAAC,GAAG;AAC3E,aAAO;AAAA,IACX;AACA,QAAI,OAAO,QAAQ,CAAC,QAAQ,IAAI,OAAO,IAAI,GAAG;AAC1C,aAAO;AAAA,IACX;AACA,QAAI,OAAO,WAAW,CAAC,OAAO,QAAQ,KAAK,CAAC,SAAS,QAAQ,IAAI,IAAI,CAAC,GAAG;AACrE,aAAO;AAAA,IACX;AACA,QAAI,OAAO,UAAU,CAAC,aAAa,OAAO,MAAM,GAAG;AAC/C,aAAO;AAAA,IACX;AACA,QAAI,OAAO,YAAY,CAAC,OAAO,SAAS,MAAM,YAAY,GAAG;AACzD,aAAO;AAAA,IACX;AACA,QAAI,OAAO,SAAS,CAAC,OAAO,MAAM,OAAO,GAAG;AACxC,aAAO;AAAA,IACX;AACA,WAAO;AAAA,EACX;AACJ;"}

package/dist/access/permissionGroups.js

@@ -0,0 +1,43 @@
+const LAST_ORDER = 1e3;
+function composePermissionGroups(menuModules, t) {
+  const modules = Array.isArray(menuModules) ? menuModules : Object.values(menuModules);
+  return modules.filter((menuModule) => Array.isArray(menuModule.permissions) && menuModule.permissions.length > 0).sort((first, second) => (first.order ?? LAST_ORDER) - (second.order ?? LAST_ORDER)).map((menuModule) => {
+    const menuItem = menuModule.buildMenuItem?.({}) ?? {};
+    return {
+      key: menuItem.to ?? menuModule.permissions[0].key,
+      label: menuItem.label ?? t(menuItem.labelKey),
+      permissions: menuModule.permissions.map((permission) => ({
+        key: permission.key,
+        label: permission.label ?? t(permission.labelKey),
+        description: permission.description ?? (permission.descriptionKey ? t(permission.descriptionKey) : void 0)
+      }))
+    };
+  });
+}
+function groupStateOf(group, granted) {
+  const grantedSet = new Set(granted);
+  const grantedCount = group.permissions.filter((permission) => grantedSet.has(permission.key)).length;
+  const total = group.permissions.length;
+  return { grantedCount, total, isAll: total > 0 && grantedCount === total, isSome: grantedCount > 0 && grantedCount < total };
+}
+function withPermission(granted, permissionKey, shouldGrant) {
+  if (shouldGrant) {
+    return granted.includes(permissionKey) ? [...granted] : [...granted, permissionKey];
+  }
+  return granted.filter((key) => key !== permissionKey);
+}
+function withPermissionGroup(granted, group, shouldGrant) {
+  const groupKeys = new Set(group.permissions.map((permission) => permission.key));
+  if (shouldGrant) {
+    const missing = group.permissions.map((permission) => permission.key).filter((key) => !granted.includes(key));
+    return [...granted, ...missing];
+  }
+  return granted.filter((key) => !groupKeys.has(key));
+}
+export {
+  composePermissionGroups,
+  groupStateOf,
+  withPermission,
+  withPermissionGroup
+};
+//# sourceMappingURL=permissionGroups.js.map

package/dist/access/permissionGroups.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"permissionGroups.js","sources":["../../src/access/permissionGroups.js"],"sourcesContent":["// La lógica de la pantalla de perfiles y permisos (PermissionMatrix), sin React: cuántos permisos de un grupo tiene un\n// perfil, y prender o apagar un permiso o un grupo entero.\n//\n// Los permisos son los mismos textos que piden los menu.js y las rutas (access: {ability: 'orders.view'}). Cada módulo\n// declara los suyos en su menu.js y composePermissionGroups los junta (un grupo por módulo, en el orden del menú): la\n// pantalla de perfiles no tiene lista central que editar. Guardar la lista de permisos del perfil es cosa del backend.\n//\n//   // modules/orders/menu.js\n//   export const permissions = [\n//       {key: 'orders.view', labelKey: 'orders:permissions.view', descriptionKey: 'orders:permissions.viewDescription'},\n//       {key: 'orders.cancel', labelKey: 'orders:permissions.cancel'},\n//   ];\n//\n// Funciones puras, sin React: function (regla de la casa). Se prueban con node --test (permissionGroups.test.js).\n\n// la posición de un módulo que no dice su order: al final (la misma regla que composeMenu)\nconst LAST_ORDER = 1000;\n\n/**\n * Los grupos de permisos que declaran los módulos en su menu.js (`export const permissions`), uno por módulo y en el orden\n * del menú, con el nombre de su entrada del menú como título del grupo.\n *\n * @param {Record<string, any>|any[]} menuModules lo que regresa import.meta.glob(..., {eager: true}) o una lista\n * @param {(key: string, values?: object) => string} t el traductor (para las llaves labelKey y descriptionKey)\n * @returns {Array<{key: string, label: string, permissions: Array<{key: string, label: string, description?: string}>}>}\n */\nexport function composePermissionGroups(menuModules, t) {\n    const modules = Array.isArray(menuModules) ? menuModules : Object.values(menuModules);\n    return modules\n        .filter((menuModule) => Array.isArray(menuModule.permissions) && menuModule.permissions.length > 0)\n        .sort((first, second) => (first.order ?? LAST_ORDER) - (second.order ?? LAST_ORDER))\n        .map((menuModule) => {\n            const menuItem = menuModule.buildMenuItem?.({}) ?? {};\n            return {\n                key: menuItem.to ?? menuModule.permissions[0].key,\n                label: menuItem.label ?? t(menuItem.labelKey),\n                permissions: menuModule.permissions.map((permission) => ({\n                    key: permission.key,\n                    label: permission.label ?? t(permission.labelKey),\n                    description: permission.description ?? (permission.descriptionKey ? t(permission.descriptionKey) : undefined),\n                })),\n            };\n        });\n}\n\n/**\n * Cuántos permisos del grupo están dados.\n *\n * @param {{permissions: Array<{key: string}>}} group\n * @param {string[]} granted los permisos del perfil\n * @returns {{grantedCount: number, total: number, isAll: boolean, isSome: boolean}}\n */\nexport function groupStateOf(group, granted) {\n    const grantedSet = new Set(granted);\n    const grantedCount = group.permissions.filter((permission) => grantedSet.has(permission.key)).length;\n    const total = group.permissions.length;\n    return {grantedCount, total, isAll: total > 0 && grantedCount === total, isSome: grantedCount > 0 && grantedCount < total};\n}\n\n/**\n * Prende o apaga un permiso. Lo demás se queda en su orden; uno nuevo va al final.\n *\n * @param {string[]} granted\n * @param {string} permissionKey\n * @param {boolean} shouldGrant\n * @returns {string[]} la lista nueva (no cambia la de entrada)\n */\nexport function withPermission(granted, permissionKey, shouldGrant) {\n    if (shouldGrant) {\n        return granted.includes(permissionKey) ? [...granted] : [...granted, permissionKey];\n    }\n    return granted.filter((key) => key !== permissionKey);\n}\n\n/**\n * Prende o apaga todos los permisos de un grupo. Los que ya estaban se quedan en su lugar; los que faltan van al final.\n *\n * @param {string[]} granted\n * @param {{permissions: Array<{key: string}>}} group\n * @param {boolean} shouldGrant\n * @returns {string[]}\n */\nexport function withPermissionGroup(granted, group, shouldGrant) {\n    const groupKeys = new Set(group.permissions.map((permission) => permission.key));\n    if (shouldGrant) {\n        const missing = group.permissions.map((permission) => permission.key).filter((key) => !granted.includes(key));\n        return [...granted, ...missing];\n    }\n    return granted.filter((key) => !groupKeys.has(key));\n}\n"],"names":[],"mappings":"AAgBA,MAAM,aAAa;AAUZ,SAAS,wBAAwB,aAAa,GAAG;AACpD,QAAM,UAAU,MAAM,QAAQ,WAAW,IAAI,cAAc,OAAO,OAAO,WAAW;AACpF,SAAO,QACF,OAAO,CAAC,eAAe,MAAM,QAAQ,WAAW,WAAW,KAAK,WAAW,YAAY,SAAS,CAAC,EACjG,KAAK,CAAC,OAAO,YAAY,MAAM,SAAS,eAAe,OAAO,SAAS,WAAW,EAClF,IAAI,CAAC,eAAe;AACjB,UAAM,WAAW,WAAW,gBAAgB,CAAA,CAAE,KAAK,CAAA;AACnD,WAAO;AAAA,MACH,KAAK,SAAS,MAAM,WAAW,YAAY,CAAC,EAAE;AAAA,MAC9C,OAAO,SAAS,SAAS,EAAE,SAAS,QAAQ;AAAA,MAC5C,aAAa,WAAW,YAAY,IAAI,CAAC,gBAAgB;AAAA,QACrD,KAAK,WAAW;AAAA,QAChB,OAAO,WAAW,SAAS,EAAE,WAAW,QAAQ;AAAA,QAChD,aAAa,WAAW,gBAAgB,WAAW,iBAAiB,EAAE,WAAW,cAAc,IAAI;AAAA,MACvH,EAAkB;AAAA,IAClB;AAAA,EACQ,CAAC;AACT;AASO,SAAS,aAAa,OAAO,SAAS;AACzC,QAAM,aAAa,IAAI,IAAI,OAAO;AAClC,QAAM,eAAe,MAAM,YAAY,OAAO,CAAC,eAAe,WAAW,IAAI,WAAW,GAAG,CAAC,EAAE;AAC9F,QAAM,QAAQ,MAAM,YAAY;AAChC,SAAO,EAAC,cAAc,OAAO,OAAO,QAAQ,KAAK,iBAAiB,OAAO,QAAQ,eAAe,KAAK,eAAe,MAAK;AAC7H;AAUO,SAAS,eAAe,SAAS,eAAe,aAAa;AAChE,MAAI,aAAa;AACb,WAAO,QAAQ,SAAS,aAAa,IAAI,CAAC,GAAG,OAAO,IAAI,CAAC,GAAG,SAAS,aAAa;AAAA,EACtF;AACA,SAAO,QAAQ,OAAO,CAAC,QAAQ,QAAQ,aAAa;AACxD;AAUO,SAAS,oBAAoB,SAAS,OAAO,aAAa;AAC7D,QAAM,YAAY,IAAI,IAAI,MAAM,YAAY,IAAI,CAAC,eAAe,WAAW,GAAG,CAAC;AAC/E,MAAI,aAAa;AACb,UAAM,UAAU,MAAM,YAAY,IAAI,CAAC,eAAe,WAAW,GAAG,EAAE,OAAO,CAAC,QAAQ,CAAC,QAAQ,SAAS,GAAG,CAAC;AAC5G,WAAO,CAAC,GAAG,SAAS,GAAG,OAAO;AAAA,EAClC;AACA,SAAO,QAAQ,OAAO,CAAC,QAAQ,CAAC,UAAU,IAAI,GAAG,CAAC;AACtD;"}

package/dist/access/useCan.js

@@ -0,0 +1,12 @@
+import { useToolkitSettings } from "../toolkit/toolkitContext.js";
+function useCan(access) {
+  return useToolkitSettings().canAccess(access);
+}
+function useAccessChecker() {
+  return useToolkitSettings().canAccess;
+}
+export {
+  useAccessChecker,
+  useCan
+};
+//# sourceMappingURL=useCan.js.map

package/dist/access/useCan.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCan.js","sources":["../../src/access/useCan.js"],"sourcesContent":["// ¿Esta sesión puede ver esto? Con la regla que el proyecto le dio a ToolkitProvider (canAccess).\n//\n//   const canCancel = useCan({ability: 'orders.cancel'});\n//   {canCancel && <Button>Cancelar pedido</Button>}\n//\n// Hook genérico del paquete: function (regla de la casa).\nimport {useToolkitSettings} from '@/toolkit/toolkitContext.js';\n\n/**\n * @param {object|undefined|null} access la regla (accessRules.js); sin ella, sí\n * @returns {boolean}\n */\nexport function useCan(access) {\n    return useToolkitSettings().canAccess(access);\n}\n\n/**\n * La regla del proyecto, para preguntar por varias cosas a la vez (p. ej. armar el menú).\n *\n * @returns {(access: object|undefined|null) => boolean}\n */\nexport function useAccessChecker() {\n    return useToolkitSettings().canAccess;\n}\n"],"names":[],"mappings":";AAYO,SAAS,OAAO,QAAQ;AAC3B,SAAO,mBAAkB,EAAG,UAAU,MAAM;AAChD;AAOO,SAAS,mBAAmB;AAC/B,SAAO,mBAAkB,EAAG;AAChC;"}

package/dist/account/AccountProvider.js

@@ -0,0 +1,58 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { createContext, useState, useCallback, useRef, useEffect, useMemo, useContext } from "react";
+import { missingConnectorFunctionsOf } from "./accountConnector.js";
+import { createAccessChecker } from "../access/accessRules.js";
+import ErrorPage, { ERROR_PAGE_KIND } from "../ui/layout/ErrorPage.js";
+import FullPageLoader from "../ui/layout/FullPageLoader.js";
+const AccountContext = createContext(null);
+const NOT_LOADED = void 0;
+function AccountProvider({ connector, refreshKey, initialSession = NOT_LOADED, children }) {
+  const missingFunctions = missingConnectorFunctionsOf(connector);
+  if (missingFunctions.length > 0) {
+    throw new Error(`Al conector de la cuenta le faltan estas funciones: ${missingFunctions.join(", ")}`);
+  }
+  const [session, setSession] = useState(initialSession);
+  const [loadError, setLoadError] = useState(null);
+  const refreshSession = useCallback(async () => {
+    try {
+      setSession(await connector.loadSession());
+      setLoadError(null);
+    } catch (error) {
+      setLoadError(error);
+    }
+  }, [connector]);
+  const signOut = useCallback(async () => {
+    await connector.signOut();
+    setSession(null);
+  }, [connector]);
+  const skipsFirstLoad = useRef(initialSession !== NOT_LOADED);
+  useEffect(() => {
+    if (skipsFirstLoad.current) {
+      skipsFirstLoad.current = false;
+      return;
+    }
+    refreshSession();
+  }, [refreshSession, refreshKey]);
+  const canAccess = useMemo(() => createAccessChecker({ abilities: session?.abilities ?? [], roles: session?.roles ?? [] }), [session]);
+  const value = useMemo(() => ({ connector, session: session ?? null, refreshSession, signOut }), [connector, session, refreshSession, signOut]);
+  if (loadError && session === NOT_LOADED) {
+    return /* @__PURE__ */ jsx(ErrorPage, { kind: ERROR_PAGE_KIND.serverError, text: loadError.message, onRetry: refreshSession });
+  }
+  if (session === NOT_LOADED) {
+    return /* @__PURE__ */ jsx(FullPageLoader, {});
+  }
+  return /* @__PURE__ */ jsx(AccountContext.Provider, { value, children: children(canAccess) });
+}
+function useAccount() {
+  const account = useContext(AccountContext);
+  if (!account) {
+    throw new Error("useAccount necesita estar dentro de <AccountProvider>");
+  }
+  return account;
+}
+export {
+  AccountProvider as default,
+  useAccount
+};
+//# sourceMappingURL=AccountProvider.js.map

package/dist/account/AccountProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccountProvider.js","sources":["../../src/account/AccountProvider.jsx"],"sourcesContent":["// La cuenta al alcance de toda la app: carga la sesión al abrir (connector.loadSession) y la reparte. Las pantallas de la\n// cuenta y la barra la leen con useAccount; el menú, las rutas y los botones preguntan sus permisos con la regla que sale de\n// aquí (createAccessChecker), que se le pasa a ToolkitProvider:\n//\n//   <AccountProvider connector={accountConnector}>\n//       {(canAccess) => <ToolkitProvider canAccess={canAccess} …>…</ToolkitProvider>}\n//   </AccountProvider>\n//\n// Mientras llega la primera respuesta se ve la pantalla de carga (sin ella, el menú se pintaría vacío un instante); si el\n// servidor no contesta, la página de error con «Intentar de nuevo», no la de entrar (no es que no haya sesión).\n//\n// Genérico del paquete: function (regla de la casa).\nimport {createContext, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';\n\nimport {missingConnectorFunctionsOf} from '@/account/accountConnector.js';\nimport {createAccessChecker} from '@/access/accessRules.js';\nimport ErrorPage, {ERROR_PAGE_KIND} from '@/ui/layout/ErrorPage.jsx';\nimport FullPageLoader from '@/ui/layout/FullPageLoader.jsx';\n\nconst AccountContext = createContext(null);\n// lo que se sabe antes de la primera respuesta: ni dentro ni fuera\nconst NOT_LOADED = undefined;\n\n/**\n * @param {object} props\n * @param {import('@/account/accountConnector.js').AccountConnector} props.connector las llamadas al backend\n * @param {unknown} [props.refreshKey] al cambiar, la sesión se vuelve a leer (p. ej. el idioma, si el backend manda los\n *     nombres de los perfiles traducidos)\n * @param {import('@/account/accountConnector.js').AccountSession|null} [props.initialSession] la sesión que ya se conoce\n *     (p. ej. la que leyó el servidor al pintar): se usa sin esperar la primera respuesta\n * @param {(canAccess: (access: object|null|undefined) => boolean) => import('react').ReactNode} props.children recibe la\n *     regla de permisos de la sesión\n */\nexport default function AccountProvider({connector, refreshKey, initialSession = NOT_LOADED, children}) {\n    // guard clause: un conector incompleto es un error de quien lo escribió; se avisa al arrancar y no al picar un botón\n    const missingFunctions = missingConnectorFunctionsOf(connector);\n    if (missingFunctions.length > 0) {\n        throw new Error(`Al conector de la cuenta le faltan estas funciones: ${missingFunctions.join(', ')}`);\n    }\n\n    const [session, setSession] = useState(initialSession);\n    const [loadError, setLoadError] = useState(null);\n\n    const refreshSession = useCallback(async () => {\n        try {\n            setSession(await connector.loadSession());\n            setLoadError(null);\n        } catch (error) {\n            setLoadError(error);\n        }\n    }, [connector]);\n\n    const signOut = useCallback(async () => {\n        await connector.signOut();\n        setSession(null);\n    }, [connector]);\n\n    // con la sesión ya conocida no se pide al abrir; sí cuando cambia refreshKey\n    const skipsFirstLoad = useRef(initialSession !== NOT_LOADED);\n    useEffect(() => {\n        if (skipsFirstLoad.current) {\n            skipsFirstLoad.current = false;\n            return;\n        }\n        refreshSession();\n    }, [refreshSession, refreshKey]);\n\n    const canAccess = useMemo(() => createAccessChecker({abilities: session?.abilities ?? [], roles: session?.roles ?? []}), [session]);\n    const value = useMemo(() => ({connector, session: session ?? null, refreshSession, signOut}), [connector, session, refreshSession, signOut]);\n\n    if (loadError && session === NOT_LOADED) {\n        return <ErrorPage kind={ERROR_PAGE_KIND.serverError} text={loadError.message} onRetry={refreshSession} />;\n    }\n    if (session === NOT_LOADED) {\n        return <FullPageLoader />;\n    }\n    return <AccountContext.Provider value={value}>{children(canAccess)}</AccountContext.Provider>;\n}\n\n/**\n * La cuenta: {session, refreshSession, signOut, connector}. session es null si nadie está dentro.\n *\n * @returns {{session: import('@/account/accountConnector.js').AccountSession|null, refreshSession: () => Promise<void>, signOut: () => Promise<void>, connector: import('@/account/accountConnector.js').AccountConnector}}\n */\nexport function useAccount() {\n    const account = useContext(AccountContext);\n    if (!account) {\n        throw new Error('useAccount necesita estar dentro de <AccountProvider>');\n    }\n    return account;\n}\n"],"names":[],"mappings":";;;;;;;AAmBA,MAAM,iBAAiB,cAAc,IAAI;AAEzC,MAAM,aAAa;AAYnB,SAAwB,gBAAgB,EAAC,WAAW,YAAY,iBAAiB,YAAY,YAAW;AAEpG,QAAM,mBAAmB,4BAA4B,SAAS;AAC9D,MAAI,iBAAiB,SAAS,GAAG;AAC7B,UAAM,IAAI,MAAM,uDAAuD,iBAAiB,KAAK,IAAI,CAAC,EAAE;AAAA,EACxG;AAEA,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,cAAc;AACrD,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,IAAI;AAE/C,QAAM,iBAAiB,YAAY,YAAY;AAC3C,QAAI;AACA,iBAAW,MAAM,UAAU,aAAa;AACxC,mBAAa,IAAI;AAAA,IACrB,SAAS,OAAO;AACZ,mBAAa,KAAK;AAAA,IACtB;AAAA,EACJ,GAAG,CAAC,SAAS,CAAC;AAEd,QAAM,UAAU,YAAY,YAAY;AACpC,UAAM,UAAU,QAAA;AAChB,eAAW,IAAI;AAAA,EACnB,GAAG,CAAC,SAAS,CAAC;AAGd,QAAM,iBAAiB,OAAO,mBAAmB,UAAU;AAC3D,YAAU,MAAM;AACZ,QAAI,eAAe,SAAS;AACxB,qBAAe,UAAU;AACzB;AAAA,IACJ;AACA,mBAAA;AAAA,EACJ,GAAG,CAAC,gBAAgB,UAAU,CAAC;AAE/B,QAAM,YAAY,QAAQ,MAAM,oBAAoB,EAAC,WAAW,SAAS,aAAa,CAAA,GAAI,OAAO,SAAS,SAAS,CAAA,EAAC,CAAE,GAAG,CAAC,OAAO,CAAC;AAClI,QAAM,QAAQ,QAAQ,OAAO,EAAC,WAAW,SAAS,WAAW,MAAM,gBAAgB,QAAA,IAAW,CAAC,WAAW,SAAS,gBAAgB,OAAO,CAAC;AAE3I,MAAI,aAAa,YAAY,YAAY;AACrC,WAAO,oBAAC,aAAU,MAAM,gBAAgB,aAAa,MAAM,UAAU,SAAS,SAAS,eAAA,CAAgB;AAAA,EAC3G;AACA,MAAI,YAAY,YAAY;AACxB,+BAAQ,gBAAA,EAAe;AAAA,EAC3B;AACA,6BAAQ,eAAe,UAAf,EAAwB,OAAe,UAAA,SAAS,SAAS,GAAE;AACvE;AAOO,SAAS,aAAa;AACzB,QAAM,UAAU,WAAW,cAAc;AACzC,MAAI,CAAC,SAAS;AACV,UAAM,IAAI,MAAM,uDAAuD;AAAA,EAC3E;AACA,SAAO;AACX;"}

package/dist/account/AccountSecuritySection.js

@@ -0,0 +1,81 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useCallback, useEffect, useMemo } from "react";
+import Alert from "@mui/material/Alert";
+import Skeleton from "@mui/material/Skeleton";
+import Stack from "@mui/material/Stack";
+import Typography from "@mui/material/Typography";
+import { useAccount } from "./AccountProvider.js";
+import DemoTotpCodeButton from "./DemoTotpCodeButton.js";
+import ChangePasswordForm from "../forms/auth/ChangePasswordForm.js";
+import TwoStepVerificationCard from "../forms/security/TwoStepVerificationCard.js";
+import ActivityLog from "../security/ActivityLog.js";
+import { createPasskey, passkeysSupported } from "../security/passkeys.js";
+import SessionsCard from "../security/SessionsCard.js";
+import { useToolkitTranslation } from "../toolkit/useToolkitTranslation.js";
+import SectionCard from "../ui/layout/SectionCard.js";
+const FORM_MAX_WIDTH = 520;
+const LOADING_HEIGHT_PIXELS = 220;
+function AccountSecuritySection({ showPasswordChange = true }) {
+  const { t } = useToolkitTranslation("account");
+  const { connector, session } = useAccount();
+  const [security, setSecurity] = useState(null);
+  const [sessions, setSessions] = useState(null);
+  const [events, setEvents] = useState(null);
+  const [loadError, setLoadError] = useState(null);
+  const isDemo = typeof connector.demoTotpCode === "function";
+  const refreshActivity = useCallback(() => connector.listActivity().then(setEvents).catch((error) => setLoadError(error.message)), [connector]);
+  const refreshSessions = useCallback(() => connector.listSessions().then(setSessions).catch((error) => setLoadError(error.message)), [connector]);
+  useEffect(() => {
+    connector.loadSecurity().then(setSecurity).catch((error) => setLoadError(error.message));
+    refreshSessions();
+    refreshActivity();
+  }, [connector, refreshActivity, refreshSessions]);
+  const actions = useMemo(() => ({
+    addPasskey: async (name) => connector.savePasskey({ name, credential: await createPasskey(await connector.passkeyRegistrationOptions()) }),
+    removePasskey: (passkey, password) => connector.removePasskey({ passkeyId: passkey.id, password }),
+    startTotp: async () => ({
+      ...await connector.startTotp(),
+      // en la demostración, el atajo del código abajo del campo
+      extra: isDemo ? /* @__PURE__ */ jsx(DemoTotpCodeButton, { loadCode: connector.demoTotpCode }) : void 0
+    }),
+    confirmTotp: (code) => connector.confirmTotp(code),
+    disableTotp: (password) => connector.disableTotp(password),
+    regenerateRecoveryCodes: (password) => connector.regenerateRecoveryCodes(password)
+  }), [connector, isDemo]);
+  const changeSecurity = (nextSecurity) => {
+    setSecurity(nextSecurity);
+    refreshActivity();
+  };
+  return /* @__PURE__ */ jsxs(Stack, { spacing: 3, children: [
+    loadError && /* @__PURE__ */ jsx(Alert, { severity: "error", children: loadError }),
+    showPasswordChange && /* @__PURE__ */ jsxs(SectionCard, { title: t("profile.password.title"), children: [
+      /* @__PURE__ */ jsx(Typography, { variant: "body2", color: "text.secondary", sx: { mb: 2 }, children: t("profile.password.text") }),
+      /* @__PURE__ */ jsx(Stack, { sx: { maxWidth: FORM_MAX_WIDTH }, children: /* @__PURE__ */ jsx(ChangePasswordForm, { onSubmit: async (values) => {
+        await connector.changePassword(values);
+        refreshActivity();
+      } }) })
+    ] }),
+    security ? /* @__PURE__ */ jsx(
+      TwoStepVerificationCard,
+      {
+        security,
+        onSecurityChange: changeSecurity,
+        actions,
+        canUsePasskeys: passkeysSupported(),
+        account: session?.user.email,
+        passkeyNotice: isDemo ? t("demo.passkeyNote") : void 0
+      }
+    ) : /* @__PURE__ */ jsx(Skeleton, { variant: "rounded", height: LOADING_HEIGHT_PIXELS }),
+    isDemo && /* @__PURE__ */ jsx(Alert, { severity: "info", children: t("demo.securityNote") }),
+    /* @__PURE__ */ jsx(SessionsCard, { sessions, onCloseOthers: connector.closeOtherSessions, onClosed: () => {
+      refreshSessions();
+      refreshActivity();
+    } }),
+    /* @__PURE__ */ jsx(ActivityLog, { events })
+  ] });
+}
+export {
+  AccountSecuritySection as default
+};
+//# sourceMappingURL=AccountSecuritySection.js.map

package/dist/account/AccountSecuritySection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccountSecuritySection.js","sources":["../../src/account/AccountSecuritySection.jsx"],"sourcesContent":["// La seguridad de la cuenta, completa: cambiar la contraseña (ChangePasswordForm), la verificación en dos pasos\n// (TwoStepVerificationCard: llaves de acceso, app autenticadora y códigos de recuperación), las sesiones abiertas\n// (SessionsCard) y la bitácora (ActivityLog). Todo lo del servidor sale del conector de la cuenta.\n//\n// Las llaves de acceso se crean aquí con el navegador (createPasskey) y la respuesta va al servidor (savePasskey). La\n// bitácora se vuelve a pedir después de cada cambio: así se ve aparecer lo que se acaba de hacer.\n//\n// Genérico del paquete: function (regla de la casa).\nimport {useCallback, useEffect, useMemo, useState} from 'react';\nimport Alert from '@mui/material/Alert';\nimport Skeleton from '@mui/material/Skeleton';\nimport Stack from '@mui/material/Stack';\nimport Typography from '@mui/material/Typography';\n\nimport {useAccount} from '@/account/AccountProvider.jsx';\nimport DemoTotpCodeButton from '@/account/DemoTotpCodeButton.jsx';\nimport ChangePasswordForm from '@/forms/auth/ChangePasswordForm.jsx';\nimport TwoStepVerificationCard from '@/forms/security/TwoStepVerificationCard.jsx';\nimport ActivityLog from '@/security/ActivityLog.jsx';\nimport {createPasskey, passkeysSupported} from '@/security/passkeys.js';\nimport SessionsCard from '@/security/SessionsCard.jsx';\nimport {useToolkitTranslation} from '@/toolkit/useToolkitTranslation.js';\nimport SectionCard from '@/ui/layout/SectionCard.jsx';\n\n// lo ancho del formulario de la contraseña: un renglón cómodo\nconst FORM_MAX_WIDTH = 520;\nconst LOADING_HEIGHT_PIXELS = 220;\n\n/**\n * @param {object} props\n * @param {boolean} [props.showPasswordChange] por omisión sí\n */\nexport default function AccountSecuritySection({showPasswordChange = true}) {\n    const {t} = useToolkitTranslation('account');\n    const {connector, session} = useAccount();\n    const [security, setSecurity] = useState(null);\n    const [sessions, setSessions] = useState(null);\n    const [events, setEvents] = useState(null);\n    const [loadError, setLoadError] = useState(null);\n    const isDemo = typeof connector.demoTotpCode === 'function';\n\n    const refreshActivity = useCallback(() => connector.listActivity().then(setEvents).catch((error) => setLoadError(error.message)), [connector]);\n    const refreshSessions = useCallback(() => connector.listSessions().then(setSessions).catch((error) => setLoadError(error.message)), [connector]);\n\n    useEffect(() => {\n        connector.loadSecurity().then(setSecurity).catch((error) => setLoadError(error.message));\n        refreshSessions();\n        refreshActivity();\n    }, [connector, refreshActivity, refreshSessions]);\n\n    // lo que hace la tarjeta de dos pasos en cada caso, con el conector\n    const actions = useMemo(() => ({\n        addPasskey: async (name) => connector.savePasskey({name, credential: await createPasskey(await connector.passkeyRegistrationOptions())}),\n        removePasskey: (passkey, password) => connector.removePasskey({passkeyId: passkey.id, password}),\n        startTotp: async () => ({\n            ...await connector.startTotp(),\n            // en la demostración, el atajo del código abajo del campo\n            extra: isDemo ? <DemoTotpCodeButton loadCode={connector.demoTotpCode} /> : undefined,\n        }),\n        confirmTotp: (code) => connector.confirmTotp(code),\n        disableTotp: (password) => connector.disableTotp(password),\n        regenerateRecoveryCodes: (password) => connector.regenerateRecoveryCodes(password),\n    }), [connector, isDemo]);\n\n    const changeSecurity = (nextSecurity) => {\n        setSecurity(nextSecurity);\n        refreshActivity();\n    };\n\n    return (\n        <Stack spacing={3}>\n            {loadError && <Alert severity=\"error\">{loadError}</Alert>}\n            {showPasswordChange && (\n                <SectionCard title={t('profile.password.title')}>\n                    <Typography variant=\"body2\" color=\"text.secondary\" sx={{mb: 2}}>{t('profile.password.text')}</Typography>\n                    <Stack sx={{maxWidth: FORM_MAX_WIDTH}}>\n                        <ChangePasswordForm onSubmit={async (values) => {\n                            await connector.changePassword(values);\n                            refreshActivity();\n                        }} />\n                    </Stack>\n                </SectionCard>\n            )}\n            {security\n                ? <TwoStepVerificationCard security={security} onSecurityChange={changeSecurity} actions={actions}\n                                           canUsePasskeys={passkeysSupported()} account={session?.user.email}\n                                           // en la demostración la llave es de verdad pero el servidor se olvida al recargar:\n                                           // se avisa antes de crearla para que nadie se quede con una llave huérfana\n                                           passkeyNotice={isDemo ? t('demo.passkeyNote') : undefined} />\n                : <Skeleton variant=\"rounded\" height={LOADING_HEIGHT_PIXELS} />}\n            {isDemo && <Alert severity=\"info\">{t('demo.securityNote')}</Alert>}\n            <SessionsCard sessions={sessions} onCloseOthers={connector.closeOtherSessions} onClosed={() => {\n                refreshSessions();\n                refreshActivity();\n            }} />\n            <ActivityLog events={events} />\n        </Stack>\n    );\n}\n"],"names":[],"mappings":"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"}

package/dist/account/DemoTotpCodeButton.js

@@ -0,0 +1,26 @@
+"use client";
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useFormikContext } from "formik";
+import Button from "@mui/material/Button";
+import Stack from "@mui/material/Stack";
+import Typography from "@mui/material/Typography";
+import ScienceOutlinedIcon from "@mui/icons-material/ScienceOutlined";
+import { useToolkitTranslation } from "../toolkit/useToolkitTranslation.js";
+function DemoTotpCodeButton({ loadCode }) {
+  const { t } = useToolkitTranslation("account");
+  const { setFieldValue } = useFormikContext();
+  const fillCode = async () => {
+    const code = await loadCode();
+    if (code) {
+      setFieldValue("code", code);
+    }
+  };
+  return /* @__PURE__ */ jsxs(Stack, { spacing: 0.5, sx: { alignItems: "center" }, children: [
+    /* @__PURE__ */ jsx(Button, { size: "small", startIcon: /* @__PURE__ */ jsx(ScienceOutlinedIcon, {}), onClick: fillCode, children: t("demo.totpCode") }),
+    /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "text.secondary", sx: { textAlign: "center" }, children: t("demo.totpCodeHelp") })
+  ] });
+}
+export {
+  DemoTotpCodeButton as default
+};
+//# sourceMappingURL=DemoTotpCodeButton.js.map

package/dist/account/DemoTotpCodeButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DemoTotpCodeButton.js","sources":["../../src/account/DemoTotpCodeButton.jsx"],"sourcesContent":["// El atajo de la DEMOSTRACIÓN para la app autenticadora: llena el campo «code» del formulario con el código que enseñaría\n// la app ahorita. Para quien prueba sin la app en su teléfono (y para las pruebas automáticas, que no escanean QR). Solo\n// sale cuando el conector trae demoTotpCode: con un backend de verdad no existe (el código solo lo conoce la app).\n//\n// Va dentro del formulario de formik (abajo del segundo paso o en el diálogo de activar la app).\n//\n// Genérico del paquete: function (regla de la casa).\nimport {useFormikContext} from 'formik';\nimport Button from '@mui/material/Button';\nimport Stack from '@mui/material/Stack';\nimport Typography from '@mui/material/Typography';\nimport ScienceOutlinedIcon from '@mui/icons-material/ScienceOutlined';\n\nimport {useToolkitTranslation} from '@/toolkit/useToolkitTranslation.js';\n\n/**\n * @param {{loadCode: () => Promise<string|null>}} props\n */\nexport default function DemoTotpCodeButton({loadCode}) {\n    const {t} = useToolkitTranslation('account');\n    const {setFieldValue} = useFormikContext();\n\n    const fillCode = async () => {\n        const code = await loadCode();\n        if (code) {\n            setFieldValue('code', code);\n        }\n    };\n\n    return (\n        <Stack spacing={0.5} sx={{alignItems: 'center'}}>\n            <Button size=\"small\" startIcon={<ScienceOutlinedIcon />} onClick={fillCode}>{t('demo.totpCode')}</Button>\n            <Typography variant=\"caption\" color=\"text.secondary\" sx={{textAlign: 'center'}}>{t('demo.totpCodeHelp')}</Typography>\n        </Stack>\n    );\n}\n"],"names":[],"mappings":";;;;;;;;AAkBA,SAAwB,mBAAmB,EAAC,YAAW;AACnD,QAAM,EAAC,EAAA,IAAK,sBAAsB,SAAS;AAC3C,QAAM,EAAC,cAAA,IAAiB,iBAAA;AAExB,QAAM,WAAW,YAAY;AACzB,UAAM,OAAO,MAAM,SAAA;AACnB,QAAI,MAAM;AACN,oBAAc,QAAQ,IAAI;AAAA,IAC9B;AAAA,EACJ;AAEA,SACI,qBAAC,SAAM,SAAS,KAAK,IAAI,EAAC,YAAY,YAClC,UAAA;AAAA,IAAA,oBAAC,QAAA,EAAO,MAAK,SAAQ,WAAW,oBAAC,qBAAA,CAAA,CAAoB,GAAI,SAAS,UAAW,UAAA,EAAE,eAAe,GAAE;AAAA,IAChG,oBAAC,YAAA,EAAW,SAAQ,WAAU,OAAM,kBAAiB,IAAI,EAAC,WAAW,SAAA,GAAY,UAAA,EAAE,mBAAmB,EAAA,CAAE;AAAA,EAAA,GAC5G;AAER;"}

package/dist/account/ForgotPasswordScreen.js

@@ -0,0 +1,26 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { useAccount } from "./AccountProvider.js";
+import { AuthLayout } from "../appShell/AuthLayout.js";
+import ForgotPasswordForm from "../forms/auth/ForgotPasswordForm.js";
+import { useToolkitTranslation } from "../toolkit/useToolkitTranslation.js";
+function ForgotPasswordScreen({ signInPath, logo, brandName, showLanguageToggle = true, showColorSchemeToggle = true }) {
+  const { t } = useToolkitTranslation("auth");
+  const { connector } = useAccount();
+  return /* @__PURE__ */ jsx(
+    AuthLayout,
+    {
+      logo,
+      brandName,
+      title: t("forgotPassword.title"),
+      description: t("forgotPassword.subtitle"),
+      showLanguageToggle,
+      showColorSchemeToggle,
+      children: /* @__PURE__ */ jsx(ForgotPasswordForm, { onSubmit: connector.requestPasswordReset, signInPath })
+    }
+  );
+}
+export {
+  ForgotPasswordScreen as default
+};
+//# sourceMappingURL=ForgotPasswordScreen.js.map

package/dist/account/ForgotPasswordScreen.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ForgotPasswordScreen.js","sources":["../../src/account/ForgotPasswordScreen.jsx"],"sourcesContent":["// «¿Olvidó su contraseña?», completa: pide el correo y avisa que revise su bandeja (ForgotPasswordForm). Lo del servidor\n// sale del conector de la cuenta (requestPasswordReset).\n//\n//   <ForgotPasswordScreen signInPath=\"/sign-in\" logo={<AppLogo />} />\n//\n// Genérico del paquete: function (regla de la casa).\nimport {useAccount} from '@/account/AccountProvider.jsx';\nimport {AuthLayout} from '@/appShell/AuthLayout.jsx';\nimport ForgotPasswordForm from '@/forms/auth/ForgotPasswordForm.jsx';\nimport {useToolkitTranslation} from '@/toolkit/useToolkitTranslation.js';\n\n/**\n * @param {object} props\n * @param {string} [props.signInPath] la liga para regresar a entrar\n * @param {import('react').ReactNode} [props.logo]\n * @param {string} [props.brandName]\n * @param {boolean} [props.showLanguageToggle]\n * @param {boolean} [props.showColorSchemeToggle]\n */\nexport default function ForgotPasswordScreen({signInPath, logo, brandName, showLanguageToggle = true, showColorSchemeToggle = true}) {\n    const {t} = useToolkitTranslation('auth');\n    const {connector} = useAccount();\n\n    return (\n        <AuthLayout logo={logo} brandName={brandName} title={t('forgotPassword.title')} description={t('forgotPassword.subtitle')}\n                    showLanguageToggle={showLanguageToggle} showColorSchemeToggle={showColorSchemeToggle}>\n            <ForgotPasswordForm onSubmit={connector.requestPasswordReset} signInPath={signInPath} />\n        </AuthLayout>\n    );\n}\n"],"names":[],"mappings":";;;;;;AAmBA,SAAwB,qBAAqB,EAAC,YAAY,MAAM,WAAW,qBAAqB,MAAM,wBAAwB,QAAO;AACjI,QAAM,EAAC,EAAA,IAAK,sBAAsB,MAAM;AACxC,QAAM,EAAC,UAAA,IAAa,WAAA;AAEpB,SACI;AAAA,IAAC;AAAA,IAAA;AAAA,MAAW;AAAA,MAAY;AAAA,MAAsB,OAAO,EAAE,sBAAsB;AAAA,MAAG,aAAa,EAAE,yBAAyB;AAAA,MAC5G;AAAA,MAAwC;AAAA,MAChD,UAAA,oBAAC,oBAAA,EAAmB,UAAU,UAAU,sBAAsB,WAAA,CAAwB;AAAA,IAAA;AAAA,EAAA;AAGlG;"}

package/dist/account/ProfileScreen.js

@@ -0,0 +1,108 @@
+"use client";
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { Formik, Form } from "formik";
+import Stack from "@mui/material/Stack";
+import Tab from "@mui/material/Tab";
+import Tabs from "@mui/material/Tabs";
+import Typography from "@mui/material/Typography";
+import AccountSecuritySection from "./AccountSecuritySection.js";
+import { useAccount } from "./AccountProvider.js";
+import AppearanceSettings from "../appShell/AppearanceSettings.js";
+import { toastSuccess } from "../feedback/toast.js";
+import FormProblemAlert from "../forms/FormProblemAlert.js";
+import FormTextField from "../forms/FormTextField.js";
+import SubmitButton from "../forms/SubmitButton.js";
+import { applyServerProblem } from "../forms/applyServerProblem.js";
+import * as Yup from "yup";
+import TextInput from "../inputs/TextInput.js";
+import { useToolkitNavigation } from "../toolkit/toolkitContext.js";
+import { useToolkitTranslation } from "../toolkit/useToolkitTranslation.js";
+import ProfileHeader from "../ui/layout/ProfileHeader.js";
+import SectionCard from "../ui/layout/SectionCard.js";
+const PROFILE_TAB = Object.freeze({ data: "data", security: "security", preferences: "preferences" });
+const TAB_PARAM = "tab";
+const PHONE_PATTERN = /^\+?\d{7,15}$/;
+const FORM_MAX_WIDTH = 520;
+function ProfileDataSection() {
+  const { t } = useToolkitTranslation("account");
+  const { connector, session, refreshSession } = useAccount();
+  const schema = useMemo(() => Yup.object({
+    name: Yup.string().trim().required(),
+    phone: Yup.string().trim().matches(PHONE_PATTERN, { message: { key: "account:profile.data.phoneInvalid" }, excludeEmptyString: true })
+  }), []);
+  const save = async (values, formikHelpers) => {
+    try {
+      const response = await connector.updateProfile({ name: values.name.trim(), phone: values.phone.trim() });
+      await refreshSession();
+      toastSuccess(response?.message ?? t("profile.data.saved"));
+    } catch (error) {
+      applyServerProblem(error, { ...formikHelpers, values });
+    }
+  };
+  return /* @__PURE__ */ jsxs(SectionCard, { title: t("profile.data.title"), children: [
+    /* @__PURE__ */ jsx(Typography, { variant: "body2", color: "text.secondary", sx: { mb: 2 }, children: t("profile.data.text") }),
+    /* @__PURE__ */ jsx(Formik, { initialValues: { name: session.user.name ?? "", phone: session.user.phone ?? "" }, validationSchema: schema, onSubmit: save, children: /* @__PURE__ */ jsx(Form, { noValidate: true, children: /* @__PURE__ */ jsxs(Stack, { spacing: 2, sx: { maxWidth: FORM_MAX_WIDTH }, children: [
+      /* @__PURE__ */ jsx(FormProblemAlert, {}),
+      /* @__PURE__ */ jsx(FormTextField, { name: "name", label: t("profile.data.name"), autoComplete: "name" }),
+      /* @__PURE__ */ jsx(
+        TextInput,
+        {
+          name: "email",
+          label: t("profile.data.email"),
+          value: session.user.email,
+          onChange: () => {
+          },
+          helperText: t("profile.data.emailHelp"),
+          disabled: true
+        }
+      ),
+      /* @__PURE__ */ jsx(FormTextField, { name: "phone", label: t("profile.data.phone"), type: "tel", autoComplete: "tel", inputMode: "tel" }),
+      /* @__PURE__ */ jsx(SubmitButton, { sx: { alignSelf: "flex-start" }, children: t("profile.data.save") })
+    ] }) }) })
+  ] });
+}
+function ProfileScreen({ showColorScheme = true }) {
+  const { t } = useToolkitTranslation("account");
+  const { session } = useAccount();
+  const { useNavigate, useLocation } = useToolkitNavigation();
+  const navigate = useNavigate();
+  const { pathname, search } = useLocation();
+  const requestedTab = new URLSearchParams(search).get(TAB_PARAM);
+  const activeTab = Object.values(PROFILE_TAB).includes(requestedTab) ? requestedTab : PROFILE_TAB.data;
+  if (!session) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs(Stack, { spacing: 2, children: [
+    /* @__PURE__ */ jsx(
+      ProfileHeader,
+      {
+        name: session.user.name,
+        email: session.user.email,
+        subtitle: session.user.subtitle,
+        avatarUrl: session.user.avatarUrl,
+        chips: session.labels ?? []
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Tabs,
+      {
+        value: activeTab,
+        onChange: (event, tab) => navigate(`${pathname}?${TAB_PARAM}=${tab}`, { replace: true }),
+        "aria-label": t("profile.tabs.label"),
+        children: Object.values(PROFILE_TAB).map((tab) => /* @__PURE__ */ jsx(Tab, { value: tab, label: t(`profile.tabs.${tab}`) }, tab))
+      }
+    ),
+    activeTab === PROFILE_TAB.data && /* @__PURE__ */ jsx(ProfileDataSection, {}),
+    activeTab === PROFILE_TAB.security && /* @__PURE__ */ jsx(AccountSecuritySection, {}),
+    activeTab === PROFILE_TAB.preferences && /* @__PURE__ */ jsxs(SectionCard, { title: t("profile.preferences.title"), children: [
+      /* @__PURE__ */ jsx(Typography, { variant: "body2", color: "text.secondary", sx: { mb: 1 }, children: t("profile.preferences.text") }),
+      /* @__PURE__ */ jsx(Stack, { sx: { maxWidth: FORM_MAX_WIDTH, mx: -1 }, children: /* @__PURE__ */ jsx(AppearanceSettings, { showColorScheme }) })
+    ] })
+  ] });
+}
+export {
+  PROFILE_TAB,
+  ProfileScreen as default
+};
+//# sourceMappingURL=ProfileScreen.js.map

package/dist/account/ProfileScreen.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProfileScreen.js","sources":["../../src/account/ProfileScreen.jsx"],"sourcesContent":["// Mi perfil, completo: quién está dentro (ProfileHeader con sus perfiles como chips) y tres pestañas:\n//   - Sus datos: nombre y teléfono (el correo se ve pero no se cambia aquí); al guardar se vuelve a leer la sesión, así la\n//     barra y el menú de la cuenta ya dicen el nombre nuevo;\n//   - Seguridad: AccountSecuritySection (contraseña, dos pasos, sesiones y bitácora);\n//   - Preferencias: AppearanceSettings (tamaño de letra, idioma y modo de color).\n// La pestaña abierta va en la dirección (?tab=): se puede compartir o recargar sin perderla. Lo del servidor sale del\n// conector de la cuenta.\n//\n//   <ProfileScreen />\n//\n// Genérico del paquete: function (regla de la casa).\nimport {useMemo} from 'react';\nimport {Form, Formik} from 'formik';\nimport Stack from '@mui/material/Stack';\nimport Tab from '@mui/material/Tab';\nimport Tabs from '@mui/material/Tabs';\nimport Typography from '@mui/material/Typography';\n\nimport AccountSecuritySection from '@/account/AccountSecuritySection.jsx';\nimport {useAccount} from '@/account/AccountProvider.jsx';\nimport AppearanceSettings from '@/appShell/AppearanceSettings.jsx';\nimport {toastSuccess} from '@/feedback/toast.jsx';\nimport FormProblemAlert from '@/forms/FormProblemAlert.jsx';\nimport FormTextField from '@/forms/FormTextField.jsx';\nimport SubmitButton from '@/forms/SubmitButton.jsx';\nimport {applyServerProblem} from '@/forms/applyServerProblem.js';\nimport {Yup} from '@/forms/validation.js';\nimport TextInput from '@/inputs/TextInput.jsx';\nimport {useToolkitNavigation} from '@/toolkit/toolkitContext.js';\nimport {useToolkitTranslation} from '@/toolkit/useToolkitTranslation.js';\nimport ProfileHeader from '@/ui/layout/ProfileHeader.jsx';\nimport SectionCard from '@/ui/layout/SectionCard.jsx';\n\n/** Las pestañas, en el orden en que se pintan. */\nexport const PROFILE_TAB = Object.freeze({data: 'data', security: 'security', preferences: 'preferences'});\nconst TAB_PARAM = 'tab';\n// el teléfono: dígitos, con + opcional al inicio (formato internacional); lo largo que permite el plan de numeración\nconst PHONE_PATTERN = /^\\+?\\d{7,15}$/;\n// lo ancho de los formularios: un renglón cómodo, no toda la pantalla\nconst FORM_MAX_WIDTH = 520;\n\n/** Sus datos: nombre y teléfono. */\nfunction ProfileDataSection() {\n    const {t} = useToolkitTranslation('account');\n    const {connector, session, refreshSession} = useAccount();\n    // el esquema se arma al pintar: yup toma sus mensajes al armarlo\n    const schema = useMemo(() => Yup.object({\n        name: Yup.string().trim().required(),\n        phone: Yup.string().trim().matches(PHONE_PATTERN, {message: {key: 'account:profile.data.phoneInvalid'}, excludeEmptyString: true}),\n    }), []);\n\n    const save = async (values, formikHelpers) => {\n        try {\n            const response = await connector.updateProfile({name: values.name.trim(), phone: values.phone.trim()});\n            await refreshSession();\n            toastSuccess(response?.message ?? t('profile.data.saved'));\n        } catch (error) {\n            applyServerProblem(error, {...formikHelpers, values});\n        }\n    };\n\n    return (\n        <SectionCard title={t('profile.data.title')}>\n            <Typography variant=\"body2\" color=\"text.secondary\" sx={{mb: 2}}>{t('profile.data.text')}</Typography>\n            <Formik initialValues={{name: session.user.name ?? '', phone: session.user.phone ?? ''}} validationSchema={schema} onSubmit={save}>\n                <Form noValidate>\n                    <Stack spacing={2} sx={{maxWidth: FORM_MAX_WIDTH}}>\n                        <FormProblemAlert />\n                        <FormTextField name=\"name\" label={t('profile.data.name')} autoComplete=\"name\" />\n                        {/* el correo se ve con el mismo estilo de los demás campos, pero no se cambia aquí */}\n                        <TextInput name=\"email\" label={t('profile.data.email')} value={session.user.email} onChange={() => {}}\n                                   helperText={t('profile.data.emailHelp')} disabled />\n                        <FormTextField name=\"phone\" label={t('profile.data.phone')} type=\"tel\" autoComplete=\"tel\" inputMode=\"tel\" />\n                        <SubmitButton sx={{alignSelf: 'flex-start'}}>{t('profile.data.save')}</SubmitButton>\n                    </Stack>\n                </Form>\n            </Formik>\n        </SectionCard>\n    );\n}\n\n/**\n * @param {object} props\n * @param {boolean} [props.showColorScheme] el ajuste de claro u oscuro en Preferencias; sin modo oscuro, false\n */\nexport default function ProfileScreen({showColorScheme = true}) {\n    const {t} = useToolkitTranslation('account');\n    const {session} = useAccount();\n    const {useNavigate, useLocation} = useToolkitNavigation();\n    const navigate = useNavigate();\n    const {pathname, search} = useLocation();\n    const requestedTab = new URLSearchParams(search).get(TAB_PARAM);\n    const activeTab = Object.values(PROFILE_TAB).includes(requestedTab) ? requestedTab : PROFILE_TAB.data;\n\n    // guard clause: sin sesión no hay perfil que enseñar (el marco de la app ya lleva a entrar)\n    if (!session) {\n        return null;\n    }\n\n    return (\n        <Stack spacing={2}>\n            <ProfileHeader name={session.user.name} email={session.user.email} subtitle={session.user.subtitle} avatarUrl={session.user.avatarUrl}\n                           chips={session.labels ?? []} />\n            <Tabs value={activeTab} onChange={(event, tab) => navigate(`${pathname}?${TAB_PARAM}=${tab}`, {replace: true})}\n                  aria-label={t('profile.tabs.label')}>\n                {Object.values(PROFILE_TAB).map((tab) => <Tab key={tab} value={tab} label={t(`profile.tabs.${tab}`)} />)}\n            </Tabs>\n            {activeTab === PROFILE_TAB.data && <ProfileDataSection />}\n            {activeTab === PROFILE_TAB.security && <AccountSecuritySection />}\n            {activeTab === PROFILE_TAB.preferences && (\n                <SectionCard title={t('profile.preferences.title')}>\n                    <Typography variant=\"body2\" color=\"text.secondary\" sx={{mb: 1}}>{t('profile.preferences.text')}</Typography>\n                    <Stack sx={{maxWidth: FORM_MAX_WIDTH, mx: -1}}>\n                        <AppearanceSettings showColorScheme={showColorScheme} />\n                    </Stack>\n                </SectionCard>\n            )}\n        </Stack>\n    );\n}\n"],"names":[],"mappings":"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"}

package/dist/account/ResetPasswordScreen.js

@@ -0,0 +1,57 @@
+"use client";
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState } from "react";
+import Alert from "@mui/material/Alert";
+import Button from "@mui/material/Button";
+import Stack from "@mui/material/Stack";
+import { useAccount } from "./AccountProvider.js";
+import { AuthLayout } from "../appShell/AuthLayout.js";
+import ChangePasswordForm from "../forms/auth/ChangePasswordForm.js";
+import { useToolkitNavigation } from "../toolkit/toolkitContext.js";
+import { useToolkitTranslation } from "../toolkit/useToolkitTranslation.js";
+function ResetPasswordScreen({
+  signInPath,
+  forgotPasswordPath,
+  tokenParam = "token",
+  logo,
+  brandName,
+  showLanguageToggle = true,
+  showColorSchemeToggle = true
+}) {
+  const { t } = useToolkitTranslation("account");
+  const { connector } = useAccount();
+  const { useLocation, Link } = useToolkitNavigation();
+  const { search } = useLocation();
+  const [isDone, setIsDone] = useState(false);
+  const token = new URLSearchParams(search).get(tokenParam);
+  const save = async ({ newPassword }) => {
+    await connector.resetPassword({ token, newPassword });
+    setIsDone(true);
+  };
+  return /* @__PURE__ */ jsxs(
+    AuthLayout,
+    {
+      logo,
+      brandName,
+      title: t("reset.title"),
+      description: t("reset.subtitle"),
+      showLanguageToggle,
+      showColorSchemeToggle,
+      children: [
+        !token && /* @__PURE__ */ jsxs(Stack, { spacing: 2, children: [
+          /* @__PURE__ */ jsx(Alert, { severity: "error", children: t("reset.missingToken") }),
+          forgotPasswordPath && /* @__PURE__ */ jsx(Button, { component: Link, to: forgotPasswordPath, variant: "contained", children: t("reset.askAgain") })
+        ] }),
+        token && isDone && /* @__PURE__ */ jsxs(Stack, { spacing: 2, children: [
+          /* @__PURE__ */ jsx(Alert, { severity: "success", role: "status", children: t("reset.done") }),
+          /* @__PURE__ */ jsx(Button, { component: Link, to: signInPath, variant: "contained", children: t("reset.goToSignIn") })
+        ] }),
+        token && !isDone && /* @__PURE__ */ jsx(ChangePasswordForm, { requireCurrentPassword: false, onSubmit: save })
+      ]
+    }
+  );
+}
+export {
+  ResetPasswordScreen as default
+};
+//# sourceMappingURL=ResetPasswordScreen.js.map

package/dist/account/ResetPasswordScreen.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResetPasswordScreen.js","sources":["../../src/account/ResetPasswordScreen.jsx"],"sourcesContent":["// Elegir una contraseña nueva desde el enlace del correo, completa: ChangePasswordForm sin la contraseña actual (quien llega\n// aquí la olvidó). El enlace trae su clave (?token=) y el servidor la revisa al guardar (connector.resetPassword). Sin\n// clave en la dirección, se dice que el enlace no sirve y cómo pedir otro.\n//\n//   <ResetPasswordScreen signInPath=\"/sign-in\" forgotPasswordPath=\"/forgot-password\" logo={<AppLogo />} />\n//\n// Genérico del paquete: function (regla de la casa).\nimport {useState} from 'react';\nimport Alert from '@mui/material/Alert';\nimport Button from '@mui/material/Button';\nimport Stack from '@mui/material/Stack';\n\nimport {useAccount} from '@/account/AccountProvider.jsx';\nimport {AuthLayout} from '@/appShell/AuthLayout.jsx';\nimport ChangePasswordForm from '@/forms/auth/ChangePasswordForm.jsx';\nimport {useToolkitNavigation} from '@/toolkit/toolkitContext.js';\nimport {useToolkitTranslation} from '@/toolkit/useToolkitTranslation.js';\n\n/**\n * @param {object} props\n * @param {string} props.signInPath a dónde ir al terminar\n * @param {string} [props.forgotPasswordPath] para pedir otro enlace si este no sirve\n * @param {string} [props.tokenParam] cómo se llama la clave en la dirección; por omisión 'token'\n * @param {import('react').ReactNode} [props.logo]\n * @param {string} [props.brandName]\n * @param {boolean} [props.showLanguageToggle]\n * @param {boolean} [props.showColorSchemeToggle]\n */\nexport default function ResetPasswordScreen({\n    signInPath, forgotPasswordPath, tokenParam = 'token', logo, brandName, showLanguageToggle = true, showColorSchemeToggle = true,\n}) {\n    const {t} = useToolkitTranslation('account');\n    const {connector} = useAccount();\n    const {useLocation, Link} = useToolkitNavigation();\n    const {search} = useLocation();\n    const [isDone, setIsDone] = useState(false);\n    const token = new URLSearchParams(search).get(tokenParam);\n\n    const save = async ({newPassword}) => {\n        await connector.resetPassword({token, newPassword});\n        setIsDone(true);\n    };\n\n    return (\n        <AuthLayout logo={logo} brandName={brandName} title={t('reset.title')} description={t('reset.subtitle')}\n                    showLanguageToggle={showLanguageToggle} showColorSchemeToggle={showColorSchemeToggle}>\n            {!token && (\n                <Stack spacing={2}>\n                    <Alert severity=\"error\">{t('reset.missingToken')}</Alert>\n                    {forgotPasswordPath && <Button component={Link} to={forgotPasswordPath} variant=\"contained\">{t('reset.askAgain')}</Button>}\n                </Stack>\n            )}\n            {token && isDone && (\n                <Stack spacing={2}>\n                    <Alert severity=\"success\" role=\"status\">{t('reset.done')}</Alert>\n                    <Button component={Link} to={signInPath} variant=\"contained\">{t('reset.goToSignIn')}</Button>\n                </Stack>\n            )}\n            {token && !isDone && <ChangePasswordForm requireCurrentPassword={false} onSubmit={save} />}\n        </AuthLayout>\n    );\n}\n"],"names":[],"mappings":";;;;;;;;;;;AA4BA,SAAwB,oBAAoB;AAAA,EACxC;AAAA,EAAY;AAAA,EAAoB,aAAa;AAAA,EAAS;AAAA,EAAM;AAAA,EAAW,qBAAqB;AAAA,EAAM,wBAAwB;AAC9H,GAAG;AACC,QAAM,EAAC,EAAA,IAAK,sBAAsB,SAAS;AAC3C,QAAM,EAAC,UAAA,IAAa,WAAA;AACpB,QAAM,EAAC,aAAa,KAAA,IAAQ,qBAAA;AAC5B,QAAM,EAAC,OAAA,IAAU,YAAA;AACjB,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,KAAK;AAC1C,QAAM,QAAQ,IAAI,gBAAgB,MAAM,EAAE,IAAI,UAAU;AAExD,QAAM,OAAO,OAAO,EAAC,kBAAiB;AAClC,UAAM,UAAU,cAAc,EAAC,OAAO,aAAY;AAClD,cAAU,IAAI;AAAA,EAClB;AAEA,SACI;AAAA,IAAC;AAAA,IAAA;AAAA,MAAW;AAAA,MAAY;AAAA,MAAsB,OAAO,EAAE,aAAa;AAAA,MAAG,aAAa,EAAE,gBAAgB;AAAA,MAC1F;AAAA,MAAwC;AAAA,MAC/C,UAAA;AAAA,QAAA,CAAC,SACE,qBAAC,OAAA,EAAM,SAAS,GACZ,UAAA;AAAA,UAAA,oBAAC,OAAA,EAAM,UAAS,SAAS,UAAA,EAAE,oBAAoB,GAAE;AAAA,UAChD,sBAAsB,oBAAC,QAAA,EAAO,WAAW,MAAM,IAAI,oBAAoB,SAAQ,aAAa,UAAA,EAAE,gBAAgB,EAAA,CAAE;AAAA,QAAA,GACrH;AAAA,QAEH,SAAS,UACN,qBAAC,OAAA,EAAM,SAAS,GACZ,UAAA;AAAA,UAAA,oBAAC,SAAM,UAAS,WAAU,MAAK,UAAU,UAAA,EAAE,YAAY,GAAE;AAAA,UACzD,oBAAC,QAAA,EAAO,WAAW,MAAM,IAAI,YAAY,SAAQ,aAAa,UAAA,EAAE,kBAAkB,EAAA,CAAE;AAAA,QAAA,GACxF;AAAA,QAEH,SAAS,CAAC,UAAU,oBAAC,sBAAmB,wBAAwB,OAAO,UAAU,KAAA,CAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGpG;"}