openclacky 1.3.10 → 1.4.0

data/lib/clacky/tools/terminal.rb

@@ -607,9 +607,22 @@ module Clacky
           ""
         )
 
-        # Pass 1: anchored strip — the full wrapper echoed at the start,
-        # possibly spanning multiple real newlines.
-        text = text.sub(/\A\{.*?"\$__clacky_ec"\s*\n?/m, "")
+        # Pass 1: anchored strip — remove ONLY the wrapper's echoed head
+        # line (`{ USER_CMD`) at the very start of the buffer, and ONLY
+        # when a matching wrapper tail fingerprint (`}...; __clacky_ec=$?`)
+        # actually exists somewhere in the buffer. The guard is what keeps
+        # us from eating a real first line of user output that merely
+        # happens to start with `{` (e.g. JSON like `{"key": ...}`).
+        # We test the tail with a separate anchor-free `match?` (linear, no
+        # backtracking) rather than a lookahead, to avoid catastrophic
+        # regex backtracking on large `{`-prefixed output. We strip a
+        # single line (`[^\n]*`, not cross-line `.*?`): a multi-line command
+        # echoed in cooked mode puts the wrapper tail *after* the real
+        # output, so cross-line greed would swallow that output whole. The
+        # tail itself is removed by the fingerprint passes below.
+        if text.start_with?("{") && text.match?(/\}[^\n;]*; *__clacky_ec=\$\?/)
+          text = text.sub(/\A\{[^\n]*\n/, "")
+        end
 
         # Pass 2: token-aware global strip — remove any leftover wrapper
         # echo fragment, wherever it sits. Requires the session token so
@@ -629,9 +642,11 @@ module Clacky
           # 2b. Single-line shape: everything collapsed onto one line.
           # Strip from the wrapper's `}; __clacky_ec=$?` pivot (or the
           # opening `{` if still present on that line) through the end of
-          # the printf invocation (`"$__clacky_ec"`).
+          # the printf invocation (`"$__clacky_ec"`). The optional
+          # `[^\n;]*` between `}` and `;` absorbs a WSL `</dev/null`
+          # stdin redirect spliced onto the group.
           text = text.gsub(
-            /[^\n]*\}; *__clacky_ec=\$\?; *printf[^\n]*__CLACKY_DONE_#{token_re}_[^\n]*"\$__clacky_ec"[^\n]*\n?/,
+            /[^\n]*\}[^\n;]*; *__clacky_ec=\$\?; *printf[^\n]*__CLACKY_DONE_#{token_re}_[^\n]*"\$__clacky_ec"[^\n]*\n?/,
             ""
           )
 
@@ -653,9 +668,10 @@ module Clacky
         # private double-underscore var name that user code effectively
         # never emits — so we strip anything between them (non-greedy,
         # multiline-aware) to also handle width-wrap that inserted
-        # real \n breaks inside the echo.
+        # real \n breaks inside the echo. `[^\n;]*` between `}` and `;`
+        # absorbs a WSL `</dev/null` stdin redirect on the group.
         text = text.gsub(
-          /[^\n]*\}; *__clacky_ec=\$\?.*?"\$__clacky_ec"[^\n]*\n?/m,
+          /[^\n]*\}[^\n;]*; *__clacky_ec=\$\?.*?"\$__clacky_ec"[^\n]*\n?/m,
           ""
         )
 
@@ -663,7 +679,7 @@ module Clacky
         # truncation cut off everything after `__clacky_ec=$?`). Still a
         # reliable fingerprint thanks to the `__clacky_ec` var name.
         text = text.gsub(
-          /[^\n]*\}; *__clacky_ec=\$\?;?[^\n]*\n?/,
+          /[^\n]*\}[^\n;]*; *__clacky_ec=\$\?;?[^\n]*\n?/,
           ""
         )
 

data/lib/clacky/ui2/layout_manager.rb

@@ -402,6 +402,10 @@ module Clacky
           screen.show_cursor
           screen.flush
         end
+        # Restore cooked mode so the terminal is usable after exit, regardless
+        # of which exit path was taken (some call exit(0) and bypass the
+        # input_loop ensure). Idempotent; safe to call more than once.
+        screen.disable_raw_mode
       end
 
       # /clear: wipe output area + buffer, keep fixed area.

data/lib/clacky/ui2/screen_buffer.rb

@@ -118,14 +118,42 @@ module Clacky
         @height = TTY::Screen.height
       end
 
-      # Enable raw mode (disable line buffering)
+      # Enable raw mode (disable line buffering). The very first time it runs it
+      # snapshots the terminal's original settings (via `stty -g`) so the exact
+      # pre-clacky state can be restored on exit — `IO#cooked!` only applies a
+      # generic cooked profile and does not restore flow-control (IXON) and other
+      # bits, which on macOS leaves the shell in a broken input state.
       def enable_raw_mode
+        return unless $stdin.tty?
+
+        @original_stty ||= capture_stty
         $stdin.raw!
       end
 
-      # Disable raw mode
+      # Disable raw mode. Idempotent and tty-guarded so it can be safely called
+      # from any exit path. Restores the exact original terminal settings when a
+      # snapshot exists, then flushes pending input so stray bytes don't leak to
+      # the shell. Falls back to `IO#cooked!` when no snapshot is available.
       def disable_raw_mode
-        $stdin.cooked!
+        return unless $stdin.tty?
+
+        $stdin.cooked! unless @original_stty && restore_stty(@original_stty)
+        $stdin.ioflush
+      rescue IOError, Errno::ENOTTY
+        nil
+      end
+
+      private def capture_stty
+        out = Clacky::Utils::Encoding.cmd_to_utf8(`stty -g 2>/dev/null`).strip
+        out.empty? ? nil : out
+      rescue StandardError
+        nil
+      end
+
+      private def restore_stty(state)
+        system("stty", state, out: File::NULL, err: File::NULL)
+      rescue StandardError
+        false
       end
 
       # Read a single character without echo

data/lib/clacky/utils/file_processor.rb

@@ -604,8 +604,7 @@ module Clacky
 
         ext = File.extname(path).downcase
         if LOCAL_MEDIA_EXTENSIONS.include?(ext) && File.exist?(path)
-          encoded = CGI.escape(href)
-          "![#{alt}](/api/local-image?path=#{encoded})"
+          "![#{alt}](#{local_image_proxy_url(href, path)})"
         else
           _match
         end
@@ -622,8 +621,7 @@ module Clacky
 
         ext = File.extname(path).downcase
         if LOCAL_VIDEO_EXTENSIONS.include?(ext) && File.exist?(path)
-          encoded = CGI.escape(href)
-          "<video#{pre} src=\"/api/local-image?path=#{encoded}\"#{post}>"
+          "<video#{pre} src=\"#{local_image_proxy_url(href, path)}\"#{post}>"
         else
           _match
         end
@@ -640,8 +638,7 @@ module Clacky
 
         ext = File.extname(path).downcase
         if LOCAL_AUDIO_EXTENSIONS.include?(ext) && File.exist?(path)
-          encoded = CGI.escape(href)
-          "<audio#{pre} src=\"/api/local-image?path=#{encoded}\"#{post}>"
+          "<audio#{pre} src=\"#{local_image_proxy_url(href, path)}\"#{post}>"
         else
           _match
         end
@@ -658,8 +655,7 @@ module Clacky
         ext = File.extname(path).downcase
         if LOCAL_VIDEO_EXTENSIONS.include?(ext) || LOCAL_AUDIO_EXTENSIONS.include?(ext)
           if File.exist?(path)
-            encoded = CGI.escape(href)
-            "[#{text}](/api/local-image?path=#{encoded})"
+            "[#{text}](#{local_image_proxy_url(href, path)})"
           else
             _match
           end
@@ -670,6 +666,15 @@ module Clacky
 
       content
     end
+
+    # Build a proxy URL for a local media file, appending a version param
+    # derived from the file mtime so an overwritten same-name file produces a
+    # different URL and defeats the browser's in-memory image cache.
+    def self.local_image_proxy_url(href, path)
+      encoded = CGI.escape(href)
+      version = File.mtime(path).to_i
+      "/api/local-image?path=#{encoded}&v=#{version}"
+    end
   end
   end
 end

data/lib/clacky/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module Clacky
-  VERSION = "1.3.10"
+  VERSION = "1.4.0"
 end

data/lib/clacky/web/app.css

@@ -782,7 +782,7 @@ body {
   color: var(--color-accent-primary);
 }
 
-/* ── Command-palette search overlay (⌘K) ─────────────────────────────────── */
+/* ── Command-palette search overlay ──────────────────────────────────────── */
 .cmd-palette-overlay {
   position: fixed;
   inset: 0;
@@ -6484,6 +6484,28 @@ body {
   overflow-y: auto;
 }
 
+/* ── Skills search ──────────────────────────────────────────────────────── */
+.skills-search {
+  font-size: 0.8125rem;
+  padding: 0.375rem 0.75rem;
+  border-radius: 6px;
+  border: 1px solid var(--color-border-primary);
+  background: var(--color-bg-secondary);
+  color: var(--color-text-primary);
+  width: 12rem;
+}
+.skills-search::placeholder { color: var(--color-text-tertiary); }
+.skills-search:focus {
+  outline: none;
+  border-color: var(--color-accent, #6366f1);
+}
+.skills-search-empty {
+  padding: 2rem 1rem;
+  text-align: center;
+  color: var(--color-text-tertiary);
+  font-size: 0.875rem;
+}
+
 /* ── My Skills upload area (user-licensed only) ───────────────────────────── */
 .my-skills-upload-area {
   display: flex;
@@ -7072,6 +7094,12 @@ body {
 }
 
 /* ── Extension Market ─────────────────────────────────────────────────── */
+#extensions-panel {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+}
 #extensions-body {
   flex: 1;
   overflow-y: auto;
@@ -7165,26 +7193,38 @@ body {
   background: var(--color-bg-secondary);
   border: 1px solid var(--color-border-primary);
   border-radius: 8px;
-  padding: 0.875rem 1rem;
+  padding: 0.6rem 1rem;
   transition: border-color .15s;
 }
 .extension-card:hover { border-color: var(--color-text-muted); }
 .extension-card-main {
   display: flex;
-  align-items: center;
+  align-items: stretch;
   gap: 0.75rem;
 }
 .extension-emoji {
   font-size: 1.5rem;
   line-height: 1.4;
   flex-shrink: 0;
+  display: flex;
+  align-items: flex-start;
+}
+.extension-default-icon {
+  width: 2rem;
+  height: 100%;
+  display: block;
+  border-radius: 7px;
+}
+.extension-emoji-lg .extension-default-icon {
+  width: 2.75rem;
+  height: 2.75rem;
+  border-radius: 10px;
 }
-.extension-info { flex: 1; min-width: 0; }
+.extension-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
 .extension-title {
   display: flex;
   align-items: center;
-  gap: 0.375rem;
-  margin-bottom: 0.25rem;
+  gap: 0.5rem;
   flex-wrap: wrap;
 }
 .extension-name {
@@ -7197,18 +7237,24 @@ body {
   color: var(--color-text-secondary);
   background: var(--color-bg-tertiary, rgba(255,255,255,0.05));
   border-radius: 4px;
-  padding: 0.0625rem 0.375rem;
 }
 .extension-units {
   font-size: 0.6875rem;
   color: var(--color-text-muted);
 }
 .extension-installed {
-  font-size: 0.6875rem;
+  font-size: 0.625rem;
   color: var(--color-success, #16a34a);
   background: var(--color-success-bg, rgba(22,163,74,0.12));
   border-radius: 4px;
-  padding: 0.0625rem 0.375rem;
+  padding: 0.2rem 0.375rem;
+}
+.extension-updatable {
+  font-size: 0.625rem;
+  color: var(--color-button-primary);
+  background: color-mix(in srgb, var(--color-button-primary) 12%, transparent);
+  border-radius: 4px;
+  padding: 0.2rem 0.375rem;
 }
 .extension-unlisted {
   font-size: 0.6875rem;
@@ -7221,11 +7267,10 @@ body {
   font-size: 0.75rem;
   color: var(--color-text-secondary);
   line-height: 1.5;
-  margin-bottom: 0.375rem;
 }
 .extension-desc-detail {
   font-size: 0.8125rem;
-  margin-bottom: 0.5rem;
+  margin-bottom: 0;
 }
 .extension-detail-author {
   font-size: 0.6875rem;
@@ -7236,6 +7281,11 @@ body {
   color: var(--color-text-muted);
   font-weight: 400;
 }
+.extension-installs {
+  font-size: 0.75rem;
+  color: var(--color-text-muted);
+  font-weight: 400;
+}
 .extension-meta {
   display: flex;
   align-items: center;
@@ -7282,8 +7332,13 @@ body {
   padding-bottom: 1.25rem;
   border-bottom: 1px solid var(--color-border-primary);
 }
-.extension-detail-heading { flex: 1; min-width: 0; }
+.extension-detail-heading { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
 .extension-emoji-lg { font-size: 2.5rem; line-height: 1; margin-top: 0.125rem; }
+.extension-emoji-lg .extension-default-icon {
+  width: 3.5rem;
+  height: 3.5rem;
+  border-radius: 12px;
+}
 .extension-name-lg { font-size: 1.125rem; font-weight: 700; }
 .extension-detail-block { margin-top: 1.5rem; }
 .extension-detail-block-title {
@@ -7291,7 +7346,6 @@ body {
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.04em;
-  color: var(--color-text-muted);
   margin: 0 0 0.75rem;
 }
 .extension-detail-section { margin-bottom: 0.875rem; }
@@ -7338,33 +7392,78 @@ body {
   margin-top: 0.125rem;
 }
 .extension-version-item {
-  padding: 0.625rem 0.875rem;
+  padding: 0.75rem 1rem;
   border-bottom: 1px solid var(--color-border-primary);
 }
 .extension-version-item:last-child { border-bottom: none; }
 .extension-version-row {
   display: flex;
-  align-items: center;
+  align-items: baseline;
   gap: 0.5rem;
 }
+.extension-version-item:has(.extension-version-notes) .extension-version-row {
+  padding-bottom: 0.5rem;
+  margin-bottom: 0.5rem;
+  border-bottom: 1px solid var(--color-border-primary);
+}
+.extension-version-row .extension-version {
+  font-size: 0.8375rem;
+  font-weight: 700;
+  color: var(--color-text-primary);
+  background: none;
+  padding: 0;
+  border-radius: 0;
+}
+.extension-version-separator {
+  font-size: 0.8125rem;
+  color: var(--color-text-secondary);
+}
 .extension-version-date {
   font-size: 0.6875rem;
   color: var(--color-text-muted);
 }
 .extension-version-notes {
-  font-size: 0.75rem;
+  font-size: 0.8125rem;
   color: var(--color-text-secondary);
-  line-height: 1.5;
-  margin-top: 0.25rem;
-  white-space: pre-wrap;
+  line-height: 1.6;
+  margin-top: 0.5rem;
+}
+.extension-version-notes h1,
+.extension-version-notes h2,
+.extension-version-notes h3 {
+  font-size: 0.8125rem;
+  font-weight: 600;
+  color: var(--color-text-primary);
+  margin: 0.75rem 0 0.25rem;
+}
+.extension-version-notes h1 {
+  font-size: 0.9375rem;
+}
+.extension-version-notes h1:first-child,
+.extension-version-notes h2:first-child,
+.extension-version-notes h3:first-child {
+  margin-top: 0;
+}
+.extension-version-notes ul,
+.extension-version-notes ol {
+  margin: 0.25rem 0;
+  padding-left: 1.25rem;
 }
+.extension-version-notes li {
+  margin: 0.1rem 0;
+}
+.extension-version-notes p {
+  margin: 0.25rem 0;
+}
+.extension-version-notes p:first-child { margin-top: 0; }
+.extension-version-notes p:last-child { margin-bottom: 0; }
 .extension-detail-loading { display: flex; flex-direction: column; gap: 0.5rem; }
 
 .extension-detail-actions {
   display: flex;
   align-items: center;
   gap: 0.5rem;
-  margin-top: 0.75rem;
+  margin-top: 0.25rem;
 }
 .extension-disabled {
   font-size: 0.6875rem;
@@ -7399,6 +7498,18 @@ body {
   opacity: 0.5;
   cursor: not-allowed;
 }
+.extension-action-update {
+  background: var(--color-button-primary);
+  color: var(--color-button-primary-text);
+  border-color: transparent;
+}
+.extension-action-update:hover {
+  background: var(--color-button-primary-hover);
+}
+.extension-action-update:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
 .extension-action-disable,
 .extension-action-enable {
   color: var(--color-text-tertiary);
@@ -7560,7 +7671,7 @@ body {
   color: #ffffff;
   border: 1px solid var(--color-accent-primary);
 }
-.btn-brand-update:hover { background: var(--color-accent-hover); }
+.btn-brand-update:hover { background: var(--color-button-primary-hover); }
 .btn-brand-install:disabled,
 .btn-brand-update:disabled {
   opacity: 0.5;
@@ -9984,7 +10095,7 @@ body.setup-mode[data-theme="dark"] {
 
 .memory-card-actions {
   display: flex;
-  align-items: flex-start;
+  align-items: center;
   gap: 0.375rem;
   flex-shrink: 0;
 }
@@ -10024,6 +10135,7 @@ body.setup-mode[data-theme="dark"] {
 
 .btn-memory-expand {
   min-width: 1.75rem;
+  align-self: stretch;
   justify-content: center;
   color: var(--color-text-muted);
 }
@@ -10537,7 +10649,7 @@ body.setup-mode[data-theme="dark"] {
 
 /* ── Model Filter ────────────────────────────────────────────────────── */
 .billing-model-filter {
-  padding: 0.4375rem 0.75rem;
+  padding: 0.4375rem 1.75rem 0.4375rem 0.75rem;
   border: 1px solid var(--color-border-primary);
   border-radius: 8px;
   background: var(--color-bg-secondary);
@@ -10545,6 +10657,23 @@ body.setup-mode[data-theme="dark"] {
   font-size: 0.8125rem;
   cursor: pointer;
   min-width: 130px;
+  appearance: none;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23888' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  background-position: right 0.625rem center;
+  transition: border-color 0.15s ease;
+}
+.billing-model-filter:hover {
+  border-color: var(--color-border-strong);
+}
+.billing-model-filter:focus {
+  outline: none;
+  border-color: var(--color-accent-primary);
+  box-shadow: 0 0 0 3px var(--color-accent-soft);
+}
+.billing-model-filter option {
+  background: var(--color-bg-secondary);
+  color: var(--color-text-primary);
 }
 
 /* ── Action Buttons ──────────────────────────────────────────────────── */
@@ -12327,11 +12456,48 @@ body.setup-mode[data-theme="dark"] {
     display: none;
   }
 
+  /* Collapse session search into the right-side header actions */
+  #header-center {
+    justify-content: flex-end;
+    padding: 0;
+  }
+  #header-cmdbar {
+    flex: 0 0 1.875rem;
+    width: 1.875rem;
+    max-width: 1.875rem;
+    padding: 0;
+    border: none;
+    border-radius: var(--radius-sm);
+    background: transparent;
+    justify-content: center;
+    gap: 0;
+    margin-right: 0.125rem;
+  }
+  #header-cmdbar:hover {
+    color: var(--color-text-primary);
+  }
+  #header-cmdbar svg {
+    width: 1rem;
+    height: 1rem;
+    opacity: 1;
+  }
+  #header-cmdbar .cmdbar-ph,
+  #header-cmdbar .cmdbar-kbd,
+  #ext-slot-header-right:empty {
+    display: none;
+  }
+
   /* Tighten right-side icon gap on mobile */
   #header-right {
     gap: 0.125rem;
   }
 
+  @media (max-width: 360px) {
+    #top-header {
+      padding: 0 0.375rem;
+    }
+  }
+
   /* Session info bar: single-line, no hover-expand, font smaller */
   #session-info-bar {
     padding: 0.1875rem 0.5rem;
@@ -12748,4 +12914,3 @@ body.setup-mode[data-theme="dark"] {
     background: var(--color-bg-primary);
   }
 }
-

data/lib/clacky/web/features/extensions/store.js

@@ -66,6 +66,7 @@ const ExtensionsStore = (() => {
 
     /** Fetch the catalog from the server for the current query + sort. */
     async load() {
+      if (_filterInstalled) return;
       _loading = true;
       _error   = null;
       _emit("extensions:loading");
@@ -79,12 +80,8 @@ const ExtensionsStore = (() => {
         _allExtensions = data.extensions || [];
         _error      = data.warning || null;
         _loading    = false;
-        if (_filterInstalled) {
-          await Extensions.setFilterInstalled(true);
-        } else {
-          _extensions = _allExtensions;
-          _emit("extensions:changed", { extensions: _extensions, warning: _error });
-        }
+        _extensions = _allExtensions;
+        _emit("extensions:changed", { extensions: _extensions, warning: _error });
       } catch (e) {
         console.error("[Extensions] load failed", e);
         _extensions = [];
@@ -99,6 +96,7 @@ const ExtensionsStore = (() => {
     /** Set the search text and reload. */
     setQuery(query) {
       _query = (query || "").trim();
+      if (_filterInstalled) return Extensions.setFilterInstalled(true);
       return Extensions.load();
     },
 
@@ -117,7 +115,11 @@ const ExtensionsStore = (() => {
         try {
           const res  = await fetch("/api/store/extensions/installed");
           const data = await res.json();
-          _extensions = data.extensions || [];
+          const all  = data.extensions || [];
+          _extensions = _query
+            ? all.filter(e => [e.name, e.name_zh, e.description].some(
+                f => f && f.toLowerCase().includes(_query.toLowerCase())))
+            : all;
         } catch (e) {
           console.error("[Extensions] load installed failed", e);
           _extensions = [];
@@ -210,6 +212,11 @@ const ExtensionsStore = (() => {
       }
     },
 
+    /** Update an installed extension to the latest marketplace version. */
+    async update(id) {
+      return Extensions.install(id);
+    },
+
     /** Remove an installed extension, then return to the list. */
     async uninstall(id) {
       if (!id) return;