npm - @burdenoff/microfe-devportal - Versions diffs - 2026.1107.3 → 2026.1108.2 - Mend

@burdenoff/microfe-devportal 2026.1107.3 → 2026.1108.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1400) hide show

package/dist/devportal/components/ImageUploadField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ImageUploadField.js","names":[],"sources":["../../../src/devportal/components/ImageUploadField.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { useCallback, useRef, useState } from \"react\";\nimport { Loader2, Upload, X } from \"lucide-react\";\nimport { cn } from \"../utils/cn\";\n\n// =============================================================================\n// IMAGE UPLOAD COMPONENTS\n//\n// Shared by the devportal App pages (Store Listing tab) and the physical\n// item create/edit pages — a single icon/banner upload field plus a\n// screenshot gallery, both backed by usePackageUpload's\n// upload(file) => Promise<{ downloadUrl }> shape.\n// =============================================================================\n\ninterface ImageUploadFieldProps {\n label: string;\n value: string;\n onChange: (url: string) => void;\n hint?: string;\n accept?: string;\n aspectClass?: string; // tailwind class for the preview container ratio\n upload: (file: File) => Promise<{ downloadUrl: string }>;\n uploading: boolean;\n progress: number;\n error: string \| null;\n}\n\nexport const ImageUploadField: FC<ImageUploadFieldProps> = ({\n label,\n value,\n onChange,\n hint,\n accept = \"image/png,image/jpeg,image/webp,image/gif,image/svg+xml\",\n aspectClass = \"aspect-square\",\n upload,\n uploading,\n progress,\n error,\n}) => {\n const inputRef = useRef<HTMLInputElement>(null);\n const [imgBroken, setImgBroken] = useState(false);\n const prevValue = useRef(value);\n if (prevValue.current !== value) {\n prevValue.current = value;\n if (imgBroken) setImgBroken(false);\n }\n\n const handleFile = useCallback(\n async (file: File) => {\n try {\n const result = await upload(file);\n onChange(result.downloadUrl);\n } catch {\n // error shown via error prop\n }\n },\n [upload, onChange],\n );\n\n return (\n <div className=\"space-y-1.5\">\n <label className=\"text-sm font-medium\">{label}</label>\n <div className=\"flex gap-3 items-start\">\n {/* Preview /}\n <div\n className={cn(\n \"relative shrink-0 w-20 rounded-lg border border-border-subtle bg-bg-sunken overflow-hidden flex items-center justify-center\",\n aspectClass,\n )}\n >\n {value && !imgBroken ? (\n <img\n src={value}\n alt={label}\n className=\"w-full h-full object-cover\"\n onError={() => setImgBroken(true)}\n />\n ) : (\n <Upload size={18} className=\"text-text-secondary opacity-40\" />\n )}\n {uploading && (\n <div className=\"absolute inset-0 bg-bg-overlay flex flex-col items-center justify-center gap-1\">\n <Loader2 size={14} className=\"animate-spin text-white\" />\n <span className=\"text-white text-xs\">{progress}%</span>\n </div>\n )}\n </div>\n {/ URL input + upload button /}\n <div className=\"flex-1 space-y-1.5\">\n <input\n type=\"url\"\n value={value}\n onChange={(e) => onChange(e.target.value)}\n placeholder=\"https://...\"\n className=\"w-full rounded-md border border-border-subtle bg-bg-input px-3 py-1.5 text-sm placeholder:text-text-placeholder focus:outline-none focus:ring-2 focus:ring-primary/30\"\n />\n <input\n ref={inputRef}\n type=\"file\"\n accept={accept}\n className=\"hidden\"\n onChange={(e) => {\n const f = e.target.files?.[0];\n if (f) void handleFile(f);\n e.target.value = \"\";\n }}\n />\n <button\n type=\"button\"\n disabled={uploading}\n onClick={() => inputRef.current?.click()}\n className=\"inline-flex items-center gap-1.5 rounded-md border px-2.5 py-1 text-xs font-medium hover:bg-bg-sunken transition-colors disabled:opacity-50\"\n >\n <Upload size={11} />\n {uploading ? `Uploading… ${progress}%` : \"Upload image\"}\n </button>\n {error && <p className=\"text-xs text-status-error-text\">{error}</p>}\n </div>\n </div>\n {hint && <p className=\"text-xs text-text-secondary\">{hint}</p>}\n </div>\n );\n};\n\ninterface ScreenshotGalleryProps {\n urls: string[];\n onChange: (urls: string[]) => void;\n upload: (file: File) => Promise<{ downloadUrl: string }>;\n uploading: boolean;\n progress: number;\n error: string \| null;\n}\n\nexport const ScreenshotGallery: FC<ScreenshotGalleryProps> = ({\n urls,\n onChange,\n upload,\n uploading,\n progress,\n error,\n}) => {\n const inputRef = useRef<HTMLInputElement>(null);\n const [urlInput, setUrlInput] = useState(\"\");\n\n const handleFile = useCallback(\n async (file: File) => {\n try {\n const result = await upload(file);\n onChange([...urls, result.downloadUrl]);\n } catch {\n // error shown via error prop\n }\n },\n [upload, onChange, urls],\n );\n\n const addUrl = () => {\n const trimmed = urlInput.trim();\n if (trimmed && !urls.includes(trimmed)) {\n onChange([...urls, trimmed]);\n setUrlInput(\"\");\n }\n };\n\n const remove = (idx: number) => {\n onChange(urls.filter((_, i) => i !== idx));\n };\n\n return (\n <div className=\"space-y-2\">\n <div className=\"flex flex-col gap-0.5\">\n <label className=\"text-sm font-medium\">Screenshots</label>\n <p className=\"text-xs text-text-muted\">\n Shown in the horizontal preview strip below the hero — wide landscape\n proportions work best (16:9)\n </p>\n </div>\n <div className=\"flex flex-wrap gap-3\">\n {urls.map((url, idx) => (\n <div\n key={idx}\n className=\"relative group w-36 aspect-video rounded-lg border border-border-subtle overflow-hidden bg-bg-sunken\"\n >\n <img\n src={url}\n alt={`Screenshot ${idx + 1}`}\n className=\"w-full h-full object-cover\"\n />\n <button\n type=\"button\"\n onClick={() => remove(idx)}\n className=\"absolute top-1 right-1 rounded-full bg-bg-overlay text-white p-0.5 opacity-0 group-hover:opacity-100 transition-opacity\"\n >\n <X size={12} />\n </button>\n </div>\n ))}\n {/ Upload slot /}\n <button\n type=\"button\"\n disabled={uploading}\n onClick={() => inputRef.current?.click()}\n className={cn(\n \"w-36 aspect-video rounded-lg border-2 border-dashed border-border-subtle flex flex-col items-center justify-center gap-1.5 text-text-secondary hover:border-border-strong hover:bg-bg-sunken transition-colors disabled:opacity-50\",\n )}\n >\n {uploading ? (\n <>\n <Loader2 size={18} className=\"animate-spin text-primary\" />\n <span className=\"text-xs\">{progress}%</span>\n </>\n ) : (\n <>\n <Upload size={18} />\n <span className=\"text-xs\">Add screenshot</span>\n </>\n )}\n </button>\n </div>\n {/ URL paste row */}\n <div className=\"flex gap-2\">\n <input\n type=\"url\"\n value={urlInput}\n onChange={(e) => setUrlInput(e.target.value)}\n onKeyDown={(e) => {\n if (e.key === \"Enter\") {\n e.preventDefault();\n addUrl();\n }\n }}\n placeholder=\"https://... paste a screenshot URL\"\n className=\"flex-1 rounded-md border border-border-subtle bg-bg-input px-3 py-1.5 text-sm placeholder:text-text-placeholder focus:outline-none focus:ring-2 focus:ring-primary/30\"\n />\n <button\n type=\"button\"\n onClick={addUrl}\n disabled={!urlInput.trim()}\n className=\"inline-flex items-center gap-1.5 rounded-md border px-2.5 py-1.5 text-xs font-medium hover:bg-bg-sunken transition-colors disabled:opacity-50\"\n >\n Add\n </button>\n </div>\n <input\n ref={inputRef}\n type=\"file\"\n accept=\"image/png,image/jpeg,image/webp,image/gif\"\n className=\"hidden\"\n onChange={(e) => {\n const f = e.target.files?.[0];\n if (f) void handleFile(f);\n e.target.value = \"\";\n }}\n />\n {error && <p className=\"text-xs text-status-error-text\">{error}</p>}\n </div>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"ImageUploadField.js","names":["_Fragment","ImageUploadField","inputRef","useRef","imgBroken","setImgBroken","useState","prevValue","value","handleFile","useCallback","upload","file","onChange","label","cn","aspectClass","Upload","uploading","Loader2","progress","f","error","hint","ScreenshotGallery","urlInput","setUrlInput","result","urls","addUrl","trimmed","remove","i","idx","url","X","Fragment"],"sources":["../../../src/devportal/components/ImageUploadField.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { useCallback, useRef, useState } from \"react\";\nimport { Loader2, Upload, X } from \"lucide-react\";\nimport { cn } from \"../utils/cn\";\n\n// =============================================================================\n// IMAGE UPLOAD COMPONENTS\n//\n// Shared by the devportal App pages (Store Listing tab) and the physical\n// item create/edit pages — a single icon/banner upload field plus a\n// screenshot gallery, both backed by usePackageUpload's\n// upload(file) => Promise<{ downloadUrl }> shape.\n// =============================================================================\n\ninterface ImageUploadFieldProps {\n label: string;\n value: string;\n onChange: (url: string) => void;\n hint?: string;\n accept?: string;\n aspectClass?: string; // tailwind class for the preview container ratio\n upload: (file: File) => Promise<{ downloadUrl: string }>;\n uploading: boolean;\n progress: number;\n error: string \| null;\n}\n\nexport const ImageUploadField: FC<ImageUploadFieldProps> = ({\n label,\n value,\n onChange,\n hint,\n accept = \"image/png,image/jpeg,image/webp,image/gif,image/svg+xml\",\n aspectClass = \"aspect-square\",\n upload,\n uploading,\n progress,\n error,\n}) => {\n const inputRef = useRef<HTMLInputElement>(null);\n const [imgBroken, setImgBroken] = useState(false);\n const prevValue = useRef(value);\n if (prevValue.current !== value) {\n prevValue.current = value;\n if (imgBroken) setImgBroken(false);\n }\n\n const handleFile = useCallback(\n async (file: File) => {\n try {\n const result = await upload(file);\n onChange(result.downloadUrl);\n } catch {\n // error shown via error prop\n }\n },\n [upload, onChange],\n );\n\n return (\n <div className=\"space-y-1.5\">\n <label className=\"text-sm font-medium\">{label}</label>\n <div className=\"flex gap-3 items-start\">\n {/* Preview /}\n <div\n className={cn(\n \"relative shrink-0 w-20 rounded-lg border border-border-subtle bg-bg-sunken overflow-hidden flex items-center justify-center\",\n aspectClass,\n )}\n >\n {value && !imgBroken ? (\n <img\n src={value}\n alt={label}\n className=\"w-full h-full object-cover\"\n onError={() => setImgBroken(true)}\n />\n ) : (\n <Upload size={18} className=\"text-text-secondary opacity-40\" />\n )}\n {uploading && (\n <div className=\"absolute inset-0 bg-bg-overlay flex flex-col items-center justify-center gap-1\">\n <Loader2 size={14} className=\"animate-spin text-white\" />\n <span className=\"text-white text-xs\">{progress}%</span>\n </div>\n )}\n </div>\n {/ URL input + upload button /}\n <div className=\"flex-1 space-y-1.5\">\n <input\n type=\"url\"\n value={value}\n onChange={(e) => onChange(e.target.value)}\n placeholder=\"https://...\"\n className=\"w-full rounded-md border border-border-subtle bg-bg-input px-3 py-1.5 text-sm placeholder:text-text-placeholder focus:outline-none focus:ring-2 focus:ring-primary/30\"\n />\n <input\n ref={inputRef}\n type=\"file\"\n accept={accept}\n className=\"hidden\"\n onChange={(e) => {\n const f = e.target.files?.[0];\n if (f) void handleFile(f);\n e.target.value = \"\";\n }}\n />\n <button\n type=\"button\"\n disabled={uploading}\n onClick={() => inputRef.current?.click()}\n className=\"inline-flex items-center gap-1.5 rounded-md border px-2.5 py-1 text-xs font-medium hover:bg-bg-sunken transition-colors disabled:opacity-50\"\n >\n <Upload size={11} />\n {uploading ? `Uploading… ${progress}%` : \"Upload image\"}\n </button>\n {error && <p className=\"text-xs text-status-error-text\">{error}</p>}\n </div>\n </div>\n {hint && <p className=\"text-xs text-text-secondary\">{hint}</p>}\n </div>\n );\n};\n\ninterface ScreenshotGalleryProps {\n urls: string[];\n onChange: (urls: string[]) => void;\n upload: (file: File) => Promise<{ downloadUrl: string }>;\n uploading: boolean;\n progress: number;\n error: string \| null;\n}\n\nexport const ScreenshotGallery: FC<ScreenshotGalleryProps> = ({\n urls,\n onChange,\n upload,\n uploading,\n progress,\n error,\n}) => {\n const inputRef = useRef<HTMLInputElement>(null);\n const [urlInput, setUrlInput] = useState(\"\");\n\n const handleFile = useCallback(\n async (file: File) => {\n try {\n const result = await upload(file);\n onChange([...urls, result.downloadUrl]);\n } catch {\n // error shown via error prop\n }\n },\n [upload, onChange, urls],\n );\n\n const addUrl = () => {\n const trimmed = urlInput.trim();\n if (trimmed && !urls.includes(trimmed)) {\n onChange([...urls, trimmed]);\n setUrlInput(\"\");\n }\n };\n\n const remove = (idx: number) => {\n onChange(urls.filter((_, i) => i !== idx));\n };\n\n return (\n <div className=\"space-y-2\">\n <div className=\"flex flex-col gap-0.5\">\n <label className=\"text-sm font-medium\">Screenshots</label>\n <p className=\"text-xs text-text-muted\">\n Shown in the horizontal preview strip below the hero — wide landscape\n proportions work best (16:9)\n </p>\n </div>\n <div className=\"flex flex-wrap gap-3\">\n {urls.map((url, idx) => (\n <div\n key={idx}\n className=\"relative group w-36 aspect-video rounded-lg border border-border-subtle overflow-hidden bg-bg-sunken\"\n >\n <img\n src={url}\n alt={`Screenshot ${idx + 1}`}\n className=\"w-full h-full object-cover\"\n />\n <button\n type=\"button\"\n onClick={() => remove(idx)}\n className=\"absolute top-1 right-1 rounded-full bg-bg-overlay text-white p-0.5 opacity-0 group-hover:opacity-100 transition-opacity\"\n >\n <X size={12} />\n </button>\n </div>\n ))}\n {/ Upload slot /}\n <button\n type=\"button\"\n disabled={uploading}\n onClick={() => inputRef.current?.click()}\n className={cn(\n \"w-36 aspect-video rounded-lg border-2 border-dashed border-border-subtle flex flex-col items-center justify-center gap-1.5 text-text-secondary hover:border-border-strong hover:bg-bg-sunken transition-colors disabled:opacity-50\",\n )}\n >\n {uploading ? (\n <>\n <Loader2 size={18} className=\"animate-spin text-primary\" />\n <span className=\"text-xs\">{progress}%</span>\n </>\n ) : (\n <>\n <Upload size={18} />\n <span className=\"text-xs\">Add screenshot</span>\n </>\n )}\n </button>\n </div>\n {/ URL paste row */}\n <div className=\"flex gap-2\">\n <input\n type=\"url\"\n value={urlInput}\n onChange={(e) => setUrlInput(e.target.value)}\n onKeyDown={(e) => {\n if (e.key === \"Enter\") {\n e.preventDefault();\n addUrl();\n }\n }}\n placeholder=\"https://... paste a screenshot URL\"\n className=\"flex-1 rounded-md border border-border-subtle bg-bg-input px-3 py-1.5 text-sm placeholder:text-text-placeholder focus:outline-none focus:ring-2 focus:ring-primary/30\"\n />\n <button\n type=\"button\"\n onClick={addUrl}\n disabled={!urlInput.trim()}\n className=\"inline-flex items-center gap-1.5 rounded-md border px-2.5 py-1.5 text-xs font-medium hover:bg-bg-sunken transition-colors disabled:opacity-50\"\n >\n Add\n </button>\n </div>\n <input\n ref={inputRef}\n type=\"file\"\n accept=\"image/png,image/jpeg,image/webp,image/gif\"\n className=\"hidden\"\n onChange={(e) => {\n const f = e.target.files?.[0];\n if (f) void handleFile(f);\n e.target.value = \"\";\n }}\n />\n {error && <p className=\"text-xs text-status-error-text\">{error}</p>}\n </div>\n );\n};\n"],"mappings":"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"}

package/dist/devportal/components/LoadingState.d.ts CHANGED Viewed

@@ -1,5 +1,4 @@
 import { FC } from 'react';
 interface LoadingStateProps {
     message?: string;
     className?: string;
@@ -28,4 +27,3 @@ export declare const TableRowSkeleton: FC<{
     columns?: number;
 }>;
 export {};
-//# sourceMappingURL=LoadingState.d.ts.map

package/dist/devportal/components/LoadingState.js CHANGED Viewed

@@ -1,13 +1,13 @@
-import { useTr as e } from "../utils/i18n.js";
-import { cn as t } from "../utils/cn.js";
+import { cn as e } from "../utils/cn.js";
+import { useTr as t } from "../utils/i18n.js";
 import { Loader2 as n } from "lucide-react";
 import { jsx as r, jsxs as i } from "react/jsx-runtime";
-//#region src/devportal/components/LoadingState.tsx
+// src/devportal/components/LoadingState.tsx
 var a = ({ message: a, className: o, size: s = "md" }) => {
-	let c = e(), l = a ?? c("devportal.loadingDots", "Loading...");
+	let c = t(), l = a ?? c("devportal.loadingDots", "Loading...");
 	return /* @__PURE__ */ i("div", {
-		className: t("flex flex-col items-center justify-center gap-4 p-8", o),
-		children: [/* @__PURE__ */ r(n, { className: t("animate-spin text-primary", {
+		className: e("flex flex-col items-center justify-center gap-4 p-8", o),
+		children: [/* @__PURE__ */ r(n, { className: e("animate-spin text-primary", {
 			sm: "h-4 w-4",
 			md: "h-8 w-8",
 			lg: "h-12 w-12"
@@ -23,7 +23,6 @@ var a = ({ message: a, className: o, size: s = "md" }) => {
 		size: "lg"
 	})
 });
-//#endregion
 export { a as LoadingState, o as PageLoadingState };
 //# sourceMappingURL=LoadingState.js.map

package/dist/devportal/components/LoadingState.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LoadingState.js","names":[],"sources":["../../../src/devportal/components/LoadingState.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { Loader2 } from \"lucide-react\";\nimport { cn } from \"../utils/cn\";\nimport { useTr } from \"../utils/i18n\";\n\ninterface LoadingStateProps {\n message?: string;\n className?: string;\n size?: \"sm\" \| \"md\" \| \"lg\";\n}\n\n/*\n Loading state component with spinner and optional message\n /\nexport const LoadingState: FC<LoadingStateProps> = ({\n message,\n className,\n size = \"md\",\n}) => {\n const tr = useTr();\n const resolvedMessage = message ?? tr(\"devportal.loadingDots\", \"Loading...\");\n const sizeClasses = {\n sm: \"h-4 w-4\",\n md: \"h-8 w-8\",\n lg: \"h-12 w-12\",\n };\n\n return (\n <div\n className={cn(\n \"flex flex-col items-center justify-center gap-4 p-8\",\n className,\n )}\n >\n <Loader2 className={cn(\"animate-spin text-primary\", sizeClasses[size])} />\n {resolvedMessage && (\n <p className=\"text-sm text-text-secondary\">{resolvedMessage}</p>\n )}\n </div>\n );\n};\n\n/\n Full page loading state\n /\nexport const PageLoadingState: FC<{ message?: string }> = ({ message }) => (\n <div className=\"flex min-h-[400px] w-full items-center justify-center\">\n <LoadingState message={message} size=\"lg\" />\n </div>\n);\n\n/\n Card loading skeleton\n /\nexport const CardSkeleton: FC<{ className?: string }> = ({ className }) => (\n <div\n className={cn(\n \"rounded-card border border-border-seam bg-bg-surface p-6\",\n className,\n )}\n >\n <div className=\"h-4 w-3/4 overflow-hidden rounded bg-bg-sunken animate-vc-shimmer\" />\n <div className=\"mt-4 h-3 w-1/2 overflow-hidden rounded bg-bg-sunken animate-vc-shimmer\" />\n <div className=\"mt-2 h-3 w-2/3 overflow-hidden rounded bg-bg-sunken animate-vc-shimmer\" />\n </div>\n);\n\n/\n Table row skeleton\n */\nexport const TableRowSkeleton: FC<{ columns?: number }> = ({ columns = 4 }) => (\n <tr>\n {Array.from({ length: columns }).map((_, i) => (\n <td key={i} className=\"px-4 py-3\">\n <div className=\"h-4 overflow-hidden rounded bg-bg-sunken animate-vc-shimmer\" />\n </td>\n ))}\n </tr>\n);\n"],"mappings":";;;;;AAcA,~~IAAa~~,KAAuC,EAClD,YACA,cACA,UAAO,WACH;CACJ,~~IAAM~~,~~IAAK~~,~~GAAO~~,~~EACZ~~,~~IAAkB~~,~~KAAW~~,EAAG,yBAAyB,~~aAAa~~;~~AAO5E~~,~~QACE~~,kBAAC,OAAD;EACE,~~WAAW~~,EACT,~~uDACA~~,~~EACD~~;~~YAJH~~,CAME,~~kBAAC~~,GAAD,EAAS,~~WAAW~~,EAAG,~~6BAbP~~;~~GAClB~~,IAAI;GACJ,IAAI;GACJ,IAAI;~~GACL~~,~~CASmE~~,~~GAAM~~,EAAI,CAAA,~~EACzE~~,KACC,kBAAC,KAAD;GAAG,WAAU;~~aAA~~+B;~~GAAoB~~,CAAA,CAE9D;;~~GAOG~~,KAA8C,EAAE,iBAC3D,kBAAC,OAAD;CAAK,WAAU;~~WACb~~,~~kBAAC~~,GAAD;EAAuB;EAAS,MAAK;~~EAAO~~,CAAA;~~CACxC~~,CAAA"}
1	+ {"version":3,"file":"LoadingState.js","names":["LoadingState","tr","useTr","resolvedMessage","message","cn","className","Loader2","size","PageLoadingState"],"sources":["../../../src/devportal/components/LoadingState.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { Loader2 } from \"lucide-react\";\nimport { cn } from \"../utils/cn\";\nimport { useTr } from \"../utils/i18n\";\n\ninterface LoadingStateProps {\n message?: string;\n className?: string;\n size?: \"sm\" \| \"md\" \| \"lg\";\n}\n\n/*\n Loading state component with spinner and optional message\n /\nexport const LoadingState: FC<LoadingStateProps> = ({\n message,\n className,\n size = \"md\",\n}) => {\n const tr = useTr();\n const resolvedMessage = message ?? tr(\"devportal.loadingDots\", \"Loading...\");\n const sizeClasses = {\n sm: \"h-4 w-4\",\n md: \"h-8 w-8\",\n lg: \"h-12 w-12\",\n };\n\n return (\n <div\n className={cn(\n \"flex flex-col items-center justify-center gap-4 p-8\",\n className,\n )}\n >\n <Loader2 className={cn(\"animate-spin text-primary\", sizeClasses[size])} />\n {resolvedMessage && (\n <p className=\"text-sm text-text-secondary\">{resolvedMessage}</p>\n )}\n </div>\n );\n};\n\n/\n Full page loading state\n /\nexport const PageLoadingState: FC<{ message?: string }> = ({ message }) => (\n <div className=\"flex min-h-[400px] w-full items-center justify-center\">\n <LoadingState message={message} size=\"lg\" />\n </div>\n);\n\n/\n Card loading skeleton\n /\nexport const CardSkeleton: FC<{ className?: string }> = ({ className }) => (\n <div\n className={cn(\n \"rounded-card border border-border-seam bg-bg-surface p-6\",\n className,\n )}\n >\n <div className=\"h-4 w-3/4 overflow-hidden rounded bg-bg-sunken animate-vc-shimmer\" />\n <div className=\"mt-4 h-3 w-1/2 overflow-hidden rounded bg-bg-sunken animate-vc-shimmer\" />\n <div className=\"mt-2 h-3 w-2/3 overflow-hidden rounded bg-bg-sunken animate-vc-shimmer\" />\n </div>\n);\n\n/\n Table row skeleton\n */\nexport const TableRowSkeleton: FC<{ columns?: number }> = ({ columns = 4 }) => (\n <tr>\n {Array.from({ length: columns }).map((_, i) => (\n <td key={i} className=\"px-4 py-3\">\n <div className=\"h-4 overflow-hidden rounded bg-bg-sunken animate-vc-shimmer\" />\n </td>\n ))}\n </tr>\n);\n"],"mappings":";;;;;AAcA,IAAaA,KAAuC,EAClD,YACA,cACA,UAAO,WACH;CACJ,IAAMC,IAAKC,EAAM,GACXC,IAAkBC,KAAWH,EAAG,yBAAyB,YAAY;CAO3E,OACE,kBAAC,OAAD;EACE,WAAWI,EACT,uDACAC,CACF;EAJF,UAAA,CAME,kBAACC,GAAD,EAAS,WAAWF,EAAG,6BAA6B;GAZtD,IAAI;GACJ,IAAI;GACJ,IAAI;EAUkD,EAAYG,EAAK,EAAI,CAAA,GACxEL,KACC,kBAAC,KAAD;GAAG,WAAU;GAA+B,UAAAA;EAAmB,CAAA,CAE9D;;AAET,GAKaM,KAA8C,EAAE,iBAC3D,kBAAC,OAAD;CAAK,WAAU;CACb,UAAA,kBAACT,GAAD;EAAuB;EAAS,MAAK;CAAM,CAAA;AACxC,CAAA"}

package/dist/devportal/components/ManifestViewer.d.ts CHANGED Viewed

@@ -1,5 +1,4 @@
 import { FC } from 'react';
 export interface ManifestViewerProps {
     manifest: Record<string, unknown>;
     tr: (key: string, fallback: string) => string;
@@ -9,4 +8,3 @@ export interface ManifestViewerProps {
  * reviewers can validate what was uploaded without leaving the page.
  */
 export declare const ManifestViewer: FC<ManifestViewerProps>;
-//# sourceMappingURL=ManifestViewer.d.ts.map

package/dist/devportal/components/ManifestViewer.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { useEffect as e, useRef as t, useState as n } from "react";
 import { FileJson as r, X as i } from "lucide-react";
 import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
-//#region src/devportal/components/ManifestViewer.tsx
+// src/devportal/components/ManifestViewer.tsx
 var c = ({ manifest: c, tr: l }) => {
 	let [u, d] = n(!1), f = t(null);
 	return e(() => {
@@ -52,7 +52,6 @@ var c = ({ manifest: c, tr: l }) => {
 		})]
 	})] });
 };
-//#endregion
 export { c as ManifestViewer };
 //# sourceMappingURL=ManifestViewer.js.map

package/dist/devportal/components/ManifestViewer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ManifestViewer.js","names":[],"sources":["../../../src/devportal/components/ManifestViewer.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\nimport { FileJson, X } from \"lucide-react\";\n\nexport interface ManifestViewerProps {\n manifest: Record<string, unknown>;\n tr: (key: string, fallback: string) => string;\n}\n\n/*\n Read-only modal for viewing a version's manifest.json, so developers and\n * reviewers can validate what was uploaded without leaving the page.\n */\nexport const ManifestViewer: FC<ManifestViewerProps> = ({ manifest, tr }) => {\n const [open, setOpen] = useState(false);\n const dialogRef = useRef<HTMLDivElement \| null>(null);\n\n useEffect(() => {\n if (!open) return undefined;\n\n const originalOverflow = document.body.style.overflow;\n document.body.style.overflow = \"hidden\";\n window.requestAnimationFrame(() => dialogRef.current?.focus());\n\n const onKeyDown = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n event.preventDefault();\n setOpen(false);\n }\n };\n document.addEventListener(\"keydown\", onKeyDown);\n\n return () => {\n document.body.style.overflow = originalOverflow;\n document.removeEventListener(\"keydown\", onKeyDown);\n };\n }, [open]);\n\n return (\n <>\n <button\n type=\"button\"\n onClick={() => setOpen(true)}\n className=\"inline-flex items-center gap-1.5 text-xs text-text-secondary hover:text-text-primary\"\n >\n <FileJson size={13} />\n {tr(\"devportal.viewManifest\", \"View manifest.json\")}\n </button>\n {open && (\n <div className=\"fixed inset-0 z-50 flex items-center justify-center p-4\">\n <button\n type=\"button\"\n aria-label=\"Close dialog backdrop\"\n className=\"absolute inset-0 bg-bg-overlay\"\n onClick={() => setOpen(false)}\n />\n <div\n ref={dialogRef}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={tr(\"devportal.manifestJson\", \"manifest.json\")}\n tabIndex={-1}\n className=\"relative z-10 flex max-h-[80vh] w-full max-w-2xl flex-col rounded-lg bg-bg-surface p-6 shadow-xl focus:outline-none\"\n >\n <div className=\"flex items-center justify-between gap-4\">\n <h3 className=\"text-lg font-semibold\">\n {tr(\"devportal.manifestJson\", \"manifest.json\")}\n </h3>\n <button\n type=\"button\"\n onClick={() => setOpen(false)}\n aria-label={tr(\"devportal.close\", \"Close\")}\n className=\"rounded-md p-1 text-text-secondary hover:bg-bg-sunken hover:text-text-primary\"\n >\n <X size={18} />\n </button>\n </div>\n <pre className=\"mt-4 flex-1 overflow-auto rounded-md bg-bg-sunken p-3 text-xs font-mono whitespace-pre-wrap break-all\">\n {JSON.stringify(manifest, null, 2)}\n </pre>\n </div>\n </div>\n )}\n </>\n );\n};\n"],"mappings":";;;;AAaA,~~IAAa~~,KAA2C,EAAE,aAAU,YAAS;CAC3E,IAAM,~~CAAC~~,~~GAAM~~,~~KAAW~~,EAAS,~~GAAM~~,~~EACjC~~,~~IAAY~~,EAA8B,~~KAAK~~;~~AAuBrD~~,~~QArBA~~,QAAgB;~~AACd~~,~~MAAI~~,~~CAAC~~,~~EAAM~~;EAEX,~~IAAM~~,IAAmB,SAAS,KAAK,MAAM;~~AAE7C~~,~~EADA~~,SAAS,KAAK,MAAM,WAAW,UAC/B,OAAO,~~4BAA4B~~,EAAU,SAAS,~~OAAO~~,CAAC;~~EAE9D~~,~~IAAM~~,KAAa,MAAyB;~~AAC1C~~,~~GAAI~~,EAAM,QAAQ,~~aAChB~~,EAAM,~~gBAAgB~~,~~EACtB~~,EAAQ,~~GAAM;;AAKlB~~,~~SAFA~~,SAAS,iBAAiB,~~WAAW~~,~~EAAU~~,~~QAElC~~;~~AAEX~~,~~GADA~~,SAAS,KAAK,MAAM,~~WAAW~~,GAC/B,SAAS,oBAAoB,~~WAAW~~,~~EAAU;;IAEnD~~,~~CAAC~~,~~EAAK~~,CAAC,~~EAGR~~,~~kBAAA~~,GAAA,EAAA,UAAA,CACE,kBAAC,UAAD;EACE,MAAK;EACL,~~eAAe~~,EAAQ,~~GAAK~~;~~EAC5B~~,WAAU;~~YAHZ~~,CAKE,~~kBAAC~~,GAAD,EAAU,MAAM,~~IAAM~~,CAAA,~~EACrB~~,EAAG,0BAA0B,~~qBAAqB~~,CAC5C;~~KACR~~,KACC,kBAAC,OAAD;EAAK,WAAU;~~YAAf~~,CACE,kBAAC,UAAD;GACE,MAAK;GACL,cAAW;GACX,WAAU;GACV,~~eAAe~~,EAAQ,~~GAAM~~;~~GAC7B~~,CAAA,~~EACF~~,kBAAC,OAAD;GACE,~~KAAK~~;GACL,MAAK;GACL,cAAW;GACX,~~cAAY~~,EAAG,0BAA0B,~~gBAAgB~~;~~GACzD~~,UAAU;GACV,WAAU;~~aANZ~~,CAQE,kBAAC,OAAD;IAAK,WAAU;~~cAAf~~,CACE,kBAAC,MAAD;KAAI,WAAU;~~eACX~~,EAAG,0BAA0B,~~gBAAgB~~;~~KAC3C~~,CAAA,~~EACL~~,kBAAC,UAAD;KACE,MAAK;KACL,~~eAAe~~,EAAQ,~~GAAM~~;~~KAC7B~~,~~cAAY~~,EAAG,mBAAmB,~~QAAQ~~;~~KAC1C~~,WAAU;~~eAEV~~,~~kBAAC~~,GAAD,EAAG,MAAM,~~IAAM~~,CAAA;~~KACR~~,CAAA,CACL;~~OACN~~,kBAAC,OAAD;IAAK,WAAU;~~cACZ~~,KAAK,~~UAAU~~,GAAU,MAAM,~~EAAE~~;~~IAC9B~~,CAAA,CACF;~~KACF~~;~~IAEP~~,EAAA,CAAA"}
1	+ {"version":3,"file":"ManifestViewer.js","names":["_Fragment","ManifestViewer","open","setOpen","useState","dialogRef","useRef","useEffect","originalOverflow","onKeyDown","event","Fragment","FileJson","tr","X","manifest"],"sources":["../../../src/devportal/components/ManifestViewer.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\nimport { FileJson, X } from \"lucide-react\";\n\nexport interface ManifestViewerProps {\n manifest: Record<string, unknown>;\n tr: (key: string, fallback: string) => string;\n}\n\n/*\n Read-only modal for viewing a version's manifest.json, so developers and\n * reviewers can validate what was uploaded without leaving the page.\n */\nexport const ManifestViewer: FC<ManifestViewerProps> = ({ manifest, tr }) => {\n const [open, setOpen] = useState(false);\n const dialogRef = useRef<HTMLDivElement \| null>(null);\n\n useEffect(() => {\n if (!open) return undefined;\n\n const originalOverflow = document.body.style.overflow;\n document.body.style.overflow = \"hidden\";\n window.requestAnimationFrame(() => dialogRef.current?.focus());\n\n const onKeyDown = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n event.preventDefault();\n setOpen(false);\n }\n };\n document.addEventListener(\"keydown\", onKeyDown);\n\n return () => {\n document.body.style.overflow = originalOverflow;\n document.removeEventListener(\"keydown\", onKeyDown);\n };\n }, [open]);\n\n return (\n <>\n <button\n type=\"button\"\n onClick={() => setOpen(true)}\n className=\"inline-flex items-center gap-1.5 text-xs text-text-secondary hover:text-text-primary\"\n >\n <FileJson size={13} />\n {tr(\"devportal.viewManifest\", \"View manifest.json\")}\n </button>\n {open && (\n <div className=\"fixed inset-0 z-50 flex items-center justify-center p-4\">\n <button\n type=\"button\"\n aria-label=\"Close dialog backdrop\"\n className=\"absolute inset-0 bg-bg-overlay\"\n onClick={() => setOpen(false)}\n />\n <div\n ref={dialogRef}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={tr(\"devportal.manifestJson\", \"manifest.json\")}\n tabIndex={-1}\n className=\"relative z-10 flex max-h-[80vh] w-full max-w-2xl flex-col rounded-lg bg-bg-surface p-6 shadow-xl focus:outline-none\"\n >\n <div className=\"flex items-center justify-between gap-4\">\n <h3 className=\"text-lg font-semibold\">\n {tr(\"devportal.manifestJson\", \"manifest.json\")}\n </h3>\n <button\n type=\"button\"\n onClick={() => setOpen(false)}\n aria-label={tr(\"devportal.close\", \"Close\")}\n className=\"rounded-md p-1 text-text-secondary hover:bg-bg-sunken hover:text-text-primary\"\n >\n <X size={18} />\n </button>\n </div>\n <pre className=\"mt-4 flex-1 overflow-auto rounded-md bg-bg-sunken p-3 text-xs font-mono whitespace-pre-wrap break-all\">\n {JSON.stringify(manifest, null, 2)}\n </pre>\n </div>\n </div>\n )}\n </>\n );\n};\n"],"mappings":";;;;AAaA,IAAaC,KAA2C,EAAE,aAAU,YAAS;CAC3E,IAAM,CAACC,GAAMC,KAAWC,EAAS,EAAK,GAChCC,IAAYC,EAA8B,IAAI;CAuBpD,OArBAC,QAAgB;EACd,IAAI,CAACL,GAAM;EAEX,IAAMM,IAAmB,SAAS,KAAK,MAAM;EAE7C,AADA,SAAS,KAAK,MAAM,WAAW,UAC/B,OAAO,4BAA4BH,EAAU,SAAS,MAAM,CAAC;EAE7D,IAAMI,KAAa,MAAyB;GAC1C,AAAIC,EAAM,QAAQ,aAChBA,EAAM,eAAe,GACrBP,EAAQ,EAAK;EAEjB;EAGA,OAFA,SAAS,iBAAiB,WAAWM,CAAS,SAEjC;GAEX,AADA,SAAS,KAAK,MAAM,WAAWD,GAC/B,SAAS,oBAAoB,WAAWC,CAAS;EACnD;CACF,GAAG,CAACP,CAAI,CAAC,GAGP,kBAAAF,GAAA,EAAA,UAAA,CACE,kBAAC,UAAD;EACE,MAAK;EACL,eAAeG,EAAQ,EAAI;EAC3B,WAAU;EAHZ,UAAA,CAKE,kBAACS,GAAD,EAAU,MAAM,GAAK,CAAA,GACpBC,EAAG,0BAA0B,oBAAoB,CAC5C;CACP,CAAA,GAAAX,KACC,kBAAC,OAAD;EAAK,WAAU;EAAf,UAAA,CACE,kBAAC,UAAD;GACE,MAAK;GACL,cAAW;GACX,WAAU;GACV,eAAeC,EAAQ,EAAK;EAC7B,CAAA,GACD,kBAAC,OAAD;GACE,KAAKE;GACL,MAAK;GACL,cAAW;GACX,cAAYQ,EAAG,0BAA0B,eAAe;GACxD,UAAU;GACV,WAAU;GANZ,UAAA,CAQE,kBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACE,kBAAC,MAAD;KAAI,WAAU;KACX,UAAAA,EAAG,0BAA0B,eAAe;IAC3C,CAAA,GACJ,kBAAC,UAAD;KACE,MAAK;KACL,eAAeV,EAAQ,EAAK;KAC5B,cAAYU,EAAG,mBAAmB,OAAO;KACzC,WAAU;KAEV,UAAA,kBAACC,GAAD,EAAG,MAAM,GAAK,CAAA;IACR,CAAA,CACL;GACL,CAAA,GAAA,kBAAC,OAAD;IAAK,WAAU;IACZ,UAAA,KAAK,UAAUC,GAAU,MAAM,CAAC;GAC9B,CAAA,CACF;EACF,CAAA,CAAA;CAEP,CAAA,CAAA,EAAA,CAAA;AAEN"}

package/dist/devportal/components/MarkdownEditor.d.ts CHANGED Viewed

@@ -1,5 +1,4 @@
 import { FC, TextareaHTMLAttributes } from 'react';
 interface MarkdownEditorProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "className" | "value" | "onChange"> {
     label: string;
     value: string;
@@ -21,4 +20,3 @@ interface MarkdownEditorProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaEl
  */
 export declare const MarkdownEditor: FC<MarkdownEditorProps>;
 export {};
-//# sourceMappingURL=MarkdownEditor.d.ts.map

package/dist/devportal/components/MarkdownEditor.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { useCallback as t, useRef as n, useState as r } from "react";
 import { Markdown as i } from "@burdenoff/fe-libs/shared/components";
 import { Bold as a, Code as o, Italic as s, Link as c, List as l } from "lucide-react";
 import { jsx as u, jsxs as d } from "react/jsx-runtime";
-//#region src/devportal/components/MarkdownEditor.tsx
+// src/devportal/components/MarkdownEditor.tsx
 var f = [
 	{
 		key: "bold",
@@ -130,7 +130,6 @@ var f = [
 		]
 	});
 };
-//#endregion
 export { p as MarkdownEditor };
 //# sourceMappingURL=MarkdownEditor.js.map

package/dist/devportal/components/MarkdownEditor.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MarkdownEditor.js","names":[],"sources":["../../../src/devportal/components/MarkdownEditor.tsx"],"sourcesContent":["import type { FC, TextareaHTMLAttributes, ReactNode } from \"react\";\nimport { useState, useRef, useCallback } from \"react\";\nimport { Bold, Italic, Link, Code, List } from \"lucide-react\";\nimport { Markdown } from \"@burdenoff/fe-libs/shared/components\";\nimport { cn } from \"../utils/cn\";\n\ninterface MarkdownEditorProps extends Omit<\n TextareaHTMLAttributes<HTMLTextAreaElement>,\n \"className\" \| \"value\" \| \"onChange\"\n> {\n label: string;\n value: string;\n onChange: (value: string) => void;\n error?: string;\n hint?: string;\n required?: boolean;\n className?: string;\n rows?: number;\n showToolbar?: boolean;\n previewLabel?: string;\n writeLabel?: string;\n}\n\nconst TOOLBAR_BUTTONS: Array<{\n key: string;\n icon: typeof Bold;\n syntax: string;\n suffix?: string;\n label: string;\n}> = [\n { key: \"bold\", icon: Bold, syntax: \"\", label: \"Bold\" },\n { key: \"italic\", icon: Italic, syntax: \"_\", label: \"Italic\" },\n { key: \"code\", icon: Code, syntax: \"`\", label: \"Inline code\" },\n { key: \"link\", icon: Link, syntax: \"[\", suffix: \"](url)\", label: \"Link\" },\n { key: \"list\", icon: List, syntax: \"- \", label: \"Bullet list\" },\n];\n\n/\n * Reusable markdown editor with live preview and an optional formatting toolbar.\n \n The toolbar inserts markdown syntax around the current selection or at the\n * cursor position, mirroring common markdown editor behaviour.\n /\nexport const MarkdownEditor: FC<MarkdownEditorProps> = ({\n label,\n value,\n onChange,\n error,\n hint,\n required,\n className,\n rows = 6,\n showToolbar = true,\n previewLabel = \"Preview\",\n writeLabel = \"Write\",\n id,\n placeholder,\n ...props\n}) => {\n const fieldId = id \|\| label.toLowerCase().replace(/\\s+/g, \"-\");\n const textareaRef = useRef<HTMLTextAreaElement>(null);\n const [activeTab, setActiveTab] = useState<\"write\" \| \"preview\">(\"write\");\n\n const insertSyntax = useCallback(\n (syntax: string, suffix = syntax) => {\n const textarea = textareaRef.current;\n if (!textarea) return;\n\n const start = textarea.selectionStart;\n const end = textarea.selectionEnd;\n const before = value.slice(0, start);\n const selected = value.slice(start, end);\n const after = value.slice(end);\n\n let nextValue: string;\n let nextStart: number;\n let nextEnd: number;\n\n if (selected.length > 0) {\n // Wrap selection with syntax.\n nextValue = `${before}${syntax}${selected}${suffix}${after}`;\n nextStart = start + syntax.length;\n nextEnd = end + syntax.length;\n } else {\n // Insert syntax pair at cursor and place cursor between them.\n nextValue = `${before}${syntax}${suffix}${after}`;\n nextStart = start + syntax.length;\n nextEnd = nextStart;\n }\n\n onChange(nextValue);\n\n // Restore selection after React re-render.\n requestAnimationFrame(() => {\n textarea.focus();\n textarea.setSelectionRange(nextStart, nextEnd);\n });\n },\n [onChange, value],\n );\n\n const handleList = useCallback(() => {\n const textarea = textareaRef.current;\n if (!textarea) return;\n\n const start = textarea.selectionStart;\n const end = textarea.selectionEnd;\n const selected = value.slice(start, end);\n\n let replacement: string;\n if (selected.length > 0) {\n replacement = selected\n .split(\"\\n\")\n .map((line) => (line.startsWith(\"- \") ? line : `- ${line}`))\n .join(\"\\n\");\n } else {\n replacement = \"- \";\n }\n\n const before = value.slice(0, start);\n const after = value.slice(end);\n const nextValue = `${before}${replacement}${after}`;\n onChange(nextValue);\n\n requestAnimationFrame(() => {\n textarea.focus();\n const cursorPos = start + replacement.length;\n textarea.setSelectionRange(cursorPos, cursorPos);\n });\n }, [onChange, value]);\n\n return (\n <div className={cn(\"space-y-2\", className)}>\n <label htmlFor={fieldId} className=\"block text-sm font-medium\">\n {label}\n {required && <span className=\"text-status-error-text ml-1\"></span>}\n </label>\n\n {showToolbar && (\n <div className=\"flex items-center gap-1\">\n {TOOLBAR_BUTTONS.map((button) => (\n <button\n key={button.key}\n type=\"button\"\n onClick={() =>\n button.key === \"list\"\n ? handleList()\n : insertSyntax(button.syntax, button.suffix)\n }\n title={button.label}\n className=\"inline-flex items-center justify-center rounded-md p-1.5 text-text-secondary hover:bg-bg-sunken hover:text-text-primary focus:outline-none focus:ring-1 focus:ring-primary\"\n >\n <button.icon size={14} />\n </button>\n ))}\n </div>\n )}\n\n <div className=\"rounded-md border border-border-default overflow-hidden\">\n <div className=\"flex border-b border-border-default bg-bg-sunken\">\n <button\n type=\"button\"\n onClick={() => setActiveTab(\"write\")}\n className={cn(\n \"px-3 py-1.5 text-xs font-medium\",\n activeTab === \"write\"\n ? \"bg-bg-surface text-text-primary border-b-2 border-primary\"\n : \"text-text-secondary hover:text-text-primary\",\n )}\n >\n {writeLabel}\n </button>\n <button\n type=\"button\"\n onClick={() => setActiveTab(\"preview\")}\n className={cn(\n \"px-3 py-1.5 text-xs font-medium\",\n activeTab === \"preview\"\n ? \"bg-bg-surface text-text-primary border-b-2 border-primary\"\n : \"text-text-secondary hover:text-text-primary\",\n )}\n >\n {previewLabel}\n </button>\n </div>\n\n <div className={cn(activeTab !== \"write\" && \"hidden\")}>\n <textarea\n ref={textareaRef}\n id={fieldId}\n rows={rows}\n value={value}\n onChange={(e) => onChange(e.target.value)}\n placeholder={placeholder}\n className={cn(\n \"w-full bg-bg-surface px-3 py-2 text-sm resize-y\",\n \"focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent\",\n \"placeholder:text-text-secondary\",\n )}\n {...props}\n />\n </div>\n\n {activeTab === \"preview\" && (\n <div className=\"min-h-[theme(spacing.24)] bg-bg-surface px-3 py-2\">\n {value.trim() ? (\n <Markdown className=\"text-sm text-text-primary\">{value}</Markdown>\n ) : (\n <p className=\"text-sm text-text-secondary italic\">\n {placeholder \|\| \"Nothing to preview yet.\"}\n </p>\n )}\n </div>\n )}\n </div>\n\n {hint && !error && <p className=\"text-xs text-text-secondary\">{hint}</p>}\n {error && <p className=\"text-xs text-status-error-text\">{error}</p>}\n </div>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"MarkdownEditor.js","names":["TOOLBAR_BUTTONS","Bold","Italic","Code","Link","List","MarkdownEditor","props","fieldId","id","label","textareaRef","useRef","activeTab","setActiveTab","useState","insertSyntax","useCallback","syntax","textarea","start","end","before","value","selected","after","nextValue","nextStart","nextEnd","suffix","onChange","handleList","replacement","line","cursorPos","cn","className","required","showToolbar","button","writeLabel","previewLabel","Markdown","placeholder","hint","error"],"sources":["../../../src/devportal/components/MarkdownEditor.tsx"],"sourcesContent":["import type { FC, TextareaHTMLAttributes, ReactNode } from \"react\";\nimport { useState, useRef, useCallback } from \"react\";\nimport { Bold, Italic, Link, Code, List } from \"lucide-react\";\nimport { Markdown } from \"@burdenoff/fe-libs/shared/components\";\nimport { cn } from \"../utils/cn\";\n\ninterface MarkdownEditorProps extends Omit<\n TextareaHTMLAttributes<HTMLTextAreaElement>,\n \"className\" \| \"value\" \| \"onChange\"\n> {\n label: string;\n value: string;\n onChange: (value: string) => void;\n error?: string;\n hint?: string;\n required?: boolean;\n className?: string;\n rows?: number;\n showToolbar?: boolean;\n previewLabel?: string;\n writeLabel?: string;\n}\n\nconst TOOLBAR_BUTTONS: Array<{\n key: string;\n icon: typeof Bold;\n syntax: string;\n suffix?: string;\n label: string;\n}> = [\n { key: \"bold\", icon: Bold, syntax: \"\", label: \"Bold\" },\n { key: \"italic\", icon: Italic, syntax: \"_\", label: \"Italic\" },\n { key: \"code\", icon: Code, syntax: \"`\", label: \"Inline code\" },\n { key: \"link\", icon: Link, syntax: \"[\", suffix: \"](url)\", label: \"Link\" },\n { key: \"list\", icon: List, syntax: \"- \", label: \"Bullet list\" },\n];\n\n/\n * Reusable markdown editor with live preview and an optional formatting toolbar.\n \n The toolbar inserts markdown syntax around the current selection or at the\n * cursor position, mirroring common markdown editor behaviour.\n /\nexport const MarkdownEditor: FC<MarkdownEditorProps> = ({\n label,\n value,\n onChange,\n error,\n hint,\n required,\n className,\n rows = 6,\n showToolbar = true,\n previewLabel = \"Preview\",\n writeLabel = \"Write\",\n id,\n placeholder,\n ...props\n}) => {\n const fieldId = id \|\| label.toLowerCase().replace(/\\s+/g, \"-\");\n const textareaRef = useRef<HTMLTextAreaElement>(null);\n const [activeTab, setActiveTab] = useState<\"write\" \| \"preview\">(\"write\");\n\n const insertSyntax = useCallback(\n (syntax: string, suffix = syntax) => {\n const textarea = textareaRef.current;\n if (!textarea) return;\n\n const start = textarea.selectionStart;\n const end = textarea.selectionEnd;\n const before = value.slice(0, start);\n const selected = value.slice(start, end);\n const after = value.slice(end);\n\n let nextValue: string;\n let nextStart: number;\n let nextEnd: number;\n\n if (selected.length > 0) {\n // Wrap selection with syntax.\n nextValue = `${before}${syntax}${selected}${suffix}${after}`;\n nextStart = start + syntax.length;\n nextEnd = end + syntax.length;\n } else {\n // Insert syntax pair at cursor and place cursor between them.\n nextValue = `${before}${syntax}${suffix}${after}`;\n nextStart = start + syntax.length;\n nextEnd = nextStart;\n }\n\n onChange(nextValue);\n\n // Restore selection after React re-render.\n requestAnimationFrame(() => {\n textarea.focus();\n textarea.setSelectionRange(nextStart, nextEnd);\n });\n },\n [onChange, value],\n );\n\n const handleList = useCallback(() => {\n const textarea = textareaRef.current;\n if (!textarea) return;\n\n const start = textarea.selectionStart;\n const end = textarea.selectionEnd;\n const selected = value.slice(start, end);\n\n let replacement: string;\n if (selected.length > 0) {\n replacement = selected\n .split(\"\\n\")\n .map((line) => (line.startsWith(\"- \") ? line : `- ${line}`))\n .join(\"\\n\");\n } else {\n replacement = \"- \";\n }\n\n const before = value.slice(0, start);\n const after = value.slice(end);\n const nextValue = `${before}${replacement}${after}`;\n onChange(nextValue);\n\n requestAnimationFrame(() => {\n textarea.focus();\n const cursorPos = start + replacement.length;\n textarea.setSelectionRange(cursorPos, cursorPos);\n });\n }, [onChange, value]);\n\n return (\n <div className={cn(\"space-y-2\", className)}>\n <label htmlFor={fieldId} className=\"block text-sm font-medium\">\n {label}\n {required && <span className=\"text-status-error-text ml-1\"></span>}\n </label>\n\n {showToolbar && (\n <div className=\"flex items-center gap-1\">\n {TOOLBAR_BUTTONS.map((button) => (\n <button\n key={button.key}\n type=\"button\"\n onClick={() =>\n button.key === \"list\"\n ? handleList()\n : insertSyntax(button.syntax, button.suffix)\n }\n title={button.label}\n className=\"inline-flex items-center justify-center rounded-md p-1.5 text-text-secondary hover:bg-bg-sunken hover:text-text-primary focus:outline-none focus:ring-1 focus:ring-primary\"\n >\n <button.icon size={14} />\n </button>\n ))}\n </div>\n )}\n\n <div className=\"rounded-md border border-border-default overflow-hidden\">\n <div className=\"flex border-b border-border-default bg-bg-sunken\">\n <button\n type=\"button\"\n onClick={() => setActiveTab(\"write\")}\n className={cn(\n \"px-3 py-1.5 text-xs font-medium\",\n activeTab === \"write\"\n ? \"bg-bg-surface text-text-primary border-b-2 border-primary\"\n : \"text-text-secondary hover:text-text-primary\",\n )}\n >\n {writeLabel}\n </button>\n <button\n type=\"button\"\n onClick={() => setActiveTab(\"preview\")}\n className={cn(\n \"px-3 py-1.5 text-xs font-medium\",\n activeTab === \"preview\"\n ? \"bg-bg-surface text-text-primary border-b-2 border-primary\"\n : \"text-text-secondary hover:text-text-primary\",\n )}\n >\n {previewLabel}\n </button>\n </div>\n\n <div className={cn(activeTab !== \"write\" && \"hidden\")}>\n <textarea\n ref={textareaRef}\n id={fieldId}\n rows={rows}\n value={value}\n onChange={(e) => onChange(e.target.value)}\n placeholder={placeholder}\n className={cn(\n \"w-full bg-bg-surface px-3 py-2 text-sm resize-y\",\n \"focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent\",\n \"placeholder:text-text-secondary\",\n )}\n {...props}\n />\n </div>\n\n {activeTab === \"preview\" && (\n <div className=\"min-h-[theme(spacing.24)] bg-bg-surface px-3 py-2\">\n {value.trim() ? (\n <Markdown className=\"text-sm text-text-primary\">{value}</Markdown>\n ) : (\n <p className=\"text-sm text-text-secondary italic\">\n {placeholder \|\| \"Nothing to preview yet.\"}\n </p>\n )}\n </div>\n )}\n </div>\n\n {hint && !error && <p className=\"text-xs text-text-secondary\">{hint}</p>}\n {error && <p className=\"text-xs text-status-error-text\">{error}</p>}\n </div>\n );\n};\n"],"mappings":";;;;;;AAuBA,IAAMA,IAMD;CACH;EAAE,KAAK;EAAQ,MAAMC;EAAM,QAAQ;EAAM,OAAO;CAAO;CACvD;EAAE,KAAK;EAAU,MAAMC;EAAQ,QAAQ;EAAK,OAAO;CAAS;CAC5D;EAAE,KAAK;EAAQ,MAAMC;EAAM,QAAQ;EAAK,OAAO;CAAc;CAC7D;EAAE,KAAK;EAAQ,MAAMC;EAAM,QAAQ;EAAK,QAAQ;EAAU,OAAO;CAAO;CACxE;EAAE,KAAK;EAAQ,MAAMC;EAAM,QAAQ;EAAM,OAAO;CAAc;AAChE,GAQaC,KAA2C,EACtD,UACA,UACA,aACA,UACA,SACA,aACA,cACA,UAAO,GACP,iBAAc,IACd,kBAAe,WACf,gBAAa,SACb,OACA,gBACA,GAAGC,QACC;CACJ,IAAMC,IAAUC,KAAMC,EAAM,YAAY,CAAC,CAAC,QAAQ,QAAQ,GAAG,GACvDC,IAAcC,EAA4B,IAAI,GAC9C,CAACC,GAAWC,KAAgBC,EAA8B,OAAO,GAEjEC,IAAeC,GAClB,GAAgB,IAASC,MAAW;EACnC,IAAMC,IAAWR,EAAY;EAC7B,IAAI,CAACQ,GAAU;EAEf,IAAMC,IAAQD,EAAS,gBACjBE,IAAMF,EAAS,cACfG,IAASC,EAAM,MAAM,GAAGH,CAAK,GAC7BI,IAAWD,EAAM,MAAMH,GAAOC,CAAG,GACjCI,IAAQF,EAAM,MAAMF,CAAG,GAEzBK,GACAC,GACAC;EAiBJ,AAfIJ,EAAS,SAAS,KAEpB,IAAY,GAAGF,IAASJ,IAASM,IAAWK,IAASJ,KACrD,IAAYL,IAAQF,EAAO,QAC3B,IAAUG,IAAMH,EAAO,WAGvB,IAAY,GAAGI,IAASJ,IAASW,IAASJ,KAC1C,IAAYL,IAAQF,EAAO,QAC3B,IAAUS,IAGZG,EAASJ,CAAS,GAGlB,4BAA4B;GAE1B,AADAP,EAAS,MAAM,GACfA,EAAS,kBAAkBQ,GAAWC,CAAO;EAC/C,CAAC;CACH,GACA,CAACE,GAAUP,CAAK,CAClB,GAEMQ,IAAad,QAAkB;EACnC,IAAME,IAAWR,EAAY;EAC7B,IAAI,CAACQ,GAAU;EAEf,IAAMC,IAAQD,EAAS,gBACjBE,IAAMF,EAAS,cACfK,IAAWD,EAAM,MAAMH,GAAOC,CAAG,GAEnCW;EACJ,AAMEA,IANER,EAAS,SAAS,IACNA,EACX,MAAM,IAAI,CAAC,CACX,KAAK,MAAUS,EAAK,WAAW,IAAI,IAAIA,IAAO,KAAKA,GAAO,CAAC,CAC3D,KAAK,IAAI,IAEE;EAGhB,IAAMX,IAASC,EAAM,MAAM,GAAGH,CAAK,GAC7BK,IAAQF,EAAM,MAAMF,CAAG;EAI7B,AAFAS,EAAS,GADYR,IAASU,IAAcP,GAC1B,GAElB,4BAA4B;GAC1B,EAAS,MAAM;GACf,IAAMS,IAAYd,IAAQY,EAAY;GACtC,EAAS,kBAAkBE,GAAWA,CAAS;EACjD,CAAC;CACH,GAAG,CAACJ,GAAUP,CAAK,CAAC;CAEpB,OACE,kBAAC,OAAD;EAAK,WAAWY,EAAG,aAAaC,CAAS;EAAzC,UAAA;GACE,kBAAC,SAAD;IAAO,SAAS5B;IAAS,WAAU;IAAnC,UAAA,CACGE,GACA2B,KAAY,kBAAC,QAAD;KAAM,WAAU;KAA8B,UAAA;IAAO,CAAA,CAC7D;;GAENC,KACC,kBAAC,OAAD;IAAK,WAAU;IACZ,UAAAtC,EAAgB,KAAK,MACpB,kBAAC,UAAD;KAEE,MAAK;KACL,eACEuC,EAAO,QAAQ,SACXR,EAAW,IACXf,EAAauB,EAAO,QAAQA,EAAO,MAAM;KAE/C,OAAOA,EAAO;KACd,WAAU;KAEV,UAAA,kBAACA,EAAO,MAAR,EAAa,MAAM,GAAK,CAAA;IAClB,GAXDA,EAAO,GAWN,CACT;GACE,CAAA;GAGP,kBAAC,OAAD;IAAK,WAAU;IAAf,UAAA;KACE,kBAAC,OAAD;MAAK,WAAU;MAAf,UAAA,CACE,kBAAC,UAAD;OACE,MAAK;OACL,eAAezB,EAAa,OAAO;OACnC,WAAWqB,EACT,mCACAtB,MAAc,UACV,8DACA,6CACN;OAEC,UAAA2B;MACK,CAAA,GACR,kBAAC,UAAD;OACE,MAAK;OACL,eAAe1B,EAAa,SAAS;OACrC,WAAWqB,EACT,mCACAtB,MAAc,YACV,8DACA,6CACN;OAEC,UAAA4B;MACK,CAAA,CACL;;KAEL,kBAAC,OAAD;MAAK,WAAWN,EAAGtB,MAAc,WAAW,QAAQ;MAClD,UAAA,kBAAC,YAAD;OACE,KAAKF;OACL,IAAIH;OACE;OACC;OACP,WAAW,MAAMsB,EAAS,EAAE,OAAO,KAAK;OAC3B;OACb,WAAWK,EACT,mDACA,+EACA,iCACF;OACA,GAAI5B;MACL,CAAA;KACE,CAAA;KAEJM,MAAc,aACb,kBAAC,OAAD;MAAK,WAAU;MACZ,UAAAU,EAAM,KAAK,IACV,kBAACmB,GAAD;OAAU,WAAU;OAA6B,UAAAnB;MAAgB,CAAA,IAEjE,kBAAC,KAAD;OAAG,WAAU;OACV,UAAAoB,KAAe;MACf,CAAA;KAEF,CAAA;IAEJ;;GAEJC,KAAQ,CAACC,KAAS,kBAAC,KAAD;IAAG,WAAU;IAA+B,UAAAD;GAAQ,CAAA;GACtEC,KAAS,kBAAC,KAAD;IAAG,WAAU;IAAkC,UAAAA;GAAS,CAAA;EAC/D;;AAET"}

package/dist/devportal/components/MultiSelectCombobox.d.ts CHANGED Viewed

@@ -33,6 +33,5 @@ interface MultiSelectComboboxProps {
     className?: string;
     error?: boolean;
 }
-export declare function MultiSelectCombobox({ options, selected, onChange, placeholder, searchPlaceholder, emptyText, id, disabled, className, error, }: MultiSelectComboboxProps): import("react").JSX.Element;
+export declare function MultiSelectCombobox({ options, selected, onChange, placeholder, searchPlaceholder, emptyText, id, disabled, className, error, }: MultiSelectComboboxProps): import('react').JSX.Element;
 export {};
-//# sourceMappingURL=MultiSelectCombobox.d.ts.map

package/dist/devportal/components/MultiSelectCombobox.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { useMemo as t, useState as n } from "react";
 import { Check as r, ChevronDown as i, X as a } from "lucide-react";
 import { jsx as o, jsxs as s } from "react/jsx-runtime";
 import { Command as c, CommandEmpty as l, CommandInput as u, CommandItem as d, CommandList as f, Popover as p, PopoverContent as m, PopoverTrigger as h } from "@burdenoff/fe-libs/ui";
-//#region src/devportal/components/MultiSelectCombobox.tsx
+// src/devportal/components/MultiSelectCombobox.tsx
 function g({ options: g, selected: _, onChange: v, placeholder: y = "Select…", searchPlaceholder: b = "Search…", emptyText: x = "No matches.", id: S, disabled: C = !1, className: w, error: T = !1 }) {
 	let [E, D] = n(!1), O = t(() => new Set(_), [_]), k = t(() => g.filter((e) => O.has(e.value)), [g, O]), A = (e) => {
 		v(O.has(e) ? _.filter((t) => t !== e) : [..._, e]);
@@ -74,7 +74,6 @@ function g({ options: g, selected: _, onChange: v, placeholder: y = "Select…",
 		})]
 	});
 }
-//#endregion
 export { g as MultiSelectCombobox };
 //# sourceMappingURL=MultiSelectCombobox.js.map

package/dist/devportal/components/MultiSelectCombobox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MultiSelectCombobox.js","names":[],"sources":["../../../src/devportal/components/MultiSelectCombobox.tsx"],"sourcesContent":["/*\n MultiSelectCombobox — a searchable, checkbox multi-select.\n * @module devportal/components\n \n Drop-in replacement for a flat checkbox-pill grid wherever the option\n * list can grow past a handful of items (e.g. Compatible Products, which\n * lists every active platform product). A closed-by-default trigger opens\n * a searchable popover list with a checkmark per selected item; picking an\n * item toggles it without closing the popover, and every selected item\n * renders as a removable chip below the trigger.\n \n Built entirely on the existing fe-libs `ui` primitives (Command + Popover)\n * — no new dependency. Mirrors the proven Popover+Command composition used\n * by intelwatchtower's `Combobox` (single-select) and manufacturedops'\n * `TagPicker` (chips-below-trigger), adapted for a fixed, fully-client-side\n * option list (no server search/create needed here).\n /\n\nimport { useMemo, useState } from \"react\";\nimport { Check, ChevronDown, X } from \"lucide-react\";\nimport {\n Command,\n CommandEmpty,\n CommandInput,\n CommandItem,\n CommandList,\n Popover,\n PopoverContent,\n PopoverTrigger,\n} from \"@burdenoff/fe-libs/ui\";\nimport { cn } from \"../utils/cn\";\n\nexport interface MultiSelectOption {\n value: string;\n label: string;\n /* Optional secondary text rendered muted next to the label. */\n hint?: string;\n}\n\ninterface MultiSelectComboboxProps {\n options: MultiSelectOption[];\n selected: string[];\n onChange: (selected: string[]) => void;\n placeholder?: string;\n searchPlaceholder?: string;\n emptyText?: string;\n id?: string;\n disabled?: boolean;\n className?: string;\n error?: boolean;\n}\n\nexport function MultiSelectCombobox({\n options,\n selected,\n onChange,\n placeholder = \"Select…\",\n searchPlaceholder = \"Search…\",\n emptyText = \"No matches.\",\n id,\n disabled = false,\n className,\n error = false,\n}: MultiSelectComboboxProps) {\n const [open, setOpen] = useState(false);\n const selectedSet = useMemo(() => new Set(selected), [selected]);\n const selectedOptions = useMemo(\n () => options.filter((o) => selectedSet.has(o.value)),\n [options, selectedSet],\n );\n\n const toggle = (value: string) => {\n onChange(\n selectedSet.has(value)\n ? selected.filter((v) => v !== value)\n : [...selected, value],\n );\n };\n\n return (\n <div className={className}>\n <Popover open={open} onOpenChange={setOpen}>\n <PopoverTrigger asChild>\n <button\n type=\"button\"\n id={id}\n role=\"combobox\"\n aria-expanded={open}\n disabled={disabled}\n className={cn(\n \"flex h-10 w-full items-center justify-between gap-2 rounded-input border bg-bg-surface px-3 py-2 text-sm transition-colors duration-200 focus:border-border-focus focus:outline-none focus:shadow-[var(--shadow-focus)] focus:ring-1 focus:ring-[var(--color-focus-ring)] disabled:cursor-not-allowed disabled:opacity-50\",\n error ? \"border-status-error-bg/50\" : \"border-border-default\",\n selectedOptions.length > 0\n ? \"text-text-primary\"\n : \"text-text-placeholder\",\n )}\n >\n <span className=\"truncate\">\n {selectedOptions.length > 0\n ? `${selectedOptions.length} selected`\n : placeholder}\n </span>\n <ChevronDown\n className=\"size-4 shrink-0 text-text-muted\"\n aria-hidden=\"true\"\n />\n </button>\n </PopoverTrigger>\n <PopoverContent\n align=\"start\"\n className=\"w-[var(--radix-popover-trigger-width)] p-0 border-border-subtle bg-bg-elevated\"\n >\n <Command className=\"bg-bg-elevated text-text-primary\">\n <CommandInput placeholder={searchPlaceholder} />\n <CommandList>\n <CommandEmpty>{emptyText}</CommandEmpty>\n {options.map((o) => {\n const checked = selectedSet.has(o.value);\n return (\n <CommandItem\n key={o.value}\n value={o.label}\n onSelect={() => toggle(o.value)}\n >\n <Check\n className={cn(\n \"size-4 shrink-0\",\n checked ? \"opacity-100\" : \"opacity-0\",\n )}\n aria-hidden=\"true\"\n />\n <span className=\"truncate\">{o.label}</span>\n {o.hint && (\n <span className=\"ml-auto truncate text-xs text-text-tertiary\">\n {o.hint}\n </span>\n )}\n </CommandItem>\n );\n })}\n </CommandList>\n </Command>\n </PopoverContent>\n </Popover>\n\n {selectedOptions.length > 0 && (\n <div className=\"mt-2 flex flex-wrap gap-1.5\">\n {selectedOptions.map((o) => (\n <span\n key={o.value}\n className=\"inline-flex items-center gap-1 rounded-full border border-border-subtle bg-bg-sunken px-2 py-1 text-xs text-text-primary\"\n >\n {o.label}\n <button\n type=\"button\"\n onClick={() => toggle(o.value)}\n disabled={disabled}\n className=\"text-text-secondary hover:text-text-primary disabled:cursor-not-allowed\"\n aria-label={`Remove ${o.label}`}\n >\n <X className=\"size-3\" />\n </button>\n </span>\n ))}\n </div>\n )}\n </div>\n );\n}\n"],"mappings":";;;;;;AAoDA,~~SAAgB~~,EAAoB,EAClC,YACA,aACA,aACA,iBAAc,WACd,uBAAoB,WACpB,eAAY,eACZ,OACA,cAAW,IACX,cACA,WAAQ,MACmB;CAC3B,IAAM,~~CAAC~~,~~GAAM~~,~~KAAW~~,EAAS,~~GAAM~~,~~EACjC~~,~~IAAc~~,QAAc,IAAI,~~IAAI~~,~~EAAS~~,~~EAAE~~,~~CAAC~~,~~EAAS~~,CAAC,~~EAC1D~~,~~IAAkB~~,~~QAChB~~,EAAQ,QAAQ,~~MAAM~~,EAAY,~~IAAI~~,EAAE,~~MAAM~~,CAAC,~~EACrD~~,~~CAAC~~,~~GAAS~~,~~EAAY~~,CACvB,~~EAEK~~,KAAU,MAAkB;~~AAChC~~,~~IACE~~,EAAY,~~IAAI~~,~~EAAM~~,~~GAClB~~,EAAS,QAAQ,~~MAAM~~,~~MAAM~~,~~EAAM~~,~~GACnC~~,CAAC,~~GAAG~~,~~GAAU~~,~~EAAM~~,CACzB~~;;AAGH~~,~~QACE~~,kBAAC,OAAD;EAAgB;~~YAAhB~~,CACE,~~kBAAC~~,GAAD;GAAe;GAAM,~~cAAc~~;~~aAAnC~~,CACE,~~kBAAC~~,GAAD;IAAgB,SAAA;~~cACd~~,kBAAC,UAAD;KACE,MAAK;KACD;KACJ,MAAK;KACL,~~iBAAe~~;KACL;KACV,~~WAAW~~,EACT,~~6TACA~~,IAAQ,8BAA8B,~~yBACtC~~,EAAgB,SAAS,IACrB,sBACA,~~wBACL~~;~~eAZH~~,CAcE,kBAAC,QAAD;MAAM,WAAU;~~gBACb~~,EAAgB,SAAS,IACtB,~~GAAG~~,EAAgB,OAAO,~~aAC1B~~;~~MACC~~,CAAA,~~EACP~~,~~kBAAC~~,GAAD;MACE,WAAU;MACV,eAAY;~~MACZ~~,CAAA,CACK;;~~IACM~~,CAAA,~~EACjB~~,~~kBAAC~~,GAAD;IACE,OAAM;IACN,WAAU;~~cAEV~~,~~kBAAC~~,GAAD;KAAS,WAAU;~~eAAnB~~,CACE,~~kBAAC~~,GAAD,EAAc,~~aAAa~~,~~GAAqB~~,CAAA,~~EAChD~~,~~kBAAC~~,GAAD,EAAA,UAAA,CACE,~~kBAAC~~,GAAD,EAAA,~~UAAe~~,~~GAAyB~~,CAAA,~~EACvC~~,EAAQ,KAAK,MAAM;MAClB,~~IAAM~~,~~IAAU~~,EAAY,~~IAAI~~,EAAE,~~MAAM~~;~~AACxC~~,~~aACE~~,~~kBAAC~~,GAAD;OAEE,~~OAAO~~,EAAE;OACT,~~gBAAgB~~,~~EAAO~~,EAAE,~~MAAM~~;~~iBAHjC~~;QAKE,~~kBAAC~~,GAAD;SACE,~~WAAW~~,EACT,~~mBACA~~,IAAU,gBAAgB,~~YAC3B~~;~~SACD~~,eAAY;~~SACZ~~,CAAA;~~QACF~~,kBAAC,QAAD;SAAM,WAAU;~~mBAAY~~,EAAE;~~SAAa~~,CAAA;~~QAC1C~~,EAAE,QACD,kBAAC,QAAD;SAAM,WAAU;~~mBACb~~,EAAE;~~SACE~~,CAAA;~~QAEG~~;~~SAjBP~~,EAAE,~~MAiBK~~;~~OAEhB~~,CACU,EAAA,CAAA,CACN;;~~IACK~~,CAAA,CACT;~~MAET~~,EAAgB,SAAS,KACxB,kBAAC,OAAD;GAAK,WAAU;~~aACZ~~,EAAgB,KAAK,MACpB,kBAAC,QAAD;IAEE,WAAU;~~cAFZ~~,~~CAIG~~,EAAE,OACH,kBAAC,UAAD;KACE,MAAK;KACL,~~eAAe~~,~~EAAO~~,EAAE,~~MAAM~~;~~KACpB~~;KACV,WAAU;KACV,cAAY,~~UAAU~~,EAAE;~~eAExB~~,~~kBAAC~~,GAAD,EAAG,WAAU,~~UAAW~~,CAAA;~~KACjB~~,CAAA,CACJ;~~MAbA~~,EAAE,~~MAaF~~,CACP;~~GACE~~,CAAA,CAEJ"}
1	+ {"version":3,"file":"MultiSelectCombobox.js","names":["MultiSelectCombobox","open","setOpen","useState","selectedSet","useMemo","selected","selectedOptions","options","o","toggle","value","v","Popover","PopoverTrigger","cn","error","placeholder","ChevronDown","PopoverContent","Command","CommandInput","searchPlaceholder","CommandList","CommandEmpty","emptyText","checked","CommandItem","Check","X"],"sources":["../../../src/devportal/components/MultiSelectCombobox.tsx"],"sourcesContent":["/*\n MultiSelectCombobox — a searchable, checkbox multi-select.\n * @module devportal/components\n \n Drop-in replacement for a flat checkbox-pill grid wherever the option\n * list can grow past a handful of items (e.g. Compatible Products, which\n * lists every active platform product). A closed-by-default trigger opens\n * a searchable popover list with a checkmark per selected item; picking an\n * item toggles it without closing the popover, and every selected item\n * renders as a removable chip below the trigger.\n \n Built entirely on the existing fe-libs `ui` primitives (Command + Popover)\n * — no new dependency. Mirrors the proven Popover+Command composition used\n * by intelwatchtower's `Combobox` (single-select) and manufacturedops'\n * `TagPicker` (chips-below-trigger), adapted for a fixed, fully-client-side\n * option list (no server search/create needed here).\n /\n\nimport { useMemo, useState } from \"react\";\nimport { Check, ChevronDown, X } from \"lucide-react\";\nimport {\n Command,\n CommandEmpty,\n CommandInput,\n CommandItem,\n CommandList,\n Popover,\n PopoverContent,\n PopoverTrigger,\n} from \"@burdenoff/fe-libs/ui\";\nimport { cn } from \"../utils/cn\";\n\nexport interface MultiSelectOption {\n value: string;\n label: string;\n /* Optional secondary text rendered muted next to the label. */\n hint?: string;\n}\n\ninterface MultiSelectComboboxProps {\n options: MultiSelectOption[];\n selected: string[];\n onChange: (selected: string[]) => void;\n placeholder?: string;\n searchPlaceholder?: string;\n emptyText?: string;\n id?: string;\n disabled?: boolean;\n className?: string;\n error?: boolean;\n}\n\nexport function MultiSelectCombobox({\n options,\n selected,\n onChange,\n placeholder = \"Select…\",\n searchPlaceholder = \"Search…\",\n emptyText = \"No matches.\",\n id,\n disabled = false,\n className,\n error = false,\n}: MultiSelectComboboxProps) {\n const [open, setOpen] = useState(false);\n const selectedSet = useMemo(() => new Set(selected), [selected]);\n const selectedOptions = useMemo(\n () => options.filter((o) => selectedSet.has(o.value)),\n [options, selectedSet],\n );\n\n const toggle = (value: string) => {\n onChange(\n selectedSet.has(value)\n ? selected.filter((v) => v !== value)\n : [...selected, value],\n );\n };\n\n return (\n <div className={className}>\n <Popover open={open} onOpenChange={setOpen}>\n <PopoverTrigger asChild>\n <button\n type=\"button\"\n id={id}\n role=\"combobox\"\n aria-expanded={open}\n disabled={disabled}\n className={cn(\n \"flex h-10 w-full items-center justify-between gap-2 rounded-input border bg-bg-surface px-3 py-2 text-sm transition-colors duration-200 focus:border-border-focus focus:outline-none focus:shadow-[var(--shadow-focus)] focus:ring-1 focus:ring-[var(--color-focus-ring)] disabled:cursor-not-allowed disabled:opacity-50\",\n error ? \"border-status-error-bg/50\" : \"border-border-default\",\n selectedOptions.length > 0\n ? \"text-text-primary\"\n : \"text-text-placeholder\",\n )}\n >\n <span className=\"truncate\">\n {selectedOptions.length > 0\n ? `${selectedOptions.length} selected`\n : placeholder}\n </span>\n <ChevronDown\n className=\"size-4 shrink-0 text-text-muted\"\n aria-hidden=\"true\"\n />\n </button>\n </PopoverTrigger>\n <PopoverContent\n align=\"start\"\n className=\"w-[var(--radix-popover-trigger-width)] p-0 border-border-subtle bg-bg-elevated\"\n >\n <Command className=\"bg-bg-elevated text-text-primary\">\n <CommandInput placeholder={searchPlaceholder} />\n <CommandList>\n <CommandEmpty>{emptyText}</CommandEmpty>\n {options.map((o) => {\n const checked = selectedSet.has(o.value);\n return (\n <CommandItem\n key={o.value}\n value={o.label}\n onSelect={() => toggle(o.value)}\n >\n <Check\n className={cn(\n \"size-4 shrink-0\",\n checked ? \"opacity-100\" : \"opacity-0\",\n )}\n aria-hidden=\"true\"\n />\n <span className=\"truncate\">{o.label}</span>\n {o.hint && (\n <span className=\"ml-auto truncate text-xs text-text-tertiary\">\n {o.hint}\n </span>\n )}\n </CommandItem>\n );\n })}\n </CommandList>\n </Command>\n </PopoverContent>\n </Popover>\n\n {selectedOptions.length > 0 && (\n <div className=\"mt-2 flex flex-wrap gap-1.5\">\n {selectedOptions.map((o) => (\n <span\n key={o.value}\n className=\"inline-flex items-center gap-1 rounded-full border border-border-subtle bg-bg-sunken px-2 py-1 text-xs text-text-primary\"\n >\n {o.label}\n <button\n type=\"button\"\n onClick={() => toggle(o.value)}\n disabled={disabled}\n className=\"text-text-secondary hover:text-text-primary disabled:cursor-not-allowed\"\n aria-label={`Remove ${o.label}`}\n >\n <X className=\"size-3\" />\n </button>\n </span>\n ))}\n </div>\n )}\n </div>\n );\n}\n"],"mappings":";;;;;;AAoDA,SAAgBA,EAAoB,EAClC,YACA,aACA,aACA,iBAAc,WACd,uBAAoB,WACpB,eAAY,eACZ,OACA,cAAW,IACX,cACA,WAAQ,MACmB;CAC3B,IAAM,CAACC,GAAMC,KAAWC,EAAS,EAAK,GAChCC,IAAcC,QAAc,IAAI,IAAIC,CAAQ,GAAG,CAACA,CAAQ,CAAC,GACzDC,IAAkBF,QAChBG,EAAQ,QAAQ,MAAMJ,EAAY,IAAIK,EAAE,KAAK,CAAC,GACpD,CAACD,GAASJ,CAAW,CACvB,GAEMM,KAAU,MAAkB;EAChC,EACEN,EAAY,IAAIO,CAAK,IACjBL,EAAS,QAAQ,MAAMM,MAAMD,CAAK,IAClC,CAAC,GAAGL,GAAUK,CAAK,CACzB;CACF;CAEA,OACE,kBAAC,OAAD;EAAgB;EAAhB,UAAA,CACE,kBAACE,GAAD;GAAe;GAAM,cAAcX;GAAnC,UAAA,CACE,kBAACY,GAAD;IAAgB,SAAA;IACd,UAAA,kBAAC,UAAD;KACE,MAAK;KACD;KACJ,MAAK;KACL,iBAAeb;KACL;KACV,WAAWc,EACT,6TACAC,IAAQ,8BAA8B,yBACtCT,EAAgB,SAAS,IACrB,sBACA,uBACN;KAZF,UAAA,CAcE,kBAAC,QAAD;MAAM,WAAU;MACb,UAAAA,EAAgB,SAAS,IACtB,GAAGA,EAAgB,OAAO,aAC1BU;KACA,CAAA,GACN,kBAACC,GAAD;MACE,WAAU;MACV,eAAY;KACb,CAAA,CACK;;GACM,CAAA,GAChB,kBAACC,GAAD;IACE,OAAM;IACN,WAAU;IAEV,UAAA,kBAACC,GAAD;KAAS,WAAU;KAAnB,UAAA,CACE,kBAACC,GAAD,EAAc,aAAaC,EAAoB,CAAA,GAC/C,kBAACC,GAAD,EAAA,UAAA,CACE,kBAACC,GAAD,EAAA,UAAeC,EAAwB,CAAA,GACtCjB,EAAQ,KAAK,MAAM;MAClB,IAAMkB,IAAUtB,EAAY,IAAIK,EAAE,KAAK;MACvC,OACE,kBAACkB,GAAD;OAEE,OAAOlB,EAAE;OACT,gBAAgBC,EAAOD,EAAE,KAAK;OAHhC,UAAA;QAKE,kBAACmB,GAAD;SACE,WAAWb,EACT,mBACAW,IAAU,gBAAgB,WAC5B;SACA,eAAY;QACb,CAAA;QACD,kBAAC,QAAD;SAAM,WAAU;SAAY,UAAAjB,EAAE;QAAY,CAAA;QACzCA,EAAE,QACD,kBAAC,QAAD;SAAM,WAAU;SACb,UAAAA,EAAE;QACC,CAAA;OAEG;MAjBN,GAAAA,EAAE,KAiBI;KAEjB,CAAC,CACU,EAAA,CAAA,CACN;;GACK,CAAA,CACT;EAER,CAAA,GAAAF,EAAgB,SAAS,KACxB,kBAAC,OAAD;GAAK,WAAU;GACZ,UAAAA,EAAgB,KAAK,MACpB,kBAAC,QAAD;IAEE,WAAU;IAFZ,UAAA,CAIGE,EAAE,OACH,kBAAC,UAAD;KACE,MAAK;KACL,eAAeC,EAAOD,EAAE,KAAK;KACnB;KACV,WAAU;KACV,cAAY,UAAUA,EAAE;KAExB,UAAA,kBAACoB,GAAD,EAAG,WAAU,SAAU,CAAA;IACjB,CAAA,CACJ;GAbC,GAAApB,EAAE,KAaH,CACP;EACE,CAAA,CAEJ;;AAET"}

package/dist/devportal/components/NodeSmokePanel.d.ts CHANGED Viewed

@@ -1,5 +1,4 @@
 import { FC } from 'react';
 export type SmokeOperationStatus = "PASS" | "FAIL" | "SKIP";
 export interface SmokeOperation {
     name: string;
@@ -31,4 +30,3 @@ interface NodeSmokePanelProps {
 }
 export declare const NodeSmokePanel: FC<NodeSmokePanelProps>;
 export {};
-//# sourceMappingURL=NodeSmokePanel.d.ts.map

package/dist/devportal/components/NodeSmokePanel.js CHANGED Viewed

@@ -1,9 +1,9 @@
-import { useTr as e } from "../utils/i18n.js";
-import { cn as t } from "../utils/cn.js";
+import { cn as e } from "../utils/cn.js";
+import { useTr as t } from "../utils/i18n.js";
 import { useState as n } from "react";
 import { CheckCircle2 as r, ChevronDown as i, ChevronUp as a, Loader2 as o, MinusCircle as s, XCircle as c } from "lucide-react";
 import { jsx as l, jsxs as u } from "react/jsx-runtime";
-//#region src/devportal/components/NodeSmokePanel.tsx
+// src/devportal/components/NodeSmokePanel.tsx
 function d(e) {
 	return typeof e == "object" && !!e && !Array.isArray(e);
 }
@@ -41,34 +41,34 @@ var g = {
 	PASS: "text-status-success-text",
 	FAIL: "text-status-error-text",
 	SKIP: "text-text-secondary"
-}, _ = ({ operations: e }) => /* @__PURE__ */ l("ul", {
+}, _ = ({ operations: t }) => /* @__PURE__ */ l("ul", {
 	className: "space-y-1",
-	children: e.map((e, n) => /* @__PURE__ */ u("li", {
+	children: t.map((t, n) => /* @__PURE__ */ u("li", {
 		className: "text-xs leading-snug",
 		children: [
 			/* @__PURE__ */ l("code", {
 				className: "mr-1 rounded bg-bg-sunken px-1 py-0.5 font-mono text-text-primary",
-				children: e.name
+				children: t.name
 			}),
 			/* @__PURE__ */ l("span", {
-				className: t("font-medium", g[e.status]),
-				children: e.status
+				className: e("font-medium", g[t.status]),
+				children: t.status
 			}),
-			(e.error ?? e.detail) && /* @__PURE__ */ l("span", {
+			(t.error ?? t.detail) && /* @__PURE__ */ l("span", {
 				className: "ml-1 text-text-secondary",
-				children: e.error ?? e.detail
+				children: t.error ?? t.detail
 			}),
 			/* @__PURE__ */ u("span", {
 				className: "ml-1 text-text-tertiary",
-				children: [e.durationMs, " ms"]
+				children: [t.durationMs, " ms"]
 			})
 		]
-	}, `${e.name}-${n}`))
+	}, `${t.name}-${n}`))
 }), v = ({ metadata: d, defaultExpanded: f = !1, className: p }) => {
-	let m = e(), g = h(d), [v, y] = n(f);
+	let m = t(), g = h(d), [v, y] = n(f);
 	if (g.kind === "none") return null;
 	if (g.kind === "running") return /* @__PURE__ */ u("p", {
-		className: t("inline-flex items-center gap-1 text-xs text-status-info-text", p),
+		className: e("inline-flex items-center gap-1 text-xs text-status-info-text", p),
 		"data-testid": "node-smoke",
 		"data-state": "running",
 		children: [/* @__PURE__ */ l(o, {
@@ -96,13 +96,13 @@ var g = {
 		skipped: "text-text-secondary"
 	}, C = g.operations.length > 0 || g.error !== null;
 	return /* @__PURE__ */ u("div", {
-		className: t("space-y-1", p),
+		className: e("space-y-1", p),
 		"data-testid": "node-smoke",
 		"data-state": g.kind,
 		children: [/* @__PURE__ */ u("button", {
 			type: "button",
 			onClick: () => C && y((e) => !e),
-			className: t("inline-flex items-center gap-1 text-xs font-medium", S[g.kind], C ? "hover:underline" : "cursor-default"),
+			className: e("inline-flex items-center gap-1 text-xs font-medium", S[g.kind], C ? "hover:underline" : "cursor-default"),
 			"aria-expanded": C ? v : void 0,
 			children: [
 				x[g.kind],
@@ -113,7 +113,7 @@ var g = {
 			className: "max-w-md space-y-2 rounded-md border border-border-seam bg-bg-surface p-2",
 			children: [
 				g.error && /* @__PURE__ */ l("p", {
-					className: t("text-xs", g.kind === "skipped" ? "text-text-secondary" : "text-status-error-text"),
+					className: e("text-xs", g.kind === "skipped" ? "text-text-secondary" : "text-status-error-text"),
 					children: g.error
 				}),
 				g.operations.length > 0 && /* @__PURE__ */ l(_, { operations: g.operations }),
@@ -125,7 +125,6 @@ var g = {
 		})]
 	});
 };
-//#endregion
 export { v as NodeSmokePanel, h as readNodeSmokeState };
 //# sourceMappingURL=NodeSmokePanel.js.map

package/dist/devportal/components/NodeSmokePanel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NodeSmokePanel.js","names":[],"sources":["../../../src/devportal/components/NodeSmokePanel.tsx"],"sourcesContent":["/*\n NodeSmokePanel — shows the operation smoke run (BOFF-9656) that\n * global-devportal-svc records on `ApplicationVersion.metadata.packageSmoke`.\n \n Once a custom node's sandbox image is built, the service starts it in a\n * sandbox and calls every manifest operation with an empty input, the same\n * check `fluidgrids-node smoke` runs locally. A version whose run failed, or\n * is still running, cannot be submitted or approved; this panel is how the\n * developer sees which operation broke and how the reviewer sees the result.\n /\nimport { useState } from \"react\";\nimport type { FC } from \"react\";\nimport {\n CheckCircle2,\n ChevronDown,\n ChevronUp,\n Loader2,\n MinusCircle,\n XCircle,\n} from \"lucide-react\";\n\nimport { cn } from \"../utils/cn\";\nimport { useTr } from \"../utils/i18n\";\n\nexport type SmokeOperationStatus = \"PASS\" \| \"FAIL\" \| \"SKIP\";\n\nexport interface SmokeOperation {\n name: string;\n status: SmokeOperationStatus;\n detail: string \| null;\n error: string \| null;\n durationMs: number;\n}\n\nexport type NodeSmokeState =\n \| { kind: \"none\" }\n \| { kind: \"running\" }\n \| {\n kind: \"passed\" \| \"failed\" \| \"skipped\";\n operations: SmokeOperation[];\n passed: number;\n failed: number;\n skipped: number;\n error: string \| null;\n finishedAt: string \| null;\n };\n\nfunction isRecord(value: unknown): value is Record<string, unknown> {\n return typeof value === \"object\" && value !== null && !Array.isArray(value);\n}\n\nfunction readOperations(value: unknown): SmokeOperation[] {\n if (!Array.isArray(value)) return [];\n return value.filter(isRecord).map((entry) => ({\n name: typeof entry.name === \"string\" ? entry.name : \"\",\n status:\n entry.status === \"PASS\" \|\| entry.status === \"SKIP\"\n ? entry.status\n : \"FAIL\",\n detail: typeof entry.detail === \"string\" ? entry.detail : null,\n error: typeof entry.error === \"string\" ? entry.error : null,\n durationMs: typeof entry.durationMs === \"number\" ? entry.durationMs : 0,\n }));\n}\n\nconst count = (value: unknown): number =>\n typeof value === \"number\" ? value : 0;\n\nconst SETTLED_KINDS: Record<string, \"passed\" \| \"failed\" \| \"skipped\"> = {\n PASSED: \"passed\",\n FAILED: \"failed\",\n SKIPPED: \"skipped\",\n};\n\n/* Parse the stored record defensively — metadata is untyped JSON. /\nexport function readNodeSmokeState(metadata: unknown): NodeSmokeState {\n if (!isRecord(metadata)) return { kind: \"none\" };\n const record = metadata.packageSmoke;\n if (!isRecord(record) \|\| typeof record.status !== \"string\") {\n return { kind: \"none\" };\n }\n if (record.status === \"RUNNING\") return { kind: \"running\" };\n const kind = SETTLED_KINDS[record.status];\n if (!kind) return { kind: \"none\" };\n return {\n kind,\n operations: readOperations(record.operations),\n passed: count(record.passed),\n failed: count(record.failed),\n skipped: count(record.skipped),\n error: typeof record.error === \"string\" ? record.error : null,\n finishedAt:\n typeof record.finishedAt === \"string\" ? record.finishedAt : null,\n };\n}\n\nconst STATUS_CLASS: Record<SmokeOperationStatus, string> = {\n PASS: \"text-status-success-text\",\n FAIL: \"text-status-error-text\",\n SKIP: \"text-text-secondary\",\n};\n\nconst OperationList: FC<{ operations: SmokeOperation[] }> = ({\n operations,\n}) => (\n <ul className=\"space-y-1\">\n {operations.map((op, index) => (\n <li key={`${op.name}-${index}`} className=\"text-xs leading-snug\">\n <code className=\"mr-1 rounded bg-bg-sunken px-1 py-0.5 font-mono text-text-primary\">\n {op.name}\n </code>\n <span className={cn(\"font-medium\", STATUS_CLASS[op.status])}>\n {op.status}\n </span>\n {(op.error ?? op.detail) && (\n <span className=\"ml-1 text-text-secondary\">\n {op.error ?? op.detail}\n </span>\n )}\n <span className=\"ml-1 text-text-tertiary\">{op.durationMs} ms</span>\n </li>\n ))}\n </ul>\n);\n\ninterface NodeSmokePanelProps {\n metadata: unknown;\n /* Start expanded (the admin review card does; the versions table does not). */\n defaultExpanded?: boolean;\n className?: string;\n}\n\nexport const NodeSmokePanel: FC<NodeSmokePanelProps> = ({\n metadata,\n defaultExpanded = false,\n className,\n}) => {\n const tr = useTr();\n const state = readNodeSmokeState(metadata);\n const [expanded, setExpanded] = useState(defaultExpanded);\n\n // Nothing recorded: the build has not finished, or the version predates\n // operation smoke tests. The build status already says which.\n if (state.kind === \"none\") return null;\n\n if (state.kind === \"running\") {\n return (\n <p\n className={cn(\n \"inline-flex items-center gap-1 text-xs text-status-info-text\",\n className,\n )}\n data-testid=\"node-smoke\"\n data-state=\"running\"\n >\n <Loader2 size={12} className=\"animate-spin\" />\n {tr(\"devportal.nodeSmoke.running\", \"Testing operations…\")}\n </p>\n );\n }\n\n const summaries = {\n passed: tr(\n \"devportal.nodeSmoke.passed\",\n \"Operations tested: {{passed}} passed, {{skipped}} skipped\",\n { passed: state.passed, skipped: state.skipped },\n ),\n failed: tr(\n \"devportal.nodeSmoke.failed\",\n \"Operation tests failed: {{failed}} of {{total}}\",\n { failed: state.failed, total: state.operations.length },\n ),\n skipped: tr(\n \"devportal.nodeSmoke.skipped\",\n \"Operation tests not run in this environment\",\n ),\n };\n const icons = {\n passed: <CheckCircle2 size={12} />,\n failed: <XCircle size={12} />,\n skipped: <MinusCircle size={12} />,\n };\n const tone = {\n passed: \"text-status-success-text\",\n failed: \"text-status-error-text\",\n skipped: \"text-text-secondary\",\n };\n const hasDetails = state.operations.length > 0 \|\| state.error !== null;\n\n return (\n <div\n className={cn(\"space-y-1\", className)}\n data-testid=\"node-smoke\"\n data-state={state.kind}\n >\n <button\n type=\"button\"\n onClick={() => hasDetails && setExpanded((value) => !value)}\n className={cn(\n \"inline-flex items-center gap-1 text-xs font-medium\",\n tone[state.kind],\n hasDetails ? \"hover:underline\" : \"cursor-default\",\n )}\n aria-expanded={hasDetails ? expanded : undefined}\n >\n {icons[state.kind]}\n {summaries[state.kind]}\n {hasDetails &&\n (expanded ? <ChevronUp size={12} /> : <ChevronDown size={12} />)}\n </button>\n {expanded && hasDetails && (\n <div className=\"max-w-md space-y-2 rounded-md border border-border-seam bg-bg-surface p-2\">\n {state.error && (\n <p\n className={cn(\n \"text-xs\",\n state.kind === \"skipped\"\n ? \"text-text-secondary\"\n : \"text-status-error-text\",\n )}\n >\n {state.error}\n </p>\n )}\n {state.operations.length > 0 && (\n <OperationList operations={state.operations} />\n )}\n {state.finishedAt && (\n <p className=\"text-[11px] text-text-secondary\">\n {new Date(state.finishedAt).toLocaleString()}\n </p>\n )}\n </div>\n )}\n </div>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"NodeSmokePanel.js","names":["isRecord","value","readOperations","entry","count","SETTLED_KINDS","readNodeSmokeState","metadata","record","kind","STATUS_CLASS","OperationList","operations","op","cn","index","NodeSmokePanel","tr","useTr","state","expanded","setExpanded","useState","defaultExpanded","className","Loader2","summaries","icons","CheckCircle2","XCircle","MinusCircle","tone","hasDetails","jsx","ChevronUp","ChevronDown"],"sources":["../../../src/devportal/components/NodeSmokePanel.tsx"],"sourcesContent":["/*\n NodeSmokePanel — shows the operation smoke run (BOFF-9656) that\n * global-devportal-svc records on `ApplicationVersion.metadata.packageSmoke`.\n \n Once a custom node's sandbox image is built, the service starts it in a\n * sandbox and calls every manifest operation with an empty input, the same\n * check `fluidgrids-node smoke` runs locally. A version whose run failed, or\n * is still running, cannot be submitted or approved; this panel is how the\n * developer sees which operation broke and how the reviewer sees the result.\n /\nimport { useState } from \"react\";\nimport type { FC } from \"react\";\nimport {\n CheckCircle2,\n ChevronDown,\n ChevronUp,\n Loader2,\n MinusCircle,\n XCircle,\n} from \"lucide-react\";\n\nimport { cn } from \"../utils/cn\";\nimport { useTr } from \"../utils/i18n\";\n\nexport type SmokeOperationStatus = \"PASS\" \| \"FAIL\" \| \"SKIP\";\n\nexport interface SmokeOperation {\n name: string;\n status: SmokeOperationStatus;\n detail: string \| null;\n error: string \| null;\n durationMs: number;\n}\n\nexport type NodeSmokeState =\n \| { kind: \"none\" }\n \| { kind: \"running\" }\n \| {\n kind: \"passed\" \| \"failed\" \| \"skipped\";\n operations: SmokeOperation[];\n passed: number;\n failed: number;\n skipped: number;\n error: string \| null;\n finishedAt: string \| null;\n };\n\nfunction isRecord(value: unknown): value is Record<string, unknown> {\n return typeof value === \"object\" && value !== null && !Array.isArray(value);\n}\n\nfunction readOperations(value: unknown): SmokeOperation[] {\n if (!Array.isArray(value)) return [];\n return value.filter(isRecord).map((entry) => ({\n name: typeof entry.name === \"string\" ? entry.name : \"\",\n status:\n entry.status === \"PASS\" \|\| entry.status === \"SKIP\"\n ? entry.status\n : \"FAIL\",\n detail: typeof entry.detail === \"string\" ? entry.detail : null,\n error: typeof entry.error === \"string\" ? entry.error : null,\n durationMs: typeof entry.durationMs === \"number\" ? entry.durationMs : 0,\n }));\n}\n\nconst count = (value: unknown): number =>\n typeof value === \"number\" ? value : 0;\n\nconst SETTLED_KINDS: Record<string, \"passed\" \| \"failed\" \| \"skipped\"> = {\n PASSED: \"passed\",\n FAILED: \"failed\",\n SKIPPED: \"skipped\",\n};\n\n/* Parse the stored record defensively — metadata is untyped JSON. /\nexport function readNodeSmokeState(metadata: unknown): NodeSmokeState {\n if (!isRecord(metadata)) return { kind: \"none\" };\n const record = metadata.packageSmoke;\n if (!isRecord(record) \|\| typeof record.status !== \"string\") {\n return { kind: \"none\" };\n }\n if (record.status === \"RUNNING\") return { kind: \"running\" };\n const kind = SETTLED_KINDS[record.status];\n if (!kind) return { kind: \"none\" };\n return {\n kind,\n operations: readOperations(record.operations),\n passed: count(record.passed),\n failed: count(record.failed),\n skipped: count(record.skipped),\n error: typeof record.error === \"string\" ? record.error : null,\n finishedAt:\n typeof record.finishedAt === \"string\" ? record.finishedAt : null,\n };\n}\n\nconst STATUS_CLASS: Record<SmokeOperationStatus, string> = {\n PASS: \"text-status-success-text\",\n FAIL: \"text-status-error-text\",\n SKIP: \"text-text-secondary\",\n};\n\nconst OperationList: FC<{ operations: SmokeOperation[] }> = ({\n operations,\n}) => (\n <ul className=\"space-y-1\">\n {operations.map((op, index) => (\n <li key={`${op.name}-${index}`} className=\"text-xs leading-snug\">\n <code className=\"mr-1 rounded bg-bg-sunken px-1 py-0.5 font-mono text-text-primary\">\n {op.name}\n </code>\n <span className={cn(\"font-medium\", STATUS_CLASS[op.status])}>\n {op.status}\n </span>\n {(op.error ?? op.detail) && (\n <span className=\"ml-1 text-text-secondary\">\n {op.error ?? op.detail}\n </span>\n )}\n <span className=\"ml-1 text-text-tertiary\">{op.durationMs} ms</span>\n </li>\n ))}\n </ul>\n);\n\ninterface NodeSmokePanelProps {\n metadata: unknown;\n /* Start expanded (the admin review card does; the versions table does not). */\n defaultExpanded?: boolean;\n className?: string;\n}\n\nexport const NodeSmokePanel: FC<NodeSmokePanelProps> = ({\n metadata,\n defaultExpanded = false,\n className,\n}) => {\n const tr = useTr();\n const state = readNodeSmokeState(metadata);\n const [expanded, setExpanded] = useState(defaultExpanded);\n\n // Nothing recorded: the build has not finished, or the version predates\n // operation smoke tests. The build status already says which.\n if (state.kind === \"none\") return null;\n\n if (state.kind === \"running\") {\n return (\n <p\n className={cn(\n \"inline-flex items-center gap-1 text-xs text-status-info-text\",\n className,\n )}\n data-testid=\"node-smoke\"\n data-state=\"running\"\n >\n <Loader2 size={12} className=\"animate-spin\" />\n {tr(\"devportal.nodeSmoke.running\", \"Testing operations…\")}\n </p>\n );\n }\n\n const summaries = {\n passed: tr(\n \"devportal.nodeSmoke.passed\",\n \"Operations tested: {{passed}} passed, {{skipped}} skipped\",\n { passed: state.passed, skipped: state.skipped },\n ),\n failed: tr(\n \"devportal.nodeSmoke.failed\",\n \"Operation tests failed: {{failed}} of {{total}}\",\n { failed: state.failed, total: state.operations.length },\n ),\n skipped: tr(\n \"devportal.nodeSmoke.skipped\",\n \"Operation tests not run in this environment\",\n ),\n };\n const icons = {\n passed: <CheckCircle2 size={12} />,\n failed: <XCircle size={12} />,\n skipped: <MinusCircle size={12} />,\n };\n const tone = {\n passed: \"text-status-success-text\",\n failed: \"text-status-error-text\",\n skipped: \"text-text-secondary\",\n };\n const hasDetails = state.operations.length > 0 \|\| state.error !== null;\n\n return (\n <div\n className={cn(\"space-y-1\", className)}\n data-testid=\"node-smoke\"\n data-state={state.kind}\n >\n <button\n type=\"button\"\n onClick={() => hasDetails && setExpanded((value) => !value)}\n className={cn(\n \"inline-flex items-center gap-1 text-xs font-medium\",\n tone[state.kind],\n hasDetails ? \"hover:underline\" : \"cursor-default\",\n )}\n aria-expanded={hasDetails ? expanded : undefined}\n >\n {icons[state.kind]}\n {summaries[state.kind]}\n {hasDetails &&\n (expanded ? <ChevronUp size={12} /> : <ChevronDown size={12} />)}\n </button>\n {expanded && hasDetails && (\n <div className=\"max-w-md space-y-2 rounded-md border border-border-seam bg-bg-surface p-2\">\n {state.error && (\n <p\n className={cn(\n \"text-xs\",\n state.kind === \"skipped\"\n ? \"text-text-secondary\"\n : \"text-status-error-text\",\n )}\n >\n {state.error}\n </p>\n )}\n {state.operations.length > 0 && (\n <OperationList operations={state.operations} />\n )}\n {state.finishedAt && (\n <p className=\"text-[11px] text-text-secondary\">\n {new Date(state.finishedAt).toLocaleString()}\n </p>\n )}\n </div>\n )}\n </div>\n );\n};\n"],"mappings":"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"}

package/dist/devportal/components/OnboardingChecklist.d.ts CHANGED Viewed

@@ -1,5 +1,4 @@
 import { FC } from 'react';
 export interface OnboardingChecklistProps {
     /** Navigate to a devportal-relative path (the caller adds basePath). */
     onNavigate: (path: string) => void;
@@ -13,4 +12,3 @@ export interface OnboardingChecklistProps {
  * never flashes for an established developer.
  */
 export declare const OnboardingChecklist: FC<OnboardingChecklistProps>;
-//# sourceMappingURL=OnboardingChecklist.d.ts.map