@radnine/storybook-addon-claude 0.1.1 → 0.2.0

package/dist/Panel.js

@@ -37,12 +37,13 @@ function ClaudePanel({
   // Story context
   const storyContext = (0, _useStoryContext.useStoryContext)();
 
-  // Claude session
+  // Claude session — connects automatically (no token needed on localhost)
   const {
     connectionState,
     messages,
     sessionId,
     isProcessing,
+    authFailed,
     sendMessage,
     startSession,
     disconnect,
@@ -84,8 +85,8 @@ function ClaudePanel({
   // Don't render if panel is not active
   if (!active) return null;
 
-  // No token — show token input
-  if (!token) {
+  // Show token input only if auth was explicitly rejected (non-localhost connection)
+  if (authFailed && !token) {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       style: styles.panel,
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TokenInput.TokenInput, {

package/dist/WebSocketClient.js

@@ -53,20 +53,16 @@ class WebSocketClient {
     if (this._ws) {
       this._ws.close();
     }
-    if (!this._token) {
-      this._emit('error', {
-        code: 'NO_TOKEN',
-        message: 'Auth token is required'
-      });
-      return;
-    }
 
     // Preserve RECONNECTING state so failed reconnect attempts still trigger
     // _scheduleReconnect in the onclose handler.
     if (this._state !== _constants.CONNECTION_STATES.RECONNECTING) {
       this._setState(_constants.CONNECTION_STATES.CONNECTING);
     }
-    const url = `ws://${this._host}:${this._port}/?token=${encodeURIComponent(this._token)}`;
+
+    // Connect without token for localhost (daemon allows it), or with token if provided
+    const params = this._token ? `?token=${encodeURIComponent(this._token)}` : '';
+    const url = `ws://${this._host}:${this._port}/${params}`;
     try {
       this._ws = new WebSocket(url);
     } catch (err) {

package/dist/useClaudeSession.js

@@ -24,6 +24,7 @@ function useClaudeSession(options = {}) {
   const [messages, setMessages] = (0, _react.useState)([]);
   const [sessionId, setSessionId] = (0, _react.useState)(initialSessionId || null);
   const [isProcessing, setIsProcessing] = (0, _react.useState)(false);
+  const [authFailed, setAuthFailed] = (0, _react.useState)(false);
   const clientRef = (0, _react.useRef)(null);
   const sessionIdRef = (0, _react.useRef)(sessionId);
   sessionIdRef.current = sessionId;
@@ -56,6 +57,11 @@ function useClaudeSession(options = {}) {
       }]);
       setIsProcessing(false);
     }), client.on('error', msg => {
+      // Track auth failures so the UI can show token input
+      if (msg.code === 'AUTH_FAILED') {
+        setAuthFailed(true);
+        return;
+      }
       setMessages(prev => [...prev, {
         type: 'error',
         ...msg,
@@ -70,11 +76,15 @@ function useClaudeSession(options = {}) {
     };
   }, [host, port, token]);
 
-  // Connect when token is available
+  // Auto-connect immediately (works without token on localhost)
+  // or reconnect when token changes
   (0, _react.useEffect)(() => {
     const client = clientRef.current;
-    if (!client || !token) return;
-    client.setToken(token);
+    if (!client) return;
+    if (token) {
+      client.setToken(token);
+    }
+    setAuthFailed(false);
     client.connect();
     return () => client.disconnect();
   }, [token]);
@@ -130,6 +140,7 @@ function useClaudeSession(options = {}) {
     messages,
     sessionId,
     isProcessing,
+    authFailed,
     sendMessage,
     startSession,
     clearMessages,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@radnine/storybook-addon-claude",
-  "version": "0.1.1",
+  "version": "0.2.0",
   "description": "Storybook addon panel for chatting with Claude via the standalone daemon",
   "license": "SEE LICENSE IN LICENSE",
   "repository": {