@540deg/ds 0.0.0-stage → 0.1.0

package/dist/components/organisms/ProgressBar/ProgressBar.module.js

@@ -0,0 +1,17 @@
+//#region src/components/organisms/ProgressBar/ProgressBar.module.css
+var bar = "_bar_uakc4_4";
+var track = "_track_uakc4_10";
+var fill = "_fill_uakc4_17";
+var dot = "_dot_uakc4_25";
+var milestone = "_milestone_uakc4_35";
+var ends = "_ends_uakc4_44";
+var ProgressBar_module_default = {
+	bar,
+	track,
+	fill,
+	dot,
+	milestone,
+	ends
+};
+//#endregion
+export { bar, ProgressBar_module_default as default, dot, ends, fill, milestone, track };

package/dist/components/organisms/ProgressBar/index.d.ts

@@ -0,0 +1,3 @@
+export { ProgressBar } from './ProgressBar';
+export { PROGRESS_BAR_DEFAULTS } from './types';
+export type { ProgressBarProps } from './types';

package/dist/components/organisms/ProgressBar/types.d.ts

@@ -0,0 +1,20 @@
+import type { ReactNode } from 'react';
+export type ProgressBarProps = {
+    /** Fill from 0 to 1. */
+    value: number;
+    /** Label at the left end ("Feb 2025"). */
+    start?: ReactNode;
+    /** Label at the right end ("Hoy"). */
+    end?: ReactNode;
+    /** How many intermediate milestones, spread evenly along the bar. */
+    milestones?: number;
+    /** How many of those milestones are reached: they light up from the left. */
+    reached?: number;
+    /** Accessible name. */
+    label: string;
+    className?: string;
+};
+export declare const PROGRESS_BAR_DEFAULTS: {
+    readonly milestones: 0;
+    readonly reached: 0;
+};

package/dist/components/organisms/ProgressBar/types.js

@@ -0,0 +1,7 @@
+//#region src/components/organisms/ProgressBar/types.ts
+var PROGRESS_BAR_DEFAULTS = {
+	milestones: 0,
+	reached: 0
+};
+//#endregion
+export { PROGRESS_BAR_DEFAULTS };

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

@@ -0,0 +1,6 @@
+import type { PunchlineProps } from './types';
+/**
+ * Punchline is the sentence that closes a block: statement at three quarters under a hairline,
+ * with an optional transition. Inside a slide, or as its own stop.
+ */
+export declare function Punchline({ sentence, transition, placement, id, className }: PunchlineProps): import("react").JSX.Element;

package/dist/components/organisms/Punchline/Punchline.js

@@ -0,0 +1,41 @@
+import { Text } from "../../atoms/Text/Text.js";
+import { Slide } from "../Slide/Slide.js";
+import Punchline_module_default from "./Punchline.module.js";
+import { PUNCHLINE_DEFAULTS } from "./types.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/organisms/Punchline/Punchline.tsx
+/**
+* Punchline is the sentence that closes a block: statement at three quarters under a hairline,
+* with an optional transition. Inside a slide, or as its own stop.
+*/
+function Punchline({ sentence, transition, placement = PUNCHLINE_DEFAULTS.placement, id, className }) {
+	const body = /* @__PURE__ */ jsxs("div", {
+		className: [
+			Punchline_module_default.punchline,
+			placement === "inside" ? Punchline_module_default.inside : "",
+			className ?? ""
+		].filter(Boolean).join(" "),
+		children: [/* @__PURE__ */ jsx(Text, {
+			as: "p",
+			variant: "statement",
+			align: "center",
+			wrap: "balance",
+			measure: "wide",
+			children: sentence
+		}), transition ? /* @__PURE__ */ jsx(Text, {
+			variant: "body-m",
+			tone: "secondary",
+			align: "center",
+			wrap: "pretty",
+			measure: "half",
+			className: Punchline_module_default.transition,
+			children: transition
+		}) : null]
+	});
+	return placement === "standalone" ? /* @__PURE__ */ jsx(Slide, {
+		id: id ?? "remate",
+		children: body
+	}) : body;
+}
+//#endregion
+export { Punchline };

package/dist/components/organisms/Punchline/Punchline.module.js

@@ -0,0 +1,11 @@
+//#region src/components/organisms/Punchline/Punchline.module.css
+var punchline = "_punchline_anwe8_4";
+var inside = "_inside_anwe8_10";
+var transition = "_transition_anwe8_14";
+var Punchline_module_default = {
+	punchline,
+	inside,
+	transition
+};
+//#endregion
+export { Punchline_module_default as default, inside, punchline, transition };

package/dist/components/organisms/Punchline/index.d.ts

@@ -0,0 +1,3 @@
+export { Punchline } from './Punchline';
+export { PUNCHLINE_DEFAULTS } from './types';
+export type { PunchlineProps } from './types';

package/dist/components/organisms/Punchline/types.d.ts

@@ -0,0 +1,15 @@
+import type { ReactNode } from 'react';
+export type PunchlineProps = {
+    /** The sentence, in statement at three quarters. */
+    sentence: ReactNode;
+    /** The transition to what comes next, body-m secondary. */
+    transition?: ReactNode;
+    /** inside: at the end of a slide, under a line. standalone: its own stop. */
+    placement?: 'inside' | 'standalone';
+    /** Only for standalone. */
+    id?: string;
+    className?: string;
+};
+export declare const PUNCHLINE_DEFAULTS: {
+    readonly placement: "inside";
+};

package/dist/components/organisms/Punchline/types.js

@@ -0,0 +1,4 @@
+//#region src/components/organisms/Punchline/types.ts
+var PUNCHLINE_DEFAULTS = { placement: "inside" };
+//#endregion
+export { PUNCHLINE_DEFAULTS };

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

@@ -0,0 +1,3 @@
+import type { QuoteProps } from './types';
+/** Quote is a sentence someone said: statement at three quarters, with the attribution under it. */
+export declare function Quote({ id, sentence, author, tone, className }: QuoteProps): import("react").JSX.Element;

package/dist/components/organisms/Quote/Quote.js

@@ -0,0 +1,33 @@
+import { Text } from "../../atoms/Text/Text.js";
+import { Slide } from "../Slide/Slide.js";
+import Quote_module_default from "./Quote.module.js";
+import { QUOTE_DEFAULTS } from "./types.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/organisms/Quote/Quote.tsx
+/** Quote is a sentence someone said: statement at three quarters, with the attribution under it. */
+function Quote({ id, sentence, author, tone = QUOTE_DEFAULTS.tone, className }) {
+	return /* @__PURE__ */ jsx(Slide, {
+		id,
+		tone,
+		className,
+		children: /* @__PURE__ */ jsxs("figure", {
+			className: Quote_module_default.figure,
+			children: [/* @__PURE__ */ jsx(Text, {
+				as: "blockquote",
+				variant: "statement",
+				align: "center",
+				wrap: "balance",
+				measure: "wide",
+				style: { margin: 0 },
+				children: sentence
+			}), /* @__PURE__ */ jsx(Text, {
+				as: "figcaption",
+				variant: "micro-light",
+				tone: "secondary",
+				children: author
+			})]
+		})
+	});
+}
+//#endregion
+export { Quote };

package/dist/components/organisms/Quote/Quote.module.js

@@ -0,0 +1,5 @@
+//#region src/components/organisms/Quote/Quote.module.css
+var figure = "_figure_1kqx2_3";
+var Quote_module_default = { figure };
+//#endregion
+export { Quote_module_default as default, figure };

package/dist/components/organisms/Quote/index.d.ts

@@ -0,0 +1,3 @@
+export { Quote } from './Quote';
+export { QUOTE_DEFAULTS } from './types';
+export type { QuoteProps } from './types';

package/dist/components/organisms/Quote/types.d.ts

@@ -0,0 +1,15 @@
+import type { ReactNode } from 'react';
+export type QuoteProps = {
+    /** The stop's anchor. */
+    id: string;
+    /** The quoted sentence, in statement. */
+    sentence: ReactNode;
+    /** Who said it. */
+    author: ReactNode;
+    /** The band tone; quotes usually go raised. */
+    tone?: 'default' | 'raised';
+    className?: string;
+};
+export declare const QUOTE_DEFAULTS: {
+    readonly tone: "raised";
+};

package/dist/components/organisms/Quote/types.js

@@ -0,0 +1,4 @@
+//#region src/components/organisms/Quote/types.ts
+var QUOTE_DEFAULTS = { tone: "raised" };
+//#endregion
+export { QUOTE_DEFAULTS };

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

@@ -0,0 +1,54 @@
+import type { SchemaFrameProps, SchemaLayerProps, SchemaProps } from './types';
+/**
+ * The drawing vocabulary of the talks, as class names: shapes (node, highlighted, note, pill),
+ * lines (line, lineStrong, lineDashed, arrowhead), chart series and the six text sizes.
+ */
+export declare const schema: {
+    readonly node: string;
+    readonly highlighted: string;
+    readonly note: string;
+    readonly pill: string;
+    readonly inverse: string;
+    readonly dot: string;
+    readonly arc: string;
+    readonly icon: string;
+    readonly iconBox: string;
+    readonly iconFill: string;
+    readonly line: string;
+    readonly lineStrong: string;
+    readonly lineDashed: string;
+    readonly arrowhead: string;
+    readonly arrowheadFill: string;
+    readonly series: string;
+    readonly seriesDashed: string;
+    readonly accent: string;
+    readonly accentThin: string;
+    readonly accentDashed: string;
+    readonly accentDotted: string;
+    readonly accentDot: string;
+    readonly title: string;
+    readonly nodeText: string;
+    readonly nodeSub: string;
+    readonly circleText: string;
+    readonly pillText: string;
+    readonly inverseText: string;
+    readonly noteText: string;
+    readonly label: string;
+    readonly coreTitle: string;
+    readonly coreSub: string;
+    readonly micro: string;
+    readonly sideText: string;
+};
+/**
+ * Schema is a drawing of the talk: an SVG with an accessible title and description, built from
+ * the vocabulary above. Inside a Steps, its layers light up step by step.
+ */
+export declare function Schema({ viewBox, title, description, data, guided, children, className, ...rest }: SchemaProps): import("react").JSX.Element;
+/** SchemaLayer is a group of the drawing lit from a step on. */
+export declare function SchemaLayer({ step, label, children, className }: SchemaLayerProps): import("react").JSX.Element;
+/** SchemaFrame gives the drawing the whole window width (scrolling sideways if needed) and a caption. */
+export declare function SchemaFrame({ caption, children, className }: SchemaFrameProps): import("react").JSX.Element;
+/** SchemaVoice is the live region that reads the label of the lit layer. */
+export declare function SchemaVoice({ labels }: {
+    labels: string[];
+}): import("react").JSX.Element;

package/dist/components/organisms/Schema/Schema.js

@@ -0,0 +1,117 @@
+import { useSteps } from "../Steps/StepsContext.js";
+import { Text } from "../../atoms/Text/Text.js";
+import Schema_module_default from "./Schema.module.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useId } from "react";
+//#region src/components/organisms/Schema/Schema.tsx
+/**
+* The drawing vocabulary of the talks, as class names: shapes (node, highlighted, note, pill),
+* lines (line, lineStrong, lineDashed, arrowhead), chart series and the six text sizes.
+*/
+var schema = {
+	node: Schema_module_default.node,
+	highlighted: Schema_module_default.highlighted,
+	note: Schema_module_default.note,
+	pill: Schema_module_default.pill,
+	inverse: Schema_module_default.inverse,
+	dot: Schema_module_default.dot,
+	arc: Schema_module_default.arc,
+	icon: Schema_module_default.icon,
+	iconBox: Schema_module_default.iconBox,
+	iconFill: Schema_module_default.iconFill,
+	line: Schema_module_default.line,
+	lineStrong: Schema_module_default.lineStrong,
+	lineDashed: Schema_module_default.lineDashed,
+	arrowhead: Schema_module_default.arrowhead,
+	arrowheadFill: Schema_module_default.arrowheadFill,
+	series: Schema_module_default.series,
+	seriesDashed: Schema_module_default.seriesDashed,
+	accent: Schema_module_default.accent,
+	accentThin: Schema_module_default.accentThin,
+	accentDashed: Schema_module_default.accentDashed,
+	accentDotted: Schema_module_default.accentDotted,
+	accentDot: Schema_module_default.accentDot,
+	title: Schema_module_default.title,
+	nodeText: Schema_module_default.nodeText,
+	nodeSub: Schema_module_default.nodeSub,
+	circleText: Schema_module_default.circleText,
+	pillText: Schema_module_default.pillText,
+	inverseText: Schema_module_default.inverseText,
+	noteText: Schema_module_default.noteText,
+	label: Schema_module_default.label,
+	coreTitle: Schema_module_default.coreTitle,
+	coreSub: Schema_module_default.coreSub,
+	micro: Schema_module_default.micro,
+	sideText: Schema_module_default.sideText
+};
+/**
+* Schema is a drawing of the talk: an SVG with an accessible title and description, built from
+* the vocabulary above. Inside a Steps, its layers light up step by step.
+*/
+function Schema({ viewBox, title, description, data = false, guided = false, children, className, ...rest }) {
+	const id = useId();
+	const { current, guided: stepsGuided } = useSteps();
+	const isGuided = guided || stepsGuided;
+	return /* @__PURE__ */ jsxs("svg", {
+		className: [
+			Schema_module_default.schema,
+			data ? Schema_module_default.data : "",
+			isGuided ? Schema_module_default.guided : "",
+			className ?? ""
+		].filter(Boolean).join(" "),
+		viewBox,
+		role: "img",
+		"aria-labelledby": description ? `${id}-t ${id}-d` : `${id}-t`,
+		"data-current": isGuided && Number.isFinite(current) ? current : void 0,
+		...rest,
+		children: [
+			/* @__PURE__ */ jsx("title", {
+				id: `${id}-t`,
+				children: title
+			}),
+			description ? /* @__PURE__ */ jsx("desc", {
+				id: `${id}-d`,
+				children: description
+			}) : null,
+			children
+		]
+	});
+}
+/** SchemaLayer is a group of the drawing lit from a step on. */
+function SchemaLayer({ step = 0, label, children, className }) {
+	const { current } = useSteps();
+	const on = current >= step;
+	return /* @__PURE__ */ jsx("g", {
+		className: [Schema_module_default.layer, className ?? ""].filter(Boolean).join(" "),
+		"data-step": step,
+		"data-label": label,
+		"data-on": on ? "" : void 0,
+		children
+	});
+}
+/** SchemaFrame gives the drawing the whole window width (scrolling sideways if needed) and a caption. */
+function SchemaFrame({ caption, children, className }) {
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
+		className: [Schema_module_default.frame, className ?? ""].filter(Boolean).join(" "),
+		children
+	}), caption ? /* @__PURE__ */ jsx(Text, {
+		variant: "body-m",
+		tone: "secondary",
+		align: "center",
+		wrap: "pretty",
+		className: Schema_module_default.caption,
+		children: caption
+	}) : null] });
+}
+/** SchemaVoice is the live region that reads the label of the lit layer. */
+function SchemaVoice({ labels }) {
+	const { current } = useSteps();
+	const text = Number.isFinite(current) ? labels[Math.min(current, labels.length - 1)] : "";
+	return /* @__PURE__ */ jsx("p", {
+		className: Schema_module_default.voice,
+		"aria-live": "polite",
+		children: text
+	});
+}
+//#endregion
+export { Schema, SchemaFrame, SchemaLayer, SchemaVoice, schema };

package/dist/components/organisms/Schema/Schema.module.js

@@ -0,0 +1,87 @@
+//#region src/components/organisms/Schema/Schema.module.css
+var frame = "_frame_qkt9g_4";
+var caption = "_caption_qkt9g_14";
+var schema = "_schema_qkt9g_20";
+var layer = "_layer_qkt9g_29";
+var guided = "_guided_qkt9g_33";
+var voice = "_voice_qkt9g_42";
+var node = "_node_qkt9g_52";
+var highlighted = "_highlighted_qkt9g_53";
+var note = "_note_qkt9g_54";
+var pill = "_pill_qkt9g_55";
+var inverse = "_inverse_qkt9g_56";
+var dot = "_dot_qkt9g_57";
+var arc = "_arc_qkt9g_58";
+var icon = "_icon_qkt9g_59";
+var iconBox = "_iconBox_qkt9g_60";
+var iconFill = "_iconFill_qkt9g_61";
+var line = "_line_qkt9g_64";
+var lineStrong = "_lineStrong_qkt9g_65";
+var lineDashed = "_lineDashed_qkt9g_66";
+var arrowhead = "_arrowhead_qkt9g_67";
+var arrowheadFill = "_arrowheadFill_qkt9g_68";
+var series = "_series_qkt9g_71";
+var seriesDashed = "_seriesDashed_qkt9g_72";
+var accent = "_accent_qkt9g_73";
+var accentThin = "_accentThin_qkt9g_74";
+var accentDashed = "_accentDashed_qkt9g_75";
+var accentDotted = "_accentDotted_qkt9g_76";
+var accentDot = "_accentDot_qkt9g_76";
+var title = "_title_qkt9g_80";
+var nodeText = "_nodeText_qkt9g_81";
+var nodeSub = "_nodeSub_qkt9g_82";
+var circleText = "_circleText_qkt9g_83";
+var pillText = "_pillText_qkt9g_84";
+var inverseText = "_inverseText_qkt9g_85";
+var noteText = "_noteText_qkt9g_86";
+var label = "_label_qkt9g_87";
+var coreTitle = "_coreTitle_qkt9g_88";
+var coreSub = "_coreSub_qkt9g_89";
+var micro = "_micro_qkt9g_90";
+var sideText = "_sideText_qkt9g_91";
+var data = "_data_qkt9g_94";
+var Schema_module_default = {
+	frame,
+	caption,
+	schema,
+	layer,
+	guided,
+	voice,
+	node,
+	highlighted,
+	note,
+	pill,
+	inverse,
+	dot,
+	arc,
+	icon,
+	iconBox,
+	iconFill,
+	line,
+	lineStrong,
+	lineDashed,
+	arrowhead,
+	arrowheadFill,
+	series,
+	seriesDashed,
+	accent,
+	accentThin,
+	accentDashed,
+	accentDotted,
+	accentDot,
+	title,
+	nodeText,
+	nodeSub,
+	circleText,
+	pillText,
+	inverseText,
+	noteText,
+	label,
+	coreTitle,
+	coreSub,
+	micro,
+	sideText,
+	data
+};
+//#endregion
+export { accent, accentDashed, accentDot, accentDotted, accentThin, arc, arrowhead, arrowheadFill, caption, circleText, coreSub, coreTitle, data, Schema_module_default as default, dot, frame, guided, highlighted, icon, iconBox, iconFill, inverse, inverseText, label, layer, line, lineDashed, lineStrong, micro, node, nodeSub, nodeText, note, noteText, pill, pillText, schema, series, seriesDashed, sideText, title, voice };

package/dist/components/organisms/Schema/index.d.ts

@@ -0,0 +1,2 @@
+export { Schema, SchemaFrame, SchemaLayer, SchemaVoice, schema } from './Schema';
+export type { SchemaFrameProps, SchemaLayerProps, SchemaProps } from './types';

package/dist/components/organisms/Schema/types.d.ts

@@ -0,0 +1,32 @@
+import type { ComponentPropsWithoutRef, ReactNode } from 'react';
+export type SchemaProps = {
+    /** The drawing coordinates ("0 0 2560 820"). */
+    viewBox: string;
+    /** The accessible title: what the drawing is, in words. */
+    title: string;
+    /** The accessible description: what the drawing says, in words. */
+    description?: string;
+    /** Data schemas: every text one step bigger. */
+    data?: boolean;
+    /** Guided: layers light up with the surrounding Steps; the rest dims to 18 %. */
+    guided?: boolean;
+    /** The layers and shapes. */
+    children: ReactNode;
+    className?: string;
+} & Omit<ComponentPropsWithoutRef<'svg'>, 'viewBox' | 'children' | 'className'>;
+export type SchemaLayerProps = {
+    /** The step from which this layer is lit (inside a Steps). */
+    step?: number;
+    /** What this layer says, for the live region. */
+    label?: string;
+    /** The shapes of the layer. */
+    children: ReactNode;
+    className?: string;
+};
+export type SchemaFrameProps = {
+    /** The caption under the drawing, at half the grid. */
+    caption?: ReactNode;
+    /** The Schema to frame: it takes the full window width, with sideways scroll if it does not fit. */
+    children: ReactNode;
+    className?: string;
+};

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

@@ -0,0 +1,6 @@
+import type { ShareProps } from './types';
+/**
+ * Share is a whole split into its parts: one bar at 100 %, its segments growing from the left
+ * when it comes into view (or its Step lights up), and a legend with each part's percentage.
+ */
+export declare function Share({ segments, label, title, decimals, className }: ShareProps): import("react").JSX.Element;

package/dist/components/organisms/Share/Share.js

@@ -0,0 +1,68 @@
+import { useReveal } from "../../../hooks/useReveal.js";
+import { Text } from "../../atoms/Text/Text.js";
+import Share_module_default from "./Share.module.js";
+import { SHARE_DEFAULTS } from "./types.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMemo, useRef } from "react";
+//#region src/components/organisms/Share/Share.tsx
+/**
+* Share is a whole split into its parts: one bar at 100 %, its segments growing from the left
+* when it comes into view (or its Step lights up), and a legend with each part's percentage.
+*/
+function Share({ segments, label, title, decimals = SHARE_DEFAULTS.decimals, className }) {
+	const ref = useRef(null);
+	const on = useReveal(ref);
+	const total = segments.reduce((sum, s) => sum + s.value, 0);
+	const format = useMemo(() => new Intl.NumberFormat("es-ES", {
+		minimumFractionDigits: decimals,
+		maximumFractionDigits: decimals
+	}), [decimals]);
+	const share = (v) => total > 0 ? v / total * 100 : 0;
+	return /* @__PURE__ */ jsxs("div", {
+		ref,
+		className: [Share_module_default.share, className ?? ""].filter(Boolean).join(" "),
+		children: [
+			title ? /* @__PURE__ */ jsx(Text, {
+				variant: "body-s-bold",
+				children: title
+			}) : null,
+			/* @__PURE__ */ jsx("div", {
+				className: Share_module_default.bar,
+				"aria-hidden": "true",
+				children: segments.map((s, i) => /* @__PURE__ */ jsx("span", {
+					className: [Share_module_default.segment, Share_module_default[`tone-${s.tone ?? (i === 0 ? "ink" : "context")}`]].join(" "),
+					style: {
+						inlineSize: on ? `calc(${share(s.value)}% - ${(segments.length - 1) * 2 / segments.length}px)` : 0,
+						transitionDelay: on ? `${i * 100}ms` : "0ms"
+					}
+				}, i))
+			}),
+			/* @__PURE__ */ jsx("ul", {
+				className: Share_module_default.legend,
+				"aria-label": label,
+				children: segments.map((s, i) => /* @__PURE__ */ jsxs("li", {
+					className: Share_module_default.item,
+					children: [
+						/* @__PURE__ */ jsx("span", {
+							className: [Share_module_default.swatch, Share_module_default[`tone-${s.tone ?? (i === 0 ? "ink" : "context")}`]].join(" "),
+							"aria-hidden": "true"
+						}),
+						/* @__PURE__ */ jsx(Text, {
+							as: "span",
+							variant: "body-s",
+							children: s.label
+						}),
+						/* @__PURE__ */ jsx(Text, {
+							as: "span",
+							variant: "body-s-bold",
+							className: Share_module_default.percent,
+							children: `${format.format(share(s.value))} %`
+						})
+					]
+				}, i))
+			})
+		]
+	});
+}
+//#endregion
+export { Share };

package/dist/components/organisms/Share/Share.module.js

@@ -0,0 +1,22 @@
+//#region src/components/organisms/Share/Share.module.css
+var share = "_share_nsb7q_3";
+var bar = "_bar_nsb7q_9";
+var segment = "_segment_nsb7q_15";
+var legend = "_legend_nsb7q_32";
+var item = "_item_nsb7q_41";
+var swatch = "_swatch_nsb7q_47";
+var percent = "_percent_nsb7q_53";
+var Share_module_default = {
+	share,
+	bar,
+	segment,
+	"tone-ink": "_tone-ink_nsb7q_20",
+	"tone-context": "_tone-context_nsb7q_24",
+	"tone-accent": "_tone-accent_nsb7q_28",
+	legend,
+	item,
+	swatch,
+	percent
+};
+//#endregion
+export { bar, Share_module_default as default, item, legend, percent, segment, share, swatch };

package/dist/components/organisms/Share/index.d.ts

@@ -0,0 +1,3 @@
+export { Share } from './Share';
+export { SHARE_DEFAULTS } from './types';
+export type { ShareProps, ShareSegment } from './types';

package/dist/components/organisms/Share/types.d.ts

@@ -0,0 +1,24 @@
+import type { ReactNode } from 'react';
+import type { BarTone } from '../Bars';
+export type ShareSegment = {
+    /** What this part is ("España", "Fuera de España"). */
+    label: ReactNode;
+    /** Its amount. The parts are turned into percentages of their sum. */
+    value: number;
+    /** ink: the part that tells the story. context: the rest. accent: the one part that matters. */
+    tone?: BarTone;
+};
+export type ShareProps = {
+    /** The parts of the whole, in order from the left. Two to four. */
+    segments: ShareSegment[];
+    /** Accessible name ("Reparto de suscriptores"). */
+    label: string;
+    /** Optional name above the bar, in body-s-bold. */
+    title?: ReactNode;
+    /** Decimals of the percentages in the legend. */
+    decimals?: number;
+    className?: string;
+};
+export declare const SHARE_DEFAULTS: {
+    readonly decimals: 0;
+};

package/dist/components/organisms/Share/types.js

@@ -0,0 +1,4 @@
+//#region src/components/organisms/Share/types.ts
+var SHARE_DEFAULTS = { decimals: 0 };
+//#endregion
+export { SHARE_DEFAULTS };

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

@@ -0,0 +1,2 @@
+import type { SheetProps } from './types';
+export declare function Sheet({ open, kicker, title, description, children, className }: SheetProps): import("react").JSX.Element;