@adecore/agents-react 0.31.11 → 0.32.0

package/dist/providers/InstallPage.js

@@ -1,74 +1,659 @@
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { c as _c } from "react/compiler-runtime";
 import { useState } from 'react';
 import clsx from 'clsx';
 import { Trans, useTranslation } from 'react-i18next';
 import { Check, Copy, ExternalLink, SquareTerminal } from 'lucide-react';
 import { Button, copyText, Icon, Pill, Segmented } from '@adecore/ui';
 import { useChatHost } from '../host.js';
+import { useHostMachinePlatform } from '../host-hooks.js';
 import { useChatScope } from '../scope.js';
 import { installPlatforms, installStepStates, pagePlatform } from './install-steps.js';
 import { CliMark } from './parts.js';
-const noPlatform = () => null;
-function CommandBlock({ command }) {
-    const { t } = useTranslation('agent-providers');
-    const [copied, setCopied] = useState(null);
-    return (_jsxs("div", { className: "flex min-w-0 items-center gap-2 rounded-lg border border-border bg-surface-sunken py-1 pr-1 pl-3", children: [_jsx("code", { className: "min-w-0 grow font-mono text-code break-all text-text select-text", children: command }), _jsxs(Button, { size: "xs", onClick: () => {
-                    copyText(command);
-                    setCopied(command);
-                }, children: [_jsx(Icon, { icon: copied === command ? Check : Copy, size: 12 }), copied === command ? t('install.copied') : t('install.copy')] })] }));
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+function CommandBlock(t0) {
+  const $ = _c(17);
+  const {
+    command
+  } = t0;
+  const {
+    t
+  } = useTranslation("agent-providers");
+  const [copied, setCopied] = useState(null);
+  let t1;
+  if ($[0] !== command) {
+    t1 = /*#__PURE__*/_jsx("code", {
+      className: "min-w-0 grow font-mono text-code break-all text-text select-text",
+      children: command
+    });
+    $[0] = command;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  let t2;
+  if ($[2] !== command) {
+    t2 = () => {
+      copyText(command);
+      setCopied(command);
+    };
+    $[2] = command;
+    $[3] = t2;
+  } else {
+    t2 = $[3];
+  }
+  const t3 = copied === command ? Check : Copy;
+  let t4;
+  if ($[4] !== t3) {
+    t4 = /*#__PURE__*/_jsx(Icon, {
+      icon: t3,
+      size: 12
+    });
+    $[4] = t3;
+    $[5] = t4;
+  } else {
+    t4 = $[5];
+  }
+  let t5;
+  if ($[6] !== command || $[7] !== copied || $[8] !== t) {
+    t5 = copied === command ? t("install.copied") : t("install.copy");
+    $[6] = command;
+    $[7] = copied;
+    $[8] = t;
+    $[9] = t5;
+  } else {
+    t5 = $[9];
+  }
+  let t6;
+  if ($[10] !== t2 || $[11] !== t4 || $[12] !== t5) {
+    t6 = /*#__PURE__*/_jsxs(Button, {
+      size: "xs",
+      onClick: t2,
+      children: [t4, t5]
+    });
+    $[10] = t2;
+    $[11] = t4;
+    $[12] = t5;
+    $[13] = t6;
+  } else {
+    t6 = $[13];
+  }
+  let t7;
+  if ($[14] !== t1 || $[15] !== t6) {
+    t7 = /*#__PURE__*/_jsxs("div", {
+      className: "flex min-w-0 items-center gap-2 rounded-lg border border-border bg-surface-sunken py-1 pr-1 pl-3",
+      children: [t1, t6]
+    });
+    $[14] = t1;
+    $[15] = t6;
+    $[16] = t7;
+  } else {
+    t7 = $[16];
+  }
+  return t7;
 }
-function Step({ index, state, title, children }) {
-    return (_jsxs("li", { "aria-current": state === 'current' ? 'step' : undefined, "data-state": state, className: clsx('flex min-w-0 gap-3 rounded-xl border p-4', state === 'current' ? 'border-accent' : 'border-border'), children: [_jsx("span", { className: clsx('grid size-6 shrink-0 place-items-center rounded-full text-xs font-medium', state === 'done' && 'bg-positive text-positive-text', state === 'current' && 'border border-accent text-accent', state === 'later' && 'bg-text/7 text-text-faint'), children: state === 'done' ? _jsx(Icon, { icon: Check, size: 14 }) : index + 1 }), _jsxs("div", { className: "flex min-w-0 grow flex-col gap-3", children: [_jsx("h4", { className: clsx('text-sm leading-6 font-medium', state === 'later' ? 'text-text-muted' : 'text-text'), children: title }), children] })] }));
+function Step(t0) {
+  const $ = _c(26);
+  const {
+    index,
+    state,
+    title,
+    children
+  } = t0;
+  const t1 = state === "current" ? "step" : undefined;
+  const t2 = state === "current" ? "border-accent" : "border-border";
+  let t3;
+  if ($[0] !== t2) {
+    t3 = clsx("flex min-w-0 gap-3 rounded-xl border p-4", t2);
+    $[0] = t2;
+    $[1] = t3;
+  } else {
+    t3 = $[1];
+  }
+  const t4 = state === "done" && "bg-positive text-positive-text";
+  const t5 = state === "current" && "border border-accent text-accent";
+  const t6 = state === "later" && "bg-text/7 text-text-faint";
+  let t7;
+  if ($[2] !== t4 || $[3] !== t5 || $[4] !== t6) {
+    t7 = clsx("grid size-6 shrink-0 place-items-center rounded-full text-xs font-medium", t4, t5, t6);
+    $[2] = t4;
+    $[3] = t5;
+    $[4] = t6;
+    $[5] = t7;
+  } else {
+    t7 = $[5];
+  }
+  let t8;
+  if ($[6] !== index || $[7] !== state) {
+    t8 = state === "done" ? /*#__PURE__*/_jsx(Icon, {
+      icon: Check,
+      size: 14
+    }) : index + 1;
+    $[6] = index;
+    $[7] = state;
+    $[8] = t8;
+  } else {
+    t8 = $[8];
+  }
+  let t9;
+  if ($[9] !== t7 || $[10] !== t8) {
+    t9 = /*#__PURE__*/_jsx("span", {
+      className: t7,
+      children: t8
+    });
+    $[9] = t7;
+    $[10] = t8;
+    $[11] = t9;
+  } else {
+    t9 = $[11];
+  }
+  const t10 = state === "later" ? "text-text-muted" : "text-text";
+  let t11;
+  if ($[12] !== t10) {
+    t11 = clsx("text-sm leading-6 font-medium", t10);
+    $[12] = t10;
+    $[13] = t11;
+  } else {
+    t11 = $[13];
+  }
+  let t12;
+  if ($[14] !== t11 || $[15] !== title) {
+    t12 = /*#__PURE__*/_jsx("h4", {
+      className: t11,
+      children: title
+    });
+    $[14] = t11;
+    $[15] = title;
+    $[16] = t12;
+  } else {
+    t12 = $[16];
+  }
+  let t13;
+  if ($[17] !== children || $[18] !== t12) {
+    t13 = /*#__PURE__*/_jsxs("div", {
+      className: "flex min-w-0 grow flex-col gap-3",
+      children: [t12, children]
+    });
+    $[17] = children;
+    $[18] = t12;
+    $[19] = t13;
+  } else {
+    t13 = $[19];
+  }
+  let t14;
+  if ($[20] !== state || $[21] !== t1 || $[22] !== t13 || $[23] !== t3 || $[24] !== t9) {
+    t14 = /*#__PURE__*/_jsxs("li", {
+      "aria-current": t1,
+      "data-state": state,
+      className: t3,
+      children: [t9, t13]
+    });
+    $[20] = state;
+    $[21] = t1;
+    $[22] = t13;
+    $[23] = t3;
+    $[24] = t9;
+    $[25] = t14;
+  } else {
+    t14 = $[25];
+  }
+  return t14;
 }
-function SignInWay({ way, canRun, onRun }) {
-    const { t } = useTranslation('agent-providers');
-    const { providerKeyNote } = useChatHost();
-    switch (way.kind) {
-        case 'command':
-            return (_jsxs("div", { className: "flex min-w-0 flex-col gap-2", children: [_jsx("p", { className: "text-xs text-text-muted", children: t('install.signIn.command') }), _jsx(CommandBlock, { command: way.command }), canRun && (_jsxs(Button, { variant: "secondary", size: "sm", className: "self-start", onClick: () => onRun(way.command), children: [_jsx(Icon, { icon: SquareTerminal, size: 14 }), t('install.run')] }))] }));
-        case 'env': {
-            const note = providerKeyNote?.(way.variable) ?? null;
-            return (_jsxs("p", { className: "text-xs text-text-muted", children: [_jsx(Trans, { t: t, i18nKey: "install.signIn.env", values: { variable: way.variable }, components: { code: _jsx("code", { className: "font-mono text-code text-text" }) } }), note !== null && ` ${note}`] }));
+function SignInWay(t0) {
+  const $ = _c(31);
+  const {
+    way,
+    canRun,
+    onRun
+  } = t0;
+  const {
+    t
+  } = useTranslation("agent-providers");
+  const {
+    providerKeyNote
+  } = useChatHost();
+  switch (way.kind) {
+    case "command":
+      {
+        let t1;
+        if ($[0] !== t) {
+          t1 = t("install.signIn.command");
+          $[0] = t;
+          $[1] = t1;
+        } else {
+          t1 = $[1];
+        }
+        let t2;
+        if ($[2] !== t1) {
+          t2 = /*#__PURE__*/_jsx("p", {
+            className: "text-xs text-text-muted",
+            children: t1
+          });
+          $[2] = t1;
+          $[3] = t2;
+        } else {
+          t2 = $[3];
+        }
+        let t3;
+        if ($[4] !== way.command) {
+          t3 = /*#__PURE__*/_jsx(CommandBlock, {
+            command: way.command
+          });
+          $[4] = way.command;
+          $[5] = t3;
+        } else {
+          t3 = $[5];
+        }
+        let t4;
+        if ($[6] !== canRun || $[7] !== onRun || $[8] !== t || $[9] !== way.command) {
+          t4 = canRun && /*#__PURE__*/_jsxs(Button, {
+            variant: "secondary",
+            size: "sm",
+            className: "self-start",
+            onClick: () => onRun(way.command),
+            children: [/*#__PURE__*/_jsx(Icon, {
+              icon: SquareTerminal,
+              size: 14
+            }), t("install.run")]
+          });
+          $[6] = canRun;
+          $[7] = onRun;
+          $[8] = t;
+          $[9] = way.command;
+          $[10] = t4;
+        } else {
+          t4 = $[10];
+        }
+        let t5;
+        if ($[11] !== t2 || $[12] !== t3 || $[13] !== t4) {
+          t5 = /*#__PURE__*/_jsxs("div", {
+            className: "flex min-w-0 flex-col gap-2",
+            children: [t2, t3, t4]
+          });
+          $[11] = t2;
+          $[12] = t3;
+          $[13] = t4;
+          $[14] = t5;
+        } else {
+          t5 = $[14];
+        }
+        return t5;
+      }
+    case "env":
+      {
+        let t1;
+        if ($[15] !== providerKeyNote || $[16] !== way.variable) {
+          t1 = providerKeyNote?.(way.variable) ?? null;
+          $[15] = providerKeyNote;
+          $[16] = way.variable;
+          $[17] = t1;
+        } else {
+          t1 = $[17];
+        }
+        const note = t1;
+        let t2;
+        if ($[18] !== way.variable) {
+          t2 = {
+            variable: way.variable
+          };
+          $[18] = way.variable;
+          $[19] = t2;
+        } else {
+          t2 = $[19];
+        }
+        let t3;
+        if ($[20] === Symbol.for("react.memo_cache_sentinel")) {
+          t3 = {
+            code: /*#__PURE__*/_jsx("code", {
+              className: "font-mono text-code text-text"
+            })
+          };
+          $[20] = t3;
+        } else {
+          t3 = $[20];
+        }
+        let t4;
+        if ($[21] !== t || $[22] !== t2) {
+          t4 = /*#__PURE__*/_jsx(Trans, {
+            t: t,
+            i18nKey: "install.signIn.env",
+            values: t2,
+            components: t3
+          });
+          $[21] = t;
+          $[22] = t2;
+          $[23] = t4;
+        } else {
+          t4 = $[23];
         }
-        case 'chat':
-            return _jsx("p", { className: "text-xs text-text-muted", children: t('install.signIn.chat') });
-    }
+        const t5 = note !== null && ` ${note}`;
+        let t6;
+        if ($[24] !== t4 || $[25] !== t5) {
+          t6 = /*#__PURE__*/_jsxs("p", {
+            className: "text-xs text-text-muted",
+            children: [t4, t5]
+          });
+          $[24] = t4;
+          $[25] = t5;
+          $[26] = t6;
+        } else {
+          t6 = $[26];
+        }
+        return t6;
+      }
+    case "chat":
+      {
+        let t1;
+        if ($[27] !== t) {
+          t1 = t("install.signIn.chat");
+          $[27] = t;
+          $[28] = t1;
+        } else {
+          t1 = $[28];
+        }
+        let t2;
+        if ($[29] !== t1) {
+          t2 = /*#__PURE__*/_jsx("p", {
+            className: "text-xs text-text-muted",
+            children: t1
+          });
+          $[29] = t1;
+          $[30] = t2;
+        } else {
+          t2 = $[30];
+        }
+        return t2;
+      }
+  }
 }
 /* How to get a CLI that is not on the machine yet, step by step, until it is there and signed in. */
-export function InstallPage({ provider, signedIn, extra }) {
-    const { t } = useTranslation('agent-providers');
-    const { id: scopeId } = useChatScope();
-    const host = useChatHost();
-    const useMachinePlatform = host.useMachinePlatform ?? noPlatform;
-    const machine = useMachinePlatform(scopeId) ?? pagePlatform();
-    const { offered, initial } = installPlatforms(provider, machine);
-    // Only a person's pick is kept, so a machine whose system arrives late still opens on its own.
-    const [chosen, setPlatform] = useState(null);
-    const platform = chosen ?? initial;
-    const install = provider.install;
-    const run = host.runProviderCommand;
-    const onRun = (command) => run?.(scopeId, provider.kind, command);
-    const command = platform === null ? undefined : install?.commands[platform];
-    const steps = [];
-    steps.push({
-        title: t('install.install.title'),
-        done: provider.installed,
-        body: provider.installed ? (_jsx("p", { className: "text-xs text-text-muted", children: provider.version ? t('install.install.done', { version: provider.version }) : t('install.install.doneNoVersion') })) : (_jsxs(_Fragment, { children: [offered.length > 1 && platform !== null && (_jsx(Segmented, { value: platform, label: t('install.platform'), options: offered.map((id) => ({ id, label: t(`install.platforms.${id}`) })), onValueChange: setPlatform })), command ? _jsx(CommandBlock, { command: command }) : _jsx("p", { className: "text-xs text-text-muted", children: t('install.install.none') }), ((command && run) || install?.guideUrl) && (_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [command && run && (_jsxs(Button, { variant: "primary", onClick: () => onRun(command), children: [_jsx(Icon, { icon: SquareTerminal, size: 14 }), t('install.run')] })), install?.guideUrl && (_jsxs(Button, { href: install.guideUrl, children: [t('install.guide'), _jsx(Icon, { icon: ExternalLink, size: 14 })] }))] }))] }))
-    });
-    if (extra !== null) {
-        steps.push(extra);
-    }
-    const ways = install?.signIn ?? [];
-    steps.push({
-        title: t('install.signIn.title'),
-        done: provider.installed && signedIn,
-        body: ways.length === 0 ? (_jsx("p", { className: "text-xs text-text-muted", children: t('install.signIn.unknown') })) : (ways.map((way, index) => (_jsxs("div", { className: "flex min-w-0 flex-col gap-2", children: [index > 0 && _jsx("span", { className: "text-xs font-medium text-text-faint", children: t('install.signIn.or') }), _jsx(SignInWay, { way: way, canRun: run !== undefined && provider.installed, onRun: onRun })] }, `${way.kind}-${index}`))))
-    });
-    steps.push({
-        title: t('install.start.title'),
-        done: false,
-        body: _jsx("p", { className: "text-xs text-text-muted", children: t('install.start.description', { provider: provider.name }) })
-    });
-    const states = installStepStates(steps.map((step) => step.done));
-    return (_jsxs(_Fragment, { children: [_jsxs("header", { className: "flex min-w-0 items-start gap-3", children: [_jsx("span", { className: "grid size-10 shrink-0 place-items-center rounded-xl bg-surface-sunken", children: _jsx(CliMark, { kind: provider.kind, size: 20 }) }), _jsxs("div", { className: "flex min-w-0 grow flex-col", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [_jsx("h3", { className: "truncate text-lg font-semibold text-text", children: provider.name }), provider.installed ? (provider.version && (_jsx(Pill, { tone: "idle", mono: true, children: provider.version }))) : (_jsx(Pill, { children: t('install.notInstalled') }))] }), install && _jsx("p", { className: "text-xs text-text-muted", children: install.description })] })] }), install ? (_jsx("ol", { "aria-label": t('install.steps', { provider: provider.name }), className: "flex min-w-0 flex-col gap-3", children: steps.map((step, index) => (_jsx(Step, { index: index, state: states[index], title: step.title, children: step.body }, index))) })) : (_jsx("p", { className: "text-xs text-text-muted", children: t('install.fallback', { provider: provider.name }) })), _jsxs("p", { className: "flex min-w-0 items-center gap-2 text-xs text-text-muted", children: [_jsx("span", { "aria-hidden": true, className: clsx('size-2 shrink-0 rounded-full', provider.installed ? 'bg-status-idle' : 'bg-text-faint') }), provider.installed ? t('install.footer.found') : t('install.footer.missing')] })] }));
+export function InstallPage(t0) {
+  const $ = _c(42);
+  const {
+    provider,
+    signedIn,
+    extra
+  } = t0;
+  const {
+    t
+  } = useTranslation("agent-providers");
+  const {
+    id: scopeId
+  } = useChatScope();
+  const host = useChatHost();
+  const machine = useHostMachinePlatform(scopeId) ?? pagePlatform();
+  const {
+    offered,
+    initial
+  } = installPlatforms(provider, machine);
+  const [chosen, setPlatform] = useState(null);
+  const platform = chosen ?? initial;
+  const install = provider.install;
+  const run = host.runProviderCommand;
+  let t1;
+  if ($[0] !== provider.kind || $[1] !== run || $[2] !== scopeId) {
+    t1 = command => run?.(scopeId, provider.kind, command);
+    $[0] = provider.kind;
+    $[1] = run;
+    $[2] = scopeId;
+    $[3] = t1;
+  } else {
+    t1 = $[3];
+  }
+  const onRun = t1;
+  const command_0 = platform === null ? undefined : install?.commands[platform];
+  const steps = [];
+  steps.push({
+    title: t("install.install.title"),
+    done: provider.installed,
+    body: provider.installed ? /*#__PURE__*/_jsx("p", {
+      className: "text-xs text-text-muted",
+      children: provider.version ? t("install.install.done", {
+        version: provider.version
+      }) : t("install.install.doneNoVersion")
+    }) : /*#__PURE__*/_jsxs(_Fragment, {
+      children: [offered.length > 1 && platform !== null && /*#__PURE__*/_jsx(Segmented, {
+        value: platform,
+        label: t("install.platform"),
+        options: offered.map(id => ({
+          id,
+          label: t(`install.platforms.${id}`)
+        })),
+        onValueChange: setPlatform
+      }), command_0 ? /*#__PURE__*/_jsx(CommandBlock, {
+        command: command_0
+      }) : /*#__PURE__*/_jsx("p", {
+        className: "text-xs text-text-muted",
+        children: t("install.install.none")
+      }), (command_0 && run || install?.guideUrl) && /*#__PURE__*/_jsxs("div", {
+        className: "flex flex-wrap items-center gap-2",
+        children: [command_0 && run && /*#__PURE__*/_jsxs(Button, {
+          variant: "primary",
+          onClick: () => onRun(command_0),
+          children: [/*#__PURE__*/_jsx(Icon, {
+            icon: SquareTerminal,
+            size: 14
+          }), t("install.run")]
+        }), install?.guideUrl && /*#__PURE__*/_jsxs(Button, {
+          href: install.guideUrl,
+          children: [t("install.guide"), /*#__PURE__*/_jsx(Icon, {
+            icon: ExternalLink,
+            size: 14
+          })]
+        })]
+      })]
+    })
+  });
+  if (extra !== null) {
+    steps.push(extra);
+  }
+  const ways = install?.signIn ?? [];
+  steps.push({
+    title: t("install.signIn.title"),
+    done: provider.installed && signedIn,
+    body: ways.length === 0 ? /*#__PURE__*/_jsx("p", {
+      className: "text-xs text-text-muted",
+      children: t("install.signIn.unknown")
+    }) : ways.map((way, index) => /*#__PURE__*/_jsxs("div", {
+      className: "flex min-w-0 flex-col gap-2",
+      children: [index > 0 && /*#__PURE__*/_jsx("span", {
+        className: "text-xs font-medium text-text-faint",
+        children: t("install.signIn.or")
+      }), /*#__PURE__*/_jsx(SignInWay, {
+        way: way,
+        canRun: run !== undefined && provider.installed,
+        onRun: onRun
+      })]
+    }, `${way.kind}-${index}`))
+  });
+  const t2 = t("install.start.title");
+  let t3;
+  if ($[4] !== provider.name || $[5] !== t) {
+    t3 = t("install.start.description", {
+      provider: provider.name
+    });
+    $[4] = provider.name;
+    $[5] = t;
+    $[6] = t3;
+  } else {
+    t3 = $[6];
+  }
+  let t4;
+  if ($[7] !== t3) {
+    t4 = /*#__PURE__*/_jsx("p", {
+      className: "text-xs text-text-muted",
+      children: t3
+    });
+    $[7] = t3;
+    $[8] = t4;
+  } else {
+    t4 = $[8];
+  }
+  steps.push({
+    title: t2,
+    done: false,
+    body: t4
+  });
+  const states = installStepStates(steps.map(_temp));
+  let t5;
+  if ($[9] !== provider.kind) {
+    t5 = /*#__PURE__*/_jsx("span", {
+      className: "grid size-10 shrink-0 place-items-center rounded-xl bg-surface-sunken",
+      children: /*#__PURE__*/_jsx(CliMark, {
+        kind: provider.kind,
+        size: 20
+      })
+    });
+    $[9] = provider.kind;
+    $[10] = t5;
+  } else {
+    t5 = $[10];
+  }
+  let t6;
+  if ($[11] !== provider.name) {
+    t6 = /*#__PURE__*/_jsx("h3", {
+      className: "truncate text-lg font-semibold text-text",
+      children: provider.name
+    });
+    $[11] = provider.name;
+    $[12] = t6;
+  } else {
+    t6 = $[12];
+  }
+  let t7;
+  if ($[13] !== provider.installed || $[14] !== provider.version || $[15] !== t) {
+    t7 = provider.installed ? provider.version && /*#__PURE__*/_jsx(Pill, {
+      tone: "idle",
+      mono: true,
+      children: provider.version
+    }) : /*#__PURE__*/_jsx(Pill, {
+      children: t("install.notInstalled")
+    });
+    $[13] = provider.installed;
+    $[14] = provider.version;
+    $[15] = t;
+    $[16] = t7;
+  } else {
+    t7 = $[16];
+  }
+  let t8;
+  if ($[17] !== t6 || $[18] !== t7) {
+    t8 = /*#__PURE__*/_jsxs("div", {
+      className: "flex min-w-0 items-center gap-2",
+      children: [t6, t7]
+    });
+    $[17] = t6;
+    $[18] = t7;
+    $[19] = t8;
+  } else {
+    t8 = $[19];
+  }
+  let t9;
+  if ($[20] !== install) {
+    t9 = install && /*#__PURE__*/_jsx("p", {
+      className: "text-xs text-text-muted",
+      children: install.description
+    });
+    $[20] = install;
+    $[21] = t9;
+  } else {
+    t9 = $[21];
+  }
+  let t10;
+  if ($[22] !== t8 || $[23] !== t9) {
+    t10 = /*#__PURE__*/_jsxs("div", {
+      className: "flex min-w-0 grow flex-col",
+      children: [t8, t9]
+    });
+    $[22] = t8;
+    $[23] = t9;
+    $[24] = t10;
+  } else {
+    t10 = $[24];
+  }
+  let t11;
+  if ($[25] !== t10 || $[26] !== t5) {
+    t11 = /*#__PURE__*/_jsxs("header", {
+      className: "flex min-w-0 items-start gap-3",
+      children: [t5, t10]
+    });
+    $[25] = t10;
+    $[26] = t5;
+    $[27] = t11;
+  } else {
+    t11 = $[27];
+  }
+  const t12 = install ? /*#__PURE__*/_jsx("ol", {
+    "aria-label": t("install.steps", {
+      provider: provider.name
+    }),
+    className: "flex min-w-0 flex-col gap-3",
+    children: steps.map((step_0, index_0) => /*#__PURE__*/_jsx(Step, {
+      index: index_0,
+      state: states[index_0],
+      title: step_0.title,
+      children: step_0.body
+    }, index_0))
+  }) : /*#__PURE__*/_jsx("p", {
+    className: "text-xs text-text-muted",
+    children: t("install.fallback", {
+      provider: provider.name
+    })
+  });
+  const t13 = provider.installed ? "bg-status-idle" : "bg-text-faint";
+  let t14;
+  if ($[28] !== t13) {
+    t14 = clsx("size-2 shrink-0 rounded-full", t13);
+    $[28] = t13;
+    $[29] = t14;
+  } else {
+    t14 = $[29];
+  }
+  let t15;
+  if ($[30] !== t14) {
+    t15 = /*#__PURE__*/_jsx("span", {
+      "aria-hidden": true,
+      className: t14
+    });
+    $[30] = t14;
+    $[31] = t15;
+  } else {
+    t15 = $[31];
+  }
+  let t16;
+  if ($[32] !== provider.installed || $[33] !== t) {
+    t16 = provider.installed ? t("install.footer.found") : t("install.footer.missing");
+    $[32] = provider.installed;
+    $[33] = t;
+    $[34] = t16;
+  } else {
+    t16 = $[34];
+  }
+  let t17;
+  if ($[35] !== t15 || $[36] !== t16) {
+    t17 = /*#__PURE__*/_jsxs("p", {
+      className: "flex min-w-0 items-center gap-2 text-xs text-text-muted",
+      children: [t15, t16]
+    });
+    $[35] = t15;
+    $[36] = t16;
+    $[37] = t17;
+  } else {
+    t17 = $[37];
+  }
+  let t18;
+  if ($[38] !== t11 || $[39] !== t12 || $[40] !== t17) {
+    t18 = /*#__PURE__*/_jsxs(_Fragment, {
+      children: [t11, t12, t17]
+    });
+    $[38] = t11;
+    $[39] = t12;
+    $[40] = t17;
+    $[41] = t18;
+  } else {
+    t18 = $[41];
+  }
+  return t18;
 }
+function _temp(step) {
+  return step.done;
+}