network-terminal 1.0.6 → 1.0.8

package/src/vite-plugin.ts

@@ -1,88 +0,0 @@
-import type { Plugin } from 'vite';
-
-export interface NetworkTerminalPluginOptions {
-  /** Position of the terminal: 'top' or 'bottom' (default: 'bottom') */
-  position?: 'top' | 'bottom';
-  /** Maximum number of logs to keep (default: 100) */
-  maxLogs?: number;
-  /** Terminal height (default: '450px') */
-  height?: string;
-  /** CSS z-index (default: 9999) */
-  zIndex?: number;
-}
-
-const VIRTUAL_MODULE_ID = 'virtual:network-terminal';
-const RESOLVED_VIRTUAL_MODULE_ID = '\0' + VIRTUAL_MODULE_ID;
-
-export function networkTerminal(options: NetworkTerminalPluginOptions = {}): Plugin {
-  const {
-    position = 'bottom',
-    maxLogs = 100,
-    height = '450px',
-    zIndex = 9999,
-  } = options;
-
-  return {
-    name: 'vite-plugin-network-terminal',
-    apply: 'serve', // Only apply during development
-
-    resolveId(id) {
-      if (id === VIRTUAL_MODULE_ID) {
-        return RESOLVED_VIRTUAL_MODULE_ID;
-      }
-    },
-
-    load(id) {
-      if (id === RESOLVED_VIRTUAL_MODULE_ID) {
-        return `
-import React from 'react';
-import ReactDOM from 'react-dom/client';
-import { NetworkTerminal } from 'network-terminal';
-
-function initNetworkTerminal() {
-  const containerId = '__network-terminal-root__';
-  let container = document.getElementById(containerId);
-
-  if (!container) {
-    container = document.createElement('div');
-    container.id = containerId;
-    document.body.appendChild(container);
-  }
-
-  const root = ReactDOM.createRoot(container);
-  root.render(
-    React.createElement(NetworkTerminal, {
-      position: '${position}',
-      maxLogs: ${maxLogs},
-      height: '${height}',
-      zIndex: ${zIndex},
-      defaultVisible: false,
-    })
-  );
-}
-
-if (document.readyState === 'loading') {
-  document.addEventListener('DOMContentLoaded', initNetworkTerminal);
-} else {
-  initNetworkTerminal();
-}
-`;
-      }
-    },
-
-    transformIndexHtml(html) {
-      return {
-        html,
-        tags: [
-          {
-            tag: 'script',
-            attrs: { type: 'module', src: '/@id/__x00__virtual:network-terminal' },
-            injectTo: 'body',
-          },
-        ],
-      };
-    },
-  };
-}
-
-export default networkTerminal;

package/standalone/main.tsx

@@ -1,216 +0,0 @@
-import React, { useState } from 'react';
-import ReactDOM from 'react-dom/client';
-import { NetworkTerminal } from '../dist/index.mjs';
-
-const styles = {
-  container: {
-    padding: '40px',
-    maxWidth: '800px',
-    margin: '0 auto',
-  },
-  header: {
-    marginBottom: '40px',
-  },
-  title: {
-    fontSize: '32px',
-    fontWeight: 'bold',
-    color: '#4ade80',
-    fontFamily: 'monospace',
-    marginBottom: '8px',
-  },
-  subtitle: {
-    color: '#94a3b8',
-    fontSize: '16px',
-  },
-  section: {
-    background: '#1e293b',
-    borderRadius: '12px',
-    padding: '24px',
-    marginBottom: '24px',
-  },
-  sectionTitle: {
-    fontSize: '18px',
-    fontWeight: '600',
-    marginBottom: '16px',
-    color: '#f1f5f9',
-  },
-  buttonGroup: {
-    display: 'flex',
-    gap: '12px',
-    flexWrap: 'wrap' as const,
-  },
-  button: {
-    padding: '10px 20px',
-    borderRadius: '8px',
-    border: 'none',
-    cursor: 'pointer',
-    fontWeight: '500',
-    fontSize: '14px',
-    transition: 'all 0.2s',
-  },
-  getButton: {
-    background: '#22c55e',
-    color: '#000',
-  },
-  postButton: {
-    background: '#3b82f6',
-    color: '#fff',
-  },
-  putButton: {
-    background: '#f59e0b',
-    color: '#000',
-  },
-  deleteButton: {
-    background: '#ef4444',
-    color: '#fff',
-  },
-  errorButton: {
-    background: '#6b7280',
-    color: '#fff',
-  },
-  inputGroup: {
-    display: 'flex',
-    gap: '12px',
-    marginBottom: '16px',
-  },
-  input: {
-    flex: 1,
-    padding: '10px 16px',
-    borderRadius: '8px',
-    border: '1px solid #374151',
-    background: '#0f172a',
-    color: '#e2e8f0',
-    fontSize: '14px',
-  },
-  hint: {
-    marginTop: '24px',
-    padding: '16px',
-    background: '#0f172a',
-    borderRadius: '8px',
-    borderLeft: '4px solid #4ade80',
-  },
-  hintText: {
-    color: '#94a3b8',
-    fontSize: '14px',
-    fontFamily: 'monospace',
-  },
-  kbd: {
-    background: '#374151',
-    padding: '2px 8px',
-    borderRadius: '4px',
-    fontSize: '12px',
-    color: '#4ade80',
-  },
-};
-
-function App() {
-  const [customUrl, setCustomUrl] = useState('https://jsonplaceholder.typicode.com/posts/1');
-
-  const makeRequest = async (method: string, url: string, body?: object) => {
-    try {
-      const options: RequestInit = {
-        method,
-        headers: {
-          'Content-Type': 'application/json',
-        },
-      };
-      if (body) {
-        options.body = JSON.stringify(body);
-      }
-      await fetch(url, options);
-    } catch (error) {
-      console.error('Request failed:', error);
-    }
-  };
-
-  return (
-    <div style={styles.container}>
-      <div style={styles.header}>
-        <h1 style={styles.title}>&gt;_ Network Terminal</h1>
-        <p style={styles.subtitle}>Monitor your Fetch/XHR requests in real-time</p>
-      </div>
-
-      <div style={styles.section}>
-        <h2 style={styles.sectionTitle}>Quick Actions</h2>
-        <div style={styles.buttonGroup}>
-          <button
-            style={{ ...styles.button, ...styles.getButton }}
-            onClick={() => makeRequest('GET', 'https://jsonplaceholder.typicode.com/posts/1')}
-          >
-            GET Request
-          </button>
-          <button
-            style={{ ...styles.button, ...styles.postButton }}
-            onClick={() =>
-              makeRequest('POST', 'https://jsonplaceholder.typicode.com/posts', {
-                title: 'Test Post',
-                body: 'This is a test post body',
-                userId: 1,
-              })
-            }
-          >
-            POST Request
-          </button>
-          <button
-            style={{ ...styles.button, ...styles.putButton }}
-            onClick={() =>
-              makeRequest('PUT', 'https://jsonplaceholder.typicode.com/posts/1', {
-                id: 1,
-                title: 'Updated Title',
-                body: 'Updated body content',
-                userId: 1,
-              })
-            }
-          >
-            PUT Request
-          </button>
-          <button
-            style={{ ...styles.button, ...styles.deleteButton }}
-            onClick={() => makeRequest('DELETE', 'https://jsonplaceholder.typicode.com/posts/1')}
-          >
-            DELETE Request
-          </button>
-          <button
-            style={{ ...styles.button, ...styles.errorButton }}
-            onClick={() => makeRequest('GET', 'https://jsonplaceholder.typicode.com/invalid-endpoint')}
-          >
-            404 Error
-          </button>
-        </div>
-      </div>
-
-      <div style={styles.section}>
-        <h2 style={styles.sectionTitle}>Custom Request</h2>
-        <div style={styles.inputGroup}>
-          <input
-            type="text"
-            value={customUrl}
-            onChange={(e) => setCustomUrl(e.target.value)}
-            placeholder="Enter URL..."
-            style={styles.input}
-          />
-          <button
-            style={{ ...styles.button, ...styles.getButton }}
-            onClick={() => makeRequest('GET', customUrl)}
-          >
-            Send GET
-          </button>
-        </div>
-      </div>
-
-      <div style={styles.hint}>
-        <p style={styles.hintText}>
-          Press <span style={styles.kbd}>Ctrl+Shift+N</span> to toggle the Network Terminal
-        </p>
-      </div>
-
-      <NetworkTerminal defaultVisible={true} position="bottom" maxLogs={50} />
-    </div>
-  );
-}
-
-ReactDOM.createRoot(document.getElementById('root')!).render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>
-);

package/standalone/vite.config.js

@@ -1,22 +0,0 @@
-import { defineConfig } from 'vite';
-import react from '@vitejs/plugin-react';
-import path from 'path';
-import { fileURLToPath } from 'url';
-
-const __dirname = path.dirname(fileURLToPath(import.meta.url));
-const nodeModules = path.resolve(__dirname, '../node_modules');
-
-export default defineConfig({
-  plugins: [react()],
-  resolve: {
-    alias: {
-      'react': path.join(nodeModules, 'react'),
-      'react-dom': path.join(nodeModules, 'react-dom'),
-      'react/jsx-runtime': path.join(nodeModules, 'react/jsx-runtime'),
-      'react/jsx-dev-runtime': path.join(nodeModules, 'react/jsx-dev-runtime'),
-    },
-  },
-  optimizeDeps: {
-    include: ['react', 'react-dom', 'react-dom/client', 'react/jsx-runtime', 'react/jsx-dev-runtime'],
-  },
-});