@burdenoff/microfe-devportal 2026.1108.1 → 2026.1108.2

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

@@ -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"}
+{"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

@@ -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

@@ -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

@@ -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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"}
+{"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":"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"}

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

@@ -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

@@ -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

@@ -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"}
+{"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

@@ -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

@@ -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

@@ -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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"}
+{"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

@@ -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

package/dist/devportal/components/OnboardingChecklist.js

@@ -1,11 +1,11 @@
 import { useTr as e } from "../utils/i18n.js";
 import { cn as t } from "../utils/cn.js";
-import { useGetDeveloperOnboardingStatusQuery as n } from "../../generated/global-operations.js";
-import { computeOnboardingState as r } from "../utils/developerOnboarding.js";
-import { DEVELOPER_LINKS as i } from "../constants/developerLinks.js";
+import { computeOnboardingState as n } from "../utils/developerOnboarding.js";
+import { DEVELOPER_LINKS as r } from "../constants/developerLinks.js";
+import { useGetDeveloperOnboardingStatusQuery as i } from "../../generated/global-operations.js";
 import { BookOpen as a, Check as o, ChevronRight as s, Code2 as c, Plug as l, Terminal as u } from "lucide-react";
 import { jsx as d, jsxs as f } from "react/jsx-runtime";
-//#region src/devportal/components/OnboardingChecklist.tsx
+// src/devportal/components/OnboardingChecklist.tsx
 var p = {
 	profile: {
 		key: "devportal.onboarding.steps.profile",
@@ -36,34 +36,34 @@ var p = {
 		id: "publishConnector",
 		key: "devportal.onboarding.links.publishConnector",
 		label: "Publish a connector",
-		url: i.publishConnector,
+		url: r.publishConnector,
 		icon: l
 	},
 	{
 		id: "nodeSdk",
 		key: "devportal.onboarding.links.nodeSdk",
 		label: "Node.js SDK",
-		url: i.nodeSdk,
+		url: r.nodeSdk,
 		icon: c
 	},
 	{
 		id: "cli",
 		key: "devportal.onboarding.links.cli",
 		label: "CLI reference",
-		url: i.cliReference,
+		url: r.cliReference,
 		icon: u
 	},
 	{
 		id: "guide",
 		key: "devportal.onboarding.links.guide",
 		label: "Registration guide",
-		url: i.registrationGuide,
+		url: r.registrationGuide,
 		icon: a
 	}
-], h = ({ onNavigate: i }) => {
-	let a = e(), { data: c, loading: l, error: u } = n({ fetchPolicy: "no-cache" });
+], h = ({ onNavigate: r }) => {
+	let a = e(), { data: c, loading: l, error: u } = i({ fetchPolicy: "no-cache" });
 	if (l && !c || u && !c) return null;
-	let h = c, g = h?.applications?.edges?.map((e) => e.node) ?? [], _ = r({
+	let h = c, g = h?.applications?.edges?.map((e) => e.node) ?? [], _ = n({
 		hasProfile: !!h?.myDeveloperProfile?.id,
 		organizationKinds: (h?.myDeveloperOrganizations ?? []).map((e) => e.kind),
 		applications: g,
@@ -91,12 +91,12 @@ var p = {
 			/* @__PURE__ */ d("ol", {
 				className: "mt-4 flex flex-col gap-2",
 				children: _.steps.map((e, n) => {
-					let r = p[e.id], c = _.nextStep?.id === e.id;
+					let i = p[e.id], c = _.nextStep?.id === e.id;
 					return /* @__PURE__ */ d("li", { children: /* @__PURE__ */ f("button", {
 						type: "button",
 						"data-testid": `devportal-onboarding-step-${e.id}`,
 						"data-done": e.done ? "true" : "false",
-						onClick: () => i(e.path),
+						onClick: () => r(e.path),
 						className: t("flex w-full items-center gap-3 rounded-lg border px-4 py-3 text-left transition-colors", c ? "border-primary bg-action-primary-bg/5 hover:bg-action-primary-bg/10" : "border-border-subtle hover:bg-bg-muted"),
 						children: [
 							/* @__PURE__ */ d("span", {
@@ -108,13 +108,13 @@ var p = {
 								className: "min-w-0 flex-1",
 								children: [/* @__PURE__ */ f("span", {
 									className: t("block text-sm font-medium", e.done ? "text-text-secondary line-through" : "text-text-primary"),
-									children: [a(r.key, r.title), /* @__PURE__ */ d("span", {
+									children: [a(i.key, i.title), /* @__PURE__ */ d("span", {
 										className: "sr-only",
 										children: e.done ? ` (${a("devportal.onboarding.done", "done")})` : ` (${a("devportal.onboarding.todo", "to do")})`
 									})]
 								}), /* @__PURE__ */ d("span", {
 									className: "block text-xs text-text-secondary",
-									children: a(r.descKey, r.desc)
+									children: a(i.descKey, i.desc)
 								})]
 							}),
 							/* @__PURE__ */ d(s, {
@@ -145,7 +145,6 @@ var p = {
 		]
 	});
 };
-//#endregion
 export { h as OnboardingChecklist };
 
 //# sourceMappingURL=OnboardingChecklist.js.map

package/dist/devportal/components/OnboardingChecklist.js.map

@@ -1 +1 @@
-{"version":3,"file":"OnboardingChecklist.js","names":[],"sources":["../../../src/devportal/components/OnboardingChecklist.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport {\n  BookOpen,\n  Check,\n  ChevronRight,\n  Plug,\n  Terminal,\n  Code2,\n} from \"lucide-react\";\nimport { useTr } from \"../utils/i18n\";\nimport { cn } from \"../utils/cn\";\nimport {\n  computeOnboardingState,\n  type OnboardingStepId,\n} from \"../utils/developerOnboarding\";\nimport { DEVELOPER_LINKS } from \"../constants/developerLinks\";\nimport {\n  useGetDeveloperOnboardingStatusQuery,\n  type GetDeveloperOnboardingStatusQuery,\n} from \"../../generated/global-operations\";\n\ntype OnboardingStatus = GetDeveloperOnboardingStatusQuery;\ntype OnboardingApp = OnboardingStatus[\"applications\"][\"edges\"][number][\"node\"];\ntype OnboardingOrg = OnboardingStatus[\"myDeveloperOrganizations\"][number];\n\nconst STEP_COPY: Record<\n  OnboardingStepId,\n  { key: string; title: string; descKey: string; desc: string }\n> = {\n  profile: {\n    key: \"devportal.onboarding.steps.profile\",\n    title: \"Create your developer profile\",\n    descKey: \"devportal.onboarding.steps.profileDesc\",\n    desc: \"Tell customers who builds your apps: company, website and links.\",\n  },\n  organization: {\n    key: \"devportal.onboarding.steps.organization\",\n    title: \"Create a developer organization\",\n    descKey: \"devportal.onboarding.steps.organizationDesc\",\n    desc: \"The publisher identity that owns your apps and your team.\",\n  },\n  app: {\n    key: \"devportal.onboarding.steps.app\",\n    title: \"Register your first app\",\n    descKey: \"devportal.onboarding.steps.appDesc\",\n    desc: \"An API integration, workflow node or workflow template.\",\n  },\n  submit: {\n    key: \"devportal.onboarding.steps.submit\",\n    title: \"Submit it for review\",\n    descKey: \"devportal.onboarding.steps.submitDesc\",\n    desc: \"Reviewers check every submission before it is listed.\",\n  },\n};\n\nconst RESOURCE_LINKS = [\n  {\n    id: \"publishConnector\",\n    key: \"devportal.onboarding.links.publishConnector\",\n    label: \"Publish a connector\",\n    url: DEVELOPER_LINKS.publishConnector,\n    icon: Plug,\n  },\n  {\n    id: \"nodeSdk\",\n    key: \"devportal.onboarding.links.nodeSdk\",\n    label: \"Node.js SDK\",\n    url: DEVELOPER_LINKS.nodeSdk,\n    icon: Code2,\n  },\n  {\n    id: \"cli\",\n    key: \"devportal.onboarding.links.cli\",\n    label: \"CLI reference\",\n    url: DEVELOPER_LINKS.cliReference,\n    icon: Terminal,\n  },\n  {\n    id: \"guide\",\n    key: \"devportal.onboarding.links.guide\",\n    label: \"Registration guide\",\n    url: DEVELOPER_LINKS.registrationGuide,\n    icon: BookOpen,\n  },\n] as const;\n\nexport interface OnboardingChecklistProps {\n  /** Navigate to a devportal-relative path (the caller adds basePath). */\n  onNavigate: (path: string) => void;\n}\n\n/**\n * \"Get started as a developer\" checklist on the devportal dashboard\n * (BOFF-10636). Shows the four steps of the public registration journey\n * with their live state, links each open step to the page that completes\n * it, and points at the connector publishing guide and the SDK/CLI docs.\n * Renders nothing once every step is done, or while the status loads, so it\n * never flashes for an established developer.\n */\nexport const OnboardingChecklist: FC<OnboardingChecklistProps> = ({\n  onNavigate,\n}) => {\n  const tr = useTr();\n  // no-cache: the dashboard's own `applications(limit: 5)` query shares the\n  // paginated cache entry, and a later five-app page replacing this 100-app\n  // one would make the checklist read a truncated list as \"submitted\".\n  const { data, loading, error } = useGetDeveloperOnboardingStatusQuery({\n    fetchPolicy: \"no-cache\",\n  });\n\n  if (loading && !data) return null;\n  if (error && !data) return null;\n\n  const status: OnboardingStatus | undefined = data;\n  const applications: OnboardingApp[] =\n    status?.applications?.edges?.map(\n      (edge: { node: OnboardingApp }) => edge.node,\n    ) ?? [];\n  const state = computeOnboardingState({\n    hasProfile: !!status?.myDeveloperProfile?.id,\n    organizationKinds: (status?.myDeveloperOrganizations ?? []).map(\n      (org: OnboardingOrg) => org.kind,\n    ),\n    applications,\n    totalApplications: status?.applications?.totalCount ?? 0,\n  });\n\n  if (state.isComplete) return null;\n\n  return (\n    <section\n      aria-labelledby=\"devportal-onboarding-title\"\n      data-testid=\"devportal-onboarding-checklist\"\n      className=\"rounded-card border border-border-seam bg-bg-surface p-5\"\n    >\n      <div className=\"flex flex-wrap items-baseline justify-between gap-2\">\n        <h2\n          id=\"devportal-onboarding-title\"\n          className=\"text-base font-semibold text-text-primary\"\n        >\n          {tr(\"devportal.onboarding.title\", \"Get started as a developer\")}\n        </h2>\n        <p className=\"text-sm text-text-secondary\">\n          {tr(\"devportal.onboarding.progress\", \"{{done}} of {{total}} done\", {\n            done: state.completedCount,\n            total: state.steps.length,\n          })}\n        </p>\n      </div>\n\n      <ol className=\"mt-4 flex flex-col gap-2\">\n        {state.steps.map((step, index) => {\n          const copy = STEP_COPY[step.id];\n          const isNext = state.nextStep?.id === step.id;\n          return (\n            <li key={step.id}>\n              <button\n                type=\"button\"\n                data-testid={`devportal-onboarding-step-${step.id}`}\n                data-done={step.done ? \"true\" : \"false\"}\n                onClick={() => onNavigate(step.path)}\n                className={cn(\n                  \"flex w-full items-center gap-3 rounded-lg border px-4 py-3 text-left transition-colors\",\n                  isNext\n                    ? \"border-primary bg-action-primary-bg/5 hover:bg-action-primary-bg/10\"\n                    : \"border-border-subtle hover:bg-bg-muted\",\n                )}\n              >\n                <span\n                  className={cn(\n                    \"flex h-7 w-7 shrink-0 items-center justify-center rounded-full text-xs font-semibold\",\n                    step.done\n                      ? \"bg-status-success-bg-subtle text-status-success-text\"\n                      : \"bg-bg-sunken text-text-secondary\",\n                  )}\n                  aria-hidden=\"true\"\n                >\n                  {step.done ? <Check size={14} /> : index + 1}\n                </span>\n                <span className=\"min-w-0 flex-1\">\n                  <span\n                    className={cn(\n                      \"block text-sm font-medium\",\n                      step.done\n                        ? \"text-text-secondary line-through\"\n                        : \"text-text-primary\",\n                    )}\n                  >\n                    {tr(copy.key, copy.title)}\n                    <span className=\"sr-only\">\n                      {step.done\n                        ? ` (${tr(\"devportal.onboarding.done\", \"done\")})`\n                        : ` (${tr(\"devportal.onboarding.todo\", \"to do\")})`}\n                    </span>\n                  </span>\n                  <span className=\"block text-xs text-text-secondary\">\n                    {tr(copy.descKey, copy.desc)}\n                  </span>\n                </span>\n                <ChevronRight\n                  size={16}\n                  className=\"shrink-0 text-text-muted\"\n                  aria-hidden=\"true\"\n                />\n              </button>\n            </li>\n          );\n        })}\n      </ol>\n\n      <div className=\"mt-4 flex flex-wrap gap-x-5 gap-y-2 border-t border-border-seam pt-4\">\n        {RESOURCE_LINKS.map((link) => {\n          const Icon = link.icon;\n          return (\n            <a\n              key={link.id}\n              href={link.url}\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n              className=\"inline-flex items-center gap-1.5 text-sm font-medium text-primary hover:underline\"\n            >\n              <Icon size={14} aria-hidden=\"true\" />\n              {tr(link.key, link.label)}\n            </a>\n          );\n        })}\n      </div>\n    </section>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"OnboardingChecklist.js","names":["STEP_COPY","RESOURCE_LINKS","DEVELOPER_LINKS","Plug","Code2","Terminal","BookOpen","OnboardingChecklist","tr","useTr","useGetDeveloperOnboardingStatusQuery","loading","data","error","status","applications","edge","state","computeOnboardingState","org","copy","step","isNext","onNavigate","cn","Check","index","ChevronRight","Icon","link"],"sources":["../../../src/devportal/components/OnboardingChecklist.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport {\n  BookOpen,\n  Check,\n  ChevronRight,\n  Plug,\n  Terminal,\n  Code2,\n} from \"lucide-react\";\nimport { useTr } from \"../utils/i18n\";\nimport { cn } from \"../utils/cn\";\nimport {\n  computeOnboardingState,\n  type OnboardingStepId,\n} from \"../utils/developerOnboarding\";\nimport { DEVELOPER_LINKS } from \"../constants/developerLinks\";\nimport {\n  useGetDeveloperOnboardingStatusQuery,\n  type GetDeveloperOnboardingStatusQuery,\n} from \"../../generated/global-operations\";\n\ntype OnboardingStatus = GetDeveloperOnboardingStatusQuery;\ntype OnboardingApp = OnboardingStatus[\"applications\"][\"edges\"][number][\"node\"];\ntype OnboardingOrg = OnboardingStatus[\"myDeveloperOrganizations\"][number];\n\nconst STEP_COPY: Record<\n  OnboardingStepId,\n  { key: string; title: string; descKey: string; desc: string }\n> = {\n  profile: {\n    key: \"devportal.onboarding.steps.profile\",\n    title: \"Create your developer profile\",\n    descKey: \"devportal.onboarding.steps.profileDesc\",\n    desc: \"Tell customers who builds your apps: company, website and links.\",\n  },\n  organization: {\n    key: \"devportal.onboarding.steps.organization\",\n    title: \"Create a developer organization\",\n    descKey: \"devportal.onboarding.steps.organizationDesc\",\n    desc: \"The publisher identity that owns your apps and your team.\",\n  },\n  app: {\n    key: \"devportal.onboarding.steps.app\",\n    title: \"Register your first app\",\n    descKey: \"devportal.onboarding.steps.appDesc\",\n    desc: \"An API integration, workflow node or workflow template.\",\n  },\n  submit: {\n    key: \"devportal.onboarding.steps.submit\",\n    title: \"Submit it for review\",\n    descKey: \"devportal.onboarding.steps.submitDesc\",\n    desc: \"Reviewers check every submission before it is listed.\",\n  },\n};\n\nconst RESOURCE_LINKS = [\n  {\n    id: \"publishConnector\",\n    key: \"devportal.onboarding.links.publishConnector\",\n    label: \"Publish a connector\",\n    url: DEVELOPER_LINKS.publishConnector,\n    icon: Plug,\n  },\n  {\n    id: \"nodeSdk\",\n    key: \"devportal.onboarding.links.nodeSdk\",\n    label: \"Node.js SDK\",\n    url: DEVELOPER_LINKS.nodeSdk,\n    icon: Code2,\n  },\n  {\n    id: \"cli\",\n    key: \"devportal.onboarding.links.cli\",\n    label: \"CLI reference\",\n    url: DEVELOPER_LINKS.cliReference,\n    icon: Terminal,\n  },\n  {\n    id: \"guide\",\n    key: \"devportal.onboarding.links.guide\",\n    label: \"Registration guide\",\n    url: DEVELOPER_LINKS.registrationGuide,\n    icon: BookOpen,\n  },\n] as const;\n\nexport interface OnboardingChecklistProps {\n  /** Navigate to a devportal-relative path (the caller adds basePath). */\n  onNavigate: (path: string) => void;\n}\n\n/**\n * \"Get started as a developer\" checklist on the devportal dashboard\n * (BOFF-10636). Shows the four steps of the public registration journey\n * with their live state, links each open step to the page that completes\n * it, and points at the connector publishing guide and the SDK/CLI docs.\n * Renders nothing once every step is done, or while the status loads, so it\n * never flashes for an established developer.\n */\nexport const OnboardingChecklist: FC<OnboardingChecklistProps> = ({\n  onNavigate,\n}) => {\n  const tr = useTr();\n  // no-cache: the dashboard's own `applications(limit: 5)` query shares the\n  // paginated cache entry, and a later five-app page replacing this 100-app\n  // one would make the checklist read a truncated list as \"submitted\".\n  const { data, loading, error } = useGetDeveloperOnboardingStatusQuery({\n    fetchPolicy: \"no-cache\",\n  });\n\n  if (loading && !data) return null;\n  if (error && !data) return null;\n\n  const status: OnboardingStatus | undefined = data;\n  const applications: OnboardingApp[] =\n    status?.applications?.edges?.map(\n      (edge: { node: OnboardingApp }) => edge.node,\n    ) ?? [];\n  const state = computeOnboardingState({\n    hasProfile: !!status?.myDeveloperProfile?.id,\n    organizationKinds: (status?.myDeveloperOrganizations ?? []).map(\n      (org: OnboardingOrg) => org.kind,\n    ),\n    applications,\n    totalApplications: status?.applications?.totalCount ?? 0,\n  });\n\n  if (state.isComplete) return null;\n\n  return (\n    <section\n      aria-labelledby=\"devportal-onboarding-title\"\n      data-testid=\"devportal-onboarding-checklist\"\n      className=\"rounded-card border border-border-seam bg-bg-surface p-5\"\n    >\n      <div className=\"flex flex-wrap items-baseline justify-between gap-2\">\n        <h2\n          id=\"devportal-onboarding-title\"\n          className=\"text-base font-semibold text-text-primary\"\n        >\n          {tr(\"devportal.onboarding.title\", \"Get started as a developer\")}\n        </h2>\n        <p className=\"text-sm text-text-secondary\">\n          {tr(\"devportal.onboarding.progress\", \"{{done}} of {{total}} done\", {\n            done: state.completedCount,\n            total: state.steps.length,\n          })}\n        </p>\n      </div>\n\n      <ol className=\"mt-4 flex flex-col gap-2\">\n        {state.steps.map((step, index) => {\n          const copy = STEP_COPY[step.id];\n          const isNext = state.nextStep?.id === step.id;\n          return (\n            <li key={step.id}>\n              <button\n                type=\"button\"\n                data-testid={`devportal-onboarding-step-${step.id}`}\n                data-done={step.done ? \"true\" : \"false\"}\n                onClick={() => onNavigate(step.path)}\n                className={cn(\n                  \"flex w-full items-center gap-3 rounded-lg border px-4 py-3 text-left transition-colors\",\n                  isNext\n                    ? \"border-primary bg-action-primary-bg/5 hover:bg-action-primary-bg/10\"\n                    : \"border-border-subtle hover:bg-bg-muted\",\n                )}\n              >\n                <span\n                  className={cn(\n                    \"flex h-7 w-7 shrink-0 items-center justify-center rounded-full text-xs font-semibold\",\n                    step.done\n                      ? \"bg-status-success-bg-subtle text-status-success-text\"\n                      : \"bg-bg-sunken text-text-secondary\",\n                  )}\n                  aria-hidden=\"true\"\n                >\n                  {step.done ? <Check size={14} /> : index + 1}\n                </span>\n                <span className=\"min-w-0 flex-1\">\n                  <span\n                    className={cn(\n                      \"block text-sm font-medium\",\n                      step.done\n                        ? \"text-text-secondary line-through\"\n                        : \"text-text-primary\",\n                    )}\n                  >\n                    {tr(copy.key, copy.title)}\n                    <span className=\"sr-only\">\n                      {step.done\n                        ? ` (${tr(\"devportal.onboarding.done\", \"done\")})`\n                        : ` (${tr(\"devportal.onboarding.todo\", \"to do\")})`}\n                    </span>\n                  </span>\n                  <span className=\"block text-xs text-text-secondary\">\n                    {tr(copy.descKey, copy.desc)}\n                  </span>\n                </span>\n                <ChevronRight\n                  size={16}\n                  className=\"shrink-0 text-text-muted\"\n                  aria-hidden=\"true\"\n                />\n              </button>\n            </li>\n          );\n        })}\n      </ol>\n\n      <div className=\"mt-4 flex flex-wrap gap-x-5 gap-y-2 border-t border-border-seam pt-4\">\n        {RESOURCE_LINKS.map((link) => {\n          const Icon = link.icon;\n          return (\n            <a\n              key={link.id}\n              href={link.url}\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n              className=\"inline-flex items-center gap-1.5 text-sm font-medium text-primary hover:underline\"\n            >\n              <Icon size={14} aria-hidden=\"true\" />\n              {tr(link.key, link.label)}\n            </a>\n          );\n        })}\n      </div>\n    </section>\n  );\n};\n"],"mappings":"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"}

package/dist/devportal/components/PackageValidationPanel.d.ts

@@ -1,5 +1,4 @@
 import { FC } from 'react';
-
 export interface PackageValidationIssue {
     severity: "error" | "warning";
     code: string;
@@ -28,4 +27,3 @@ interface PackageValidationPanelProps {
 }
 export declare const PackageValidationPanel: FC<PackageValidationPanelProps>;
 export {};
-//# sourceMappingURL=PackageValidationPanel.d.ts.map

package/dist/devportal/components/PackageValidationPanel.js

@@ -1,10 +1,10 @@
-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 { NodeSmokePanel as n } from "./NodeSmokePanel.js";
 import { useState as r } from "react";
 import { AlertTriangle as i, CheckCircle2 as a, ChevronDown as o, ChevronUp as s, Loader2 as c, XCircle as l } from "lucide-react";
 import { jsx as u, jsxs as d } from "react/jsx-runtime";
-//#region src/devportal/components/PackageValidationPanel.tsx
+// src/devportal/components/PackageValidationPanel.tsx
 function f(e) {
 	return typeof e == "object" && !!e && !Array.isArray(e);
 }
@@ -40,25 +40,25 @@ var h = ({ issues: e }) => /* @__PURE__ */ u("ul", {
 			children: e.message
 		})]
 	}, `${e.code}-${e.path}-${t}`))
-}), g = ({ metadata: e, defaultExpanded: r = !1, className: i }) => /* @__PURE__ */ d("div", {
-	className: t("space-y-1", i),
+}), g = ({ metadata: t, defaultExpanded: r = !1, className: i }) => /* @__PURE__ */ d("div", {
+	className: e("space-y-1", i),
 	children: [/* @__PURE__ */ u(_, {
-		metadata: e,
+		metadata: t,
 		defaultExpanded: r
 	}), /* @__PURE__ */ u(n, {
-		metadata: e,
+		metadata: t,
 		defaultExpanded: r
 	})]
 }), _ = ({ metadata: n, defaultExpanded: f = !1, className: p }) => {
-	let g = e(), _ = m(n), [v, y] = r(f);
+	let g = t(), _ = m(n), [v, y] = r(f);
 	if (_.kind === "none") return /* @__PURE__ */ u("p", {
-		className: t("text-xs text-text-secondary", p),
+		className: e("text-xs text-text-secondary", p),
 		"data-testid": "package-validation",
 		"data-state": "none",
 		children: g("devportal.packageValidation.none", "Package not validated (uploaded before validation existed)")
 	});
 	if (_.kind === "pending") return /* @__PURE__ */ d("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": "package-validation",
 		"data-state": "pending",
 		children: [/* @__PURE__ */ u(c, {
@@ -68,13 +68,13 @@ var h = ({ issues: e }) => /* @__PURE__ */ u("ul", {
 	});
 	let b = _.kind === "failed", x = _.errors.length > 0 || _.warnings.length > 0, S = b ? g("devportal.packageValidation.failed", "Validation failed: {{count}} error(s)", { count: _.errors.length }) : g("devportal.packageValidation.passed", "Package validated");
 	return /* @__PURE__ */ d("div", {
-		className: t("space-y-1", p),
+		className: e("space-y-1", p),
 		"data-testid": "package-validation",
 		"data-state": _.kind,
 		children: [/* @__PURE__ */ d("button", {
 			type: "button",
 			onClick: () => x && y((e) => !e),
-			className: t("inline-flex items-center gap-1 text-xs font-medium", b ? "text-status-error-text" : "text-status-success-text", x ? "hover:underline" : "cursor-default"),
+			className: e("inline-flex items-center gap-1 text-xs font-medium", b ? "text-status-error-text" : "text-status-success-text", x ? "hover:underline" : "cursor-default"),
 			"aria-expanded": x ? v : void 0,
 			children: [
 				u(b ? l : a, { size: 12 }),
@@ -108,7 +108,6 @@ var h = ({ issues: e }) => /* @__PURE__ */ u("ul", {
 		})]
 	});
 };
-//#endregion
 export { g as PackageValidationPanel, m as readPackageValidationState };
 
 //# sourceMappingURL=PackageValidationPanel.js.map