@chrysb/alphaclaw 0.8.1 → 0.8.3-beta.0

package/lib/public/js/components/providers.js

@@ -1,6 +1,6 @@
-import { h } from "https://esm.sh/preact";
-import { useEffect, useRef, useState } from "https://esm.sh/preact/hooks";
-import htm from "https://esm.sh/htm";
+import { h } from "preact";
+import { useEffect, useRef, useState } from "preact/hooks";
+import htm from "htm";
 import {
   fetchEnvVars,
   saveEnvVars,
@@ -48,7 +48,7 @@ const FeatureTags = ({ provider, features = null }) => {
       ${uniqueFeatures.map(
         (f) => html`
           <span
-            class="text-xs px-1.5 py-0.5 rounded-md bg-white/5 text-gray-400"
+            class="text-xs px-1.5 py-0.5 rounded-md bg-white/5 text-fg-muted"
             >${f}</span
           >
         `,
@@ -353,7 +353,7 @@ export const Providers = ({ onRestartRequired = () => {} }) => {
   const renderCredentialField = (field) => html`
     <div class="space-y-1">
       <div class="flex items-center gap-3">
-        <label class="text-xs font-medium text-gray-400">${field.label}</label>
+        <label class="text-xs font-medium text-fg-muted">${field.label}</label>
         ${field.url && !getKeyVal(envVars, field.key)
           ? html`<a
               href=${field.url}
@@ -369,10 +369,10 @@ export const Providers = ({ onRestartRequired = () => {} }) => {
         onInput=${(e) => setEnvValue(field.key, e.target.value)}
         placeholder=${field.placeholder || ""}
         isSecret=${!field.isText}
-        inputClass="flex-1 w-full bg-black/30 border border-border rounded-lg px-3 py-2 text-sm text-gray-200 outline-none focus:border-gray-500 font-mono"
+        inputClass="flex-1 w-full bg-field border border-border rounded-lg px-3 py-2 text-sm text-body outline-none focus:border-fg-muted font-mono"
       />
       ${field.hint
-        ? html`<p class="text-xs text-gray-600">${field.hint}</p>`
+        ? html`<p class="text-xs text-fg-dim">${field.hint}</p>`
         : null}
     </div>
   `;
@@ -380,7 +380,7 @@ export const Providers = ({ onRestartRequired = () => {} }) => {
   const renderCodexOAuth = () => html`
     <div class="border border-border rounded-lg p-3 space-y-2">
       <div class="flex items-center justify-between">
-        <span class="text-xs text-gray-400">Codex OAuth</span>
+        <span class="text-xs text-fg-muted">Codex OAuth</span>
         ${codexStatus.connected
           ? html`<${Badge} tone="success">Connected</${Badge}>`
           : html`<${Badge} tone="warning">Not connected</${Badge}>`}
@@ -413,7 +413,7 @@ export const Providers = ({ onRestartRequired = () => {} }) => {
             `
           : html`
               <div class="flex items-center justify-between gap-2">
-                <p class="text-xs text-gray-500">
+                <p class="text-xs text-fg-muted">
                   ${codexAuthWaiting
                     ? "Complete login in the popup, then paste the redirect URL."
                     : "Paste the redirect URL from your browser to finish connecting."}
@@ -428,9 +428,9 @@ export const Providers = ({ onRestartRequired = () => {} }) => {
             `}
       ${!codexStatus.connected && codexAuthStarted
         ? html`
-            <p class="text-xs text-gray-500">
+            <p class="text-xs text-fg-muted">
               After login, copy the full redirect URL (starts with
-              <code class="text-xs bg-black/30 px-1 rounded"
+              <code class="text-xs bg-field px-1 rounded"
                 >http://localhost:1455/auth/callback</code
               >) and paste it here.
             </p>
@@ -439,7 +439,7 @@ export const Providers = ({ onRestartRequired = () => {} }) => {
               value=${codexManualInput}
               onInput=${(e) => setCodexManualInput(e.target.value)}
               placeholder="http://localhost:1455/auth/callback?code=...&state=..."
-              class="w-full bg-black/30 border border-border rounded-lg px-3 py-2 text-xs text-gray-200 outline-none focus:border-gray-500"
+              class="w-full bg-field border border-border rounded-lg px-3 py-2 text-xs text-body outline-none focus:border-fg-muted"
             />
             <${ActionButton}
               onClick=${completeCodexAuth}
@@ -506,7 +506,7 @@ export const Providers = ({ onRestartRequired = () => {} }) => {
           `}
         />
         <div class="bg-surface border border-border rounded-xl p-4">
-          <div class="flex items-center gap-2 text-sm text-gray-400">
+          <div class="flex items-center gap-2 text-sm text-fg-muted">
             <${LoadingSpinner} className="h-4 w-4" />
             Loading provider settings...
           </div>
@@ -555,7 +555,7 @@ export const Providers = ({ onRestartRequired = () => {} }) => {
               selectedModel: next,
             };
           }}
-          class="w-full bg-black/30 border border-border rounded-lg pl-3 pr-8 py-2 text-sm text-gray-200 outline-none focus:border-gray-500"
+          class="w-full bg-field border border-border rounded-lg pl-3 pr-8 py-2 text-sm text-body outline-none focus:border-fg-muted"
         >
           <option value="">Select a model</option>
           ${modelOptions.map(
@@ -565,7 +565,7 @@ export const Providers = ({ onRestartRequired = () => {} }) => {
               </option>`,
           )}
         </select>
-        <p class="text-xs text-gray-600">
+        <p class="text-xs text-fg-dim">
           ${modelsLoading
             ? "Loading model catalog..."
             : modelsError
@@ -586,7 +586,7 @@ export const Providers = ({ onRestartRequired = () => {} }) => {
                       };
                       return next;
                     })}
-                  class="text-xs text-gray-500 hover:text-gray-300"
+                  class="text-xs text-fg-muted hover:text-body"
                 >
                   ${showAllModels
                     ? "Show recommended models"
@@ -623,7 +623,7 @@ export const Providers = ({ onRestartRequired = () => {} }) => {
         : null}
       ${modelDirty && !hasSelectedProviderAuth
         ? html`
-            <p class="text-xs text-yellow-500">
+            <p class="text-xs text-status-warning-muted">
               Set credentials for the selected provider before saving this model
               change.
             </p>

package/lib/public/js/components/routes/agents-route.js

@@ -1,5 +1,5 @@
-import { h } from "https://esm.sh/preact";
-import htm from "https://esm.sh/htm";
+import { h } from "preact";
+import htm from "htm";
 import { AgentsTab } from "../agents-tab/index.js";
 
 const html = htm.bind(h);

package/lib/public/js/components/routes/browse-route.js

@@ -1,5 +1,5 @@
-import { h } from "https://esm.sh/preact";
-import htm from "https://esm.sh/htm";
+import { h } from "preact";
+import htm from "htm";
 import { FileViewer } from "../file-viewer/index.js";
 
 const html = htm.bind(h);