react-reinspect 0.1.8 → 0.2.0

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.
Files changed (31) hide show
  1. package/README.md +34 -328
  2. package/dist/lib/constants.d.ts +2 -1
  3. package/dist/lib/constants.d.ts.map +1 -1
  4. package/dist/lib/core/state.d.ts +27 -2
  5. package/dist/lib/core/state.d.ts.map +1 -1
  6. package/dist/lib/index.cjs +1 -1
  7. package/dist/lib/index.d.ts +1 -1
  8. package/dist/lib/index.d.ts.map +1 -1
  9. package/dist/lib/index.js +707 -227
  10. package/dist/lib/internal/auto-wrap.cjs +1 -1
  11. package/dist/lib/internal/auto-wrap.js +1 -1
  12. package/dist/lib/propsInspector.d.ts +9 -2
  13. package/dist/lib/propsInspector.d.ts.map +1 -1
  14. package/dist/lib/react/focusTrap.d.ts +3 -0
  15. package/dist/lib/react/focusTrap.d.ts.map +1 -0
  16. package/dist/lib/react/overlay.d.ts +1 -2
  17. package/dist/lib/react/overlay.d.ts.map +1 -1
  18. package/dist/lib/react/provider.d.ts.map +1 -1
  19. package/dist/lib/react/wrap.d.ts.map +1 -1
  20. package/dist/lib/style.css +1 -1
  21. package/dist/lib/syntaxHighlight.d.ts +6 -0
  22. package/dist/lib/syntaxHighlight.d.ts.map +1 -0
  23. package/dist/lib/types.d.ts +48 -3
  24. package/dist/lib/types.d.ts.map +1 -1
  25. package/dist/lib/utils.d.ts +31 -2
  26. package/dist/lib/utils.d.ts.map +1 -1
  27. package/dist/lib/wrap-DQM25n-h.js +2471 -0
  28. package/dist/lib/wrap-TqMeJ7Q-.cjs +2 -0
  29. package/package.json +25 -2
  30. package/dist/lib/wrap-8xVFW-im.js +0 -996
  31. package/dist/lib/wrap-Bu931FVO.cjs +0 -1
package/dist/lib/index.cjs CHANGED
@@ -1 +1 @@
1
- "use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./wrap-Bu931FVO.cjs`);let t=require(`react`),n=require(`react/jsx-runtime`);var r=`.reinspect-shell{border-radius:14px;transition:outline-color .12s;position:relative}.reinspect-shell[data-reinspect-active=true]{outline:2px dashed var(--reinspect-color);outline-offset:2px}.reinspect-content{border-radius:inherit}.reinspect-name-badge{z-index:calc(var(--reinspect-z-base) + 5);letter-spacing:.04em;color:#0f172a;background:color-mix(in srgb, var(--reinspect-color) 25%, white);border:1px solid color-mix(in srgb, var(--reinspect-color) 45%, white);pointer-events:none;white-space:nowrap;border-radius:999px;padding:5px 8px;font-size:11px;line-height:1;position:absolute;top:-14px;left:10px}.reinspect-menu{z-index:2147483647;background:#fff;border:1px solid #cbd5e1;border-radius:12px;width:min(300px,100vw - 24px);max-height:min(420px,70vh);padding:12px;position:fixed;overflow:auto;box-shadow:0 20px 25px -5px #0f172a33,0 8px 10px -6px #0f172a33}.reinspect-menu-title{color:#0f172a;margin:0 0 10px;font-size:13px;font-weight:600}.reinspect-menu-component-setting{color:#1e293b;grid-template-columns:1fr auto;align-items:center;gap:8px;margin-bottom:8px;font-size:12px;display:grid}.reinspect-menu-component-setting input[type=checkbox]{width:15px;height:15px}.reinspect-setting-note{color:#64748b;margin:0 0 10px;font-size:11px}.reinspect-submenu{grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px;display:grid}.reinspect-submenu button{color:#1e293b;cursor:pointer;background:#f8fafc;border:1px solid #cbd5e1;border-radius:8px;padding:6px 8px;font-size:12px}.reinspect-submenu button[data-state=active]{background:#e0f2fe;border-color:#0284c7}.reinspect-menu-grid{gap:9px;display:grid}.reinspect-menu-filter{margin-bottom:10px;position:relative}.reinspect-menu-filter-icon{color:#64748b;pointer-events:none;width:14px;height:14px;position:absolute;top:50%;left:9px;transform:translateY(-50%)}.reinspect-menu-filter-icon svg{width:100%;height:100%;display:block}.reinspect-menu-filter input{border:1px solid #cbd5e1;border-radius:8px;width:100%;padding:5px 7px 5px 30px;font-size:12px}.reinspect-menu-empty-state{color:#64748b;margin:8px 0 0;font-size:12px}.reinspect-field{gap:4px;display:grid}.reinspect-field label{color:#334155;font-size:12px}.reinspect-inline-controls{grid-template-columns:1fr auto;gap:6px;display:grid}.reinspect-inline-controls input,.reinspect-inline-controls button,.reinspect-inline-controls output{font-size:12px}.reinspect-inline-controls input[type=number],.reinspect-inline-controls input[type=text]{border:1px solid #cbd5e1;border-radius:8px;width:100%;padding:5px 7px}.reinspect-inline-controls button{color:#1e293b;cursor:pointer;background:#f8fafc;border:1px solid #cbd5e1;border-radius:8px;padding:5px 7px}.reinspect-inline-controls button:disabled{opacity:.45;cursor:default}.reinspect-opacity-controls{grid-template-columns:1fr auto auto;align-items:center}.reinspect-opacity-controls output{color:#475569;text-align:right;min-width:36px}.reinspect-props-panel{gap:8px;display:grid}.reinspect-props-submenu{grid-template-columns:1fr 1fr;gap:6px;display:grid}.reinspect-props-submenu button{color:#1e293b;cursor:pointer;background:#f8fafc;border:1px solid #cbd5e1;border-radius:8px;padding:6px 8px;font-size:12px}.reinspect-props-submenu button[data-state=active]{background:#e0f2fe;border-color:#0284c7}.reinspect-props-panel label{color:#334155;font-size:12px}.reinspect-props-table{gap:6px;display:grid}.reinspect-props-header{color:#475569;text-transform:uppercase;letter-spacing:.04em;grid-template-columns:.85fr 1.15fr;gap:8px;font-size:11px;display:grid}.reinspect-props-row{border:1px solid #e2e8f0;border-radius:8px;grid-template-columns:.85fr 1.15fr;align-items:start;gap:8px;padding:6px;display:grid}.reinspect-prop-key{color:#0f172a;word-break:break-word;font-size:12px}.reinspect-prop-cell{min-width:0}.reinspect-prop-cell code{color:#0f172a;word-break:break-word;font-size:11px}.reinspect-prop-missing{color:#94a3b8;font-size:11px}.reinspect-prop-scalar{gap:4px;display:grid}.reinspect-prop-actions{flex-wrap:wrap;gap:6px;margin-top:6px;display:flex}.reinspect-prop-scalar button,.reinspect-prop-function button,.reinspect-prop-tree summary button{color:#1e293b;cursor:pointer;background:#f8fafc;border:1px solid #cbd5e1;border-radius:7px;justify-self:start;padding:3px 6px;font-size:11px}.reinspect-prop-actions button,.reinspect-prop-json-preview button{color:#1e293b;cursor:pointer;background:#f8fafc;border:1px solid #cbd5e1;border-radius:7px;padding:3px 6px;font-size:11px}.reinspect-prop-tree{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:5px}.reinspect-prop-tree summary{cursor:pointer;color:#1e293b;justify-content:space-between;align-items:center;gap:8px;font-size:11px;display:flex}.reinspect-prop-tree-children{gap:6px;margin-top:6px;display:grid}.reinspect-prop-tree-row{grid-template-columns:.8fr 1.2fr;align-items:start;gap:6px;display:grid}.reinspect-prop-tree-row>code{color:#334155;word-break:break-word;font-size:10px}.reinspect-prop-function{gap:4px;display:grid}.reinspect-prop-function pre{white-space:pre-wrap;word-break:break-word;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;margin:0;padding:6px;font-size:11px;line-height:1.3}.reinspect-prop-json-preview{gap:6px;margin-top:6px;display:grid}.reinspect-prop-json-preview pre{white-space:pre-wrap;word-break:break-word;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;max-height:180px;margin:0;padding:6px;font-size:11px;line-height:1.3;overflow:auto}.reinspect-modal-backdrop{z-index:2147483647;background:#0f172a73;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.reinspect-modal{background:#fff;border:1px solid #cbd5e1;border-radius:12px;gap:8px;width:min(560px,100%);padding:12px;display:grid;box-shadow:0 24px 28px -12px #0f172a40,0 10px 16px -10px #0f172a38}.reinspect-modal textarea,.reinspect-props-panel textarea{resize:vertical;border:1px solid #cbd5e1;border-radius:8px;width:100%;padding:8px;font-family:IBM Plex Mono,SFMono-Regular,monospace;font-size:12px}.reinspect-error{color:#b91c1c;margin:0;font-size:12px}.reinspect-floating-toggle{z-index:2147483647;color:#f8fafc;letter-spacing:.03em;cursor:pointer;background:linear-gradient(120deg,#0f172a,#334155);border:none;border-radius:999px;padding:10px 15px;font-size:13px;font-weight:600;position:fixed;bottom:18px;right:18px;box-shadow:0 10px 18px #0f172a47}.reinspect-floating-root{z-index:2147483645;position:fixed;bottom:18px;right:18px}.reinspect-floating-root .reinspect-floating-toggle{position:static}.reinspect-settings-menu{background:#fff;border:1px solid #cbd5e1;border-radius:12px;gap:10px;width:min(360px,100vw - 24px);max-height:min(540px,75vh);padding:12px;display:grid;position:absolute;bottom:calc(100% + 10px);right:0;overflow:auto;box-shadow:0 24px 28px -12px #0f172a40,0 10px 16px -10px #0f172a38}.reinspect-settings-title{color:#0f172a;margin:0;font-size:13px;font-weight:700}.reinspect-settings-toggle-row{color:#1e293b;grid-template-columns:1fr auto;align-items:center;gap:8px;font-size:12px;display:grid}.reinspect-settings-select-row{gap:6px;font-size:12px;display:grid}.reinspect-settings-select-row select{color:#0f172a;background:#fff;border:1px solid #cbd5e1;border-radius:8px;width:100%;padding:6px 8px;font-size:12px}.reinspect-settings-toggle-label{line-height:1.35}.reinspect-settings-toggle-row input[type=checkbox]{width:16px;height:16px}.reinspect-settings-divider{background:#e2e8f0;height:1px}.reinspect-setting-block{gap:8px;display:grid}.reinspect-apply-button{color:#f8fafc;cursor:pointer;background:#0f172a;border:1px solid #0f172a;border-radius:8px;padding:6px 8px;font-size:12px;font-weight:600}.reinspect-apply-button:disabled{opacity:.4;cursor:default}.reinspect-setting-header{grid-template-columns:1fr auto;align-items:start;gap:8px;display:grid}.reinspect-setting-name{color:#0f172a;letter-spacing:.02em;margin:0;font-size:12px;font-weight:700}.reinspect-setting-short-description{color:#475569;margin:3px 0 0;font-size:12px;line-height:1.35}.reinspect-tooltip-host{display:inline-flex;position:relative}.reinspect-tooltip-trigger{color:#334155;cursor:help;background:#f8fafc;border:1px solid #cbd5e1;border-radius:999px;justify-content:center;align-items:center;width:20px;height:20px;padding:0;font-size:12px;font-weight:700;display:inline-flex}.reinspect-tooltip-content{color:#f8fafc;opacity:0;pointer-events:none;background:#0f172a;border:1px solid #cbd5e1;border-radius:8px;width:240px;padding:8px;font-size:11px;line-height:1.4;transition:opacity .12s;position:absolute;top:calc(100% + 6px);right:0}.reinspect-tooltip-host:hover .reinspect-tooltip-content,.reinspect-tooltip-host:focus-within .reinspect-tooltip-content{opacity:1;pointer-events:auto}.reinspect-setting-subheading{color:#334155;margin:2px 0 0;font-size:12px;font-weight:600}.reinspect-setting-empty-state{color:#64748b;margin:0;font-size:12px}.reinspect-component-settings-list{gap:6px;display:grid}.reinspect-component-setting-row{color:#1e293b;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;grid-template-columns:1fr auto;align-items:center;gap:8px;padding:6px 8px;font-size:12px;display:grid}.reinspect-component-setting-row input[type=checkbox]{width:15px;height:15px}`,i=`reinspect-runtime-styles`;function a(){return typeof document>`u`?null:document}function o(e){if(!e)return;let t=a();if(!t||t.getElementById(i))return;let n=t.createElement(`style`);n.id=i,n.textContent=e,(t.head??t.documentElement).appendChild(n)}function s(e){let t={};for(let n of e)t[n]=!0;return t}function c(e){return{isActive:e.startActive,inspectMode:e.inspectMode,pendingInspectMode:e.inspectMode,renderCounterMode:e.renderCounters,renderCountComponents:s(e.countRendersForComponents),overrides:{}}}function l(e,t){if(e===t)return!0;if(e.length!==t.length)return!1;for(let n=0;n<e.length;n+=1)if(e[n]!==t[n])return!1;return!0}function u(e,t){switch(t.type){case`hydrate-config`:{let n=s(t.config.countRendersForComponents),r={...e,isActive:t.config.enabled?e.isActive:!1,inspectMode:t.config.inspectMode,pendingInspectMode:t.config.inspectMode,renderCounterMode:t.config.renderCounters,renderCountComponents:n};return r.isActive===e.isActive&&r.inspectMode===e.inspectMode&&r.pendingInspectMode===e.pendingInspectMode&&r.renderCounterMode===e.renderCounterMode&&l(Object.keys(r.renderCountComponents),Object.keys(e.renderCountComponents))?e:r}case`set-is-active`:return e.isActive===t.value?e:{...e,isActive:t.value};case`set-pending-inspect-mode`:return e.pendingInspectMode===t.value?e:{...e,pendingInspectMode:t.value};case`set-render-counter-mode`:return e.renderCounterMode===t.value?e:{...e,renderCounterMode:t.value};case`set-render-counting-for-component`:{if(t.enabled)return e.renderCountComponents[t.componentName]?e:{...e,renderCountComponents:{...e.renderCountComponents,[t.componentName]:!0}};if(!e.renderCountComponents[t.componentName])return e;let n={...e.renderCountComponents};return delete n[t.componentName],{...e,renderCountComponents:n}}case`update-override`:{let n={...e.overrides[t.componentId]??{}};if(t.value===void 0||t.value===null||t.value===``?delete n[t.prop]:n[t.prop]=t.value,Object.keys(n).length===0){if(!e.overrides[t.componentId])return e;let n={...e.overrides};return delete n[t.componentId],{...e,overrides:n}}return{...e,overrides:{...e.overrides,[t.componentId]:n}}}default:return e}}function d(){let n=(0,t.useContext)(e.l);if(!n)throw Error(`useReinspect must be used within ReinspectProvider`);return n}var f=`Controls render counting for wrapped components.`,p=`Off disables global counting. Attempts, commits, and both capture rerenders after initial mount.`,m=`Controls which components are automatically discoverable by Reinspect.`,h=`Only wrapped components uses explicit withReinspect wrappers only. All 1st-party components auto-discovers components under your source tree. All components also attempts dependency components (with safety skips).`;function g({children:r,config:i}){let a=(0,t.useMemo)(()=>e.c(i),[i]),[o,s]=(0,t.useReducer)(u,a,c);(0,t.useEffect)(()=>{s({type:`hydrate-config`,config:a})},[a]);let l=(0,t.useCallback)(e=>{s({type:`set-is-active`,value:typeof e==`function`?e(o.isActive):e})},[o.isActive]),d=(0,t.useCallback)(e=>{s({type:`set-pending-inspect-mode`,value:typeof e==`function`?e(o.pendingInspectMode):e})},[o.pendingInspectMode]),f=(0,t.useCallback)(e=>{s({type:`set-render-counter-mode`,value:typeof e==`function`?e(o.renderCounterMode):e})},[o.renderCounterMode]),p=(0,t.useCallback)((e,t,n)=>{s({type:`update-override`,componentId:e,prop:t,value:n})},[]),m=(0,t.useCallback)((e,t)=>{s({type:`set-render-counting-for-component`,componentName:e,enabled:t})},[]),h=(0,t.useCallback)(e=>o.renderCounterMode!==`off`||!!o.renderCountComponents[e],[o.renderCounterMode,o.renderCountComponents]),g=o.pendingInspectMode!==o.inspectMode,v=(0,t.useCallback)(()=>{g&&(e.a(o.pendingInspectMode),e.s())},[g,o.pendingInspectMode]),y=(0,t.useCallback)(t=>e.o(t,a.palette),[a.palette]),b=(0,t.useMemo)(()=>({config:a,isActive:a.enabled&&o.isActive,setIsActive:l,inspectMode:o.inspectMode,pendingInspectMode:o.pendingInspectMode,setPendingInspectMode:d,hasPendingInspectModeChange:g,applyInspectMode:v,renderCounterMode:o.renderCounterMode,setRenderCounterMode:f,renderCountComponents:o.renderCountComponents,setRenderCountingForComponent:m,isRenderCountingEnabledFor:h,overrides:o.overrides,updateOverride:p,getBorderColor:y}),[a,o.isActive,l,o.inspectMode,o.pendingInspectMode,d,g,v,o.renderCounterMode,f,o.renderCountComponents,m,h,o.overrides,p,y]);return(0,n.jsxs)(e.l.Provider,{value:b,children:[r,a.enabled&&a.showFloatingToggle?(0,n.jsx)(_,{}):null]})}function _(){let{config:r,isActive:i,setIsActive:a,inspectMode:o,pendingInspectMode:s,setPendingInspectMode:c,hasPendingInspectModeChange:l,applyInspectMode:u,renderCounterMode:g,setRenderCounterMode:_}=d(),[v,y]=(0,t.useState)(!1),b=(0,t.useRef)(null);return(0,t.useEffect)(()=>{if(!v)return;let e=e=>{let t=e.target;t instanceof Node&&(b.current?.contains(t)||y(!1))},t=e=>{e.key===`Escape`&&y(!1)};return document.addEventListener(`mousedown`,e),document.addEventListener(`keydown`,t),()=>{document.removeEventListener(`mousedown`,e),document.removeEventListener(`keydown`,t)}},[v]),r.enabled?(0,n.jsxs)(`div`,{className:`reinspect-floating-root`,ref:b,children:[(0,n.jsx)(`button`,{type:`button`,className:`reinspect-floating-toggle`,"data-testid":`reinspect-floating-toggle`,onClick:()=>y(e=>!e),"aria-expanded":v,"aria-controls":`reinspect-settings-menu`,children:`Reinspect settings`}),v?(0,n.jsxs)(`div`,{id:`reinspect-settings-menu`,className:`reinspect-settings-menu`,role:`dialog`,"aria-label":`Reinspect settings`,"data-testid":`reinspect-settings-menu`,children:[(0,n.jsx)(`p`,{className:`reinspect-settings-title`,children:`Reinspect settings`}),(0,n.jsxs)(`label`,{className:`reinspect-settings-toggle-row`,children:[(0,n.jsx)(`span`,{className:`reinspect-settings-toggle-label`,children:`Inspector enabled`}),(0,n.jsx)(`input`,{"data-testid":`reinspect-setting-inspector-active`,type:`checkbox`,checked:i,onChange:e=>a(e.currentTarget.checked)})]}),(0,n.jsx)(`div`,{className:`reinspect-settings-divider`}),(0,n.jsxs)(`section`,{className:`reinspect-setting-block`,children:[(0,n.jsxs)(`header`,{className:`reinspect-setting-header`,children:[(0,n.jsxs)(`div`,{children:[(0,n.jsx)(`p`,{className:`reinspect-setting-name`,children:`INSPECT_MODE`}),(0,n.jsx)(`p`,{className:`reinspect-setting-short-description`,children:m})]}),(0,n.jsxs)(`span`,{className:`reinspect-tooltip-host`,children:[(0,n.jsx)(`button`,{type:`button`,className:`reinspect-tooltip-trigger`,"aria-label":`Explain INSPECT_MODE`,children:`?`}),(0,n.jsx)(`span`,{className:`reinspect-tooltip-content`,role:`tooltip`,children:h})]})]}),(0,n.jsxs)(`label`,{className:`reinspect-settings-select-row`,children:[(0,n.jsx)(`span`,{className:`reinspect-settings-toggle-label`,children:`Inspect Mode`}),(0,n.jsxs)(`select`,{"data-testid":`reinspect-setting-inspect-mode`,value:s,onChange:t=>{let n=t.currentTarget.value;e.r(n)&&c(n)},children:[(0,n.jsx)(`option`,{value:`wrapped`,children:`Only wrapped components`}),(0,n.jsx)(`option`,{value:`first-party`,children:`All 1st-party components`}),(0,n.jsx)(`option`,{value:`all`,children:`All components`})]})]}),(0,n.jsx)(`button`,{type:`button`,className:`reinspect-apply-button`,"data-testid":`reinspect-apply-inspect-mode`,onClick:u,disabled:!l,children:`Apply & Reload`}),l?(0,n.jsx)(`p`,{className:`reinspect-setting-note`,"data-testid":`reinspect-inspect-mode-reload-note`,children:`Inspect mode changes are applied after reload.`}):(0,n.jsxs)(`p`,{className:`reinspect-setting-note`,children:[`Current mode: `,o]})]}),(0,n.jsx)(`div`,{className:`reinspect-settings-divider`}),(0,n.jsxs)(`section`,{className:`reinspect-setting-block`,children:[(0,n.jsxs)(`header`,{className:`reinspect-setting-header`,children:[(0,n.jsxs)(`div`,{children:[(0,n.jsx)(`p`,{className:`reinspect-setting-name`,children:`RENDER_COUNTERS`}),(0,n.jsx)(`p`,{className:`reinspect-setting-short-description`,children:f})]}),(0,n.jsxs)(`span`,{className:`reinspect-tooltip-host`,children:[(0,n.jsx)(`button`,{type:`button`,className:`reinspect-tooltip-trigger`,"aria-label":`Explain RENDER_COUNTERS`,children:`?`}),(0,n.jsx)(`span`,{className:`reinspect-tooltip-content`,role:`tooltip`,children:p})]})]}),(0,n.jsxs)(`label`,{className:`reinspect-settings-select-row`,children:[(0,n.jsx)(`span`,{className:`reinspect-settings-toggle-label`,children:`Counter mode`}),(0,n.jsxs)(`select`,{"data-testid":`reinspect-setting-render-counters`,value:g,onChange:t=>{let n=t.currentTarget.value;e.i(n)&&_(n)},children:[(0,n.jsx)(`option`,{value:`off`,children:`Off`}),(0,n.jsx)(`option`,{value:`attempts`,children:`Render attempts`}),(0,n.jsx)(`option`,{value:`commits`,children:`Committed renders`}),(0,n.jsx)(`option`,{value:`both`,children:`Both`})]})]})]})]}):null]}):null}function v(t,n){let r={source:`manual`,scope:`first-party`};return n?.name&&(r.componentName=n.name),e.t(t,r)}o(r),exports.ReinspectProvider=g,exports.useReinspect=d,exports.withReinspect=v;
1
+ "use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./wrap-TqMeJ7Q-.cjs`);let t=require(`react`),n=require(`react/jsx-runtime`);var r=`:root{--reinspect-font-sans:"Geist Sans", "Geist", "Segoe UI", "SF Pro Text", system-ui, -apple-system, sans-serif;--reinspect-font-mono:"Geist Mono", "IBM Plex Mono", "SFMono-Regular", Menlo, Consolas, monospace;--reinspect-menu-bg:oklch(98.2% .014 252);--reinspect-menu-surface:oklch(96.5% .018 252);--reinspect-menu-surface-strong:oklch(93.6% .024 252);--reinspect-menu-surface-stronger:oklch(90.2% .03 252);--reinspect-menu-text:oklch(20.5% .028 252);--reinspect-menu-text-muted:oklch(36.5% .024 252);--reinspect-menu-text-soft:oklch(49% .02 252);--reinspect-menu-border:oklch(66% .024 252/.52);--reinspect-menu-border-strong:oklch(57% .03 252/.65);--reinspect-menu-border-subtle:oklch(73% .02 252/.5);--reinspect-brand-400:oklch(73% .145 254);--reinspect-brand-500:oklch(66% .165 254);--reinspect-brand-600:oklch(58% .165 254);--reinspect-brand-700:oklch(51% .153 254);--reinspect-brand-soft:color-mix(in oklch, var(--reinspect-brand-500) 18%, var(--reinspect-menu-surface));--reinspect-brand-soft-strong:color-mix(in oklch, var(--reinspect-brand-500) 28%, var(--reinspect-menu-surface));--reinspect-brand-soft-hover:color-mix(in oklch, var(--reinspect-brand-500) 36%, var(--reinspect-menu-surface));--reinspect-on-brand:oklch(98.5% .008 252);--reinspect-interactive-bg:var(--reinspect-menu-surface);--reinspect-interactive-bg-hover:var(--reinspect-menu-surface-strong);--reinspect-interactive-bg-active:var(--reinspect-brand-soft-hover);--reinspect-interactive-border:var(--reinspect-menu-border);--reinspect-interactive-border-hover:var(--reinspect-brand-400);--reinspect-interactive-border-active:var(--reinspect-brand-500);--reinspect-interactive-text:var(--reinspect-menu-text);--reinspect-interactive-text-active:var(--reinspect-brand-700);--reinspect-prism-bg:color-mix(in oklch, var(--reinspect-menu-surface-strong) 74%, white);--reinspect-prism-text:var(--reinspect-menu-text);--reinspect-prism-comment:var(--reinspect-menu-text-soft);--reinspect-prism-keyword:var(--reinspect-brand-700);--reinspect-prism-string:color-mix(in oklch, var(--reinspect-semantic-error) 70%, var(--reinspect-menu-text));--reinspect-prism-number:color-mix(in oklch, var(--reinspect-semantic-success) 76%, var(--reinspect-menu-text));--reinspect-prism-boolean:var(--reinspect-prism-keyword);--reinspect-prism-function:color-mix(in oklch, var(--reinspect-semantic-warning) 72%, var(--reinspect-menu-text));--reinspect-prism-property:color-mix(in oklch, var(--reinspect-brand-600) 74%, var(--reinspect-menu-text));--reinspect-prism-operator:var(--reinspect-menu-text);--reinspect-prism-punctuation:var(--reinspect-menu-text);--reinspect-prism-constant:color-mix(in oklch, var(--reinspect-brand-500) 78%, var(--reinspect-menu-text));--reinspect-semantic-error:oklch(62% .165 20);--reinspect-semantic-success:oklch(67% .115 158);--reinspect-semantic-warning:oklch(76% .12 78);--reinspect-focus-ring:color-mix(in oklch, var(--reinspect-brand-500) 70%, white);--reinspect-runtime-soft-mix:22%;--reinspect-runtime-border-mix:54%;--reinspect-runtime-strong-mix:78%;--reinspect-runtime-border-base:var(--reinspect-menu-border-strong);--reinspect-runtime-strong-base:var(--reinspect-menu-text);--reinspect-overlay-backdrop:oklch(24.5% .02 248/.44);--reinspect-shadow-popover:0 28px 44px -18px oklch(25.5% .02 248/.38), 0 10px 20px -12px oklch(25.5% .02 248/.3);--reinspect-shadow-modal:0 24px 28px -12px oklch(25.5% .02 248/.25), 0 10px 16px -10px oklch(25.5% .02 248/.22)}.reinspect-menu[data-reinspect-theme=dark],.reinspect-settings-menu[data-reinspect-theme=dark],.reinspect-modal-backdrop[data-reinspect-theme=dark],.reinspect-modal[data-reinspect-theme=dark],.reinspect-toast[data-reinspect-theme=dark],.reinspect-floating-root[data-reinspect-theme=dark],.reinspect-floating-toggle[data-reinspect-theme=dark]{--reinspect-menu-bg:oklch(19% .018 252);--reinspect-menu-surface:oklch(22.8% .022 252);--reinspect-menu-surface-strong:oklch(27.2% .025 252);--reinspect-menu-surface-stronger:oklch(32.2% .028 252);--reinspect-menu-text:oklch(96.5% .012 252);--reinspect-menu-text-muted:oklch(84% .018 252);--reinspect-menu-text-soft:oklch(73% .017 252);--reinspect-menu-border:oklch(54% .022 252/.55);--reinspect-menu-border-strong:oklch(63% .022 252/.72);--reinspect-menu-border-subtle:oklch(48% .018 252/.52);--reinspect-focus-ring:color-mix(in oklch, var(--reinspect-brand-400) 82%, black);--reinspect-runtime-soft-mix:28%;--reinspect-runtime-border-mix:48%;--reinspect-runtime-strong-mix:74%;--reinspect-runtime-border-base:var(--reinspect-menu-border);--reinspect-runtime-strong-base:var(--reinspect-menu-text);--reinspect-overlay-backdrop:oklch(14.5% .01 248/.58);--reinspect-shadow-popover:0 28px 44px -18px oklch(11% .01 248/.68), 0 10px 20px -12px oklch(11% .01 248/.58);--reinspect-shadow-modal:0 24px 28px -12px oklch(11% .01 248/.62), 0 10px 16px -10px oklch(11% .01 248/.54);--reinspect-interactive-bg:oklch(25.8% .023 252);--reinspect-interactive-bg-hover:oklch(31% .03 252);--reinspect-interactive-bg-active:color-mix(in oklch, var(--reinspect-brand-500) 42%, var(--reinspect-menu-surface-stronger));--reinspect-interactive-border:var(--reinspect-menu-border-strong);--reinspect-interactive-border-hover:var(--reinspect-brand-400);--reinspect-interactive-border-active:var(--reinspect-brand-400);--reinspect-interactive-text:var(--reinspect-menu-text);--reinspect-interactive-text-active:oklch(96.6% .014 252);--reinspect-prism-bg:color-mix(in oklch, var(--reinspect-menu-surface) 88%, black);--reinspect-prism-text:var(--reinspect-menu-text);--reinspect-prism-comment:color-mix(in oklch, var(--reinspect-menu-text-soft) 82%, white);--reinspect-prism-keyword:var(--reinspect-brand-400);--reinspect-prism-string:color-mix(in oklch, var(--reinspect-semantic-warning) 56%, var(--reinspect-menu-text));--reinspect-prism-number:color-mix(in oklch, var(--reinspect-semantic-success) 62%, var(--reinspect-menu-text));--reinspect-prism-boolean:var(--reinspect-prism-keyword);--reinspect-prism-function:color-mix(in oklch, var(--reinspect-semantic-warning) 64%, var(--reinspect-menu-text));--reinspect-prism-property:color-mix(in oklch, var(--reinspect-brand-400) 70%, var(--reinspect-menu-text));--reinspect-prism-operator:var(--reinspect-menu-text);--reinspect-prism-punctuation:var(--reinspect-menu-text);--reinspect-prism-constant:color-mix(in oklch, var(--reinspect-brand-400) 84%, var(--reinspect-menu-text))}.reinspect-shell,.reinspect-menu{--reinspect-runtime-color:var(--reinspect-color,var(--reinspect-brand-500));--reinspect-runtime-soft:color-mix(in oklch, var(--reinspect-runtime-color) var(--reinspect-runtime-soft-mix), var(--reinspect-menu-surface));--reinspect-runtime-border:color-mix(in oklch, var(--reinspect-runtime-color) var(--reinspect-runtime-border-mix), var(--reinspect-runtime-border-base));--reinspect-runtime-strong:color-mix(in oklch, var(--reinspect-runtime-color) var(--reinspect-runtime-strong-mix), var(--reinspect-runtime-strong-base))}.reinspect-menu,.reinspect-settings-menu,.reinspect-modal,.reinspect-floating-toggle{font-family:var(--reinspect-font-sans)}.reinspect-menu,.reinspect-settings-menu,.reinspect-modal{color:var(--reinspect-menu-text)}.reinspect-menu[data-reinspect-theme=light],.reinspect-settings-menu[data-reinspect-theme=light],.reinspect-modal-backdrop[data-reinspect-theme=light],.reinspect-modal[data-reinspect-theme=light],.reinspect-toast[data-reinspect-theme=light],.reinspect-floating-root[data-reinspect-theme=light],.reinspect-floating-toggle[data-reinspect-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}.reinspect-menu[data-reinspect-theme=dark],.reinspect-settings-menu[data-reinspect-theme=dark],.reinspect-modal-backdrop[data-reinspect-theme=dark],.reinspect-modal[data-reinspect-theme=dark],.reinspect-toast[data-reinspect-theme=dark],.reinspect-floating-root[data-reinspect-theme=dark],.reinspect-floating-toggle[data-reinspect-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}.reinspect-shell{will-change:box-shadow;border-radius:14px;transition:box-shadow .18s ease-out,filter .18s ease-out;position:relative}.reinspect-shell[data-reinspect-active=true]{box-shadow:0 0 0 1px color-mix(in oklch, var(--reinspect-runtime-color) 62%, var(--reinspect-menu-bg)), 0 0 0 4px color-mix(in oklch, var(--reinspect-runtime-color) 16%, transparent), 0 10px 18px -16px color-mix(in oklch, var(--reinspect-runtime-color) 48%, var(--reinspect-menu-text));filter:saturate(1.03)}.reinspect-shell[data-reinspect-active=true]:hover{box-shadow:0 0 0 1px color-mix(in oklch, var(--reinspect-runtime-color) 74%, var(--reinspect-menu-bg)), 0 0 0 5px color-mix(in oklch, var(--reinspect-runtime-color) 22%, transparent), 0 14px 24px -18px color-mix(in oklch, var(--reinspect-runtime-color) 52%, var(--reinspect-menu-text))}.reinspect-shell[data-reinspect-active=true]:focus-within{box-shadow:0 0 0 1px color-mix(in oklch, var(--reinspect-runtime-color) 78%, var(--reinspect-menu-bg)), 0 0 0 2px color-mix(in oklch, var(--reinspect-runtime-color) 34%, transparent), 0 0 0 6px color-mix(in oklch, var(--reinspect-runtime-color) 20%, transparent), 0 16px 28px -20px color-mix(in oklch, var(--reinspect-runtime-color) 52%, var(--reinspect-menu-text))}.reinspect-content{border-radius:inherit}.reinspect-name-badge{z-index:calc(var(--reinspect-z-base) + 5);font-family:var(--reinspect-font-mono);letter-spacing:.04em;color:var(--reinspect-runtime-strong);background:var(--reinspect-runtime-soft);border:1px solid var(--reinspect-runtime-border);opacity:.9;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);pointer-events:none;white-space:nowrap;border-radius:999px;padding:4px 8px;font-size:11px;line-height:1;position:absolute;top:-13px;left:10px;box-shadow:0 8px 16px -14px oklch(25.5% .02 248/.45)}.reinspect-menu{z-index:2147483647;border:1px solid var(--reinspect-menu-border);background:var(--reinspect-menu-bg);width:min(560px,100vw - 24px);max-height:min(620px,82vh);box-shadow:var(--reinspect-shadow-popover);overscroll-behavior:contain;border-radius:16px;gap:10px;padding:12px;display:grid;position:fixed;overflow:auto}.reinspect-menu-title{color:var(--reinspect-menu-text);font-family:var(--reinspect-font-mono);letter-spacing:-.014em;margin:0;font-size:19px;font-weight:760;line-height:1.1}.reinspect-menu-title-row{align-items:center;gap:8px;min-width:0;display:inline-flex}.reinspect-menu-title-color-chip{border:1px solid color-mix(in oklab, var(--reinspect-color) 65%, black 35%);background:var(--reinspect-color);border-radius:3px;flex:none;width:10px;height:10px}.reinspect-menu-title-wrap{gap:3px;min-width:0;display:grid}.reinspect-menu-subtitle{color:var(--reinspect-menu-text-soft);margin:0;font-size:12px;font-weight:560;line-height:1.2}.reinspect-menu-header{grid-template-columns:1fr auto;align-items:start;gap:10px;display:grid}.reinspect-menu-close{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-menu-surface);width:32px;height:32px;color:var(--reinspect-menu-text);cursor:pointer;border-radius:10px;place-items:center;padding:0;font-size:20px;line-height:1;display:grid}.reinspect-menu-close:hover{background:var(--reinspect-menu-surface-strong);border-color:var(--reinspect-menu-border-strong)}.reinspect-menu-close:focus-visible{outline:2px solid var(--reinspect-focus-ring);outline-offset:1px}.reinspect-setting-note{color:var(--reinspect-menu-text-muted);margin:0 0 10px;font-size:12px}.reinspect-setting-helper-text{color:var(--reinspect-menu-text-muted);margin:0;font-size:12px;line-height:1.4}.reinspect-submenu{border:1px solid var(--reinspect-menu-border-subtle);background:var(--reinspect-menu-surface);isolation:isolate;border-radius:11px;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:4px;display:grid;overflow:hidden}.reinspect-submenu button{border:1px solid var(--reinspect-interactive-border);background:var(--reinspect-interactive-bg);color:var(--reinspect-interactive-text);cursor:pointer;white-space:nowrap;opacity:1;border-radius:8px;padding:7px 8px;font-size:12px;font-weight:640;transition:opacity .14s ease-out,transform .14s ease-out,box-shadow .14s ease-out,border-color .14s ease-out,background-color .14s ease-out}.reinspect-submenu button:hover{border-color:var(--reinspect-interactive-border-hover);background:var(--reinspect-interactive-bg-hover)}.reinspect-submenu button[data-state=active]{border-color:var(--reinspect-interactive-border-active);background:var(--reinspect-interactive-bg-active);color:var(--reinspect-interactive-text-active);box-shadow:0 0 0 1px color-mix(in oklch, var(--reinspect-brand-500) 35%, transparent), 0 8px 14px -14px oklch(25.5% .02 248/.38);z-index:1;transform:translateY(-1px)}.reinspect-submenu button:focus-visible{outline:2px solid var(--reinspect-focus-ring);outline-offset:0}@media (prefers-reduced-motion:reduce){.reinspect-shell,.reinspect-submenu button,.reinspect-menu-action-card{transition:none}.reinspect-menu-action-card[data-state=active]:after{animation:none}}.reinspect-menu-shortcuts{gap:8px;margin-bottom:0;display:grid}.reinspect-menu-action-card{border:1px solid var(--reinspect-interactive-border);background:var(--reinspect-interactive-bg);color:var(--reinspect-interactive-text);text-align:left;cursor:pointer;border-radius:12px;gap:4px;padding:9px 10px;font-size:12px;transition:border-color .12s,box-shadow .12s,background-color .12s,transform .12s;display:grid;position:relative}.reinspect-menu-action-card:hover{border-color:var(--reinspect-interactive-border-hover);background:var(--reinspect-interactive-bg-hover);box-shadow:0 1px oklch(25.5% .02 248/.08)}.reinspect-menu-action-card:focus-visible{outline:2px solid var(--reinspect-focus-ring);outline-offset:1px}.reinspect-menu-action-card[data-state=active]{border-color:var(--reinspect-interactive-border-active);background:var(--reinspect-interactive-bg-active);color:var(--reinspect-interactive-text-active);box-shadow:0 0 0 1px color-mix(in oklch, var(--reinspect-brand-500) 40%, transparent), 0 8px 18px -14px oklch(25.5% .02 248/.35);transform:translateY(-1px)}.reinspect-menu-action-card[data-state=active]:after{content:"Selected";border:1px solid var(--reinspect-interactive-border-active);background:color-mix(in oklch, var(--reinspect-brand-500) 20%, var(--reinspect-menu-surface));color:var(--reinspect-interactive-text-active);letter-spacing:.01em;border-radius:999px;padding:2px 6px;font-size:9px;font-weight:700;line-height:1;animation:.56s cubic-bezier(.22,1,.36,1) reinspect-selected-pulse;position:absolute;top:8px;right:10px}@keyframes reinspect-selected-pulse{0%{opacity:.72;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.reinspect-menu-action-title{font-weight:700}.reinspect-menu-action-description{color:var(--reinspect-menu-text-muted);font-size:11px;line-height:1.35}.reinspect-menu-action-target{font-family:var(--reinspect-font-mono);color:var(--reinspect-menu-text-muted);white-space:normal;word-break:break-word;font-size:11px}.reinspect-general-panel{gap:10px;display:grid}.reinspect-general-panel .reinspect-setting-note{margin:0}.reinspect-menu-section{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-menu-bg);border-radius:12px;gap:7px;padding:10px;display:grid}.reinspect-menu-section-header,.reinspect-menu-panel-header{grid-template-columns:1fr auto;align-items:center;gap:8px;display:grid}.reinspect-menu-section-title{color:var(--reinspect-menu-text);letter-spacing:.01em;margin:0;font-size:13px;font-weight:700}.reinspect-menu-section-description{color:var(--reinspect-menu-text-muted);margin:0;font-size:12px;line-height:1.4}.reinspect-menu-section-caption{color:var(--reinspect-menu-text-muted);font-family:var(--reinspect-font-mono);margin:0;font-size:10px}.reinspect-menu-switch{justify-self:end}.reinspect-menu-switch:disabled{opacity:.7;cursor:default}.reinspect-menu-divider{background:var(--reinspect-menu-border);height:1px}.reinspect-menu-inline-setting{grid-template-columns:1fr auto;align-items:center;gap:8px;display:grid}.reinspect-menu-inline-copy{gap:2px;display:grid}.reinspect-menu-inline-title{color:var(--reinspect-menu-text);margin:0;font-size:12px;font-weight:700}.reinspect-menu-inline-description{color:var(--reinspect-menu-text-muted);margin:0;font-size:12px;line-height:1.35}.reinspect-css-panel{gap:9px;display:grid}.reinspect-menu-grid{gap:8px;display:grid}.reinspect-menu-filter{align-items:center;display:grid;position:relative}.reinspect-menu-filter-icon{color:var(--reinspect-menu-text-soft);pointer-events:none;width:14px;height:14px;position:absolute;top:50%;left:9px;transform:translateY(-50%)}.reinspect-menu-filter-icon svg{width:100%;height:100%;display:block}.reinspect-menu-filter input{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-menu-bg);width:100%;color:var(--reinspect-menu-text);border-radius:10px;padding:7px 52px 7px 30px;font-size:12px}.reinspect-menu-filter input::placeholder,.reinspect-filter-search-input::placeholder{color:var(--reinspect-menu-text-soft);opacity:1}.reinspect-menu-filter input:focus-visible{outline:2px solid var(--reinspect-focus-ring);outline-offset:0}.reinspect-menu-filter-clear{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-menu-surface);color:var(--reinspect-menu-text);cursor:pointer;border-radius:7px;padding:4px 6px;font-size:10px;font-weight:600;line-height:1;position:absolute;right:6px}.reinspect-menu-filter-clear:hover{border-color:var(--reinspect-brand-400);background:var(--reinspect-brand-soft)}.reinspect-menu-filter-clear:focus-visible{outline:2px solid var(--reinspect-focus-ring);outline-offset:1px}.reinspect-menu-empty-state{border:1px dashed var(--reinspect-menu-border);background:var(--reinspect-brand-soft);color:var(--reinspect-menu-text-muted);border-radius:10px;margin:0;padding:8px 10px;font-size:11px}.reinspect-field{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-menu-bg);border-radius:10px;gap:5px;padding:8px;display:grid}.reinspect-field label{color:var(--reinspect-menu-text);font-size:11px;font-weight:640}.reinspect-inline-controls{grid-template-columns:1fr auto;gap:6px;display:grid}.reinspect-inline-controls input,.reinspect-inline-controls button,.reinspect-inline-controls output{font-size:12px}.reinspect-inline-controls input[type=number],.reinspect-inline-controls input[type=text]{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-menu-bg);width:100%;color:var(--reinspect-menu-text);border-radius:8px;padding:6px 8px}.reinspect-inline-controls input[type=color]{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-menu-bg);border-radius:8px;width:100%;min-height:32px;padding:2px}.reinspect-inline-controls input[type=range]{width:100%}.reinspect-inline-controls input:focus-visible{outline:2px solid var(--reinspect-focus-ring);outline-offset:0}.reinspect-inline-controls button{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-menu-surface);color:var(--reinspect-menu-text);cursor:pointer;border-radius:8px;padding:6px 8px;font-weight:600}.reinspect-inline-controls button:hover{border-color:var(--reinspect-brand-400);background:var(--reinspect-brand-soft-strong)}.reinspect-inline-controls button:focus-visible{outline:2px solid var(--reinspect-focus-ring);outline-offset:1px}.reinspect-inline-controls button:disabled{opacity:.45;cursor:default}.reinspect-opacity-controls{grid-template-columns:1fr auto auto;align-items:center}.reinspect-opacity-controls output{color:var(--reinspect-menu-text);text-align:right;min-width:36px}.reinspect-props-panel{gap:6px;display:grid}.reinspect-props-submenu{border:1px solid var(--reinspect-menu-border-subtle);background:var(--reinspect-menu-surface);border-radius:10px;grid-template-columns:1fr 1fr;gap:4px;padding:3px;display:grid}.reinspect-props-submenu button{border:1px solid var(--reinspect-interactive-border);background:var(--reinspect-interactive-bg);color:var(--reinspect-interactive-text);cursor:pointer;opacity:1;border-radius:7px;padding:5px 8px;font-size:12px;font-weight:600;transition:opacity .12s ease-out,background-color .12s ease-out,border-color .12s ease-out}.reinspect-props-submenu button:hover{border-color:var(--reinspect-interactive-border-hover);background:var(--reinspect-interactive-bg-hover)}.reinspect-props-submenu button[data-state=active]{border-color:var(--reinspect-interactive-border-active);background:var(--reinspect-interactive-bg-active);color:var(--reinspect-interactive-text-active)}.reinspect-props-submenu button:focus-visible{outline:2px solid var(--reinspect-focus-ring);outline-offset:0}.reinspect-props-panel label{color:var(--reinspect-menu-text-muted);font-size:12px}.reinspect-props-table{border:1px solid var(--reinspect-menu-border-subtle);background:var(--reinspect-menu-bg);border-radius:10px;display:grid;overflow:hidden}.reinspect-props-row{grid-template-columns:minmax(90px,.55fr) minmax(0,1.45fr);align-items:start;gap:10px;padding:8px 9px;display:grid}.reinspect-props-row+.reinspect-props-row{border-top:1px solid var(--reinspect-menu-border-subtle)}.reinspect-prop-key{color:var(--reinspect-menu-text);word-break:break-word;font-size:12px;font-weight:600}.reinspect-prop-cell{gap:4px;min-width:0;display:grid}.reinspect-prop-main{grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:8px;display:grid}.reinspect-prop-value-render{min-width:0}.reinspect-prop-cell code{font-size:11px;font-family:var(--reinspect-font-mono);color:var(--reinspect-menu-text);word-break:normal;overflow-wrap:break-word}.reinspect-prop-missing{color:var(--reinspect-menu-text-soft);font-size:11px}.reinspect-prop-scalar{gap:3px;display:grid}.reinspect-prop-actions{flex-wrap:nowrap;justify-content:flex-end;align-items:center;gap:4px;margin-top:0;display:flex}.reinspect-prop-scalar button,.reinspect-prop-function button,.reinspect-prop-tree summary button{color:var(--reinspect-menu-text-muted);cursor:pointer;background:0 0;border:none;border-radius:6px;justify-self:start;padding:2px 4px;font-size:11px;font-weight:600}.reinspect-prop-action-text-button{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-brand-soft);color:var(--reinspect-brand-700);letter-spacing:.01em;cursor:pointer;white-space:nowrap;border-radius:6px;padding:2px 6px;font-size:10px;font-weight:700;line-height:1.4}.reinspect-prop-action-text-button:hover{border-color:var(--reinspect-brand-400);background:var(--reinspect-brand-soft-strong);color:var(--reinspect-brand-700)}.reinspect-prop-action-text-button:focus-visible{outline:2px solid var(--reinspect-focus-ring);outline-offset:1px}.reinspect-prop-actions button,.reinspect-prop-json-preview button{color:var(--reinspect-menu-text-muted);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:2px 4px;font-size:11px;font-weight:600}.reinspect-icon-button{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-brand-soft);width:24px;height:24px;color:var(--reinspect-brand-700);cursor:pointer;border-radius:6px;flex:none;justify-content:center;align-items:center;padding:0;display:inline-flex}.reinspect-icon-button svg{width:14px;height:14px;display:block}.reinspect-prop-scalar button:hover,.reinspect-prop-function button:hover,.reinspect-prop-tree summary button:hover,.reinspect-prop-actions button:hover,.reinspect-prop-json-preview button:hover{background:var(--reinspect-brand-soft);color:var(--reinspect-brand-700)}.reinspect-icon-button:hover{border-color:var(--reinspect-brand-400);background:var(--reinspect-brand-soft-strong)}.reinspect-prop-scalar button:focus-visible,.reinspect-prop-function button:focus-visible,.reinspect-prop-tree summary button:focus-visible,.reinspect-prop-actions button:focus-visible,.reinspect-prop-json-preview button:focus-visible{outline:2px solid var(--reinspect-focus-ring);outline-offset:1px}.reinspect-icon-button:disabled{opacity:.45;cursor:default}.reinspect-prop-tree{border:1px solid var(--reinspect-menu-border-subtle);background:var(--reinspect-brand-soft);border-radius:8px;padding:5px}.reinspect-prop-tree summary{cursor:pointer;color:var(--reinspect-menu-text);justify-content:space-between;align-items:center;gap:8px;font-size:11px;display:flex}.reinspect-prop-tree-children{gap:6px;margin-top:6px;display:grid}.reinspect-prop-tree-row{grid-template-columns:.8fr 1.2fr;align-items:start;gap:6px;display:grid}.reinspect-prop-tree-row>code{font-size:10px;font-family:var(--reinspect-font-mono);color:var(--reinspect-menu-text-muted);word-break:break-word}.reinspect-prop-function{gap:4px;display:grid}.reinspect-prop-function pre{border:1px solid var(--reinspect-menu-border-subtle);background:var(--reinspect-prism-bg);white-space:pre-wrap;word-break:break-word;border-radius:8px;margin:0;padding:6px;font-size:11px;line-height:1.3}.reinspect-prop-json-preview{gap:6px;margin-top:6px;display:grid}.reinspect-json-editor{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-prism-bg);border-radius:8px;display:grid;overflow:hidden}.reinspect-json-editor pre,.reinspect-json-editor textarea{font-size:12px;line-height:1.4;font-family:var(--reinspect-font-mono);white-space:pre;word-break:normal;grid-area:1/1;margin:0;padding:8px}.reinspect-json-editor pre{pointer-events:none;overflow:auto}.reinspect-props-panel .reinspect-json-editor .reinspect-json-editor-textarea{color:#0000;width:100%;caret-color:var(--reinspect-prism-text);resize:vertical;tab-size:2;background:0 0;border:none;border-radius:0;overflow:auto}.reinspect-props-panel .reinspect-json-editor .reinspect-json-editor-textarea:focus-visible{outline:none}.reinspect-json-editor:focus-within{box-shadow:0 0 0 2px var(--reinspect-focus-ring)}.reinspect-prop-json-preview pre{border:1px solid var(--reinspect-menu-border-subtle);background:var(--reinspect-prism-bg);white-space:pre-wrap;word-break:break-word;border-radius:8px;max-height:180px;margin:0;padding:6px;font-size:11px;line-height:1.3;overflow:auto}.reinspect-prop-function pre code.reinspect-code-block,.reinspect-prop-json-preview pre code.reinspect-code-block,.reinspect-json-editor pre code.reinspect-code-block{color:var(--reinspect-prism-text);font-family:var(--reinspect-font-mono);white-space:inherit;word-break:inherit;display:block}.reinspect-prop-function pre code.reinspect-code-block .token.comment,.reinspect-prop-function pre code.reinspect-code-block .token.prolog,.reinspect-prop-function pre code.reinspect-code-block .token.doctype,.reinspect-prop-function pre code.reinspect-code-block .token.cdata,.reinspect-prop-json-preview pre code.reinspect-code-block .token.comment,.reinspect-prop-json-preview pre code.reinspect-code-block .token.prolog,.reinspect-prop-json-preview pre code.reinspect-code-block .token.doctype,.reinspect-prop-json-preview pre code.reinspect-code-block .token.cdata,.reinspect-json-editor pre code.reinspect-code-block .token.comment,.reinspect-json-editor pre code.reinspect-code-block .token.prolog,.reinspect-json-editor pre code.reinspect-code-block .token.doctype,.reinspect-json-editor pre code.reinspect-code-block .token.cdata{color:var(--reinspect-prism-comment);font-style:italic}.reinspect-prop-function pre code.reinspect-code-block .token.punctuation,.reinspect-prop-json-preview pre code.reinspect-code-block .token.punctuation,.reinspect-json-editor pre code.reinspect-code-block .token.punctuation{color:var(--reinspect-prism-punctuation)}.reinspect-prop-function pre code.reinspect-code-block .token.property,.reinspect-prop-json-preview pre code.reinspect-code-block .token.property,.reinspect-json-editor pre code.reinspect-code-block .token.property{color:var(--reinspect-prism-property)}.reinspect-prop-function pre code.reinspect-code-block .token.string,.reinspect-prop-json-preview pre code.reinspect-code-block .token.string,.reinspect-prop-function pre code.reinspect-code-block .token.char,.reinspect-prop-json-preview pre code.reinspect-code-block .token.char,.reinspect-prop-function pre code.reinspect-code-block .token.regex,.reinspect-prop-json-preview pre code.reinspect-code-block .token.regex,.reinspect-json-editor pre code.reinspect-code-block .token.string,.reinspect-json-editor pre code.reinspect-code-block .token.char,.reinspect-json-editor pre code.reinspect-code-block .token.regex{color:var(--reinspect-prism-string)}.reinspect-prop-function pre code.reinspect-code-block .token.number,.reinspect-prop-json-preview pre code.reinspect-code-block .token.number,.reinspect-json-editor pre code.reinspect-code-block .token.number{color:var(--reinspect-prism-number)}.reinspect-prop-function pre code.reinspect-code-block .token.boolean,.reinspect-prop-json-preview pre code.reinspect-code-block .token.boolean,.reinspect-json-editor pre code.reinspect-code-block .token.boolean{color:var(--reinspect-prism-boolean)}.reinspect-prop-function pre code.reinspect-code-block .token.keyword,.reinspect-prop-json-preview pre code.reinspect-code-block .token.keyword,.reinspect-json-editor pre code.reinspect-code-block .token.keyword{color:var(--reinspect-prism-keyword)}.reinspect-prop-function pre code.reinspect-code-block .token.function,.reinspect-prop-json-preview pre code.reinspect-code-block .token.function,.reinspect-prop-function pre code.reinspect-code-block .token.function-variable,.reinspect-prop-json-preview pre code.reinspect-code-block .token.function-variable,.reinspect-json-editor pre code.reinspect-code-block .token.function,.reinspect-json-editor pre code.reinspect-code-block .token.function-variable{color:var(--reinspect-prism-function)}.reinspect-prop-function pre code.reinspect-code-block .token.operator,.reinspect-prop-json-preview pre code.reinspect-code-block .token.operator,.reinspect-json-editor pre code.reinspect-code-block .token.operator{color:var(--reinspect-prism-operator)}.reinspect-prop-function pre code.reinspect-code-block .token.constant,.reinspect-prop-json-preview pre code.reinspect-code-block .token.constant,.reinspect-json-editor pre code.reinspect-code-block .token.constant{color:var(--reinspect-prism-constant)}@media (width<=520px){.reinspect-props-row{grid-template-columns:1fr;gap:4px}.reinspect-prop-main{grid-template-columns:1fr;gap:6px}.reinspect-prop-actions{flex-wrap:wrap;justify-content:flex-start}}.reinspect-modal-backdrop{z-index:2147483647;background:var(--reinspect-overlay-backdrop);place-items:center;padding:20px;display:grid;position:fixed;inset:0}.reinspect-modal{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-menu-bg);width:min(560px,100%);box-shadow:var(--reinspect-shadow-modal);border-radius:12px;gap:8px;padding:12px;display:grid}.reinspect-modal textarea,.reinspect-props-panel textarea{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-menu-bg);width:100%;color:var(--reinspect-menu-text);font-size:12px;font-family:var(--reinspect-font-mono);resize:vertical;border-radius:8px;padding:8px}.reinspect-modal textarea::placeholder,.reinspect-props-panel textarea::placeholder{color:var(--reinspect-menu-text-soft);opacity:1}.reinspect-toast{z-index:2147483647;border:1px solid var(--reinspect-menu-border-strong);background:color-mix(in oklch, var(--reinspect-menu-bg) 88%, var(--reinspect-brand-500));width:min(460px,100vw - 20px);box-shadow:var(--reinspect-shadow-modal);border-radius:12px;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:10px 12px;display:grid;position:fixed;bottom:20px;left:50%;transform:translate(-50%)}.reinspect-toast-copy{gap:3px;display:grid}.reinspect-toast-title{color:var(--reinspect-menu-text);margin:0;font-size:12px;font-weight:700}.reinspect-toast-description{color:var(--reinspect-menu-text-muted);margin:0;font-size:11px}.reinspect-toast-undo,.reinspect-toast-dismiss{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-menu-bg);color:var(--reinspect-menu-text);cursor:pointer;border-radius:8px}.reinspect-toast-undo{padding:6px 10px;font-size:11px;font-weight:700}.reinspect-toast-dismiss{place-items:center;width:28px;height:28px;padding:0;font-size:16px;line-height:1;display:grid}.reinspect-toast-undo:hover,.reinspect-toast-dismiss:hover{border-color:var(--reinspect-brand-400);background:var(--reinspect-brand-soft)}.reinspect-toast-undo:focus-visible,.reinspect-toast-dismiss:focus-visible{outline:2px solid var(--reinspect-focus-ring);outline-offset:1px}.reinspect-error{color:var(--reinspect-semantic-error);margin:0;font-size:12px}.reinspect-floating-toggle{z-index:2147483647;border:1px solid color-mix(in oklch, var(--reinspect-brand-500) 56%, var(--reinspect-menu-border-strong));background:var(--reinspect-brand-soft);color:var(--reinspect-interactive-text-active);letter-spacing:.03em;cursor:pointer;border-radius:999px;padding:10px 15px;font-size:13px;font-weight:650;transition:background-color .14s,border-color .14s,box-shadow .14s;position:fixed;bottom:18px;right:18px;box-shadow:0 10px 18px -12px oklch(25.5% .02 248/.4),0 2px 8px -6px oklch(25.5% .02 248/.34)}.reinspect-floating-toggle:hover{background:var(--reinspect-brand-soft-hover);border-color:var(--reinspect-brand-500)}.reinspect-floating-toggle:focus-visible{outline:2px solid var(--reinspect-focus-ring);outline-offset:2px}.reinspect-floating-root{z-index:2147483645;position:fixed;bottom:18px;right:18px}.reinspect-floating-root .reinspect-floating-toggle{position:static}.reinspect-settings-menu{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-menu-bg);width:min(420px,100vw - 22px);max-height:min(560px,78vh);box-shadow:var(--reinspect-shadow-modal);border-radius:12px;gap:8px;padding:10px;display:grid;position:absolute;bottom:calc(100% + 10px);right:0;overflow:auto}.reinspect-settings-header-row{grid-template-columns:1fr auto;align-items:center;gap:8px;display:grid}.reinspect-settings-title{color:var(--reinspect-menu-text);margin:0;font-size:14px;font-weight:760}.reinspect-settings-tabs{grid-template-columns:1fr 1fr;gap:6px;display:grid}.reinspect-settings-tabs button{border:1px solid var(--reinspect-interactive-border);background:var(--reinspect-interactive-bg);color:var(--reinspect-interactive-text);cursor:pointer;border-radius:8px;padding:6px 8px;font-size:12px;font-weight:600;transition:border-color .12s ease-out,background-color .12s ease-out,color .12s ease-out}.reinspect-settings-tabs button:hover{border-color:var(--reinspect-interactive-border-hover);background:var(--reinspect-interactive-bg-hover)}.reinspect-settings-tabs button[data-state=active]{border-color:var(--reinspect-interactive-border-active);background:var(--reinspect-interactive-bg-active);color:var(--reinspect-interactive-text-active)}.reinspect-settings-tab-panel{gap:9px;display:grid}.reinspect-settings-toggle-row{color:var(--reinspect-menu-text);grid-template-columns:1fr auto;align-items:center;gap:8px;font-size:12px;display:grid}.reinspect-settings-select-row{gap:5px;font-size:12px;display:grid}.reinspect-settings-select-row select{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-menu-bg);width:100%;color:var(--reinspect-menu-text);border-radius:8px;padding:6px 8px;font-size:12px}.reinspect-settings-toggle-label{font-weight:600;line-height:1.35}.reinspect-settings-inline-switch{grid-template-columns:1fr auto;align-items:center;gap:8px;margin:0;display:grid}.reinspect-settings-toggle-row input[type=checkbox]{width:16px;height:16px}.reinspect-inline-hint{border:1px solid var(--reinspect-menu-border);width:14px;height:14px;color:var(--reinspect-menu-text-soft);vertical-align:text-top;cursor:help;border-radius:999px;justify-content:center;align-items:center;font-size:10px;font-weight:700;display:inline-flex}.reinspect-settings-divider{background:var(--reinspect-menu-border-subtle);height:1px}.reinspect-setting-block{gap:6px;display:grid}.reinspect-macro-setting{border:1px solid var(--reinspect-menu-border-subtle);background:var(--reinspect-menu-surface);border-radius:8px;padding:8px}.reinspect-macro-setting .reinspect-setting-note{margin:0}.reinspect-macro-setting .reinspect-setting-note code{font-family:var(--reinspect-font-mono);font-size:11px}.reinspect-macro-setting .reinspect-inline-controls{grid-template-columns:repeat(2,minmax(0,1fr))}.reinspect-macro-setting .reinspect-inline-controls button[data-state=active]{border-color:var(--reinspect-brand-600);background:var(--reinspect-brand-soft-strong);color:var(--reinspect-brand-700)}.reinspect-apply-button{border:1px solid var(--reinspect-brand-500);background:var(--reinspect-brand-500);color:var(--reinspect-on-brand);cursor:pointer;border-radius:8px;padding:6px 8px;font-size:12px;font-weight:600}.reinspect-apply-button:hover:not(:disabled){border-color:var(--reinspect-brand-600);background:var(--reinspect-brand-600)}.reinspect-apply-button:focus-visible{outline:2px solid var(--reinspect-focus-ring);outline-offset:1px}.reinspect-apply-button:disabled{opacity:.4;cursor:default}.reinspect-filter-title{color:var(--reinspect-menu-text);margin:0;font-size:12px;font-weight:600}.reinspect-setting-empty-state{color:var(--reinspect-menu-text-muted);margin:0;font-size:12px}.reinspect-inspect-mode-actions{grid-template-columns:auto 1fr;align-items:center;gap:8px;display:grid}.reinspect-filter-section{border-top:1px solid var(--reinspect-menu-border-subtle);gap:6px;padding-top:8px;display:grid}.reinspect-filter-row-header{grid-template-columns:1fr auto;align-items:center;gap:6px;display:grid}.reinspect-filter-toolbar{grid-template-columns:1fr auto auto auto auto;align-items:center;gap:6px;display:grid;position:relative}.reinspect-filter-search-icon{width:14px;height:14px;color:var(--reinspect-menu-text-soft);pointer-events:none;position:absolute;top:50%;left:10px;transform:translateY(-50%)}.reinspect-filter-search-icon svg{width:100%;height:100%;display:block}.reinspect-filter-search-input{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-menu-bg);width:100%;color:var(--reinspect-menu-text);font-size:12px;font-family:var(--reinspect-font-mono);border-radius:8px;padding:5px 8px 5px 31px}.reinspect-filter-search-input:focus-visible{outline:2px solid var(--reinspect-focus-ring);outline-offset:0}.reinspect-filter-add-button{border:1px solid var(--reinspect-brand-500);background:var(--reinspect-brand-500);color:var(--reinspect-on-brand);cursor:pointer;border-radius:8px;padding:5px 10px;font-size:11px}.reinspect-filter-add-button:hover:not(:disabled){border-color:var(--reinspect-brand-600);background:var(--reinspect-brand-600)}.reinspect-filter-add-button:focus-visible{outline:2px solid var(--reinspect-focus-ring);outline-offset:1px}.reinspect-filter-add-button:disabled{opacity:.4;cursor:default}.reinspect-filter-modifier{border:1px solid var(--reinspect-interactive-border);background:var(--reinspect-interactive-bg);color:var(--reinspect-interactive-text);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;gap:3px;padding:5px 7px;font-size:11px;font-weight:600;display:inline-flex}.reinspect-filter-modifier:hover{border-color:var(--reinspect-interactive-border-hover);background:var(--reinspect-interactive-bg-hover)}.reinspect-filter-modifier[data-state=active]{border-color:var(--reinspect-interactive-border-active);background:var(--reinspect-interactive-bg-active);color:var(--reinspect-interactive-text-active)}.reinspect-filter-chip-list{flex-wrap:wrap;gap:6px;display:flex}.reinspect-filter-chip{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-menu-bg);color:var(--reinspect-menu-text);border-radius:999px;align-items:center;gap:4px;padding:2px 7px;font-size:11px;display:inline-flex}.reinspect-filter-chip code{font-family:var(--reinspect-font-mono);font-size:11px}.reinspect-filter-chip-remove{color:var(--reinspect-menu-text-soft);cursor:pointer;background:0 0;border:none;padding:0;font-size:14px;line-height:1}.reinspect-filter-clear-button{border:1px solid var(--reinspect-menu-border);background:var(--reinspect-menu-bg);color:var(--reinspect-menu-text);cursor:pointer;border-radius:8px;padding:2px 7px;font-size:11px}.reinspect-filter-clear-button:disabled{opacity:.45;cursor:default}.reinspect-switch-button{border:1px solid var(--reinspect-menu-border-strong);background:var(--reinspect-menu-surface-stronger);cursor:pointer;border-radius:999px;width:34px;height:20px;padding:0;transition:background-color .12s,border-color .12s;display:inline-block;position:relative}.reinspect-switch-button:after{content:"";background:var(--reinspect-menu-bg);border-radius:999px;width:16px;height:16px;transition:transform .12s;position:absolute;top:2px;left:2px;box-shadow:0 1px 2px oklch(25.5% .02 248/.2)}.reinspect-switch-button[data-state=on]{background:var(--reinspect-brand-500);border-color:var(--reinspect-brand-600)}.reinspect-switch-button[data-state=on]:after{transform:translate(14px)}.reinspect-switch-button:focus-visible{outline:2px solid var(--reinspect-focus-ring);outline-offset:1px}.reinspect-component-settings-list{gap:6px;display:grid}.reinspect-component-setting-row{border:1px solid var(--reinspect-menu-border-subtle);background:var(--reinspect-menu-surface);color:var(--reinspect-menu-text);border-radius:8px;grid-template-columns:1fr auto;align-items:center;gap:8px;padding:6px 8px;font-size:12px;display:grid}.reinspect-component-setting-row input[type=checkbox]{width:15px;height:15px}`,i=`reinspect-runtime-styles`;function a(){return typeof document>`u`?null:document}function o(e){if(!e)return;let t=a();if(!t||t.getElementById(i))return;let n=t.createElement(`style`);n.id=i,n.textContent=e,(t.head??t.documentElement).appendChild(n)}function s(e){let t={};for(let n of e)t[n]=!0;return t}function c(e){return{isActive:e.startActive,inspectMode:e.inspectMode,pendingInspectMode:e.inspectMode,inspectWhitelist:e.inspectWhitelist,inspectBlacklist:e.inspectBlacklist,renderCounterMode:e.renderCounters,propsSerializationMode:e.propsSerializationMode,menuTheme:e.menuTheme,menuOpenGesture:e.menuOpenGesture,renderCountComponents:s(e.countRendersForComponents),overrides:{}}}function l(e,t){if(e===t)return!0;if(e.length!==t.length)return!1;for(let n=0;n<e.length;n+=1)if(e[n]!==t[n])return!1;return!0}function u(e,t){return e.regex===t.regex&&e.wholeWord===t.wholeWord&&e.matchCase===t.matchCase&&l(e.patterns,t.patterns)}function d(e,t){return e.mode===t.mode&&e.modifiers.ctrl===t.modifiers.ctrl&&e.modifiers.alt===t.modifiers.alt&&e.modifiers.shift===t.modifiers.shift&&e.modifiers.meta===t.modifiers.meta}function f(e,t){switch(t.type){case`hydrate-config`:{let n=s(t.config.countRendersForComponents),r={...e,isActive:t.config.enabled?e.isActive:!1,inspectMode:t.config.inspectMode,pendingInspectMode:t.config.inspectMode,inspectWhitelist:t.config.inspectWhitelist,inspectBlacklist:t.config.inspectBlacklist,renderCounterMode:t.config.renderCounters,propsSerializationMode:t.config.propsSerializationMode,menuTheme:t.config.menuTheme,menuOpenGesture:t.config.menuOpenGesture,renderCountComponents:n};return r.isActive===e.isActive&&r.inspectMode===e.inspectMode&&r.pendingInspectMode===e.pendingInspectMode&&u(r.inspectWhitelist,e.inspectWhitelist)&&u(r.inspectBlacklist,e.inspectBlacklist)&&r.renderCounterMode===e.renderCounterMode&&r.propsSerializationMode===e.propsSerializationMode&&r.menuTheme===e.menuTheme&&d(r.menuOpenGesture,e.menuOpenGesture)&&l(Object.keys(r.renderCountComponents),Object.keys(e.renderCountComponents))?e:r}case`set-is-active`:return e.isActive===t.value?e:{...e,isActive:t.value};case`set-pending-inspect-mode`:return e.pendingInspectMode===t.value&&e.inspectMode===t.value?e:{...e,inspectMode:t.value,pendingInspectMode:t.value};case`set-inspect-whitelist`:return u(e.inspectWhitelist,t.value)?e:{...e,inspectWhitelist:t.value};case`set-inspect-blacklist`:return u(e.inspectBlacklist,t.value)?e:{...e,inspectBlacklist:t.value};case`set-render-counter-mode`:return e.renderCounterMode===t.value?e:{...e,renderCounterMode:t.value};case`set-props-serialization-mode`:return e.propsSerializationMode===t.value?e:{...e,propsSerializationMode:t.value};case`set-menu-theme`:return e.menuTheme===t.value?e:{...e,menuTheme:t.value};case`set-menu-open-gesture`:return d(e.menuOpenGesture,t.value)?e:{...e,menuOpenGesture:t.value};case`set-render-counting-for-component`:{if(t.enabled)return e.renderCountComponents[t.componentName]?e:{...e,renderCountComponents:{...e.renderCountComponents,[t.componentName]:!0}};if(!e.renderCountComponents[t.componentName])return e;let n={...e.renderCountComponents};return delete n[t.componentName],{...e,renderCountComponents:n}}case`update-override`:{let n={...e.overrides[t.componentId]??{}};if(t.value===void 0||t.value===null||t.value===``?delete n[t.prop]:n[t.prop]=t.value,Object.keys(n).length===0){if(!e.overrides[t.componentId])return e;let n={...e.overrides};return delete n[t.componentId],{...e,overrides:n}}return{...e,overrides:{...e.overrides,[t.componentId]:n}}}default:return e}}function p(){let n=(0,t.useContext)(e.x);if(!n)throw Error(`useReinspect must be used within ReinspectProvider`);return n}var m=new Map;function h(e){let t=m.get(e);if(t!==void 0)return t;let n=0;for(let t=0;t<e.length;t+=1)n=Math.imul(31,n)+e.charCodeAt(t),n|=0;let r=n>>>0;return m.set(e,r),r}function g(e){let t=h(e);return`hsl(${t%360} ${60+(t>>>8)%14}% ${52+(t>>>16)%8}%)`}function _({label:e,description:t}){return(0,n.jsx)(`span`,{className:`reinspect-inline-hint`,title:t,"aria-label":t,children:e})}function v(e){return e.split(/[\r\n,]+/g).map(e=>e.trim()).filter(e=>e.length>0)}function y(e,t){let n=[...e],r=new Set(e);for(let e of t)r.has(e)||(r.add(e),n.push(e));return n}function b(e){let t=[];return e.ctrl&&t.push(`Ctrl`),e.alt&&t.push(`Alt`),e.shift&&t.push(`Shift`),e.meta&&t.push(`Meta`),t.join(` + `)}function x(e){return e.ctrl||e.alt||e.shift||e.meta}function S(e){return{ctrl:e.ctrlKey,alt:e.altKey,shift:e.shiftKey,meta:e.metaKey}}function C({title:e,info:r,filter:i,setFilter:a,invalidPatterns:o,patternsInputTestId:s,regexTestId:c,wholeWordTestId:l,matchCaseTestId:u,invalidMessageTestId:d}){let[f,p]=(0,t.useState)(``),m=(0,t.useRef)([]),h=(0,t.useCallback)(()=>{v(f).length!==0&&(m.current=[],p(``))},[f]),g=(0,t.useCallback)(e=>{a(t=>({...t,patterns:t.patterns.filter(t=>t!==e)}))},[a]),b=(0,t.useCallback)(()=>{a(e=>({...e,patterns:[]})),m.current=[],p(``)},[a]),x=e=>{e.key===`Enter`&&(e.preventDefault(),h())},S=e=>{let t=v(e);p(e),a(e=>{let n=e.patterns.filter(e=>!m.current.includes(e));return{...e,patterns:y(n,t)}}),m.current=t};return(0,n.jsxs)(`section`,{className:`reinspect-filter-section`,children:[(0,n.jsxs)(`div`,{className:`reinspect-filter-row-header`,children:[(0,n.jsxs)(`p`,{className:`reinspect-filter-title`,children:[e,` `,(0,n.jsx)(_,{label:`?`,description:r})]}),(0,n.jsx)(`button`,{type:`button`,className:`reinspect-filter-clear-button`,onClick:b,disabled:i.patterns.length===0,"data-testid":`${s}-clear`,children:`Clear`})]}),(0,n.jsxs)(`div`,{className:`reinspect-filter-toolbar`,children:[(0,n.jsx)(`span`,{className:`reinspect-filter-search-icon`,"aria-hidden":`true`,children:(0,n.jsx)(`svg`,{viewBox:`0 0 24 24`,focusable:`false`,children:(0,n.jsx)(`path`,{d:`M10.5 3a7.5 7.5 0 015.92 12.1l4.24 4.23a1 1 0 01-1.42 1.42l-4.23-4.24A7.5 7.5 0 1110.5 3zm0 2a5.5 5.5 0 100 11 5.5 5.5 0 000-11z`,fill:`currentColor`})})}),(0,n.jsx)(`input`,{"data-testid":s,className:`reinspect-filter-search-input`,type:`search`,"aria-label":`${e} patterns`,value:f,placeholder:`Add ${e.toLowerCase()} pattern`,onChange:e=>S(e.currentTarget.value),onKeyDown:x}),(0,n.jsx)(`button`,{type:`button`,className:`reinspect-filter-modifier`,"data-state":i.regex?`active`:`idle`,"data-testid":c,title:`Regex`,"aria-label":`${e} regex modifier`,onClick:()=>a(e=>({...e,regex:!e.regex})),children:`.*`}),(0,n.jsx)(`button`,{type:`button`,className:`reinspect-filter-modifier`,"data-state":i.wholeWord?`active`:`idle`,"data-testid":l,title:`Whole word`,"aria-label":`${e} whole-word modifier`,onClick:()=>a(e=>({...e,wholeWord:!e.wholeWord})),children:`W`}),(0,n.jsx)(`button`,{type:`button`,className:`reinspect-filter-modifier`,"data-state":i.matchCase?`active`:`idle`,"data-testid":u,title:`Match case`,"aria-label":`${e} case-sensitive modifier`,onClick:()=>a(e=>({...e,matchCase:!e.matchCase})),children:`Aa`}),(0,n.jsx)(`button`,{type:`button`,className:`reinspect-filter-add-button`,onClick:h,disabled:v(f).length===0,"data-testid":`${s}-add`,children:`Add`})]}),i.patterns.length>0?(0,n.jsx)(`div`,{className:`reinspect-filter-chip-list`,children:i.patterns.map(e=>(0,n.jsxs)(`span`,{className:`reinspect-filter-chip`,children:[(0,n.jsx)(`code`,{children:e}),(0,n.jsx)(`button`,{type:`button`,className:`reinspect-filter-chip-remove`,"aria-label":`Remove ${e}`,onClick:()=>g(e),children:`×`})]},e))}):(0,n.jsx)(`p`,{className:`reinspect-setting-empty-state`,children:`No patterns configured.`}),o.length>0?(0,n.jsxs)(`p`,{className:`reinspect-error`,"data-testid":d,children:[`Invalid regex patterns ignored: `,o.join(`, `)]}):null]})}function w({children:r,config:i}){let a=(0,t.useMemo)(()=>e.v(i),[i]),o=(0,t.useRef)({}),[s,l]=(0,t.useReducer)(f,a,c);(0,t.useEffect)(()=>{l({type:`hydrate-config`,config:a})},[a]);let u=(0,t.useCallback)(e=>{l({type:`set-is-active`,value:typeof e==`function`?e(s.isActive):e})},[s.isActive]),d=(0,t.useCallback)(t=>{let n=typeof t==`function`?t(s.pendingInspectMode):t;l({type:`set-pending-inspect-mode`,value:n}),e.p(n)},[s.pendingInspectMode]),p=(0,t.useCallback)(t=>{let n=e.d(typeof t==`function`?t(s.inspectWhitelist):t);l({type:`set-inspect-whitelist`,value:n}),e.m(n)},[s.inspectWhitelist]),m=(0,t.useCallback)(t=>{let n=e.d(typeof t==`function`?t(s.inspectBlacklist):t);l({type:`set-inspect-blacklist`,value:n}),e.f(n)},[s.inspectBlacklist]),h=(0,t.useCallback)(e=>{l({type:`set-render-counter-mode`,value:typeof e==`function`?e(s.renderCounterMode):e})},[s.renderCounterMode]),_=(0,t.useCallback)(t=>{let n=typeof t==`function`?t(s.propsSerializationMode):t;l({type:`set-props-serialization-mode`,value:n}),e._(n)},[s.propsSerializationMode]),v=(0,t.useCallback)(t=>{let n=typeof t==`function`?t(s.menuTheme):t;l({type:`set-menu-theme`,value:n}),e.g(n)},[s.menuTheme]),y=(0,t.useCallback)(t=>{let n=typeof t==`function`?t(s.menuOpenGesture):t;l({type:`set-menu-open-gesture`,value:n}),e.h(n)},[s.menuOpenGesture]),b=(0,t.useCallback)((e,t,n)=>{l({type:`update-override`,componentId:e,prop:t,value:n})},[]),x=(0,t.useCallback)((e,t)=>{l({type:`set-render-counting-for-component`,componentName:e,enabled:t})},[]),S=(0,t.useCallback)(e=>s.renderCounterMode!==`off`||!!s.renderCountComponents[e],[s.renderCounterMode,s.renderCountComponents]),C=s.pendingInspectMode!==s.inspectMode,w=(0,t.useCallback)(()=>{},[]),E=(0,t.useMemo)(()=>e.i(s.inspectWhitelist),[s.inspectWhitelist]),D=(0,t.useMemo)(()=>e.i(s.inspectBlacklist),[s.inspectBlacklist]),O=E.invalidPatterns,k=D.invalidPatterns,A=(0,t.useCallback)(t=>e.a(t,E,D),[E,D]),j=(0,t.useCallback)(e=>{let t=o.current[e];if(t)return t;let n=g(e);return o.current[e]=n,n},[]),M=(0,t.useMemo)(()=>({config:a,isActive:a.enabled&&s.isActive,setIsActive:u,inspectMode:s.inspectMode,pendingInspectMode:s.pendingInspectMode,setPendingInspectMode:d,hasPendingInspectModeChange:C,applyInspectMode:w,inspectWhitelist:s.inspectWhitelist,setInspectWhitelist:p,inspectWhitelistInvalidPatterns:O,inspectBlacklist:s.inspectBlacklist,setInspectBlacklist:m,inspectBlacklistInvalidPatterns:k,isComponentInspectableByFilters:A,renderCounterMode:s.renderCounterMode,setRenderCounterMode:h,propsSerializationMode:s.propsSerializationMode,setPropsSerializationMode:_,menuTheme:s.menuTheme,setMenuTheme:v,menuOpenGesture:s.menuOpenGesture,setMenuOpenGesture:y,renderCountComponents:s.renderCountComponents,setRenderCountingForComponent:x,isRenderCountingEnabledFor:S,overrides:s.overrides,updateOverride:b,getColor:j}),[a,s.isActive,u,s.inspectMode,s.pendingInspectMode,d,C,w,s.inspectWhitelist,p,O,s.inspectBlacklist,m,k,A,s.renderCounterMode,h,s.propsSerializationMode,_,s.menuTheme,v,s.menuOpenGesture,y,s.renderCountComponents,x,S,s.overrides,b,j]);return(0,n.jsxs)(e.x.Provider,{value:M,children:[r,a.enabled&&a.showFloatingToggle?(0,n.jsx)(T,{}):null]})}function T(){let{config:r,isActive:i,setIsActive:a,pendingInspectMode:o,setPendingInspectMode:s,inspectWhitelist:c,setInspectWhitelist:l,inspectWhitelistInvalidPatterns:u,inspectBlacklist:d,setInspectBlacklist:f,inspectBlacklistInvalidPatterns:m,renderCounterMode:h,setRenderCounterMode:g,propsSerializationMode:v,setPropsSerializationMode:y,menuTheme:w,setMenuTheme:T,menuOpenGesture:E,setMenuOpenGesture:D}=p(),[O,k]=(0,t.useState)(!1),[A,j]=(0,t.useState)(`filter`),[M,N]=(0,t.useState)(!1),P=(0,t.useRef)(null),F=(0,t.useRef)(null),I=(0,t.useRef)(null),L=(0,t.useRef)(!1);return(0,t.useEffect)(()=>{if(!O)return;let e=e=>{let t=e.target;t instanceof Node&&(F.current?.contains(t)||k(!1))},t=e=>{e.key===`Escape`&&k(!1)};return document.addEventListener(`mousedown`,e),document.addEventListener(`keydown`,t),()=>{document.removeEventListener(`mousedown`,e),document.removeEventListener(`keydown`,t)}},[O]),(0,t.useEffect)(()=>{if(!O||!I.current)return;let t=I.current;e.y(t);let n=n=>{e.b(n,t)};return document.addEventListener(`keydown`,n),()=>{document.removeEventListener(`keydown`,n)}},[O]),(0,t.useEffect)(()=>{L.current&&!O&&P.current?.focus(),L.current=O},[O]),(0,t.useEffect)(()=>{if(!M)return;let e=e=>{let t=S(e);x(t)&&(e.preventDefault(),e.stopPropagation(),D(e=>({...e,mode:`modifier-right-click`,modifiers:t})),N(!1))};return document.addEventListener(`keydown`,e,!0),()=>{document.removeEventListener(`keydown`,e,!0)}},[M,D]),r.enabled?(0,n.jsxs)(`div`,{className:`reinspect-floating-root`,ref:F,"data-reinspect-theme":w,children:[(0,n.jsx)(`button`,{type:`button`,ref:P,className:`reinspect-floating-toggle`,"data-reinspect-theme":w,"data-testid":`reinspect-floating-toggle`,onClick:()=>k(e=>!e),"aria-expanded":O,"aria-controls":`reinspect-settings-menu`,children:`Reinspect settings`}),O?(0,n.jsxs)(`div`,{id:`reinspect-settings-menu`,ref:I,className:`reinspect-settings-menu`,"data-reinspect-theme":w,role:`dialog`,"aria-modal":`true`,"aria-label":`Reinspect settings`,tabIndex:-1,"data-testid":`reinspect-settings-menu`,children:[(0,n.jsxs)(`div`,{className:`reinspect-settings-header-row`,children:[(0,n.jsx)(`p`,{className:`reinspect-settings-title`,children:`Reinspect settings`}),(0,n.jsxs)(`div`,{className:`reinspect-settings-inline-switch`,children:[(0,n.jsx)(`span`,{className:`reinspect-settings-toggle-label`,children:i?`Enabled`:`Disabled`}),(0,n.jsx)(`button`,{type:`button`,role:`switch`,"aria-checked":i,"aria-label":`Toggle inspector enabled`,"data-testid":`reinspect-setting-inspector-active`,className:`reinspect-switch-button`,"data-state":i?`on`:`off`,title:i?`Disable inspector`:`Enable inspector`,onClick:()=>a(!i)})]})]}),(0,n.jsxs)(`div`,{className:`reinspect-settings-tabs`,role:`tablist`,"aria-label":`Reinspect settings categories`,children:[(0,n.jsx)(`button`,{type:`button`,role:`tab`,id:`reinspect-settings-tab-filter`,"data-testid":`reinspect-settings-tab-filter`,"data-state":A===`filter`?`active`:`idle`,"aria-selected":A===`filter`,"aria-controls":`reinspect-settings-panel-filter`,onClick:()=>j(`filter`),children:`Filter`}),(0,n.jsx)(`button`,{type:`button`,role:`tab`,id:`reinspect-settings-tab-settings`,"data-testid":`reinspect-settings-tab-settings`,"data-state":A===`settings`?`active`:`idle`,"aria-selected":A===`settings`,"aria-controls":`reinspect-settings-panel-settings`,onClick:()=>j(`settings`),children:`Settings`})]}),(0,n.jsx)(`div`,{className:`reinspect-settings-divider`}),A===`filter`?(0,n.jsxs)(`div`,{className:`reinspect-settings-tab-panel`,role:`tabpanel`,id:`reinspect-settings-panel-filter`,"aria-labelledby":`reinspect-settings-tab-filter`,children:[(0,n.jsx)(C,{title:`Include`,info:`Only matching component names remain inspectable.`,filter:c,setFilter:l,invalidPatterns:u,patternsInputTestId:`reinspect-setting-inspect-whitelist-patterns`,regexTestId:`reinspect-setting-inspect-whitelist-regex`,wholeWordTestId:`reinspect-setting-inspect-whitelist-whole-word`,matchCaseTestId:`reinspect-setting-inspect-whitelist-match-case`,invalidMessageTestId:`reinspect-setting-inspect-whitelist-invalid`}),(0,n.jsx)(C,{title:`Exclude`,info:`Matching component names are hidden from inspection.`,filter:d,setFilter:f,invalidPatterns:m,patternsInputTestId:`reinspect-setting-inspect-blacklist-patterns`,regexTestId:`reinspect-setting-inspect-blacklist-regex`,wholeWordTestId:`reinspect-setting-inspect-blacklist-whole-word`,matchCaseTestId:`reinspect-setting-inspect-blacklist-match-case`,invalidMessageTestId:`reinspect-setting-inspect-blacklist-invalid`}),(0,n.jsx)(`p`,{className:`reinspect-setting-note`,children:`Exclude patterns override include patterns.`}),(0,n.jsx)(`section`,{className:`reinspect-setting-block`,children:(0,n.jsxs)(`label`,{className:`reinspect-settings-select-row`,children:[(0,n.jsxs)(`span`,{className:`reinspect-settings-toggle-label`,children:[`Component scope`,` `,(0,n.jsx)(_,{label:`?`,description:`Choose which component groups can be inspected.`})]}),(0,n.jsxs)(`select`,{"data-testid":`reinspect-setting-inspect-mode`,value:o,onChange:t=>{let n=t.currentTarget.value;e.o(n)&&s(n)},children:[(0,n.jsx)(`option`,{value:`wrapped`,children:`Only wrapped components`}),(0,n.jsx)(`option`,{value:`first-party`,children:`All 1st-party components`}),(0,n.jsx)(`option`,{value:`all`,children:`All components`})]})]})})]}):(0,n.jsx)(`div`,{className:`reinspect-settings-tab-panel`,role:`tabpanel`,id:`reinspect-settings-panel-settings`,"aria-labelledby":`reinspect-settings-tab-settings`,children:(0,n.jsxs)(`section`,{className:`reinspect-setting-block`,children:[(0,n.jsxs)(`label`,{className:`reinspect-settings-select-row`,children:[(0,n.jsxs)(`span`,{className:`reinspect-settings-toggle-label`,children:[`Render counter mode`,` `,(0,n.jsx)(_,{label:`?`,description:`Pick whether render attempts, commits, both, or no counters are shown.`})]}),(0,n.jsxs)(`select`,{"data-testid":`reinspect-setting-render-counters`,value:h,onChange:t=>{let n=t.currentTarget.value;e.u(n)&&g(n)},children:[(0,n.jsx)(`option`,{value:`off`,children:`Off`}),(0,n.jsx)(`option`,{value:`attempts`,children:`Render attempts`}),(0,n.jsx)(`option`,{value:`commits`,children:`Committed renders`}),(0,n.jsx)(`option`,{value:`both`,children:`Both`})]})]}),(0,n.jsx)(`p`,{className:`reinspect-setting-note`,children:`Per-component capture can be toggled from each component menu.`}),(0,n.jsxs)(`label`,{className:`reinspect-settings-select-row`,children:[(0,n.jsxs)(`span`,{className:`reinspect-settings-toggle-label`,children:[`Menu theme`,` `,(0,n.jsx)(_,{label:`?`,description:`Choose the Reinspect menu appearance.`})]}),(0,n.jsxs)(`select`,{"data-testid":`reinspect-setting-menu-theme`,value:w,onChange:t=>{let n=t.currentTarget.value;e.c(n)&&T(n)},children:[(0,n.jsx)(`option`,{value:`light`,children:`Light`}),(0,n.jsx)(`option`,{value:`dark`,children:`Dark`})]})]}),(0,n.jsxs)(`label`,{className:`reinspect-settings-select-row`,children:[(0,n.jsxs)(`span`,{className:`reinspect-settings-toggle-label`,children:[`Menu open trigger`,` `,(0,n.jsx)(_,{label:`?`,description:`Choose how to open the inspector menu on components.`})]}),(0,n.jsxs)(`select`,{"data-testid":`reinspect-setting-menu-open-trigger`,value:E.mode,onChange:t=>{let n=t.currentTarget.value;e.s(n)&&D(e=>({...e,mode:n}))},children:[(0,n.jsx)(`option`,{value:`right-click`,children:`Right click`}),(0,n.jsx)(`option`,{value:`modifier-right-click`,children:`Right click + modifier macro`})]})]}),E.mode===`modifier-right-click`?(0,n.jsxs)(`section`,{className:`reinspect-setting-block reinspect-macro-setting`,children:[(0,n.jsxs)(`p`,{className:`reinspect-setting-note`,"data-testid":`reinspect-setting-menu-open-modifier-label`,children:[`Current macro:`,` `,(0,n.jsx)(`code`,{children:b(E.modifiers)})]}),(0,n.jsxs)(`div`,{className:`reinspect-inline-controls`,children:[(0,n.jsx)(`button`,{type:`button`,"data-testid":`reinspect-setting-menu-open-modifier-record`,onClick:()=>{N(e=>!e)},"data-state":M?`active`:`idle`,children:M?`Press modifier keys...`:`Record macro`}),(0,n.jsx)(`button`,{type:`button`,"data-testid":`reinspect-setting-menu-open-modifier-reset`,onClick:()=>D(t=>({...t,modifiers:{...e.r}})),children:`Reset to Shift`})]}),(0,n.jsx)(`p`,{className:`reinspect-setting-helper-text`,children:`Hold one or more modifier keys (Ctrl, Alt, Shift, Meta), then press any key to save the macro.`})]}):null,(0,n.jsxs)(`label`,{className:`reinspect-settings-select-row`,children:[(0,n.jsxs)(`span`,{className:`reinspect-settings-toggle-label`,children:[`Props JSON detail`,` `,(0,n.jsx)(_,{label:`?`,description:`Choose how much data appears in JSON previews and the Raw props editor.`})]}),(0,n.jsxs)(`select`,{"data-testid":`reinspect-setting-props-serialization-mode`,value:v,onChange:t=>{let n=t.currentTarget.value;e.l(n)&&y(n)},children:[(0,n.jsx)(`option`,{value:`distilled`,children:`Distilled (recommended)`}),(0,n.jsx)(`option`,{value:`complete`,children:`Complete (includes internals)`})]})]}),(0,n.jsx)(`p`,{className:`reinspect-setting-helper-text`,children:v===`distilled`?`Shows app-level props first and hides React internals like _owner.`:`Shows the full object graph, including React internals and metadata.`})]})})]}):null]}):null}function E(t,n){let r={source:`manual`,scope:`first-party`};return n?.name&&(r.componentName=n.name),e.t(t,r)}o(r),exports.ReinspectProvider=w,exports.useReinspect=p,exports.withReinspect=E;
package/dist/lib/index.d.ts CHANGED
@@ -2,6 +2,6 @@ import './reinspect.css';
2
2
  export { ReinspectProvider } from './context';
3
3
  export { useReinspect } from './useReinspect';
4
4
  export { withReinspect } from './withReinspect';
5
- export type { InspectMode, RenderCounterMode, ReinspectConfig, ResolvedReinspectConfig, } from './types';
5
+ export type { InspectFilter, InspectFilterConfig, InspectMode, MenuOpenGesture, MenuOpenGestureConfig, MenuOpenModifiers, MenuOpenTriggerMode, PropsSerializationMode, RenderCounterMode, ReinspectConfig, ResolvedReinspectConfig, } from './types';
6
6
  export type { WithReinspectOptions } from './withReinspect';
7
7
  //# sourceMappingURL=index.d.ts.map
package/dist/lib/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/reinspect/index.ts"],"names":[],"mappings":"AAEA,OAAO,iBAAiB,CAAA;AAMxB,OAAO,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAA;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC7C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAE/C,YAAY,EACV,WAAW,EACX,iBAAiB,EACjB,eAAe,EACf,uBAAuB,GACxB,MAAM,SAAS,CAAA;AAEhB,YAAY,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/reinspect/index.ts"],"names":[],"mappings":"AAEA,OAAO,iBAAiB,CAAA;AAMxB,OAAO,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAA;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC7C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAE/C,YAAY,EACV,aAAa,EACb,mBAAmB,EACnB,WAAW,EACX,eAAe,EACf,qBAAqB,EACrB,iBAAiB,EACjB,mBAAmB,EACnB,sBAAsB,EACtB,iBAAiB,EACjB,eAAe,EACf,uBAAuB,GACxB,MAAM,SAAS,CAAA;AAEhB,YAAY,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAA"}