@burdenoff/microfe-vibecontrols 2026.524.4 → 2026.524.5

package/dist/components/catalog/CatalogCard.js

@@ -24,7 +24,7 @@ var g = {
 	let { t: y } = t(), b = (e, t) => {
 		let n = y(e);
 		return n === e ? t : n;
-	}, [x, S] = e(!1), C = g[i.visibility], w = C.icon;
+	}, [x, S] = e(!1), C = g[i.visibility] ?? g.PRIVATE, w = C.icon;
 	return /* @__PURE__ */ h(p.div, {
 		whileHover: {
 			y: -2,

package/dist/components/catalog/CatalogCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"CatalogCard.js","names":[],"sources":["../../../src/components/catalog/CatalogCard.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport { useState } from 'react';\nimport { motion, AnimatePresence } from 'framer-motion';\nimport {\n  BookOpen,\n  Eye,\n  EyeOff,\n  Globe,\n  Tag,\n  MoreVertical,\n  Settings,\n  Archive,\n  Layers,\n  Zap,\n} from 'lucide-react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\n\nexport interface CatalogCardData {\n  id: string;\n  name: string;\n  description: string | null;\n  visibility: 'PRIVATE' | 'INTERNAL' | 'PUBLIC';\n  componentCount: number;\n  vibeCount: number;\n  tags: string[];\n  createdAt: string;\n  updatedAt: string;\n}\n\nexport interface CatalogCardProps {\n  catalog: CatalogCardData;\n  onOpen?: (catalog: CatalogCardData) => void;\n  onEdit?: (catalog: CatalogCardData) => void;\n  onArchive?: (catalog: CatalogCardData) => void;\n  className?: string;\n}\n\nconst visibilityConfig = {\n  PRIVATE: { icon: EyeOff, label: 'Private', className: 'bg-bg-sunken text-text-secondary' },\n  INTERNAL: {\n    icon: Eye,\n    label: 'Internal',\n    className: 'bg-status-warning-bg text-status-warning-text',\n  },\n  PUBLIC: {\n    icon: Globe,\n    label: 'Public',\n    className: 'bg-status-success-bg text-status-success-text',\n  },\n};\n\nexport const CatalogCard: FC<CatalogCardProps> = ({\n  catalog,\n  onOpen,\n  onEdit,\n  onArchive,\n  className = '',\n}) => {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string) => {\n    const v = t(key);\n    return v === key ? fallback : v;\n  };\n  const [showMenu, setShowMenu] = useState(false);\n\n  const visConfig = visibilityConfig[catalog.visibility];\n  const VisIcon = visConfig.icon;\n\n  return (\n    <motion.div\n      whileHover={{ y: -2, transition: { duration: 0.15, ease: [0.4, 0, 0.2, 1] } }}\n      whileTap={{ scale: 0.98 }}\n      className={`bg-bg-surface border border-border-default rounded-lg p-4 hover:border-border-strong hover:shadow-md transition-all cursor-pointer ${className}`}\n      onClick={() => onOpen?.(catalog)}\n    >\n      <div className=\"flex items-start justify-between gap-2\">\n        <div className=\"flex items-start gap-2 sm:gap-3 min-w-0 flex-1\">\n          <div className=\"flex-shrink-0 w-8 h-8 sm:w-10 sm:h-10 rounded-lg bg-action-primary-bg/10 flex items-center justify-center\">\n            <BookOpen className=\"w-4 h-4 sm:w-5 sm:h-5 text-action-primary-bg\" />\n          </div>\n          <div className=\"min-w-0 flex-1\">\n            <h3 className=\"font-semibold text-text-primary truncate text-sm sm:text-base\">\n              {catalog.name}\n            </h3>\n            <div className=\"flex items-center gap-2 mt-0.5\">\n              <span\n                className={`inline-flex items-center gap-1 px-1.5 py-0.5 text-xs rounded ${visConfig.className}`}\n              >\n                <VisIcon className=\"w-3 h-3\" />\n                {tr(`catalog.visibility.${catalog.visibility.toLowerCase()}`, visConfig.label)}\n              </span>\n            </div>\n          </div>\n        </div>\n        {(onEdit || onArchive) && (\n          <div className=\"relative flex-shrink-0\">\n            <button\n              onClick={(e) => {\n                e.stopPropagation();\n                setShowMenu(!showMenu);\n              }}\n              className=\"p-1 sm:p-1.5 rounded hover:bg-bg-sunken transition-colors\"\n            >\n              <MoreVertical className=\"w-4 h-4 text-text-secondary\" />\n            </button>\n            <AnimatePresence>\n              {showMenu && (\n                <motion.div\n                  initial={{ opacity: 0, scale: 0.95, y: -4 }}\n                  animate={{ opacity: 1, scale: 1, y: 0 }}\n                  exit={{ opacity: 0, scale: 0.95, y: -4 }}\n                  transition={{ duration: 0.15 }}\n                  className=\"absolute right-0 mt-1 w-40 bg-bg-surface border border-border-default rounded-lg shadow-lg z-10\"\n                >\n                  {onEdit && (\n                    <motion.button\n                      whileTap={{ scale: 0.97 }}\n                      onClick={(e) => {\n                        e.stopPropagation();\n                        onEdit(catalog);\n                        setShowMenu(false);\n                      }}\n                      className=\"flex items-center gap-2 w-full px-3 py-2 text-sm text-text-primary hover:bg-bg-sunken rounded-t-lg\"\n                    >\n                      <Settings className=\"w-4 h-4\" />\n                      {tr('common.edit', 'Edit')}\n                    </motion.button>\n                  )}\n                  {onArchive && (\n                    <motion.button\n                      whileTap={{ scale: 0.97 }}\n                      onClick={(e) => {\n                        e.stopPropagation();\n                        onArchive(catalog);\n                        setShowMenu(false);\n                      }}\n                      className=\"flex items-center gap-2 w-full px-3 py-2 text-sm text-text-primary hover:bg-bg-sunken rounded-b-lg\"\n                    >\n                      <Archive className=\"w-4 h-4\" />\n                      {tr('common.archive', 'Archive')}\n                    </motion.button>\n                  )}\n                </motion.div>\n              )}\n            </AnimatePresence>\n          </div>\n        )}\n      </div>\n\n      {catalog.description && (\n        <p className=\"mt-2 text-sm text-text-secondary line-clamp-2\">{catalog.description}</p>\n      )}\n\n      {/* Stats row */}\n      <div className=\"mt-3 flex items-center gap-4 text-xs text-text-secondary\">\n        <span className=\"inline-flex items-center gap-1\">\n          <Layers className=\"w-3.5 h-3.5\" />\n          {catalog.componentCount} {tr('catalog.components', 'components')}\n        </span>\n        <span className=\"inline-flex items-center gap-1\">\n          <Zap className=\"w-3.5 h-3.5\" />\n          {catalog.vibeCount} {tr('catalog.vibes', 'vibes')}\n        </span>\n      </div>\n\n      {catalog.tags.length > 0 && (\n        <div className=\"mt-3 flex flex-wrap gap-1\">\n          {catalog.tags.slice(0, 3).map((tag) => (\n            <span\n              key={tag}\n              className=\"inline-flex items-center gap-1 px-2 py-0.5 text-xs bg-bg-sunken text-text-secondary rounded\"\n            >\n              <Tag className=\"w-3 h-3\" />\n              {tag}\n            </span>\n          ))}\n          {catalog.tags.length > 3 && (\n            <span className=\"px-2 py-0.5 text-xs bg-bg-sunken text-text-secondary rounded\">\n              +{catalog.tags.length - 3}\n            </span>\n          )}\n        </div>\n      )}\n    </motion.div>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"CatalogCard.js","names":[],"sources":["../../../src/components/catalog/CatalogCard.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport { useState } from 'react';\nimport { motion, AnimatePresence } from 'framer-motion';\nimport {\n  BookOpen,\n  Eye,\n  EyeOff,\n  Globe,\n  Tag,\n  MoreVertical,\n  Settings,\n  Archive,\n  Layers,\n  Zap,\n} from 'lucide-react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\n\nexport interface CatalogCardData {\n  id: string;\n  name: string;\n  description: string | null;\n  visibility: 'PRIVATE' | 'INTERNAL' | 'PUBLIC';\n  componentCount: number;\n  vibeCount: number;\n  tags: string[];\n  createdAt: string;\n  updatedAt: string;\n}\n\nexport interface CatalogCardProps {\n  catalog: CatalogCardData;\n  onOpen?: (catalog: CatalogCardData) => void;\n  onEdit?: (catalog: CatalogCardData) => void;\n  onArchive?: (catalog: CatalogCardData) => void;\n  className?: string;\n}\n\nconst visibilityConfig = {\n  PRIVATE: { icon: EyeOff, label: 'Private', className: 'bg-bg-sunken text-text-secondary' },\n  INTERNAL: {\n    icon: Eye,\n    label: 'Internal',\n    className: 'bg-status-warning-bg text-status-warning-text',\n  },\n  PUBLIC: {\n    icon: Globe,\n    label: 'Public',\n    className: 'bg-status-success-bg text-status-success-text',\n  },\n};\n\nexport const CatalogCard: FC<CatalogCardProps> = ({\n  catalog,\n  onOpen,\n  onEdit,\n  onArchive,\n  className = '',\n}) => {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string) => {\n    const v = t(key);\n    return v === key ? fallback : v;\n  };\n  const [showMenu, setShowMenu] = useState(false);\n\n  const visConfig = visibilityConfig[catalog.visibility] ?? visibilityConfig.PRIVATE;\n  const VisIcon = visConfig.icon;\n\n  return (\n    <motion.div\n      whileHover={{ y: -2, transition: { duration: 0.15, ease: [0.4, 0, 0.2, 1] } }}\n      whileTap={{ scale: 0.98 }}\n      className={`bg-bg-surface border border-border-default rounded-lg p-4 hover:border-border-strong hover:shadow-md transition-all cursor-pointer ${className}`}\n      onClick={() => onOpen?.(catalog)}\n    >\n      <div className=\"flex items-start justify-between gap-2\">\n        <div className=\"flex items-start gap-2 sm:gap-3 min-w-0 flex-1\">\n          <div className=\"flex-shrink-0 w-8 h-8 sm:w-10 sm:h-10 rounded-lg bg-action-primary-bg/10 flex items-center justify-center\">\n            <BookOpen className=\"w-4 h-4 sm:w-5 sm:h-5 text-action-primary-bg\" />\n          </div>\n          <div className=\"min-w-0 flex-1\">\n            <h3 className=\"font-semibold text-text-primary truncate text-sm sm:text-base\">\n              {catalog.name}\n            </h3>\n            <div className=\"flex items-center gap-2 mt-0.5\">\n              <span\n                className={`inline-flex items-center gap-1 px-1.5 py-0.5 text-xs rounded ${visConfig.className}`}\n              >\n                <VisIcon className=\"w-3 h-3\" />\n                {tr(`catalog.visibility.${catalog.visibility.toLowerCase()}`, visConfig.label)}\n              </span>\n            </div>\n          </div>\n        </div>\n        {(onEdit || onArchive) && (\n          <div className=\"relative flex-shrink-0\">\n            <button\n              onClick={(e) => {\n                e.stopPropagation();\n                setShowMenu(!showMenu);\n              }}\n              className=\"p-1 sm:p-1.5 rounded hover:bg-bg-sunken transition-colors\"\n            >\n              <MoreVertical className=\"w-4 h-4 text-text-secondary\" />\n            </button>\n            <AnimatePresence>\n              {showMenu && (\n                <motion.div\n                  initial={{ opacity: 0, scale: 0.95, y: -4 }}\n                  animate={{ opacity: 1, scale: 1, y: 0 }}\n                  exit={{ opacity: 0, scale: 0.95, y: -4 }}\n                  transition={{ duration: 0.15 }}\n                  className=\"absolute right-0 mt-1 w-40 bg-bg-surface border border-border-default rounded-lg shadow-lg z-10\"\n                >\n                  {onEdit && (\n                    <motion.button\n                      whileTap={{ scale: 0.97 }}\n                      onClick={(e) => {\n                        e.stopPropagation();\n                        onEdit(catalog);\n                        setShowMenu(false);\n                      }}\n                      className=\"flex items-center gap-2 w-full px-3 py-2 text-sm text-text-primary hover:bg-bg-sunken rounded-t-lg\"\n                    >\n                      <Settings className=\"w-4 h-4\" />\n                      {tr('common.edit', 'Edit')}\n                    </motion.button>\n                  )}\n                  {onArchive && (\n                    <motion.button\n                      whileTap={{ scale: 0.97 }}\n                      onClick={(e) => {\n                        e.stopPropagation();\n                        onArchive(catalog);\n                        setShowMenu(false);\n                      }}\n                      className=\"flex items-center gap-2 w-full px-3 py-2 text-sm text-text-primary hover:bg-bg-sunken rounded-b-lg\"\n                    >\n                      <Archive className=\"w-4 h-4\" />\n                      {tr('common.archive', 'Archive')}\n                    </motion.button>\n                  )}\n                </motion.div>\n              )}\n            </AnimatePresence>\n          </div>\n        )}\n      </div>\n\n      {catalog.description && (\n        <p className=\"mt-2 text-sm text-text-secondary line-clamp-2\">{catalog.description}</p>\n      )}\n\n      {/* Stats row */}\n      <div className=\"mt-3 flex items-center gap-4 text-xs text-text-secondary\">\n        <span className=\"inline-flex items-center gap-1\">\n          <Layers className=\"w-3.5 h-3.5\" />\n          {catalog.componentCount} {tr('catalog.components', 'components')}\n        </span>\n        <span className=\"inline-flex items-center gap-1\">\n          <Zap className=\"w-3.5 h-3.5\" />\n          {catalog.vibeCount} {tr('catalog.vibes', 'vibes')}\n        </span>\n      </div>\n\n      {catalog.tags.length > 0 && (\n        <div className=\"mt-3 flex flex-wrap gap-1\">\n          {catalog.tags.slice(0, 3).map((tag) => (\n            <span\n              key={tag}\n              className=\"inline-flex items-center gap-1 px-2 py-0.5 text-xs bg-bg-sunken text-text-secondary rounded\"\n            >\n              <Tag className=\"w-3 h-3\" />\n              {tag}\n            </span>\n          ))}\n          {catalog.tags.length > 3 && (\n            <span className=\"px-2 py-0.5 text-xs bg-bg-sunken text-text-secondary rounded\">\n              +{catalog.tags.length - 3}\n            </span>\n          )}\n        </div>\n      )}\n    </motion.div>\n  );\n};\n"],"mappings":"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"}

package/dist/components/docs/DocsCompileStatus.js

@@ -1,106 +1,163 @@
-import { useTr as e } from "../../shared/hooks/useTr.js";
-import { useEffect as t, useState as n } from "react";
-import { Check as r, Loader2 as i, X as a } from "lucide-react";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { useEffect as e, useRef as t, useState as n } from "react";
+import { AlertTriangle as r, Check as i, Loader2 as a, X as o } from "lucide-react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region src/components/docs/DocsCompileStatus.tsx
-function c({ revision: c, onPoll: l }) {
-	let u = e(), [d, f] = n(c), [p, m] = n(!1);
-	t(() => {
-		f(c);
-	}, [c]);
-	let h = d?.id, g = d?.status, _ = [
-		"COMPILE_REQUESTED",
-		"VALIDATING_SITE",
-		"VALIDATING_RUNTIME",
-		"PREPARING_WORKSPACE",
-		"STARTING_SANDBOX",
-		"BUILDING",
-		"COLLECTING_OUTPUT",
-		"UPLOADING"
-	];
-	if (t(() => {
-		if (!h || !g || !l || !_.includes(g)) return;
+var l = [
+	"COMPILE_REQUESTED",
+	"VALIDATING_SITE",
+	"VALIDATING_RUNTIME",
+	"PREPARING_WORKSPACE",
+	"STARTING_SANDBOX",
+	"BUILDING",
+	"COLLECTING_OUTPUT",
+	"UPLOADING"
+], u = {
+	COMPILE_REQUESTED: 1,
+	VALIDATING_SITE: 2,
+	VALIDATING_RUNTIME: 3,
+	PREPARING_WORKSPACE: 4,
+	STARTING_SANDBOX: 5,
+	BUILDING: 6,
+	COLLECTING_OUTPUT: 7,
+	UPLOADING: 8
+}, d = {
+	COMPILE_REQUESTED: "Build queued",
+	VALIDATING_SITE: "Checking pages",
+	VALIDATING_RUNTIME: "Checking build image",
+	PREPARING_WORKSPACE: "Assembling workspace",
+	STARTING_SANDBOX: "Starting build container",
+	BUILDING: "Building your docs",
+	COLLECTING_OUTPUT: "Packaging output",
+	UPLOADING: "Uploading"
+}, f = {
+	COMPILE_REQUESTED: "Your build has been queued and will start momentarily.",
+	VALIDATING_SITE: "Verifying that your pages are ready to compile.",
+	VALIDATING_RUNTIME: "Checking that your custom build image is approved and reachable.",
+	PREPARING_WORKSPACE: "Assembling your markdown pages into a build workspace.",
+	STARTING_SANDBOX: "Spinning up an isolated container to run the build. This can take 20–30 s.",
+	BUILDING: "Running your static-site generator. Typical builds finish in 1–3 minutes.",
+	COLLECTING_OUTPUT: "Collecting the compiled static files.",
+	UPLOADING: "Uploading your built docs to storage."
+}, p = 300 * 1e3;
+function m(e) {
+	let t = Math.floor(e / 1e3);
+	return t < 60 ? `${t}s` : `${Math.floor(t / 60)}m ${t % 60}s`;
+}
+function h(e) {
+	return l.includes(e);
+}
+function g({ revision: g, onPoll: _, error: v }) {
+	let [y, b] = n(g), [x, S] = n(!1), [C, w] = n(0), T = t(Date.now());
+	e(() => {
+		b(g), g && h(g.status) && (T.current = Date.now(), w(0));
+	}, [g]);
+	let E = y?.id, D = y?.status;
+	if (e(() => {
+		if (!E || !D || !_ || !h(D)) return;
 		let e = setInterval(async () => {
-			let t = await l(h);
-			t && (f(t), _.includes(t.status) || clearInterval(e));
+			let t = await _(E);
+			t && (b(t), h(t.status) || clearInterval(e));
 		}, 2e3);
 		return () => clearInterval(e);
 	}, [
-		h,
-		g,
-		l
-	]), !d) return null;
-	let { status: v } = d, y = {
-		COMPILE_REQUESTED: "Queued",
-		VALIDATING_SITE: "Validating site",
-		VALIDATING_RUNTIME: "Validating runtime",
-		PREPARING_WORKSPACE: "Preparing workspace",
-		STARTING_SANDBOX: "Starting sandbox",
-		BUILDING: "Building",
-		COLLECTING_OUTPUT: "Collecting output",
-		UPLOADING: "Uploading"
-	};
-	if (v in y) return /* @__PURE__ */ s("span", {
-		className: "flex items-center gap-1.5 text-sm text-status-info-text",
-		"data-testid": `docs-compile-status-${v}`,
-		children: [
-			/* @__PURE__ */ o(i, { className: "w-3.5 h-3.5 animate-spin" }),
-			y[v],
-			"..."
-		]
-	});
-	if (v === "SUCCEEDED" || v === "PUBLISHED") return /* @__PURE__ */ s("span", {
+		E,
+		D,
+		_
+	]), e(() => {
+		if (!D || !h(D)) return;
+		let e = setInterval(() => {
+			w(Date.now() - T.current);
+		}, 1e3);
+		return () => clearInterval(e);
+	}, [D]), !y) return v ? /* @__PURE__ */ c("div", {
+		className: "flex flex-col gap-1",
+		children: [/* @__PURE__ */ c("span", {
+			className: "flex items-center gap-1.5 text-sm text-status-error-text",
+			children: [/* @__PURE__ */ s(o, { className: "w-3.5 h-3.5 shrink-0" }), "Could not start build"]
+		}), /* @__PURE__ */ s("p", {
+			className: "text-xs text-text-muted",
+			children: v
+		})]
+	}) : null;
+	let { status: O } = y, k = C > p;
+	if (h(O)) {
+		let e = u[O];
+		return /* @__PURE__ */ c("div", {
+			className: "flex flex-col gap-0.5",
+			children: [/* @__PURE__ */ c("span", {
+				className: "flex items-center gap-1.5 text-sm text-status-info-text",
+				"data-testid": `docs-compile-status-${O}`,
+				title: f[O],
+				children: [
+					/* @__PURE__ */ s(a, { className: "w-3.5 h-3.5 animate-spin shrink-0" }),
+					/* @__PURE__ */ c("span", { children: [d[O], "…"] }),
+					/* @__PURE__ */ c("span", {
+						className: "text-xs text-text-muted",
+						children: [
+							"step ",
+							e,
+							"/",
+							l.length,
+							" · ",
+							m(C)
+						]
+					})
+				]
+			}), k && /* @__PURE__ */ c("span", {
+				className: "flex items-center gap-1 text-xs text-status-warning-text",
+				children: [/* @__PURE__ */ s(r, { className: "w-3 h-3 shrink-0" }), "Taking longer than expected — builds normally finish in under 3 minutes."]
+			})]
+		});
+	}
+	if (O === "SUCCEEDED" || O === "PUBLISHED") return /* @__PURE__ */ c("span", {
 		className: "flex items-center gap-1.5 text-sm text-status-success-text",
-		"data-testid": `docs-compile-status-${v}`,
+		"data-testid": `docs-compile-status-${O}`,
 		children: [
-			/* @__PURE__ */ o(r, { className: "w-3.5 h-3.5" }),
-			v === "PUBLISHED" ? u("vibecontrols.docs.compile.published", "Published") : u("vibecontrols.docs.compile.built", "Built"),
-			d.buildDurationMs && /* @__PURE__ */ s("span", {
-				className: "text-text-muted",
+			/* @__PURE__ */ s(i, { className: "w-3.5 h-3.5 shrink-0" }),
+			O === "PUBLISHED" ? "Published" : "Built",
+			y.buildDurationMs != null && /* @__PURE__ */ c("span", {
+				className: "text-xs text-text-muted",
 				children: [
-					"(",
-					Math.round(d.buildDurationMs / 1e3),
-					"s)"
+					"in ",
+					Math.round(y.buildDurationMs / 1e3),
+					"s"
 				]
 			})
 		]
 	});
-	if (v === "FAILED") {
-		let e = d.errorCategory;
-		return /* @__PURE__ */ s("div", {
-			className: "flex items-center gap-1.5 relative",
+	if (O === "FAILED") {
+		let e = y.errorCategory, t = y.errorMessage;
+		return /* @__PURE__ */ c("div", {
+			className: "flex flex-col gap-1",
 			"data-testid": "docs-compile-status-FAILED",
-			children: [
-				/* @__PURE__ */ s("span", {
-					className: "flex items-center gap-1.5 text-sm text-status-error-text",
-					children: [
-						/* @__PURE__ */ o(a, { className: "w-3.5 h-3.5" }),
-						u("vibecontrols.docs.compile.failed", "Failed"),
-						e && /* @__PURE__ */ s("span", {
-							className: "text-[10px] text-text-muted",
-							children: [
-								"(",
-								e,
-								")"
-							]
-						})
-					]
-				}),
-				d.errorMessage && /* @__PURE__ */ o("button", {
-					onClick: () => m(!p),
-					className: "text-xs text-text-muted hover:text-text-secondary underline",
-					children: p ? "Hide" : "Details"
-				}),
-				p && d.errorMessage && /* @__PURE__ */ o("div", {
-					className: "absolute top-full right-0 mt-1 z-10 w-96 p-2 bg-bg-sunken rounded text-xs font-mono text-text-secondary max-h-48 overflow-auto",
-					children: d.errorMessage
-				})
-			]
+			children: [/* @__PURE__ */ c("span", {
+				className: "flex items-center gap-1.5 text-sm text-status-error-text",
+				children: [
+					/* @__PURE__ */ s(o, { className: "w-3.5 h-3.5 shrink-0" }),
+					"Build failed",
+					e && /* @__PURE__ */ c("span", {
+						className: "text-xs text-text-muted",
+						children: [
+							"(",
+							e.toLowerCase().replace(/_/g, " "),
+							")"
+						]
+					}),
+					t && /* @__PURE__ */ s("button", {
+						onClick: () => S((e) => !e),
+						className: "text-xs text-text-muted hover:text-text-secondary underline ml-1",
+						children: x ? "Hide details" : "Show details"
+					})
+				]
+			}), x && t && /* @__PURE__ */ s("pre", {
+				className: "mt-1 p-2 bg-bg-sunken rounded text-xs font-mono text-text-secondary max-h-40 overflow-auto whitespace-pre-wrap break-all",
+				children: t
+			})]
 		});
 	}
 	return null;
 }
 //#endregion
-export { c as DocsCompileStatus };
+export { g as DocsCompileStatus };
 
 //# sourceMappingURL=DocsCompileStatus.js.map

package/dist/components/docs/DocsCompileStatus.js.map

@@ -1 +1 @@
-{"version":3,"file":"DocsCompileStatus.js","names":[],"sources":["../../../src/components/docs/DocsCompileStatus.tsx"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport { Loader2, Check, X } from 'lucide-react';\nimport type { DocsRevision } from './types';\nimport { useTr } from '../../shared/hooks/useTr';\n\ninterface DocsCompileStatusProps {\n  revision: DocsRevision | null;\n  onPoll?: (revisionId: string) => Promise<DocsRevision | null>;\n}\n\nexport function DocsCompileStatus({ revision, onPoll }: DocsCompileStatusProps) {\n  const tr = useTr();\n  const [currentRevision, setCurrentRevision] = useState<DocsRevision | null>(revision);\n  const [showError, setShowError] = useState(false);\n\n  useEffect(() => {\n    setCurrentRevision(revision);\n  }, [revision]);\n\n  const currentRevisionId = currentRevision?.id;\n  const currentRevisionStatus = currentRevision?.status;\n\n  const ACTIVE_STATUSES = [\n    'COMPILE_REQUESTED',\n    'VALIDATING_SITE',\n    'VALIDATING_RUNTIME',\n    'PREPARING_WORKSPACE',\n    'STARTING_SANDBOX',\n    'BUILDING',\n    'COLLECTING_OUTPUT',\n    'UPLOADING',\n  ];\n\n  // Poll for status updates\n  useEffect(() => {\n    if (!currentRevisionId || !currentRevisionStatus || !onPoll) return;\n    const isActive = ACTIVE_STATUSES.includes(currentRevisionStatus);\n    if (!isActive) return;\n\n    const interval = setInterval(async () => {\n      const updated = await onPoll(currentRevisionId);\n      if (updated) {\n        setCurrentRevision(updated);\n        if (!ACTIVE_STATUSES.includes(updated.status)) {\n          clearInterval(interval);\n        }\n      }\n    }, 2000);\n\n    return () => clearInterval(interval);\n  }, [currentRevisionId, currentRevisionStatus, onPoll]);\n\n  if (!currentRevision) return null;\n\n  const { status } = currentRevision;\n\n  const STATUS_LABELS: Record<string, string> = {\n    COMPILE_REQUESTED: 'Queued',\n    VALIDATING_SITE: 'Validating site',\n    VALIDATING_RUNTIME: 'Validating runtime',\n    PREPARING_WORKSPACE: 'Preparing workspace',\n    STARTING_SANDBOX: 'Starting sandbox',\n    BUILDING: 'Building',\n    COLLECTING_OUTPUT: 'Collecting output',\n    UPLOADING: 'Uploading',\n  };\n\n  if (status in STATUS_LABELS) {\n    return (\n      <span\n        className=\"flex items-center gap-1.5 text-sm text-status-info-text\"\n        data-testid={`docs-compile-status-${status}`}\n      >\n        <Loader2 className=\"w-3.5 h-3.5 animate-spin\" />\n        {STATUS_LABELS[status]}...\n      </span>\n    );\n  }\n\n  if (status === 'SUCCEEDED' || status === 'PUBLISHED') {\n    return (\n      <span\n        className=\"flex items-center gap-1.5 text-sm text-status-success-text\"\n        data-testid={`docs-compile-status-${status}`}\n      >\n        <Check className=\"w-3.5 h-3.5\" />\n        {status === 'PUBLISHED'\n          ? tr('vibecontrols.docs.compile.published', 'Published')\n          : tr('vibecontrols.docs.compile.built', 'Built')}\n        {currentRevision.buildDurationMs && (\n          <span className=\"text-text-muted\">\n            ({Math.round(currentRevision.buildDurationMs / 1000)}s)\n          </span>\n        )}\n      </span>\n    );\n  }\n\n  if (status === 'FAILED') {\n    const category = (currentRevision as { errorCategory?: string }).errorCategory;\n    return (\n      <div className=\"flex items-center gap-1.5 relative\" data-testid=\"docs-compile-status-FAILED\">\n        <span className=\"flex items-center gap-1.5 text-sm text-status-error-text\">\n          <X className=\"w-3.5 h-3.5\" />\n          {tr('vibecontrols.docs.compile.failed', 'Failed')}\n          {category && <span className=\"text-[10px] text-text-muted\">({category})</span>}\n        </span>\n        {currentRevision.errorMessage && (\n          <button\n            onClick={() => setShowError(!showError)}\n            className=\"text-xs text-text-muted hover:text-text-secondary underline\"\n          >\n            {showError ? 'Hide' : 'Details'}\n          </button>\n        )}\n        {showError && currentRevision.errorMessage && (\n          <div className=\"absolute top-full right-0 mt-1 z-10 w-96 p-2 bg-bg-sunken rounded text-xs font-mono text-text-secondary max-h-48 overflow-auto\">\n            {currentRevision.errorMessage}\n          </div>\n        )}\n      </div>\n    );\n  }\n\n  return null;\n}\n"],"mappings":";;;;;AAUA,SAAgB,EAAkB,EAAE,aAAU,aAAkC;CAC9E,IAAM,IAAK,GAAO,EACZ,CAAC,GAAiB,KAAsB,EAA8B,EAAS,EAC/E,CAAC,GAAW,KAAgB,EAAS,GAAM;AAEjD,SAAgB;AACd,IAAmB,EAAS;IAC3B,CAAC,EAAS,CAAC;CAEd,IAAM,IAAoB,GAAiB,IACrC,IAAwB,GAAiB,QAEzC,IAAkB;EACtB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;AAqBD,KAlBA,QAAgB;AAGd,MAFI,CAAC,KAAqB,CAAC,KAAyB,CAAC,KAEjD,CADa,EAAgB,SAAS,EAAsB,CACjD;EAEf,IAAM,IAAW,YAAY,YAAY;GACvC,IAAM,IAAU,MAAM,EAAO,EAAkB;AAC/C,GAAI,MACF,EAAmB,EAAQ,EACtB,EAAgB,SAAS,EAAQ,OAAO,IAC3C,cAAc,EAAS;KAG1B,IAAK;AAER,eAAa,cAAc,EAAS;IACnC;EAAC;EAAmB;EAAuB;EAAO,CAAC,EAElD,CAAC,EAAiB,QAAO;CAE7B,IAAM,EAAE,cAAW,GAEb,IAAwC;EAC5C,mBAAmB;EACnB,iBAAiB;EACjB,oBAAoB;EACpB,qBAAqB;EACrB,kBAAkB;EAClB,UAAU;EACV,mBAAmB;EACnB,WAAW;EACZ;AAED,KAAI,KAAU,EACZ,QACE,kBAAC,QAAD;EACE,WAAU;EACV,eAAa,uBAAuB;YAFtC;GAIE,kBAAC,GAAD,EAAS,WAAU,4BAA6B,CAAA;GAC/C,EAAc;GAAQ;GAClB;;AAIX,KAAI,MAAW,eAAe,MAAW,YACvC,QACE,kBAAC,QAAD;EACE,WAAU;EACV,eAAa,uBAAuB;YAFtC;GAIE,kBAAC,GAAD,EAAO,WAAU,eAAgB,CAAA;GAChC,MAAW,cACR,EAAG,uCAAuC,YAAY,GACtD,EAAG,mCAAmC,QAAQ;GACjD,EAAgB,mBACf,kBAAC,QAAD;IAAM,WAAU;cAAhB;KAAkC;KAC9B,KAAK,MAAM,EAAgB,kBAAkB,IAAK;KAAC;KAChD;;GAEJ;;AAIX,KAAI,MAAW,UAAU;EACvB,IAAM,IAAY,EAA+C;AACjE,SACE,kBAAC,OAAD;GAAK,WAAU;GAAqC,eAAY;aAAhE;IACE,kBAAC,QAAD;KAAM,WAAU;eAAhB;MACE,kBAAC,GAAD,EAAG,WAAU,eAAgB,CAAA;MAC5B,EAAG,oCAAoC,SAAS;MAChD,KAAY,kBAAC,QAAD;OAAM,WAAU;iBAAhB;QAA8C;QAAE;QAAS;QAAQ;;MACzE;;IACN,EAAgB,gBACf,kBAAC,UAAD;KACE,eAAe,EAAa,CAAC,EAAU;KACvC,WAAU;eAET,IAAY,SAAS;KACf,CAAA;IAEV,KAAa,EAAgB,gBAC5B,kBAAC,OAAD;KAAK,WAAU;eACZ,EAAgB;KACb,CAAA;IAEJ;;;AAIV,QAAO"}
+{"version":3,"file":"DocsCompileStatus.js","names":[],"sources":["../../../src/components/docs/DocsCompileStatus.tsx"],"sourcesContent":["import { useState, useEffect, useRef } from 'react';\nimport { Loader2, Check, X, AlertTriangle } from 'lucide-react';\nimport type { DocsRevision } from './types';\n\ninterface DocsCompileStatusProps {\n  revision: DocsRevision | null;\n  onPoll?: (revisionId: string) => Promise<DocsRevision | null>;\n  error?: string | null;\n}\n\nconst ACTIVE_STATUSES = [\n  'COMPILE_REQUESTED',\n  'VALIDATING_SITE',\n  'VALIDATING_RUNTIME',\n  'PREPARING_WORKSPACE',\n  'STARTING_SANDBOX',\n  'BUILDING',\n  'COLLECTING_OUTPUT',\n  'UPLOADING',\n] as const;\n\ntype ActiveStatus = (typeof ACTIVE_STATUSES)[number];\n\nconst STEP_INDEX: Record<ActiveStatus, number> = {\n  COMPILE_REQUESTED: 1,\n  VALIDATING_SITE: 2,\n  VALIDATING_RUNTIME: 3,\n  PREPARING_WORKSPACE: 4,\n  STARTING_SANDBOX: 5,\n  BUILDING: 6,\n  COLLECTING_OUTPUT: 7,\n  UPLOADING: 8,\n};\n\nconst STATUS_LABELS: Record<ActiveStatus, string> = {\n  COMPILE_REQUESTED: 'Build queued',\n  VALIDATING_SITE: 'Checking pages',\n  VALIDATING_RUNTIME: 'Checking build image',\n  PREPARING_WORKSPACE: 'Assembling workspace',\n  STARTING_SANDBOX: 'Starting build container',\n  BUILDING: 'Building your docs',\n  COLLECTING_OUTPUT: 'Packaging output',\n  UPLOADING: 'Uploading',\n};\n\nconst STATUS_HINTS: Record<ActiveStatus, string> = {\n  COMPILE_REQUESTED: 'Your build has been queued and will start momentarily.',\n  VALIDATING_SITE: 'Verifying that your pages are ready to compile.',\n  VALIDATING_RUNTIME: 'Checking that your custom build image is approved and reachable.',\n  PREPARING_WORKSPACE: 'Assembling your markdown pages into a build workspace.',\n  STARTING_SANDBOX: 'Spinning up an isolated container to run the build. This can take 20–30 s.',\n  BUILDING: 'Running your static-site generator. Typical builds finish in 1–3 minutes.',\n  COLLECTING_OUTPUT: 'Collecting the compiled static files.',\n  UPLOADING: 'Uploading your built docs to storage.',\n};\n\nconst SLOW_THRESHOLD_MS = 5 * 60 * 1000;\n\nfunction formatElapsed(ms: number): string {\n  const s = Math.floor(ms / 1000);\n  if (s < 60) return `${s}s`;\n  return `${Math.floor(s / 60)}m ${s % 60}s`;\n}\n\nfunction isActiveStatus(s: string): s is ActiveStatus {\n  return ACTIVE_STATUSES.includes(s as ActiveStatus);\n}\n\nexport function DocsCompileStatus({ revision, onPoll, error }: DocsCompileStatusProps) {\n  const [currentRevision, setCurrentRevision] = useState<DocsRevision | null>(revision);\n  const [showError, setShowError] = useState(false);\n  const [elapsedMs, setElapsedMs] = useState(0);\n  const startTimeRef = useRef<number>(Date.now());\n\n  useEffect(() => {\n    setCurrentRevision(revision);\n    if (revision && isActiveStatus(revision.status)) {\n      startTimeRef.current = Date.now();\n      setElapsedMs(0);\n    }\n  }, [revision]);\n\n  const currentRevisionId = currentRevision?.id;\n  const currentRevisionStatus = currentRevision?.status;\n\n  // Polling\n  useEffect(() => {\n    if (!currentRevisionId || !currentRevisionStatus || !onPoll) return;\n    if (!isActiveStatus(currentRevisionStatus)) return;\n\n    const interval = setInterval(async () => {\n      const updated = await onPoll(currentRevisionId);\n      if (updated) {\n        setCurrentRevision(updated);\n        if (!isActiveStatus(updated.status)) clearInterval(interval);\n      }\n    }, 2000);\n\n    return () => clearInterval(interval);\n  }, [currentRevisionId, currentRevisionStatus, onPoll]);\n\n  // Elapsed timer — counts up while a build is active\n  useEffect(() => {\n    if (!currentRevisionStatus || !isActiveStatus(currentRevisionStatus)) return;\n\n    const timer = setInterval(() => {\n      setElapsedMs(Date.now() - startTimeRef.current);\n    }, 1000);\n\n    return () => clearInterval(timer);\n  }, [currentRevisionStatus]);\n\n  // Mutation-level error shown when no revision has been created yet\n  if (!currentRevision) {\n    if (error) {\n      return (\n        <div className=\"flex flex-col gap-1\">\n          <span className=\"flex items-center gap-1.5 text-sm text-status-error-text\">\n            <X className=\"w-3.5 h-3.5 shrink-0\" />\n            Could not start build\n          </span>\n          <p className=\"text-xs text-text-muted\">{error}</p>\n        </div>\n      );\n    }\n    return null;\n  }\n\n  const { status } = currentRevision;\n  const isSlow = elapsedMs > SLOW_THRESHOLD_MS;\n\n  if (isActiveStatus(status)) {\n    const step = STEP_INDEX[status];\n    return (\n      <div className=\"flex flex-col gap-0.5\">\n        <span\n          className=\"flex items-center gap-1.5 text-sm text-status-info-text\"\n          data-testid={`docs-compile-status-${status}`}\n          title={STATUS_HINTS[status]}\n        >\n          <Loader2 className=\"w-3.5 h-3.5 animate-spin shrink-0\" />\n          <span>{STATUS_LABELS[status]}…</span>\n          <span className=\"text-xs text-text-muted\">\n            step {step}/{ACTIVE_STATUSES.length} · {formatElapsed(elapsedMs)}\n          </span>\n        </span>\n        {isSlow && (\n          <span className=\"flex items-center gap-1 text-xs text-status-warning-text\">\n            <AlertTriangle className=\"w-3 h-3 shrink-0\" />\n            Taking longer than expected — builds normally finish in under 3 minutes.\n          </span>\n        )}\n      </div>\n    );\n  }\n\n  if (status === 'SUCCEEDED' || status === 'PUBLISHED') {\n    return (\n      <span\n        className=\"flex items-center gap-1.5 text-sm text-status-success-text\"\n        data-testid={`docs-compile-status-${status}`}\n      >\n        <Check className=\"w-3.5 h-3.5 shrink-0\" />\n        {status === 'PUBLISHED' ? 'Published' : 'Built'}\n        {currentRevision.buildDurationMs != null && (\n          <span className=\"text-xs text-text-muted\">\n            in {Math.round(currentRevision.buildDurationMs / 1000)}s\n          </span>\n        )}\n      </span>\n    );\n  }\n\n  if (status === 'FAILED') {\n    const category = currentRevision.errorCategory;\n    const errorMsg = currentRevision.errorMessage;\n    return (\n      <div className=\"flex flex-col gap-1\" data-testid=\"docs-compile-status-FAILED\">\n        <span className=\"flex items-center gap-1.5 text-sm text-status-error-text\">\n          <X className=\"w-3.5 h-3.5 shrink-0\" />\n          Build failed\n          {category && (\n            <span className=\"text-xs text-text-muted\">\n              ({category.toLowerCase().replace(/_/g, ' ')})\n            </span>\n          )}\n          {errorMsg && (\n            <button\n              onClick={() => setShowError((v) => !v)}\n              className=\"text-xs text-text-muted hover:text-text-secondary underline ml-1\"\n            >\n              {showError ? 'Hide details' : 'Show details'}\n            </button>\n          )}\n        </span>\n        {showError && errorMsg && (\n          <pre className=\"mt-1 p-2 bg-bg-sunken rounded text-xs font-mono text-text-secondary max-h-40 overflow-auto whitespace-pre-wrap break-all\">\n            {errorMsg}\n          </pre>\n        )}\n      </div>\n    );\n  }\n\n  return null;\n}\n"],"mappings":"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"}

package/dist/components/docs/DocsEmptyState.js

@@ -11,7 +11,7 @@ function c({ onCreate: c, loading: l }) {
 	return /* @__PURE__ */ o(t, {
 		icon: /* @__PURE__ */ o(i, { className: "w-8 h-8 text-text-secondary" }),
 		title: u("vibecontrols.docs.empty.title", "No documentation yet"),
-		description: u("vibecontrols.docs.empty.description", "Pick a static-site generator to back this documentation site. You can switch later."),
+		description: u("vibecontrols.docs.empty.description", "Choose a static-site generator below. Write pages in Markdown, then click Compile — the platform builds your docs in an isolated container and publishes them to a static URL. You can switch generators later."),
 		action: /* @__PURE__ */ s("div", {
 			className: "flex flex-col items-center gap-3",
 			children: [/* @__PURE__ */ o("div", {

package/dist/components/docs/DocsEmptyState.js.map

@@ -1 +1 @@
-{"version":3,"file":"DocsEmptyState.js","names":[],"sources":["../../../src/components/docs/DocsEmptyState.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { BookOpen, Plus } from 'lucide-react';\nimport { EmptyState } from '@/components/shared';\nimport { useTr } from '../../shared/hooks/useTr';\nimport type { DocsProvider } from './types';\nimport { DOCS_PROVIDERS } from './types';\n\ninterface DocsEmptyStateProps {\n  onCreate: (provider: DocsProvider) => void;\n  loading?: boolean;\n}\n\nexport function DocsEmptyState({ onCreate, loading }: DocsEmptyStateProps) {\n  const tr = useTr();\n  const [provider, setProvider] = useState<DocsProvider>('DOCUSAURUS');\n  return (\n    <EmptyState\n      icon={<BookOpen className=\"w-8 h-8 text-text-secondary\" />}\n      title={tr('vibecontrols.docs.empty.title', 'No documentation yet')}\n      description={tr(\n        'vibecontrols.docs.empty.description',\n        'Pick a static-site generator to back this documentation site. You can switch later.'\n      )}\n      action={\n        <div className=\"flex flex-col items-center gap-3\">\n          <div\n            role=\"radiogroup\"\n            aria-label=\"Choose docs provider\"\n            className=\"flex flex-col gap-2 w-full max-w-md\"\n          >\n            {DOCS_PROVIDERS.map((p) => (\n              <label\n                key={p.value}\n                data-testid={`docs-empty-provider-${p.value.toLowerCase()}`}\n                className=\"flex items-start gap-3 p-3 bg-bg-sunken rounded-md cursor-pointer border border-border-default hover:border-action-primary-bg transition-colors text-left\"\n              >\n                <input\n                  type=\"radio\"\n                  name=\"docs-empty-provider\"\n                  value={p.value}\n                  checked={provider === p.value}\n                  onChange={() => setProvider(p.value)}\n                  className=\"mt-1 accent-action-primary-bg\"\n                />\n                <div>\n                  <p className=\"text-sm font-medium text-text-primary\">{p.label}</p>\n                  <p className=\"text-xs text-text-muted\">{p.description}</p>\n                </div>\n              </label>\n            ))}\n          </div>\n          <button\n            onClick={() => onCreate(provider)}\n            disabled={loading}\n            data-testid=\"docs-empty-create-button\"\n            className=\"flex items-center gap-2 px-4 py-2 bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors disabled:opacity-50\"\n          >\n            <Plus className=\"w-4 h-4\" />\n            {tr('vibecontrols.docs.empty.createDocs', 'Create Documentation')}\n          </button>\n        </div>\n      }\n    />\n  );\n}\n"],"mappings":";;;;;;;;AAYA,SAAgB,EAAe,EAAE,aAAU,cAAgC;CACzE,IAAM,IAAK,GAAO,EACZ,CAAC,GAAU,KAAe,EAAuB,aAAa;AACpE,QACE,kBAAC,GAAD;EACE,MAAM,kBAAC,GAAD,EAAU,WAAU,+BAAgC,CAAA;EAC1D,OAAO,EAAG,iCAAiC,uBAAuB;EAClE,aAAa,EACX,uCACA,sFACD;EACD,QACE,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IACE,MAAK;IACL,cAAW;IACX,WAAU;cAET,EAAe,KAAK,MACnB,kBAAC,SAAD;KAEE,eAAa,uBAAuB,EAAE,MAAM,aAAa;KACzD,WAAU;eAHZ,CAKE,kBAAC,SAAD;MACE,MAAK;MACL,MAAK;MACL,OAAO,EAAE;MACT,SAAS,MAAa,EAAE;MACxB,gBAAgB,EAAY,EAAE,MAAM;MACpC,WAAU;MACV,CAAA,EACF,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,KAAD;MAAG,WAAU;gBAAyC,EAAE;MAAU,CAAA,EAClE,kBAAC,KAAD;MAAG,WAAU;gBAA2B,EAAE;MAAgB,CAAA,CACtD,EAAA,CAAA,CACA;OAhBD,EAAE,MAgBD,CACR;IACE,CAAA,EACN,kBAAC,UAAD;IACE,eAAe,EAAS,EAAS;IACjC,UAAU;IACV,eAAY;IACZ,WAAU;cAJZ,CAME,kBAAC,GAAD,EAAM,WAAU,WAAY,CAAA,EAC3B,EAAG,sCAAsC,uBAAuB,CAC1D;MACL;;EAER,CAAA"}
+{"version":3,"file":"DocsEmptyState.js","names":[],"sources":["../../../src/components/docs/DocsEmptyState.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { BookOpen, Plus } from 'lucide-react';\nimport { EmptyState } from '@/components/shared';\nimport { useTr } from '../../shared/hooks/useTr';\nimport type { DocsProvider } from './types';\nimport { DOCS_PROVIDERS } from './types';\n\ninterface DocsEmptyStateProps {\n  onCreate: (provider: DocsProvider) => void;\n  loading?: boolean;\n}\n\nexport function DocsEmptyState({ onCreate, loading }: DocsEmptyStateProps) {\n  const tr = useTr();\n  const [provider, setProvider] = useState<DocsProvider>('DOCUSAURUS');\n  return (\n    <EmptyState\n      icon={<BookOpen className=\"w-8 h-8 text-text-secondary\" />}\n      title={tr('vibecontrols.docs.empty.title', 'No documentation yet')}\n      description={tr(\n        'vibecontrols.docs.empty.description',\n        'Choose a static-site generator below. Write pages in Markdown, then click Compile — the platform builds your docs in an isolated container and publishes them to a static URL. You can switch generators later.'\n      )}\n      action={\n        <div className=\"flex flex-col items-center gap-3\">\n          <div\n            role=\"radiogroup\"\n            aria-label=\"Choose docs provider\"\n            className=\"flex flex-col gap-2 w-full max-w-md\"\n          >\n            {DOCS_PROVIDERS.map((p) => (\n              <label\n                key={p.value}\n                data-testid={`docs-empty-provider-${p.value.toLowerCase()}`}\n                className=\"flex items-start gap-3 p-3 bg-bg-sunken rounded-md cursor-pointer border border-border-default hover:border-action-primary-bg transition-colors text-left\"\n              >\n                <input\n                  type=\"radio\"\n                  name=\"docs-empty-provider\"\n                  value={p.value}\n                  checked={provider === p.value}\n                  onChange={() => setProvider(p.value)}\n                  className=\"mt-1 accent-action-primary-bg\"\n                />\n                <div>\n                  <p className=\"text-sm font-medium text-text-primary\">{p.label}</p>\n                  <p className=\"text-xs text-text-muted\">{p.description}</p>\n                </div>\n              </label>\n            ))}\n          </div>\n          <button\n            onClick={() => onCreate(provider)}\n            disabled={loading}\n            data-testid=\"docs-empty-create-button\"\n            className=\"flex items-center gap-2 px-4 py-2 bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors disabled:opacity-50\"\n          >\n            <Plus className=\"w-4 h-4\" />\n            {tr('vibecontrols.docs.empty.createDocs', 'Create Documentation')}\n          </button>\n        </div>\n      }\n    />\n  );\n}\n"],"mappings":";;;;;;;;AAYA,SAAgB,EAAe,EAAE,aAAU,cAAgC;CACzE,IAAM,IAAK,GAAO,EACZ,CAAC,GAAU,KAAe,EAAuB,aAAa;AACpE,QACE,kBAAC,GAAD;EACE,MAAM,kBAAC,GAAD,EAAU,WAAU,+BAAgC,CAAA;EAC1D,OAAO,EAAG,iCAAiC,uBAAuB;EAClE,aAAa,EACX,uCACA,kNACD;EACD,QACE,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IACE,MAAK;IACL,cAAW;IACX,WAAU;cAET,EAAe,KAAK,MACnB,kBAAC,SAAD;KAEE,eAAa,uBAAuB,EAAE,MAAM,aAAa;KACzD,WAAU;eAHZ,CAKE,kBAAC,SAAD;MACE,MAAK;MACL,MAAK;MACL,OAAO,EAAE;MACT,SAAS,MAAa,EAAE;MACxB,gBAAgB,EAAY,EAAE,MAAM;MACpC,WAAU;MACV,CAAA,EACF,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,KAAD;MAAG,WAAU;gBAAyC,EAAE;MAAU,CAAA,EAClE,kBAAC,KAAD;MAAG,WAAU;gBAA2B,EAAE;MAAgB,CAAA,CACtD,EAAA,CAAA,CACA;OAhBD,EAAE,MAgBD,CACR;IACE,CAAA,EACN,kBAAC,UAAD;IACE,eAAe,EAAS,EAAS;IACjC,UAAU;IACV,eAAY;IACZ,WAAU;cAJZ,CAME,kBAAC,GAAD,EAAM,WAAU,WAAY,CAAA,EAC3B,EAAG,sCAAsC,uBAAuB,CAC1D;MACL;;EAER,CAAA"}