@540deg/ds 0.0.0-stage → 0.1.0

package/dist/components/molecules/NavMobile/NavMobile.js

@@ -0,0 +1,95 @@
+import { Button } from "../../atoms/Button/Button.js";
+import { Logo } from "../../atoms/Logo/Logo.js";
+import { MenuItem } from "../../atoms/MenuItem/MenuItem.js";
+import NavMobile_module_default from "./NavMobile.module.js";
+import { NAV_MOBILE_DEFAULTS } from "./types.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+import { Menu, X } from "lucide-react";
+//#region src/components/molecules/NavMobile/NavMobile.tsx
+/**
+* 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.
+*/
+function NavMobile({ items, homeHref = NAV_MOBILE_DEFAULTS.homeHref, homeLabel = NAV_MOBILE_DEFAULTS.homeLabel, label = NAV_MOBILE_DEFAULTS.label, end, className, ...rest }) {
+	const [open, setOpen] = useState(false);
+	const panelRef = useRef(null);
+	useEffect(() => {
+		const panel = panelRef.current;
+		if (!panel) return;
+		if (open && !panel.open) panel.showModal();
+		if (!open && panel.open) panel.close();
+	}, [open]);
+	useEffect(() => {
+		if (!open) return;
+		const previous = document.body.style.overflow;
+		document.body.style.overflow = "hidden";
+		return () => {
+			document.body.style.overflow = previous;
+		};
+	}, [open]);
+	const classes = [NavMobile_module_default.nav, className ?? ""].filter(Boolean).join(" ");
+	return /* @__PURE__ */ jsxs("nav", {
+		className: classes,
+		"aria-label": label,
+		...rest,
+		children: [
+			/* @__PURE__ */ jsx("a", {
+				className: NavMobile_module_default.home,
+				href: homeHref,
+				"aria-label": homeLabel,
+				children: /* @__PURE__ */ jsx(Logo, {
+					size: "xs",
+					label: ""
+				})
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: NavMobile_module_default.end,
+				children: [end, /* @__PURE__ */ jsx(Button, {
+					variant: "ghost",
+					icon: /* @__PURE__ */ jsx(Menu, {}),
+					iconOnly: true,
+					"aria-expanded": open,
+					onClick: () => setOpen(true),
+					children: "Abrir menú"
+				})]
+			}),
+			/* @__PURE__ */ jsxs("dialog", {
+				ref: panelRef,
+				className: NavMobile_module_default.panel,
+				"aria-label": label,
+				onClose: () => setOpen(false),
+				children: [/* @__PURE__ */ jsxs("div", {
+					className: NavMobile_module_default.panelBar,
+					children: [/* @__PURE__ */ jsx("a", {
+						className: NavMobile_module_default.home,
+						href: homeHref,
+						"aria-label": homeLabel,
+						onClick: () => setOpen(false),
+						children: /* @__PURE__ */ jsx(Logo, {
+							size: "xs",
+							label: ""
+						})
+					}), /* @__PURE__ */ jsx(Button, {
+						variant: "ghost",
+						icon: /* @__PURE__ */ jsx(X, {}),
+						iconOnly: true,
+						onClick: () => setOpen(false),
+						children: "Cerrar menú"
+					})]
+				}), /* @__PURE__ */ jsx("ul", {
+					className: NavMobile_module_default.list,
+					children: items.map((item) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(MenuItem, {
+						href: item.href,
+						size: "lg",
+						current: item.current,
+						onClick: () => setOpen(false),
+						children: item.label
+					}) }, item.href))
+				})]
+			})
+		]
+	});
+}
+//#endregion
+export { NavMobile };

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

@@ -0,0 +1,17 @@
+//#region src/components/molecules/NavMobile/NavMobile.module.css
+var nav = "_nav_1ghkl_4";
+var home = "_home_1ghkl_13";
+var end = "_end_1ghkl_23";
+var panel = "_panel_1ghkl_30";
+var panelBar = "_panelBar_1ghkl_56";
+var list = "_list_1ghkl_65";
+var NavMobile_module_default = {
+	nav,
+	home,
+	end,
+	panel,
+	panelBar,
+	list
+};
+//#endregion
+export { NavMobile_module_default as default, end, home, list, nav, panel, panelBar };

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

@@ -0,0 +1,3 @@
+export { NavMobile } from './NavMobile';
+export { NAV_MOBILE_DEFAULTS } from './types';
+export type { NavMobileProps } from './types';

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

@@ -0,0 +1,20 @@
+import type { ComponentPropsWithoutRef, ReactNode } from 'react';
+import type { MenuDestination } from '../Menu';
+export type NavMobileProps = {
+    /** The same destinations as Menu: the same objects, built once. */
+    items: MenuDestination[];
+    /** Where the logo links to. */
+    homeHref?: string;
+    /** Accessible name of the logo link. */
+    homeLabel?: string;
+    /** Accessible name of the navigation. */
+    label?: string;
+    /** What goes next to the button: the ThemeToggle. Not a destination. */
+    end?: ReactNode;
+    className?: string;
+} & Omit<ComponentPropsWithoutRef<'nav'>, 'className' | 'children' | 'aria-label'>;
+export declare const NAV_MOBILE_DEFAULTS: {
+    readonly homeHref: "#inicio";
+    readonly homeLabel: "Ir al inicio";
+    readonly label: "Principal";
+};

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

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

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

@@ -0,0 +1,3 @@
+import type { QuestionProps } from './types';
+/** Question is a question and its answer under a hairline: the Q&A of a decision tree. */
+export declare function Question({ question, answer, className }: QuestionProps): import("react").JSX.Element;

package/dist/components/molecules/Question/Question.js

@@ -0,0 +1,22 @@
+import { Text } from "../../atoms/Text/Text.js";
+import Question_module_default from "./Question.module.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/molecules/Question/Question.tsx
+/** Question is a question and its answer under a hairline: the Q&A of a decision tree. */
+function Question({ question, answer, className }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: [Question_module_default.question, className ?? ""].filter(Boolean).join(" "),
+		children: [/* @__PURE__ */ jsx(Text, {
+			variant: "body-m",
+			wrap: "pretty",
+			children: question
+		}), answer ? /* @__PURE__ */ jsx(Text, {
+			variant: "body-m",
+			tone: "secondary",
+			wrap: "pretty",
+			children: answer
+		}) : null]
+	});
+}
+//#endregion
+export { Question };

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

@@ -0,0 +1,5 @@
+//#region src/components/molecules/Question/Question.module.css
+var question = "_question_mtllx_3";
+var Question_module_default = { question };
+//#endregion
+export { Question_module_default as default, question };

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

@@ -0,0 +1,2 @@
+export { Question } from './Question';
+export type { QuestionProps } from './types';

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

@@ -0,0 +1,8 @@
+import type { ReactNode } from 'react';
+export type QuestionProps = {
+    /** The question, in primary. Start with its number: "Q1 · ¿…?" */
+    question: ReactNode;
+    /** The answer, in secondary. */
+    answer?: ReactNode;
+    className?: string;
+};

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

@@ -0,0 +1,3 @@
+import type { ScreenshotProps } from './types';
+/** Screenshot is a capture of a screen: fixed height, whole image, rounded corners. */
+export declare function Screenshot({ src, alt, width, height, className, loading, ...rest }: ScreenshotProps): import("react").JSX.Element;

package/dist/components/molecules/Screenshot/Screenshot.js

@@ -0,0 +1,17 @@
+import Screenshot_module_default from "./Screenshot.module.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/molecules/Screenshot/Screenshot.tsx
+/** Screenshot is a capture of a screen: fixed height, whole image, rounded corners. */
+function Screenshot({ src, alt, width, height, className, loading = "eager", ...rest }) {
+	return /* @__PURE__ */ jsx("img", {
+		className: [Screenshot_module_default.screenshot, className ?? ""].filter(Boolean).join(" "),
+		src,
+		alt,
+		width,
+		height,
+		loading,
+		...rest
+	});
+}
+//#endregion
+export { Screenshot };

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

@@ -0,0 +1,5 @@
+//#region src/components/molecules/Screenshot/Screenshot.module.css
+var screenshot = "_screenshot_hioia_3";
+var Screenshot_module_default = { screenshot };
+//#endregion
+export { Screenshot_module_default as default, screenshot };

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

@@ -0,0 +1,2 @@
+export { Screenshot } from './Screenshot';
+export type { ScreenshotProps } from './types';

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

@@ -0,0 +1,12 @@
+import type { ComponentPropsWithoutRef } from 'react';
+export type ScreenshotProps = {
+    /** Path or URL of the capture. */
+    src: string;
+    /** Required: what the screen shows, in words. */
+    alt: string;
+    /** Intrinsic width in px, so the layout does not jump while it loads. */
+    width?: number;
+    /** Intrinsic height in px, so the layout does not jump while it loads. */
+    height?: number;
+    className?: string;
+} & Omit<ComponentPropsWithoutRef<'img'>, 'src' | 'alt' | 'className' | 'width' | 'height'>;

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

@@ -0,0 +1,6 @@
+import type { SectionProps } from './types';
+/**
+ * Section is a band of the page: the background reaches edge to edge and the content stays
+ * in the column. It gives the vertical rhythm to every section.
+ */
+export declare function Section({ tone, className, children, ...rest }: SectionProps): import("react").JSX.Element;

package/dist/components/molecules/Section/Section.js

@@ -0,0 +1,25 @@
+import Section_module_default from "./Section.module.js";
+import { SECTION_DEFAULTS } from "./types.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/molecules/Section/Section.tsx
+/**
+* Section is a band of the page: the background reaches edge to edge and the content stays
+* in the column. It gives the vertical rhythm to every section.
+*/
+function Section({ tone = SECTION_DEFAULTS.tone, className, children, ...rest }) {
+	const classes = [
+		Section_module_default.section,
+		Section_module_default[`tone-${tone}`],
+		className ?? ""
+	].filter(Boolean).join(" ");
+	return /* @__PURE__ */ jsx("section", {
+		className: classes,
+		...rest,
+		children: /* @__PURE__ */ jsx("div", {
+			className: Section_module_default.column,
+			children
+		})
+	});
+}
+//#endregion
+export { Section };

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

@@ -0,0 +1,11 @@
+//#region src/components/molecules/Section/Section.module.css
+var section = "_section_1nzhz_4";
+var column = "_column_1nzhz_18";
+var Section_module_default = {
+	section,
+	"tone-default": "_tone-default_1nzhz_9",
+	"tone-raised": "_tone-raised_1nzhz_13",
+	column
+};
+//#endregion
+export { column, Section_module_default as default, section };

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

@@ -0,0 +1,3 @@
+export { Section } from './Section';
+export { SECTION_DEFAULTS, SECTION_TONES } from './types';
+export type { SectionProps, SectionTone } from './types';

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

@@ -0,0 +1,13 @@
+import type { ComponentPropsWithoutRef, ReactNode } from 'react';
+export declare const SECTION_TONES: readonly ["default", "raised"];
+export type SectionTone = (typeof SECTION_TONES)[number];
+export type SectionProps = {
+    /** default paints nothing; raised lifts the band one step. */
+    tone?: SectionTone;
+    /** What goes inside the column. */
+    children: ReactNode;
+    className?: string;
+} & Omit<ComponentPropsWithoutRef<'section'>, 'className' | 'children'>;
+export declare const SECTION_DEFAULTS: {
+    readonly tone: "default";
+};

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

@@ -0,0 +1,5 @@
+//#region src/components/molecules/Section/types.ts
+var SECTION_TONES = ["default", "raised"];
+var SECTION_DEFAULTS = { tone: "default" };
+//#endregion
+export { SECTION_DEFAULTS, SECTION_TONES };

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

@@ -0,0 +1,6 @@
+import type { SectionHeaderProps } from './types';
+/**
+ * SectionHeader opens a section: title and lead. The most repeated piece of the site.
+ * The title style is always title-l; the heading level is chosen apart.
+ */
+export declare function SectionHeader({ title, description, align, level, titleId, className, ...rest }: SectionHeaderProps): import("react").JSX.Element;

package/dist/components/molecules/SectionHeader/SectionHeader.js

@@ -0,0 +1,34 @@
+import { Text } from "../../atoms/Text/Text.js";
+import SectionHeader_module_default from "./SectionHeader.module.js";
+import { SECTION_HEADER_DEFAULTS } from "./types.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/molecules/SectionHeader/SectionHeader.tsx
+/**
+* SectionHeader opens a section: title and lead. The most repeated piece of the site.
+* The title style is always title-l; the heading level is chosen apart.
+*/
+function SectionHeader({ title, description, align = SECTION_HEADER_DEFAULTS.align, level = SECTION_HEADER_DEFAULTS.level, titleId, className, ...rest }) {
+	const classes = [
+		SectionHeader_module_default.header,
+		align === "center" ? SectionHeader_module_default.center : "",
+		className ?? ""
+	].filter(Boolean).join(" ");
+	return /* @__PURE__ */ jsxs("header", {
+		className: classes,
+		...rest,
+		children: [/* @__PURE__ */ jsx(Text, {
+			as: level,
+			variant: "title-l",
+			wrap: "balance",
+			id: titleId,
+			children: title
+		}), description ? /* @__PURE__ */ jsx(Text, {
+			variant: "body-m",
+			tone: "secondary",
+			wrap: "pretty",
+			children: description
+		}) : null]
+	});
+}
+//#endregion
+export { SectionHeader };

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

@@ -0,0 +1,9 @@
+//#region src/components/molecules/SectionHeader/SectionHeader.module.css
+var header = "_header_q562s_3";
+var center = "_center_q562s_9";
+var SectionHeader_module_default = {
+	header,
+	center
+};
+//#endregion
+export { center, SectionHeader_module_default as default, header };

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

@@ -0,0 +1,3 @@
+export { SectionHeader } from './SectionHeader';
+export { SECTION_HEADER_ALIGNS, SECTION_HEADER_DEFAULTS, SECTION_HEADER_LEVELS } from './types';
+export type { SectionHeaderAlign, SectionHeaderLevel, SectionHeaderProps } from './types';

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

@@ -0,0 +1,22 @@
+import type { ComponentPropsWithoutRef, ReactNode } from 'react';
+export declare const SECTION_HEADER_ALIGNS: readonly ["start", "center"];
+export declare const SECTION_HEADER_LEVELS: readonly ["h1", "h2", "h3", "h4"];
+export type SectionHeaderAlign = (typeof SECTION_HEADER_ALIGNS)[number];
+export type SectionHeaderLevel = (typeof SECTION_HEADER_LEVELS)[number];
+export type SectionHeaderProps = {
+    /** The title. Always title-l; the level is chosen apart. */
+    title: ReactNode;
+    /** Optional lead, one or two sentences in body-m secondary. */
+    description?: ReactNode;
+    /** start fills the column; center caps at half the grid and centers. */
+    align?: SectionHeaderAlign;
+    /** Heading level. One h1 per page; the rest of sections go down a level. */
+    level?: SectionHeaderLevel;
+    /** id for the title, so the Section can point to it with aria-labelledby. */
+    titleId?: string;
+    className?: string;
+} & Omit<ComponentPropsWithoutRef<'header'>, 'className' | 'children' | 'title'>;
+export declare const SECTION_HEADER_DEFAULTS: {
+    readonly align: "start";
+    readonly level: "h2";
+};

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

@@ -0,0 +1,14 @@
+//#region src/components/molecules/SectionHeader/types.ts
+var SECTION_HEADER_ALIGNS = ["start", "center"];
+var SECTION_HEADER_LEVELS = [
+	"h1",
+	"h2",
+	"h3",
+	"h4"
+];
+var SECTION_HEADER_DEFAULTS = {
+	align: "start",
+	level: "h2"
+};
+//#endregion
+export { SECTION_HEADER_ALIGNS, SECTION_HEADER_DEFAULTS, SECTION_HEADER_LEVELS };

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

@@ -0,0 +1,6 @@
+import type { StackProps } from './types';
+/**
+ * Stack puts the pieces of a stop one under the other with the system's air between them:
+ * a header over a grid, a row of metrics over its note, a few questions in a column.
+ */
+export declare function Stack({ gap, measure, children, className }: StackProps): import("react").JSX.Element;

package/dist/components/molecules/Stack/Stack.js

@@ -0,0 +1,22 @@
+import Stack_module_default from "./Stack.module.js";
+import { STACK_DEFAULTS } from "./types.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/molecules/Stack/Stack.tsx
+/**
+* Stack puts the pieces of a stop one under the other with the system's air between them:
+* a header over a grid, a row of metrics over its note, a few questions in a column.
+*/
+function Stack({ gap = STACK_DEFAULTS.gap, measure = STACK_DEFAULTS.measure, children, className }) {
+	const classes = [
+		Stack_module_default.stack,
+		Stack_module_default[`gap-${gap}`],
+		measure !== "none" ? Stack_module_default[`measure-${measure}`] : "",
+		className ?? ""
+	].filter(Boolean).join(" ");
+	return /* @__PURE__ */ jsx("div", {
+		className: classes,
+		children
+	});
+}
+//#endregion
+export { Stack };

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

@@ -0,0 +1,12 @@
+//#region src/components/molecules/Stack/Stack.module.css
+var stack = "_stack_169h2_4";
+var Stack_module_default = {
+	stack,
+	"gap-s": "_gap-s_169h2_10",
+	"gap-m": "_gap-m_169h2_14",
+	"gap-l": "_gap-l_169h2_18",
+	"measure-half": "_measure-half_169h2_23",
+	"measure-wide": "_measure-wide_169h2_29"
+};
+//#endregion
+export { Stack_module_default as default, stack };

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

@@ -0,0 +1,3 @@
+export { Stack } from './Stack';
+export { STACK_DEFAULTS, STACK_GAPS, STACK_MEASURES } from './types';
+export type { StackGap, StackMeasure, StackProps } from './types';

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

@@ -0,0 +1,18 @@
+import type { ReactNode } from 'react';
+export declare const STACK_GAPS: readonly ["s", "m", "l"];
+export declare const STACK_MEASURES: readonly ["none", "half", "wide"];
+export type StackGap = (typeof STACK_GAPS)[number];
+export type StackMeasure = (typeof STACK_MEASURES)[number];
+export type StackProps = {
+    /** The air between pieces: s (16), m (32) or l (48). */
+    gap?: StackGap;
+    /** Cap the whole pile at half the grid or three quarters, centered. */
+    measure?: StackMeasure;
+    /** The pieces, one under the other. */
+    children: ReactNode;
+    className?: string;
+};
+export declare const STACK_DEFAULTS: {
+    readonly gap: "l";
+    readonly measure: "none";
+};

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

@@ -0,0 +1,17 @@
+//#region src/components/molecules/Stack/types.ts
+var STACK_GAPS = [
+	"s",
+	"m",
+	"l"
+];
+var STACK_MEASURES = [
+	"none",
+	"half",
+	"wide"
+];
+var STACK_DEFAULTS = {
+	gap: "l",
+	measure: "none"
+};
+//#endregion
+export { STACK_DEFAULTS, STACK_GAPS, STACK_MEASURES };

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

@@ -0,0 +1,6 @@
+import type { TeamMemberProps } from './types';
+/**
+ * TeamMember is a person's card: portrait 1:1, role, name and, if any, two lines of bio.
+ * Aligned to the margin the role goes first; centered, the name first and the role as a caption.
+ */
+export declare function TeamMember({ src, name, role, bio, align, href, level, className }: TeamMemberProps): import("react").JSX.Element;

package/dist/components/molecules/TeamMember/TeamMember.js

@@ -0,0 +1,55 @@
+import { Image } from "../../atoms/Image/Image.js";
+import { Text } from "../../atoms/Text/Text.js";
+import TeamMember_module_default from "./TeamMember.module.js";
+import { TEAM_MEMBER_DEFAULTS } from "./types.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/molecules/TeamMember/TeamMember.tsx
+/**
+* TeamMember is a person's card: portrait 1:1, role, name and, if any, two lines of bio.
+* Aligned to the margin the role goes first; centered, the name first and the role as a caption.
+*/
+function TeamMember({ src, name, role, bio, align = TEAM_MEMBER_DEFAULTS.align, href, level = TEAM_MEMBER_DEFAULTS.level, className }) {
+	const classes = [
+		TeamMember_module_default.member,
+		align === "center" ? TeamMember_module_default.center : "",
+		className ?? ""
+	].filter(Boolean).join(" ");
+	const nameNode = /* @__PURE__ */ jsx(Text, {
+		as: level,
+		variant: "title-xs",
+		wrap: "balance",
+		children: href ? /* @__PURE__ */ jsx("a", {
+			className: TeamMember_module_default.link,
+			href,
+			children: name
+		}) : name
+	});
+	const roleNode = /* @__PURE__ */ jsx(Text, {
+		as: "p",
+		variant: "micro-bold",
+		tone: "secondary",
+		children: role
+	});
+	return /* @__PURE__ */ jsxs("article", {
+		className: classes,
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				className: TeamMember_module_default.portrait,
+				children: /* @__PURE__ */ jsx(Image, {
+					src,
+					alt: "",
+					ratio: "1:1"
+				})
+			}),
+			align === "center" ? /* @__PURE__ */ jsxs(Fragment, { children: [nameNode, roleNode] }) : /* @__PURE__ */ jsxs(Fragment, { children: [roleNode, nameNode] }),
+			bio ? /* @__PURE__ */ jsx(Text, {
+				variant: "body-s",
+				tone: "secondary",
+				wrap: "pretty",
+				children: bio
+			}) : null
+		]
+	});
+}
+//#endregion
+export { TeamMember };

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

@@ -0,0 +1,13 @@
+//#region src/components/molecules/TeamMember/TeamMember.module.css
+var member = "_member_1mo29_4";
+var center = "_center_1mo29_10";
+var portrait = "_portrait_1mo29_15";
+var link = "_link_1mo29_19";
+var TeamMember_module_default = {
+	member,
+	center,
+	portrait,
+	link
+};
+//#endregion
+export { center, TeamMember_module_default as default, link, member, portrait };

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

@@ -0,0 +1,3 @@
+export { TeamMember } from './TeamMember';
+export { TEAM_MEMBER_ALIGNS, TEAM_MEMBER_DEFAULTS } from './types';
+export type { TeamMemberAlign, TeamMemberProps } from './types';

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

@@ -0,0 +1,24 @@
+import type { ReactNode } from 'react';
+export declare const TEAM_MEMBER_ALIGNS: readonly ["start", "center"];
+export type TeamMemberAlign = (typeof TEAM_MEMBER_ALIGNS)[number];
+export type TeamMemberProps = {
+    /** The portrait. Follows the width of the card and crops to 1:1. */
+    src: string;
+    /** The name: an h3. */
+    name: ReactNode;
+    /** The role: uppercase by style. */
+    role: ReactNode;
+    /** Two or three lines about the person. Optional. */
+    bio?: ReactNode;
+    /** start: role before the name. center: name first, the role as a caption. */
+    align?: TeamMemberAlign;
+    /** When the person has a page, the name is the link, not the whole card. */
+    href?: string;
+    /** Heading level of the name. */
+    level?: 'h2' | 'h3' | 'h4';
+    className?: string;
+};
+export declare const TEAM_MEMBER_DEFAULTS: {
+    readonly align: "start";
+    readonly level: "h3";
+};

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

@@ -0,0 +1,8 @@
+//#region src/components/molecules/TeamMember/types.ts
+var TEAM_MEMBER_ALIGNS = ["start", "center"];
+var TEAM_MEMBER_DEFAULTS = {
+	align: "start",
+	level: "h3"
+};
+//#endregion
+export { TEAM_MEMBER_ALIGNS, TEAM_MEMBER_DEFAULTS };

package/dist/components/organisms/Bars/Bars.d.ts

@@ -0,0 +1,6 @@
+import type { BarsProps } from './types';
+/**
+ * Bars is a horizontal bar chart: each row its label, a bar that grows from the left when it
+ * comes into view (or its Step lights up) and its figure at the tip. Ported from the newsletter talk.
+ */
+export declare function Bars({ rows, label, header, max, unit, decimals, className }: BarsProps): import("react").JSX.Element;