@particle-academy/react-fancy 5.12.0 → 5.13.1

package/dist/chunk-KC6QBKKB.cjs

@@ -0,0 +1,173 @@
+'use strict';
+
+var chunk3Z6ALUWP_cjs = require('./chunk-3Z6ALUWP.cjs');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+var CardHeader = react.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        "data-react-fancy-card-header": "",
+        className: chunk3Z6ALUWP_cjs.cn(
+          "border-b border-zinc-200 dark:border-zinc-700",
+          className
+        ),
+        ...props,
+        children
+      }
+    );
+  }
+);
+CardHeader.displayName = "CardHeader";
+var CardBody = react.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        "data-react-fancy-card-body": "",
+        className: chunk3Z6ALUWP_cjs.cn(className),
+        ...props,
+        children
+      }
+    );
+  }
+);
+CardBody.displayName = "CardBody";
+var CardFooter = react.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        "data-react-fancy-card-footer": "",
+        className: chunk3Z6ALUWP_cjs.cn(
+          "border-t border-zinc-200 dark:border-zinc-700",
+          className
+        ),
+        ...props,
+        children
+      }
+    );
+  }
+);
+CardFooter.displayName = "CardFooter";
+var CardMedia = react.forwardRef(
+  ({
+    src,
+    alt = "",
+    ratio = "16/9",
+    height,
+    background,
+    objectPosition = "center",
+    loading = "lazy",
+    topLeft,
+    topRight,
+    bottomLeft,
+    bottomRight,
+    className,
+    style,
+    children,
+    ...props
+  }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        "data-react-fancy-card-media": "",
+        className: chunk3Z6ALUWP_cjs.cn(
+          "relative overflow-hidden rounded-t-lg",
+          // Card's `padding` prop pads EVERY direct div child
+          // (`[&>div]:px-4 …`), which would inset the media and break the
+          // flush-to-the-edge look every caller wants. `!` wins regardless of
+          // stylesheet order, which plain `p-0` would not.
+          "!px-0 !py-0",
+          className
+        ),
+        style: {
+          ...height === void 0 ? { aspectRatio: ratio } : { height },
+          ...background ? { background } : null,
+          ...style
+        },
+        ...props,
+        children: [
+          src ? /* @__PURE__ */ jsxRuntime.jsx(
+            "img",
+            {
+              src,
+              alt,
+              loading,
+              className: "absolute inset-0 h-full w-full object-cover",
+              style: { objectPosition }
+            }
+          ) : null,
+          children,
+          topLeft ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute left-2 top-2 z-10", children: topLeft }) : null,
+          topRight ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute right-2 top-2 z-10", children: topRight }) : null,
+          bottomLeft ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute bottom-2 left-2 z-10", children: bottomLeft }) : null,
+          bottomRight ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute bottom-2 right-2 z-10", children: bottomRight }) : null
+        ]
+      }
+    );
+  }
+);
+CardMedia.displayName = "CardMedia";
+var variantClasses = {
+  outlined: "border border-zinc-200 dark:border-zinc-700",
+  elevated: "shadow-md border border-zinc-100 dark:border-zinc-800",
+  flat: "bg-zinc-50 dark:bg-zinc-800/50"
+};
+var paddingClasses = {
+  none: "",
+  sm: "[&>div]:px-3 [&>div]:py-2",
+  md: "[&>div]:px-4 [&>div]:py-3",
+  lg: "[&>div]:px-6 [&>div]:py-4"
+};
+var CardRoot = react.forwardRef(
+  ({
+    variant = "outlined",
+    padding = "md",
+    interactive = false,
+    className,
+    children,
+    ...props
+  }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        "data-react-fancy-card": "",
+        className: chunk3Z6ALUWP_cjs.cn(
+          "rounded-lg bg-white dark:bg-zinc-900",
+          variantClasses[variant],
+          // `overflow-hidden` is part of `interactive` rather than always-on:
+          // clipping unconditionally would cut off popovers and dropdowns that
+          // legitimately overflow a static card.
+          interactive && "overflow-hidden transition hover:-translate-y-0.5 hover:shadow-lg hover:border-zinc-300 dark:hover:border-zinc-600",
+          paddingClasses[padding],
+          className
+        ),
+        ...props,
+        children
+      }
+    );
+  }
+);
+CardRoot.displayName = "Card";
+var Card = Object.assign(CardRoot, {
+  Media: CardMedia,
+  Header: CardHeader,
+  Body: CardBody,
+  Footer: CardFooter
+});
+
+exports.Card = Card;
+exports.CardBody = CardBody;
+exports.CardFooter = CardFooter;
+exports.CardHeader = CardHeader;
+exports.CardMedia = CardMedia;
+//# sourceMappingURL=chunk-KC6QBKKB.cjs.map
+//# sourceMappingURL=chunk-KC6QBKKB.cjs.map

package/dist/chunk-KC6QBKKB.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Card/CardHeader.tsx","../src/components/Card/CardBody.tsx","../src/components/Card/CardFooter.tsx","../src/components/Card/CardMedia.tsx","../src/components/Card/Card.tsx"],"names":["forwardRef","jsx","cn","jsxs"],"mappings":"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","file":"chunk-KC6QBKKB.cjs","sourcesContent":["import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { CardHeaderProps } from \"./Card.types\";\n\nexport const CardHeader = forwardRef<HTMLDivElement, CardHeaderProps>(\n  ({ className, children, ...props }, ref) => {\n    return (\n      <div\n        ref={ref}\n        data-react-fancy-card-header=\"\"\n        className={cn(\n          \"border-b border-zinc-200 dark:border-zinc-700\",\n          className,\n        )}\n        {...props}\n      >\n        {children}\n      </div>\n    );\n  },\n);\n\nCardHeader.displayName = \"CardHeader\";\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { CardBodyProps } from \"./Card.types\";\n\nexport const CardBody = forwardRef<HTMLDivElement, CardBodyProps>(\n  ({ className, children, ...props }, ref) => {\n    return (\n      <div\n        ref={ref}\n        data-react-fancy-card-body=\"\"\n        className={cn(className)}\n        {...props}\n      >\n        {children}\n      </div>\n    );\n  },\n);\n\nCardBody.displayName = \"CardBody\";\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { CardFooterProps } from \"./Card.types\";\n\nexport const CardFooter = forwardRef<HTMLDivElement, CardFooterProps>(\n  ({ className, children, ...props }, ref) => {\n    return (\n      <div\n        ref={ref}\n        data-react-fancy-card-footer=\"\"\n        className={cn(\n          \"border-t border-zinc-200 dark:border-zinc-700\",\n          className,\n        )}\n        {...props}\n      >\n        {children}\n      </div>\n    );\n  },\n);\n\nCardFooter.displayName = \"CardFooter\";\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { CardMediaProps } from \"./Card.types\";\n\n/**\n * The fixed-ratio media region at the top of a card: a thumbnail, gradient or\n * solid swatch, with slots pinned to its corners.\n *\n * This is `Card.Media` rather than a separate `<MediaCard>` because the thing\n * being asked for was never a different card — it was a card with a picture in\n * it. Four surfaces had each rebuilt exactly this (a gallery index, a package\n * grid, a starter-kit grid and a showcase grid) and one of them was already\n * wrapping `Card` and hand-rolling only this region.\n *\n * ## The `background` is not decoration\n *\n * It shows through while the image loads and stays visible if the image never\n * arrives. The gallery relied on that: each style card is keyed to a swatch, so\n * a missing screenshot degrades to the right colour rather than to a hole.\n */\nexport const CardMedia = forwardRef<HTMLDivElement, CardMediaProps>(\n  (\n    {\n      src,\n      alt = \"\",\n      ratio = \"16/9\",\n      height,\n      background,\n      objectPosition = \"center\",\n      loading = \"lazy\",\n      topLeft,\n      topRight,\n      bottomLeft,\n      bottomRight,\n      className,\n      style,\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    return (\n      <div\n        ref={ref}\n        data-react-fancy-card-media=\"\"\n        className={cn(\n          \"relative overflow-hidden rounded-t-lg\",\n          // Card's `padding` prop pads EVERY direct div child\n          // (`[&>div]:px-4 …`), which would inset the media and break the\n          // flush-to-the-edge look every caller wants. `!` wins regardless of\n          // stylesheet order, which plain `p-0` would not.\n          \"!px-0 !py-0\",\n          className,\n        )}\n        style={{\n          ...(height === undefined ? { aspectRatio: ratio } : { height }),\n          ...(background ? { background } : null),\n          ...style,\n        }}\n        {...props}\n      >\n        {src ? (\n          <img\n            src={src}\n            alt={alt}\n            loading={loading}\n            className=\"absolute inset-0 h-full w-full object-cover\"\n            style={{ objectPosition }}\n          />\n        ) : null}\n\n        {children}\n\n        {topLeft ? <span className=\"absolute left-2 top-2 z-10\">{topLeft}</span> : null}\n        {topRight ? <span className=\"absolute right-2 top-2 z-10\">{topRight}</span> : null}\n        {bottomLeft ? <span className=\"absolute bottom-2 left-2 z-10\">{bottomLeft}</span> : null}\n        {bottomRight ? <span className=\"absolute bottom-2 right-2 z-10\">{bottomRight}</span> : null}\n      </div>\n    );\n  },\n);\n\nCardMedia.displayName = \"CardMedia\";\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { CardHeader } from \"./CardHeader\";\nimport { CardBody } from \"./CardBody\";\nimport { CardFooter } from \"./CardFooter\";\nimport { CardMedia } from \"./CardMedia\";\nimport type { CardProps } from \"./Card.types\";\n\nconst variantClasses: Record<NonNullable<CardProps[\"variant\"]>, string> = {\n  outlined: \"border border-zinc-200 dark:border-zinc-700\",\n  elevated: \"shadow-md border border-zinc-100 dark:border-zinc-800\",\n  flat: \"bg-zinc-50 dark:bg-zinc-800/50\",\n};\n\nconst paddingClasses: Record<NonNullable<CardProps[\"padding\"]>, string> = {\n  none: \"\",\n  sm: \"[&>div]:px-3 [&>div]:py-2\",\n  md: \"[&>div]:px-4 [&>div]:py-3\",\n  lg: \"[&>div]:px-6 [&>div]:py-4\",\n};\n\nconst CardRoot = forwardRef<HTMLDivElement, CardProps>(\n  (\n    {\n      variant = \"outlined\",\n      padding = \"md\",\n      interactive = false,\n      className,\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    return (\n      <div\n        ref={ref}\n        data-react-fancy-card=\"\"\n        className={cn(\n          \"rounded-lg bg-white dark:bg-zinc-900\",\n          variantClasses[variant],\n          // `overflow-hidden` is part of `interactive` rather than always-on:\n          // clipping unconditionally would cut off popovers and dropdowns that\n          // legitimately overflow a static card.\n          interactive &&\n            \"overflow-hidden transition hover:-translate-y-0.5 hover:shadow-lg hover:border-zinc-300 dark:hover:border-zinc-600\",\n          paddingClasses[padding],\n          className,\n        )}\n        {...props}\n      >\n        {children}\n      </div>\n    );\n  },\n);\n\nCardRoot.displayName = \"Card\";\n\nexport const Card = Object.assign(CardRoot, {\n  Media: CardMedia,\n  Header: CardHeader,\n  Body: CardBody,\n  Footer: CardFooter,\n});\n"]}

package/dist/chunk-KE7KXY5C.cjs

@@ -0,0 +1,233 @@
+'use strict';
+
+var chunk3ETOEEVN_cjs = require('./chunk-3ETOEEVN.cjs');
+var chunkJHEM6IGT_cjs = require('./chunk-JHEM6IGT.cjs');
+var chunkAC7M7JDO_cjs = require('./chunk-AC7M7JDO.cjs');
+var chunk3GRC5J2L_cjs = require('./chunk-3GRC5J2L.cjs');
+var chunk3Z6ALUWP_cjs = require('./chunk-3Z6ALUWP.cjs');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/utils/media-type.ts
+var IMAGE_EXTS = /* @__PURE__ */ new Set([
+  "png",
+  "jpg",
+  "jpeg",
+  "jfif",
+  "pjpeg",
+  "gif",
+  "webp",
+  "avif",
+  "bmp",
+  "ico",
+  "cur",
+  "svg",
+  "svgz",
+  "apng",
+  "tif",
+  "tiff",
+  "heic",
+  "heif"
+]);
+var VIDEO_EXTS = /* @__PURE__ */ new Set([
+  "mp4",
+  "m4v",
+  "webm",
+  "ogv",
+  "ogm",
+  "mov",
+  "mkv",
+  "avi",
+  "wmv",
+  "flv",
+  "3gp",
+  "3g2",
+  "mpg",
+  "mpeg"
+]);
+var AUDIO_EXTS = /* @__PURE__ */ new Set([
+  "mp3",
+  "wav",
+  "wave",
+  "ogg",
+  "oga",
+  "m4a",
+  "m4b",
+  "aac",
+  "flac",
+  "opus",
+  "weba",
+  "mid",
+  "midi",
+  "aiff",
+  "aif"
+]);
+function mimeToKind(mime) {
+  const m = mime.toLowerCase().split(";")[0].trim();
+  if (!m) return "unknown";
+  if (m === "application/pdf" || m === "application/x-pdf") return "pdf";
+  if (m.startsWith("image/")) return "image";
+  if (m.startsWith("video/")) return "video";
+  if (m.startsWith("audio/")) return "audio";
+  if (m === "application/ogg") return "audio";
+  return "unknown";
+}
+function extToKind(ext) {
+  const e = ext.toLowerCase();
+  if (e === "pdf") return "pdf";
+  if (IMAGE_EXTS.has(e)) return "image";
+  if (VIDEO_EXTS.has(e)) return "video";
+  if (AUDIO_EXTS.has(e)) return "audio";
+  return "unknown";
+}
+function extFromSrc(src) {
+  const clean = src.split(/[?#]/, 1)[0];
+  const lastSeg = clean.split("/").pop() ?? "";
+  const dot = lastSeg.lastIndexOf(".");
+  if (dot <= 0 || dot === lastSeg.length - 1) return null;
+  return lastSeg.slice(dot + 1);
+}
+function mimeFromDataUri(src) {
+  if (!/^data:/i.test(src)) return null;
+  const header = src.slice(5).split(",", 1)[0];
+  const mt = header.split(";")[0].trim();
+  return mt || null;
+}
+function resolveMediaType({ mime, src }) {
+  if (mime) {
+    const k = mimeToKind(mime);
+    if (k !== "unknown") return k;
+  }
+  if (src) {
+    const dataMime = mimeFromDataUri(src);
+    if (dataMime) {
+      const k = mimeToKind(dataMime);
+      if (k !== "unknown") return k;
+    }
+    const ext = extFromSrc(src);
+    if (ext) return extToKind(ext);
+  }
+  return "unknown";
+}
+function basename(src) {
+  if (/^(data|blob):/i.test(src)) return null;
+  const seg = src.split(/[?#]/, 1)[0].split("/").pop();
+  return seg ? decodeURIComponent(seg) : null;
+}
+function MediaFallback({ src, mime, label, className }) {
+  const name = label || basename(src);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      "data-react-fancy-media-fallback": "",
+      className: chunk3Z6ALUWP_cjs.cn(
+        "flex flex-col items-center justify-center gap-2 rounded-lg border border-zinc-200 bg-white p-6 text-center dark:border-zinc-700 dark:bg-zinc-900",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium text-zinc-700 dark:text-zinc-200", children: "No preview available" }),
+        (name || mime) && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "max-w-full truncate text-xs text-zinc-500 dark:text-zinc-400", children: [
+          name,
+          name && mime ? " \xB7 " : "",
+          mime
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "a",
+          {
+            href: src,
+            download: name ?? void 0,
+            className: "text-xs font-medium text-blue-600 hover:underline dark:text-blue-400",
+            children: "Download"
+          }
+        )
+      ]
+    }
+  );
+}
+var MediaViewer = react.forwardRef(
+  ({
+    src,
+    mime,
+    alt,
+    kind,
+    imageProps,
+    videoProps,
+    audioProps,
+    pdfProps,
+    fallback,
+    onError,
+    className,
+    style
+  }, ref) => {
+    const resolved = kind ?? resolveMediaType({ mime, src });
+    switch (resolved) {
+      case "image":
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          chunkAC7M7JDO_cjs.ImageViewer,
+          {
+            ref,
+            src,
+            alt: alt ?? "",
+            onError,
+            className,
+            style,
+            ...imageProps
+          }
+        );
+      case "video":
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          chunk3ETOEEVN_cjs.VideoViewer,
+          {
+            ref,
+            src,
+            onError,
+            className,
+            style,
+            ...videoProps
+          }
+        );
+      case "audio":
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          chunk3GRC5J2L_cjs.AudioViewer,
+          {
+            ref,
+            src,
+            title: alt,
+            onError,
+            className,
+            style,
+            ...audioProps
+          }
+        );
+      case "pdf":
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          chunkJHEM6IGT_cjs.PdfViewer,
+          {
+            ref,
+            src,
+            title: alt,
+            className,
+            style,
+            ...pdfProps
+          }
+        );
+      default:
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            ref,
+            "data-react-fancy-media-viewer": "",
+            className,
+            style,
+            children: fallback ?? /* @__PURE__ */ jsxRuntime.jsx(MediaFallback, { src, mime, label: alt })
+          }
+        );
+    }
+  }
+);
+MediaViewer.displayName = "MediaViewer";
+
+exports.MediaViewer = MediaViewer;
+exports.resolveMediaType = resolveMediaType;
+//# sourceMappingURL=chunk-KE7KXY5C.cjs.map
+//# sourceMappingURL=chunk-KE7KXY5C.cjs.map

package/dist/chunk-KE7KXY5C.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/utils/media-type.ts","../src/components/MediaViewer/MediaFallback.tsx","../src/components/MediaViewer/MediaViewer.tsx"],"names":["jsxs","cn","jsx","forwardRef","ImageViewer","VideoViewer","AudioViewer","PdfViewer"],"mappings":"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","file":"chunk-KE7KXY5C.cjs","sourcesContent":["/**\n * Resolve what kind of media a source is, from its MIME type (preferred) or its\n * URL — a file extension, or the type embedded in a `data:` URI.\n *\n * Shared by `<MediaViewer>` to pick the right per-type viewer, and exported so\n * downstream packages (e.g. fancy-code's file viewer) can make the same\n * text-vs-media decision without re-deriving the table.\n */\n\nexport type MediaKind = \"image\" | \"video\" | \"audio\" | \"pdf\" | \"unknown\";\n\nexport interface ResolveMediaTypeInput {\n  /** MIME type — preferred when known (e.g. `\"image/png\"`, `\"video/mp4\"`). */\n  mime?: string | null;\n  /**\n   * Source URL — used to sniff the kind from a file extension, or from the type\n   * embedded in a `data:` URI, when no `mime` is given. `http(s):` / `data:` /\n   * `blob:` are all accepted (a bare `blob:` URL carries no type, so pass\n   * `mime` alongside it).\n   */\n  src?: string | null;\n}\n\nconst IMAGE_EXTS = new Set([\n  \"png\", \"jpg\", \"jpeg\", \"jfif\", \"pjpeg\", \"gif\", \"webp\", \"avif\", \"bmp\", \"ico\",\n  \"cur\", \"svg\", \"svgz\", \"apng\", \"tif\", \"tiff\", \"heic\", \"heif\",\n]);\nconst VIDEO_EXTS = new Set([\n  \"mp4\", \"m4v\", \"webm\", \"ogv\", \"ogm\", \"mov\", \"mkv\", \"avi\", \"wmv\", \"flv\", \"3gp\",\n  \"3g2\", \"mpg\", \"mpeg\",\n]);\nconst AUDIO_EXTS = new Set([\n  \"mp3\", \"wav\", \"wave\", \"ogg\", \"oga\", \"m4a\", \"m4b\", \"aac\", \"flac\", \"opus\",\n  \"weba\", \"mid\", \"midi\", \"aiff\", \"aif\",\n]);\n\n/** Map a (possibly parameterized) MIME type to a media kind. */\nfunction mimeToKind(mime: string): MediaKind {\n  // Strip any parameters (`; charset=…`) and normalize.\n  const m = mime.toLowerCase().split(\";\")[0].trim();\n  if (!m) return \"unknown\";\n  if (m === \"application/pdf\" || m === \"application/x-pdf\") return \"pdf\";\n  if (m.startsWith(\"image/\")) return \"image\";\n  if (m.startsWith(\"video/\")) return \"video\";\n  if (m.startsWith(\"audio/\")) return \"audio\";\n  // `application/ogg` is audio in practice; treat it as such.\n  if (m === \"application/ogg\") return \"audio\";\n  return \"unknown\";\n}\n\n/** Map a bare file extension (no leading dot) to a media kind. */\nfunction extToKind(ext: string): MediaKind {\n  const e = ext.toLowerCase();\n  if (e === \"pdf\") return \"pdf\";\n  if (IMAGE_EXTS.has(e)) return \"image\";\n  if (VIDEO_EXTS.has(e)) return \"video\";\n  if (AUDIO_EXTS.has(e)) return \"audio\";\n  return \"unknown\";\n}\n\n/** Pull the file extension out of a URL, ignoring its query/hash. */\nfunction extFromSrc(src: string): string | null {\n  const clean = src.split(/[?#]/, 1)[0];\n  const lastSeg = clean.split(\"/\").pop() ?? \"\";\n  const dot = lastSeg.lastIndexOf(\".\");\n  if (dot <= 0 || dot === lastSeg.length - 1) return null;\n  return lastSeg.slice(dot + 1);\n}\n\n/** Extract the MIME type embedded in a `data:` URI, if present. */\nfunction mimeFromDataUri(src: string): string | null {\n  if (!/^data:/i.test(src)) return null;\n  const header = src.slice(5).split(\",\", 1)[0]; // text after `data:`, before the comma\n  const mt = header.split(\";\")[0].trim();\n  return mt || null;\n}\n\n/**\n * Resolve a {@link MediaKind} from a MIME type and/or source URL. MIME wins\n * when it's conclusive; otherwise the `src` is sniffed (a `data:` URI's\n * embedded type first, then the file extension). Returns `\"unknown\"` when\n * nothing matches — callers treat that as \"not previewable media\" (e.g. text).\n */\nexport function resolveMediaType({ mime, src }: ResolveMediaTypeInput): MediaKind {\n  if (mime) {\n    const k = mimeToKind(mime);\n    if (k !== \"unknown\") return k;\n  }\n  if (src) {\n    const dataMime = mimeFromDataUri(src);\n    if (dataMime) {\n      const k = mimeToKind(dataMime);\n      if (k !== \"unknown\") return k;\n    }\n    const ext = extFromSrc(src);\n    if (ext) return extToKind(ext);\n  }\n  return \"unknown\";\n}\n","import { cn } from \"../../utils/cn\";\n\ninterface MediaFallbackProps {\n  src: string;\n  mime?: string;\n  label?: string;\n  className?: string;\n}\n\n/** Filename guess from a URL, ignoring query/hash and `data:`/`blob:` URLs. */\nfunction basename(src: string): string | null {\n  if (/^(data|blob):/i.test(src)) return null;\n  const seg = src.split(/[?#]/, 1)[0].split(\"/\").pop();\n  return seg ? decodeURIComponent(seg) : null;\n}\n\n/**\n * Shown by `<MediaViewer>` when a source isn't a previewable media type — a\n * small themed card naming the file and offering a download.\n */\nexport function MediaFallback({ src, mime, label, className }: MediaFallbackProps) {\n  const name = label || basename(src);\n  return (\n    <div\n      data-react-fancy-media-fallback=\"\"\n      className={cn(\n        \"flex flex-col items-center justify-center gap-2 rounded-lg border border-zinc-200 bg-white p-6 text-center dark:border-zinc-700 dark:bg-zinc-900\",\n        className,\n      )}\n    >\n      <span className=\"text-sm font-medium text-zinc-700 dark:text-zinc-200\">\n        No preview available\n      </span>\n      {(name || mime) && (\n        <span className=\"max-w-full truncate text-xs text-zinc-500 dark:text-zinc-400\">\n          {name}\n          {name && mime ? \" · \" : \"\"}\n          {mime}\n        </span>\n      )}\n      <a\n        href={src}\n        download={name ?? undefined}\n        className=\"text-xs font-medium text-blue-600 hover:underline dark:text-blue-400\"\n      >\n        Download\n      </a>\n    </div>\n  );\n}\n","import { forwardRef } from \"react\";\nimport { resolveMediaType } from \"../../utils/media-type\";\nimport { ImageViewer } from \"../ImageViewer\";\nimport { VideoViewer } from \"../VideoViewer\";\nimport { AudioViewer } from \"../AudioViewer\";\nimport { PdfViewer } from \"../PdfViewer\";\nimport { MediaFallback } from \"./MediaFallback\";\nimport type { MediaViewerProps } from \"./MediaViewer.types\";\n\n/**\n * Renders the right viewer for a media file, picked from its `mime` (preferred)\n * or `src` — image, video, audio, or PDF — and a download fallback for anything\n * else. SVG renders through `<ImageViewer>`. The single entry point for showing\n * a file from a tree/workspace when you don't know its type ahead of time.\n *\n * ```tsx\n * <MediaViewer src={url} mime=\"image/png\" alt=\"logo.png\" style={{ height: 320 }} />\n * ```\n */\nexport const MediaViewer = forwardRef<HTMLDivElement, MediaViewerProps>(\n  (\n    {\n      src,\n      mime,\n      alt,\n      kind,\n      imageProps,\n      videoProps,\n      audioProps,\n      pdfProps,\n      fallback,\n      onError,\n      className,\n      style,\n    },\n    ref,\n  ) => {\n    const resolved = kind ?? resolveMediaType({ mime, src });\n\n    switch (resolved) {\n      case \"image\":\n        return (\n          <ImageViewer\n            ref={ref}\n            src={src}\n            alt={alt ?? \"\"}\n            onError={onError}\n            className={className}\n            style={style}\n            {...imageProps}\n          />\n        );\n      case \"video\":\n        return (\n          <VideoViewer\n            ref={ref}\n            src={src}\n            onError={onError}\n            className={className}\n            style={style}\n            {...videoProps}\n          />\n        );\n      case \"audio\":\n        return (\n          <AudioViewer\n            ref={ref}\n            src={src}\n            title={alt}\n            onError={onError}\n            className={className}\n            style={style}\n            {...audioProps}\n          />\n        );\n      case \"pdf\":\n        return (\n          <PdfViewer\n            ref={ref}\n            src={src}\n            title={alt}\n            className={className}\n            style={style}\n            {...pdfProps}\n          />\n        );\n      default:\n        return (\n          <div\n            ref={ref}\n            data-react-fancy-media-viewer=\"\"\n            className={className}\n            style={style}\n          >\n            {fallback ?? <MediaFallback src={src} mime={mime} label={alt} />}\n          </div>\n        );\n    }\n  },\n);\n\nMediaViewer.displayName = \"MediaViewer\";\n"]}

package/dist/chunk-KICZTIZL.cjs

@@ -0,0 +1,133 @@
+'use strict';
+
+var chunkYLGTDBB2_cjs = require('./chunk-YLGTDBB2.cjs');
+var chunkKJ22KE56_cjs = require('./chunk-KJ22KE56.cjs');
+var chunkL3V3BYVS_cjs = require('./chunk-L3V3BYVS.cjs');
+var chunkOUOEQZHY_cjs = require('./chunk-OUOEQZHY.cjs');
+var chunk3Z6ALUWP_cjs = require('./chunk-3Z6ALUWP.cjs');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+var Checkbox = react.forwardRef(
+  ({
+    size = "md",
+    dirty,
+    error,
+    label,
+    description,
+    required,
+    disabled,
+    className,
+    id,
+    name,
+    checked: controlledChecked,
+    defaultChecked = false,
+    onCheckedChange,
+    indeterminate,
+    mode,
+    ...rest
+  }, ref) => {
+    const autoId = react.useId();
+    const checkboxId = id ?? autoId;
+    const internalRef = react.useRef(null);
+    const resolvedMode = chunkL3V3BYVS_cjs.useFieldMode(mode);
+    const { showControl, interactive, enterEdit, exitEdit } = chunkKJ22KE56_cjs.useInlineEdit(resolvedMode, disabled);
+    const [checked, setChecked] = chunkOUOEQZHY_cjs.useControllableState(
+      controlledChecked,
+      defaultChecked,
+      onCheckedChange
+    );
+    react.useEffect(() => {
+      const el = internalRef.current;
+      if (el) {
+        el.indeterminate = indeterminate ?? false;
+      }
+    }, [indeterminate]);
+    const sizeClasses = {
+      xs: "h-3.5 w-3.5",
+      sm: "h-4 w-4",
+      md: "h-[18px] w-[18px]",
+      lg: "h-5 w-5",
+      xl: "h-6 w-6"
+    }[size];
+    const glyph = indeterminate ? "\u2014" : checked ? "\u2713" : "\u2715";
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { ...rest, "data-react-fancy-checkbox": "", className: chunk3Z6ALUWP_cjs.cn("flex items-start gap-2", className), children: [
+      !showControl ? /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          "data-react-fancy-display": "",
+          "data-mode": "view",
+          role: interactive ? "button" : void 0,
+          tabIndex: interactive ? 0 : void 0,
+          title: interactive ? "Click to edit" : void 0,
+          onClick: interactive ? enterEdit : void 0,
+          onKeyDown: interactive ? (e) => {
+            if (e.key === "Enter" || e.key === " ") {
+              e.preventDefault();
+              enterEdit();
+            }
+          } : void 0,
+          className: chunk3Z6ALUWP_cjs.cn(
+            "flex shrink-0 items-center justify-center text-zinc-700 dark:text-zinc-200",
+            sizeClasses,
+            interactive && "cursor-pointer rounded outline-none transition-colors hover:text-zinc-900 focus-visible:ring-2 focus-visible:ring-blue-500/40 dark:hover:text-white"
+          ),
+          "aria-hidden": interactive ? void 0 : "true",
+          children: glyph
+        }
+      ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative flex items-center", children: /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          ref: (node) => {
+            internalRef.current = node;
+            if (typeof ref === "function") {
+              ref(node);
+            } else if (ref) {
+              ref.current = node;
+            }
+          },
+          id: checkboxId,
+          type: "checkbox",
+          name,
+          disabled,
+          required,
+          checked,
+          autoFocus: interactive,
+          onBlur: () => {
+            if (interactive) exitEdit();
+          },
+          onChange: (e) => setChecked(e.target.checked),
+          className: chunk3Z6ALUWP_cjs.cn(
+            sizeClasses,
+            "cursor-pointer rounded border border-zinc-300 bg-white text-blue-600 transition-[border-color,box-shadow] duration-150 focus:ring-2 focus:ring-blue-500/40 focus:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50 dark:border-zinc-700 dark:bg-[#1e1e24]",
+            chunkYLGTDBB2_cjs.dirtyRingClasses(dirty),
+            error && "border-red-500"
+          )
+        }
+      ) }),
+      (label || description) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
+        label && /* @__PURE__ */ jsxRuntime.jsxs(
+          "label",
+          {
+            htmlFor: checkboxId,
+            className: chunk3Z6ALUWP_cjs.cn(
+              "cursor-pointer text-sm text-zinc-700 dark:text-zinc-100",
+              disabled && "cursor-not-allowed opacity-50"
+            ),
+            children: [
+              label,
+              required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-0.5 text-red-500", children: "*" })
+            ]
+          }
+        ),
+        description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-zinc-500 dark:text-zinc-400", children: description }),
+        error && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-red-500", children: error })
+      ] })
+    ] });
+  }
+);
+Checkbox.displayName = "Checkbox";
+
+exports.Checkbox = Checkbox;
+//# sourceMappingURL=chunk-KICZTIZL.cjs.map
+//# sourceMappingURL=chunk-KICZTIZL.cjs.map

package/dist/chunk-KICZTIZL.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/inputs/Checkbox/Checkbox.tsx"],"names":["forwardRef","useId","useRef","useFieldMode","useInlineEdit","useControllableState","useEffect","jsxs","cn","jsx","dirtyRingClasses"],"mappings":"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","file":"chunk-KICZTIZL.cjs","sourcesContent":["import { forwardRef, useEffect, useId, useRef } from \"react\";\nimport { cn } from \"../../../utils/cn\";\nimport { useControllableState } from \"../../../hooks/use-controllable-state\";\nimport { useFieldMode } from \"../mode/FieldMode.context\";\nimport { useInlineEdit } from \"../mode/useInlineEdit\";\nimport { dirtyRingClasses } from \"../inputs.utils\";\nimport type { CheckboxProps } from \"./Checkbox.types\";\n\nexport const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(\n  (\n    {\n      size = \"md\",\n      dirty,\n      error,\n      label,\n      description,\n      required,\n      disabled,\n      className,\n      id,\n      name,\n      checked: controlledChecked,\n      defaultChecked = false,\n      onCheckedChange,\n      indeterminate,\n      mode,\n      ...rest\n    },\n    ref,\n  ) => {\n    const autoId = useId();\n    const checkboxId = id ?? autoId;\n    const internalRef = useRef<HTMLInputElement | null>(null);\n    const resolvedMode = useFieldMode(mode);\n    const { showControl, interactive, enterEdit, exitEdit } = useInlineEdit(resolvedMode, disabled);\n    const [checked, setChecked] = useControllableState(\n      controlledChecked,\n      defaultChecked,\n      onCheckedChange,\n    );\n\n    useEffect(() => {\n      const el = internalRef.current;\n      if (el) {\n        el.indeterminate = indeterminate ?? false;\n      }\n    }, [indeterminate]);\n\n    const sizeClasses = {\n      xs: \"h-3.5 w-3.5\",\n      sm: \"h-4 w-4\",\n      md: \"h-[18px] w-[18px]\",\n      lg: \"h-5 w-5\",\n      xl: \"h-6 w-6\",\n    }[size];\n\n    const glyph = indeterminate ? \"—\" : checked ? \"✓\" : \"✕\";\n\n    return (\n      <div {...rest} data-react-fancy-checkbox=\"\" className={cn(\"flex items-start gap-2\", className)}>\n        {!showControl ? (\n          <span\n            data-react-fancy-display=\"\"\n            data-mode=\"view\"\n            role={interactive ? \"button\" : undefined}\n            tabIndex={interactive ? 0 : undefined}\n            title={interactive ? \"Click to edit\" : undefined}\n            onClick={interactive ? enterEdit : undefined}\n            onKeyDown={\n              interactive\n                ? (e) => {\n                    if (e.key === \"Enter\" || e.key === \" \") {\n                      e.preventDefault();\n                      enterEdit();\n                    }\n                  }\n                : undefined\n            }\n            className={cn(\n              \"flex shrink-0 items-center justify-center text-zinc-700 dark:text-zinc-200\",\n              sizeClasses,\n              interactive &&\n                \"cursor-pointer rounded outline-none transition-colors hover:text-zinc-900 focus-visible:ring-2 focus-visible:ring-blue-500/40 dark:hover:text-white\",\n            )}\n            aria-hidden={interactive ? undefined : \"true\"}\n          >\n            {glyph}\n          </span>\n        ) : (\n        <div className=\"relative flex items-center\">\n          <input\n            ref={(node) => {\n              internalRef.current = node;\n              if (typeof ref === \"function\") {\n                ref(node);\n              } else if (ref) {\n                ref.current = node;\n              }\n            }}\n            id={checkboxId}\n            type=\"checkbox\"\n            name={name}\n            disabled={disabled}\n            required={required}\n            checked={checked}\n            autoFocus={interactive}\n            onBlur={() => {\n              if (interactive) exitEdit();\n            }}\n            onChange={(e) => setChecked(e.target.checked)}\n            className={cn(\n              sizeClasses,\n              \"cursor-pointer rounded border border-zinc-300 bg-white text-blue-600 transition-[border-color,box-shadow] duration-150 focus:ring-2 focus:ring-blue-500/40 focus:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50 dark:border-zinc-700 dark:bg-[#1e1e24]\",\n              dirtyRingClasses(dirty),\n              error && \"border-red-500\",\n            )}\n          />\n        </div>\n        )}\n        {(label || description) && (\n          <div className=\"flex flex-col\">\n            {label && (\n              <label\n                htmlFor={checkboxId}\n                className={cn(\n                  \"cursor-pointer text-sm text-zinc-700 dark:text-zinc-100\",\n                  disabled && \"cursor-not-allowed opacity-50\",\n                )}\n              >\n                {label}\n                {required && <span className=\"ml-0.5 text-red-500\">*</span>}\n              </label>\n            )}\n            {description && (\n              <span className=\"text-xs text-zinc-500 dark:text-zinc-400\">\n                {description}\n              </span>\n            )}\n            {error && <span className=\"text-xs text-red-500\">{error}</span>}\n          </div>\n        )}\n      </div>\n    );\n  },\n);\n\nCheckbox.displayName = \"Checkbox\";\n"]}

package/dist/chunk-KJ22KE56.cjs

@@ -0,0 +1,19 @@
+'use strict';
+
+var react = require('react');
+
+// src/components/inputs/mode/useInlineEdit.ts
+function useInlineEdit(mode, disabled) {
+  const [editing, setEditing] = react.useState(false);
+  const interactive = mode === "view" && !disabled;
+  const showControl = mode !== "view" || interactive && editing;
+  const enterEdit = react.useCallback(() => {
+    if (interactive) setEditing(true);
+  }, [interactive]);
+  const exitEdit = react.useCallback(() => setEditing(false), []);
+  return { showControl, interactive, enterEdit, exitEdit };
+}
+
+exports.useInlineEdit = useInlineEdit;
+//# sourceMappingURL=chunk-KJ22KE56.cjs.map
+//# sourceMappingURL=chunk-KJ22KE56.cjs.map

package/dist/chunk-KJ22KE56.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/inputs/mode/useInlineEdit.ts"],"names":["useState","useCallback"],"mappings":";;;;;AAwBO,SAAS,aAAA,CAAc,MAAiB,QAAA,EAAgC;AAC7E,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAIA,eAAS,KAAK,CAAA;AAC5C,EAAA,MAAM,WAAA,GAAc,IAAA,KAAS,MAAA,IAAU,CAAC,QAAA;AACxC,EAAA,MAAM,WAAA,GAAc,IAAA,KAAS,MAAA,IAAW,WAAA,IAAe,OAAA;AACvD,EAAA,MAAM,SAAA,GAAYC,kBAAY,MAAM;AAClC,IAAA,IAAI,WAAA,aAAwB,IAAI,CAAA;AAAA,EAClC,CAAA,EAAG,CAAC,WAAW,CAAC,CAAA;AAChB,EAAA,MAAM,WAAWA,iBAAA,CAAY,MAAM,WAAW,KAAK,CAAA,EAAG,EAAE,CAAA;AACxD,EAAA,OAAO,EAAE,WAAA,EAAa,WAAA,EAAa,SAAA,EAAW,QAAA,EAAS;AACzD","file":"chunk-KJ22KE56.cjs","sourcesContent":["import { useCallback, useState } from \"react\";\nimport type { FieldMode } from \"../inputs.types\";\n\nexport interface InlineEdit {\n  /** Render the editable control (`true`) vs. the read-only value display (`false`). */\n  showControl: boolean;\n  /** Whether view mode is interactive (click-to-edit) — i.e. `view` and not disabled. */\n  interactive: boolean;\n  /** Enter edit mode (no-op unless interactive). */\n  enterEdit: () => void;\n  /** Leave edit mode, back to the value display. */\n  exitEdit: () => void;\n}\n\n/**\n * Inline click-to-edit for `mode=\"view\"`. The bound value shows as clean static\n * text; clicking it swaps in the focused control; blur returns to the display\n * (the control's `onChange` / `onBlur` fire as usual, so a host can persist on\n * commit). `mode=\"edit\"` is always the control; a **disabled** view stays static\n * text (no click-to-edit).\n *\n * This is the value of \"view mode\": tidy read-only surfaces where each field\n * becomes editable only when the user reaches for it.\n */\nexport function useInlineEdit(mode: FieldMode, disabled?: boolean): InlineEdit {\n  const [editing, setEditing] = useState(false);\n  const interactive = mode === \"view\" && !disabled;\n  const showControl = mode !== \"view\" || (interactive && editing);\n  const enterEdit = useCallback(() => {\n    if (interactive) setEditing(true);\n  }, [interactive]);\n  const exitEdit = useCallback(() => setEditing(false), []);\n  return { showControl, interactive, enterEdit, exitEdit };\n}\n"]}