sonance-brand-mcp 1.3.81 → 1.3.82

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -155,6 +155,35 @@ export function SonanceDevTools() {
155
155
  return () => observer.disconnect();
156
156
  }, []);
157
157
 
158
+ // Protect DevTools from host app event capture (e.g., modal focus traps)
159
+ // This uses capture phase to intercept events BEFORE host app listeners can grab them
160
+ useEffect(() => {
161
+ if (!mounted || !isOpen) return;
162
+
163
+ const protectDevToolsEvents = (e: Event) => {
164
+ // Check if the event target is inside the DevTools panel
165
+ const devToolsPanel = document.querySelector('[data-sonance-devtools="true"]');
166
+ if (devToolsPanel?.contains(e.target as Node)) {
167
+ // Stop the event from being captured by host app listeners
168
+ e.stopImmediatePropagation();
169
+ }
170
+ };
171
+
172
+ // Capture phase (third param = true) runs before bubble phase
173
+ // stopImmediatePropagation prevents other capture listeners from running
174
+ const events = ['pointerdown', 'mousedown', 'touchstart', 'click', 'focus', 'focusin'];
175
+
176
+ events.forEach(eventType => {
177
+ document.addEventListener(eventType, protectDevToolsEvents, true);
178
+ });
179
+
180
+ return () => {
181
+ events.forEach(eventType => {
182
+ document.removeEventListener(eventType, protectDevToolsEvents, true);
183
+ });
184
+ };
185
+ }, [mounted, isOpen]);
186
+
158
187
  // Component-specific style overrides (for scalable, project-agnostic styling)
159
188
  // Key: component type (e.g., "card", "button-primary", "card:variant123"), Value: style overrides
160
189
  const [componentOverrides, setComponentOverrides] = useState<Record<string, ComponentStyle>>({});
@@ -402,10 +402,17 @@ export function ChatInterface({
402
402
  type="text"
403
403
  value={input}
404
404
  onChange={(e) => setInput(e.target.value)}
405
+ onClick={(e) => {
406
+ e.stopPropagation();
407
+ inputRef.current?.focus();
408
+ }}
405
409
  onPointerDown={(e) => {
406
- // Force focus capture - prevents modal focus trapping from blocking input
407
410
  e.stopPropagation();
408
- setTimeout(() => inputRef.current?.focus(), 0);
411
+ inputRef.current?.focus();
412
+ }}
413
+ onMouseDown={(e) => {
414
+ e.stopPropagation();
415
+ inputRef.current?.focus();
409
416
  }}
410
417
  onKeyDown={(e) => {
411
418
  if (e.key === "Enter" && !e.shiftKey) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sonance-brand-mcp",
3
- "version": "1.3.81",
3
+ "version": "1.3.82",
4
4
  "description": "MCP Server for Sonance Brand Guidelines and Component Library - gives Claude instant access to brand colors, typography, and UI components.",
5
5
  "main": "dist/index.js",
6
6
  "type": "module",