@fiestaboard/ui 1.6.5 → 1.7.0

package/dist/components/plugin/board-showcase.d.ts

@@ -0,0 +1,24 @@
+import { type BoardPreviewEntry, type PreviewShapeLabels } from "../../lib/board-previews";
+export interface BoardShowcaseLabels extends PreviewShapeLabels {
+    /** Accessible name for the shape tab list. */
+    boardShape: string;
+    /** Accessible name for the board-colour group. */
+    boardColor: string;
+    blackBoard: string;
+    whiteBoard: string;
+}
+export declare const DEFAULT_SHOWCASE_LABELS: BoardShowcaseLabels;
+export interface BoardShowcaseProps {
+    /** Literal boards to show; the first is the default tab. */
+    previews: BoardPreviewEntry[];
+    /** Accessible description of the board, e.g. "Weather on a split-flap board". */
+    previewLabel?: string;
+    size?: "sm" | "md" | "lg";
+    /** Controlled board colour. Leave unset to let the showcase own it. */
+    boardType?: "black" | "white";
+    defaultBoardType?: "black" | "white";
+    onBoardTypeChange?: (boardType: "black" | "white") => void;
+    labels?: Partial<BoardShowcaseLabels>;
+    className?: string;
+}
+export declare function BoardShowcase({ previews, previewLabel, size, boardType, defaultBoardType, onBoardTypeChange, labels, className, }: BoardShowcaseProps): import("react").JSX.Element | null;

package/dist/components/plugin/board-showcase.js

@@ -0,0 +1,73 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { Tabs as t, TabsContent as n, TabsList as r, TabsTrigger as i } from "../ui/tabs.js";
+import { StaticBoardDisplay as a } from "../board/static-board-display.js";
+import { DEFAULT_SHAPE_LABELS as o, previewLabels as s, previewMessage as c } from "../../lib/board-previews.js";
+import { useState as l } from "react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region src/components/plugin/board-showcase.tsx
+var f = {
+	...o,
+	boardShape: "Board shape",
+	boardColor: "Board color",
+	blackBoard: "Black Board",
+	whiteBoard: "White Board"
+}, p = "rounded-full border px-4 py-1.5 text-xs font-medium transition-colors data-[active]:border-brand-emphasis data-[active]:bg-brand-emphasis data-[active]:text-brand-foreground data-[active]:font-semibold hover:border-brand hover:text-brand data-[active]:hover:text-brand-foreground";
+function m({ previews: o, previewLabel: m, size: h = "md", boardType: g, defaultBoardType: _ = "black", onBoardTypeChange: v, labels: y, className: b }) {
+	let x = {
+		...f,
+		...y
+	}, [S, C] = l(_), w = g ?? S;
+	function T(e) {
+		g === void 0 && C(e), v?.(e);
+	}
+	if (o.length === 0) return null;
+	let E = s(o, x);
+	return /* @__PURE__ */ d("div", {
+		"data-slot": "board-showcase",
+		className: e("flex flex-col items-center gap-4", b),
+		children: [/* @__PURE__ */ d(t, {
+			defaultValue: 0,
+			className: "flex w-full flex-col items-center gap-4",
+			children: [o.length > 1 && /* @__PURE__ */ u(r, {
+				"aria-label": x.boardShape,
+				className: "h-auto gap-2 rounded-full bg-transparent p-0",
+				children: E.map((e, t) => /* @__PURE__ */ u(i, {
+					value: t,
+					className: p,
+					children: e
+				}, e))
+			}), o.map((e, t) => /* @__PURE__ */ u(n, {
+				value: t,
+				className: "mt-0 flex w-full justify-center overflow-x-auto rounded-xl bg-muted/40 px-4 py-6 shadow-card",
+				children: /* @__PURE__ */ u(a, {
+					message: c(e),
+					size: h,
+					boardType: w,
+					deviceType: e.device_type ?? "flagship",
+					notesWide: e.notes_wide ?? 1,
+					notesTall: e.notes_tall ?? 1,
+					previewLabel: m
+				})
+			}, E[t]))]
+		}), /* @__PURE__ */ u("div", {
+			role: "group",
+			"aria-label": x.boardColor,
+			className: "flex",
+			children: ["black", "white"].map((t) => {
+				let n = w === t;
+				return /* @__PURE__ */ u("button", {
+					type: "button",
+					"aria-pressed": n,
+					onClick: () => T(t),
+					className: e("border px-4 py-1.5 text-xs font-medium transition-colors", "first:rounded-l-full last:rounded-r-full [&:not(:last-child)]:border-r-0", "outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50", n ? "border-brand-emphasis bg-brand-emphasis font-semibold text-brand-foreground" : "text-muted-foreground hover:border-brand hover:text-brand"),
+					children: t === "black" ? x.blackBoard : x.whiteBoard
+				}, t);
+			})
+		})]
+	});
+}
+//#endregion
+export { m as BoardShowcase, f as DEFAULT_SHOWCASE_LABELS };
+
+//# sourceMappingURL=board-showcase.js.map

package/dist/components/plugin/board-showcase.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"board-showcase.js","names":[],"sources":["../../../src/components/plugin/board-showcase.tsx"],"mappings":";;;;;;;;AAiCA,IAAa,IAA+C;CAC1D,GAAG;CACH,YAAY;CACZ,YAAY;CACZ,YAAY;CACZ,YAAY;AACd,GAoBM,IACJ;AAIF,SAAgB,EAAc,EAC5B,aACA,iBACA,UAAO,MACP,cACA,sBAAmB,SACnB,sBACA,WACA,gBACqB;CACrB,IAAM,IAAI;EAAE,GAAG;EAAyB,GAAG;CAAO,GAC5C,CAAC,GAAuB,KAA4B,EAA4B,CAAgB,GAChG,IAAkB,KAAa;CAErC,SAAS,EAAgB,GAAyB;EAEhD,AADI,MAAc,KAAA,KAAW,EAAyB,CAAI,GAC1D,IAAoB,CAAI;CAC1B;CAEA,IAAI,EAAS,WAAW,GAAG,OAAO;CAElC,IAAM,IAAY,EAAc,GAAU,CAAC;CAE3C,OACE,kBAAC,OAAD;EAAK,aAAU;EAAiB,WAAW,EAAG,oCAAoC,CAAS;EAA3F,UAAA,CACE,kBAAC,GAAD;GAAM,cAAc;GAAG,WAAU;GAAjC,UAAA,CACG,EAAS,SAAS,KACjB,kBAAC,GAAD;IAAU,cAAY,EAAE;IAAY,WAAU;IAC3C,UAAA,EAAU,KAAK,GAAO,MACrB,kBAAC,GAAD;KAAyB,OAAO;KAAO,WAAW;KAC/C,UAAA;IACU,GAFK,CAEL,CACd;GACO,CAAA,GAGX,EAAS,KAAK,GAAS,MACtB,kBAAC,GAAD;IAEE,OAAO;IACP,WAAU;IAEV,UAAA,kBAAC,GAAD;KACE,SAAS,EAAe,CAAO;KACzB;KACN,WAAW;KACX,YAAY,EAAQ,eAAe;KACnC,WAAW,EAAQ,cAAc;KACjC,WAAW,EAAQ,cAAc;KACnB;IACf,CAAA;GACU,GAbN,EAAU,EAaJ,CACd,CACG;EAEN,CAAA,GAAA,kBAAC,OAAD;GAAK,MAAK;GAAQ,cAAY,EAAE;GAAY,WAAU;GAClD,UAAA,CAAC,SAAS,OAAO,CAAC,CAAW,KAAK,MAAU;IAC5C,IAAM,IAAS,MAAoB;IACnC,OACE,kBAAC,UAAD;KAEE,MAAK;KACL,gBAAc;KACd,eAAe,EAAgB,CAAK;KACpC,WAAW,EACT,4DACA,4EACA,oEACA,IACI,gFACA,2DACN;KAEC,UAAA,MAAU,UAAU,EAAE,aAAa,EAAE;IAChC,GAdD,CAcC;GAEZ,CAAC;EACE,CAAA,CACF;;AAET"}

package/dist/components/plugin/plugin-card.d.ts

@@ -0,0 +1,40 @@
+/**
+ * Directory card for a plugin: name, category, description, author, and a
+ * split-flap teaser strip showing what the plugin actually puts on a board.
+ *
+ * Presentational — routing and localization stay with the consumer. The
+ * primary link is supplied through `renderLink` because the two consumers use
+ * different routers (Docusaurus `Link`, the app's `smart-link`); the card
+ * stretches it over the whole surface so the `action` slot can hold a button
+ * without nesting one interactive element inside another.
+ */
+import type { CSSProperties, ReactNode } from "react";
+export interface PluginCardProps {
+    name: string;
+    description?: ReactNode;
+    /**
+     * Pre-formatted attribution, e.g. `"by FiestaBoard Team"` — the wording is a
+     * localized string, so the consumer builds it.
+     */
+    authorLabel?: ReactNode;
+    /** Manifest category id, e.g. `"weather"`. Omit to hide the badge. */
+    category?: string;
+    /** Localized category name. */
+    categoryLabel?: string;
+    /** Literal board line, at most 15 tiles. Omit to hide the teaser footer. */
+    teaser?: string;
+    boardType?: "black" | "white";
+    /**
+     * Renders the card's primary link. Receives the class that stretches it over
+     * the card, and the card title as children.
+     */
+    renderLink: (props: {
+        className: string;
+        children: ReactNode;
+    }) => ReactNode;
+    /** Trailing action, e.g. an Install button. Rendered above the stretched link. */
+    action?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+}
+export declare function PluginCard({ name, description, authorLabel, category, categoryLabel, teaser, boardType, renderLink, action, className, style, }: PluginCardProps): import("react").JSX.Element;

package/dist/components/plugin/plugin-card.js

@@ -0,0 +1,65 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { Heading as t } from "../ui/heading.js";
+import { Text as n } from "../ui/text.js";
+import { PluginCategoryBadge as r } from "./plugin-category-badge.js";
+import { ScaledBoardTeaser as i } from "./scaled-board-teaser.js";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region src/components/plugin/plugin-card.tsx
+var s = "after:absolute after:inset-0 after:rounded-xl after:content-[''] outline-none focus-visible:after:ring-[3px] focus-visible:after:ring-ring/50 text-foreground no-underline hover:no-underline hover:text-foreground";
+function c({ name: c, description: l, authorLabel: u, category: d, categoryLabel: f, teaser: p, boardType: m = "black", renderLink: h, action: g, className: _, style: v }) {
+	return /* @__PURE__ */ o("div", {
+		"data-slot": "plugin-card",
+		style: v,
+		className: e("group relative flex h-full flex-col overflow-hidden rounded-xl border bg-card text-card-foreground", "shadow-card transition-[transform,box-shadow] duration-200 hover:-translate-y-1 hover:shadow-lg", "motion-reduce:transition-none motion-reduce:hover:translate-y-0", _),
+		children: [/* @__PURE__ */ o("div", {
+			className: "flex flex-1 flex-col gap-2 p-4",
+			children: [
+				/* @__PURE__ */ o("div", {
+					className: "flex flex-wrap items-center gap-2",
+					children: [/* @__PURE__ */ a(t, {
+						level: 3,
+						className: "min-w-0 text-base",
+						children: h({
+							className: s,
+							children: c
+						})
+					}), d && /* @__PURE__ */ a(r, {
+						category: d,
+						label: f,
+						className: "ml-auto"
+					})]
+				}),
+				l && /* @__PURE__ */ a(n, {
+					tone: "muted",
+					size: "sm",
+					className: "line-clamp-3 flex-1 leading-relaxed",
+					children: l
+				}),
+				/* @__PURE__ */ o("div", {
+					className: "mt-auto flex items-center justify-between gap-2 pt-1",
+					children: [u ? /* @__PURE__ */ a(n, {
+						as: "span",
+						tone: "muted",
+						size: "xs",
+						className: "truncate",
+						children: u
+					}) : /* @__PURE__ */ a("span", {}), g && /* @__PURE__ */ a("div", {
+						className: "relative z-10 shrink-0",
+						children: g
+					})]
+				})
+			]
+		}), p && /* @__PURE__ */ a("div", {
+			className: "border-t bg-muted/30 px-3 py-4",
+			children: /* @__PURE__ */ a(i, {
+				teaser: p,
+				boardType: m
+			})
+		})]
+	});
+}
+//#endregion
+export { c as PluginCard };
+
+//# sourceMappingURL=plugin-card.js.map

package/dist/components/plugin/plugin-card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"plugin-card.js","names":[],"sources":["../../../src/components/plugin/plugin-card.tsx"],"mappings":";;;;;;;;AAsBA,IAAM,IACJ;AA8BF,SAAgB,EAAW,EACzB,SACA,gBACA,gBACA,aACA,kBACA,WACA,eAAY,SACZ,eACA,WACA,cACA,YACkB;CAClB,OACE,kBAAC,OAAD;EACE,aAAU;EACH;EACP,WAAW,EACT,sGACA,mGACA,mEACA,CACF;EARF,UAAA,CAUE,kBAAC,OAAD;GAAK,WAAU;GAAf,UAAA;IACE,kBAAC,OAAD;KAAK,WAAU;KAAf,UAAA,CACE,kBAAC,GAAD;MAAS,OAAO;MAAG,WAAU;MAC1B,UAAA,EAAW;OAAE,WAAW;OAAsB,UAAU;MAAK,CAAC;KACxD,CAAA,GACR,KAAY,kBAAC,GAAD;MAA+B;MAAU,OAAO;MAAe,WAAU;KAAW,CAAA,CAC9F;;IAEJ,KACC,kBAAC,GAAD;KAAM,MAAK;KAAQ,MAAK;KAAK,WAAU;KACpC,UAAA;IACG,CAAA;IAGR,kBAAC,OAAD;KAAK,WAAU;KAAf,UAAA,CACG,IACC,kBAAC,GAAD;MAAM,IAAG;MAAO,MAAK;MAAQ,MAAK;MAAK,WAAU;MAC9C,UAAA;KACG,CAAA,IAEN,kBAAC,QAAD,CAAO,CAAA,GAER,KAAU,kBAAC,OAAD;MAAK,WAAU;MAA0B,UAAA;KAAY,CAAA,CAC7D;;GACF;EAEJ,CAAA,GAAA,KACC,kBAAC,OAAD;GAAK,WAAU;GACb,UAAA,kBAAC,GAAD;IAA2B;IAAmB;GAAY,CAAA;EACvD,CAAA,CAEJ;;AAET"}

package/dist/components/plugin/plugin-category-badge.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Category badge for a plugin. One hue per category, defined once here so a
+ * plugin reads the same colour in the FiestaBoard marketplace and in the docs
+ * plugin directory. Unknown categories fall back to the neutral badge.
+ */
+/** The categories FiestaBoard plugins may declare (manifest `category`). */
+export declare const PLUGIN_CATEGORIES: readonly ["art", "data", "entertainment", "home", "transit", "utility", "weather"];
+export type PluginCategory = (typeof PLUGIN_CATEGORIES)[number];
+export interface PluginCategoryBadgeProps {
+    /** Manifest category id, e.g. `"weather"`. */
+    category: string;
+    /** Localized display name. Defaults to the raw category id. */
+    label?: string;
+    className?: string;
+}
+export declare function PluginCategoryBadge({ category, label, className }: PluginCategoryBadgeProps): import("react").JSX.Element;

package/dist/components/plugin/plugin-category-badge.js

@@ -0,0 +1,37 @@
+import { cn as e } from "../../lib/utils.js";
+import { Badge as t } from "../ui/badge.js";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/plugin/plugin-category-badge.tsx
+var r = [
+	"art",
+	"data",
+	"entertainment",
+	"home",
+	"transit",
+	"utility",
+	"weather"
+], i = {
+	art: "bg-category-art/15 border-category-art/30 text-category-art-foreground",
+	data: "bg-category-data/15 border-category-data/30 text-category-data-foreground",
+	entertainment: "bg-category-entertainment/15 border-category-entertainment/30 text-category-entertainment-foreground",
+	home: "bg-category-home/15 border-category-home/30 text-category-home-foreground",
+	transit: "bg-category-transit/15 border-category-transit/30 text-category-transit-foreground",
+	utility: "bg-category-utility/15 border-category-utility/30 text-category-utility-foreground",
+	weather: "bg-category-weather/15 border-category-weather/30 text-category-weather-foreground"
+};
+function a(e) {
+	return e in i;
+}
+function o({ category: r, label: o, className: s }) {
+	let c = a(r) ? i[r] : "";
+	return /* @__PURE__ */ n(t, {
+		variant: a(r) ? "outline" : "secondary",
+		"data-category": r,
+		className: e("text-[0.68rem] font-semibold uppercase tracking-wide px-2 py-0.5", c, s),
+		children: o ?? r
+	});
+}
+//#endregion
+export { r as PLUGIN_CATEGORIES, o as PluginCategoryBadge };
+
+//# sourceMappingURL=plugin-category-badge.js.map

package/dist/components/plugin/plugin-category-badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"plugin-category-badge.js","names":[],"sources":["../../../src/components/plugin/plugin-category-badge.tsx"],"mappings":";;;;AAUA,IAAa,IAAoB;CAAC;CAAO;CAAQ;CAAiB;CAAQ;CAAW;CAAW;AAAS,GAQnG,IAAmD;CACvD,KAAK;CACL,MAAM;CACN,eAAe;CACf,MAAM;CACN,SAAS;CACT,SAAS;CACT,SAAS;AACX;AAEA,SAAS,EAAgB,GAA8C;CACrE,OAAO,KAAY;AACrB;AAUA,SAAgB,EAAoB,EAAE,aAAU,UAAO,gBAAuC;CAC5F,IAAM,IAAO,EAAgB,CAAQ,IAAI,EAAiB,KAAY;CACtE,OACE,kBAAC,GAAD;EACE,SAAS,EAAgB,CAAQ,IAAI,YAAY;EACjD,iBAAe;EACf,WAAW,EAAG,oEAAoE,GAAM,CAAS;EAEhG,UAAA,KAAS;CACL,CAAA;AAEX"}

package/dist/components/plugin/scaled-board-teaser.d.ts

@@ -0,0 +1,11 @@
+export interface ScaledBoardTeaserProps {
+    /** Literal board line, e.g. `"{66}AQI 45 CLEAR"`. */
+    teaser: string;
+    boardType?: "black" | "white";
+    /** Strip width in tiles. */
+    tiles?: number;
+    minScale?: number;
+    maxScale?: number;
+    className?: string;
+}
+export declare function ScaledBoardTeaser({ teaser, boardType, tiles, minScale, maxScale, className, }: ScaledBoardTeaserProps): import("react").JSX.Element;

package/dist/components/plugin/scaled-board-teaser.js

@@ -0,0 +1,40 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { BoardTeaser as t } from "../board/board-teaser.js";
+import { useEffect as n, useRef as r, useState as i } from "react";
+import { jsx as a } from "react/jsx-runtime";
+//#region src/components/plugin/scaled-board-teaser.tsx
+var o = 18;
+function s({ teaser: s, boardType: c = "black", tiles: l = 15, minScale: u = .85, maxScale: d = 1.5, className: f }) {
+	let p = r(null), [m, h] = i(1);
+	return n(() => {
+		let e = p.current, t = e?.firstElementChild;
+		if (!e || !t) return;
+		let n = () => {
+			t.offsetWidth > 0 && h(Math.min(d, Math.max(u, e.clientWidth / t.offsetWidth)));
+		};
+		n();
+		let r = new ResizeObserver(n);
+		return r.observe(e), () => r.disconnect();
+	}, [u, d]), /* @__PURE__ */ a("div", {
+		ref: p,
+		"data-slot": "scaled-board-teaser",
+		className: e("flex justify-center overflow-hidden", f),
+		style: { height: `${o * m}px` },
+		children: /* @__PURE__ */ a("div", {
+			style: {
+				transform: `scale(${m})`,
+				transformOrigin: "top center"
+			},
+			children: /* @__PURE__ */ a(t, {
+				teaser: s,
+				tiles: l,
+				boardType: c
+			})
+		})
+	});
+}
+//#endregion
+export { s as ScaledBoardTeaser };
+
+//# sourceMappingURL=scaled-board-teaser.js.map

package/dist/components/plugin/scaled-board-teaser.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scaled-board-teaser.js","names":[],"sources":["../../../src/components/plugin/scaled-board-teaser.tsx"],"mappings":";;;;;;AAgBA,IAAM,IAAe;AAarB,SAAgB,EAAkB,EAChC,WACA,eAAY,SACZ,WAAQ,IACR,cAAW,KACX,cAAW,KACX,gBACyB;CACzB,IAAM,IAAe,EAAuB,IAAI,GAC1C,CAAC,GAAO,KAAY,EAAS,CAAC;CAkBpC,OAhBA,QAAgB;EACd,IAAM,IAAY,EAAa,SACzB,IAAQ,GAAW;EACzB,IAAI,CAAC,KAAa,CAAC,GAAO;EAC1B,IAAM,UAAgB;GAEpB,AAAI,EAAM,cAAc,KACtB,EAAS,KAAK,IAAI,GAAU,KAAK,IAAI,GAAU,EAAU,cAAc,EAAM,WAAW,CAAC,CAAC;EAE9F;EACA,EAAQ;EACR,IAAM,IAAW,IAAI,eAAe,CAAO;EAE3C,OADA,EAAS,QAAQ,CAAS,SACb,EAAS,WAAW;CACnC,GAAG,CAAC,GAAU,CAAQ,CAAC,GAGrB,kBAAC,OAAD;EACE,KAAK;EACL,aAAU;EACV,WAAW,EAAG,uCAAuC,CAAS;EAC9D,OAAO,EAAE,QAAQ,GAAG,IAAe,EAAM,IAAI;EAE7C,UAAA,kBAAC,OAAD;GAAK,OAAO;IAAE,WAAW,SAAS,EAAM;IAAI,iBAAiB;GAAa;GACxE,UAAA,kBAAC,GAAD;IAAqB;IAAe;IAAkB;GAAY,CAAA;EAC/D,CAAA;CACF,CAAA;AAET"}

package/dist/index.d.ts

@@ -64,3 +64,8 @@ export * from "./components/board/static-board-display";
 export * from "./lib/board-characters";
 export * from "./lib/board-colors";
 export * from "./lib/board-dimensions";
+export * from "./lib/board-previews";
+export * from "./components/plugin/board-showcase";
+export * from "./components/plugin/plugin-card";
+export * from "./components/plugin/plugin-category-badge";
+export * from "./components/plugin/scaled-board-teaser";

package/dist/index.js

@@ -56,4 +56,9 @@ import { BoardDisplay as un } from "./components/board/board-display.js";
 import { BoardTeaser as dn } from "./components/board/board-teaser.js";
 import { ScaledBoardDisplay as fn } from "./components/board/scaled-board-display.js";
 import { StaticBoardDisplay as pn } from "./components/board/static-board-display.js";
-export { Bt as ALL_COLOR_CODES, Vt as AVAILABLE_COLORS, t as Accordion, n as AccordionContent, r as AccordionItem, i as AccordionTrigger, a as Alert, o as AlertDescription, u as AlertDialog, d as AlertDialogAction, f as AlertDialogCancel, p as AlertDialogContent, m as AlertDialogDescription, h as AlertDialogFooter, g as AlertDialogHeader, _ as AlertDialogOverlay, v as AlertDialogPortal, y as AlertDialogTitle, b as AlertDialogTrigger, s as AlertTitle, x as Aurora, Jt as BOARD_CHARS, Ht as BOARD_COLORS, S as Badge, un as BoardDisplay, pt as BoardIcon, mt as BoardSelector, dn as BoardTeaser, w as Box, c as Button, Ut as COLOR_CODE_MAP, Wt as COLOR_DISPLAY, T as Card, E as CardAction, D as CardContent, O as CardDescription, k as CardFooter, A as CardHeader, j as CardTitle, M as Checkbox, N as Code, P as Collapsible, F as CollapsibleContent, I as CollapsibleTrigger, nn as DEVICE_DIMENSIONS, be as DecryptedText, L as Dialog, R as DialogClose, z as DialogContent, B as DialogDescription, V as DialogFooter, H as DialogHeader, U as DialogOverlay, W as DialogPortal, G as DialogTitle, K as DialogTrigger, q as DropdownMenu, J as DropdownMenuCheckboxItem, Y as DropdownMenuContent, X as DropdownMenuGroup, Z as DropdownMenuItem, Q as DropdownMenuLabel, $ as DropdownMenuPortal, ee as DropdownMenuRadioGroup, te as DropdownMenuRadioItem, ne as DropdownMenuSeparator, re as DropdownMenuShortcut, ie as DropdownMenuSub, ae as DropdownMenuSubContent, oe as DropdownMenuSubTrigger, se as DropdownMenuTrigger, Yt as EXTRA_CHARS, ce as EmptyState, ht as FIESTA_ICON_DATA_URI, gt as FIESTA_ICON_PALETTE, _t as FIESTA_ICON_SVG, xe as FadeContent, vt as FiestaIcon, yt as FiestaLogo, le as Flex, de as Grid, jt as HIDE_FESTIVE_COOKIE, pe as Heading, he as Input, ge as Label, bt as LanguageSelector, _e as List, ve as ListItem, rn as MAX_NOTES_PER_AXIS, xt as MainContent, an as NOTE_COLS, on as NOTE_ROWS, Mt as PRIDE_SEASON, St as PageHeader, Ct as PageIconGradientDefs, wt as PageLayout, Tt as PageToolbar, Nt as SEASONS, fn as ScaledBoardDisplay, Se as ScrollArea, Ce as ScrollBar, we as Select, Te as SelectContent, Ee as SelectGroup, De as SelectItem, Oe as SelectLabel, ke as SelectScrollDownButton, Ae as SelectScrollUpButton, je as SelectSeparator, Me as SelectTrigger, Ne as SelectValue, Pe as Sheet, Fe as SheetClose, Ie as SheetContent, Le as SheetDescription, Re as SheetFooter, ze as SheetHeader, Be as SheetOverlay, Ve as SheetPortal, He as SheetTitle, Ue as SheetTrigger, Ot as Sidebar, Et as SidebarAurora, Dt as SidebarAuroraHorizontal, We as Skeleton, kt as SkipToContent, Ge as Slider, Ke as Stack, pn as StaticBoardDisplay, Je as Switch, Ye as Table, Xe as TableBody, Ze as TableCell, Qe as TableHead, $e as TableHeader, et as TableRow, tt as Tabs, nt as TabsContent, rt as TabsList, it as TabsTrigger, at as Text, st as TextLink, ct as Textarea, At as ThemeToggle, lt as Tooltip, ut as TooltipContent, dt as TooltipProvider, ft as TooltipTrigger, C as badgeVariants, l as buttonVariants, e as cn, Pt as fireSeasonBurst, ue as flexVariants, Ft as getActiveSeason, Gt as getBoardColor, Xt as getCharFromToken, Zt as getCharIndex, fe as gridVariants, me as headingVariants, Qt as isColorTile, sn as isNoteArray, Kt as isValidBoardColor, ye as listVariants, $t as messageToGrid, cn as noteArrayDimensions, en as parseLine, It as readCookieString, qt as resolveColorCode, ln as resolveDimensions, Lt as shouldShowPride, qe as stackVariants, ot as textVariants, tn as tokensEqual, Rt as useActiveSeason, zt as usePrideActive };
+import { DEFAULT_SHAPE_LABELS as mn, previewLabel as hn, previewLabels as gn, previewMessage as _n } from "./lib/board-previews.js";
+import { BoardShowcase as vn, DEFAULT_SHOWCASE_LABELS as yn } from "./components/plugin/board-showcase.js";
+import { PLUGIN_CATEGORIES as bn, PluginCategoryBadge as xn } from "./components/plugin/plugin-category-badge.js";
+import { ScaledBoardTeaser as Sn } from "./components/plugin/scaled-board-teaser.js";
+import { PluginCard as Cn } from "./components/plugin/plugin-card.js";
+export { Bt as ALL_COLOR_CODES, Vt as AVAILABLE_COLORS, t as Accordion, n as AccordionContent, r as AccordionItem, i as AccordionTrigger, a as Alert, o as AlertDescription, u as AlertDialog, d as AlertDialogAction, f as AlertDialogCancel, p as AlertDialogContent, m as AlertDialogDescription, h as AlertDialogFooter, g as AlertDialogHeader, _ as AlertDialogOverlay, v as AlertDialogPortal, y as AlertDialogTitle, b as AlertDialogTrigger, s as AlertTitle, x as Aurora, Jt as BOARD_CHARS, Ht as BOARD_COLORS, S as Badge, un as BoardDisplay, pt as BoardIcon, mt as BoardSelector, vn as BoardShowcase, dn as BoardTeaser, w as Box, c as Button, Ut as COLOR_CODE_MAP, Wt as COLOR_DISPLAY, T as Card, E as CardAction, D as CardContent, O as CardDescription, k as CardFooter, A as CardHeader, j as CardTitle, M as Checkbox, N as Code, P as Collapsible, F as CollapsibleContent, I as CollapsibleTrigger, mn as DEFAULT_SHAPE_LABELS, yn as DEFAULT_SHOWCASE_LABELS, nn as DEVICE_DIMENSIONS, be as DecryptedText, L as Dialog, R as DialogClose, z as DialogContent, B as DialogDescription, V as DialogFooter, H as DialogHeader, U as DialogOverlay, W as DialogPortal, G as DialogTitle, K as DialogTrigger, q as DropdownMenu, J as DropdownMenuCheckboxItem, Y as DropdownMenuContent, X as DropdownMenuGroup, Z as DropdownMenuItem, Q as DropdownMenuLabel, $ as DropdownMenuPortal, ee as DropdownMenuRadioGroup, te as DropdownMenuRadioItem, ne as DropdownMenuSeparator, re as DropdownMenuShortcut, ie as DropdownMenuSub, ae as DropdownMenuSubContent, oe as DropdownMenuSubTrigger, se as DropdownMenuTrigger, Yt as EXTRA_CHARS, ce as EmptyState, ht as FIESTA_ICON_DATA_URI, gt as FIESTA_ICON_PALETTE, _t as FIESTA_ICON_SVG, xe as FadeContent, vt as FiestaIcon, yt as FiestaLogo, le as Flex, de as Grid, jt as HIDE_FESTIVE_COOKIE, pe as Heading, he as Input, ge as Label, bt as LanguageSelector, _e as List, ve as ListItem, rn as MAX_NOTES_PER_AXIS, xt as MainContent, an as NOTE_COLS, on as NOTE_ROWS, bn as PLUGIN_CATEGORIES, Mt as PRIDE_SEASON, St as PageHeader, Ct as PageIconGradientDefs, wt as PageLayout, Tt as PageToolbar, Cn as PluginCard, xn as PluginCategoryBadge, Nt as SEASONS, fn as ScaledBoardDisplay, Sn as ScaledBoardTeaser, Se as ScrollArea, Ce as ScrollBar, we as Select, Te as SelectContent, Ee as SelectGroup, De as SelectItem, Oe as SelectLabel, ke as SelectScrollDownButton, Ae as SelectScrollUpButton, je as SelectSeparator, Me as SelectTrigger, Ne as SelectValue, Pe as Sheet, Fe as SheetClose, Ie as SheetContent, Le as SheetDescription, Re as SheetFooter, ze as SheetHeader, Be as SheetOverlay, Ve as SheetPortal, He as SheetTitle, Ue as SheetTrigger, Ot as Sidebar, Et as SidebarAurora, Dt as SidebarAuroraHorizontal, We as Skeleton, kt as SkipToContent, Ge as Slider, Ke as Stack, pn as StaticBoardDisplay, Je as Switch, Ye as Table, Xe as TableBody, Ze as TableCell, Qe as TableHead, $e as TableHeader, et as TableRow, tt as Tabs, nt as TabsContent, rt as TabsList, it as TabsTrigger, at as Text, st as TextLink, ct as Textarea, At as ThemeToggle, lt as Tooltip, ut as TooltipContent, dt as TooltipProvider, ft as TooltipTrigger, C as badgeVariants, l as buttonVariants, e as cn, Pt as fireSeasonBurst, ue as flexVariants, Ft as getActiveSeason, Gt as getBoardColor, Xt as getCharFromToken, Zt as getCharIndex, fe as gridVariants, me as headingVariants, Qt as isColorTile, sn as isNoteArray, Kt as isValidBoardColor, ye as listVariants, $t as messageToGrid, cn as noteArrayDimensions, en as parseLine, hn as previewLabel, gn as previewLabels, _n as previewMessage, It as readCookieString, qt as resolveColorCode, ln as resolveDimensions, Lt as shouldShowPride, qe as stackVariants, ot as textVariants, tn as tokensEqual, Rt as useActiveSeason, zt as usePrideActive };

package/dist/lib/board-previews.d.ts

@@ -0,0 +1,38 @@
+/**
+ * Board previews — the `teaser` / `previews` plugin-manifest contract, shared
+ * by every surface that advertises a plugin (the FiestaBoard marketplace, the
+ * docs plugin directory).
+ *
+ * A preview holds *literal* board rows, never `{{variables}}`: widths count
+ * tiles, so a color marker like `{66}` is one tile and an end tag `{/green}` is
+ * none. See FiestaBoard's docs/development/PLUGIN_DEVELOPMENT.md.
+ */
+import type { DeviceType } from "./board-dimensions";
+/** One literal board, at one shape. */
+export interface BoardPreviewEntry {
+    /** Human tab label; when absent, derive one with `previewLabel()`. */
+    label?: string;
+    device_type?: DeviceType;
+    /** Notes wide (note_array only). */
+    notes_wide?: number;
+    /** Notes tall (note_array only). */
+    notes_tall?: number;
+    rows: string[];
+}
+/** Localized shape names. `noteArray` may contain `{w}` and `{h}` placeholders. */
+export interface PreviewShapeLabels {
+    flagship: string;
+    note: string;
+    noteArray: string;
+}
+export declare const DEFAULT_SHAPE_LABELS: PreviewShapeLabels;
+/** Tab label for a preview: its declared label, or one derived from the shape. */
+export declare function previewLabel(preview: BoardPreviewEntry, labels?: PreviewShapeLabels): string;
+/**
+ * Tab labels for a whole preview list, numbering repeats so every tab has a
+ * distinct accessible name — authors may declare several previews of the same
+ * shape ("Flagship" twice).
+ */
+export declare function previewLabels(previews: BoardPreviewEntry[], labels?: PreviewShapeLabels): string[];
+/** The newline-joined message `StaticBoardDisplay` renders. */
+export declare function previewMessage(preview: BoardPreviewEntry): string;

package/dist/lib/board-previews.js

@@ -0,0 +1,23 @@
+//#region src/lib/board-previews.ts
+var e = {
+	flagship: "Flagship",
+	note: "Note",
+	noteArray: "Note Array {w}×{h}"
+};
+function t(t, n = e) {
+	return t.label ? t.label : t.device_type === "note_array" ? n.noteArray.replace("{w}", String(t.notes_wide ?? 1)).replace("{h}", String(t.notes_tall ?? 1)) : t.device_type === "note" ? n.note : n.flagship;
+}
+function n(e, n) {
+	let r = /* @__PURE__ */ new Map();
+	return e.map((e) => {
+		let i = t(e, n), a = r.get(i) ?? 0;
+		return r.set(i, a + 1), a > 0 ? `${i} ${a + 1}` : i;
+	});
+}
+function r(e) {
+	return e.rows.join("\n");
+}
+//#endregion
+export { e as DEFAULT_SHAPE_LABELS, t as previewLabel, n as previewLabels, r as previewMessage };
+
+//# sourceMappingURL=board-previews.js.map

package/dist/lib/board-previews.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"board-previews.js","names":[],"sources":["../../src/lib/board-previews.ts"],"mappings":";AA+BA,IAAa,IAA2C;CACtD,UAAU;CACV,MAAM;CACN,WAAW;AACb;AAGA,SAAgB,EAAa,GAA4B,IAA6B,GAA8B;CAOlH,OANI,EAAQ,QAAc,EAAQ,QAC9B,EAAQ,gBAAgB,eACnB,EAAO,UACX,QAAQ,OAAO,OAAO,EAAQ,cAAc,CAAC,CAAC,CAAC,CAC/C,QAAQ,OAAO,OAAO,EAAQ,cAAc,CAAC,CAAC,IAE5C,EAAQ,gBAAgB,SAAS,EAAO,OAAO,EAAO;AAC/D;AAOA,SAAgB,EAAc,GAA+B,GAAuC;CAClG,IAAM,oBAAO,IAAI,IAAoB;CACrC,OAAO,EAAS,KAAK,MAAY;EAC/B,IAAM,IAAO,EAAa,GAAS,CAAM,GACnC,IAAS,EAAK,IAAI,CAAI,KAAK;EAEjC,OADA,EAAK,IAAI,GAAM,IAAS,CAAC,GAClB,IAAS,IAAI,GAAG,EAAK,GAAG,IAAS,MAAM;CAChD,CAAC;AACH;AAGA,SAAgB,EAAe,GAAoC;CACjE,OAAO,EAAQ,KAAK,KAAK,IAAI;AAC/B"}

package/dist/theme.css

@@ -86,6 +86,23 @@
   --color-tag-formula: var(--tag-formula);
   --color-tag-formula-foreground: var(--tag-formula-foreground);
 
+  /* Plugin category accents (PluginCategoryBadge) — one hue per category so a
+     plugin reads the same on the marketplace and in the docs directory. */
+  --color-category-weather: var(--category-weather);
+  --color-category-weather-foreground: var(--category-weather-foreground);
+  --color-category-transit: var(--category-transit);
+  --color-category-transit-foreground: var(--category-transit-foreground);
+  --color-category-data: var(--category-data);
+  --color-category-data-foreground: var(--category-data-foreground);
+  --color-category-entertainment: var(--category-entertainment);
+  --color-category-entertainment-foreground: var(--category-entertainment-foreground);
+  --color-category-art: var(--category-art);
+  --color-category-art-foreground: var(--category-art-foreground);
+  --color-category-utility: var(--category-utility);
+  --color-category-utility-foreground: var(--category-utility-foreground);
+  --color-category-home: var(--category-home);
+  --color-category-home-foreground: var(--category-home-foreground);
+
   /* Overlay */
   --color-overlay: var(--overlay);
 
@@ -193,6 +210,20 @@
   --tag-success-foreground: oklch(0.35 0.1 160);
   --tag-formula: oklch(0.45 0.15 80);
   --tag-formula-foreground: oklch(0.35 0.1 80);
+  --category-weather: oklch(0.55 0.14 245);
+  --category-weather-foreground: oklch(0.42 0.11 245);
+  --category-transit: oklch(0.55 0.15 145);
+  --category-transit-foreground: oklch(0.42 0.12 145);
+  --category-data: oklch(0.55 0.16 305);
+  --category-data-foreground: oklch(0.42 0.13 305);
+  --category-entertainment: oklch(0.55 0.14 75);
+  --category-entertainment-foreground: oklch(0.42 0.11 75);
+  --category-art: oklch(0.55 0.16 30);
+  --category-art-foreground: oklch(0.42 0.13 30);
+  --category-utility: oklch(0.55 0.03 255);
+  --category-utility-foreground: oklch(0.42 0.03 255);
+  --category-home: oklch(0.55 0.12 180);
+  --category-home-foreground: oklch(0.42 0.1 180);
   --overlay: oklch(0 0 0 / 80%);
   /* Brand accent - darkened for WCAG 2.2 AA (≥4.5:1 on light bg) */
   --brand: oklch(0.56 0.15 75);
@@ -392,6 +423,20 @@
   --tag-success-foreground: oklch(0.85 0.08 160);
   --tag-formula: oklch(0.65 0.15 80);
   --tag-formula-foreground: oklch(0.85 0.08 80);
+  --category-weather: oklch(0.68 0.13 245);
+  --category-weather-foreground: oklch(0.85 0.08 245);
+  --category-transit: oklch(0.68 0.14 145);
+  --category-transit-foreground: oklch(0.85 0.09 145);
+  --category-data: oklch(0.68 0.14 305);
+  --category-data-foreground: oklch(0.85 0.09 305);
+  --category-entertainment: oklch(0.68 0.13 75);
+  --category-entertainment-foreground: oklch(0.85 0.08 75);
+  --category-art: oklch(0.68 0.14 30);
+  --category-art-foreground: oklch(0.85 0.09 30);
+  --category-utility: oklch(0.68 0.03 255);
+  --category-utility-foreground: oklch(0.85 0.02 255);
+  --category-home: oklch(0.68 0.11 180);
+  --category-home-foreground: oklch(0.85 0.07 180);
   --overlay: oklch(0 0 0 / 80%);
   --brand: oklch(0.78 0.14 75);
   --brand-emphasis: oklch(0.55 0.16 60);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fiestaboard/ui",
-  "version": "1.6.5",
+  "version": "1.7.0",
   "description": "FiestaUI — the FiestaBoard design system. React components on Base UI with Tailwind v4 design tokens.",
   "license": "MIT",
   "repository": {