@eduardoalvarez/arrecife 0.4.0 → 0.5.1

package/CHANGELOG.md

@@ -1,5 +1,32 @@
 # Changelog
 
+## [0.5.1](https://github.com/Proskynete/arrecife/compare/v0.5.0...v0.5.1) (2026-08-31)
+
+
+### 🐛 Correcciones
+
+* **components:** la firma del pie va con la primera fila, no la última ([1a854ab](https://github.com/Proskynete/arrecife/commit/1a854ab7d71e66ab4998802ae3dc498f96e47b57))
+
+## [0.5.0](https://github.com/Proskynete/arrecife/compare/v0.4.0...v0.5.0) (2026-08-31)
+
+
+### ⚠ BREAKING CHANGES
+
+* **primitives:** `Toast`, `ToastProvider`, `ToastViewport`, `ToastTitle` y `ToastDescription` dejan de exportarse; se usa `<Toaster />` una vez y `toast()` desde donde haga falta. `ToastAction` no cambia. Migración en docs/migracion-0.5.md.
+
+### 🚀 Novedades
+
+* **components:** EventCalendar, la agenda con crear, editar y borrar ([6190700](https://github.com/Proskynete/arrecife/commit/61907003eeef777ba86c594791b2e95d225eda1f))
+* **components:** la barra, el pie y las métricas como en el documento ([203b669](https://github.com/Proskynete/arrecife/commit/203b669379f63048ce4b34fce9a9411aebec3279))
+* **primitives:** AvatarUpload, el avatar que se puede cambiar ([f888b4c](https://github.com/Proskynete/arrecife/commit/f888b4c0fadeddfb885f0b4651bf56000da7d430))
+* **primitives:** el plegable anima la altura, como cuarta excepción ([b9dd44c](https://github.com/Proskynete/arrecife/commit/b9dd44ccb99ccb2c0f00ec99fefa17bc838cca52))
+* **primitives:** Toaster es la única forma de mostrar un aviso ([2ec1d23](https://github.com/Proskynete/arrecife/commit/2ec1d2383ecd87c58a88c9e32543dc2112df2321))
+
+
+### 📚 Documentación
+
+* los iconos de redes van agrupados, y por qué ([1939455](https://github.com/Proskynete/arrecife/commit/19394554185a54e4e752a86e27e60f1a60acec26))
+
 ## [0.4.0](https://github.com/Proskynete/arrecife/compare/v0.3.0...v0.4.0) (2026-08-31)
 
 

package/README.md

@@ -83,6 +83,11 @@ con la hoja en `src/styles/` sube dos niveles y no uno. Lo detectaron los tests
 E2E del blog, no el build, y hasta la 0.3.0 esto solo estaba escrito en
 `llms.txt` — el archivo que lee un agente y no una persona.
 
+> **Vienes de la 0.4.0 o anterior.** `Toast`, `ToastProvider`, `ToastViewport`,
+> `ToastTitle` y `ToastDescription` dejaron de ser API pública en la 0.5.0: se
+> usa `Toaster` y `toast()`. `ToastAction` se queda. La migración, con el porqué
+> y los ejemplos, está en [`docs/migracion-0.5.md`](docs/migracion-0.5.md).
+
 > **Vienes de la 0.2.0 o anterior.** Los cinco escalones de espaciado se
 > renombraron: `p-md` es ahora `p-step-md`, `gap-sm` es `gap-step-sm`. Es un
 > cambio incompatible, y si tu proyecto usa `max-w-sm`, `max-w-md` o `max-w-lg`,
@@ -253,6 +258,34 @@ Comprobado empaquetando la librería con `pnpm pack` e instalándola en un proye
 aparte: los tipos resuelven desde `dist/`, `./tokens` carga sin arrastrar React y
 `./tokens/theme.css` se resuelve por subruta.
 
+### Los iconos de redes van agrupados
+
+Es lo primero con lo que tropieza quien consume la librería, porque la forma
+natural no funciona:
+
+```tsx
+// ❌ no existe
+import { GitHub, LinkedIn } from '@eduardoalvarez/arrecife';
+
+// ✅
+import { social } from '@eduardoalvarez/arrecife';
+
+<social.GitHub />
+<social.LinkedIn />
+```
+
+Los ocho son `GitHub`, `LinkedIn`, `X`, `Instagram`, `Discord`, `YouTube`, `Rss`
+y `Correo`. Van bajo un namespace por un motivo concreto: **uno se llama `X`**.
+Un `export const X` en la raíz de una librería de componentes colisiona con
+cualquier cosa —una variable de un genérico, un `import { X }` de otro sitio— y
+el fallo aparece lejos de aquí.
+
+**Los glifos internos NO se exportan.** `Close`, `ChevronDown`, `Copy`, `Sol` y
+compañía son el juego mínimo que necesitan los primitivos y se quedan dentro.
+Publicarlos convertiría `lib/glyphs.tsx` en la librería de iconos que el sistema
+decidió no tener, y a partir de ahí crece sola. Un proyecto que necesite un icono
+pasa el suyo: `Stat` recibe `icon`, `Footer` recibe el `icon` de cada red.
+
 ### Las dos subrutas que piden una dependencia
 
 `./form` y `./chart` no cuelgan de la raíz, y es a propósito. Cada una pide una
@@ -286,7 +319,7 @@ grep sobre esas dos líneas no encuentra React ni aunque el chunk lo importe.
 | `pnpm typecheck` | `tsc --noEmit` |
 | `pnpm lint` | ESLint, incluido el veto a hex literales fuera de `tokens.ts` |
 | `pnpm check:tokens` | falla si `src/tokens/` importa algo de fuera |
-| `pnpm test` | compila Tailwind y corre axe sobre las 193 stories, en los dos modos |
+| `pnpm test` | compila Tailwind y corre axe sobre las 206 stories, en los dos modos |
 | `pnpm check:exports` | verifica que `dist/` tiene lo que `exports` promete |
 | `pnpm check:release` | valida `release-please-config.json` contra el esquema oficial |
 | `pnpm storybook` | genera los tokens y levanta Storybook en el 6006 |

package/dist/brand/index.cjs

@@ -116,6 +116,9 @@ var spacing = {
   stepXl: 40,
   section: 96
 };
+var tagline = {
+  /** Header, una línea. */
+  corto: "Ayudo a equipos a escalar con criterio"};
 var naming = {
   wordmark: "Eduardo \xC1lvarez"};
 
@@ -165,20 +168,36 @@ function Logo({
   sobre = "oscuro",
   basePath = RUTA_ASSETS,
   soloIsotipo = false,
+  conLema = false,
   className,
   ...props
 }) {
+  const conAleta = /* @__PURE__ */ jsxRuntime.jsx(
+    Isotipo,
+    {
+      sobre,
+      basePath,
+      alt: soloIsotipo ? naming.wordmark : "",
+      className: conLema ? "h-9 w-auto" : "h-7 w-auto"
+    }
+  );
+  const wordmark = /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-ui font-display text-text-primary font-bold tracking-[-0.02em]", children: naming.wordmark });
+  if (soloIsotipo) {
+    return /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("gap-step-xs inline-flex items-center", className), ...props, children: conAleta });
+  }
+  if (conLema) {
+    return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cn("gap-step-sm inline-flex items-center", className), ...props, children: [
+      conAleta,
+      /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: "bg-hairline h-8 w-px shrink-0" }),
+      /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex min-w-0 flex-col", children: [
+        wordmark,
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-eyebrow font-mono text-text-muted uppercase", children: tagline.corto })
+      ] })
+    ] });
+  }
   return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cn("gap-step-xs inline-flex items-center", className), ...props, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      Isotipo,
-      {
-        sobre,
-        basePath,
-        alt: soloIsotipo ? naming.wordmark : "",
-        className: "h-7 w-auto"
-      }
-    ),
-    soloIsotipo ? null : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-ui font-display text-text-primary font-bold tracking-[-0.02em]", children: naming.wordmark })
+    conAleta,
+    wordmark
   ] });
 }
 function Mascota({

package/dist/brand/index.d.cts

@@ -22,6 +22,14 @@ type LogoProps = Omit<ComponentPropsWithoutRef<'span'>, 'children'> & {
     basePath?: string | undefined;
     /** Oculta el wordmark y deja solo la aleta, para barras muy estrechas. */
     soloIsotipo?: boolean | undefined;
+    /**
+     * Añade el lema bajo el wordmark, separado de la aleta por una divisoria.
+     *
+     * Es la forma que toma la marca en la barra del sitio. El texto sale de
+     * `tagline.corto` y no se puede pasar por prop, por lo mismo que el wordmark:
+     * un lema escrito a mano en cinco proyectos son cinco lemas en seis meses.
+     */
+    conLema?: boolean | undefined;
 };
 /**
  * El wordmark sale de `naming.wordmark`, no de una cadena escrita a mano, y
@@ -31,7 +39,7 @@ type LogoProps = Omit<ComponentPropsWithoutRef<'span'>, 'children'> & {
  * Cuando se oculta el wordmark, el nombre sigue llegando al lector de pantalla
  * por el `alt` del isotipo. Un logo sin nombre accesible es un logo invisible.
  */
-declare function Logo({ sobre, basePath, soloIsotipo, className, ...props }: LogoProps): react.JSX.Element;
+declare function Logo({ sobre, basePath, soloIsotipo, conLema, className, ...props }: LogoProps): react.JSX.Element;
 
 type Base = Omit<ComponentPropsWithoutRef<'img'>, 'src' | 'alt'> & {
     basePath?: string | undefined;

package/dist/brand/index.d.ts

@@ -22,6 +22,14 @@ type LogoProps = Omit<ComponentPropsWithoutRef<'span'>, 'children'> & {
     basePath?: string | undefined;
     /** Oculta el wordmark y deja solo la aleta, para barras muy estrechas. */
     soloIsotipo?: boolean | undefined;
+    /**
+     * Añade el lema bajo el wordmark, separado de la aleta por una divisoria.
+     *
+     * Es la forma que toma la marca en la barra del sitio. El texto sale de
+     * `tagline.corto` y no se puede pasar por prop, por lo mismo que el wordmark:
+     * un lema escrito a mano en cinco proyectos son cinco lemas en seis meses.
+     */
+    conLema?: boolean | undefined;
 };
 /**
  * El wordmark sale de `naming.wordmark`, no de una cadena escrita a mano, y
@@ -31,7 +39,7 @@ type LogoProps = Omit<ComponentPropsWithoutRef<'span'>, 'children'> & {
  * Cuando se oculta el wordmark, el nombre sigue llegando al lector de pantalla
  * por el `alt` del isotipo. Un logo sin nombre accesible es un logo invisible.
  */
-declare function Logo({ sobre, basePath, soloIsotipo, className, ...props }: LogoProps): react.JSX.Element;
+declare function Logo({ sobre, basePath, soloIsotipo, conLema, className, ...props }: LogoProps): react.JSX.Element;
 
 type Base = Omit<ComponentPropsWithoutRef<'img'>, 'src' | 'alt'> & {
     basePath?: string | undefined;

package/dist/brand/index.js

@@ -1,4 +1,4 @@
-export { CaraDeMascota, Isotipo, Logo, Mascota } from '../chunk-TB3IYPOD.js';
+export { CaraDeMascota, Isotipo, Logo, Mascota } from '../chunk-YZ2SDOVZ.js';
 export { RUTA_ASSETS, aletas, caras, listaCaras, listaPoses, poses, usoDeCara } from '../chunk-E3OMP2DL.js';
 import '../chunk-NHS7ETKJ.js';
 import '../chunk-TSPJOM6K.js';

package/dist/{chunk-TB3IYPOD.js → chunk-YZ2SDOVZ.js}

@@ -1,6 +1,6 @@
 import { aletas, RUTA_ASSETS, poses, caras } from './chunk-E3OMP2DL.js';
 import { cn } from './chunk-NHS7ETKJ.js';
-import { naming } from './chunk-TSPJOM6K.js';
+import { naming, tagline } from './chunk-TSPJOM6K.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
 function Isotipo({
@@ -27,20 +27,36 @@ function Logo({
   sobre = "oscuro",
   basePath = RUTA_ASSETS,
   soloIsotipo = false,
+  conLema = false,
   className,
   ...props
 }) {
+  const conAleta = /* @__PURE__ */ jsx(
+    Isotipo,
+    {
+      sobre,
+      basePath,
+      alt: soloIsotipo ? naming.wordmark : "",
+      className: conLema ? "h-9 w-auto" : "h-7 w-auto"
+    }
+  );
+  const wordmark = /* @__PURE__ */ jsx("span", { className: "text-ui font-display text-text-primary font-bold tracking-[-0.02em]", children: naming.wordmark });
+  if (soloIsotipo) {
+    return /* @__PURE__ */ jsx("span", { className: cn("gap-step-xs inline-flex items-center", className), ...props, children: conAleta });
+  }
+  if (conLema) {
+    return /* @__PURE__ */ jsxs("span", { className: cn("gap-step-sm inline-flex items-center", className), ...props, children: [
+      conAleta,
+      /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "bg-hairline h-8 w-px shrink-0" }),
+      /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 flex-col", children: [
+        wordmark,
+        /* @__PURE__ */ jsx("span", { className: "text-eyebrow font-mono text-text-muted uppercase", children: tagline.corto })
+      ] })
+    ] });
+  }
   return /* @__PURE__ */ jsxs("span", { className: cn("gap-step-xs inline-flex items-center", className), ...props, children: [
-    /* @__PURE__ */ jsx(
-      Isotipo,
-      {
-        sobre,
-        basePath,
-        alt: soloIsotipo ? naming.wordmark : "",
-        className: "h-7 w-auto"
-      }
-    ),
-    soloIsotipo ? null : /* @__PURE__ */ jsx("span", { className: "text-ui font-display text-text-primary font-bold tracking-[-0.02em]", children: naming.wordmark })
+    conAleta,
+    wordmark
   ] });
 }
 function Mascota({