@jfrader/ui 0.6.0 → 0.7.1

package/README.md

@@ -22,7 +22,10 @@ React components styled with Emotion and themed through the CSS custom propertie
 | `@jfrader/ui/date-picker` | `DatePicker` |
 | `@jfrader/ui/dialog` | `Dialog` |
 | `@jfrader/ui/divider` | `Divider` |
+| `@jfrader/ui/emblem` | `Emblem` |
 | `@jfrader/ui/flex` | `Flex` |
+| `@jfrader/ui/flip-game-card` | `FlipGameCard` |
+| `@jfrader/ui/game-card` | `GameCard` |
 | `@jfrader/ui/kbd` | `Kbd` |
 | `@jfrader/ui/menu` | `Menu` |
 | `@jfrader/ui/pagination` | `Pagination` |
@@ -52,7 +55,7 @@ Each subpath also exports its prop types. The package root re-exports everything
 import { Button, Dialog, ThemeRoot } from '@jfrader/ui';
 ```
 
-Or import per path:
+Or import each component by subpath:
 
 ```tsx
 import { Button } from '@jfrader/ui/button';
@@ -100,7 +103,7 @@ Token names and values live in `packages/tokens/src/tokens.ts`.
 pnpm --filter @jfrader/tokens build && pnpm --filter @jfrader/ui build
 ```
 
-Writes ES modules to `dist/` (`dist/index.js` plus one `dist/<name>.js` per component) and declarations to `dist/types/`. `react`, `react-dom` and every package in `dependencies` stay external.
+The build writes ES modules to `dist/` (`dist/index.js` plus one `dist/<name>.js` per component) and declarations to `dist/types/`. It does not bundle `react`, `react-dom` or any package in `dependencies`.
 
 ## Publishing
 
@@ -119,9 +122,9 @@ gh workflow run publish.yml --repo jfrader/jfrader-ui --ref v0.1.1
 
 npmjs authenticates through the package's trusted publisher for `jfrader/jfrader-ui` → `.github/workflows/publish.yml`, configured on npmjs after the first version is published by hand. GitHub Packages uses the workflow's `GITHUB_TOKEN`. See the [root README](https://github.com/jfrader/jfrader-ui#publishing) for the full release setup.
 
-In the repo, `exports` point at `src/` so the workspace consumes source. `node scripts/flip-exports.mjs dist` validates and switches both packages to the publish layout; `node scripts/flip-exports.mjs src` switches both back. The UI `prepack` builds UI and flips only its manifest with `--package ui`; `postpack` restores only UI. Each flip validates only the selected package's export targets.
+In the repo, `exports` point at `src/` so workspace apps use the source. `node scripts/flip-exports.mjs dist` validates and switches both packages to the publish layout. `node scripts/flip-exports.mjs src` switches both back. The UI `prepack` builds UI and switches only its manifest with `--package ui`; `postpack` restores only UI. Each switch validates only the selected package's export targets.
 
-Build tokens before packing UI: the published UI package depends on `@jfrader/tokens`, which stays external rather than being bundled. The UI hook does not build or validate tokens; prepare its published artifacts separately. Run from the repo root:
+Build tokens before packing UI. UI depends on the published `@jfrader/tokens` package and does not bundle it. The UI hook does not build or validate tokens. Run from the repo root:
 
 ```sh
 pnpm --filter @jfrader/tokens build && pnpm --filter @jfrader/ui build
@@ -131,9 +134,11 @@ pnpm --filter @jfrader/ui pack --pack-destination /tmp/opencode
 
 Root `pnpm build` builds Storybook, not the published packages. If packing fails after `prepack`, run `node scripts/flip-exports.mjs src` from the repo root to restore workspace exports.
 
-It must contain only `dist/**`, `package.json`, `README.md` and `LICENSE`.
+The tarball must contain only `dist/**`, `package.json`, `README.md` and `LICENSE`.
 
-### Registry choice / installing
+<a id="registry-choice--installing"></a>
+
+### Registry choice
 
 npmjs needs no authentication; GitHub Packages requires authentication even for public packages. To install from GitHub Packages, add this to `.npmrc`:
 

package/dist/avatar-BuM1zB_f.js

@@ -0,0 +1,164 @@
+'use client';
+import { a as e, i as t } from "./css-BYJhdGh-.js";
+import { n, r } from "./media-8yrN85VT.js";
+import { t as i } from "./sx-BJXJ2xJK.js";
+import { t as a } from "./initials-DEdwNe9_.js";
+import { useState as o } from "react";
+import { vars as s } from "@jfrader/tokens/vars";
+import { jsx as c, jsxs as l } from "@emotion/react/jsx-runtime";
+//#region src/components/avatar/avatar.tsx
+var u = 2, d = t({
+	position: "relative",
+	display: "inline-flex",
+	alignItems: "center",
+	justifyContent: "center",
+	flexShrink: 0,
+	boxSizing: "border-box",
+	borderRadius: s.radius.full,
+	backgroundColor: s.color.surfaceHover,
+	color: s.color.text,
+	fontWeight: s.fontWeight.medium,
+	lineHeight: 1,
+	userSelect: "none",
+	verticalAlign: "middle",
+	[n]: { outline: "1px solid CanvasText" }
+}), f = {
+	sm: t({
+		inlineSize: s.space[6],
+		blockSize: s.space[6],
+		fontSize: s.textSize.xs
+	}),
+	md: t({
+		inlineSize: s.space[8],
+		blockSize: s.space[8],
+		fontSize: s.textSize.sm
+	}),
+	lg: t({
+		inlineSize: s.space[10],
+		blockSize: s.space[10],
+		fontSize: s.textSize.md
+	})
+}, p = t({
+	display: "block",
+	inlineSize: "100%",
+	blockSize: "100%",
+	borderRadius: s.radius.full,
+	objectFit: "cover"
+}), m = t({
+	position: "absolute",
+	insetBlockEnd: 0,
+	insetInlineEnd: 0,
+	inlineSize: "25%",
+	blockSize: "25%",
+	pointerEvents: "none",
+	"&::before": {
+		content: "\"\"",
+		position: "absolute",
+		insetBlockStart: 0,
+		insetInlineStart: 0,
+		inlineSize: "100%",
+		blockSize: "100%",
+		boxSizing: "border-box",
+		borderRadius: s.radius.full,
+		boxShadow: `0 0 0 2px ${s.color.bg}`
+	}
+}), h = {
+	online: t({ "&::before": { backgroundColor: s.color.success } }),
+	away: t({ "&::before": {
+		border: `2px solid ${s.color.warning}`,
+		backgroundColor: "transparent"
+	} }),
+	busy: t({ "&::before": {
+		backgroundColor: s.color.danger,
+		blockSize: "30%",
+		insetBlockStart: "35%"
+	} }),
+	offline: t({ "&::before": {
+		backgroundColor: s.color.textSubtle,
+		inlineSize: "60%",
+		blockSize: "60%",
+		insetBlockStart: "20%",
+		insetInlineStart: "20%"
+	} })
+}, g = t({ [n]: {
+	"&::before": {
+		forcedColorAdjust: "none",
+		backgroundColor: "CanvasText",
+		outline: "2px solid Canvas"
+	},
+	"&[data-status=\"away\"]::before": {
+		borderColor: "CanvasText",
+		backgroundColor: "Canvas"
+	}
+} }), _ = e({
+	from: {
+		transform: "scale(.8)",
+		opacity: 1
+	},
+	to: {
+		transform: "scale(2.4)",
+		opacity: 0
+	}
+}), v = { "&[data-status=\"online\"][data-pulse]::after": {
+	content: "none",
+	display: "none",
+	animation: "none"
+} }, y = t({
+	"&[data-status=\"online\"][data-pulse]::after": {
+		content: "\"\"",
+		position: "absolute",
+		insetBlockStart: 0,
+		insetInlineStart: 0,
+		inlineSize: "100%",
+		blockSize: "100%",
+		borderRadius: s.radius.full,
+		color: s.color.success,
+		border: "1px solid currentColor",
+		animation: `${_} ${s.motion.duration.presence} infinite ${s.motion.easePresence}`
+	},
+	[r]: v,
+	[n]: v
+});
+function b({ ref: e, name: t, src: n, size: r = "md", status: s, pulse: _ = !1, statusLabel: v, slotProps: b, className: x, sx: S, ...C }) {
+	let [w, T] = o(), E = n !== void 0 && n !== "" && n !== w, D = s === void 0 ? t : `${t}, ${v ?? s}`;
+	return /* @__PURE__ */ c(i, {
+		className: x,
+		styles: [d, f[r]],
+		sx: S,
+		children: (r) => /* @__PURE__ */ l("span", {
+			...C,
+			ref: e,
+			"data-ui": "avatar",
+			role: "img",
+			"aria-label": D,
+			className: r,
+			children: [E ? /* @__PURE__ */ c("img", {
+				src: n,
+				alt: "",
+				onError: () => T(n),
+				className: b?.image?.className,
+				css: [p, b?.image?.css]
+			}) : /* @__PURE__ */ c("span", {
+				"aria-hidden": "true",
+				className: b?.fallback?.className,
+				css: b?.fallback?.css,
+				children: a(t, u)
+			}), s !== void 0 && /* @__PURE__ */ c("span", {
+				"aria-hidden": "true",
+				"data-status": s,
+				"data-pulse": _ && s === "online" ? "" : void 0,
+				className: b?.status?.className,
+				css: [
+					m,
+					h[s],
+					g,
+					y,
+					b?.status?.css
+				]
+			})]
+		})
+	});
+}
+b.displayName = "Avatar";
+//#endregion
+export { b as t };

package/dist/{avatar-group-DvP8mAE-.js → avatar-group-D1UEihvh.js}

@@ -3,7 +3,7 @@ import { i as e } from "./css-BYJhdGh-.js";
 import { n as t } from "./media-8yrN85VT.js";
 import { t as n } from "./sx-BJXJ2xJK.js";
 import { t as r } from "./visually-hidden-DgVO3NaB.js";
-import { t as i } from "./avatar-B6idYC59.js";
+import { t as i } from "./avatar-BuM1zB_f.js";
 import { useId as a } from "react";
 import { vars as o } from "@jfrader/tokens/vars";
 import { jsx as s, jsxs as c } from "@emotion/react/jsx-runtime";

package/dist/avatar-group.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as AvatarGroup } from "./avatar-group-DvP8mAE-.js";
+export { t as AvatarGroup } from "./avatar-group-D1UEihvh.js";

package/dist/avatar.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as Avatar } from "./avatar-B6idYC59.js";
+export { t as Avatar } from "./avatar-BuM1zB_f.js";

package/dist/card-frame-CcLa6NQ4.js

@@ -0,0 +1,13 @@
+'use client';
+//#region src/components/game-card/card-frame.ts
+var e = {
+	ratio: 1.48,
+	cornerDivisor: 13
+}, t = {
+	markWidthRatio: .35,
+	watermarkInsetPercent: 3,
+	watermarkOpacity: .15,
+	contentPaddingPercent: 4
+};
+//#endregion
+export { e as n, t };

package/dist/{chat-thread-DVa17BRC.js → chat-thread-CMhwxhoA.js}

@@ -8,7 +8,7 @@ import { t as s } from "./visually-hidden-DgVO3NaB.js";
 import { t as c } from "./button-C6OV0C7J.js";
 import { t as ee } from "./part-id-D0zksy32.js";
 import { t as te } from "./card-C008OQCp.js";
-import { c as l, d as ne, g as re, h as u, i as ie, m as ae, n as d, p as oe, r as se, t as f } from "./thread-parts-DfZNz70v.js";
+import { c as l, d as ne, g as re, h as u, i as ie, m as ae, n as d, p as oe, r as se, t as f } from "./thread-parts-DbKhuwVU.js";
 import { useEffect as ce, useId as le, useLayoutEffect as p, useMemo as m, useRef as h, useState as g } from "react";
 import { vars as _ } from "@jfrader/tokens/vars";
 import { Fragment as v, jsx as y, jsxs as b } from "@emotion/react/jsx-runtime";

package/dist/chat-thread.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as ChatThread } from "./chat-thread-DVa17BRC.js";
+export { t as ChatThread } from "./chat-thread-CMhwxhoA.js";

package/dist/{comment-thread-BnUHxviq.js → comment-thread-DbOzYr0q.js}

@@ -8,7 +8,7 @@ import { t as ee } from "./renderable-DzcIj1Lo.js";
 import { t as s } from "./button-C6OV0C7J.js";
 import { t as c } from "./part-id-D0zksy32.js";
 import { t as l } from "./card-C008OQCp.js";
-import { a as u, c as d, d as f, f as te, g as p, h as m, i as ne, l as re, n as ie, o as ae, p as oe, r as se, s as ce, t as le, u as ue } from "./thread-parts-DfZNz70v.js";
+import { a as u, c as d, d as f, f as te, g as p, h as m, i as ne, l as re, n as ie, o as ae, p as oe, r as se, s as ce, t as le, u as ue } from "./thread-parts-DbKhuwVU.js";
 import { useEffect as de, useId as fe, useLayoutEffect as h, useMemo as g, useRef as _, useState as v } from "react";
 import { vars as y } from "@jfrader/tokens/vars";
 import { Fragment as pe, jsx as b, jsxs as x } from "@emotion/react/jsx-runtime";

package/dist/comment-thread.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as CommentThread } from "./comment-thread-BnUHxviq.js";
+export { t as CommentThread } from "./comment-thread-DbOzYr0q.js";

package/dist/emblem-DnXmpZCh.js

@@ -0,0 +1,166 @@
+'use client';
+import { i as e } from "./css-BYJhdGh-.js";
+import { n as t } from "./focus-ring-BK5W5_NY.js";
+import { r as n } from "./media-8yrN85VT.js";
+import { t as r } from "./sx-BJXJ2xJK.js";
+import { t as i } from "./initials-DEdwNe9_.js";
+import { useState as a } from "react";
+import { vars as o } from "@jfrader/tokens/vars";
+import { jsx as s } from "@emotion/react/jsx-runtime";
+import { useMergeRefs as c } from "@floating-ui/react";
+//#region src/components/emblem/emblem.tsx
+var l = 3, u = "[data-ui=\"emblem-plate\"]", d = "polygon(50% 0, 91% 16%, 84% 73%, 50% 100%, 16% 73%, 9% 16%)", f = "polygon(50% 0, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%)", p = "0.12", m = "0.85", h = "@supports (color: oklch(from red l c h))", g = "@supports (color: contrast-color(red))", _ = e({
+	"--emblem-fill": o.color.accent,
+	"--emblem-highlight": "var(--emblem-fill)",
+	"--emblem-secondary": "var(--emblem-highlight)",
+	"--emblem-pattern": "none",
+	"--emblem-shadow": `drop-shadow(${o.shadow.raised})`,
+	"--emblem-brightness": "1",
+	position: "relative",
+	display: "inline-block",
+	inlineSize: "var(--emblem-size)",
+	blockSize: "var(--emblem-size)",
+	fontSize: "var(--emblem-size)",
+	verticalAlign: "middle",
+	userSelect: "none",
+	filter: "var(--emblem-shadow) brightness(var(--emblem-brightness))",
+	[h]: { "--emblem-highlight": `oklch(from var(--emblem-fill) calc(l + ${p}) calc(c * ${m}) h)` }
+}), v = e({
+	position: "absolute",
+	inset: 0,
+	display: "grid",
+	placeItems: "center",
+	overflow: "hidden",
+	backgroundImage: "var(--emblem-pattern), linear-gradient(135deg, var(--emblem-highlight), var(--emblem-fill))",
+	"&::after": {
+		content: "\"\"",
+		position: "absolute",
+		inset: "10% 12% 14%",
+		border: "1px solid color-mix(in srgb, var(--emblem-secondary) 42%, transparent)",
+		borderRadius: "inherit",
+		clipPath: "inherit"
+	}
+}), y = e({
+	position: "relative",
+	maxInlineSize: "100%",
+	overflow: "hidden",
+	fontFamily: o.font.sans,
+	fontSize: "0.5em",
+	fontWeight: o.fontWeight.semibold,
+	letterSpacing: "-0.03em",
+	lineHeight: 1,
+	whiteSpace: "nowrap"
+}), b = e({
+	color: `var(--emblem-ink, ${o.color.accentContrast})`,
+	[g]: { color: "var(--emblem-ink, contrast-color(var(--emblem-highlight)))" }
+}), x = e({
+	display: "block",
+	inlineSize: "100%",
+	blockSize: "100%",
+	objectFit: "cover"
+}), S = {
+	sm: e({ "--emblem-size": o.size.emblemSm }),
+	md: e({ "--emblem-size": o.size.emblemMd }),
+	lg: e({ "--emblem-size": o.size.emblemLg }),
+	xl: e({ "--emblem-size": o.size.emblemXl })
+}, C = {
+	shield: e({
+		blockSize: "calc(var(--emblem-size) * 8 / 7)",
+		[`& > ${u}`]: { clipPath: d }
+	}),
+	circle: e({ [`& > ${u}`]: { borderRadius: o.radius.full } }),
+	squircle: e({ [`& > ${u}`]: { borderRadius: "30%" } }),
+	hexagon: e({ [`& > ${u}`]: { clipPath: f } })
+}, w = {
+	none: e({ "--emblem-pattern": "none" }),
+	stripes: e({ "--emblem-pattern": "repeating-linear-gradient(to right, var(--emblem-secondary) 0 10%, transparent 10% 20%)" }),
+	hoops: e({ "--emblem-pattern": "repeating-linear-gradient(to bottom, var(--emblem-secondary) 0 12%, transparent 12% 24%)" }),
+	sash: e({
+		"--emblem-pattern": "linear-gradient(135deg, transparent 34%, var(--emblem-secondary) 34% 62%, transparent 62%)",
+		"&:dir(rtl)": { "--emblem-pattern": "linear-gradient(225deg, transparent 34%, var(--emblem-secondary) 34% 62%, transparent 62%)" }
+	})
+}, T = e({
+	cursor: "pointer",
+	textDecoration: "none",
+	transitionProperty: "filter, transform",
+	transitionDuration: o.motion.duration.fast,
+	transitionTimingFunction: o.motion.easeStandard,
+	"&:hover": {
+		"--emblem-brightness": "1.08",
+		transform: "translateY(-1px)"
+	},
+	"&:focus-visible": { ...t },
+	[n]: { transitionDuration: "0s" }
+});
+function E({ ref: e, name: t, initials: n, src: o, color: u, secondaryColor: d, inkColor: f, shape: p = "shield", size: m = "md", pattern: h = "none", slotProps: g, className: E, style: D, sx: O, render: k, ...A }) {
+	let [j, M] = a(), N = c([e]), P = o !== void 0 && o !== "" && o !== j, F = [
+		_,
+		S[m],
+		C[p],
+		w[h]
+	];
+	k !== void 0 && F.push(T);
+	let I = n ?? i(t, l), L = P ? t : `${t} — ${I}`, R = {};
+	u !== void 0 && (R["--emblem-fill"] = u), d !== void 0 && (R["--emblem-secondary"] = d), f !== void 0 && (R["--emblem-ink"] = f);
+	let z = {
+		...R,
+		...D
+	}, B = /* @__PURE__ */ s("span", {
+		"data-ui": "emblem-plate",
+		"aria-hidden": "true",
+		css: v,
+		children: P ? /* @__PURE__ */ s("img", {
+			src: o,
+			alt: "",
+			onError: () => M(o),
+			className: g?.image?.className,
+			css: [x, g?.image?.css]
+		}) : /* @__PURE__ */ s("span", {
+			"data-ui": "emblem-ink",
+			"aria-hidden": "true",
+			className: g?.monogram?.className,
+			css: [
+				y,
+				b,
+				g?.monogram?.css
+			],
+			children: I
+		})
+	});
+	return k ? /* @__PURE__ */ s(r, {
+		className: E,
+		styles: F,
+		sx: O,
+		children: (e) => k({
+			...A,
+			className: e,
+			ref: N,
+			style: z,
+			"data-ui": "emblem",
+			"data-shape": p,
+			"data-pattern": h,
+			"aria-label": L,
+			css: F,
+			children: B
+		})
+	}) : /* @__PURE__ */ s(r, {
+		className: E,
+		styles: F,
+		sx: O,
+		children: (n) => /* @__PURE__ */ s("span", {
+			...A,
+			ref: e,
+			role: "img",
+			"aria-label": t,
+			"data-ui": "emblem",
+			"data-shape": p,
+			"data-pattern": h,
+			className: n,
+			style: z,
+			children: B
+		})
+	});
+}
+E.displayName = "Emblem";
+//#endregion
+export { E as t };

package/dist/emblem.js

@@ -0,0 +1,2 @@
+'use client';
+export { t as Emblem } from "./emblem-DnXmpZCh.js";

package/dist/flip-game-card-xmcR_QSq.js

@@ -0,0 +1,100 @@
+'use client';
+import { i as e } from "./css-BYJhdGh-.js";
+import { r as t } from "./media-8yrN85VT.js";
+import { t as n } from "./sx-BJXJ2xJK.js";
+import { n as r } from "./card-frame-CcLa6NQ4.js";
+import { useEffect as i, useState as a } from "react";
+import { vars as o } from "@jfrader/tokens/vars";
+import { jsx as s, jsxs as c } from "@emotion/react/jsx-runtime";
+import { MotionConfig as l, useReducedMotion as u } from "motion/react";
+//#region src/components/flip-game-card/flip-game-card.tsx
+var d = e({
+	label: "flip-game-card",
+	position: "relative",
+	flexShrink: 0,
+	inlineSize: "var(--flip-game-card-width)",
+	blockSize: `calc(var(--flip-game-card-width) * ${r.ratio})`,
+	perspective: o.size.gameCardPerspective
+}), f = {
+	sm: e({ "--flip-game-card-width": o.size.gameCardSm }),
+	md: e({ "--flip-game-card-width": o.size.gameCardMd }),
+	lg: e({ "--flip-game-card-width": o.size.gameCardLg })
+}, p = e({ "& > [data-ui=\"flip-game-card-rotator\"]": {
+	transform: "none",
+	transition: "none",
+	"& > [data-ui=\"flip-game-card-back\"]": { transform: "none" }
+} }), m = e({
+	"&[data-reduced-motion=\"true\"]": p,
+	[t]: p
+}), h = e({
+	position: "relative",
+	inlineSize: "100%",
+	blockSize: "100%",
+	transformStyle: "preserve-3d",
+	transform: "rotateY(0deg)",
+	transition: `transform ${o.motion.duration.slow} ${o.motion.easeStandard}`,
+	"&[data-state=\"back\"]": { transform: "rotateY(180deg)" }
+}), g = e({
+	position: "absolute",
+	inset: 0,
+	backfaceVisibility: "hidden",
+	"&[aria-hidden=\"true\"]": { visibility: "hidden" },
+	"& > [data-ui=\"game-card\"]": {
+		inlineSize: "100%",
+		blockSize: "100%"
+	}
+}), _ = e({ transform: "rotateY(180deg)" });
+function v({ ref: e, flipped: t, front: r, back: o, size: p = "md", slotProps: v, className: y, sx: b, ...x }) {
+	let S = u(), [C, w] = a(!1);
+	i(() => w(!0), []);
+	let T = t ? "back" : "front";
+	return /* @__PURE__ */ s(l, {
+		reducedMotion: "user",
+		children: /* @__PURE__ */ s(n, {
+			className: y,
+			styles: [
+				d,
+				f[p],
+				m
+			],
+			sx: b,
+			children: (n) => /* @__PURE__ */ s("div", {
+				...x,
+				ref: e,
+				className: n,
+				"data-ui": "flip-game-card",
+				"data-state": T,
+				"data-size": p,
+				"data-reduced-motion": C && S || void 0,
+				children: /* @__PURE__ */ c("div", {
+					"data-ui": "flip-game-card-rotator",
+					"data-state": T,
+					className: v?.rotator?.className,
+					css: [h, v?.rotator?.css],
+					children: [/* @__PURE__ */ s("div", {
+						"data-ui": "flip-game-card-front",
+						inert: t,
+						"aria-hidden": t || void 0,
+						className: v?.front?.className,
+						css: [g, v?.front?.css],
+						children: r
+					}), /* @__PURE__ */ s("div", {
+						"data-ui": "flip-game-card-back",
+						inert: !t,
+						"aria-hidden": !t || void 0,
+						className: v?.back?.className,
+						css: [
+							g,
+							_,
+							v?.back?.css
+						],
+						children: o
+					})]
+				})
+			})
+		})
+	});
+}
+v.displayName = "FlipGameCard";
+//#endregion
+export { v as t };

package/dist/flip-game-card.js

@@ -0,0 +1,2 @@
+'use client';
+export { t as FlipGameCard } from "./flip-game-card-xmcR_QSq.js";