@kickd0wn/react-dev-companion 0.1.0 → 0.2.0

package/README.md

@@ -1,7 +1,7 @@
 # React Dev Companion
 
 ![CI](https://img.shields.io/github/actions/workflow/status/Kickz1nn/react-dev-companion/ci.yml?branch=main)
-![npm bundle size](https://img.shields.io/bundlephobia/minzip/react-dev-companion)
+![npm bundle size](https://img.shields.io/bundlephobia/minzip/@kickd0wn/react-dev-companion)
 ![License](https://img.shields.io/github/license/Kickz1nn/react-dev-companion)
 ![GitHub issues](https://img.shields.io/github/issues/Kickz1nn/react-dev-companion)
 
@@ -12,9 +12,11 @@ React Dev Companion is an embeddable, zero-dependency developer tools panel for
 ## Features
 
 - **Real-Time API Interception:** Monitors outgoing `window.fetch` calls and logs HTTP methods, request status, and target URLs.
+- **Storage Inspector:** View, inject, and delete keys across `localStorage`, `sessionStorage`, and `cookies` in real time.
 - **Framework Agnostic Support:** Compatible with React SPA setups (Vite, CRA) and SSR frameworks (Next.js client components).
 - **Non-Intrusive Overlay:** Floating UI widget designed to stay out of the way of primary application elements.
 - **Zero Heavy Dependencies:** Lightweight footprint focused on developer experience and minimal bundle impact.
+- **TypeScript Native:** Fully typed with built-in `.d.ts` declarations.
 
 ---
 
@@ -23,13 +25,19 @@ React Dev Companion is an embeddable, zero-dependency developer tools panel for
 Install the package via `npm`, `yarn`, or `pnpm`:
 
 ```bash
-npm install react-dev-companion
+npm install @kickd0wn/react-dev-companion
 ```
 
 Or using yarn:
 
 ```bash
-yarn add react-dev-companion
+yarn add @kickd0wn/react-dev-companion
+```
+
+Or using pnpm:
+
+```bash
+pnpm add @kickd0wn/react-dev-companion
 ```
 
 ---
@@ -43,7 +51,7 @@ Import and render the component within your application tree. It is recommended
 ```tsx
 'use client';
 
-import { DevCompanion } from 'react-dev-companion';
+import { DevCompanion } from '@kickd0wn/react-dev-companion';
 
 export default function RootLayout({ children }: { children: React.ReactNode }) {
   return (
@@ -61,7 +69,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
 
 ```tsx
 import React from 'react';
-import { DevCompanion } from 'react-dev-companion';
+import { DevCompanion } from '@kickd0wn/react-dev-companion';
 
 export function App() {
   return (

package/dist/index.cjs

@@ -1,6 +1,34 @@
-(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("react")):typeof define==`function`&&define.amd?define([`exports`,`react`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.ReactDevCompanion={},e.React))})(this,function(e,t){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var n=Object.create,r=Object.defineProperty,i=Object.getOwnPropertyDescriptor,a=Object.getOwnPropertyNames,o=Object.getPrototypeOf,s=Object.prototype.hasOwnProperty,c=(e,t)=>()=>(t||(e((t={exports:{}}).exports,t,t.exports),e=null),t.exports),l=(e,t,n,o)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var c=a(t),l=0,u=c.length,d;l<u;l++)d=c[l],!s.call(e,d)&&d!==n&&r(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(o=i(t,d))||o.enumerable});return e};t=((e,t,i)=>(i=e==null?{}:n(o(e)),l(r(i,`default`,{value:e,enumerable:!0}),e)))(t,1);var u=e=>{let t=window.fetch;window.fetch=async(...n)=>{let[r,i]=n,a=typeof r==`string`?r:r instanceof Request?r.url:String(r),o=i?.method||`GET`,s={id:Math.random().toString(36).substring(2,9),url:a,method:o.toUpperCase(),timestamp:new Date().toLocaleTimeString()};try{let r=await t(...n);return s.status=r.status,e(s),r}catch(t){throw s.status=0,e(s),t}}},d=()=>{let e=[];for(let t=0;t<localStorage.length;t++){let n=localStorage.key(t);n&&e.push({key:n,value:localStorage.getItem(n)||``,type:`local`})}return e},f=()=>{let e=[];for(let t=0;t<sessionStorage.length;t++){let n=sessionStorage.key(t);n&&e.push({key:n,value:sessionStorage.getItem(n)||``,type:`session`})}return e},p=()=>document.cookie?document.cookie.split(`; `).map(e=>{let[t,...n]=e.split(`=`);return{key:t.trim(),value:decodeURIComponent(n.join(`=`)),type:`cookie`}}):[],m=(e,t)=>{t===`local`?localStorage.removeItem(e):t===`session`?sessionStorage.removeItem(e):t===`cookie`&&(document.cookie=`${e}=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;`)},h=(e,t,n)=>{n===`local`?localStorage.setItem(e,t):n===`session`?sessionStorage.setItem(e,t):n===`cookie`&&(document.cookie=`${e}=${encodeURIComponent(t)}; path=/;`)},g=c((e=>{var t=Symbol.for(`react.transitional.element`),n=Symbol.for(`react.fragment`);function r(e,n,r){var i=null;if(r!==void 0&&(i=``+r),n.key!==void 0&&(i=``+n.key),`key`in n)for(var a in r={},n)a!==`key`&&(r[a]=n[a]);else r=n;return n=r.ref,{$$typeof:t,type:e,key:i,ref:n===void 0?null:n,props:r}}e.Fragment=n,e.jsx=r,e.jsxs=r})),_=c((e=>{process.env.NODE_ENV!==`production`&&(function(){function t(e){if(e==null)return null;if(typeof e==`function`)return e.$$typeof===k?null:e.displayName||e.name||null;if(typeof e==`string`)return e;switch(e){case _:return`Fragment`;case y:return`Profiler`;case v:return`StrictMode`;case C:return`Suspense`;case w:return`SuspenseList`;case D:return`Activity`;case O:return`ViewTransition`}if(typeof e==`object`)switch(typeof e.tag==`number`&&console.error(`Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue.`),e.$$typeof){case g:return`Portal`;case x:return e.displayName||`Context`;case b:return(e._context.displayName||`Context`)+`.Consumer`;case S:var n=e.render;return e=e.displayName,e||=(e=n.displayName||n.name||``,e===``?`ForwardRef`:`ForwardRef(`+e+`)`),e;case T:return n=e.displayName||null,n===null?t(e.type)||`Memo`:n;case E:n=e._payload,e=e._init;try{return t(e(n))}catch{}}return null}function n(e){return``+e}function r(e){try{n(e);var t=!1}catch{t=!0}if(t){t=console;var r=t.error,i=typeof Symbol==`function`&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||`Object`;return r.call(t,`The provided key is an unsupported type %s. This value must be coerced to a string before using it here.`,i),n(e)}}function i(e){if(e===_)return`<>`;if(typeof e==`object`&&e&&e.$$typeof===E)return`<...>`;try{var n=t(e);return n?`<`+n+`>`:`<...>`}catch{return`<...>`}}function a(){var e=A.A;return e===null?null:e.getOwner()}function o(){return Error(`react-stack-top-frame`)}function s(e){if(j.call(e,`key`)){var t=Object.getOwnPropertyDescriptor(e,`key`).get;if(t&&t.isReactWarning)return!1}return e.key!==void 0}function c(e,t){function n(){P||(P=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",t))}n.isReactWarning=!0,Object.defineProperty(e,"key",{get:n,configurable:!0})}function l(){var e=t(this.type);return F[e]||(F[e]=!0,console.error(`Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.`)),e=this.props.ref,e===void 0?null:e}function u(e,t,n,r,i,a){var o=n.ref;return e={$$typeof:h,type:e,key:t,props:n,_owner:r},(o===void 0?null:o)===null?Object.defineProperty(e,"ref",{enumerable:!1,value:null}):Object.defineProperty(e,"ref",{enumerable:!1,get:l}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:i}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:a}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function d(e,n,i,o,l,d){var p=n.children;if(p!==void 0){if(o){if(M(p)){for(o=0;o<p.length;o++)f(p[o]);Object.freeze&&Object.freeze(p)}else console.error(`React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.`)}else f(p)}if(j.call(n,`key`)){p=t(e);var m=Object.keys(n).filter(function(e){return e!==`key`});o=0<m.length?`{key: someKey, `+m.join(`: ..., `)+`: ...}`:`{key: someKey}`,R[p+o]||(m=0<m.length?`{`+m.join(`: ..., `)+`: ...}`:`{}`,console.error(`A props object containing a "key" prop is being spread into JSX:
+(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("react")):typeof define==`function`&&define.amd?define([`exports`,`react`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.ReactDevCompanion={},e.React))})(this,function(e,t){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var n=Object.create,r=Object.defineProperty,i=Object.getOwnPropertyDescriptor,a=Object.getOwnPropertyNames,o=Object.getPrototypeOf,s=Object.prototype.hasOwnProperty,c=(e,t)=>()=>(t||(e((t={exports:{}}).exports,t,t.exports),e=null),t.exports),l=(e,t,n,o)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var c=a(t),l=0,u=c.length,d;l<u;l++)d=c[l],!s.call(e,d)&&d!==n&&r(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(o=i(t,d))||o.enumerable});return e};t=((e,t,i)=>(i=e==null?{}:n(o(e)),l(r(i,`default`,{value:e,enumerable:!0}),e)))(t,1);var u=!1,d={isOffline:!1,delayMs:0},f=e=>{if(u||typeof window>`u`)return;u=!0;let t=window.fetch;window.fetch=async(...n)=>{let r=performance.now(),i=Math.random().toString(36).substring(2,9),a=``,o=`GET`;if(typeof n[0]==`string`?a=n[0]:n[0]instanceof URL?a=n[0].toString():n[0]instanceof Request&&(a=n[0].url,o=n[0].method||`GET`),n[1]&&n[1].method&&(o=n[1].method.toUpperCase()),d.delayMs>0&&await new Promise(e=>setTimeout(e,d.delayMs)),d.isOffline){let t=performance.now();throw e({id:i,url:a,method:o,status:0,duration:Math.round(t-r),timestamp:new Date().toLocaleTimeString()}),TypeError(`Failed to fetch (Simulated Offline Mode)`)}try{let s=await t(...n),c=performance.now();return e({id:i,url:a,method:o,status:s.status,duration:Math.round(c-r),timestamp:new Date().toLocaleTimeString()}),s}catch(t){let n=performance.now();throw e({id:i,url:a,method:o,status:0,duration:Math.round(n-r),timestamp:new Date().toLocaleTimeString()}),t}}},p=()=>typeof document>`u`||!document.cookie?[]:document.cookie.split(`; `).map(e=>{let[t,...n]=e.split(`=`);return{key:t,value:decodeURIComponent(n.join(`=`))}}),m=(e,t,n=7)=>{if(typeof document>`u`)return;let r=new Date(Date.now()+n*864e5).toUTCString();document.cookie=`${encodeURIComponent(e)}=${encodeURIComponent(t)}; expires=${r}; path=/`},h=e=>{typeof document<`u`&&(document.cookie=`${encodeURIComponent(e)}=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/`)},g=e=>{let t={};e===`localStorage`?t={...localStorage}:e===`sessionStorage`?t={...sessionStorage}:e===`cookie`&&p().forEach(e=>{t[e.key]=e.value});let n={type:e,timestamp:new Date().toISOString(),data:t},r=new Blob([JSON.stringify(n,null,2)],{type:`application/json`}),i=URL.createObjectURL(r),a=document.createElement(`a`);a.href=i,a.download=`dev-companion-${e}-${Date.now()}.json`,a.click(),URL.revokeObjectURL(i)},_={bg:`#0f172a`,cardBg:`#1e293b`,hoverBg:`#334155`,border:`#334155`,borderSubtle:`#1e293b`,textPrimary:`#f8fafc`,textSecondary:`#94a3b8`,accent:`#0284c7`,accentHover:`#0369a1`,success:`#4ade80`,warning:`#facc15`,danger:`#f87171`,methodGet:`#38bdf8`,methodPost:`#4ade80`,methodPut:`#facc15`,methodDelete:`#f87171`},v=()=>{if(typeof document>`u`)return;let e=`dev-companion-custom-styles`;if(document.getElementById(e))return;let t=document.createElement(`style`);t.id=e,t.innerHTML=`
+    .dev-companion-scroll::-webkit-scrollbar {
+      width: 5px;
+      height: 5px;
+    }
+    .dev-companion-scroll::-webkit-scrollbar-track {
+      background: #0f172a;
+    }
+    .dev-companion-scroll::-webkit-scrollbar-thumb {
+      background: #334155;
+      border-radius: 4px;
+    }
+    .dev-companion-scroll::-webkit-scrollbar-thumb:hover {
+      background: #475569;
+    }
+    @keyframes devCompanionSlideUp {
+      from {
+        opacity: 0;
+        transform: translateY(8px) scale(0.98);
+      }
+      to {
+        opacity: 1;
+        transform: translateY(0) scale(1);
+      }
+    }
+    .dev-companion-panel-animate {
+      animation: devCompanionSlideUp 0.18s cubic-bezier(0.16, 1, 0.3, 1) forwards;
+    }
+  `,document.head.appendChild(t)},y=c((e=>{var t=Symbol.for(`react.transitional.element`),n=Symbol.for(`react.fragment`);function r(e,n,r){var i=null;if(r!==void 0&&(i=``+r),n.key!==void 0&&(i=``+n.key),`key`in n)for(var a in r={},n)a!==`key`&&(r[a]=n[a]);else r=n;return n=r.ref,{$$typeof:t,type:e,key:i,ref:n===void 0?null:n,props:r}}e.Fragment=n,e.jsx=r,e.jsxs=r})),b=c((e=>{process.env.NODE_ENV!==`production`&&(function(){function t(e){if(e==null)return null;if(typeof e==`function`)return e.$$typeof===k?null:e.displayName||e.name||null;if(typeof e==`string`)return e;switch(e){case _:return`Fragment`;case y:return`Profiler`;case v:return`StrictMode`;case C:return`Suspense`;case w:return`SuspenseList`;case D:return`Activity`;case O:return`ViewTransition`}if(typeof e==`object`)switch(typeof e.tag==`number`&&console.error(`Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue.`),e.$$typeof){case g:return`Portal`;case x:return e.displayName||`Context`;case b:return(e._context.displayName||`Context`)+`.Consumer`;case S:var n=e.render;return e=e.displayName,e||=(e=n.displayName||n.name||``,e===``?`ForwardRef`:`ForwardRef(`+e+`)`),e;case T:return n=e.displayName||null,n===null?t(e.type)||`Memo`:n;case E:n=e._payload,e=e._init;try{return t(e(n))}catch{}}return null}function n(e){return``+e}function r(e){try{n(e);var t=!1}catch{t=!0}if(t){t=console;var r=t.error,i=typeof Symbol==`function`&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||`Object`;return r.call(t,`The provided key is an unsupported type %s. This value must be coerced to a string before using it here.`,i),n(e)}}function i(e){if(e===_)return`<>`;if(typeof e==`object`&&e&&e.$$typeof===E)return`<...>`;try{var n=t(e);return n?`<`+n+`>`:`<...>`}catch{return`<...>`}}function a(){var e=A.A;return e===null?null:e.getOwner()}function o(){return Error(`react-stack-top-frame`)}function s(e){if(j.call(e,`key`)){var t=Object.getOwnPropertyDescriptor(e,`key`).get;if(t&&t.isReactWarning)return!1}return e.key!==void 0}function c(e,t){function n(){P||(P=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",t))}n.isReactWarning=!0,Object.defineProperty(e,"key",{get:n,configurable:!0})}function l(){var e=t(this.type);return F[e]||(F[e]=!0,console.error(`Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.`)),e=this.props.ref,e===void 0?null:e}function u(e,t,n,r,i,a){var o=n.ref;return e={$$typeof:h,type:e,key:t,props:n,_owner:r},(o===void 0?null:o)===null?Object.defineProperty(e,"ref",{enumerable:!1,value:null}):Object.defineProperty(e,"ref",{enumerable:!1,get:l}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:i}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:a}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function d(e,n,i,o,l,d){var p=n.children;if(p!==void 0){if(o){if(M(p)){for(o=0;o<p.length;o++)f(p[o]);Object.freeze&&Object.freeze(p)}else console.error(`React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.`)}else f(p)}if(j.call(n,`key`)){p=t(e);var m=Object.keys(n).filter(function(e){return e!==`key`});o=0<m.length?`{key: someKey, `+m.join(`: ..., `)+`: ...}`:`{key: someKey}`,R[p+o]||(m=0<m.length?`{`+m.join(`: ..., `)+`: ...}`:`{}`,console.error(`A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
-  <%s key={someKey} {...props} />`,o,p,m,p),R[p+o]=!0)}if(p=null,i!==void 0&&(r(i),p=``+i),s(n)&&(r(n.key),p=``+n.key),`key`in n)for(var h in i={},n)h!==`key`&&(i[h]=n[h]);else i=n;return p&&c(i,typeof e==`function`?e.displayName||e.name||`Unknown`:e),u(e,p,i,a(),l,d)}function f(e){p(e)?e._store&&(e._store.validated=1):typeof e==`object`&&e&&e.$$typeof===E&&(e._payload.status===`fulfilled`?p(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function p(e){return typeof e==`object`&&!!e&&e.$$typeof===h}var m=require("react"),h=Symbol.for(`react.transitional.element`),g=Symbol.for(`react.portal`),_=Symbol.for(`react.fragment`),v=Symbol.for(`react.strict_mode`),y=Symbol.for(`react.profiler`),b=Symbol.for(`react.consumer`),x=Symbol.for(`react.context`),S=Symbol.for(`react.forward_ref`),C=Symbol.for(`react.suspense`),w=Symbol.for(`react.suspense_list`),T=Symbol.for(`react.memo`),E=Symbol.for(`react.lazy`),D=Symbol.for(`react.activity`),O=Symbol.for(`react.view_transition`),k=Symbol.for(`react.client.reference`),A=m.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,j=Object.prototype.hasOwnProperty,M=Array.isArray,N=console.createTask?console.createTask:function(){return null};m={react_stack_bottom_frame:function(e){return e()}};var P,F={},I=m.react_stack_bottom_frame.bind(m,o)(),L=N(i(o)),R={};e.Fragment=_,e.jsx=function(e,t,n){var r=1e4>A.recentlyCreatedOwnerStacks++;if(r){var a=Error.stackTraceLimit;Error.stackTraceLimit=10;var o=Error(`react-stack-top-frame`);Error.stackTraceLimit=a}else o=I;return d(e,t,n,!1,o,r?N(i(e)):L)},e.jsxs=function(e,t,n){var r=1e4>A.recentlyCreatedOwnerStacks++;if(r){var a=Error.stackTraceLimit;Error.stackTraceLimit=10;var o=Error(`react-stack-top-frame`);Error.stackTraceLimit=a}else o=I;return d(e,t,n,!0,o,r?N(i(e)):L)}})()})),v=c(((e,t)=>{t.exports=process.env.NODE_ENV===`production`?g():_()}))(),y=()=>{let[e,n]=(0,t.useState)(`local`),[r,i]=(0,t.useState)([]),[a,o]=(0,t.useState)(``),[s,c]=(0,t.useState)(``),l=()=>{e===`local`?i(d()):e===`session`?i(f()):e===`cookie`&&i(p())};(0,t.useEffect)(()=>{l()},[e]);let u=t=>{m(t,e),l()};return(0,v.jsxs)(`div`,{style:{display:`flex`,flexDirection:`column`,gap:`10px`},children:[(0,v.jsx)(`div`,{style:{display:`flex`,gap:`6px`,borderBottom:`1px solid #334155`,paddingBottom:`6px`},children:[`local`,`session`,`cookie`].map(t=>(0,v.jsx)(`button`,{onClick:()=>n(t),style:{background:e===t?`#3b82f6`:`#1e293b`,color:`#fff`,border:`none`,padding:`4px 8px`,borderRadius:`4px`,fontSize:`11px`,cursor:`pointer`},children:t.toUpperCase()},t))}),(0,v.jsxs)(`form`,{onSubmit:t=>{t.preventDefault(),a.trim()&&(h(a.trim(),s.trim(),e),o(``),c(``),l())},style:{display:`flex`,gap:`4px`},children:[(0,v.jsx)(`input`,{placeholder:`Key`,value:a,onChange:e=>o(e.target.value),style:{flex:1,padding:`4px`,fontSize:`11px`,background:`#1e293b`,color:`#fff`,border:`1px solid #334155`,borderRadius:`4px`}}),(0,v.jsx)(`input`,{placeholder:`Value`,value:s,onChange:e=>c(e.target.value),style:{flex:1,padding:`4px`,fontSize:`11px`,background:`#1e293b`,color:`#fff`,border:`1px solid #334155`,borderRadius:`4px`}}),(0,v.jsx)(`button`,{type:`submit`,style:{background:`#22c55e`,color:`#fff`,border:`none`,padding:`4px 8px`,borderRadius:`4px`,fontSize:`11px`,cursor:`pointer`},children:`Add`})]}),(0,v.jsx)(`div`,{style:{maxHeight:`180px`,overflowY:`auto`},children:r.length===0?(0,v.jsx)(`p`,{style:{color:`#94a3b8`,fontSize:`12px`},children:`No items found.`}):r.map(e=>(0,v.jsxs)(`div`,{style:{display:`flex`,justifyContent:`space-between`,alignItems:`center`,padding:`4px 0`,borderBottom:`1px solid #1e293b`,fontSize:`11px`},children:[(0,v.jsxs)(`div`,{style:{overflow:`hidden`,textOverflow:`ellipsis`,whiteSpace:`nowrap`,maxWidth:`220px`},children:[(0,v.jsxs)(`strong`,{style:{color:`#38bdf8`},children:[e.key,`:`]}),` `,e.value]}),(0,v.jsx)(`button`,{onClick:()=>u(e.key),style:{background:`#ef4444`,color:`#fff`,border:`none`,padding:`2px 6px`,borderRadius:`4px`,fontSize:`10px`,cursor:`pointer`},children:`Del`})]},e.key))})]})};e.DevCompanion=()=>{let[e,n]=(0,t.useState)(!1),[r,i]=(0,t.useState)(`network`),[a,o]=(0,t.useState)([]);return(0,t.useEffect)(()=>{u(e=>{o(t=>[e,...t])})},[]),(0,v.jsxs)(`div`,{style:{position:`fixed`,bottom:16,right:16,zIndex:99999,fontFamily:`sans-serif`},children:[(0,v.jsxs)(`button`,{onClick:()=>n(!e),style:{background:`#1e293b`,color:`#fff`,border:`none`,padding:`10px 14px`,borderRadius:`8px`,cursor:`pointer`,fontWeight:`bold`,boxShadow:`0 4px 12px rgba(0,0,0,0.15)`},children:[`Dev Companion (`,a.length,`)`]}),e&&(0,v.jsxs)(`div`,{style:{position:`absolute`,bottom:50,right:0,width:380,height:340,background:`#0f172a`,color:`#f8fafc`,borderRadius:`8px`,padding:`12px`,boxShadow:`0 8px 24px rgba(0,0,0,0.3)`,display:`flex`,flexDirection:`column`},children:[(0,v.jsxs)(`div`,{style:{display:`flex`,gap:`8px`,borderBottom:`1px solid #334155`,paddingBottom:`8px`,marginBottom:`8px`},children:[(0,v.jsx)(`button`,{onClick:()=>i(`network`),style:{background:r===`network`?`#0284c7`:`#1e293b`,color:`#fff`,border:`none`,padding:`6px 12px`,borderRadius:`4px`,fontSize:`12px`,fontWeight:`bold`,cursor:`pointer`},children:`Network`}),(0,v.jsx)(`button`,{onClick:()=>i(`storage`),style:{background:r===`storage`?`#0284c7`:`#1e293b`,color:`#fff`,border:`none`,padding:`6px 12px`,borderRadius:`4px`,fontSize:`12px`,fontWeight:`bold`,cursor:`pointer`},children:`Storage`})]}),r===`network`?(0,v.jsx)(`div`,{style:{flex:1,overflowY:`auto`},children:a.length===0?(0,v.jsx)(`p`,{style:{color:`#94a3b8`,fontSize:`13px`},children:`No requests captured yet.`}):a.map(e=>(0,v.jsxs)(`div`,{style:{display:`flex`,justifyContent:`space-between`,padding:`6px 0`,borderBottom:`1px solid #1e293b`,fontSize:`12px`},children:[(0,v.jsxs)(`span`,{style:{fontWeight:`bold`,color:e.method===`GET`?`#38bdf8`:`#4ade80`},children:[`[`,e.method,`]`]}),(0,v.jsx)(`span`,{style:{overflow:`hidden`,textOverflow:`ellipsis`,whiteSpace:`nowrap`,maxWidth:`180px`},children:e.url}),(0,v.jsx)(`span`,{style:{color:e.status&&e.status>=400?`#f87171`:`#facc15`},children:e.status||`PENDING`})]},e.id))}):(0,v.jsx)(y,{})]})]})}});
+  <%s key={someKey} {...props} />`,o,p,m,p),R[p+o]=!0)}if(p=null,i!==void 0&&(r(i),p=``+i),s(n)&&(r(n.key),p=``+n.key),`key`in n)for(var h in i={},n)h!==`key`&&(i[h]=n[h]);else i=n;return p&&c(i,typeof e==`function`?e.displayName||e.name||`Unknown`:e),u(e,p,i,a(),l,d)}function f(e){p(e)?e._store&&(e._store.validated=1):typeof e==`object`&&e&&e.$$typeof===E&&(e._payload.status===`fulfilled`?p(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function p(e){return typeof e==`object`&&!!e&&e.$$typeof===h}var m=require("react"),h=Symbol.for(`react.transitional.element`),g=Symbol.for(`react.portal`),_=Symbol.for(`react.fragment`),v=Symbol.for(`react.strict_mode`),y=Symbol.for(`react.profiler`),b=Symbol.for(`react.consumer`),x=Symbol.for(`react.context`),S=Symbol.for(`react.forward_ref`),C=Symbol.for(`react.suspense`),w=Symbol.for(`react.suspense_list`),T=Symbol.for(`react.memo`),E=Symbol.for(`react.lazy`),D=Symbol.for(`react.activity`),O=Symbol.for(`react.view_transition`),k=Symbol.for(`react.client.reference`),A=m.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,j=Object.prototype.hasOwnProperty,M=Array.isArray,N=console.createTask?console.createTask:function(){return null};m={react_stack_bottom_frame:function(e){return e()}};var P,F={},I=m.react_stack_bottom_frame.bind(m,o)(),L=N(i(o)),R={};e.Fragment=_,e.jsx=function(e,t,n){var r=1e4>A.recentlyCreatedOwnerStacks++;if(r){var a=Error.stackTraceLimit;Error.stackTraceLimit=10;var o=Error(`react-stack-top-frame`);Error.stackTraceLimit=a}else o=I;return d(e,t,n,!1,o,r?N(i(e)):L)},e.jsxs=function(e,t,n){var r=1e4>A.recentlyCreatedOwnerStacks++;if(r){var a=Error.stackTraceLimit;Error.stackTraceLimit=10;var o=Error(`react-stack-top-frame`);Error.stackTraceLimit=a}else o=I;return d(e,t,n,!0,o,r?N(i(e)):L)}})()})),x=c(((e,t)=>{t.exports=process.env.NODE_ENV===`production`?y():b()}))(),S=()=>{let[e,n]=(0,t.useState)(`localStorage`),[r,i]=(0,t.useState)([]),[a,o]=(0,t.useState)(null),[s,c]=(0,t.useState)(``);(0,t.useEffect)(()=>{v()},[]);let l=()=>{if(typeof window>`u`)return;let t=[];if(e===`localStorage`)for(let e=0;e<localStorage.length;e++){let n=localStorage.key(e);n&&t.push({key:n,value:localStorage.getItem(n)||``})}else if(e===`sessionStorage`)for(let e=0;e<sessionStorage.length;e++){let n=sessionStorage.key(e);n&&t.push({key:n,value:sessionStorage.getItem(n)||``})}else e===`cookie`&&t.push(...p());i(t)};(0,t.useEffect)(()=>{l()},[e]);let u=t=>{e===`localStorage`?localStorage.setItem(t,s):e===`sessionStorage`?sessionStorage.setItem(t,s):e===`cookie`&&m(t,s),o(null),l()},d=t=>{e===`localStorage`?localStorage.removeItem(t):e===`sessionStorage`?sessionStorage.removeItem(t):e===`cookie`&&h(t),l()};return(0,x.jsxs)(`div`,{style:{display:`flex`,flexDirection:`column`,gap:`10px`,height:`100%`},children:[(0,x.jsxs)(`div`,{style:{display:`flex`,justifyContent:`space-between`,alignItems:`center`},children:[(0,x.jsx)(`div`,{style:{display:`flex`,gap:`4px`,background:_.cardBg,padding:`3px`,borderRadius:`6px`,border:`1px solid ${_.border}`},children:[`localStorage`,`sessionStorage`,`cookie`].map(t=>(0,x.jsx)(`button`,{onClick:()=>n(t),style:{padding:`4px 8px`,borderRadius:`4px`,border:`none`,background:e===t?_.accent:`transparent`,color:e===t?`#fff`:_.textSecondary,cursor:`pointer`,fontSize:`11px`,fontWeight:600,transition:`all 0.15s ease`},children:t===`localStorage`?`Local`:t===`sessionStorage`?`Session`:`Cookies`},t))}),(0,x.jsxs)(`div`,{style:{display:`flex`,gap:`6px`,alignItems:`center`},children:[(0,x.jsx)(`button`,{onClick:l,title:`Refresh storage data`,style:{padding:`5px 8px`,fontSize:`11px`,background:_.cardBg,color:_.accent,border:`1px solid ${_.border}`,borderRadius:`6px`,cursor:`pointer`,fontWeight:600},children:`↻ Refresh`}),(0,x.jsx)(`button`,{onClick:()=>g(e),style:{padding:`5px 9px`,fontSize:`11px`,background:_.cardBg,color:_.textPrimary,border:`1px solid ${_.border}`,borderRadius:`6px`,cursor:`pointer`,fontWeight:500},children:`Export`}),(0,x.jsxs)(`label`,{style:{padding:`5px 9px`,fontSize:`11px`,background:_.cardBg,color:_.textPrimary,border:`1px solid ${_.border}`,borderRadius:`6px`,cursor:`pointer`,fontWeight:500},children:[`Import`,(0,x.jsx)(`input`,{type:`file`,accept:`.json`,onChange:t=>{let n=t.target.files?.[0];if(!n)return;let r=new FileReader;r.onload=t=>{try{let n=JSON.parse(t.target?.result);n&&n.data&&(Object.entries(n.data).forEach(([t,n])=>{let r=typeof n==`string`?n:JSON.stringify(n);e===`localStorage`&&localStorage.setItem(t,r),e===`sessionStorage`&&sessionStorage.setItem(t,r),e===`cookie`&&m(t,r)}),l())}catch(e){console.error(`[DevCompanion] Failed to import JSON:`,e)}},r.readAsText(n)},style:{display:`none`}})]})]})]}),(0,x.jsx)(`div`,{className:`dev-companion-scroll`,style:{flex:1,overflowY:`auto`,background:_.cardBg,borderRadius:`6px`,border:`1px solid ${_.border}`},children:r.length===0?(0,x.jsxs)(`p`,{style:{color:_.textSecondary,fontSize:`12px`,textAlign:`center`,padding:`24px 0`},children:[`No items found in `,e,`.`]}):(0,x.jsxs)(`table`,{style:{width:`100%`,borderCollapse:`collapse`,fontSize:`11px`,color:_.textPrimary},children:[(0,x.jsx)(`thead`,{children:(0,x.jsxs)(`tr`,{style:{borderBottom:`1px solid ${_.border}`,textAlign:`left`,background:_.bg,color:_.textSecondary},children:[(0,x.jsx)(`th`,{style:{padding:`8px`,width:`35%`},children:`Key`}),(0,x.jsx)(`th`,{style:{padding:`8px`},children:`Value`}),(0,x.jsx)(`th`,{style:{padding:`8px`,width:`80px`,textAlign:`right`},children:`Actions`})]})}),(0,x.jsx)(`tbody`,{children:r.map(e=>(0,x.jsxs)(`tr`,{style:{borderBottom:`1px solid ${_.borderSubtle}`},children:[(0,x.jsx)(`td`,{style:{padding:`8px`,fontWeight:600,color:_.methodGet,fontFamily:`monospace`,wordBreak:`break-all`},children:e.key}),(0,x.jsx)(`td`,{style:{padding:`8px`},children:a===e.key?(0,x.jsx)(`input`,{value:s,onChange:e=>c(e.target.value),style:{width:`100%`,background:_.bg,color:_.textPrimary,border:`1px solid ${_.accent}`,borderRadius:`4px`,padding:`3px 6px`,fontSize:`11px`,outline:`none`}}):(0,x.jsx)(`span`,{style:{wordBreak:`break-all`,fontFamily:`monospace`,color:_.textSecondary},children:e.value})}),(0,x.jsxs)(`td`,{style:{padding:`8px`,textAlign:`right`},children:[a===e.key?(0,x.jsx)(`button`,{onClick:()=>u(e.key),style:{color:_.success,background:`none`,border:`none`,cursor:`pointer`,fontWeight:600,marginRight:`6px`},children:`Save`}):(0,x.jsx)(`button`,{onClick:()=>{o(e.key),c(e.value)},style:{color:_.warning,background:`none`,border:`none`,cursor:`pointer`,marginRight:`6px`},children:`Edit`}),(0,x.jsx)(`button`,{onClick:()=>d(e.key),style:{color:_.danger,background:`none`,border:`none`,cursor:`pointer`},children:`Del`})]})]},e.key))})]})})]})},C=({logs:e=[],onClear:n})=>{let[r,i]=(0,t.useState)(``),[a,o]=(0,t.useState)(`ALL`),[s,c]=(0,t.useState)(d.isOffline),[l,u]=(0,t.useState)(d.delayMs),[f,p]=(0,t.useState)(null);(0,t.useEffect)(()=>{v()},[]);let m=()=>{let e=!s;c(e),d.isOffline=e},h=e=>{u(e),d.delayMs=e},g=e.filter(e=>{if(!e||!e.url)return!1;let t=e.url.toLowerCase().includes((r||``).toLowerCase()),n=a===`ALL`||e.method===a;return t&&n}),y=e=>{let t=`curl -X ${e.method} "${e.url}"`;navigator.clipboard.writeText(t),p(e.id),setTimeout(()=>p(null),1500)},b=e=>{switch(e?.toUpperCase()){case`GET`:return _.methodGet;case`POST`:return _.methodPost;case`PUT`:return _.methodPut;case`DELETE`:return _.methodDelete;default:return _.textPrimary}};return(0,x.jsxs)(`div`,{style:{display:`flex`,flexDirection:`column`,gap:`10px`,height:`100%`},children:[(0,x.jsxs)(`div`,{style:{display:`flex`,alignItems:`center`,justifyContent:`space-between`,background:_.cardBg,padding:`8px 10px`,borderRadius:`6px`,fontSize:`11px`,border:`1px solid ${_.borderSubtle}`,flexShrink:0},children:[(0,x.jsxs)(`label`,{style:{display:`flex`,alignItems:`center`,gap:`6px`,cursor:`pointer`,color:s?_.danger:_.textSecondary,fontWeight:500},children:[(0,x.jsx)(`input`,{type:`checkbox`,checked:s,onChange:m,style:{accentColor:_.danger}}),`Offline Mode`]}),(0,x.jsxs)(`div`,{style:{display:`flex`,alignItems:`center`,gap:`6px`},children:[(0,x.jsx)(`span`,{style:{color:_.textSecondary},children:`Delay:`}),(0,x.jsxs)(`select`,{value:l,onChange:e=>h(Number(e.target.value)),style:{background:_.bg,color:_.textPrimary,border:`1px solid ${_.border}`,borderRadius:`4px`,padding:`2px 6px`,fontSize:`11px`,outline:`none`,cursor:`pointer`},children:[(0,x.jsx)(`option`,{value:0,children:`None (0ms)`}),(0,x.jsx)(`option`,{value:500,children:`Fast 3G (500ms)`}),(0,x.jsx)(`option`,{value:2e3,children:`Slow 3G (2s)`})]})]})]}),(0,x.jsxs)(`div`,{style:{display:`flex`,gap:`8px`,flexShrink:0,alignItems:`center`},children:[(0,x.jsx)(`input`,{type:`text`,placeholder:`Filter URL...`,value:r,onChange:e=>i(e.target.value),style:{flex:1,background:_.cardBg,color:_.textPrimary,border:`1px solid ${_.border}`,borderRadius:`6px`,padding:`6px 10px`,fontSize:`12px`,outline:`none`}}),(0,x.jsxs)(`select`,{value:a,onChange:e=>o(e.target.value),style:{background:_.cardBg,color:_.textPrimary,border:`1px solid ${_.border}`,borderRadius:`6px`,padding:`6px 8px`,fontSize:`12px`,outline:`none`,cursor:`pointer`},children:[(0,x.jsx)(`option`,{value:`ALL`,children:`ALL`}),(0,x.jsx)(`option`,{value:`GET`,children:`GET`}),(0,x.jsx)(`option`,{value:`POST`,children:`POST`}),(0,x.jsx)(`option`,{value:`PUT`,children:`PUT`}),(0,x.jsx)(`option`,{value:`DELETE`,children:`DELETE`})]}),n&&(0,x.jsx)(`button`,{onClick:n,title:`Clear request history`,style:{padding:`6px 10px`,fontSize:`11px`,background:_.cardBg,color:_.textSecondary,border:`1px solid ${_.border}`,borderRadius:`6px`,cursor:`pointer`,fontWeight:600},children:`Clear`})]}),(0,x.jsx)(`div`,{className:`dev-companion-scroll`,style:{flex:1,overflowY:`auto`,display:`flex`,flexDirection:`column`,gap:`4px`,paddingRight:`2px`},children:g.length===0?(0,x.jsx)(`p`,{style:{color:_.textSecondary,fontSize:`12px`,textAlign:`center`,marginTop:`24px`},children:`No requests captured.`}):g.map(e=>{let t=!e.status||e.status>=400?_.danger:_.success;return(0,x.jsxs)(`div`,{style:{display:`flex`,alignItems:`center`,justifyContent:`space-between`,padding:`8px 10px`,background:_.cardBg,borderRadius:`6px`,border:`1px solid ${_.borderSubtle}`,fontSize:`12px`,flexShrink:0},children:[(0,x.jsxs)(`div`,{style:{display:`flex`,alignItems:`center`,gap:`8px`,overflow:`hidden`},children:[(0,x.jsx)(`span`,{style:{fontWeight:700,color:b(e.method),fontSize:`11px`,background:_.bg,padding:`2px 6px`,borderRadius:`4px`,border:`1px solid ${_.border}`,minWidth:`45px`,textAlign:`center`},children:e.method}),(0,x.jsx)(`span`,{title:e.url,style:{overflow:`hidden`,textOverflow:`ellipsis`,whiteSpace:`nowrap`,maxWidth:`170px`,color:_.textPrimary,fontFamily:`monospace`,fontSize:`11px`},children:e.url})]}),(0,x.jsxs)(`div`,{style:{display:`flex`,alignItems:`center`,gap:`8px`,flexShrink:0},children:[e.duration!==void 0&&(0,x.jsxs)(`span`,{style:{color:_.textSecondary,fontSize:`10px`,fontFamily:`monospace`},children:[e.duration,`ms`]}),(0,x.jsx)(`span`,{style:{color:t,fontWeight:700,fontSize:`11px`,background:`${t}15`,padding:`2px 6px`,borderRadius:`4px`},children:e.status||`ERR`}),(0,x.jsx)(`button`,{onClick:()=>y(e),title:`Copy cURL`,style:{background:f===e.id?_.success:_.hoverBg,color:f===e.id?`#000`:_.textPrimary,border:`none`,borderRadius:`4px`,padding:`3px 8px`,fontSize:`10px`,fontWeight:600,cursor:`pointer`,transition:`all 0.15s ease`},children:f===e.id?`Copied!`:`cURL`})]})]},e.id)})})]})},w=(e,n)=>{(0,t.useEffect)(()=>{let t=t=>{let r=!e.ctrlOrCmd||t.metaKey||t.ctrlKey,i=!e.shift||t.shiftKey,a=t.key.toLowerCase()===e.key.toLowerCase();r&&i&&a&&(t.preventDefault(),n())};return window.addEventListener(`keydown`,t),()=>window.removeEventListener(`keydown`,t)},[e,n])};e.DevCompanion=({position:e=`bottom-right`})=>{let[n,r]=(0,t.useState)(!1),[i,a]=(0,t.useState)(`network`),[o,s]=(0,t.useState)([]);(0,t.useEffect)(()=>{v()},[]),w({key:`d`,ctrlOrCmd:!0,shift:!0},()=>{r(e=>!e)}),(0,t.useEffect)(()=>{f(e=>{s(t=>[e,...t])})},[]);let c=(()=>{switch(e){case`bottom-left`:return{bottom:16,left:16};case`top-right`:return{top:16,right:16};case`top-left`:return{top:16,left:16};default:return{bottom:16,right:16}}})();return(0,x.jsxs)(`div`,{style:{position:`fixed`,...c,zIndex:99999,fontFamily:`system-ui, -apple-system, sans-serif`},children:[(0,x.jsxs)(`button`,{onClick:()=>r(!n),title:`Shortcut: Ctrl + Shift + D`,style:{background:_.bg,color:_.textPrimary,border:`1px solid ${_.border}`,padding:`8px 14px`,borderRadius:`20px`,cursor:`pointer`,fontWeight:600,fontSize:`12px`,display:`flex`,alignItems:`center`,gap:`8px`,boxShadow:`0 4px 20px rgba(0,0,0,0.35)`,transition:`transform 0.15s ease`},children:[(0,x.jsx)(`span`,{style:{color:_.accent},children:`⚡`}),` DevCompanion`,o.length>0&&(0,x.jsx)(`span`,{style:{background:_.accent,color:`#fff`,fontSize:`10px`,padding:`2px 6px`,borderRadius:`10px`,fontWeight:700},children:o.length})]}),n&&(0,x.jsxs)(`div`,{className:`dev-companion-panel-animate`,style:{position:`absolute`,...c.bottom===void 0?{top:50}:{bottom:50},...c.right===void 0?{left:0}:{right:0},width:440,height:400,background:_.bg,color:_.textPrimary,borderRadius:`10px`,padding:`12px`,border:`1px solid ${_.border}`,boxShadow:`0 12px 32px rgba(0,0,0,0.5)`,display:`flex`,flexDirection:`column`},children:[(0,x.jsxs)(`div`,{style:{display:`flex`,justifyContent:`space-between`,alignItems:`center`,borderBottom:`1px solid ${_.border}`,paddingBottom:`8px`,marginBottom:`10px`},children:[(0,x.jsxs)(`div`,{style:{display:`flex`,gap:`6px`},children:[(0,x.jsx)(`button`,{onClick:()=>a(`network`),style:{background:i===`network`?_.accent:`transparent`,color:i===`network`?`#fff`:_.textSecondary,border:`none`,padding:`5px 12px`,borderRadius:`6px`,fontSize:`12px`,fontWeight:600,cursor:`pointer`,transition:`all 0.15s ease`},children:`Network`}),(0,x.jsx)(`button`,{onClick:()=>a(`storage`),style:{background:i===`storage`?_.accent:`transparent`,color:i===`storage`?`#fff`:_.textSecondary,border:`none`,padding:`5px 12px`,borderRadius:`6px`,fontSize:`12px`,fontWeight:600,cursor:`pointer`,transition:`all 0.15s ease`},children:`Storage`})]}),(0,x.jsx)(`span`,{style:{fontSize:`10px`,color:_.textSecondary,fontFamily:`monospace`},children:`Ctrl+Shift+D`})]}),(0,x.jsx)(`div`,{style:{flex:1,overflow:`hidden`},children:i===`network`?(0,x.jsx)(C,{logs:o,onClear:()=>s([])}):(0,x.jsx)(S,{})})]})]})}});