@agent-native/pinpoint 0.1.12 → 0.1.14

package/README.md

@@ -2,6 +2,10 @@
 
 Visual feedback and annotation tool for web applications. Users select UI elements, add feedback, and send structured context to any AI agent.
 
+Pinpoint is a Toolkit capability module installed on demand. It lives in its
+own npm package so apps only take the visual feedback surfaces and agent
+integration they need.
+
 Works standalone, with [Builder.io](https://builder.io), or with any agent runtime that speaks the agent-native protocol (Builder.io, Claude Code, Codex, Gemini CLI, Cursor, etc.).
 
 ## AI Agent Setup Guide

package/dist/{chunk-HC724C43.js → chunk-P4AZ2AAL.js}

@@ -845,6 +845,7 @@ var PinMarkerManager = class {
         opacity: 0.6;
       `;
       const badge = document.createElement("div");
+      badge.className = "pp-marker-badge";
       badge.style.cssText = `
         position: absolute;
         top: ${BADGE_OFFSET}px;
@@ -868,29 +869,44 @@ var PinMarkerManager = class {
         pointer-events: auto;
         user-select: none;
         z-index: 1;
-        animation: pp-badge-appear 0.2s cubic-bezier(0.16, 1, 0.3, 1);
       `;
       if (!document.getElementById("pp-marker-keyframes")) {
         const style2 = document.createElement("style");
         style2.id = "pp-marker-keyframes";
         style2.textContent = `
+          .pp-marker-badge {
+            animation: pp-badge-appear 0.2s cubic-bezier(0.16, 1, 0.3, 1);
+          }
+
           @keyframes pp-badge-appear {
-            from { transform: scale(0); opacity: 0; }
+            from { transform: scale(0.95); opacity: 0; }
             to { transform: scale(1); opacity: 1; }
           }
+
+          @keyframes pp-badge-appear-reduced {
+            from { opacity: 0; }
+            to { opacity: 1; }
+          }
+
+          @media (prefers-reduced-motion: reduce) {
+            .pp-marker-badge {
+              animation: pp-badge-appear-reduced 0.1s ease-out;
+            }
+          }
         `;
         document.head.appendChild(style2);
       }
+      const prefersReducedMotion = window.matchMedia?.("(prefers-reduced-motion: reduce)").matches ?? false;
       badge.addEventListener("click", (e) => {
         e.stopPropagation();
         e.preventDefault();
         this.onClick?.(pin);
       });
       badge.addEventListener("mouseenter", () => {
-        badge.style.transform = "scale(1.15)";
+        if (!prefersReducedMotion) badge.style.transform = "scale(1.15)";
       });
       badge.addEventListener("mouseleave", () => {
-        badge.style.transform = "scale(1)";
+        if (!prefersReducedMotion) badge.style.transform = "scale(1)";
       });
       const checkbox = document.createElement("div");
       checkbox.style.cssText = `
@@ -4924,4 +4940,4 @@ export {
   mountPinpoint,
   unmountPinpoint
 };
-//# sourceMappingURL=chunk-HC724C43.js.map
+//# sourceMappingURL=chunk-P4AZ2AAL.js.map