@stackcraftmx/calcita 0.25.0 → 0.27.0

package/dist/navigation/appMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"appMenu.js","sources":["../../src/navigation/appMenu.js"],"sourcesContent":["// El menú de la app: COMPUESTO, no escrito.\n//\n// Cada módulo declara su entrada en su propia carpeta (modules/<módulo>/menu.js) y aquí solo se juntan, se filtran por\n// permiso y se ordenan. Módulo nuevo con menú = cero ediciones en una lista central, y nadie pisa la entrada del vecino al\n// resolver un merge.\n//\n// Forma de un menu.js:\n//   export const order = 10;                           // posición en el menú (los que no dicen, al final)\n//   export const access = {ability: 'orders.view'};    // la regla de quién lo ve (accessRules.js); sin ella, todos\n//   export function buildMenuItem(context) {           // o buildMenuItems (en plural) para dos o más entradas\n//       return {\n//           to: '/orders', label: 'Pedidos',           // o labelKey: 'orders:menu.label' (se traduce al pintarse)\n//           description: 'Todos los pedidos…',         // o descriptionKey: para las tarjetas de un inicio\n//           section: 'Operación',                      // o sectionKey: el título de la sección del menú lateral\n//           Icon: ReceiptLongOutlinedIcon,\n//           badge: 3,                                  // opcional: el numerito o la palabra a la derecha («Nuevo»)\n//           mobileTab: true,                           // opcional: va en la barra de pestañas del teléfono (mobileTabsOf)\n//           badgeKey: 'pendingPayment',                 // opcional: su conteo llega del servidor (AppLayout menuBadges)\n//           matchPrefix: '/orders',                    // opcional: desde dónde se marca activo (por omisión, to)\n//           access: {...},                             // opcional: una entrada con otra regla que su módulo\n//           children: [{to: '/orders/returns', label: 'Devoluciones', access: {...}}],   // opcional: un submenú\n//       };\n//   }\n// buildMenuItem puede regresar null (una pantalla apagada por configuración): no sale. Un submenú se filtra igual que las\n// entradas, y si se queda sin hijas (y no lleva a ninguna pantalla propia) no sale.\n//\n// El proyecto le pasa los módulos con el glob de Vite (o una lista, en otro empaquetador):\n//   const menuModules = import.meta.glob('@/modules/*/menu.js', {eager: true});\n//   const menuItems = composeMenu(menuModules, {canAccess, context: {session}});\n//\n// Funciones puras, sin React: function (regla de la casa). Se prueban con node --test (appMenu.test.js).\n\n// la posición de un módulo que no dice su order: al final\nconst LAST_ORDER = 1000;\n\n// la dirección del inicio: la primera miga\nconst HOME_PATH = '/';\n\n/**\n * Las entradas del menú que le tocan a esta sesión, ordenadas.\n *\n * @param {Record<string, any>|any[]} menuModules lo que regresa import.meta.glob(..., {eager: true}) o una lista\n * @param {object} [options]\n * @param {(access: object|undefined) => boolean} [options.canAccess] la regla de permisos del proyecto; sin ella, todos\n * @param {object} [options.context] lo que reciben buildMenuItem(s): la sesión, la configuración…\n * @returns {object[]} las entradas, cada una con to y su texto\n */\nexport function composeMenu(menuModules, {canAccess = () => true, context = {}} = {}) {\n    const modules = Array.isArray(menuModules) ? menuModules : Object.values(menuModules);\n    return modules\n        .filter((menuModule) => canAccess(menuModule.access))\n        .sort((first, second) => (first.order ?? LAST_ORDER) - (second.order ?? LAST_ORDER))\n        .flatMap((menuModule) => menuModule.buildMenuItems?.(context) ?? [menuModule.buildMenuItem?.(context)])\n        .filter((menuItem) => Boolean(menuItem) && canAccess(menuItem.access))\n        .map((menuItem) => withAllowedChildren(menuItem, canAccess))\n        .filter((menuItem) => Boolean(menuItem.to) || menuItem.children?.length > 0);\n}\n\n/**\n * La entrada con solo las hijas que la sesión puede ver (una entrada sin submenú se queda igual).\n *\n * @param {object} menuItem\n * @param {(access: object|undefined) => boolean} canAccess\n * @returns {object}\n */\nfunction withAllowedChildren(menuItem, canAccess) {\n    if (!Array.isArray(menuItem.children)) {\n        return menuItem;\n    }\n    return {...menuItem, children: menuItem.children.filter((child) => Boolean(child) && canAccess(child.access))};\n}\n\n/**\n * Las entradas que llevan a una pantalla, con las de los submenús (las de arriba primero).\n *\n * @param {object[]} menuItems lo que regresa composeMenu\n * @returns {object[]}\n */\nexport function screenMenuItemsOf(menuItems) {\n    return menuItems.flatMap((menuItem) => [menuItem, ...(menuItem.children ?? [])]).filter((menuItem) => Boolean(menuItem.to));\n}\n\n/**\n * ¿Está la entrada dentro de un submenú?\n *\n * @param {object[]} menuItems\n * @param {object} menuItem\n * @returns {boolean}\n */\nfunction isChildMenuItem(menuItems, menuItem) {\n    return menuItems.some((candidate) => candidate.children?.includes(menuItem));\n}\n\n/**\n * La entrada del menú de la pantalla abierta: la más específica gana (/orders/15 marca «Pedidos», no «Inicio»).\n *\n * @param {Array<{to: string, matchPrefix?: string}>} menuItems lo que regresa composeMenu\n * @param {string} pathname location.pathname\n * @returns {object|null}\n */\nexport function activeMenuItemOf(menuItems, pathname) {\n    const matchingItems = screenMenuItemsOf(menuItems).filter((menuItem) => {\n        const prefix = menuItem.matchPrefix ?? menuItem.to;\n        // el inicio solo se marca en el inicio: todas las direcciones empiezan con '/'\n        const isHome = prefix === HOME_PATH;\n        return pathname === prefix || (!isHome && pathname.startsWith(`${prefix}/`));\n    });\n    matchingItems.sort((first, second) => {\n        const lengthDifference = (second.matchPrefix ?? second.to).length - (first.matchPrefix ?? first.to).length;\n        if (lengthDifference !== 0) {\n            return lengthDifference;\n        }\n        // con el mismo camino (un submenú cuya primera hija lleva a donde mismo que él), gana la hija: es la pantalla\n        return Number(isChildMenuItem(menuItems, second)) - Number(isChildMenuItem(menuItems, first));\n    });\n    return matchingItems[0] ?? null;\n}\n\n/**\n * El submenú que contiene a una entrada (para abrirlo y para las migas); null si la entrada está arriba.\n *\n * @param {object[]} menuItems lo que regresa composeMenu\n * @param {object|null} menuItem\n * @returns {object|null}\n */\nexport function parentMenuItemOf(menuItems, menuItem) {\n    return menuItems.find((candidate) => candidate.children?.includes(menuItem)) ?? null;\n}\n\n/**\n * Las migas de la pantalla abierta, sacadas del menú: el inicio, el submenú (si lo hay) y la entrada activa.\n * En el inicio, o en una pantalla que no está en el menú, regresa solo lo que encuentra (una o ninguna).\n *\n * @param {object[]} menuItems lo que regresa composeMenu\n * @param {string} pathname location.pathname\n * @returns {object[]} entradas del menú, en orden\n */\nexport function menuBreadcrumbsOf(menuItems, pathname) {\n    const activeItem = activeMenuItemOf(menuItems, pathname);\n    if (!activeItem) {\n        return [];\n    }\n    const homeItem = menuItems.find((menuItem) => menuItem.to === HOME_PATH) ?? null;\n    const parentItem = parentMenuItemOf(menuItems, activeItem);\n    return [homeItem, parentItem, activeItem].filter((menuItem, index, crumbs) => Boolean(menuItem) && crumbs.indexOf(menuItem) === index);\n}\n\n/**\n * El badge de una entrada del menú: el conteo que llegó del servidor por su badgeKey (lo pendiente de esa pantalla), la\n * suma de sus hijas si es un submenú (como las carpetas del iPhone), o el badge fijo de su menu.js («Nuevo»). Un conteo\n * en cero no se enseña: no hay nada pendiente.\n *\n *   menuBadgeOf({badgeKey: 'pendingPayment'}, {pendingPayment: 13})   // {content: 13, isCount: true}\n *\n * @param {object} menuItem una entrada de composeMenu\n * @param {Record<string, number>} [menuBadges] los conteos por badgeKey (el proyecto los pide a su servidor)\n * @returns {{content: number|string, isCount: boolean}|null}\n */\nexport function menuBadgeOf(menuItem, menuBadges = {}) {\n    const countOf = (item) => {\n        const count = item.badgeKey ? Number(menuBadges[item.badgeKey] ?? 0) : 0;\n        return Number.isFinite(count) && count > 0 ? count : 0;\n    };\n    const ownCount = countOf(menuItem);\n    const childrenCount = Array.isArray(menuItem.children) ? menuItem.children.reduce((total, child) => total + countOf(child), 0) : 0;\n    const total = ownCount + childrenCount;\n    if (total > 0) {\n        return {content: total, isCount: true};\n    }\n    if (menuItem.badge !== undefined && menuItem.badge !== null && menuItem.badge !== '') {\n        return {content: menuItem.badge, isCount: typeof menuItem.badge === 'number'};\n    }\n    return null;\n}\n\n// cuántas pestañas van en la barra del teléfono si no se dice otra cosa, como las de Apple: hasta 5; si hay más entradas,\n// 4 y «Más» con el resto. La barra (MobileTabBar) pasa las que de verdad caben a lo ancho\nconst MOBILE_TAB_LIMIT = 5;\n/** Cuántas puede fijar la persona en la barra: las que caben junto a «Más». */\nexport const PINNABLE_TAB_LIMIT = MOBILE_TAB_LIMIT - 1;\n\n/**\n * Con qué se reconoce una entrada del menú para recordarla (las pestañas que fijó la persona): su ruta, o su llave de\n * texto si no navega. No el texto traducido: cambia con el idioma.\n *\n * @param {{to?: string, labelKey?: string, label?: string}} menuItem\n * @returns {string}\n */\nexport function menuItemKeyOf(menuItem) {\n    return menuItem.to ?? menuItem.labelKey ?? menuItem.label;\n}\n\n/**\n * Las pestañas de la barra del teléfono y lo que va en «Más». Van las que fijó la persona (pinnedKeys, en el orden del\n * menú); si no fijó ninguna, las que el menu.js marca con mobileTab: true; si ninguna lo dice, las primeras. Si todas\n * las entradas caben (tabLimit), van todas y no hay «Más»; si no, tabLimit - 1 y «Más» con el resto.\n *\n * @param {object[]} menuItems lo que regresa composeMenu\n * @param {string[]|null} [pinnedKeys] las que eligió la persona (menuItemKeyOf); las que ya no existen o ya no puede ver\n *     no cuentan\n * @param {number} [tabLimit] cuántas caben en la barra contando «Más» (por omisión 5; la barra mide su ancho)\n * @returns {{tabs: object[], more: object[]}}\n */\nexport function mobileTabsOf(menuItems, pinnedKeys = null, tabLimit = MOBILE_TAB_LIMIT) {\n    if (menuItems.length <= tabLimit) {\n        return {tabs: menuItems, more: []};\n    }\n    const pinned = menuItems.filter((menuItem) => (pinnedKeys ?? []).includes(menuItemKeyOf(menuItem)));\n    const marked = menuItems.filter((menuItem) => menuItem.mobileTab);\n    let candidates = menuItems;\n    if (pinned.length > 0) {\n        candidates = pinned;\n    } else if (marked.length > 0) {\n        candidates = marked;\n    }\n    // una de las que caben es para «Más»\n    const tabs = candidates.slice(0, Math.max(tabLimit - 1, 1));\n    return {tabs, more: menuItems.filter((menuItem) => !tabs.includes(menuItem))};\n}\n"],"names":["total"],"mappings":"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"}
+{"version":3,"file":"appMenu.js","sources":["../../src/navigation/appMenu.js"],"sourcesContent":["// El menú de la app: COMPUESTO, no escrito.\n//\n// Cada módulo declara su entrada en su propia carpeta (modules/<módulo>/menu.js) y aquí solo se juntan, se filtran por\n// permiso y se ordenan. Módulo nuevo con menú = cero ediciones en una lista central, y nadie pisa la entrada del vecino al\n// resolver un merge.\n//\n// Forma de un menu.js:\n//   export const order = 10;                           // posición en el menú (los que no dicen, al final)\n//   export const access = {ability: 'orders.view'};    // la regla de quién lo ve (accessRules.js); sin ella, todos\n//   export function buildMenuItem(context) {           // o buildMenuItems (en plural) para dos o más entradas\n//       return {\n//           to: '/orders', label: 'Pedidos',           // o labelKey: 'orders:menu.label' (se traduce al pintarse)\n//           description: 'Todos los pedidos…',         // o descriptionKey: para las tarjetas de un inicio\n//           section: 'Operación',                      // o sectionKey: el título de la sección del menú lateral\n//           Icon: ReceiptLongOutlinedIcon,             // o icon: <Iconify icon=\"mdi:receipt\" /> (un ícono ya pintado)\n//           href: 'https://sistema-anterior/inicio',   // en lugar de to: una liga a otro sistema (carga la página completa)\n//           badge: 3,                                  // opcional: el numerito o la palabra a la derecha («Nuevo»)\n//           mobileTab: true,                           // opcional: va en la barra de pestañas del teléfono (mobileTabsOf)\n//           badgeKey: 'pendingPayment',                 // opcional: su conteo llega del servidor (AppLayout menuBadges)\n//           matchPrefix: '/orders',                    // opcional: desde dónde se marca activo (por omisión, to)\n//           access: {...},                             // opcional: una entrada con otra regla que su módulo\n//           children: [{to: '/orders/returns', label: 'Devoluciones', access: {...}}],   // opcional: un submenú\n//       };\n//   }\n// buildMenuItem puede regresar null (una pantalla apagada por configuración): no sale. Un submenú se filtra igual que las\n// entradas, y si se queda sin hijas (y no lleva a ninguna pantalla propia) no sale.\n//\n// El proyecto le pasa los módulos con el glob de Vite (o una lista, en otro empaquetador):\n//   const menuModules = import.meta.glob('@/modules/*/menu.js', {eager: true});\n//   const menuItems = composeMenu(menuModules, {canAccess, context: {session}});\n//\n// Funciones puras, sin React: function (regla de la casa). Se prueban con node --test (appMenu.test.js).\n\n// la posición de un módulo que no dice su order: al final\nconst LAST_ORDER = 1000;\n\n// la dirección del inicio: la primera miga\nconst HOME_PATH = '/';\n\n/**\n * Las entradas del menú que le tocan a esta sesión, ordenadas.\n *\n * @param {Record<string, any>|any[]} menuModules lo que regresa import.meta.glob(..., {eager: true}) o una lista\n * @param {object} [options]\n * @param {(access: object|undefined) => boolean} [options.canAccess] la regla de permisos del proyecto; sin ella, todos\n * @param {object} [options.context] lo que reciben buildMenuItem(s): la sesión, la configuración…\n * @returns {object[]} las entradas, cada una con to y su texto\n */\nexport function composeMenu(menuModules, {canAccess = () => true, context = {}} = {}) {\n    const modules = Array.isArray(menuModules) ? menuModules : Object.values(menuModules);\n    return modules\n        .filter((menuModule) => canAccess(menuModule.access))\n        .sort((first, second) => (first.order ?? LAST_ORDER) - (second.order ?? LAST_ORDER))\n        .flatMap((menuModule) => menuModule.buildMenuItems?.(context) ?? [menuModule.buildMenuItem?.(context)])\n        .filter((menuItem) => Boolean(menuItem) && canAccess(menuItem.access))\n        .map((menuItem) => withAllowedChildren(menuItem, canAccess))\n        .filter((menuItem) => Boolean(menuItem.to) || Boolean(menuItem.href) || menuItem.children?.length > 0);\n}\n\n/**\n * Las entradas con su ícono como componente (Icon), que es lo que pintan las piezas del menú: el proyecto puede dar el\n * componente o un ícono ya pintado (icon, por ejemplo <Iconify icon=\"mdi:bank\" /> de un sistema que ya usaba iconify).\n *\n * @param {object[]} menuItems\n * @returns {object[]}\n */\nexport function menuItemsWithIconsOf(menuItems) {\n    return menuItems.map((menuItem) => {\n        const Icon = menuItem.Icon ?? (menuItem.icon ? iconComponentOf(menuItem.icon) : undefined);\n        const children = Array.isArray(menuItem.children) ? menuItemsWithIconsOf(menuItem.children) : menuItem.children;\n        return {...menuItem, Icon, children};\n    });\n}\n\n/** Un componente que pinta el ícono ya hecho (no recibe el tamaño: el proyecto lo pinta a su gusto). */\nfunction iconComponentOf(icon) {\n    const MenuIcon = () => icon;\n    return MenuIcon;\n}\n\n/**\n * La entrada con solo las hijas que la sesión puede ver (una entrada sin submenú se queda igual).\n *\n * @param {object} menuItem\n * @param {(access: object|undefined) => boolean} canAccess\n * @returns {object}\n */\nfunction withAllowedChildren(menuItem, canAccess) {\n    if (!Array.isArray(menuItem.children)) {\n        return menuItem;\n    }\n    return {...menuItem, children: menuItem.children.filter((child) => Boolean(child) && canAccess(child.access))};\n}\n\n/**\n * Las entradas que llevan a una pantalla, con las de los submenús (las de arriba primero).\n *\n * @param {object[]} menuItems lo que regresa composeMenu\n * @returns {object[]}\n */\nexport function screenMenuItemsOf(menuItems) {\n    return menuItems.flatMap((menuItem) => [menuItem, ...(menuItem.children ?? [])]).filter((menuItem) => Boolean(menuItem.to));\n}\n\n/**\n * ¿Está la entrada dentro de un submenú?\n *\n * @param {object[]} menuItems\n * @param {object} menuItem\n * @returns {boolean}\n */\nfunction isChildMenuItem(menuItems, menuItem) {\n    return menuItems.some((candidate) => candidate.children?.includes(menuItem));\n}\n\n/**\n * La entrada del menú de la pantalla abierta: la más específica gana (/orders/15 marca «Pedidos», no «Inicio»).\n *\n * @param {Array<{to: string, matchPrefix?: string}>} menuItems lo que regresa composeMenu\n * @param {string} pathname location.pathname\n * @returns {object|null}\n */\nexport function activeMenuItemOf(menuItems, pathname) {\n    const matchingItems = screenMenuItemsOf(menuItems).filter((menuItem) => {\n        const prefix = menuItem.matchPrefix ?? menuItem.to;\n        // el inicio solo se marca en el inicio: todas las direcciones empiezan con '/'\n        const isHome = prefix === HOME_PATH;\n        return pathname === prefix || (!isHome && pathname.startsWith(`${prefix}/`));\n    });\n    matchingItems.sort((first, second) => {\n        const lengthDifference = (second.matchPrefix ?? second.to).length - (first.matchPrefix ?? first.to).length;\n        if (lengthDifference !== 0) {\n            return lengthDifference;\n        }\n        // con el mismo camino (un submenú cuya primera hija lleva a donde mismo que él), gana la hija: es la pantalla\n        return Number(isChildMenuItem(menuItems, second)) - Number(isChildMenuItem(menuItems, first));\n    });\n    return matchingItems[0] ?? null;\n}\n\n/**\n * El submenú que contiene a una entrada (para abrirlo y para las migas); null si la entrada está arriba.\n *\n * @param {object[]} menuItems lo que regresa composeMenu\n * @param {object|null} menuItem\n * @returns {object|null}\n */\nexport function parentMenuItemOf(menuItems, menuItem) {\n    return menuItems.find((candidate) => candidate.children?.includes(menuItem)) ?? null;\n}\n\n/**\n * Las migas de la pantalla abierta, sacadas del menú: el inicio, el submenú (si lo hay) y la entrada activa.\n * En el inicio, o en una pantalla que no está en el menú, regresa solo lo que encuentra (una o ninguna).\n *\n * @param {object[]} menuItems lo que regresa composeMenu\n * @param {string} pathname location.pathname\n * @returns {object[]} entradas del menú, en orden\n */\nexport function menuBreadcrumbsOf(menuItems, pathname) {\n    const activeItem = activeMenuItemOf(menuItems, pathname);\n    if (!activeItem) {\n        return [];\n    }\n    const homeItem = menuItems.find((menuItem) => menuItem.to === HOME_PATH) ?? null;\n    const parentItem = parentMenuItemOf(menuItems, activeItem);\n    return [homeItem, parentItem, activeItem].filter((menuItem, index, crumbs) => Boolean(menuItem) && crumbs.indexOf(menuItem) === index);\n}\n\n/**\n * El badge de una entrada del menú: el conteo que llegó del servidor por su badgeKey (lo pendiente de esa pantalla), la\n * suma de sus hijas si es un submenú (como las carpetas del iPhone), o el badge fijo de su menu.js («Nuevo»). Un conteo\n * en cero no se enseña: no hay nada pendiente.\n *\n *   menuBadgeOf({badgeKey: 'pendingPayment'}, {pendingPayment: 13})   // {content: 13, isCount: true}\n *\n * @param {object} menuItem una entrada de composeMenu\n * @param {Record<string, number>} [menuBadges] los conteos por badgeKey (el proyecto los pide a su servidor)\n * @returns {{content: number|string, isCount: boolean}|null}\n */\nexport function menuBadgeOf(menuItem, menuBadges = {}) {\n    const countOf = (item) => {\n        const count = item.badgeKey ? Number(menuBadges[item.badgeKey] ?? 0) : 0;\n        return Number.isFinite(count) && count > 0 ? count : 0;\n    };\n    const ownCount = countOf(menuItem);\n    const childrenCount = Array.isArray(menuItem.children) ? menuItem.children.reduce((total, child) => total + countOf(child), 0) : 0;\n    const total = ownCount + childrenCount;\n    if (total > 0) {\n        return {content: total, isCount: true};\n    }\n    if (menuItem.badge !== undefined && menuItem.badge !== null && menuItem.badge !== '') {\n        return {content: menuItem.badge, isCount: typeof menuItem.badge === 'number'};\n    }\n    return null;\n}\n\n// cuántas pestañas van en la barra del teléfono si no se dice otra cosa, como las de Apple: hasta 5; si hay más entradas,\n// 4 y «Más» con el resto. La barra (MobileTabBar) pasa las que de verdad caben a lo ancho\nconst MOBILE_TAB_LIMIT = 5;\n/** Cuántas puede fijar la persona en la barra: las que caben junto a «Más». */\nexport const PINNABLE_TAB_LIMIT = MOBILE_TAB_LIMIT - 1;\n\n/**\n * Con qué se reconoce una entrada del menú para recordarla (las pestañas que fijó la persona): su ruta, o su llave de\n * texto si no navega. No el texto traducido: cambia con el idioma.\n *\n * @param {{to?: string, labelKey?: string, label?: string}} menuItem\n * @returns {string}\n */\nexport function menuItemKeyOf(menuItem) {\n    return menuItem.to ?? menuItem.labelKey ?? menuItem.label;\n}\n\n/**\n * Las pestañas de la barra del teléfono y lo que va en «Más». Van las que fijó la persona (pinnedKeys, en el orden del\n * menú); si no fijó ninguna, las que el menu.js marca con mobileTab: true; si ninguna lo dice, las primeras. Si todas\n * las entradas caben (tabLimit), van todas y no hay «Más»; si no, tabLimit - 1 y «Más» con el resto.\n *\n * @param {object[]} menuItems lo que regresa composeMenu\n * @param {string[]|null} [pinnedKeys] las que eligió la persona (menuItemKeyOf); las que ya no existen o ya no puede ver\n *     no cuentan\n * @param {number} [tabLimit] cuántas caben en la barra contando «Más» (por omisión 5; la barra mide su ancho)\n * @returns {{tabs: object[], more: object[]}}\n */\nexport function mobileTabsOf(menuItems, pinnedKeys = null, tabLimit = MOBILE_TAB_LIMIT) {\n    if (menuItems.length <= tabLimit) {\n        return {tabs: menuItems, more: []};\n    }\n    const pinned = menuItems.filter((menuItem) => (pinnedKeys ?? []).includes(menuItemKeyOf(menuItem)));\n    const marked = menuItems.filter((menuItem) => menuItem.mobileTab);\n    let candidates = menuItems;\n    if (pinned.length > 0) {\n        candidates = pinned;\n    } else if (marked.length > 0) {\n        candidates = marked;\n    }\n    // una de las que caben es para «Más»\n    const tabs = candidates.slice(0, Math.max(tabLimit - 1, 1));\n    return {tabs, more: menuItems.filter((menuItem) => !tabs.includes(menuItem))};\n}\n"],"names":["total"],"mappings":"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"}

package/dist/observability/logger.js

@@ -17,10 +17,27 @@ function currentLevel() {
   }
   return defaultLevel;
 }
+const sinks = [];
+function addLogSink(sink) {
+  sinks.push(sink);
+  return () => {
+    const position = sinks.indexOf(sink);
+    if (position !== -1) {
+      sinks.splice(position, 1);
+    }
+  };
+}
 function emit(level, namespace, message, context) {
   if (LEVELS[level] > currentLevel()) {
     return;
   }
+  const entry = { level, namespace, message, ...context !== void 0 && { context }, timestamp: Date.now() };
+  for (const sink of sinks) {
+    try {
+      sink(entry);
+    } catch {
+    }
+  }
   const write = level === "debug" ? console.log : console[level] ?? console.log;
   if (context === void 0) {
     write(`[${namespace}] ${message}`);
@@ -37,6 +54,7 @@ function createLogger(namespace) {
   };
 }
 export {
+  addLogSink,
   createLogger,
   setLogLevel
 };

package/dist/observability/logger.js.map

@@ -1 +1 @@
-{"version":3,"file":"logger.js","sources":["../../src/observability/logger.js"],"sourcesContent":["// Logger con espacio de nombres sobre console.\n//\n// Por qué un envoltorio y no una librería: corre en el navegador, son pocas líneas legibles y, cuando haga falta un\n// reporte externo (Sentry o el que sea), se enchufa en emit() sin tocar cada llamada.\n//\n// Reglas:\n//   - datos estructurados: log.warn('mensaje', {status, requestId}); nunca concatenar cadenas.\n//   - IMPORTANTE: sin datos personales. Nada de correos, nombres, contraseñas ni contenido de archivos: solo ids,\n//     códigos, status y el request_id (misma regla que el backend: logs sin datos personales).\n//   - por omisión solo salen error y warn. La aplicación pide todo en desarrollo con setLogLevel('debug') (el paquete no\n//     sabe si la aplicación corre en desarrollo: import.meta.env es de quien construye). Para ver más en una instalación\n//     ya desplegada:\n//       localStorage.setItem('calcita:logLevel', 'debug')\n//\n// Funciones puras, no renderizan: function (regla de la casa).\n\nconst LEVELS = {error: 0, warn: 1, info: 2, debug: 3};\n\nconst LOG_LEVEL_STORAGE_KEY = 'calcita:logLevel';\n\n// el nivel cuando nadie lo pidió en localStorage; lo cambia la aplicación con setLogLevel\nlet defaultLevel = LEVELS.warn;\n\n/**\n * El nivel de lo que sale en consola: 'error', 'warn', 'info' o 'debug'. Lo llama la aplicación al arrancar, por ejemplo\n * setLogLevel(import.meta.env.DEV ? 'debug' : 'warn').\n *\n * @param {'error'|'warn'|'info'|'debug'} level\n * @returns {void}\n */\nexport function setLogLevel(level) {\n    if (!(level in LEVELS)) {\n        throw new Error(`setLogLevel espera error, warn, info o debug y recibió «${level}»`);\n    }\n    defaultLevel = LEVELS[level];\n}\n\nfunction currentLevel() {\n    try {\n        const override = window.localStorage?.getItem(LOG_LEVEL_STORAGE_KEY);\n        if (override && override in LEVELS) {\n            return LEVELS[override];\n        }\n    } catch {\n        // ventana privada o almacenamiento bloqueado: usamos el nivel por defecto\n    }\n    return defaultLevel;\n}\n\nfunction emit(level, namespace, message, context) {\n    if (LEVELS[level] > currentLevel()) {\n        return;\n    }\n\n    // OJO: debug sale por console.log a propósito; console.debug cae en \"Verbose\" y DevTools lo esconde\n    const write = level === 'debug' ? console.log : (console[level] ?? console.log);\n    if (context === undefined) {\n        write(`[${namespace}] ${message}`);\n    } else {\n        write(`[${namespace}] ${message}`, context);\n    }\n}\n\n/**\n * Logger que antepone [namespace] a cada mensaje.\n *\n * @param {string} namespace p. ej. 'api', 'session'\n */\nexport function createLogger(namespace) {\n    return {\n        error: (message, context) => emit('error', namespace, message, context),\n        warn: (message, context) => emit('warn', namespace, message, context),\n        info: (message, context) => emit('info', namespace, message, context),\n        debug: (message, context) => emit('debug', namespace, message, context),\n    };\n}\n"],"names":[],"mappings":"AAgBA,MAAM,SAAS,EAAC,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,EAAA;AAEnD,MAAM,wBAAwB;AAG9B,IAAI,eAAe,OAAO;AASnB,SAAS,YAAY,OAAO;AAC/B,MAAI,EAAE,SAAS,SAAS;AACpB,UAAM,IAAI,MAAM,2DAA2D,KAAK,GAAG;AAAA,EACvF;AACA,iBAAe,OAAO,KAAK;AAC/B;AAEA,SAAS,eAAe;AACpB,MAAI;AACA,UAAM,WAAW,OAAO,cAAc,QAAQ,qBAAqB;AACnE,QAAI,YAAY,YAAY,QAAQ;AAChC,aAAO,OAAO,QAAQ;AAAA,IAC1B;AAAA,EACJ,QAAQ;AAAA,EAER;AACA,SAAO;AACX;AAEA,SAAS,KAAK,OAAO,WAAW,SAAS,SAAS;AAC9C,MAAI,OAAO,KAAK,IAAI,gBAAgB;AAChC;AAAA,EACJ;AAGA,QAAM,QAAQ,UAAU,UAAU,QAAQ,MAAO,QAAQ,KAAK,KAAK,QAAQ;AAC3E,MAAI,YAAY,QAAW;AACvB,UAAM,IAAI,SAAS,KAAK,OAAO,EAAE;AAAA,EACrC,OAAO;AACH,UAAM,IAAI,SAAS,KAAK,OAAO,IAAI,OAAO;AAAA,EAC9C;AACJ;AAOO,SAAS,aAAa,WAAW;AACpC,SAAO;AAAA,IACH,OAAO,CAAC,SAAS,YAAY,KAAK,SAAS,WAAW,SAAS,OAAO;AAAA,IACtE,MAAM,CAAC,SAAS,YAAY,KAAK,QAAQ,WAAW,SAAS,OAAO;AAAA,IACpE,MAAM,CAAC,SAAS,YAAY,KAAK,QAAQ,WAAW,SAAS,OAAO;AAAA,IACpE,OAAO,CAAC,SAAS,YAAY,KAAK,SAAS,WAAW,SAAS,OAAO;AAAA,EAAA;AAE9E;"}
+{"version":3,"file":"logger.js","sources":["../../src/observability/logger.js"],"sourcesContent":["// Logger con espacio de nombres sobre console.\n//\n// Por qué un envoltorio y no una librería: corre en el navegador, son pocas líneas legibles y un reporte externo (Sentry,\n// Datadog, un endpoint propio) se enchufa con addLogSink sin tocar cada llamada:\n//   addLogSink((entry) => Sentry.logger[entry.level](`[${entry.namespace}] ${entry.message}`, entry.context));\n// Cada salida recibe lo mismo que sale en consola (respeta el nivel); una salida que truena no tumba la app.\n//\n// Reglas:\n//   - datos estructurados: log.warn('mensaje', {status, requestId}); nunca concatenar cadenas.\n//   - IMPORTANTE: sin datos personales. Nada de correos, nombres, contraseñas ni contenido de archivos: solo ids,\n//     códigos, status y el request_id (misma regla que el backend: logs sin datos personales).\n//   - por omisión solo salen error y warn. La aplicación pide todo en desarrollo con setLogLevel('debug') (el paquete no\n//     sabe si la aplicación corre en desarrollo: import.meta.env es de quien construye). Para ver más en una instalación\n//     ya desplegada:\n//       localStorage.setItem('calcita:logLevel', 'debug')\n//\n// Funciones puras, no renderizan: function (regla de la casa).\n\nconst LEVELS = {error: 0, warn: 1, info: 2, debug: 3};\n\nconst LOG_LEVEL_STORAGE_KEY = 'calcita:logLevel';\n\n// el nivel cuando nadie lo pidió en localStorage; lo cambia la aplicación con setLogLevel\nlet defaultLevel = LEVELS.warn;\n\n/**\n * El nivel de lo que sale en consola: 'error', 'warn', 'info' o 'debug'. Lo llama la aplicación al arrancar, por ejemplo\n * setLogLevel(import.meta.env.DEV ? 'debug' : 'warn').\n *\n * @param {'error'|'warn'|'info'|'debug'} level\n * @returns {void}\n */\nexport function setLogLevel(level) {\n    if (!(level in LEVELS)) {\n        throw new Error(`setLogLevel espera error, warn, info o debug y recibió «${level}»`);\n    }\n    defaultLevel = LEVELS[level];\n}\n\nfunction currentLevel() {\n    try {\n        const override = window.localStorage?.getItem(LOG_LEVEL_STORAGE_KEY);\n        if (override && override in LEVELS) {\n            return LEVELS[override];\n        }\n    } catch {\n        // ventana privada o almacenamiento bloqueado: usamos el nivel por defecto\n    }\n    return defaultLevel;\n}\n\n// las salidas propias del proyecto (addLogSink), además de la consola\nconst sinks = [];\n\n/**\n * Una salida propia para lo que se anota (un reporte externo): recibe cada anotación que sale en consola, con su nivel.\n *\n * @param {(entry: {level: 'error'|'warn'|'info'|'debug', namespace: string, message: string, context?: object, timestamp: number}) => void} sink\n * @returns {() => void} para quitarla\n */\nexport function addLogSink(sink) {\n    sinks.push(sink);\n    return () => {\n        const position = sinks.indexOf(sink);\n        if (position !== -1) {\n            sinks.splice(position, 1);\n        }\n    };\n}\n\nfunction emit(level, namespace, message, context) {\n    if (LEVELS[level] > currentLevel()) {\n        return;\n    }\n    const entry = {level, namespace, message, ...(context !== undefined && {context}), timestamp: Date.now()};\n    for (const sink of sinks) {\n        try {\n            sink(entry);\n        } catch {\n            // una salida con un error no debe tumbar la app ni la anotación en consola\n        }\n    }\n\n    // OJO: debug sale por console.log a propósito; console.debug cae en \"Verbose\" y DevTools lo esconde\n    const write = level === 'debug' ? console.log : (console[level] ?? console.log);\n    if (context === undefined) {\n        write(`[${namespace}] ${message}`);\n    } else {\n        write(`[${namespace}] ${message}`, context);\n    }\n}\n\n/**\n * Logger que antepone [namespace] a cada mensaje.\n *\n * @param {string} namespace p. ej. 'api', 'session'\n */\nexport function createLogger(namespace) {\n    return {\n        error: (message, context) => emit('error', namespace, message, context),\n        warn: (message, context) => emit('warn', namespace, message, context),\n        info: (message, context) => emit('info', namespace, message, context),\n        debug: (message, context) => emit('debug', namespace, message, context),\n    };\n}\n"],"names":[],"mappings":"AAkBA,MAAM,SAAS,EAAC,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,EAAA;AAEnD,MAAM,wBAAwB;AAG9B,IAAI,eAAe,OAAO;AASnB,SAAS,YAAY,OAAO;AAC/B,MAAI,EAAE,SAAS,SAAS;AACpB,UAAM,IAAI,MAAM,2DAA2D,KAAK,GAAG;AAAA,EACvF;AACA,iBAAe,OAAO,KAAK;AAC/B;AAEA,SAAS,eAAe;AACpB,MAAI;AACA,UAAM,WAAW,OAAO,cAAc,QAAQ,qBAAqB;AACnE,QAAI,YAAY,YAAY,QAAQ;AAChC,aAAO,OAAO,QAAQ;AAAA,IAC1B;AAAA,EACJ,QAAQ;AAAA,EAER;AACA,SAAO;AACX;AAGA,MAAM,QAAQ,CAAA;AAQP,SAAS,WAAW,MAAM;AAC7B,QAAM,KAAK,IAAI;AACf,SAAO,MAAM;AACT,UAAM,WAAW,MAAM,QAAQ,IAAI;AACnC,QAAI,aAAa,IAAI;AACjB,YAAM,OAAO,UAAU,CAAC;AAAA,IAC5B;AAAA,EACJ;AACJ;AAEA,SAAS,KAAK,OAAO,WAAW,SAAS,SAAS;AAC9C,MAAI,OAAO,KAAK,IAAI,gBAAgB;AAChC;AAAA,EACJ;AACA,QAAM,QAAQ,EAAC,OAAO,WAAW,SAAS,GAAI,YAAY,UAAa,EAAC,QAAA,GAAW,WAAW,KAAK,MAAI;AACvG,aAAW,QAAQ,OAAO;AACtB,QAAI;AACA,WAAK,KAAK;AAAA,IACd,QAAQ;AAAA,IAER;AAAA,EACJ;AAGA,QAAM,QAAQ,UAAU,UAAU,QAAQ,MAAO,QAAQ,KAAK,KAAK,QAAQ;AAC3E,MAAI,YAAY,QAAW;AACvB,UAAM,IAAI,SAAS,KAAK,OAAO,EAAE;AAAA,EACrC,OAAO;AACH,UAAM,IAAI,SAAS,KAAK,OAAO,IAAI,OAAO;AAAA,EAC9C;AACJ;AAOO,SAAS,aAAa,WAAW;AACpC,SAAO;AAAA,IACH,OAAO,CAAC,SAAS,YAAY,KAAK,SAAS,WAAW,SAAS,OAAO;AAAA,IACtE,MAAM,CAAC,SAAS,YAAY,KAAK,QAAQ,WAAW,SAAS,OAAO;AAAA,IACpE,MAAM,CAAC,SAAS,YAAY,KAAK,QAAQ,WAAW,SAAS,OAAO;AAAA,IACpE,OAAO,CAAC,SAAS,YAAY,KAAK,SAAS,WAAW,SAAS,OAAO;AAAA,EAAA;AAE9E;"}

package/dist/theme/components/MuiAppBar.js

@@ -1,4 +1,5 @@
 import { paletteOf } from "./paletteOf.js";
+import { lightDarkStylesOf } from "../lightDarkStyles.js";
 function MuiAppBar() {
   return {
     MuiAppBar: {
@@ -9,11 +10,11 @@ function MuiAppBar() {
           const isPinned = ownerState.position === "sticky" || ownerState.position === "fixed";
           const isPrimary = (ownerState.color ?? "primary") === "primary";
           return {
-            ...isPrimary && {
-              backgroundColor: palette.primary.main,
-              color: palette.primary.contrastText,
-              ...theme.applyStyles("dark", { backgroundColor: palette.background.paper, color: palette.text.primary })
-            },
+            ...isPrimary && lightDarkStylesOf(
+              theme,
+              { backgroundColor: palette.primary.main, color: palette.primary.contrastText },
+              { backgroundColor: palette.background.paper, color: palette.text.primary }
+            ),
             ...isPinned && { borderBottom: `1px solid ${palette.divider}` }
           };
         }

package/dist/theme/components/MuiAppBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"MuiAppBar.js","sources":["../../../src/theme/components/MuiAppBar.js"],"sourcesContent":["// La barra de arriba: plana (sin sombra), naranja en claro y del color de las tarjetas en oscuro, con una línea abajo\n// cuando se queda fija al deslizar.\n//\n// Por qué applyStyles('dark') y no theme.palette.mode: el servidor no sabe qué modo eligió la persona; con mode, la barra\n// se pintaba naranja un instante en oscuro. applyStyles lo deja en CSS y el navegador elige antes de pintar.\n// Solo cambia la barra de color principal (el de omisión): una barra con color=\"inherit\" o \"transparent\" se respeta.\n//\n// Funciones puras, sin React: function (regla de la casa).\nimport {paletteOf} from '@/theme/components/paletteOf.js';\n\nexport function MuiAppBar() {\n    return {\n        MuiAppBar: {\n            defaultProps: {elevation: 0},\n            styleOverrides: {\n                root: ({ownerState, theme}) => {\n                    const palette = paletteOf(theme);\n                    const isPinned = ownerState.position === 'sticky' || ownerState.position === 'fixed';\n                    const isPrimary = (ownerState.color ?? 'primary') === 'primary';\n                    return {\n                        ...(isPrimary && {\n                            backgroundColor: palette.primary.main,\n                            color: palette.primary.contrastText,\n                            ...theme.applyStyles('dark', {backgroundColor: palette.background.paper, color: palette.text.primary}),\n                        }),\n                        ...(isPinned && {borderBottom: `1px solid ${palette.divider}`}),\n                    };\n                },\n            },\n        },\n    };\n}\n"],"names":[],"mappings":";AAUO,SAAS,YAAY;AACxB,SAAO;AAAA,IACH,WAAW;AAAA,MACP,cAAc,EAAC,WAAW,EAAC;AAAA,MAC3B,gBAAgB;AAAA,QACZ,MAAM,CAAC,EAAC,YAAY,MAAK,MAAM;AAC3B,gBAAM,UAAU,UAAU,KAAK;AAC/B,gBAAM,WAAW,WAAW,aAAa,YAAY,WAAW,aAAa;AAC7E,gBAAM,aAAa,WAAW,SAAS,eAAe;AACtD,iBAAO;AAAA,YACH,GAAI,aAAa;AAAA,cACb,iBAAiB,QAAQ,QAAQ;AAAA,cACjC,OAAO,QAAQ,QAAQ;AAAA,cACvB,GAAG,MAAM,YAAY,QAAQ,EAAC,iBAAiB,QAAQ,WAAW,OAAO,OAAO,QAAQ,KAAK,QAAO,CAAC;AAAA,YACjI;AAAA,YACwB,GAAI,YAAY,EAAC,cAAc,aAAa,QAAQ,OAAO,GAAE;AAAA,UACrF;AAAA,QACgB;AAAA,MAChB;AAAA,IACA;AAAA,EACA;AACA;"}
+{"version":3,"file":"MuiAppBar.js","sources":["../../../src/theme/components/MuiAppBar.js"],"sourcesContent":["// La barra de arriba: plana (sin sombra), naranja en claro y del color de las tarjetas en oscuro, con una línea abajo\n// cuando se queda fija al deslizar.\n//\n// Por qué el modo va en CSS (lightDarkStylesOf) y no en theme.palette.mode: el servidor no sabe qué modo eligió la persona;\n// con mode, la barra se pintaba naranja un instante en oscuro. En CSS el navegador elige antes de pintar.\n// Solo cambia la barra de color principal (el de omisión): una barra con color=\"inherit\" o \"transparent\" se respeta.\n//\n// Funciones puras, sin React: function (regla de la casa).\nimport {paletteOf} from '@/theme/components/paletteOf.js';\nimport {lightDarkStylesOf} from '@/theme/lightDarkStyles.js';\n\nexport function MuiAppBar() {\n    return {\n        MuiAppBar: {\n            defaultProps: {elevation: 0},\n            styleOverrides: {\n                root: ({ownerState, theme}) => {\n                    const palette = paletteOf(theme);\n                    const isPinned = ownerState.position === 'sticky' || ownerState.position === 'fixed';\n                    const isPrimary = (ownerState.color ?? 'primary') === 'primary';\n                    return {\n                        ...(isPrimary && lightDarkStylesOf(theme,\n                            {backgroundColor: palette.primary.main, color: palette.primary.contrastText},\n                            {backgroundColor: palette.background.paper, color: palette.text.primary})),\n                        ...(isPinned && {borderBottom: `1px solid ${palette.divider}`}),\n                    };\n                },\n            },\n        },\n    };\n}\n"],"names":[],"mappings":";;AAWO,SAAS,YAAY;AACxB,SAAO;AAAA,IACH,WAAW;AAAA,MACP,cAAc,EAAC,WAAW,EAAC;AAAA,MAC3B,gBAAgB;AAAA,QACZ,MAAM,CAAC,EAAC,YAAY,MAAK,MAAM;AAC3B,gBAAM,UAAU,UAAU,KAAK;AAC/B,gBAAM,WAAW,WAAW,aAAa,YAAY,WAAW,aAAa;AAC7E,gBAAM,aAAa,WAAW,SAAS,eAAe;AACtD,iBAAO;AAAA,YACH,GAAI,aAAa;AAAA,cAAkB;AAAA,cAC/B,EAAC,iBAAiB,QAAQ,QAAQ,MAAM,OAAO,QAAQ,QAAQ,aAAY;AAAA,cAC3E,EAAC,iBAAiB,QAAQ,WAAW,OAAO,OAAO,QAAQ,KAAK,QAAO;AAAA,YAAC;AAAA,YAC5E,GAAI,YAAY,EAAC,cAAc,aAAa,QAAQ,OAAO,GAAE;AAAA,UACrF;AAAA,QACgB;AAAA,MAChB;AAAA,IACA;AAAA,EACA;AACA;"}

package/dist/theme/components/glassComponents.js

@@ -1,5 +1,6 @@
 import { GLASS_MENU_RADIUS_PIXELS, GLASS_PANEL_RADIUS_PIXELS, GLASS_INSET_PIXELS, solidFallbackOf, glassDropOf, accentTextStylesOf, glassStylesOf, insideContentSelectorOf, canvasFieldStylesOf, GLASS_LENS_FLAG_SELECTOR, glassSurfaceOf, materialStylesOf, whiteLabelFillOf, fieldWellStylesOf, glassOpacityOf } from "../glassSurface.js";
 import { mergeStyles } from "../mergeComponents.js";
+import { lightDarkStylesOf } from "../lightDarkStyles.js";
 import { textSizeOf } from "../appleTracking.js";
 import { paletteOf } from "./paletteOf.js";
 const MENU_ROW_INSET_PIXELS = 4;
@@ -100,14 +101,10 @@ function whiteLabelOf(theme, colorName) {
       "&:hover": { backgroundColor: `color-mix(in srgb, ${fill} ${100 - PROMINENT_HOVER_SHADE_PERCENT}%, black)` }
     };
   };
-  return { ...schemeStylesOf("light"), ...theme.applyStyles("dark", schemeStylesOf("dark")) };
+  return lightDarkStylesOf(theme, schemeStylesOf("light"), schemeStylesOf("dark"));
 }
 function monogramOf(theme) {
-  return {
-    color: WHITE_LABEL,
-    backgroundColor: MONOGRAM_GRAY.light,
-    ...theme.applyStyles("dark", { color: WHITE_LABEL, backgroundColor: MONOGRAM_GRAY.dark })
-  };
+  return lightDarkStylesOf(theme, { color: WHITE_LABEL, backgroundColor: MONOGRAM_GRAY.light }, { color: WHITE_LABEL, backgroundColor: MONOGRAM_GRAY.dark });
 }
 function tintedControlOf(theme, toneColor) {
   const fillOf = (percent) => `color-mix(in srgb, ${toneColor} ${percent}%, transparent)`;
@@ -115,12 +112,11 @@ function tintedControlOf(theme, toneColor) {
   return {
     ...plain,
     color: paletteOf(theme).text.primary,
-    backgroundColor: fillOf(TINTED_FILL_PERCENT.light.rest),
-    "&:hover": { ...plain, backgroundColor: fillOf(TINTED_FILL_PERCENT.light.hover) },
-    ...theme.applyStyles("dark", {
-      backgroundColor: fillOf(TINTED_FILL_PERCENT.dark.rest),
-      "&:hover": { backgroundColor: fillOf(TINTED_FILL_PERCENT.dark.hover) }
-    })
+    ...lightDarkStylesOf(
+      theme,
+      { backgroundColor: fillOf(TINTED_FILL_PERCENT.light.rest), "&:hover": { ...plain, backgroundColor: fillOf(TINTED_FILL_PERCENT.light.hover) } },
+      { backgroundColor: fillOf(TINTED_FILL_PERCENT.dark.rest), "&:hover": { backgroundColor: fillOf(TINTED_FILL_PERCENT.dark.hover) } }
+    )
   };
 }
 function fieldFillOf(theme) {
@@ -359,11 +355,11 @@ function glassComponents({ surfaces = false } = {}) {
           return {
             ...surface,
             // de color: su vidrio lleva el color oscurecido lo justo para la letra blanca (whiteLabelFillOf)
-            ...lightFill && { ...glassSurfaceOf(lightFill, { opacity: PROMINENT_GLASS_OPACITY }), color: WHITE_LABEL },
-            ...darkFill && theme.applyStyles("dark", {
-              ...glassSurfaceOf(darkFill, { opacity: PROMINENT_GLASS_OPACITY, isDark: true }),
-              color: WHITE_LABEL
-            }),
+            ...lightDarkStylesOf(
+              theme,
+              lightFill ? { ...glassSurfaceOf(lightFill, { opacity: PROMINENT_GLASS_OPACITY }), color: WHITE_LABEL } : {},
+              darkFill ? { ...glassSurfaceOf(darkFill, { opacity: PROMINENT_GLASS_OPACITY, isDark: true }), color: WHITE_LABEL } : {}
+            ),
             transition: theme.transitions.create(["background-color", "box-shadow", "transform"], { duration: theme.transitions.duration.short }),
             // MUI cambia el fondo y la sombra al pasar y al apretar: el vidrio se queda, y al apretar se hunde
             "&:hover": { backgroundColor: surface.backgroundColor },
@@ -463,8 +459,11 @@ function glassComponents({ surfaces = false } = {}) {
             overflow: "hidden",
             [insideContentSelectorOf()]: {
               ...plain,
-              backgroundColor: groupFillOf(TINTED_FILL_PERCENT.light.rest),
-              ...theme.applyStyles("dark", { backgroundColor: groupFillOf(TINTED_FILL_PERCENT.dark.rest) })
+              ...lightDarkStylesOf(
+                theme,
+                { backgroundColor: groupFillOf(TINTED_FILL_PERCENT.light.rest) },
+                { backgroundColor: groupFillOf(TINTED_FILL_PERCENT.dark.rest) }
+              )
             }
           };
         },
@@ -644,8 +643,11 @@ function glassComponents({ surfaces = false } = {}) {
           const whiteMark = { background: "linear-gradient(#fff, #fff) center / 58% 58% no-repeat", borderRadius: 4 };
           return {
             "&.Mui-checked .MuiSvgIcon-root, &.MuiCheckbox-indeterminate .MuiSvgIcon-root": whiteMark,
-            ...lightFill && { "&.Mui-checked, &.MuiCheckbox-indeterminate": { color: lightFill } },
-            ...darkFill && theme.applyStyles("dark", { "&.Mui-checked, &.MuiCheckbox-indeterminate": { color: darkFill } })
+            ...lightDarkStylesOf(
+              theme,
+              lightFill ? { "&.Mui-checked, &.MuiCheckbox-indeterminate": { color: lightFill } } : {},
+              darkFill ? { "&.Mui-checked, &.MuiCheckbox-indeterminate": { color: darkFill } } : {}
+            )
           };
         }
       }
@@ -671,13 +673,12 @@ function glassComponents({ surfaces = false } = {}) {
           const lightFill = fillOf("light");
           const darkFill = fillOf("dark");
           return {
-            color: STEP_PENDING_GRAY.light,
             "& .MuiStepIcon-text": { fill: WHITE_LABEL },
-            ...lightFill && { "&.Mui-active, &.Mui-completed": { color: lightFill } },
-            ...theme.applyStyles("dark", {
-              color: STEP_PENDING_GRAY.dark,
-              ...darkFill && { "&.Mui-active, &.Mui-completed": { color: darkFill } }
-            })
+            ...lightDarkStylesOf(
+              theme,
+              { color: STEP_PENDING_GRAY.light, ...lightFill && { "&.Mui-active, &.Mui-completed": { color: lightFill } } },
+              { color: STEP_PENDING_GRAY.dark, ...darkFill && { "&.Mui-active, &.Mui-completed": { color: darkFill } } }
+            )
           };
         }
       }
@@ -803,9 +804,8 @@ function glassComponents({ surfaces = false } = {}) {
         }),
         track: ({ theme }) => ({
           opacity: 1,
-          backgroundColor: SWITCH_OFF_TRACK.light,
           transition: theme.transitions.create(["background-color"], { duration: theme.transitions.duration.short }),
-          ...theme.applyStyles("dark", { backgroundColor: SWITCH_OFF_TRACK.dark })
+          ...lightDarkStylesOf(theme, { backgroundColor: SWITCH_OFF_TRACK.light }, { backgroundColor: SWITCH_OFF_TRACK.dark })
         })
       }
     },
@@ -841,8 +841,7 @@ function glassComponents({ surfaces = false } = {}) {
         },
         rail: ({ theme }) => ({
           opacity: 1,
-          backgroundColor: SLIDER_RAIL.light,
-          ...theme.applyStyles("dark", { backgroundColor: SLIDER_RAIL.dark })
+          ...lightDarkStylesOf(theme, { backgroundColor: SLIDER_RAIL.light }, { backgroundColor: SLIDER_RAIL.dark })
         }),
         root: ({ ownerState }) => ownerState.orientation === "vertical" ? { width: SLIDER_TRACK_PIXELS } : { height: SLIDER_TRACK_PIXELS }
       }
@@ -880,6 +879,8 @@ function glassComponents({ surfaces = false } = {}) {
   };
 }
 export {
+  MONOGRAM_GRAY,
+  WHITE_LABEL,
   glassComponents
 };
 //# sourceMappingURL=glassComponents.js.map