@fiestaboard/ui 5.8.0 → 5.10.0

package/dist/components/containment/card.js

@@ -2,21 +2,22 @@ import { cn as e } from "../../lib/utils.js";
 import "react";
 import { jsx as t, jsxs as n } from "react/jsx-runtime";
 //#region src/components/containment/card.tsx
-function r({ className: n, ...r }) {
+var r = "bg-card text-card-foreground rounded-xl border shadow-card";
+function i({ className: n, ...i }) {
 	return /* @__PURE__ */ t("div", {
 		"data-slot": "card",
-		className: e("bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-card transition-[box-shadow,border-color] duration-base", n),
-		...r
+		className: e(r, "flex flex-col gap-6 py-6 transition-[box-shadow,border-color] duration-base", n),
+		...i
 	});
 }
-function i({ className: n, ...r }) {
+function a({ className: n, ...r }) {
 	return /* @__PURE__ */ t("div", {
 		"data-slot": "card-header",
 		className: e("@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-2 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6", n),
 		...r
 	});
 }
-function a({ className: r, as: i = "h3", icon: a, size: o = "lg", ...s }) {
+function o({ className: r, as: i = "h3", icon: a, size: o = "lg", ...s }) {
 	let { children: c, ...l } = s;
 	return /* @__PURE__ */ n(i, {
 		"data-slot": "card-title",
@@ -31,28 +32,28 @@ function a({ className: r, as: i = "h3", icon: a, size: o = "lg", ...s }) {
 		}) : null, c]
 	});
 }
-function o({ className: n, ...r }) {
+function s({ className: n, ...r }) {
 	return /* @__PURE__ */ t("div", {
 		"data-slot": "card-description",
 		className: e("text-muted-foreground text-sm", n),
 		...r
 	});
 }
-function s({ className: n, ...r }) {
+function c({ className: n, ...r }) {
 	return /* @__PURE__ */ t("div", {
 		"data-slot": "card-action",
 		className: e("col-start-2 row-span-2 row-start-1 self-start justify-self-end", n),
 		...r
 	});
 }
-function c({ className: n, ...r }) {
+function l({ className: n, ...r }) {
 	return /* @__PURE__ */ t("div", {
 		"data-slot": "card-content",
 		className: e("px-6", n),
 		...r
 	});
 }
-function l({ className: n, ...r }) {
+function u({ className: n, ...r }) {
 	return /* @__PURE__ */ t("div", {
 		"data-slot": "card-footer",
 		className: e("flex items-center px-6 [.border-t]:pt-6", n),
@@ -60,6 +61,6 @@ function l({ className: n, ...r }) {
 	});
 }
 //#endregion
-export { r as Card, s as CardAction, c as CardContent, o as CardDescription, l as CardFooter, i as CardHeader, a as CardTitle };
+export { i as Card, c as CardAction, l as CardContent, s as CardDescription, u as CardFooter, a as CardHeader, o as CardTitle, r as cardSurfaceClassName };
 
 //# sourceMappingURL=card.js.map

package/dist/components/containment/card.js.map

@@ -1 +1 @@
-{"version":3,"file":"card.js","names":[],"sources":["../../../src/components/containment/card.tsx"],"mappings":";;;;AAIA,SAAS,EAAK,EAAE,cAAW,GAAG,KAAsC;CAClE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EACT,0IACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAW,EAAE,cAAW,GAAG,KAAsC;CACxE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EACT,4JACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AA6CA,SAAS,EAAU,EAAE,cAAW,IAAI,IAAY,MAAM,SAAM,UAAO,MAAM,GAAG,KAAyB;CACnG,IAAM,EAAE,aAAU,GAAG,MAAS;CAE9B,OACE,kBAAC,GAAD;EACE,aAAU;EACV,aAAW;EACX,WAAW,EACT,8BACA,MAAS,UAAU,aAInB,KAAQ,2BACR,CACF;EACA,GAAI;EAZN,UAAA,CAcG,IACC,kBAAC,QAAD;GACE,aAAU;GAGV,eAAY;GACZ,WAAW,EACT,0EAKA,mFACF;GAEC,UAAA;EACG,CAAA,IACJ,MACH,CACQ;;AAEf;AAEA,SAAS,EAAgB,EAAE,cAAW,GAAG,KAAsC;CAC7E,OAAO,kBAAC,OAAD;EAAK,aAAU;EAAmB,WAAW,EAAG,iCAAiC,CAAS;EAAG,GAAI;CAAQ,CAAA;AAClH;AAEA,SAAS,EAAW,EAAE,cAAW,GAAG,KAAsC;CACxE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EAAG,kEAAkE,CAAS;EACzF,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAY,EAAE,cAAW,GAAG,KAAsC;CACzE,OAAO,kBAAC,OAAD;EAAK,aAAU;EAAe,WAAW,EAAG,QAAQ,CAAS;EAAG,GAAI;CAAQ,CAAA;AACrF;AAEA,SAAS,EAAW,EAAE,cAAW,GAAG,KAAsC;CACxE,OACE,kBAAC,OAAD;EAAK,aAAU;EAAc,WAAW,EAAG,2CAA2C,CAAS;EAAG,GAAI;CAAQ,CAAA;AAElH"}
+{"version":3,"file":"card.js","names":[],"sources":["../../../src/components/containment/card.tsx"],"mappings":";;;;AA0BA,IAAM,IAAuB;AAE7B,SAAS,EAAK,EAAE,cAAW,GAAG,KAAsC;CAClE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EACT,GACA,+EACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAW,EAAE,cAAW,GAAG,KAAsC;CACxE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EACT,4JACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AA6CA,SAAS,EAAU,EAAE,cAAW,IAAI,IAAY,MAAM,SAAM,UAAO,MAAM,GAAG,KAAyB;CACnG,IAAM,EAAE,aAAU,GAAG,MAAS;CAE9B,OACE,kBAAC,GAAD;EACE,aAAU;EACV,aAAW;EACX,WAAW,EACT,8BACA,MAAS,UAAU,aAInB,KAAQ,2BACR,CACF;EACA,GAAI;EAZN,UAAA,CAcG,IACC,kBAAC,QAAD;GACE,aAAU;GAGV,eAAY;GACZ,WAAW,EACT,0EAKA,mFACF;GAEC,UAAA;EACG,CAAA,IACJ,MACH,CACQ;;AAEf;AAEA,SAAS,EAAgB,EAAE,cAAW,GAAG,KAAsC;CAC7E,OAAO,kBAAC,OAAD;EAAK,aAAU;EAAmB,WAAW,EAAG,iCAAiC,CAAS;EAAG,GAAI;CAAQ,CAAA;AAClH;AAEA,SAAS,EAAW,EAAE,cAAW,GAAG,KAAsC;CACxE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EAAG,kEAAkE,CAAS;EACzF,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAY,EAAE,cAAW,GAAG,KAAsC;CACzE,OAAO,kBAAC,OAAD;EAAK,aAAU;EAAe,WAAW,EAAG,QAAQ,CAAS;EAAG,GAAI;CAAQ,CAAA;AACrF;AAEA,SAAS,EAAW,EAAE,cAAW,GAAG,KAAsC;CACxE,OACE,kBAAC,OAAD;EAAK,aAAU;EAAc,WAAW,EAAG,2CAA2C,CAAS;EAAG,GAAI;CAAQ,CAAA;AAElH"}

package/dist/components/containment/icon-tile.d.ts

@@ -42,7 +42,7 @@ import * as React from "react";
  * was promoted to fix.
  */
 declare const iconTileVariants: (props?: ({
-    size?: "lg" | "sm" | "md" | null | undefined;
+    size?: "sm" | "md" | "lg" | null | undefined;
     tone?: "muted" | "board" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export type IconTileProps = React.ComponentProps<"span"> & VariantProps<typeof iconTileVariants> & {

package/dist/components/editor/color-picker-content.js

@@ -1,8 +1,8 @@
 "use client";
 import { cn as e } from "../../lib/utils.js";
-import { Box as t } from "../layout/box.js";
-import { Grid as n } from "../layout/grid.js";
-import { Text as r } from "../typography/text.js";
+import { Text as t } from "../typography/text.js";
+import { Box as n } from "../layout/box.js";
+import { Grid as r } from "../layout/grid.js";
 import { Tooltip as i, TooltipContent as a, TooltipProvider as o, TooltipTrigger as s } from "../overlays/tooltip.js";
 import { AVAILABLE_COLORS as c, COLOR_DISPLAY as l } from "../../lib/board-colors.js";
 import { resolveCode62Glyph as u } from "../../lib/board-characters.js";
@@ -43,7 +43,7 @@ function x({ onInsert: c, deviceType: x, code62Glyph: S, labels: C }) {
 			behavior: "smooth"
 		}), n?.focus();
 	};
-	return /* @__PURE__ */ h(o, { children: /* @__PURE__ */ g(t, {
+	return /* @__PURE__ */ h(o, { children: /* @__PURE__ */ g(n, {
 		className: e("p-2"),
 		tabIndex: 0,
 		role: "listbox",
@@ -69,31 +69,31 @@ function x({ onInsert: c, deviceType: x, code62Glyph: S, labels: C }) {
 		onFocus: (e) => {
 			e.target === e.currentTarget && E === -1 && k(0);
 		},
-		children: [/* @__PURE__ */ h(n, {
+		children: [/* @__PURE__ */ h(r, {
 			cols: "4",
 			gap: "2",
 			className: "w-64",
 			role: "presentation",
-			children: v.map((t, n) => {
-				let o = E === n;
+			children: v.map((n, r) => {
+				let o = E === r;
 				return /* @__PURE__ */ g(i, { children: [/* @__PURE__ */ h(s, {
 					asChild: !0,
 					children: /* @__PURE__ */ h("button", {
 						ref: (e) => {
-							O.current[n] = e;
+							O.current[r] = e;
 						},
 						type: "button",
-						onClick: () => c(`{{${t}}}`),
-						onFocus: () => D(n),
-						className: e("h-10 rounded-md text-xs font-medium transition-all hover:scale-105 hover:shadow-md", "flex items-center justify-center focus:outline-none", o && "ring-2 ring-offset-2 ring-primary scale-105 shadow-md", l[t].bg, y[t] ?? l[t].text),
-						"aria-label": w.colorOptionLabel(w.colorNames[t]),
+						onClick: () => c(`{{${n}}}`),
+						onFocus: () => D(r),
+						className: e("h-10 rounded-md text-xs font-medium transition-all hover:scale-105 hover:shadow-md", "flex items-center justify-center focus:outline-none", o && "ring-2 ring-offset-2 ring-primary scale-105 shadow-md", l[n].bg, y[n] ?? l[n].text),
+						"aria-label": w.colorOptionLabel(w.colorNames[n]),
 						role: "option",
 						"aria-selected": o,
-						children: w.colorNames[t]
+						children: w.colorNames[n]
 					})
-				}), /* @__PURE__ */ h(a, { children: /* @__PURE__ */ h(r, { children: w.colorNames[t] }) })] }, t);
+				}), /* @__PURE__ */ h(a, { children: /* @__PURE__ */ h(t, { children: w.colorNames[n] }) })] }, n);
 			})
-		}), /* @__PURE__ */ h(t, {
+		}), /* @__PURE__ */ h(n, {
 			className: "mt-2 pt-2 border-t border-border",
 			role: "presentation",
 			children: /* @__PURE__ */ g(i, { children: [/* @__PURE__ */ h(s, {
@@ -108,14 +108,14 @@ function x({ onInsert: c, deviceType: x, code62Glyph: S, labels: C }) {
 					children: [T ? /* @__PURE__ */ h(d, { className: "w-4 h-4 fill-current" }) : /* @__PURE__ */ h(f, {
 						className: "w-4 h-4",
 						"aria-hidden": "true"
-					}), /* @__PURE__ */ h(r, {
+					}), /* @__PURE__ */ h(t, {
 						as: "span",
 						weight: "medium",
 						className: T ? "text-board-red" : void 0,
 						children: T ? w.heartLabel : w.degreeLabel
 					})]
 				})
-			}), /* @__PURE__ */ h(a, { children: /* @__PURE__ */ h(r, { children: T ? w.insertHeartTooltip : w.insertDegreeTooltip }) })] })
+			}), /* @__PURE__ */ h(a, { children: /* @__PURE__ */ h(t, { children: T ? w.insertHeartTooltip : w.insertDegreeTooltip }) })] })
 		})]
 	}) });
 }

package/dist/components/editor/filter-picker-content.js

@@ -1,10 +1,10 @@
 "use client";
 import { cn as e } from "../../lib/utils.js";
 import { Badge as t } from "../feedback/badge.js";
-import { Box as n } from "../layout/box.js";
-import { Flex as r } from "../layout/flex.js";
-import { Code as i } from "../typography/code.js";
-import { Text as a } from "../typography/text.js";
+import { Text as n } from "../typography/text.js";
+import { Box as r } from "../layout/box.js";
+import { Flex as i } from "../layout/flex.js";
+import { Code as a } from "../typography/code.js";
 import { Stack as o } from "../layout/stack.js";
 import { AlertCircle as s } from "lucide-react";
 import { jsx as c, jsxs as l } from "react/jsx-runtime";
@@ -46,7 +46,7 @@ function p({ filters: p, editor: m, onInsert: h, labels: g }) {
 		...u,
 		...g
 	};
-	if (p.length === 0) return /* @__PURE__ */ c(a, {
+	if (p.length === 0) return /* @__PURE__ */ c(n, {
 		tone: "muted",
 		className: "p-3",
 		children: _.noFiltersAvailable
@@ -77,14 +77,14 @@ function p({ filters: p, editor: m, onInsert: h, labels: g }) {
 			}).run() : h?.(`|${e}`);
 		} else h?.(`|${e}`);
 	};
-	return /* @__PURE__ */ l(n, {
+	return /* @__PURE__ */ l(r, {
 		className: "p-2 min-w-[250px]",
 		children: [
-			!v && m && /* @__PURE__ */ l(r, {
+			!v && m && /* @__PURE__ */ l(i, {
 				align: "start",
 				gap: "2",
 				className: "mb-2 p-2 bg-muted/50 rounded-md text-xs text-muted-foreground",
-				children: [/* @__PURE__ */ c(s, { className: "w-3.5 h-3.5 mt-0.5 flex-shrink-0" }), /* @__PURE__ */ c(a, {
+				children: [/* @__PURE__ */ c(s, { className: "w-3.5 h-3.5 mt-0.5 flex-shrink-0" }), /* @__PURE__ */ c(n, {
 					as: "span",
 					size: "xs",
 					tone: "muted",
@@ -93,41 +93,41 @@ function p({ filters: p, editor: m, onInsert: h, labels: g }) {
 			}),
 			/* @__PURE__ */ c(o, {
 				gap: "2",
-				children: p.map((n) => {
-					let r = n.split(":")[0];
+				children: p.map((r) => {
+					let i = r.split(":")[0];
 					return /* @__PURE__ */ l("button", {
 						type: "button",
-						onClick: () => y(n),
+						onClick: () => y(r),
 						className: e("w-full text-left px-3 py-2 rounded-md text-sm", "hover:bg-accent hover:text-accent-foreground transition-colors", "flex items-center gap-2"),
 						children: [/* @__PURE__ */ l(t, {
 							variant: "secondary",
 							className: "font-mono text-xs",
-							children: ["|", n]
-						}), /* @__PURE__ */ l(a, {
+							children: ["|", r]
+						}), /* @__PURE__ */ l(n, {
 							as: "span",
 							size: "xs",
 							tone: "muted",
 							children: [
-								r === "wrap" && _.filterDescWrap,
-								r === "pad" && _.filterDescPad,
-								r === "truncate" && _.filterDescTruncate
+								i === "wrap" && _.filterDescWrap,
+								i === "pad" && _.filterDescPad,
+								i === "truncate" && _.filterDescTruncate
 							]
 						})]
-					}, n);
+					}, r);
 				})
 			}),
 			/* @__PURE__ */ l(o, {
 				gap: "1",
 				className: "mt-3 pt-3 border-t text-xs text-muted-foreground",
-				children: [/* @__PURE__ */ c(a, {
+				children: [/* @__PURE__ */ c(n, {
 					size: "xs",
 					tone: "muted",
 					children: _.exampleLabel("{{weather.temperature|pad:3}}")
-				}), /* @__PURE__ */ l(a, {
+				}), /* @__PURE__ */ l(n, {
 					tone: "muted",
 					className: "text-[10px]",
 					children: [
-						/* @__PURE__ */ c(i, {
+						/* @__PURE__ */ c(a, {
 							className: "bg-transparent px-0 py-0 text-[10px] font-semibold text-muted-foreground",
 							children: "|wrap"
 						}),

package/dist/components/editor/formatting-picker-content.js

@@ -2,11 +2,11 @@
 import { cn as e } from "../../lib/utils.js";
 import { Button as t } from "../forms/button.js";
 import { Badge as n } from "../feedback/badge.js";
-import { Input as r } from "../forms/input.js";
-import { Box as i } from "../layout/box.js";
-import { Flex as a } from "../layout/flex.js";
-import { Grid as o } from "../layout/grid.js";
-import { Text as s } from "../typography/text.js";
+import { Text as r } from "../typography/text.js";
+import { Input as i } from "../forms/input.js";
+import { Box as a } from "../layout/box.js";
+import { Flex as o } from "../layout/flex.js";
+import { Grid as s } from "../layout/grid.js";
 import { Stack as c } from "../layout/stack.js";
 import { Tooltip as l, TooltipContent as u, TooltipProvider as d, TooltipTrigger as f } from "../overlays/tooltip.js";
 import { AVAILABLE_COLORS as p, COLOR_DISPLAY as m } from "../../lib/board-colors.js";
@@ -43,7 +43,7 @@ function S({ formatting: S = {}, onInsert: C, labels: w }) {
 		syntax: t.syntax,
 		description: t.description
 	}));
-	if (j.length === 0) return /* @__PURE__ */ y(s, {
+	if (j.length === 0) return /* @__PURE__ */ y(r, {
 		tone: "muted",
 		className: "p-3",
 		children: T.noFormattingAvailable
@@ -53,7 +53,7 @@ function S({ formatting: S = {}, onInsert: C, labels: w }) {
 	}, N = (e) => {
 		C(`{{${h}:${e}}}`), D(!1), k("");
 	};
-	return E ? /* @__PURE__ */ y(d, { children: /* @__PURE__ */ b(i, {
+	return E ? /* @__PURE__ */ y(d, { children: /* @__PURE__ */ b(a, {
 		className: "p-2 min-w-[240px] max-w-[280px]",
 		children: [
 			/* @__PURE__ */ y("button", {
@@ -62,14 +62,14 @@ function S({ formatting: S = {}, onInsert: C, labels: w }) {
 				className: "text-xs text-muted-foreground hover:text-foreground mb-2 flex items-center gap-1",
 				children: T.back
 			}),
-			/* @__PURE__ */ y(s, {
+			/* @__PURE__ */ y(r, {
 				size: "xs",
 				tone: "muted",
 				weight: "medium",
 				className: "mb-2",
 				children: T.selectColor
 			}),
-			/* @__PURE__ */ y(o, {
+			/* @__PURE__ */ y(s, {
 				cols: "4",
 				gap: "2",
 				className: "mb-3",
@@ -82,23 +82,23 @@ function S({ formatting: S = {}, onInsert: C, labels: w }) {
 						"aria-label": T.colorOptionLabel(T.colorNames[t]),
 						children: T.colorNames[t]
 					})
-				}), /* @__PURE__ */ y(u, { children: /* @__PURE__ */ y(s, { children: T.colorNames[t] }) })] }, t))
+				}), /* @__PURE__ */ y(u, { children: /* @__PURE__ */ y(r, { children: T.colorNames[t] }) })] }, t))
 			}),
-			/* @__PURE__ */ b(i, {
+			/* @__PURE__ */ b(a, {
 				className: "pt-2 border-t border-border",
-				children: [/* @__PURE__ */ y(s, {
+				children: [/* @__PURE__ */ y(r, {
 					size: "xs",
 					tone: "muted",
 					className: "mb-1.5",
 					id: A,
 					children: T.orCustomPattern
-				}), /* @__PURE__ */ b(i, {
+				}), /* @__PURE__ */ b(a, {
 					as: "form",
 					onSubmit: (e) => {
 						e.preventDefault(), O && N(O);
 					},
 					className: "flex gap-1.5",
-					children: [/* @__PURE__ */ y(r, {
+					children: [/* @__PURE__ */ y(i, {
 						type: "text",
 						value: O,
 						onChange: (e) => k(e.target.value),
@@ -115,35 +115,35 @@ function S({ formatting: S = {}, onInsert: C, labels: w }) {
 				})]
 			})
 		]
-	}) }) : /* @__PURE__ */ y(d, { children: /* @__PURE__ */ y(i, {
+	}) }) : /* @__PURE__ */ y(d, { children: /* @__PURE__ */ y(a, {
 		className: "p-1.5 min-w-[240px] max-w-[280px]",
 		children: /* @__PURE__ */ y(c, {
 			gap: "0.5",
 			children: j.map((t) => {
-				let r = t.syntax.includes(h);
+				let i = t.syntax.includes(h);
 				return /* @__PURE__ */ b(l, { children: [/* @__PURE__ */ y(f, {
 					asChild: !0,
 					children: /* @__PURE__ */ b("button", {
 						type: "button",
 						onClick: () => M(t),
 						className: e("w-full text-left px-2.5 py-1.5 rounded-md text-sm", "hover:bg-accent hover:text-accent-foreground transition-colors", "flex items-center justify-between gap-2 group"),
-						children: [/* @__PURE__ */ b(a, {
+						children: [/* @__PURE__ */ b(o, {
 							align: "center",
 							gap: "2",
 							className: "flex-1 min-w-0",
-							children: [/* @__PURE__ */ y(_, { className: "w-3.5 h-3.5 text-muted-foreground group-hover:text-accent-foreground flex-shrink-0" }), /* @__PURE__ */ y(s, {
+							children: [/* @__PURE__ */ y(_, { className: "w-3.5 h-3.5 text-muted-foreground group-hover:text-accent-foreground flex-shrink-0" }), /* @__PURE__ */ y(r, {
 								as: "span",
 								weight: "medium",
 								className: "capitalize truncate group-hover:text-accent-foreground",
 								children: t.name
 							})]
-						}), r ? /* @__PURE__ */ y(g, { className: "w-3.5 h-3.5 text-muted-foreground group-hover:text-accent-foreground flex-shrink-0" }) : /* @__PURE__ */ y(n, {
+						}), i ? /* @__PURE__ */ y(g, { className: "w-3.5 h-3.5 text-muted-foreground group-hover:text-accent-foreground flex-shrink-0" }) : /* @__PURE__ */ y(n, {
 							variant: "secondary",
 							className: "font-mono text-[10px] px-1.5 py-0 flex-shrink-0",
 							children: t.syntax
 						})]
 					})
-				}), /* @__PURE__ */ y(u, { children: /* @__PURE__ */ y(s, { children: t.description ?? t.name }) })] }, t.syntax);
+				}), /* @__PURE__ */ y(u, { children: /* @__PURE__ */ y(r, { children: t.description ?? t.name }) })] }, t.syntax);
 			})
 		})
 	}) });