@vira-ui/cli 0.3.0-alpha → 0.3.1-alpha

package/dist/index.js

@@ -140,7 +140,12 @@ async function createProjectStructure(projectPath, template) {
         },
         devDependencies: {
             "@vira-ui/babel-plugin": "^0.3.0-alpha",
+            "@vitejs/plugin-react": "^4.2.0",
             "@types/node": "^20.10.0",
+            "@types/react": "^18.2.0",
+            "@types/react-dom": "^18.2.0",
+            "react": "^18.2.0",
+            "react-dom": "^18.2.0",
             "typescript": "^5.3.0",
             "vite": "^5.0.0",
         },
@@ -169,14 +174,14 @@ async function createProjectStructure(projectPath, template) {
     // vite.config.ts
     const viteConfig = `import { defineConfig } from 'vite';
 import react from '@vitejs/plugin-react';
-import vira from '@vira-ui/babel-plugin';
 
 export default defineConfig({
   plugins: [
     react({
-      babel: {
-        plugins: [vira],
-      },
+      // Babel plugins can be added here if needed
+      // babel: {
+      //   plugins: [['@vira-ui/babel-plugin', {}]],
+      // },
     }),
   ],
 });
@@ -197,22 +202,71 @@ export default defineConfig({
 </html>
 `;
     await fs.writeFile(path.join(projectPath, "index.html"), indexHtml);
+    // src/index.css
+    const indexCss = `* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+body {
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+#root {
+  min-height: 100vh;
+}
+`;
+    await fs.writeFile(path.join(projectPath, "src", "index.css"), indexCss);
     // src/main.tsx
-    const mainTsx = `import { render } from '@vira-ui/core';
+    const mainTsx = `import React from 'react';
+import ReactDOM from 'react-dom/client';
 import { App } from './App';
+import './index.css';
 
-const root = document.getElementById('root');
-if (root) {
-  render(<App />, root);
+const rootElement = document.getElementById('root');
+if (rootElement) {
+  ReactDOM.createRoot(rootElement).render(
+    React.createElement(React.StrictMode, null,
+      React.createElement(App)
+    )
+  );
 }
 `;
     await fs.writeFile(path.join(projectPath, "src", "main.tsx"), mainTsx);
     // src/App.tsx
-    const appTsx = `import { createElement } from '@vira-ui/core';
+    const appTsx = `import React from 'react';
+import { Button } from '@vira-ui/ui';
 
 export function App() {
-  return createElement('div', { className: 'app' }, 
-    createElement('h1', null, 'Welcome to Vira!')
+  return React.createElement('div', { 
+    style: { 
+      padding: '2rem',
+      maxWidth: '800px',
+      margin: '0 auto'
+    }
+  },
+    React.createElement('h1', { 
+      style: { 
+        fontSize: '2rem',
+        fontWeight: 'bold',
+        marginBottom: '1rem'
+      }
+    }, 'Welcome to Vira!'),
+    React.createElement('p', {
+      style: {
+        marginBottom: '1rem',
+        color: '#666'
+      }
+    }, 'Start building your amazing app with Vira UI.'),
+    React.createElement(Button, {
+      preset: 'primary',
+      onClick: () => alert('Hello from Vira!')
+    }, 'Get Started')
   );
 }
 `;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vira-ui/cli",
-  "version": "0.3.0-alpha",
+  "version": "0.3.1-alpha",
   "description": "CLI tool for ViraJS project generation",
   "author": "Vira Team",
   "license": "MIT",