@540deg/ds 0.0.0-stage → 0.1.0

package/dist/components/molecules/Footer/Footer.js

@@ -0,0 +1,102 @@
+import { Logo } from "../../atoms/Logo/Logo.js";
+import { SocialIcon } from "../../atoms/SocialIcon/SocialIcon.js";
+import { Text } from "../../atoms/Text/Text.js";
+import Footer_module_default from "./Footer.module.js";
+import { FOOTER_DEFAULTS } from "./types.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/molecules/Footer/Footer.tsx
+/**
+* Footer closes the page: the brand with its tagline, the columns of links, the networks
+* and the signature. The top only exists if there is something to put in it.
+*/
+function Footer({ tagline, groups = [], networks = [], networksTitle = FOOTER_DEFAULTS.networksTitle, copyright, legal = [], homeHref = FOOTER_DEFAULTS.homeHref, homeLabel = FOOTER_DEFAULTS.homeLabel, className, ...rest }) {
+	const hasTop = Boolean(tagline) || groups.length > 0 || networks.length > 0;
+	const classes = [Footer_module_default.footer, className ?? ""].filter(Boolean).join(" ");
+	return /* @__PURE__ */ jsxs("footer", {
+		className: classes,
+		...rest,
+		children: [hasTop ? /* @__PURE__ */ jsxs("div", {
+			className: Footer_module_default.top,
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: Footer_module_default.brand,
+				children: [/* @__PURE__ */ jsx("a", {
+					className: Footer_module_default.home,
+					href: homeHref,
+					"aria-label": homeLabel,
+					children: /* @__PURE__ */ jsx(Logo, {
+						size: "sm",
+						label: ""
+					})
+				}), tagline ? /* @__PURE__ */ jsx(Text, {
+					variant: "body-s-light",
+					tone: "secondary",
+					wrap: "pretty",
+					className: Footer_module_default.tagline,
+					children: tagline
+				}) : null]
+			}), /* @__PURE__ */ jsxs("div", {
+				className: Footer_module_default.groups,
+				children: [groups.map((group) => /* @__PURE__ */ jsxs("div", {
+					className: Footer_module_default.group,
+					children: [/* @__PURE__ */ jsx(Text, {
+						as: "p",
+						variant: "micro-bold",
+						tone: "secondary",
+						className: Footer_module_default.groupTitle,
+						children: group.title
+					}), /* @__PURE__ */ jsx("ul", {
+						className: Footer_module_default.list,
+						children: group.items.map((item, i) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(Text, {
+							as: "span",
+							variant: "body-s",
+							children: /* @__PURE__ */ jsx("a", {
+								className: Footer_module_default.link,
+								href: item.href,
+								children: item.label
+							})
+						}) }, `${item.href}-${i}`))
+					})]
+				}, group.title)), networks.length > 0 ? /* @__PURE__ */ jsxs("div", {
+					className: Footer_module_default.group,
+					children: [/* @__PURE__ */ jsx(Text, {
+						as: "p",
+						variant: "micro-bold",
+						tone: "secondary",
+						className: Footer_module_default.groupTitle,
+						children: networksTitle
+					}), /* @__PURE__ */ jsx("ul", {
+						className: [Footer_module_default.list, Footer_module_default.networks].join(" "),
+						children: networks.map((n) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx("a", {
+							className: Footer_module_default.network,
+							href: n.href,
+							"aria-label": n.label,
+							children: /* @__PURE__ */ jsx(SocialIcon, { network: n.network })
+						}) }, n.network))
+					})]
+				}) : null]
+			})]
+		}) : null, /* @__PURE__ */ jsxs("div", {
+			className: Footer_module_default.closing,
+			children: [/* @__PURE__ */ jsx(Text, {
+				as: "p",
+				variant: "micro-light",
+				tone: "secondary",
+				children: copyright
+			}), legal.length > 0 ? /* @__PURE__ */ jsx("ul", {
+				className: Footer_module_default.legal,
+				children: legal.map((item, i) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(Text, {
+					as: "span",
+					variant: "micro-light",
+					tone: "secondary",
+					children: /* @__PURE__ */ jsx("a", {
+						className: Footer_module_default.link,
+						href: item.href,
+						children: item.label
+					})
+				}) }, `${item.href}-${i}`))
+			}) : null]
+		})]
+	});
+}
+//#endregion
+export { Footer };

package/dist/components/molecules/Footer/Footer.module.js

@@ -0,0 +1,33 @@
+//#region src/components/molecules/Footer/Footer.module.css
+var footer = "_footer_64xzx_4";
+var top = "_top_64xzx_9";
+var brand = "_brand_64xzx_16";
+var home = "_home_64xzx_22";
+var tagline = "_tagline_64xzx_33";
+var groups = "_groups_64xzx_37";
+var group = "_group_64xzx_37";
+var groupTitle = "_groupTitle_64xzx_49";
+var list = "_list_64xzx_53";
+var link = "_link_64xzx_61";
+var networks = "_networks_64xzx_77";
+var network = "_network_64xzx_77";
+var closing = "_closing_64xzx_101";
+var legal = "_legal_64xzx_110";
+var Footer_module_default = {
+	footer,
+	top,
+	brand,
+	home,
+	tagline,
+	groups,
+	group,
+	groupTitle,
+	list,
+	link,
+	networks,
+	network,
+	closing,
+	legal
+};
+//#endregion
+export { brand, closing, Footer_module_default as default, footer, group, groupTitle, groups, home, legal, link, list, network, networks, tagline, top };

package/dist/components/molecules/Footer/index.d.ts

@@ -0,0 +1,3 @@
+export { Footer } from './Footer';
+export { FOOTER_DEFAULTS } from './types';
+export type { FooterGroup, FooterLink, FooterNetwork, FooterProps } from './types';

package/dist/components/molecules/Footer/types.d.ts

@@ -0,0 +1,46 @@
+import type { ComponentPropsWithoutRef, ReactNode } from 'react';
+import type { SocialNetwork } from '../../atoms/SocialIcon';
+export type FooterLink = {
+    /** The visible text of the link. */
+    label: ReactNode;
+    /** Where it goes. */
+    href: string;
+};
+export type FooterGroup = {
+    /** The column heading. */
+    title: string;
+    /** The links of the column, in order. */
+    items: FooterLink[];
+};
+export type FooterNetwork = {
+    /** Which network: sets the icon. */
+    network: SocialNetwork;
+    /** The profile URL. */
+    href: string;
+    /** The network's name, read on the link ("LinkedIn"). */
+    label: string;
+};
+export type FooterProps = {
+    /** One line about the brand. Optional. */
+    tagline?: ReactNode;
+    /** Columns of links: the ones people look for when they reach the bottom. */
+    groups?: FooterGroup[];
+    /** The networks 540 publishes. Each a 24 px box with its name on the link. */
+    networks?: FooterNetwork[];
+    /** Label of the networks group. */
+    networksTitle?: string;
+    /** The signature, e.g. "© 2026 540". */
+    copyright: ReactNode;
+    /** Legal links on the right of the signature. */
+    legal?: FooterLink[];
+    /** Where the logo links to. */
+    homeHref?: string;
+    /** Accessible name of the logo link. */
+    homeLabel?: string;
+    className?: string;
+} & Omit<ComponentPropsWithoutRef<'footer'>, 'className' | 'children'>;
+export declare const FOOTER_DEFAULTS: {
+    readonly homeHref: "#inicio";
+    readonly homeLabel: "Ir al inicio";
+    readonly networksTitle: "Síguenos";
+};

package/dist/components/molecules/Footer/types.js

@@ -0,0 +1,8 @@
+//#region src/components/molecules/Footer/types.ts
+var FOOTER_DEFAULTS = {
+	homeHref: "#inicio",
+	homeLabel: "Ir al inicio",
+	networksTitle: "Síguenos"
+};
+//#endregion
+export { FOOTER_DEFAULTS };

package/dist/components/molecules/Grid/Grid.d.ts

@@ -0,0 +1,5 @@
+import type { GridItemProps, GridProps } from './types';
+/** Grid is the twelve-column grid of the system, with the two gutters, and its two five-up layouts. */
+export declare function Grid({ layout, compact, align, children, className }: GridProps): import("react").JSX.Element;
+/** GridItem is a cell of the Grid: its span is the desktop one; the grid deduces the other two. */
+export declare function GridItem({ span, children, className }: GridItemProps): import("react").JSX.Element;

package/dist/components/molecules/Grid/Grid.js

@@ -0,0 +1,32 @@
+import Grid_module_default from "./Grid.module.js";
+import { GRID_DEFAULTS } from "./types.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/molecules/Grid/Grid.tsx
+/** Grid is the twelve-column grid of the system, with the two gutters, and its two five-up layouts. */
+function Grid({ layout = GRID_DEFAULTS.layout, compact = false, align = GRID_DEFAULTS.align, children, className }) {
+	const classes = [
+		Grid_module_default.grid,
+		layout === "five" ? Grid_module_default.five : "",
+		layout === "fiveCentered" ? Grid_module_default.fiveCentered : "",
+		compact ? Grid_module_default.compact : "",
+		align === "center" ? Grid_module_default.center : "",
+		className ?? ""
+	].filter(Boolean).join(" ");
+	return /* @__PURE__ */ jsx("div", {
+		className: classes,
+		children
+	});
+}
+/** GridItem is a cell of the Grid: its span is the desktop one; the grid deduces the other two. */
+function GridItem({ span = GRID_DEFAULTS.span, children, className }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: [
+			Grid_module_default.item,
+			Grid_module_default[`span-${span}`],
+			className ?? ""
+		].filter(Boolean).join(" "),
+		children
+	});
+}
+//#endregion
+export { Grid, GridItem };

package/dist/components/molecules/Grid/Grid.module.js

@@ -0,0 +1,29 @@
+//#region src/components/molecules/Grid/Grid.module.css
+var grid = "_grid_fmszx_4";
+var item = "_item_fmszx_11";
+var five = "_five_fmszx_43";
+var fiveCentered = "_fiveCentered_fmszx_53";
+var compact = "_compact_fmszx_63";
+var center = "_center_fmszx_77";
+var Grid_module_default = {
+	grid,
+	item,
+	"span-1": "_span-1_fmszx_17",
+	"span-2": "_span-2_fmszx_18",
+	"span-3": "_span-3_fmszx_19",
+	"span-4": "_span-4_fmszx_20",
+	"span-5": "_span-5_fmszx_21",
+	"span-6": "_span-6_fmszx_22",
+	"span-7": "_span-7_fmszx_34",
+	"span-8": "_span-8_fmszx_35",
+	"span-9": "_span-9_fmszx_36",
+	"span-10": "_span-10_fmszx_37",
+	"span-11": "_span-11_fmszx_38",
+	"span-12": "_span-12_fmszx_39",
+	five,
+	fiveCentered,
+	compact,
+	center
+};
+//#endregion
+export { center, compact, Grid_module_default as default, five, fiveCentered, grid, item };

package/dist/components/molecules/Grid/index.d.ts

@@ -0,0 +1,3 @@
+export { Grid, GridItem } from './Grid';
+export { GRID_ALIGNS, GRID_DEFAULTS, GRID_LAYOUTS } from './types';
+export type { GridAlign, GridItemProps, GridLayout, GridProps } from './types';

package/dist/components/molecules/Grid/types.d.ts

@@ -0,0 +1,28 @@
+import type { ReactNode } from 'react';
+export declare const GRID_LAYOUTS: readonly ["twelve", "five", "fiveCentered"];
+export type GridLayout = (typeof GRID_LAYOUTS)[number];
+export declare const GRID_ALIGNS: readonly ["stretch", "center"];
+export type GridAlign = (typeof GRID_ALIGNS)[number];
+export type GridProps = {
+    /** twelve: the 12-column grid with spans. five: five equal columns. fiveCentered: three on top, two centered below. */
+    layout?: GridLayout;
+    /** Compact density: smaller text and padding inside. */
+    compact?: boolean;
+    /** stretch: cells as tall as the row (cards). center: each cell centered in height (a drawing and its panel). */
+    align?: GridAlign;
+    /** The cells: GridItems with their span in twelve; the five pieces directly in five and fiveCentered. */
+    children: ReactNode;
+    className?: string;
+};
+export type GridItemProps = {
+    /** Columns of twelve from 1024 px. From 600 px spans up to 6 take half; below, everything takes the row. */
+    span?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+    /** The content of the cell. */
+    children: ReactNode;
+    className?: string;
+};
+export declare const GRID_DEFAULTS: {
+    readonly layout: "twelve";
+    readonly align: "stretch";
+    readonly span: 12;
+};

package/dist/components/molecules/Grid/types.js

@@ -0,0 +1,14 @@
+//#region src/components/molecules/Grid/types.ts
+var GRID_LAYOUTS = [
+	"twelve",
+	"five",
+	"fiveCentered"
+];
+var GRID_ALIGNS = ["stretch", "center"];
+var GRID_DEFAULTS = {
+	layout: "twelve",
+	align: "stretch",
+	span: 12
+};
+//#endregion
+export { GRID_ALIGNS, GRID_DEFAULTS, GRID_LAYOUTS };

package/dist/components/molecules/Lists/Lists.d.ts

@@ -0,0 +1,7 @@
+import type { ArrowListProps, ProblemListProps, SimpleListProps } from './types';
+/** SimpleList is a centered list without bullets: the air separates the items. */
+export declare function SimpleList({ items, className }: SimpleListProps): import("react").JSX.Element;
+/** ArrowList is a centered list with an arrow before each item, for things that lead somewhere. */
+export declare function ArrowList({ items, className }: ArrowListProps): import("react").JSX.Element;
+/** ProblemList is a list of label + text pairs: the label in secondary, the text in primary. */
+export declare function ProblemList({ items, className }: ProblemListProps): import("react").JSX.Element;

package/dist/components/molecules/Lists/Lists.js

@@ -0,0 +1,54 @@
+import { Text } from "../../atoms/Text/Text.js";
+import Lists_module_default from "./Lists.module.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/molecules/Lists/Lists.tsx
+/** SimpleList is a centered list without bullets: the air separates the items. */
+function SimpleList({ items, className }) {
+	return /* @__PURE__ */ jsx("ul", {
+		className: [Lists_module_default.simple, className ?? ""].filter(Boolean).join(" "),
+		children: items.map((item, i) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(Text, {
+			as: "span",
+			variant: "body-m",
+			wrap: "pretty",
+			children: item
+		}) }, i))
+	});
+}
+/** ArrowList is a centered list with an arrow before each item, for things that lead somewhere. */
+function ArrowList({ items, className }) {
+	return /* @__PURE__ */ jsx("ul", {
+		className: [Lists_module_default.arrows, className ?? ""].filter(Boolean).join(" "),
+		children: items.map((item, i) => /* @__PURE__ */ jsxs("li", { children: [/* @__PURE__ */ jsx("span", {
+			className: Lists_module_default.arrow,
+			"aria-hidden": "true",
+			children: "→"
+		}), /* @__PURE__ */ jsx(Text, {
+			as: "span",
+			variant: "body-m",
+			wrap: "pretty",
+			children: item
+		})] }, i))
+	});
+}
+/** ProblemList is a list of label + text pairs: the label in secondary, the text in primary. */
+function ProblemList({ items, className }) {
+	return /* @__PURE__ */ jsx("ul", {
+		className: [Lists_module_default.problems, className ?? ""].filter(Boolean).join(" "),
+		children: items.map((item, i) => /* @__PURE__ */ jsxs("li", {
+			className: Lists_module_default.problem,
+			children: [/* @__PURE__ */ jsx(Text, {
+				as: "span",
+				variant: "body-s",
+				tone: "secondary",
+				children: item.label
+			}), /* @__PURE__ */ jsx(Text, {
+				as: "span",
+				variant: "body-m",
+				wrap: "pretty",
+				children: item.text
+			})]
+		}, i))
+	});
+}
+//#endregion
+export { ArrowList, ProblemList, SimpleList };

package/dist/components/molecules/Lists/Lists.module.js

@@ -0,0 +1,15 @@
+//#region src/components/molecules/Lists/Lists.module.css
+var simple = "_simple_1y536_4";
+var arrows = "_arrows_1y536_14";
+var arrow = "_arrow_1y536_14";
+var problems = "_problems_1y536_34";
+var problem = "_problem_1y536_34";
+var Lists_module_default = {
+	simple,
+	arrows,
+	arrow,
+	problems,
+	problem
+};
+//#endregion
+export { arrow, arrows, Lists_module_default as default, problem, problems, simple };

package/dist/components/molecules/Lists/index.d.ts

@@ -0,0 +1,2 @@
+export { ArrowList, ProblemList, SimpleList } from './Lists';
+export type { ArrowListProps, Problem, ProblemListProps, SimpleListProps } from './types';

package/dist/components/molecules/Lists/types.d.ts

@@ -0,0 +1,22 @@
+import type { ReactNode } from 'react';
+export type SimpleListProps = {
+    /** The items, in order. Short: one line each. */
+    items: ReactNode[];
+    className?: string;
+};
+export type ArrowListProps = {
+    /** The items, in order: each one leads somewhere. Short: one line each. */
+    items: ReactNode[];
+    className?: string;
+};
+export type Problem = {
+    /** The short name of the problem, in secondary. */
+    label: ReactNode;
+    /** What it is, in primary. One sentence. */
+    text: ReactNode;
+};
+export type ProblemListProps = {
+    /** The pairs, in order. */
+    items: Problem[];
+    className?: string;
+};

package/dist/components/molecules/Menu/Menu.d.ts

@@ -0,0 +1,6 @@
+import type { MenuProps } from './types';
+/**
+ * Menu is the desktop navigation bar: the logo on one side, the destinations in the middle,
+ * and an optional end slot (the theme toggle) that is not a destination.
+ */
+export declare function Menu({ items, homeHref, homeLabel, label, end, className, ...rest }: MenuProps): import("react").JSX.Element;

package/dist/components/molecules/Menu/Menu.js

@@ -0,0 +1,43 @@
+import { Logo } from "../../atoms/Logo/Logo.js";
+import { MenuItem } from "../../atoms/MenuItem/MenuItem.js";
+import Menu_module_default from "./Menu.module.js";
+import { MENU_DEFAULTS } from "./types.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/molecules/Menu/Menu.tsx
+/**
+* Menu is the desktop navigation bar: the logo on one side, the destinations in the middle,
+* and an optional end slot (the theme toggle) that is not a destination.
+*/
+function Menu({ items, homeHref = MENU_DEFAULTS.homeHref, homeLabel = MENU_DEFAULTS.homeLabel, label = MENU_DEFAULTS.label, end, className, ...rest }) {
+	const classes = [Menu_module_default.menu, className ?? ""].filter(Boolean).join(" ");
+	return /* @__PURE__ */ jsxs("nav", {
+		className: classes,
+		"aria-label": label,
+		...rest,
+		children: [
+			/* @__PURE__ */ jsx("a", {
+				className: Menu_module_default.home,
+				href: homeHref,
+				"aria-label": homeLabel,
+				children: /* @__PURE__ */ jsx(Logo, {
+					size: "xs",
+					label: ""
+				})
+			}),
+			/* @__PURE__ */ jsx("ul", {
+				className: Menu_module_default.list,
+				children: items.map((item) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(MenuItem, {
+					href: item.href,
+					current: item.current,
+					children: item.label
+				}) }, item.href))
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: Menu_module_default.end,
+				children: end
+			})
+		]
+	});
+}
+//#endregion
+export { Menu };

package/dist/components/molecules/Menu/Menu.module.js

@@ -0,0 +1,13 @@
+//#region src/components/molecules/Menu/Menu.module.css
+var menu = "_menu_14qp6_4";
+var home = "_home_14qp6_13";
+var list = "_list_14qp6_23";
+var end = "_end_14qp6_32";
+var Menu_module_default = {
+	menu,
+	home,
+	list,
+	end
+};
+//#endregion
+export { Menu_module_default as default, end, home, list, menu };

package/dist/components/molecules/Menu/index.d.ts

@@ -0,0 +1,3 @@
+export { Menu } from './Menu';
+export { MENU_DEFAULTS } from './types';
+export type { MenuDestination, MenuProps } from './types';

package/dist/components/molecules/Menu/types.d.ts

@@ -0,0 +1,27 @@
+import type { ComponentPropsWithoutRef, ReactNode } from 'react';
+export type MenuDestination = {
+    /** The anchor or URL of the section ("#cierre"). */
+    href: string;
+    /** The name of the section, written normally. */
+    label: string;
+    /** The section being viewed. One per menu. */
+    current?: boolean;
+};
+export type MenuProps = {
+    /** The destinations, in order. Written normally; the style sets the uppercase. */
+    items: MenuDestination[];
+    /** Where the logo links to. */
+    homeHref?: string;
+    /** Accessible name of the logo link. */
+    homeLabel?: string;
+    /** Accessible name of the navigation. Two menus on a page cannot share it. */
+    label?: string;
+    /** What goes at the right end: the ThemeToggle. It is not a destination, so it lives outside the list. */
+    end?: ReactNode;
+    className?: string;
+} & Omit<ComponentPropsWithoutRef<'nav'>, 'className' | 'children' | 'aria-label'>;
+export declare const MENU_DEFAULTS: {
+    readonly homeHref: "#inicio";
+    readonly homeLabel: "Ir al inicio";
+    readonly label: "Principal";
+};

package/dist/components/molecules/Menu/types.js

@@ -0,0 +1,8 @@
+//#region src/components/molecules/Menu/types.ts
+var MENU_DEFAULTS = {
+	homeHref: "#inicio",
+	homeLabel: "Ir al inicio",
+	label: "Principal"
+};
+//#endregion
+export { MENU_DEFAULTS };

package/dist/components/molecules/Metric/Metric.d.ts

@@ -0,0 +1,5 @@
+import type { MetricNoteProps, MetricProps } from './types';
+/** Metric is a figure in a box: the number big, what it measures in gray, the change in bold. */
+export declare function Metric({ value, label, delta, className }: MetricProps): import("react").JSX.Element;
+/** MetricNote is the small note under a row of metrics: where the numbers come from. */
+export declare function MetricNote({ children, className }: MetricNoteProps): import("react").JSX.Element;

package/dist/components/molecules/Metric/Metric.js

@@ -0,0 +1,40 @@
+import { Text } from "../../atoms/Text/Text.js";
+import Metric_module_default from "./Metric.module.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/molecules/Metric/Metric.tsx
+/** Metric is a figure in a box: the number big, what it measures in gray, the change in bold. */
+function Metric({ value, label, delta, className }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: [Metric_module_default.metric, className ?? ""].filter(Boolean).join(" "),
+		children: [/* @__PURE__ */ jsx(Text, {
+			as: "h3",
+			variant: "title-l",
+			children: value
+		}), /* @__PURE__ */ jsxs("div", {
+			className: Metric_module_default.body,
+			children: [/* @__PURE__ */ jsx(Text, {
+				variant: "body-s",
+				tone: "secondary",
+				wrap: "pretty",
+				children: label
+			}), delta ? /* @__PURE__ */ jsx(Text, {
+				variant: "body-s-bold",
+				wrap: "pretty",
+				children: delta
+			}) : null]
+		})]
+	});
+}
+/** MetricNote is the small note under a row of metrics: where the numbers come from. */
+function MetricNote({ children, className }) {
+	return /* @__PURE__ */ jsx(Text, {
+		variant: "body-s",
+		tone: "secondary",
+		align: "center",
+		wrap: "pretty",
+		className: [Metric_module_default.note, className ?? ""].filter(Boolean).join(" "),
+		children
+	});
+}
+//#endregion
+export { Metric, MetricNote };

package/dist/components/molecules/Metric/Metric.module.js

@@ -0,0 +1,11 @@
+//#region src/components/molecules/Metric/Metric.module.css
+var metric = "_metric_p5wtq_3";
+var body = "_body_p5wtq_16";
+var note = "_note_p5wtq_24";
+var Metric_module_default = {
+	metric,
+	body,
+	note
+};
+//#endregion
+export { body, Metric_module_default as default, metric, note };

package/dist/components/molecules/Metric/index.d.ts

@@ -0,0 +1,2 @@
+export { Metric, MetricNote } from './Metric';
+export type { MetricNoteProps, MetricProps } from './types';

package/dist/components/molecules/Metric/types.d.ts

@@ -0,0 +1,15 @@
+import type { ReactNode } from 'react';
+export type MetricProps = {
+    /** The figure ("0,76 %"). */
+    value: ReactNode;
+    /** What it measures. */
+    label: ReactNode;
+    /** The change ("−89 % desde el 7,06 % inicial"). */
+    delta?: ReactNode;
+    className?: string;
+};
+export type MetricNoteProps = {
+    /** The note: where the numbers come from, which period. One line. */
+    children: ReactNode;
+    className?: string;
+};

package/dist/components/molecules/NavMobile/NavMobile.d.ts

@@ -0,0 +1,6 @@
+import type { NavMobileProps } from './types';
+/**
+ * NavMobile is the narrow-screen navigation: the logo and a button that opens the menu
+ * full screen. The state is internal; choosing a destination closes the panel.
+ */
+export declare function NavMobile({ items, homeHref, homeLabel, label, end, className, ...rest }: NavMobileProps): import("react").JSX.Element;