@eduardoalvarez/arrecife 0.11.0 → 0.12.0

package/dist/index.cjs

@@ -209,7 +209,7 @@ var typeScale = {
    * (plankton 5.57:1 over abyss), which is the part that is not negotiable.
    *
    * At 13 the three badge families grew past the size of a small button and
-   * outweighed the title they accompany. See `docs/decisions/`.
+   * outweighed the title they accompany. See `docs/decisions/` § 10.
    */
   chip: { family: "mono", size: 11.5, lineHeight: 1.4, weight: 400 },
   /**
@@ -263,7 +263,7 @@ var control = {
    * baseline; 28 would have been a fifth height that matches nothing.
    *
    * It does not replace `icon`. A page's primary action stays at 42; this is for
-   * a row of a table. See `docs/decisions/0.6.md` § 22.
+   * a row of a table. See `docs/decisions/` § 22.
    */
   iconSm: 32
 };
@@ -286,7 +286,7 @@ var size = {
    * together eat the top of the content area. 56 is what `cursos` had arrived at
    * on its own, and it is the same reasoning as `control.iconSm`: the one admin
    * app of the five is denser than the four reading sites. See
-   * `docs/decisions/0.7.md` § 30.
+   * `docs/decisions/` § 30.
    */
   navCompact: 56,
   /**
@@ -359,7 +359,20 @@ var naming = {
   wordmark: "Eduardo \xC1lvarez",
   mascot: "Tiburonc\xEDn",
   /** The domain, for the footer CLI signature: `$ cd ~/eduardoalvarez.dev/2026`. */
-  domain: "eduardoalvarez.dev"
+  domain: "eduardoalvarez.dev",
+  /** The library's own name, for a footer that credits it. */
+  library: "Arrecife",
+  /**
+   * Where the library is published, for `Footer builtWith`.
+   *
+   * It is here and not written into the component for the reason the domain is:
+   * one string, five projects. It is the same URL as `homepage` in
+   * `package.json` and it cannot be derived from it — this file imports nothing
+   * — so `check:exports` compares the two on every build. Without that, moving
+   * the Storybook would update what npm prints and leave five production
+   * footers linking at the old address.
+   */
+  libraryUrl: "https://arrecife.eduardoalvarez.dev"
 };
 
 // src/tokens/index.ts
@@ -484,7 +497,7 @@ var button = classVarianceAuthority.cva(
         ],
         // The one control whose focus ring is not biolume. It is the system's
         // only sand fill, and a biolume ring three pixels off a sand button puts
-        // both of the brand's accents in the same glance. See `docs/decisions/0.7.md` § 37.
+        // both of the brand's accents in the same glance. See `docs/decisions/` § 37.
         conversion: "bg-warm text-warm-on hover:bg-warm-hover focus-ring-warm",
         secondary: [
           "border-hairline-hover border bg-transparent text-text-primary",
@@ -3240,8 +3253,7 @@ function SocialRow({ social }) {
 function Signature({
   year,
   href,
-  domain: domainName = naming.domain,
-  className
+  domain: domainName = naming.domain
 }) {
   const domain = href ? /* @__PURE__ */ jsxRuntime.jsx(
     "a",
@@ -3251,7 +3263,7 @@ function Signature({
       children: domainName
     }
   ) : domainName;
-  return /* @__PURE__ */ jsxRuntime.jsxs(Text, { variant: "meta", tone: "muted", as: "p", className: cn("shrink-0", className), children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs(Text, { variant: "meta", tone: "muted", as: "p", children: [
     /* @__PURE__ */ jsxRuntime.jsxs("span", { "aria-hidden": "true", className: "text-accent", children: [
       "$",
       " "
@@ -3269,6 +3281,46 @@ function Signature({
     )
   ] });
 }
+function BuiltWith() {
+  return /* @__PURE__ */ jsxRuntime.jsxs(Text, { variant: "meta", tone: "muted", as: "p", children: [
+    "Creado con",
+    " ",
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "a",
+      {
+        href: naming.libraryUrl,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className: cn(
+          "text-accent hover:text-text-primary transition-standard cursor-pointer",
+          "underline decoration-1 underline-offset-4",
+          "rounded-chip focus-ring"
+        ),
+        children: naming.library
+      }
+    ),
+    " ",
+    /* @__PURE__ */ jsxRuntime.jsx(Icon, { as: react.Heart, tone: "current", className: "text-accent inline align-middle" })
+  ] });
+}
+function SignatureBlock({
+  year,
+  href,
+  domain,
+  builtWith,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn("gap-step-xs flex shrink-0 flex-col items-center sm:items-end", className),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Signature, { year, href, domain }),
+        builtWith ? /* @__PURE__ */ jsxRuntime.jsx(BuiltWith, {}) : null
+      ]
+    }
+  );
+}
 function Shell({
   className,
   contentClassName,
@@ -3291,6 +3343,7 @@ function Footer({
   linkAsChild,
   social,
   brand: brand2,
+  builtWith,
   year = (/* @__PURE__ */ new Date()).getFullYear(),
   signatureHref,
   domain,
@@ -3340,7 +3393,15 @@ function Footer({
           column.title
         )) })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-hairline mt-step-xl pt-step-lg border-t", children: /* @__PURE__ */ jsxRuntime.jsx(Signature, { year, href: signatureHref, domain, className: "text-center sm:text-right" }) })
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-hairline mt-step-xl pt-step-lg border-t", children: /* @__PURE__ */ jsxRuntime.jsx(
+        SignatureBlock,
+        {
+          year,
+          href: signatureHref,
+          domain,
+          builtWith
+        }
+      ) })
     ] });
   }
   const rows = [
@@ -3351,7 +3412,16 @@ function Footer({
   return /* @__PURE__ */ jsxRuntime.jsxs(Shell, { className, contentClassName: "gap-step-lg", ...rest, children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "gap-step-md flex flex-col items-center sm:flex-row sm:flex-wrap", children: [
       first ?? null,
-      /* @__PURE__ */ jsxRuntime.jsx(Signature, { year, href: signatureHref, domain, className: "sm:ml-auto" })
+      /* @__PURE__ */ jsxRuntime.jsx(
+        SignatureBlock,
+        {
+          year,
+          href: signatureHref,
+          domain,
+          builtWith,
+          className: "sm:ml-auto"
+        }
+      )
     ] }),
     others
   ] });
@@ -3502,7 +3572,7 @@ function Nav({ brand: brand2, children, actions, size: size2 = "default", classN
                           puts it in `actions`. A `Nav` that hid its own items would leave every
                           consumer without a drawer with no navigation at all, silently.
               
-                          See `docs/decisions/0.10.md` § 54.
+                          See `docs/decisions/` § 54.
                         */
               /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": "Principal", className: "ml-auto min-w-0 overflow-x-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("ul", { className: "gap-step-md flex w-max items-center", children: [
                 /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: "text-text-muted font-mono text-meta select-none", children: "~/" }),

package/dist/index.d.cts

@@ -48,7 +48,7 @@ import '@radix-ui/react-label';
  * `--ease-standard`, so it introduces neither a new timing nor a new curve.
  * Whoever asked for less motion still sees the panel appear where it will stay.
  *
- * See `docs/decisions/0.6.md` § 20.
+ * See `docs/decisions/` § 20.
  *
  * The chevron, by contrast, rotates with no transition: `transition-standard`
  * only covers color and border, so `rotate` snaps even with the class in place.
@@ -111,7 +111,7 @@ declare function Alert({ className, variant, emphasis, title, icon, children, ..
  * «Borrar el artículo», not «Aceptar».
  *
  * `destructive` is for the destructive button that has none of that around it:
- * a table row, a toolbar. See `docs/decisions/0.6.md` § 21.
+ * a table row, a toolbar. See `docs/decisions/` § 21.
  */
 declare const AlertDialog: react.FC<AlertDialogPrimitive.AlertDialogProps>;
 declare const AlertDialogTrigger: react.ForwardRefExoticComponent<AlertDialogPrimitive.AlertDialogTriggerProps & react.RefAttributes<HTMLButtonElement>>;
@@ -497,7 +497,7 @@ declare function Switch({ className, ...props }: SwitchProps): react.JSX.Element
  * `Nav`'s `size` documents: a `rounded-none` passed from the call site does
  * nothing, silently. There is one shape on purpose — fourteen call sites wanted
  * the same one — and a second gets a prop when a second consumer exists, not
- * before. See `docs/decisions/0.8.md` § 39.
+ * before. See `docs/decisions/` § 39.
  *
  * THE `tabIndex` IS NOT DECORATION and it is not new behaviour dressed up as
  * markup. A region you can pan with a mouse has to be reachable with a keyboard
@@ -771,7 +771,7 @@ declare function AuthorCard({ name, role, src, bio, action, className, ...props
  *   paths this file used to carry verbatim from the portfolio are gone with
  *   `lib/glyphs.tsx`; `Play`, `Pause`, `SpeakerHigh` and `SpeakerSlash` are the
  *   same symbols in Phosphor's hand, and the ±15s skips are `ArrowCounterClockwise`
- *   and `ArrowClockwise`. See `docs/decisions/0.10.md` § 51.
+ *   and `ArrowClockwise`. See `docs/decisions/` § 51.
  * - analytics' `trackEvent` → the `onFirstPlay` prop, which the consumer wires
  *   to whatever they use. It still fires exactly once per load.
  *
@@ -912,7 +912,7 @@ type CourseCardProps = Omit<CardShellProps, 'children' | 'title' | 'media'> & {
  * formatted in a currency the library does not know, the rating is drawn by a
  * component the project already has, and the cover is an image pipeline. What
  * IS the identity's stays here: the title's scale and its hover, the sand bar,
- * the status badge. See `docs/decisions/0.11.md` § 59.
+ * the status badge. See `docs/decisions/` § 59.
  *
  * The title does NOT go over the cover. It stays in the body at `h3`, with the
  * hover every other card has. Text on a photograph needs a scrim, and a scrim's
@@ -941,7 +941,7 @@ declare function CourseCard({ title, summary, meta, status, progress, media, foo
  * smaller one: the hole inside a table page or a dashboard widget, competing with
  * a dozen elements around it. An admin panel has twenty of those on one screen,
  * and twenty faces is not the humour contract, it is a zoo. The variant carries
- * no face, and the type does not let one through. See `docs/decisions/0.7.md` § 27.
+ * no face, and the type does not let one through. See `docs/decisions/` § 27.
  */
 type EmptyStateBase = Omit<ComponentPropsWithoutRef<'div'>, 'title'> & {
     title: ReactNode;
@@ -1030,7 +1030,7 @@ declare function EventCalendar({ events, onCreateEvent, onUpdateEvent, onDeleteE
  * The domain defaults to `naming.domain` and not to a hand-written string, for
  * the same reason as the wordmark: if it changes, it changes in all five
  * projects at once. A project that lives on its OWN domain passes `domain` —
- * see `docs/decisions/0.9.md` § 49.
+ * see `docs/decisions/` § 49.
  *
  * The social links are icons with NO visible text, so `aria-label` is not an
  * improvement: it is the only thing that makes them legible. Which is why it is
@@ -1046,7 +1046,7 @@ declare function EventCalendar({ events, onCreateEvent, onUpdateEvent, onDeleteE
  * answer has not moved: `EmptyState` is a discriminated union where `page` is
  * the default and `inline` cannot be handed a face; `Nav` takes a `size` where
  * `default` is the bar it always was. Both left what was written before exactly
- * where it was. See `docs/decisions/0.8.md` § 44.
+ * where it was. See `docs/decisions/` § 44.
  *
  * The union is what holds the rule up. `columns`, `description` and `action`
  * exist only on `full`, and the default form cannot be handed one. As loose
@@ -1094,7 +1094,7 @@ type FooterColumn = {
  * `./aviso-legal` — and that row is what `variant="full"`'s columns replace. A
  * flat row cannot say which block a link belongs to, cannot carry a heading a
  * screen reader can jump to, and made whoever wrote the label type the `./`
- * themselves, which the columns put there. See docs/decisions/0.8.md § 47.
+ * themselves, which the columns put there. See docs/decisions/ § 47.
  */
 type FooterBase = Omit<ComponentPropsWithoutRef<'footer'>, 'children'> & {
     social?: readonly SocialLink[];
@@ -1129,10 +1129,25 @@ type FooterBase = Omit<ComponentPropsWithoutRef<'footer'>, 'children'> & {
      * have warned about.
      *
      * It is a domain and not a whole signature: the `$`, the `cd ~/` and the year
-     * are the identity's and stay the component's. See `docs/decisions/0.9.md`
+     * are the identity's and stay the component's. See `docs/decisions/`
      * § 49.
      */
     domain?: string | undefined;
+    /**
+     * Adds «Creado con Arrecife ♥», linking to the library's Storybook.
+     *
+     * OFF BY DEFAULT, and that is the decision rather than the default. No
+     * consuming project credits the library today — the four were read before
+     * this was written — so turning it on for everybody would be the library
+     * putting a line into five production footers that none of them asked for.
+     * That is the move § 45 is about, and it does not get made twice.
+     *
+     * A site that wants it passes `builtWith`. It is a boolean and not a slot: the
+     * string and the destination are the library's, and a slot would be an
+     * invitation to write «Hecho con Arrecife» on one site and «Creado con» on the
+     * next, which is the drift this package exists to remove.
+     */
+    builtWith?: boolean | undefined;
 };
 type FooterProps = FooterBase & ({
     /** The shape the library has always had: stacked rows and the signature at the top right. */
@@ -1168,7 +1183,7 @@ type FooterProps = FooterBase & ({
         children: ReactNode;
     }) => ReactNode) | undefined;
 });
-declare function Footer({ variant, columns, description, action, linkAsChild, social, brand, year, signatureHref, domain, className, ...rest }: FooterProps): react.JSX.Element;
+declare function Footer({ variant, columns, description, action, linkAsChild, social, brand, builtWith, year, signatureHref, domain, className, ...rest }: FooterProps): react.JSX.Element;
 
 /**
  * ONE per site. It is the only piece in the system that is spent like the
@@ -1302,7 +1317,7 @@ type NavItemProps = ComponentPropsWithoutRef<'a'> & {
  * impossible to call. It passed `tsc` and it passed the build, because the shape
  * of the children is not something either one looks at. `Slottable` is Radix's
  * answer to exactly this: it marks which child the router's `Link` replaces and
- * leaves the decoration where it is. See `docs/decisions/0.8.md` § 40.
+ * leaves the decoration where it is. See `docs/decisions/` § 40.
  */
 declare function NavItem({ active, asChild, className, children, ...props }: NavItemProps): react.JSX.Element;
 
@@ -1439,7 +1454,7 @@ declare function NewsletterForm({ title, description, state, onSubmitEmail, succ
  * at 24px, and `cursos` titles 29 of its 32 at `h3` — every one in the panel —
  * and the other three, the public catalog pages, at `h2`. Both are rungs the
  * scale already has, and a third `size` could only have named one of them. See
- * `docs/decisions/0.11.md` § 57.
+ * `docs/decisions/` § 57.
  *
  * It takes no mascot face, at either scale: faces go in empty states,
  * confirmations, errors, course progress and celebration.
@@ -1543,7 +1558,7 @@ declare function ScrollingProgressBar({ target, tone, sticky, className, ...prop
  * eyebrow is the same length in none of them, so an inline icon puts the only
  * coloured mark on a different x in every card; pinned to the corner it lands on
  * a grid. The circle is the tint pattern the system already has — `bg-accent/10`
- * as a surface and the colour on the GLYPH, per `docs/decisions/0.6.md` § 4b — and a
+ * as a surface and the colour on the GLYPH, per `docs/decisions/` § 4b — and a
  * glyph clears the 3:1 graphical threshold where text would not clear 4.5.
  *
  * WHICH IS WHY A NEUTRAL NUMBER IS PRIMARY INK AND NOT BIOLUME. With a biolume
@@ -1551,7 +1566,7 @@ declare function ScrollingProgressBar({ target, tone, sticky, className, ...prop
  * the size of a postcard, and the thing you came to read stops being the loudest
  * thing in it. `alert` and `achievement` DO still paint the number sand, so the
  * document's rule survives exactly where it matters: sand when the number is not
- * just a number. See `docs/decisions/0.7.md` § 31.
+ * just a number. See `docs/decisions/` § 31.
  */
 type StatProps = Omit<ComponentPropsWithoutRef<'div'>, 'title'> & {
     /** The number, already formatted. The library imposes no locale. */
@@ -1563,7 +1578,7 @@ type StatProps = Omit<ComponentPropsWithoutRef<'div'>, 'title'> & {
      * the opposite — the diplomas issued, the modules finished. The two paint the
      * same sand today and they are still two names: a system that names by meaning
      * cannot make «this is bad» the only way to say «this stands out». See
-     * `docs/decisions/0.7.md` § 28.
+     * `docs/decisions/` § 28.
      */
     tone?: 'neutral' | 'alert' | 'achievement';
     /** With `progress`, the metric reads as progress and adds the bar. */

package/dist/index.d.ts

@@ -48,7 +48,7 @@ import '@radix-ui/react-label';
  * `--ease-standard`, so it introduces neither a new timing nor a new curve.
  * Whoever asked for less motion still sees the panel appear where it will stay.
  *
- * See `docs/decisions/0.6.md` § 20.
+ * See `docs/decisions/` § 20.
  *
  * The chevron, by contrast, rotates with no transition: `transition-standard`
  * only covers color and border, so `rotate` snaps even with the class in place.
@@ -111,7 +111,7 @@ declare function Alert({ className, variant, emphasis, title, icon, children, ..
  * «Borrar el artículo», not «Aceptar».
  *
  * `destructive` is for the destructive button that has none of that around it:
- * a table row, a toolbar. See `docs/decisions/0.6.md` § 21.
+ * a table row, a toolbar. See `docs/decisions/` § 21.
  */
 declare const AlertDialog: react.FC<AlertDialogPrimitive.AlertDialogProps>;
 declare const AlertDialogTrigger: react.ForwardRefExoticComponent<AlertDialogPrimitive.AlertDialogTriggerProps & react.RefAttributes<HTMLButtonElement>>;
@@ -497,7 +497,7 @@ declare function Switch({ className, ...props }: SwitchProps): react.JSX.Element
  * `Nav`'s `size` documents: a `rounded-none` passed from the call site does
  * nothing, silently. There is one shape on purpose — fourteen call sites wanted
  * the same one — and a second gets a prop when a second consumer exists, not
- * before. See `docs/decisions/0.8.md` § 39.
+ * before. See `docs/decisions/` § 39.
  *
  * THE `tabIndex` IS NOT DECORATION and it is not new behaviour dressed up as
  * markup. A region you can pan with a mouse has to be reachable with a keyboard
@@ -771,7 +771,7 @@ declare function AuthorCard({ name, role, src, bio, action, className, ...props
  *   paths this file used to carry verbatim from the portfolio are gone with
  *   `lib/glyphs.tsx`; `Play`, `Pause`, `SpeakerHigh` and `SpeakerSlash` are the
  *   same symbols in Phosphor's hand, and the ±15s skips are `ArrowCounterClockwise`
- *   and `ArrowClockwise`. See `docs/decisions/0.10.md` § 51.
+ *   and `ArrowClockwise`. See `docs/decisions/` § 51.
  * - analytics' `trackEvent` → the `onFirstPlay` prop, which the consumer wires
  *   to whatever they use. It still fires exactly once per load.
  *
@@ -912,7 +912,7 @@ type CourseCardProps = Omit<CardShellProps, 'children' | 'title' | 'media'> & {
  * formatted in a currency the library does not know, the rating is drawn by a
  * component the project already has, and the cover is an image pipeline. What
  * IS the identity's stays here: the title's scale and its hover, the sand bar,
- * the status badge. See `docs/decisions/0.11.md` § 59.
+ * the status badge. See `docs/decisions/` § 59.
  *
  * The title does NOT go over the cover. It stays in the body at `h3`, with the
  * hover every other card has. Text on a photograph needs a scrim, and a scrim's
@@ -941,7 +941,7 @@ declare function CourseCard({ title, summary, meta, status, progress, media, foo
  * smaller one: the hole inside a table page or a dashboard widget, competing with
  * a dozen elements around it. An admin panel has twenty of those on one screen,
  * and twenty faces is not the humour contract, it is a zoo. The variant carries
- * no face, and the type does not let one through. See `docs/decisions/0.7.md` § 27.
+ * no face, and the type does not let one through. See `docs/decisions/` § 27.
  */
 type EmptyStateBase = Omit<ComponentPropsWithoutRef<'div'>, 'title'> & {
     title: ReactNode;
@@ -1030,7 +1030,7 @@ declare function EventCalendar({ events, onCreateEvent, onUpdateEvent, onDeleteE
  * The domain defaults to `naming.domain` and not to a hand-written string, for
  * the same reason as the wordmark: if it changes, it changes in all five
  * projects at once. A project that lives on its OWN domain passes `domain` —
- * see `docs/decisions/0.9.md` § 49.
+ * see `docs/decisions/` § 49.
  *
  * The social links are icons with NO visible text, so `aria-label` is not an
  * improvement: it is the only thing that makes them legible. Which is why it is
@@ -1046,7 +1046,7 @@ declare function EventCalendar({ events, onCreateEvent, onUpdateEvent, onDeleteE
  * answer has not moved: `EmptyState` is a discriminated union where `page` is
  * the default and `inline` cannot be handed a face; `Nav` takes a `size` where
  * `default` is the bar it always was. Both left what was written before exactly
- * where it was. See `docs/decisions/0.8.md` § 44.
+ * where it was. See `docs/decisions/` § 44.
  *
  * The union is what holds the rule up. `columns`, `description` and `action`
  * exist only on `full`, and the default form cannot be handed one. As loose
@@ -1094,7 +1094,7 @@ type FooterColumn = {
  * `./aviso-legal` — and that row is what `variant="full"`'s columns replace. A
  * flat row cannot say which block a link belongs to, cannot carry a heading a
  * screen reader can jump to, and made whoever wrote the label type the `./`
- * themselves, which the columns put there. See docs/decisions/0.8.md § 47.
+ * themselves, which the columns put there. See docs/decisions/ § 47.
  */
 type FooterBase = Omit<ComponentPropsWithoutRef<'footer'>, 'children'> & {
     social?: readonly SocialLink[];
@@ -1129,10 +1129,25 @@ type FooterBase = Omit<ComponentPropsWithoutRef<'footer'>, 'children'> & {
      * have warned about.
      *
      * It is a domain and not a whole signature: the `$`, the `cd ~/` and the year
-     * are the identity's and stay the component's. See `docs/decisions/0.9.md`
+     * are the identity's and stay the component's. See `docs/decisions/`
      * § 49.
      */
     domain?: string | undefined;
+    /**
+     * Adds «Creado con Arrecife ♥», linking to the library's Storybook.
+     *
+     * OFF BY DEFAULT, and that is the decision rather than the default. No
+     * consuming project credits the library today — the four were read before
+     * this was written — so turning it on for everybody would be the library
+     * putting a line into five production footers that none of them asked for.
+     * That is the move § 45 is about, and it does not get made twice.
+     *
+     * A site that wants it passes `builtWith`. It is a boolean and not a slot: the
+     * string and the destination are the library's, and a slot would be an
+     * invitation to write «Hecho con Arrecife» on one site and «Creado con» on the
+     * next, which is the drift this package exists to remove.
+     */
+    builtWith?: boolean | undefined;
 };
 type FooterProps = FooterBase & ({
     /** The shape the library has always had: stacked rows and the signature at the top right. */
@@ -1168,7 +1183,7 @@ type FooterProps = FooterBase & ({
         children: ReactNode;
     }) => ReactNode) | undefined;
 });
-declare function Footer({ variant, columns, description, action, linkAsChild, social, brand, year, signatureHref, domain, className, ...rest }: FooterProps): react.JSX.Element;
+declare function Footer({ variant, columns, description, action, linkAsChild, social, brand, builtWith, year, signatureHref, domain, className, ...rest }: FooterProps): react.JSX.Element;
 
 /**
  * ONE per site. It is the only piece in the system that is spent like the
@@ -1302,7 +1317,7 @@ type NavItemProps = ComponentPropsWithoutRef<'a'> & {
  * impossible to call. It passed `tsc` and it passed the build, because the shape
  * of the children is not something either one looks at. `Slottable` is Radix's
  * answer to exactly this: it marks which child the router's `Link` replaces and
- * leaves the decoration where it is. See `docs/decisions/0.8.md` § 40.
+ * leaves the decoration where it is. See `docs/decisions/` § 40.
  */
 declare function NavItem({ active, asChild, className, children, ...props }: NavItemProps): react.JSX.Element;
 
@@ -1439,7 +1454,7 @@ declare function NewsletterForm({ title, description, state, onSubmitEmail, succ
  * at 24px, and `cursos` titles 29 of its 32 at `h3` — every one in the panel —
  * and the other three, the public catalog pages, at `h2`. Both are rungs the
  * scale already has, and a third `size` could only have named one of them. See
- * `docs/decisions/0.11.md` § 57.
+ * `docs/decisions/` § 57.
  *
  * It takes no mascot face, at either scale: faces go in empty states,
  * confirmations, errors, course progress and celebration.
@@ -1543,7 +1558,7 @@ declare function ScrollingProgressBar({ target, tone, sticky, className, ...prop
  * eyebrow is the same length in none of them, so an inline icon puts the only
  * coloured mark on a different x in every card; pinned to the corner it lands on
  * a grid. The circle is the tint pattern the system already has — `bg-accent/10`
- * as a surface and the colour on the GLYPH, per `docs/decisions/0.6.md` § 4b — and a
+ * as a surface and the colour on the GLYPH, per `docs/decisions/` § 4b — and a
  * glyph clears the 3:1 graphical threshold where text would not clear 4.5.
  *
  * WHICH IS WHY A NEUTRAL NUMBER IS PRIMARY INK AND NOT BIOLUME. With a biolume
@@ -1551,7 +1566,7 @@ declare function ScrollingProgressBar({ target, tone, sticky, className, ...prop
  * the size of a postcard, and the thing you came to read stops being the loudest
  * thing in it. `alert` and `achievement` DO still paint the number sand, so the
  * document's rule survives exactly where it matters: sand when the number is not
- * just a number. See `docs/decisions/0.7.md` § 31.
+ * just a number. See `docs/decisions/` § 31.
  */
 type StatProps = Omit<ComponentPropsWithoutRef<'div'>, 'title'> & {
     /** The number, already formatted. The library imposes no locale. */
@@ -1563,7 +1578,7 @@ type StatProps = Omit<ComponentPropsWithoutRef<'div'>, 'title'> & {
      * the opposite — the diplomas issued, the modules finished. The two paint the
      * same sand today and they are still two names: a system that names by meaning
      * cannot make «this is bad» the only way to say «this stands out». See
-     * `docs/decisions/0.7.md` § 28.
+     * `docs/decisions/` § 28.
      */
     tone?: 'neutral' | 'alert' | 'achievement';
     /** With `progress`, the metric reads as progress and adds the bar. */

package/dist/index.js

@@ -1,23 +1,23 @@
 'use client';
-import { Label } from './chunk-6IGD5REB.js';
-export { Label } from './chunk-6IGD5REB.js';
-import { Text } from './chunk-TRPBID2W.js';
-export { Text } from './chunk-TRPBID2W.js';
-export { tokens } from './chunk-5A5GH2PF.js';
+import { Label } from './chunk-W75O3Z77.js';
+export { Label } from './chunk-W75O3Z77.js';
+import { Text } from './chunk-BFYNBIVJ.js';
+export { Text } from './chunk-BFYNBIVJ.js';
+export { tokens } from './chunk-6QJQ6K7J.js';
 import { toggleTheme, currentTheme, watchTheme } from './chunk-GCRII2KQ.js';
 export { THEME_ATTRIBUTE, THEME_EVENT, THEME_KEY, applyTheme, currentTheme, preferredTheme, storedTheme, themeScript, toggleTheme, watchTheme } from './chunk-GCRII2KQ.js';
-import { alert, button, avatar, badge, category, metric, CARD_SURFACE, CARD } from './chunk-XXDATT3A.js';
-export { CARD, CARD_HOVER, CARD_SURFACE, alert as alertVariants, avatar as avatarVariants, badge as badgeVariants, button as buttonVariants, category as categoryBadgeVariants, metric as metricBadgeVariants } from './chunk-XXDATT3A.js';
+import { alert, button, avatar, badge, category, metric, CARD_SURFACE, CARD } from './chunk-FF33ARRA.js';
+export { CARD, CARD_HOVER, CARD_SURFACE, alert as alertVariants, avatar as avatarVariants, badge as badgeVariants, button as buttonVariants, category as categoryBadgeVariants, metric as metricBadgeVariants } from './chunk-FF33ARRA.js';
 export { text as textVariants } from './chunk-ODBFN44D.js';
-import { MascotFace, Mascot } from './chunk-RKGKO2TW.js';
-export { Isotype, Logo, Mascot, MascotFace } from './chunk-RKGKO2TW.js';
-import { Icon } from './chunk-ZSCSKCTY.js';
-import { cn } from './chunk-FAAGZG7A.js';
-export { cn } from './chunk-FAAGZG7A.js';
+import { MascotFace, Mascot } from './chunk-BRDTB44R.js';
+export { Isotype, Logo, Mascot, MascotFace } from './chunk-BRDTB44R.js';
+import { Icon } from './chunk-WU66TPJT.js';
+import { cn } from './chunk-TMUGT3Y3.js';
+export { cn } from './chunk-TMUGT3Y3.js';
 export { ASSETS_PATH, faceList, faceUsage, faces, fins, poseList, poses } from './chunk-CKRSQPTX.js';
-import { naming } from './chunk-FGFNK72B.js';
-export { brand, colors, control, dark, fonts, gradient, light, limits, motion, naming, radius, series, shadow, size, spacing, syntax, tagline, typeScale } from './chunk-FGFNK72B.js';
-import { CaretDown, XCircle, Warning, CheckCircle, Info, Camera, CircleNotch, CaretLeft, CaretRight, Minus, Check, X, DotsThree, CaretUp, Copy, ArrowUpRight, TrendDown, TrendUp, Sun, Moon, WarningCircle, Waveform, ArrowCounterClockwise, ArrowClockwise, SpeakerSlash, SpeakerHigh, ArrowsClockwise, Pause, Play } from '@phosphor-icons/react';
+import { naming } from './chunk-5YWGOFDX.js';
+export { brand, colors, control, dark, fonts, gradient, light, limits, motion, naming, radius, series, shadow, size, spacing, syntax, tagline, typeScale } from './chunk-5YWGOFDX.js';
+import { CaretDown, XCircle, Warning, CheckCircle, Info, Camera, CircleNotch, CaretLeft, CaretRight, Minus, Check, X, DotsThree, CaretUp, Copy, ArrowUpRight, TrendDown, TrendUp, Sun, Moon, WarningCircle, Waveform, ArrowCounterClockwise, ArrowClockwise, SpeakerSlash, SpeakerHigh, ArrowsClockwise, Pause, Play, Heart } from '@phosphor-icons/react';
 import * as AccordionPrimitive from '@radix-ui/react-accordion';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { cva } from 'class-variance-authority';
@@ -2478,8 +2478,7 @@ function SocialRow({ social }) {
 function Signature({
   year,
   href,
-  domain: domainName = naming.domain,
-  className
+  domain: domainName = naming.domain
 }) {
   const domain = href ? /* @__PURE__ */ jsx(
     "a",
@@ -2489,7 +2488,7 @@ function Signature({
       children: domainName
     }
   ) : domainName;
-  return /* @__PURE__ */ jsxs(Text, { variant: "meta", tone: "muted", as: "p", className: cn("shrink-0", className), children: [
+  return /* @__PURE__ */ jsxs(Text, { variant: "meta", tone: "muted", as: "p", children: [
     /* @__PURE__ */ jsxs("span", { "aria-hidden": "true", className: "text-accent", children: [
       "$",
       " "
@@ -2507,6 +2506,46 @@ function Signature({
     )
   ] });
 }
+function BuiltWith() {
+  return /* @__PURE__ */ jsxs(Text, { variant: "meta", tone: "muted", as: "p", children: [
+    "Creado con",
+    " ",
+    /* @__PURE__ */ jsx(
+      "a",
+      {
+        href: naming.libraryUrl,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className: cn(
+          "text-accent hover:text-text-primary transition-standard cursor-pointer",
+          "underline decoration-1 underline-offset-4",
+          "rounded-chip focus-ring"
+        ),
+        children: naming.library
+      }
+    ),
+    " ",
+    /* @__PURE__ */ jsx(Icon, { as: Heart, tone: "current", className: "text-accent inline align-middle" })
+  ] });
+}
+function SignatureBlock({
+  year,
+  href,
+  domain,
+  builtWith,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn("gap-step-xs flex shrink-0 flex-col items-center sm:items-end", className),
+      children: [
+        /* @__PURE__ */ jsx(Signature, { year, href, domain }),
+        builtWith ? /* @__PURE__ */ jsx(BuiltWith, {}) : null
+      ]
+    }
+  );
+}
 function Shell({
   className,
   contentClassName,
@@ -2529,6 +2568,7 @@ function Footer({
   linkAsChild,
   social,
   brand: brand2,
+  builtWith,
   year = (/* @__PURE__ */ new Date()).getFullYear(),
   signatureHref,
   domain,
@@ -2578,7 +2618,15 @@ function Footer({
           column.title
         )) })
       ] }),
-      /* @__PURE__ */ jsx("div", { className: "border-hairline mt-step-xl pt-step-lg border-t", children: /* @__PURE__ */ jsx(Signature, { year, href: signatureHref, domain, className: "text-center sm:text-right" }) })
+      /* @__PURE__ */ jsx("div", { className: "border-hairline mt-step-xl pt-step-lg border-t", children: /* @__PURE__ */ jsx(
+        SignatureBlock,
+        {
+          year,
+          href: signatureHref,
+          domain,
+          builtWith
+        }
+      ) })
     ] });
   }
   const rows = [
@@ -2589,7 +2637,16 @@ function Footer({
   return /* @__PURE__ */ jsxs(Shell, { className, contentClassName: "gap-step-lg", ...rest, children: [
     /* @__PURE__ */ jsxs("div", { className: "gap-step-md flex flex-col items-center sm:flex-row sm:flex-wrap", children: [
       first ?? null,
-      /* @__PURE__ */ jsx(Signature, { year, href: signatureHref, domain, className: "sm:ml-auto" })
+      /* @__PURE__ */ jsx(
+        SignatureBlock,
+        {
+          year,
+          href: signatureHref,
+          domain,
+          builtWith,
+          className: "sm:ml-auto"
+        }
+      )
     ] }),
     others
   ] });
@@ -2740,7 +2797,7 @@ function Nav({ brand: brand2, children, actions, size: size2 = "default", classN
                           puts it in `actions`. A `Nav` that hid its own items would leave every
                           consumer without a drawer with no navigation at all, silently.
               
-                          See `docs/decisions/0.10.md` § 54.
+                          See `docs/decisions/` § 54.
                         */
               /* @__PURE__ */ jsx("nav", { "aria-label": "Principal", className: "ml-auto min-w-0 overflow-x-auto", children: /* @__PURE__ */ jsxs("ul", { className: "gap-step-md flex w-max items-center", children: [
                 /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "text-text-muted font-mono text-meta select-none", children: "~/" }),

package/dist/og/index.cjs

@@ -74,8 +74,7 @@ var tagline = {
 var naming = {
   wordmark: "Eduardo \xC1lvarez",
   /** The domain, for the footer CLI signature: `$ cd ~/eduardoalvarez.dev/2026`. */
-  domain: "eduardoalvarez.dev"
-};
+  domain: "eduardoalvarez.dev"};
 
 // src/og/templates.ts
 var OG = {