@codewithdan/zingit 0.17.1 → 0.17.2

package/CHANGELOG.md

@@ -2,6 +2,8 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.17.2](https://github.com/danwahlin/zingit/compare/v0.17.1...v0.17.2) (2026-01-29)
+
 ### [0.17.1](https://github.com/danwahlin/zingit/compare/v0.16.1...v0.17.1) (2026-01-29)
 
 ### [0.16.1](https://github.com/danwahlin/zingit/compare/v0.16.0...v0.16.1) (2026-01-29)

package/README.md

@@ -1,16 +1,43 @@
+<div align="center">
+  <img src="client/images/zingit-readme.png" alt="ZingIt" width="200">
+
+
 # ZingIt
+</div>
+
+#### Point-and-click UI feedback that gets automatically implemented by AI
 
-Streamline how you share UI changes with your AI assistant. Select elements, mark them, and send directly to AI agents for automated fixes.
+Tired of describing what element to change in the UI, taking screenshots, and copying/pasting them into your AI assitant? Streamline how you share UI changes! Select elements, mark them with the changes you want to make, and send directly to AI agents for automated fixes.
+
+**Point → Click → Describe → ZingIt to AI**
 
 **[Try the Live Demo →](https://danwahlin.github.io/zingit)**
 
 ## Features
 
-- **Visual Markers** - Click any element to describe changes you want
-- **Multi-Agent Support** - Works with Claude Code, GitHub Copilot CLI, and OpenAI Codex
+### Visual Markers
+Click any element on your page to add notes about changes you want. Smart CSS selectors are automatically generated to target the exact element.
+
+<img src="client/images/select-it.png" alt="Visual Markers" width="600">
+
+### Screenshot Capture
+Automatically captures screenshots of marked elements to provide visual context to AI agents. No more manual screenshot taking!
+
+<img src="client/images/screen-shots.png" alt="Screenshot Capture" width="600">
+
+### Multi-Agent Support
+Works with Claude Code, GitHub Copilot CLI, and OpenAI Codex. Choose your preferred AI assistant and watch it work in real-time.
+
+<img src="client/images/multi-agents.png" alt="Multi-Agent Support" width="600">
+
+### Send Changes with a Click
+Once you've marked your changes, simply click the sparkle icon (✨) in the ZingIt toolbar to send everything to your AI agent. Watch as it generates code updates live!
+
+<img src="client/images/toolbar.png" alt="Multi-Agent Support">
+
+### Additional Features
 - **Real-time Streaming** - Watch the AI work in real-time
 - **Smart Selectors** - Auto-generates CSS selectors for precise targeting
-- **Screenshot Capture** - Automatically capture annotated elements to provide visual context to agents
 - **Change History** - Track all modifications made by your AI assistant
 - **Remote/Local Detection** - Warns when editing published sites vs local development
 

package/client/dist/zingit-client.js

@@ -3049,15 +3049,15 @@
     }
   `,hc([gA()],gc.prototype,"markers",2),hc([gA()],gc.prototype,"settings",2),hc([gA()],gc.prototype,"wsConnected",2),hc([gA()],gc.prototype,"wsMaxAttemptsReached",2),hc([gA()],gc.prototype,"processing",2),hc([gA()],gc.prototype,"agentName",2),hc([gA()],gc.prototype,"agentModel",2),hc([gA()],gc.prototype,"serverProjectDir",2),hc([gA()],gc.prototype,"markActive",2),hc([gA()],gc.prototype,"availableAgents",2),hc([gA()],gc.prototype,"agentPickerOpen",2),hc([gA()],gc.prototype,"agentPickerLoading",2),hc([gA()],gc.prototype,"agentPickerError",2),hc([gA()],gc.prototype,"isRemoteUrl",2),hc([gA()],gc.prototype,"currentPageUrl",2),hc([dA("zing-toast")],gc.prototype,"toast",2),hc([dA("zing-history-panel")],gc.prototype,"historyPanel",2),hc([dA("zing-markers")],gc.prototype,"markerBadges",2),hc([gA()],gc.prototype,"highlightVisible",2),hc([gA()],gc.prototype,"highlightRect",2),hc([gA()],gc.prototype,"highlightLabel",2),hc([gA()],gc.prototype,"modalOpen",2),hc([gA()],gc.prototype,"modalEditMode",2),hc([gA()],gc.prototype,"modalMarkId",2),hc([gA()],gc.prototype,"modalSelector",2),hc([gA()],gc.prototype,"modalIdentifier",2),hc([gA()],gc.prototype,"modalSelectedText",2),hc([gA()],gc.prototype,"modalNotes",2),hc([gA()],gc.prototype,"pendingElement",2),hc([gA()],gc.prototype,"modalCaptureScreenshot",2),hc([gA()],gc.prototype,"modalScreenshotPreview",2),hc([gA()],gc.prototype,"modalScreenshotLoading",2),hc([gA()],gc.prototype,"settingsOpen",2),hc([gA()],gc.prototype,"helpOpen",2),hc([gA()],gc.prototype,"isHidden",2),hc([gA()],gc.prototype,"responseOpen",2),hc([gA()],gc.prototype,"responseContent",2),hc([gA()],gc.prototype,"responseToolStatus",2),hc([gA()],gc.prototype,"responseError",2),hc([gA()],gc.prototype,"responseScreenshotCount",2),hc([gA()],gc.prototype,"historyOpen",2),hc([gA()],gc.prototype,"historyCheckpoints",2),hc([gA()],gc.prototype,"historyLoading",2),hc([gA()],gc.prototype,"undoBarVisible",2),hc([gA()],gc.prototype,"undoBarFilesModified",2),hc([gA()],gc.prototype,"toolbarPosition",2),hc([gA()],gc.prototype,"isDragging",2),gc=hc([cA("zing-ui")],gc);var dc=Object.defineProperty,uc=Object.getOwnPropertyDescriptor,pc=(A,e,t,s)=>{for(var r,n=s>1?void 0:s?uc(e,t):e,o=A.length-1;o>=0;o--)(r=A[o])&&(n=(s?r(e,t,n):r(n))||n);return s&&n&&dc(e,t,n),n};let wc=class extends iA{constructor(){super(...arguments),this.activePage=""}render(){return $`
       <nav class="site-nav">
-        <a href="/" class="brand">
+        <a href="index.html" class="brand">
           <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
             <polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2" fill="#fbbf24" stroke="none"/>
           </svg>
           ZingIt
         </a>
         <div class="nav-links">
-          <a href="/demo.html" class=${"demo"===this.activePage?"active":""}>Demo</a>
-          <a href="/about.html" class=${"about"===this.activePage?"active":""}>About</a>
+          <a href="demo.html" class=${"demo"===this.activePage?"active":""}>Demo</a>
+          <a href="about.html" class=${"about"===this.activePage?"active":""}>About</a>
         </div>
         <div class="nav-actions">
           <a href="https://github.com/danwahlin/zingit" target="_blank" title="GitHub">

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codewithdan/zingit",
-  "version": "0.17.1",
+  "version": "0.17.2",
   "description": "AI-powered UI marker tool - point, mark, and let AI fix it",
   "type": "module",
   "engines": {