react-reinspect 0.1.6 → 0.1.8
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.
- package/README.md +21 -37
- package/dist/lib/autoWrap.d.ts +1 -8
- package/dist/lib/autoWrap.d.ts.map +1 -1
- package/dist/lib/constants.d.ts +2 -2
- package/dist/lib/constants.d.ts.map +1 -1
- package/dist/lib/context.d.ts +1 -3
- package/dist/lib/context.d.ts.map +1 -1
- package/dist/lib/core/renderCounter.d.ts +11 -0
- package/dist/lib/core/renderCounter.d.ts.map +1 -0
- package/dist/lib/core/state.d.ts +42 -0
- package/dist/lib/core/state.d.ts.map +1 -0
- package/dist/lib/dom/styleInjection.d.ts +2 -0
- package/dist/lib/dom/styleInjection.d.ts.map +1 -0
- package/dist/lib/index.cjs +1 -1
- package/dist/lib/index.d.ts +2 -5
- package/dist/lib/index.d.ts.map +1 -1
- package/dist/lib/index.js +259 -1156
- package/dist/lib/injectStyles.d.ts +1 -1
- package/dist/lib/injectStyles.d.ts.map +1 -1
- package/dist/lib/internal/auto-wrap.cjs +1 -0
- package/dist/lib/internal/auto-wrap.d.ts +9 -0
- package/dist/lib/internal/auto-wrap.d.ts.map +1 -0
- package/dist/lib/internal/auto-wrap.js +12 -0
- package/dist/lib/propsInspector.d.ts.map +1 -1
- package/dist/lib/react/context.d.ts +3 -0
- package/dist/lib/react/context.d.ts.map +1 -0
- package/dist/lib/react/overlay.d.ts +15 -0
- package/dist/lib/react/overlay.d.ts.map +1 -0
- package/dist/lib/react/provider.d.ts +4 -0
- package/dist/lib/react/provider.d.ts.map +1 -0
- package/dist/lib/react/wrap.d.ts +11 -0
- package/dist/lib/react/wrap.d.ts.map +1 -0
- package/dist/lib/store.d.ts +1 -2
- package/dist/lib/store.d.ts.map +1 -1
- package/dist/lib/types.d.ts +24 -17
- package/dist/lib/types.d.ts.map +1 -1
- package/dist/lib/utils.d.ts +4 -4
- package/dist/lib/utils.d.ts.map +1 -1
- package/dist/lib/withReinspect.d.ts +1 -6
- package/dist/lib/withReinspect.d.ts.map +1 -1
- package/dist/lib/wrap-8xVFW-im.js +996 -0
- package/dist/lib/wrap-Bu931FVO.cjs +1 -0
- package/dist/lib/wrapInspectableMap.d.ts +1 -1
- package/dist/lib/wrapInspectableMap.d.ts.map +1 -1
- package/dist/lib/wrapMarker.d.ts +6 -3
- package/dist/lib/wrapMarker.d.ts.map +1 -1
- package/dist/plugin/internal/autoDiscoverTransform.d.ts +26 -0
- package/dist/plugin/internal/autoDiscoverTransform.d.ts.map +1 -0
- package/dist/plugin/internal/autoDiscoverTransform.js +397 -0
- package/dist/plugin/reinspectAutoDiscoverPlugin.d.ts +5 -8
- package/dist/plugin/reinspectAutoDiscoverPlugin.d.ts.map +1 -1
- package/dist/plugin/reinspectAutoDiscoverPlugin.js +11 -358
- package/dist/plugin/reinspectNextAutoDiscoverLoader.d.ts +1 -0
- package/dist/plugin/reinspectNextAutoDiscoverLoader.d.ts.map +1 -1
- package/dist/plugin/reinspectNextAutoDiscoverLoader.js +5 -27
- package/dist/plugin/reinspectNextPlugin.d.ts +2 -0
- package/dist/plugin/reinspectNextPlugin.d.ts.map +1 -1
- package/dist/plugin/reinspectNextPlugin.js +19 -15
- package/docs/assets/screenshot-example.png +0 -0
- package/package.json +8 -2
|
@@ -0,0 +1 @@
|
|
|
1
|
+
let e=require(`react`),t=require(`react/jsx-runtime`),n=require(`react-dom`);var r=(0,e.createContext)(null),i=[`backgroundColor`,`color`,`fontSize`,`padding`,`margin`,`borderRadius`,`borderWidth`,`borderColor`,`opacity`,`width`,`height`,`gap`],a=[`#f97316`,`#2563eb`,`#16a34a`,`#db2777`,`#ca8a04`,`#0f766e`],o=new Set([`backgroundColor`,`color`,`borderColor`]),s=new Set([`fontSize`,`padding`,`margin`,`borderRadius`,`borderWidth`,`width`,`height`,`gap`]),c=2147483e3,l=`reinspect.inspectMode`,u=[`wrapped`,`first-party`,`all`],d=[`off`,`attempts`,`commits`,`both`],f=!1;function p(){f||typeof console>`u`||(f=!0,console.warn("[react-reinspect] `shouldCountRenders` and `renderCaptureMode` are deprecated. Use `renderCounters` instead."))}function m(e){return typeof e==`string`&&u.includes(e)}function h(e){return typeof e==`string`&&d.includes(e)}function g(){if(!(typeof window>`u`))try{let e=window.sessionStorage.getItem(l);return m(e)?e:void 0}catch{return}}function _(e){return g()||(m(e)?e:`wrapped`)}function v(e){if(!(typeof window>`u`))try{window.sessionStorage.setItem(l,e)}catch{}}function y(){if(!(typeof window>`u`))try{window.location.reload()}catch{}}function b(e){return h(e.renderCounters)?e.renderCounters:((e.shouldCountRenders!==void 0||e.renderCaptureMode!==void 0)&&p(),e.shouldCountRenders===!1?`off`:e.shouldCountRenders===!0?e.renderCaptureMode??`attempts`:e.renderCaptureMode?e.renderCaptureMode:`off`)}function x(e={}){let t=e.enabled??!1,n=e.editableProps&&e.editableProps.length>0?e.editableProps:i,r=e.palette&&e.palette.length>0?e.palette:a;return{enabled:t,startActive:e.startActive??!0,showFloatingToggle:e.showFloatingToggle??t,inspectMode:_(e.inspectMode),editableProps:n,palette:r,zIndexBase:e.zIndexBase??c,renderCounters:b(e),countRendersForComponents:e.countRendersForComponents??[]}}function ee(e){let t=0;for(let n=0;n<e.length;n+=1)t=(t<<5)-t+e.charCodeAt(n),t|=0;return Math.abs(t)}function S(e,t){return t.length===0?a[0]??`#f97316`:t[ee(e)%t.length]??`#f97316`}function te(e,t){if(!e)return{};let n={};for(let r of t){let t=e[r];t==null||t===``||(n[r]=t)}return n}function ne(e){if(!e)return`#1f2937`;if(/^#[0-9a-fA-F]{6}$/.test(e))return e;if(/^#[0-9a-fA-F]{3}$/.test(e)){let[,t=`0`,n=`0`,r=`0`]=e;return`#${t}${t}${n}${n}${r}${r}`}return`#1f2937`}function re(e){let t=Number(e);if(Number.isFinite(t))return t}var C=4,w=40,T=40,E=`__reinspect_placeholder__`;function D(e,t){return{[E]:e,display:t}}function O(e){return typeof e==`object`&&!!e&&!Array.isArray(e)}function ie(e){if(!O(e))return!1;let t=Object.getPrototypeOf(e);return t===Object.prototype||t===null}function k(e){return O(e)&&typeof e.__reinspect_placeholder__==`string`&&typeof e.display==`string`}function A(e){try{return JSON.stringify(e,null,2)}catch{return null}}function j(e){try{let t=Function.prototype.toString.call(e);return typeof t!=`string`||t.trim().length===0?`[Function source unavailable]`:t}catch{return`[Function source unavailable]`}}function M(e){let t=e.replace(/\s+/g,` `).trim();return t.length<=120?t:`${t.slice(0,117)}...`}function N(e,t,n){if(n>C)return D(`truncated`,`[Max depth reached]`);if(e===null)return null;let r=typeof e;if(r===`string`||r===`boolean`)return e;if(r===`number`)return Number.isFinite(e)?e:D(`non-finite-number`,String(e));if(r===`undefined`)return D(`undefined`,`undefined`);if(r===`bigint`)return D(`bigint`,`${String(e)}n`);if(r===`symbol`)return D(`symbol`,String(e));if(r===`function`)return D(`function`,`[Function ${e.name||`anonymous`}]`);if(e instanceof Date)return D(`date`,Number.isNaN(e.getTime())?`Invalid Date`:e.toISOString());if(e instanceof RegExp)return D(`regexp`,e.toString());if(r===`object`){let r=e;if(t.has(r))return D(`circular`,`[Circular]`);if(t.add(r),Array.isArray(e)){let i=[],a=Math.min(e.length,T);for(let r=0;r<a;r+=1)i.push(N(e[r],t,n+1));return e.length>T&&i.push(D(`truncated`,`${e.length-T} more items`)),t.delete(r),i}let i={},a=Object.entries(e),o=Math.min(a.length,w);for(let e=0;e<o;e+=1){let r=a[e];if(!r)continue;let[o,s]=r;i[o]=N(s,t,n+1)}return a.length>w&&(i.__reinspect_truncated__=D(`truncated`,`${a.length-w} more keys`)),t.delete(r),i}return D(`unsupported`,`[Unsupported value]`)}function P(e){if(e===null)return{kind:`null`,summary:`null`,copyText:`null`};let t=typeof e;if(t===`undefined`)return{kind:`undefined`,summary:`undefined`,copyText:`undefined`};if(t===`boolean`)return{kind:`boolean`,summary:String(e),copyText:String(e)};if(t===`number`)return{kind:`number`,summary:String(e),copyText:String(e)};if(t===`string`)return{kind:`string`,summary:JSON.stringify(e),copyText:String(e)};if(t===`bigint`)return{kind:`bigint`,summary:`${String(e)}n`,copyText:`${String(e)}n`};if(t===`symbol`){let t=String(e);return{kind:`symbol`,summary:t,copyText:t}}if(t===`function`){let t=e,n=j(t),r=t.name||`anonymous`;return{kind:`function`,summary:`Function ${r}(${t.length})`,copyText:n,functionMeta:{name:r,arity:t.length,preview:M(n),source:n}}}if(e instanceof Date){let t=Number.isNaN(e.getTime())?`Invalid Date`:e.toISOString();return{kind:`date`,summary:`Date ${t}`,copyText:t}}if(e instanceof RegExp){let t=e.toString();return{kind:`regexp`,summary:t,copyText:t}}return Array.isArray(e)?{kind:`array`,summary:`Array(${e.length})`}:O(e)?{kind:`object`,summary:`Object(${Object.keys(e).length})`}:{kind:`unknown`,summary:String(e)}}function F(e){if(!k(e)){if(Array.isArray(e)){let t=[];for(let n of e){let e=F(n);if(e===void 0)return;t.push(e)}return t}if(O(e)){let t={};for(let[n,r]of Object.entries(e)){let e=F(r);e!==void 0&&(t[n]=e)}return t}return e}}function ae(e){return Object.keys(e).map(t=>({key:t,value:P(e[t])}))}function oe(e){return A(N(e,new WeakSet,0))??`{}`}function se(e){return A(N(e,new WeakSet,0))}function I(e){if(e===null)return!0;let t=typeof e;return t===`string`||t===`number`||t===`boolean`||Array.isArray(e)?!0:ie(e)}function ce(e){let t=e.trim();if(t.length===0)return{parsed:null,error:`Value JSON cannot be empty.`};try{let e=F(JSON.parse(t));return e===void 0||!I(e)?{parsed:null,error:`Only objects, arrays, and primitive JSON values are editable.`}:{parsed:e,error:null}}catch{return{parsed:null,error:`Invalid JSON. Fix syntax and try Apply again.`}}}function le(e){let t=e.trim();if(t.length===0)return{parsed:{},error:null};try{let e=JSON.parse(t);if(typeof e!=`object`||!e||Array.isArray(e))return{parsed:null,error:`Props JSON must be an object (example: {"title":"Demo"}).`};let n={};for(let[t,r]of Object.entries(e)){let e=F(r);e!==void 0&&(n[t]=e)}return{parsed:n,error:null}}catch{return{parsed:null,error:`Invalid JSON. Fix syntax and try Apply again.`}}}var L=Symbol.for(`reinspect.wrapped`);function R(e){return e[L]}function z(e,t){e[L]=t}var B={attempts:0,commits:0},V=new Map,H=new Map;function U(e){let t=V.get(e);if(t)return t;let n={attempts:0,commits:0};return V.set(e,n),n}function W(e){let t=H.get(e);if(t)for(let e of t)e()}function ue(e){let t=U(e);V.set(e,{attempts:t.attempts+1,commits:t.commits+1}),W(e)}function de(e){return V.get(e)||B}function fe(e){V.delete(e),W(e)}function pe(e,t){let n=H.get(e);return n?n.add(t):H.set(e,new Set([t])),()=>{let n=H.get(e);n&&(n.delete(t),n.size===0&&H.delete(e))}}function G(t){return(0,e.useSyncExternalStore)((0,e.useCallback)(e=>pe(t,e),[t]),(0,e.useCallback)(()=>de(t),[t]),()=>B)}function me(e,t){return t===`commits`?`${e.commits} commits`:t===`both`?`${e.attempts} attempts | ${e.commits} commits`:`${e.attempts} attempts`}function he({value:e,onCopy:n}){if(e.kind===`function`&&e.functionMeta){let r=e.functionMeta;return(0,t.jsxs)(`div`,{className:`reinspect-prop-function`,children:[(0,t.jsx)(`code`,{children:e.summary}),(0,t.jsx)(`pre`,{children:r.preview}),(0,t.jsx)(`button`,{type:`button`,onClick:()=>n(r.source,`Function source`),disabled:!r.source,children:`Copy function source`})]})}return(0,t.jsxs)(`div`,{className:`reinspect-prop-scalar`,children:[(0,t.jsx)(`code`,{children:e.summary}),e.copyText?(0,t.jsx)(`button`,{type:`button`,onClick:()=>n(e.copyText??``,`Value`),children:`Copy`}):null]})}function ge({instanceId:e,counterMode:n}){return(0,t.jsx)(t.Fragment,{children:me(G(e),n)})}var _e={enabled:!1,startActive:!1,showFloatingToggle:!1,inspectMode:`wrapped`,editableProps:[],palette:[],zIndexBase:0,renderCounters:`off`,countRendersForComponents:[]},K=0;function ve(e){return K+=1,`${e}-${K.toString(36)}`}function q(e){let t=e.replace(/([A-Z])/g,` $1`).trim(),n=t.slice(0,1);return t.length>0?n.toUpperCase()+t.slice(1):e}function ye(e){return e.trim().toLowerCase().replace(/[\s_-]+/g,``)}function J(e){return e!=null&&e!==``}function be(e){return e.replace(/[^a-zA-Z0-9_-]/g,`-`)}async function xe(e){if(typeof navigator>`u`||!navigator.clipboard?.writeText)return!1;try{return await navigator.clipboard.writeText(e),!0}catch{return!1}}function Se(e,t){return t?.componentName?.trim()||e.displayName?.trim()||e.name?.trim()||t?.fallbackName?.trim()||`Component`}function Ce(e,t,n){return e===`manual`||n===`all`||n===`first-party`&&t===`first-party`}function we(i,a){let c=a?.source??`manual`,l=a?.scope??`first-party`,u=R(i);if(u&&c===`auto`)return i;let d=u&&c===`manual`?u.original:i,f=Se(d,a);function p(i){let a=(0,e.useRef)(null),u=(0,e.useRef)(null),p=(0,e.useRef)(null),[m,h]=(0,e.useState)(null),[g,_]=(0,e.useState)(`css`),[v,y]=(0,e.useState)(`detected`),[b,x]=(0,e.useState)(``),[ee,S]=(0,e.useState)({}),[C,w]=(0,e.useState)(`{}`),[T,E]=(0,e.useState)(null),[D,O]=(0,e.useState)(null),[ie,k]=(0,e.useState)({}),[A,j]=(0,e.useState)({}),[M,N]=(0,e.useState)({}),[P,F]=(0,e.useState)(null),[L,R]=(0,e.useState)(``),[z,B]=(0,e.useState)(null),V=(0,e.useContext)(r),H=!!V,U=V?.config??_e,W=V?.getBorderColor??(()=>`#f97316`),de=V?.isActive??!1,pe=V?.inspectMode??`wrapped`,G=V?.renderCounterMode??_e.renderCounters,me=V?.overrides??{},K=V?.updateOverride??(()=>void 0),Se=V?.renderCountComponents??{},we=V?.setRenderCountingForComponent??(()=>void 0),Te=V?.isRenderCountingEnabledFor??(()=>!1);a.current||=ve(f);let Y=a.current,Ee=W(f),De=Ce(c,l,pe),X=U.enabled&&de&&De,Oe=X&&Te(f),ke=!!Se[f],Ae=G!==`off`,je=G===`off`?`attempts`:G,Z=Oe,Me=me[Y],Ne=X?te(Me,U.editableProps):{},Q={...i,...ee},Pe=Q,$=X&&m!==null,Fe=ye(b),Ie=Fe.length===0?U.editableProps:U.editableProps.filter(e=>ye(e).includes(Fe)),Le=$&&g===`props`&&v===`detected`?ae(Pe):[],Re=(0,e.useRef)(Z);(0,e.useEffect)(()=>{Re.current=Z},[Z]);let ze=(0,e.useMemo)(()=>(e,t)=>{t===`mount`||!Re.current||ue(Y)},[Y]);(0,e.useEffect)(()=>()=>{fe(Y)},[Y]),(0,e.useEffect)(()=>{if(!$)return;let e=e=>{let t=e.target;u.current?.contains(t)||p.current?.contains(t)||(h(null),F(null),R(``),B(null))},t=e=>{if(e.key===`Escape`){if(P){F(null),R(``),B(null);return}h(null)}};return document.addEventListener(`mousedown`,e),document.addEventListener(`keydown`,t),()=>{document.removeEventListener(`mousedown`,e),document.removeEventListener(`keydown`,t)}},[P,$]),(0,e.useEffect)(()=>{if(!D)return;let e=globalThis.setTimeout(()=>{O(null)},1400);return()=>{globalThis.clearTimeout(e)}},[D]);let Be={"--reinspect-color":Ee,"--reinspect-z-base":U.zIndexBase},Ve=e=>{X&&(e.preventDefault(),_(`css`),y(`detected`),x(``),E(null),O(null),k({}),j({}),N({}),F(null),R(``),B(null),w(`{}`),h({x:e.clientX,y:e.clientY}))},He=()=>{let{parsed:e,error:t}=le(C);if(t||!e){E(t);return}S(e),E(null)},Ue=()=>{S({}),v===`raw`&&w(oe(i)),E(null)},We=(e,t)=>{xe(e).then(e=>{O(e?`${t} copied.`:`Clipboard access is unavailable.`)})},Ge=(e,t)=>{if(M[e]){N(t=>({...t,[e]:!1}));return}if(!(e in ie)&&!(e in A)){let n=se(t);n===null?j(t=>({...t,[e]:`JSON preview is unavailable for this value.`})):k(t=>({...t,[e]:n}))}N(t=>({...t,[e]:!0}))},Ke=(e,t)=>{if(!I(t))return;let n=se(t);if(n===null){O(`Unable to open editor for this value.`);return}F(e),R(n),B(null)},qe=()=>{if(!P)return;let{parsed:e,error:t}=ce(L);if(t||e===null){B(t);return}S(t=>({...t,[P]:e})),F(null),R(``),B(null)},Je=$?(0,t.jsxs)(`div`,{ref:u,className:`reinspect-menu`,role:`dialog`,"aria-label":`${f} inspector controls`,style:{top:`${m.y}px`,left:`${m.x}px`},children:[(0,t.jsxs)(`p`,{className:`reinspect-menu-title`,children:[f,` inspector`]}),(0,t.jsxs)(`label`,{className:`reinspect-menu-component-setting`,children:[(0,t.jsx)(`span`,{children:`Capture renders for this component`}),(0,t.jsx)(`input`,{type:`checkbox`,checked:Ae?!0:ke,onChange:e=>we(f,e.currentTarget.checked),disabled:Ae,"aria-label":`Capture renders for ${f}`,"data-testid":`reinspect-component-render-toggle-${f}`})]}),Ae?(0,t.jsx)(`p`,{className:`reinspect-setting-note`,children:`Global capture is enabled from Reinspect settings.`}):null,(0,t.jsxs)(`div`,{className:`reinspect-submenu`,children:[(0,t.jsx)(`button`,{type:`button`,"data-state":g===`css`?`active`:`idle`,onClick:()=>_(`css`),children:`CSS`}),(0,t.jsx)(`button`,{type:`button`,"data-state":g===`props`?`active`:`idle`,onClick:()=>_(`props`),children:`Props`})]}),g===`css`?(0,t.jsxs)(t.Fragment,{children:[(0,t.jsxs)(`div`,{className:`reinspect-menu-filter`,children:[(0,t.jsx)(`span`,{className:`reinspect-menu-filter-icon`,"aria-hidden":`true`,children:(0,t.jsx)(`svg`,{viewBox:`0 0 24 24`,focusable:`false`,children:(0,t.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,t.jsx)(`input`,{id:`${Y}-css-filter`,"data-testid":`reinspect-css-filter-input`,type:`search`,value:b,placeholder:`Filter`,"aria-label":`Filter CSS properties`,onChange:e=>x(e.currentTarget.value)})]}),(0,t.jsx)(`div`,{className:`reinspect-menu-grid`,children:Ie.map(e=>{let n=Me?.[e],r=`${Y}-${e}`;if(o.has(e)){let i=typeof n==`string`?ne(n):`#1f2937`;return(0,t.jsxs)(`div`,{className:`reinspect-field`,children:[(0,t.jsx)(`label`,{htmlFor:r,children:q(e)}),(0,t.jsxs)(`div`,{className:`reinspect-inline-controls`,children:[(0,t.jsx)(`input`,{id:r,type:`color`,value:i,onChange:t=>K(Y,e,t.currentTarget.value)}),(0,t.jsx)(`button`,{type:`button`,onClick:()=>K(Y,e,void 0),disabled:!J(n),children:`reset`})]})]},e)}if(e===`opacity`){let i=typeof n==`number`?n:1;return(0,t.jsxs)(`div`,{className:`reinspect-field`,children:[(0,t.jsx)(`label`,{htmlFor:r,children:`Opacity`}),(0,t.jsxs)(`div`,{className:`reinspect-inline-controls reinspect-opacity-controls`,children:[(0,t.jsx)(`input`,{id:r,type:`range`,min:`0`,max:`1`,step:`0.05`,value:i,onChange:t=>{let n=re(t.currentTarget.value);n!==void 0&&K(Y,e,n)}}),(0,t.jsx)(`output`,{children:i.toFixed(2)}),(0,t.jsx)(`button`,{type:`button`,onClick:()=>K(Y,e,void 0),disabled:!J(n),children:`reset`})]})]},e)}if(s.has(e)){let i=typeof n==`number`?n:``;return(0,t.jsxs)(`div`,{className:`reinspect-field`,children:[(0,t.jsxs)(`label`,{htmlFor:r,children:[q(e),` (px)`]}),(0,t.jsxs)(`div`,{className:`reinspect-inline-controls`,children:[(0,t.jsx)(`input`,{id:r,type:`number`,step:`1`,value:i,onChange:t=>{if(t.currentTarget.value===``){K(Y,e,void 0);return}let n=re(t.currentTarget.value);n!==void 0&&K(Y,e,n)}}),(0,t.jsx)(`button`,{type:`button`,onClick:()=>K(Y,e,void 0),disabled:!J(n),children:`reset`})]})]},e)}return(0,t.jsxs)(`div`,{className:`reinspect-field`,children:[(0,t.jsx)(`label`,{htmlFor:r,children:q(e)}),(0,t.jsxs)(`div`,{className:`reinspect-inline-controls`,children:[(0,t.jsx)(`input`,{id:r,type:`text`,value:typeof n==`string`?n:``,onChange:t=>K(Y,e,t.currentTarget.value||void 0)}),(0,t.jsx)(`button`,{type:`button`,onClick:()=>K(Y,e,void 0),disabled:!J(n),children:`reset`})]})]},e)})}),Ie.length===0?(0,t.jsxs)(`p`,{className:`reinspect-menu-empty-state`,children:[`No CSS properties match "`,b.trim(),`".`]}):null]}):(0,t.jsxs)(`div`,{className:`reinspect-props-panel`,children:[(0,t.jsxs)(`div`,{className:`reinspect-props-submenu`,children:[(0,t.jsx)(`button`,{type:`button`,"data-state":v===`detected`?`active`:`idle`,onClick:()=>y(`detected`),children:`Detected`}),(0,t.jsx)(`button`,{type:`button`,"data-state":v===`raw`?`active`:`idle`,onClick:()=>{y(`raw`),E(null),w(oe(Pe))},children:`Raw`})]}),v===`detected`?Le.length>0?(0,t.jsxs)(`div`,{className:`reinspect-props-table`,children:[(0,t.jsxs)(`div`,{className:`reinspect-props-header`,children:[(0,t.jsx)(`span`,{children:`Key`}),(0,t.jsx)(`span`,{children:`Value`})]}),Le.map(e=>{let n=be(e.key),r=Pe[e.key],i=e.value.kind===`object`||e.value.kind===`array`,a=!!M[e.key],o=ie[e.key],s=A[e.key],c=I(r);return(0,t.jsxs)(`div`,{className:`reinspect-props-row`,"data-testid":`reinspect-prop-row-${n}`,children:[(0,t.jsx)(`code`,{className:`reinspect-prop-key`,children:e.key}),(0,t.jsxs)(`div`,{className:`reinspect-prop-cell`,"data-testid":`reinspect-prop-value-${n}`,children:[he({value:e.value,onCopy:We}),i||c?(0,t.jsxs)(`div`,{className:`reinspect-prop-actions`,children:[i?(0,t.jsx)(`button`,{type:`button`,"data-testid":`reinspect-prop-show-json-${n}`,onClick:()=>Ge(e.key,r),children:a?`Hide JSON`:`Show JSON`}):null,c?(0,t.jsx)(`button`,{type:`button`,"data-testid":`reinspect-prop-edit-${n}`,onClick:()=>Ke(e.key,r),children:`Edit`}):null]}):null,a?(0,t.jsx)(`div`,{className:`reinspect-prop-json-preview`,"data-testid":`reinspect-prop-json-preview-${n}`,children:s?(0,t.jsx)(`p`,{className:`reinspect-error`,children:s}):(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(`pre`,{children:o}),o?(0,t.jsx)(`button`,{type:`button`,"data-testid":`reinspect-prop-copy-json-${n}`,onClick:()=>We(o,`JSON value`),children:`Copy JSON`}):null]})}):null]})]},e.key)})]}):(0,t.jsx)(`p`,{className:`reinspect-menu-empty-state`,children:`No props detected.`}):(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(`label`,{htmlFor:`${Y}-props-json`,children:`Props JSON`}),(0,t.jsx)(`textarea`,{id:`${Y}-props-json`,value:C,onChange:e=>{w(e.currentTarget.value),E(null)},rows:9}),T?(0,t.jsx)(`p`,{className:`reinspect-error`,children:T}):null,(0,t.jsxs)(`div`,{className:`reinspect-inline-controls`,children:[(0,t.jsx)(`button`,{type:`button`,onClick:He,children:`apply`}),(0,t.jsx)(`button`,{type:`button`,onClick:Ue,children:`reset`})]})]}),D?(0,t.jsx)(`p`,{className:`reinspect-setting-note`,"data-testid":`reinspect-props-copy-status`,children:D}):null]})]}):null,Ye=P?(0,n.createPortal)((0,t.jsx)(`div`,{className:`reinspect-modal-backdrop`,role:`dialog`,"aria-modal":`true`,"aria-label":`Edit ${P} prop`,"data-testid":`reinspect-prop-edit-modal`,children:(0,t.jsxs)(`div`,{className:`reinspect-modal`,ref:p,children:[(0,t.jsxs)(`p`,{className:`reinspect-menu-title`,children:[`Edit prop: `,P]}),(0,t.jsx)(`label`,{htmlFor:`${Y}-prop-edit-json`,children:`JSON value`}),(0,t.jsx)(`textarea`,{id:`${Y}-prop-edit-json`,"data-testid":`reinspect-prop-edit-textarea`,value:L,onChange:e=>{R(e.currentTarget.value),B(null)},rows:10}),z?(0,t.jsx)(`p`,{className:`reinspect-error`,"data-testid":`reinspect-prop-edit-error`,children:z}):null,(0,t.jsxs)(`div`,{className:`reinspect-inline-controls`,children:[(0,t.jsx)(`button`,{type:`button`,onClick:qe,children:`apply`}),(0,t.jsx)(`button`,{type:`button`,onClick:()=>{F(null),R(``),B(null)},children:`cancel`})]})]})}),document.body):null;if(!H){if(c===`manual`)throw Error(`useReinspect must be used within ReinspectProvider`);return(0,t.jsx)(d,{...Q})}if(!X)return(0,t.jsx)(d,{...Q});let Xe=Z?(0,t.jsx)(e.Profiler,{id:Y,onRender:ze,children:(0,t.jsx)(d,{...Q})}):(0,t.jsx)(d,{...Q});return(0,t.jsxs)(`div`,{className:`reinspect-shell`,"data-reinspect-component":f,"data-reinspect-active":X,"data-testid":`reinspect-shell-${f}`,style:Be,onContextMenu:Ve,children:[X?(0,t.jsxs)(`span`,{className:`reinspect-name-badge`,children:[f,Oe?` | `:``,Oe?(0,t.jsx)(ge,{instanceId:Y,counterMode:je}):null]}):null,Je?(0,n.createPortal)(Je,document.body):null,Ye,(0,t.jsx)(`div`,{className:`reinspect-content`,"data-reinspect-content":`true`,style:Ne,children:Xe})]})}return p.displayName=`withReinspect(${f})`,z(p,{source:c,scope:l,original:d}),p}Object.defineProperty(exports,`a`,{enumerable:!0,get:function(){return v}}),Object.defineProperty(exports,`c`,{enumerable:!0,get:function(){return x}}),Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return h}}),Object.defineProperty(exports,`l`,{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return R}}),Object.defineProperty(exports,`o`,{enumerable:!0,get:function(){return S}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return m}}),Object.defineProperty(exports,`s`,{enumerable:!0,get:function(){return y}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return we}});
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { ComponentType } from 'react';
|
|
2
2
|
import { type WithReinspectOptions } from './withReinspect';
|
|
3
|
-
type ComponentMap = Record<string, ComponentType<
|
|
3
|
+
type ComponentMap = Record<string, ComponentType<unknown>>;
|
|
4
4
|
type WrapInspectableMapOptions<T extends ComponentMap> = Partial<Record<keyof T, WithReinspectOptions>> | ((key: keyof T, component: T[keyof T]) => WithReinspectOptions | undefined);
|
|
5
5
|
export declare function wrapInspectableMap<T extends ComponentMap>(componentMap: T, options?: WrapInspectableMapOptions<T>): {
|
|
6
6
|
[K in keyof T]: T[K];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"wrapInspectableMap.d.ts","sourceRoot":"","sources":["../../src/reinspect/wrapInspectableMap.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAC1C,OAAO,EAAiB,KAAK,oBAAoB,EAAE,MAAM,iBAAiB,CAAA;
|
|
1
|
+
{"version":3,"file":"wrapInspectableMap.d.ts","sourceRoot":"","sources":["../../src/reinspect/wrapInspectableMap.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAC1C,OAAO,EAAiB,KAAK,oBAAoB,EAAE,MAAM,iBAAiB,CAAA;AAE1E,KAAK,YAAY,GAAG,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC,CAAA;AAE1D,KAAK,yBAAyB,CAAC,CAAC,SAAS,YAAY,IACjD,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,oBAAoB,CAAC,CAAC,GAC9C,CAAC,CAAC,GAAG,EAAE,MAAM,CAAC,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,KAAK,oBAAoB,GAAG,SAAS,CAAC,CAAA;AAE/E,wBAAgB,kBAAkB,CAAC,CAAC,SAAS,YAAY,EACvD,YAAY,EAAE,CAAC,EACf,OAAO,CAAC,EAAE,yBAAyB,CAAC,CAAC,CAAC,GACrC;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAE,CAgB1B"}
|
package/dist/lib/wrapMarker.d.ts
CHANGED
|
@@ -1,11 +1,14 @@
|
|
|
1
1
|
import type { ComponentType } from 'react';
|
|
2
2
|
import type { AutoDiscoverScope } from './types';
|
|
3
|
+
type ComponentProps = Record<string, unknown>;
|
|
3
4
|
export type ReinspectWrapSource = 'manual' | 'auto';
|
|
4
|
-
export interface ReinspectWrappedMetadata {
|
|
5
|
+
export interface ReinspectWrappedMetadata<P extends object = ComponentProps> {
|
|
5
6
|
source: ReinspectWrapSource;
|
|
6
7
|
scope: AutoDiscoverScope;
|
|
7
|
-
original: ComponentType<
|
|
8
|
+
original: ComponentType<P>;
|
|
8
9
|
}
|
|
9
10
|
export declare const REINSPECT_WRAPPED_SYMBOL: unique symbol;
|
|
10
|
-
export declare function getReinspectWrappedMetadata(component: ComponentType<
|
|
11
|
+
export declare function getReinspectWrappedMetadata<P extends object>(component: ComponentType<P>): ReinspectWrappedMetadata<P> | undefined;
|
|
12
|
+
export declare function setReinspectWrappedMetadata<P extends object>(component: ComponentType<P>, metadata: ReinspectWrappedMetadata<P>): void;
|
|
13
|
+
export {};
|
|
11
14
|
//# sourceMappingURL=wrapMarker.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"wrapMarker.d.ts","sourceRoot":"","sources":["../../src/reinspect/wrapMarker.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAC1C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAEhD,MAAM,MAAM,mBAAmB,GAAG,QAAQ,GAAG,MAAM,CAAA;AAEnD,MAAM,WAAW,wBAAwB;
|
|
1
|
+
{"version":3,"file":"wrapMarker.d.ts","sourceRoot":"","sources":["../../src/reinspect/wrapMarker.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAC1C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAEhD,KAAK,cAAc,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;AAE7C,MAAM,MAAM,mBAAmB,GAAG,QAAQ,GAAG,MAAM,CAAA;AAEnD,MAAM,WAAW,wBAAwB,CAAC,CAAC,SAAS,MAAM,GAAG,cAAc;IACzE,MAAM,EAAE,mBAAmB,CAAA;IAC3B,KAAK,EAAE,iBAAiB,CAAA;IACxB,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAC,CAAA;CAC3B;AAED,eAAO,MAAM,wBAAwB,eAAkC,CAAA;AAMvE,wBAAgB,2BAA2B,CAAC,CAAC,SAAS,MAAM,EAC1D,SAAS,EAAE,aAAa,CAAC,CAAC,CAAC,GAC1B,wBAAwB,CAAC,CAAC,CAAC,GAAG,SAAS,CAEzC;AAED,wBAAgB,2BAA2B,CAAC,CAAC,SAAS,MAAM,EAC1D,SAAS,EAAE,aAAa,CAAC,CAAC,CAAC,EAC3B,QAAQ,EAAE,wBAAwB,CAAC,CAAC,CAAC,GACpC,IAAI,CAEN"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
export type AutoDiscoverScope = 'first-party' | 'third-party';
|
|
2
|
+
export type AutoDiscoverIncludeMode = 'first-party' | 'all';
|
|
3
|
+
export interface AutoDiscoverResolutionOptions {
|
|
4
|
+
include: AutoDiscoverIncludeMode;
|
|
5
|
+
thirdPartyAllowlist?: readonly string[];
|
|
6
|
+
}
|
|
7
|
+
export interface AutoDiscoverTransformResult {
|
|
8
|
+
code: string;
|
|
9
|
+
modified: boolean;
|
|
10
|
+
map: {
|
|
11
|
+
version: number;
|
|
12
|
+
sources: string[];
|
|
13
|
+
names: string[];
|
|
14
|
+
mappings: string;
|
|
15
|
+
file?: string | undefined;
|
|
16
|
+
sourceRoot?: string | undefined;
|
|
17
|
+
sourcesContent?: string[] | undefined;
|
|
18
|
+
} | null;
|
|
19
|
+
}
|
|
20
|
+
export declare function isSupportedSourceFile(id: string): boolean;
|
|
21
|
+
export declare function isFirstPartyModule(id: string): boolean;
|
|
22
|
+
export declare function shouldSkipThirdPartyModule(id: string): boolean;
|
|
23
|
+
export declare function normalizeModuleId(id: string): string;
|
|
24
|
+
export declare function resolveAutoDiscoverScope(normalizedId: string, options: AutoDiscoverResolutionOptions): AutoDiscoverScope | null;
|
|
25
|
+
export declare function transformModuleForAutoDiscover(code: string, fileId: string, scope: AutoDiscoverScope): AutoDiscoverTransformResult;
|
|
26
|
+
//# sourceMappingURL=autoDiscoverTransform.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"autoDiscoverTransform.d.ts","sourceRoot":"","sources":["../../../src/plugin/internal/autoDiscoverTransform.ts"],"names":[],"mappings":"AAKA,MAAM,MAAM,iBAAiB,GAAG,aAAa,GAAG,aAAa,CAAA;AAC7D,MAAM,MAAM,uBAAuB,GAAG,aAAa,GAAG,KAAK,CAAA;AAE3D,MAAM,WAAW,6BAA6B;IAC5C,OAAO,EAAE,uBAAuB,CAAA;IAChC,mBAAmB,CAAC,EAAE,SAAS,MAAM,EAAE,CAAA;CACxC;AAiBD,MAAM,WAAW,2BAA2B;IAC1C,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,EAAE,OAAO,CAAA;IACjB,GAAG,EAAE;QACH,OAAO,EAAE,MAAM,CAAA;QACf,OAAO,EAAE,MAAM,EAAE,CAAA;QACjB,KAAK,EAAE,MAAM,EAAE,CAAA;QACf,QAAQ,EAAE,MAAM,CAAA;QAChB,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;QACzB,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;QAC/B,cAAc,CAAC,EAAE,MAAM,EAAE,GAAG,SAAS,CAAA;KACtC,GAAG,IAAI,CAAA;CACT;AAuQD,wBAAgB,qBAAqB,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO,CAMzD;AAED,wBAAgB,kBAAkB,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO,CAEtD;AAED,wBAAgB,0BAA0B,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO,CAE9D;AAaD,wBAAgB,iBAAiB,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,CAGpD;AAED,wBAAgB,wBAAwB,CACtC,YAAY,EAAE,MAAM,EACpB,OAAO,EAAE,6BAA6B,GACrC,iBAAiB,GAAG,IAAI,CAyB1B;AAED,wBAAgB,8BAA8B,CAC5C,IAAI,EAAE,MAAM,EACZ,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,iBAAiB,GACvB,2BAA2B,CA+P7B"}
|
|
@@ -0,0 +1,397 @@
|
|
|
1
|
+
import path from 'node:path';
|
|
2
|
+
import { parse } from '@babel/parser';
|
|
3
|
+
import { generate } from '@babel/generator';
|
|
4
|
+
import * as t from '@babel/types';
|
|
5
|
+
const AUTO_WRAP_IMPORT_SOURCE = 'react-reinspect/internal/auto-wrap';
|
|
6
|
+
const AUTO_WRAP_IMPORT_NAME = 'autoWrapInspectable';
|
|
7
|
+
const DEFAULT_EXPORT_LOCAL_IDENTIFIER = '__reinspect_default_component';
|
|
8
|
+
const SUPPORTED_FILE_PATTERN = /\.[cm]?[jt]sx?$/;
|
|
9
|
+
const MAX_NODE_VISITS = 12_000;
|
|
10
|
+
const THIRD_PARTY_SKIP_PATTERNS = [
|
|
11
|
+
'/node_modules/react/',
|
|
12
|
+
'/node_modules/react-dom/',
|
|
13
|
+
'/node_modules/scheduler/',
|
|
14
|
+
'/node_modules/@vite/',
|
|
15
|
+
'/node_modules/vite/',
|
|
16
|
+
'/node_modules/@react-refresh/',
|
|
17
|
+
];
|
|
18
|
+
function isPascalCaseIdentifier(name) {
|
|
19
|
+
return /^[A-Z][A-Za-z0-9]*$/.test(name);
|
|
20
|
+
}
|
|
21
|
+
function inferFallbackName(filePath) {
|
|
22
|
+
const baseName = path.basename(filePath).replace(/\.[^.]+$/, '');
|
|
23
|
+
const tokens = baseName
|
|
24
|
+
.replace(/[^A-Za-z0-9]+/g, ' ')
|
|
25
|
+
.trim()
|
|
26
|
+
.split(/\s+/)
|
|
27
|
+
.filter(Boolean);
|
|
28
|
+
if (tokens.length === 0) {
|
|
29
|
+
return 'Component';
|
|
30
|
+
}
|
|
31
|
+
return tokens
|
|
32
|
+
.map((token) => token.slice(0, 1).toUpperCase() + token.slice(1))
|
|
33
|
+
.join('');
|
|
34
|
+
}
|
|
35
|
+
function unwrapExpression(node) {
|
|
36
|
+
let currentNode = node;
|
|
37
|
+
while (t.isParenthesizedExpression(currentNode) ||
|
|
38
|
+
t.isTSAsExpression(currentNode) ||
|
|
39
|
+
t.isTSTypeAssertion(currentNode) ||
|
|
40
|
+
t.isTSNonNullExpression(currentNode) ||
|
|
41
|
+
t.isTSInstantiationExpression(currentNode) ||
|
|
42
|
+
t.isTypeCastExpression(currentNode)) {
|
|
43
|
+
currentNode = currentNode.expression;
|
|
44
|
+
}
|
|
45
|
+
return currentNode;
|
|
46
|
+
}
|
|
47
|
+
function isReactCreateElementCall(node) {
|
|
48
|
+
const callee = unwrapExpression(node.callee);
|
|
49
|
+
if (t.isIdentifier(callee)) {
|
|
50
|
+
return callee.name === 'createElement';
|
|
51
|
+
}
|
|
52
|
+
if (t.isMemberExpression(callee) &&
|
|
53
|
+
t.isIdentifier(callee.object) &&
|
|
54
|
+
callee.object.name === 'React' &&
|
|
55
|
+
t.isIdentifier(callee.property)) {
|
|
56
|
+
return callee.property.name === 'createElement';
|
|
57
|
+
}
|
|
58
|
+
return false;
|
|
59
|
+
}
|
|
60
|
+
function isAstNode(value) {
|
|
61
|
+
return (typeof value === 'object' &&
|
|
62
|
+
value !== null &&
|
|
63
|
+
'type' in value &&
|
|
64
|
+
typeof value.type === 'string');
|
|
65
|
+
}
|
|
66
|
+
function containsRenderableReactNode(node) {
|
|
67
|
+
if (!node) {
|
|
68
|
+
return false;
|
|
69
|
+
}
|
|
70
|
+
const stack = [node];
|
|
71
|
+
let visitedCount = 0;
|
|
72
|
+
while (stack.length > 0) {
|
|
73
|
+
const nextNode = stack.pop();
|
|
74
|
+
if (!nextNode) {
|
|
75
|
+
continue;
|
|
76
|
+
}
|
|
77
|
+
visitedCount += 1;
|
|
78
|
+
if (visitedCount > MAX_NODE_VISITS) {
|
|
79
|
+
return false;
|
|
80
|
+
}
|
|
81
|
+
if (t.isJSXElement(nextNode) || t.isJSXFragment(nextNode)) {
|
|
82
|
+
return true;
|
|
83
|
+
}
|
|
84
|
+
if (t.isCallExpression(nextNode) && isReactCreateElementCall(nextNode)) {
|
|
85
|
+
return true;
|
|
86
|
+
}
|
|
87
|
+
const visitorKeys = t.VISITOR_KEYS[nextNode.type] ?? [];
|
|
88
|
+
for (const visitorKey of visitorKeys) {
|
|
89
|
+
const value = nextNode[visitorKey];
|
|
90
|
+
if (Array.isArray(value)) {
|
|
91
|
+
for (const item of value) {
|
|
92
|
+
if (isAstNode(item)) {
|
|
93
|
+
stack.push(item);
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
continue;
|
|
97
|
+
}
|
|
98
|
+
if (isAstNode(value)) {
|
|
99
|
+
stack.push(value);
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
return false;
|
|
104
|
+
}
|
|
105
|
+
function isComponentFunction(node) {
|
|
106
|
+
if (t.isBlockStatement(node.body)) {
|
|
107
|
+
return containsRenderableReactNode(node.body);
|
|
108
|
+
}
|
|
109
|
+
return containsRenderableReactNode(node.body);
|
|
110
|
+
}
|
|
111
|
+
function isMemoForwardRefCallee(callee) {
|
|
112
|
+
const expression = unwrapExpression(callee);
|
|
113
|
+
if (t.isIdentifier(expression)) {
|
|
114
|
+
return expression.name === 'memo' || expression.name === 'forwardRef';
|
|
115
|
+
}
|
|
116
|
+
if (t.isMemberExpression(expression) &&
|
|
117
|
+
t.isIdentifier(expression.object) &&
|
|
118
|
+
expression.object.name === 'React' &&
|
|
119
|
+
t.isIdentifier(expression.property)) {
|
|
120
|
+
return (expression.property.name === 'memo' ||
|
|
121
|
+
expression.property.name === 'forwardRef');
|
|
122
|
+
}
|
|
123
|
+
return false;
|
|
124
|
+
}
|
|
125
|
+
function isMemoForwardRefCall(node) {
|
|
126
|
+
const callee = unwrapExpression(node.callee);
|
|
127
|
+
if (!isMemoForwardRefCallee(callee)) {
|
|
128
|
+
return false;
|
|
129
|
+
}
|
|
130
|
+
if (node.arguments.length === 0) {
|
|
131
|
+
return false;
|
|
132
|
+
}
|
|
133
|
+
const firstArgument = node.arguments[0];
|
|
134
|
+
if (!t.isExpression(firstArgument)) {
|
|
135
|
+
return false;
|
|
136
|
+
}
|
|
137
|
+
const componentCandidate = unwrapExpression(firstArgument);
|
|
138
|
+
if (t.isArrowFunctionExpression(componentCandidate) ||
|
|
139
|
+
t.isFunctionExpression(componentCandidate)) {
|
|
140
|
+
return isComponentFunction(componentCandidate);
|
|
141
|
+
}
|
|
142
|
+
if (t.isIdentifier(componentCandidate)) {
|
|
143
|
+
return isPascalCaseIdentifier(componentCandidate.name);
|
|
144
|
+
}
|
|
145
|
+
return true;
|
|
146
|
+
}
|
|
147
|
+
function isWrappedInitializer(node) {
|
|
148
|
+
const expression = unwrapExpression(node);
|
|
149
|
+
if (!t.isCallExpression(expression)) {
|
|
150
|
+
return false;
|
|
151
|
+
}
|
|
152
|
+
const callee = unwrapExpression(expression.callee);
|
|
153
|
+
return (t.isIdentifier(callee) &&
|
|
154
|
+
(callee.name === AUTO_WRAP_IMPORT_NAME || callee.name === 'withReinspect'));
|
|
155
|
+
}
|
|
156
|
+
function isComponentInitializer(node) {
|
|
157
|
+
const expression = unwrapExpression(node);
|
|
158
|
+
if (t.isArrowFunctionExpression(expression) || t.isFunctionExpression(expression)) {
|
|
159
|
+
return isComponentFunction(expression);
|
|
160
|
+
}
|
|
161
|
+
if (t.isCallExpression(expression)) {
|
|
162
|
+
return isMemoForwardRefCall(expression);
|
|
163
|
+
}
|
|
164
|
+
return false;
|
|
165
|
+
}
|
|
166
|
+
function createAutoWrapCall(expression, componentName, scope, fallbackName) {
|
|
167
|
+
const metadataProperties = [
|
|
168
|
+
t.objectProperty(t.identifier('scope'), t.stringLiteral(scope)),
|
|
169
|
+
t.objectProperty(t.identifier('fallbackName'), t.stringLiteral(fallbackName)),
|
|
170
|
+
];
|
|
171
|
+
if (componentName) {
|
|
172
|
+
metadataProperties.unshift(t.objectProperty(t.identifier('componentName'), t.stringLiteral(componentName)));
|
|
173
|
+
}
|
|
174
|
+
return t.callExpression(t.identifier(AUTO_WRAP_IMPORT_NAME), [
|
|
175
|
+
expression,
|
|
176
|
+
t.objectExpression(metadataProperties),
|
|
177
|
+
]);
|
|
178
|
+
}
|
|
179
|
+
function createFunctionWrapAssignment(name, scope, fallbackName) {
|
|
180
|
+
return t.expressionStatement(t.assignmentExpression('=', t.identifier(name), createAutoWrapCall(t.identifier(name), name, scope, fallbackName)));
|
|
181
|
+
}
|
|
182
|
+
function functionDeclarationToExpression(node) {
|
|
183
|
+
const expression = t.functionExpression(node.id, node.params, node.body, node.generator, node.async);
|
|
184
|
+
if (node.typeParameters) {
|
|
185
|
+
expression.typeParameters = node.typeParameters;
|
|
186
|
+
}
|
|
187
|
+
if (node.returnType) {
|
|
188
|
+
expression.returnType = node.returnType;
|
|
189
|
+
}
|
|
190
|
+
return expression;
|
|
191
|
+
}
|
|
192
|
+
export function isSupportedSourceFile(id) {
|
|
193
|
+
if (id.startsWith('\0') || id.startsWith('/@')) {
|
|
194
|
+
return false;
|
|
195
|
+
}
|
|
196
|
+
return SUPPORTED_FILE_PATTERN.test(id);
|
|
197
|
+
}
|
|
198
|
+
export function isFirstPartyModule(id) {
|
|
199
|
+
return id.includes('/src/') && !id.includes('/node_modules/');
|
|
200
|
+
}
|
|
201
|
+
export function shouldSkipThirdPartyModule(id) {
|
|
202
|
+
return THIRD_PARTY_SKIP_PATTERNS.some((pattern) => id.includes(pattern));
|
|
203
|
+
}
|
|
204
|
+
function isInThirdPartyAllowlist(moduleId, allowlist) {
|
|
205
|
+
if (!allowlist || allowlist.length === 0) {
|
|
206
|
+
return false;
|
|
207
|
+
}
|
|
208
|
+
return allowlist.some((pattern) => moduleId.includes(pattern));
|
|
209
|
+
}
|
|
210
|
+
export function normalizeModuleId(id) {
|
|
211
|
+
const withoutQuery = id.split('?')[0] ?? '';
|
|
212
|
+
return withoutQuery.split(path.sep).join('/');
|
|
213
|
+
}
|
|
214
|
+
export function resolveAutoDiscoverScope(normalizedId, options) {
|
|
215
|
+
if (normalizedId.includes('/node_modules/react-reinspect/')) {
|
|
216
|
+
return null;
|
|
217
|
+
}
|
|
218
|
+
if (normalizedId.includes('/src/reinspect/')) {
|
|
219
|
+
return null;
|
|
220
|
+
}
|
|
221
|
+
if (isFirstPartyModule(normalizedId)) {
|
|
222
|
+
return 'first-party';
|
|
223
|
+
}
|
|
224
|
+
if (options.include !== 'all') {
|
|
225
|
+
return null;
|
|
226
|
+
}
|
|
227
|
+
if (shouldSkipThirdPartyModule(normalizedId) &&
|
|
228
|
+
!isInThirdPartyAllowlist(normalizedId, options.thirdPartyAllowlist)) {
|
|
229
|
+
return null;
|
|
230
|
+
}
|
|
231
|
+
return 'third-party';
|
|
232
|
+
}
|
|
233
|
+
export function transformModuleForAutoDiscover(code, fileId, scope) {
|
|
234
|
+
let ast;
|
|
235
|
+
try {
|
|
236
|
+
ast = parse(code, {
|
|
237
|
+
sourceType: 'module',
|
|
238
|
+
plugins: ['typescript', 'jsx'],
|
|
239
|
+
});
|
|
240
|
+
}
|
|
241
|
+
catch {
|
|
242
|
+
return { code, modified: false, map: null };
|
|
243
|
+
}
|
|
244
|
+
const program = ast.program;
|
|
245
|
+
const fallbackName = inferFallbackName(fileId);
|
|
246
|
+
let modified = false;
|
|
247
|
+
let autoWrapImportDeclaration;
|
|
248
|
+
let hasAutoWrapImport = false;
|
|
249
|
+
for (const statement of program.body) {
|
|
250
|
+
if (!t.isImportDeclaration(statement)) {
|
|
251
|
+
continue;
|
|
252
|
+
}
|
|
253
|
+
if (statement.source.value !== AUTO_WRAP_IMPORT_SOURCE) {
|
|
254
|
+
continue;
|
|
255
|
+
}
|
|
256
|
+
autoWrapImportDeclaration = statement;
|
|
257
|
+
hasAutoWrapImport = statement.specifiers.some((specifier) => t.isImportSpecifier(specifier) &&
|
|
258
|
+
t.isIdentifier(specifier.imported) &&
|
|
259
|
+
specifier.imported.name === AUTO_WRAP_IMPORT_NAME);
|
|
260
|
+
}
|
|
261
|
+
for (let index = 0; index < program.body.length; index += 1) {
|
|
262
|
+
const statement = program.body[index];
|
|
263
|
+
if (t.isFunctionDeclaration(statement) && statement.id) {
|
|
264
|
+
if (isPascalCaseIdentifier(statement.id.name) &&
|
|
265
|
+
isComponentFunction(statement)) {
|
|
266
|
+
program.body.splice(index + 1, 0, createFunctionWrapAssignment(statement.id.name, scope, fallbackName));
|
|
267
|
+
index += 1;
|
|
268
|
+
modified = true;
|
|
269
|
+
}
|
|
270
|
+
continue;
|
|
271
|
+
}
|
|
272
|
+
if (t.isExportNamedDeclaration(statement) &&
|
|
273
|
+
statement.declaration &&
|
|
274
|
+
t.isFunctionDeclaration(statement.declaration) &&
|
|
275
|
+
statement.declaration.id &&
|
|
276
|
+
isPascalCaseIdentifier(statement.declaration.id.name) &&
|
|
277
|
+
isComponentFunction(statement.declaration)) {
|
|
278
|
+
program.body.splice(index + 1, 0, createFunctionWrapAssignment(statement.declaration.id.name, scope, fallbackName));
|
|
279
|
+
index += 1;
|
|
280
|
+
modified = true;
|
|
281
|
+
continue;
|
|
282
|
+
}
|
|
283
|
+
const processVariableDeclaration = (declaration) => {
|
|
284
|
+
let declarationChanged = false;
|
|
285
|
+
for (const declarator of declaration.declarations) {
|
|
286
|
+
if (!t.isIdentifier(declarator.id) || !declarator.init) {
|
|
287
|
+
continue;
|
|
288
|
+
}
|
|
289
|
+
if (!isPascalCaseIdentifier(declarator.id.name)) {
|
|
290
|
+
continue;
|
|
291
|
+
}
|
|
292
|
+
if (!isComponentInitializer(declarator.init)) {
|
|
293
|
+
continue;
|
|
294
|
+
}
|
|
295
|
+
if (isWrappedInitializer(declarator.init)) {
|
|
296
|
+
continue;
|
|
297
|
+
}
|
|
298
|
+
declarator.init = createAutoWrapCall(declarator.init, declarator.id.name, scope, fallbackName);
|
|
299
|
+
declarationChanged = true;
|
|
300
|
+
}
|
|
301
|
+
return declarationChanged;
|
|
302
|
+
};
|
|
303
|
+
if (t.isVariableDeclaration(statement)) {
|
|
304
|
+
if (processVariableDeclaration(statement)) {
|
|
305
|
+
modified = true;
|
|
306
|
+
}
|
|
307
|
+
continue;
|
|
308
|
+
}
|
|
309
|
+
if (t.isExportNamedDeclaration(statement) &&
|
|
310
|
+
statement.declaration &&
|
|
311
|
+
t.isVariableDeclaration(statement.declaration)) {
|
|
312
|
+
if (processVariableDeclaration(statement.declaration)) {
|
|
313
|
+
modified = true;
|
|
314
|
+
}
|
|
315
|
+
continue;
|
|
316
|
+
}
|
|
317
|
+
if (!t.isExportDefaultDeclaration(statement)) {
|
|
318
|
+
continue;
|
|
319
|
+
}
|
|
320
|
+
const declaration = statement.declaration;
|
|
321
|
+
if (t.isFunctionDeclaration(declaration)) {
|
|
322
|
+
if (declaration.id &&
|
|
323
|
+
isPascalCaseIdentifier(declaration.id.name) &&
|
|
324
|
+
isComponentFunction(declaration)) {
|
|
325
|
+
const localName = declaration.id.name;
|
|
326
|
+
const replacementStatements = [
|
|
327
|
+
declaration,
|
|
328
|
+
createFunctionWrapAssignment(localName, scope, fallbackName),
|
|
329
|
+
t.exportDefaultDeclaration(t.identifier(localName)),
|
|
330
|
+
];
|
|
331
|
+
program.body.splice(index, 1, ...replacementStatements);
|
|
332
|
+
index += replacementStatements.length - 1;
|
|
333
|
+
modified = true;
|
|
334
|
+
continue;
|
|
335
|
+
}
|
|
336
|
+
if (!declaration.id && isComponentFunction(declaration)) {
|
|
337
|
+
const localIdentifier = t.identifier(DEFAULT_EXPORT_LOCAL_IDENTIFIER);
|
|
338
|
+
const wrappedValue = createAutoWrapCall(functionDeclarationToExpression(declaration), undefined, scope, fallbackName);
|
|
339
|
+
const replacementStatements = [
|
|
340
|
+
t.variableDeclaration('const', [
|
|
341
|
+
t.variableDeclarator(localIdentifier, wrappedValue),
|
|
342
|
+
]),
|
|
343
|
+
t.exportDefaultDeclaration(localIdentifier),
|
|
344
|
+
];
|
|
345
|
+
program.body.splice(index, 1, ...replacementStatements);
|
|
346
|
+
index += replacementStatements.length - 1;
|
|
347
|
+
modified = true;
|
|
348
|
+
}
|
|
349
|
+
continue;
|
|
350
|
+
}
|
|
351
|
+
if (!t.isExpression(declaration)) {
|
|
352
|
+
continue;
|
|
353
|
+
}
|
|
354
|
+
if (!isComponentInitializer(declaration) || isWrappedInitializer(declaration)) {
|
|
355
|
+
continue;
|
|
356
|
+
}
|
|
357
|
+
const localIdentifier = t.identifier(DEFAULT_EXPORT_LOCAL_IDENTIFIER);
|
|
358
|
+
const wrappedValue = createAutoWrapCall(declaration, undefined, scope, fallbackName);
|
|
359
|
+
const replacementStatements = [
|
|
360
|
+
t.variableDeclaration('const', [
|
|
361
|
+
t.variableDeclarator(localIdentifier, wrappedValue),
|
|
362
|
+
]),
|
|
363
|
+
t.exportDefaultDeclaration(localIdentifier),
|
|
364
|
+
];
|
|
365
|
+
program.body.splice(index, 1, ...replacementStatements);
|
|
366
|
+
index += replacementStatements.length - 1;
|
|
367
|
+
modified = true;
|
|
368
|
+
}
|
|
369
|
+
if (!modified) {
|
|
370
|
+
return { code, modified: false, map: null };
|
|
371
|
+
}
|
|
372
|
+
if (autoWrapImportDeclaration) {
|
|
373
|
+
if (!hasAutoWrapImport) {
|
|
374
|
+
autoWrapImportDeclaration.specifiers.push(t.importSpecifier(t.identifier(AUTO_WRAP_IMPORT_NAME), t.identifier(AUTO_WRAP_IMPORT_NAME)));
|
|
375
|
+
}
|
|
376
|
+
}
|
|
377
|
+
else {
|
|
378
|
+
let insertIndex = 0;
|
|
379
|
+
while (insertIndex < program.body.length &&
|
|
380
|
+
t.isImportDeclaration(program.body[insertIndex])) {
|
|
381
|
+
insertIndex += 1;
|
|
382
|
+
}
|
|
383
|
+
program.body.splice(insertIndex, 0, t.importDeclaration([
|
|
384
|
+
t.importSpecifier(t.identifier(AUTO_WRAP_IMPORT_NAME), t.identifier(AUTO_WRAP_IMPORT_NAME)),
|
|
385
|
+
], t.stringLiteral(AUTO_WRAP_IMPORT_SOURCE)));
|
|
386
|
+
}
|
|
387
|
+
const output = generate(ast, {
|
|
388
|
+
jsescOption: { minimal: true },
|
|
389
|
+
sourceMaps: true,
|
|
390
|
+
sourceFileName: fileId,
|
|
391
|
+
}, code);
|
|
392
|
+
return {
|
|
393
|
+
code: output.code,
|
|
394
|
+
modified: true,
|
|
395
|
+
map: output.map ?? null,
|
|
396
|
+
};
|
|
397
|
+
}
|
|
@@ -1,11 +1,8 @@
|
|
|
1
1
|
import type { Plugin } from 'vite';
|
|
2
|
-
type
|
|
3
|
-
export interface
|
|
4
|
-
|
|
5
|
-
|
|
2
|
+
import { type AutoDiscoverIncludeMode } from './internal/autoDiscoverTransform';
|
|
3
|
+
export interface ReinspectAutoDiscoverPluginOptions {
|
|
4
|
+
include?: AutoDiscoverIncludeMode;
|
|
5
|
+
thirdPartyAllowlist?: readonly string[];
|
|
6
6
|
}
|
|
7
|
-
export declare function
|
|
8
|
-
export declare function transformModuleForAutoDiscover(code: string, fileId: string, scope: AutoDiscoverScope): AutoDiscoverTransformResult;
|
|
9
|
-
export declare function reinspectAutoDiscoverPlugin(): Plugin;
|
|
10
|
-
export {};
|
|
7
|
+
export declare function reinspectAutoDiscoverPlugin(options?: ReinspectAutoDiscoverPluginOptions): Plugin;
|
|
11
8
|
//# sourceMappingURL=reinspectAutoDiscoverPlugin.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"reinspectAutoDiscoverPlugin.d.ts","sourceRoot":"","sources":["../../src/plugin/reinspectAutoDiscoverPlugin.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"reinspectAutoDiscoverPlugin.d.ts","sourceRoot":"","sources":["../../src/plugin/reinspectAutoDiscoverPlugin.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,MAAM,CAAA;AAClC,OAAO,EAKL,KAAK,uBAAuB,EAC7B,MAAM,kCAAkC,CAAA;AAEzC,MAAM,WAAW,kCAAkC;IACjD,OAAO,CAAC,EAAE,uBAAuB,CAAA;IACjC,mBAAmB,CAAC,EAAE,SAAS,MAAM,EAAE,CAAA;CACxC;AAWD,wBAAgB,2BAA2B,CACzC,OAAO,CAAC,EAAE,kCAAkC,GAC3C,MAAM,CAqCR"}
|