codingwithagent 1.0.0 → 1.1.1

package/templates/antigravity/minimal/.agent/rules/code-quality.md

@@ -1,86 +1,86 @@
----
-trigger: always_on
----
-
-# Code Quality Essentials
-
-## Naming Conventions
-
-- Variables & functions: `camelCase` (getUserData, isValid)
-- Components: `PascalCase` (UserProfile, Button)
-- Constants: `UPPER_SNAKE_CASE` (MAX_RETRIES, API_URL)
-- Be descriptive: `isUserAuthenticated` not `isAuth`
-
-## JavaScript Basics
-
-- Use `const` by default, `let` only when reassigning
-- Never use `var`
-- Use arrow functions for callbacks
-- Remove `console.log` before committing
-- Use template literals: \`Hello ${name}\` not "Hello " + name
-
-## Functions
-
-- Keep functions small (under 50 lines)
-- Functions should do one thing
-- Use descriptive names that explain what they do
-- Avoid deeply nested code (max 3 levels)
-
-## Code Organization
-
-- One component per file
-- Group related files in folders
-- Import order: React, libraries, local files
-- Remove unused imports and code
-
-## Common Patterns
-
-### Good Practices
-
-```javascript
-// Destructure props
-const Button = ({ onClick, label }) => (
-  <button onClick={onClick}>{label}</button>
-);
-
-// Use early returns
-const getStatus = (user) => {
-  if (!user) return "guest";
-  if (user.isPremium) return "premium";
-  return "standard";
-};
-
-// Named functions for handlers
-const handleClick = () => {
-  console.log("clicked");
-};
-```
-
-### Avoid
-
-```javascript
-// Don't access props directly
-const Button = (props) => (
-  <button onClick={props.onClick}>{props.label}</button>
-);
-
-// Don't use anonymous functions in JSX
-<button onClick={() => handleClick()}>Click</button>;
-
-// Don't nest too deeply
-if (condition1) {
-  if (condition2) {
-    if (condition3) {
-      // too deep!
-    }
-  }
-}
-```
-
-## Quick Checklist
-
-- [] Descriptive variable name?
-- [] Functions under 50 lines?
-- [] No console.log statements?
-- [] Imports organized?
-- [] Dead code removed?
+---
+trigger: always_on
+---
+
+# Code Quality Essentials
+
+## Naming Conventions
+
+- Variables & functions: `camelCase` (getUserData, isValid)
+- Components: `PascalCase` (UserProfile, Button)
+- Constants: `UPPER_SNAKE_CASE` (MAX_RETRIES, API_URL)
+- Be descriptive: `isUserAuthenticated` not `isAuth`
+
+## JavaScript Basics
+
+- Use `const` by default, `let` only when reassigning
+- Never use `var`
+- Use arrow functions for callbacks
+- Remove `console.log` before committing
+- Use template literals: \`Hello ${name}\` not "Hello " + name
+
+## Functions
+
+- Keep functions small (under 50 lines)
+- Functions should do one thing
+- Use descriptive names that explain what they do
+- Avoid deeply nested code (max 3 levels)
+
+## Code Organization
+
+- One component per file
+- Group related files in folders
+- Import order: React, libraries, local files
+- Remove unused imports and code
+
+## Common Patterns
+
+### Good Practices
+
+```javascript
+// Destructure props
+const Button = ({ onClick, label }) => (
+  <button onClick={onClick}>{label}</button>
+);
+
+// Use early returns
+const getStatus = (user) => {
+  if (!user) return "guest";
+  if (user.isPremium) return "premium";
+  return "standard";
+};
+
+// Named functions for handlers
+const handleClick = () => {
+  console.log("clicked");
+};
+```
+
+### Avoid
+
+```javascript
+// Don't access props directly
+const Button = (props) => (
+  <button onClick={props.onClick}>{props.label}</button>
+);
+
+// Don't use anonymous functions in JSX
+<button onClick={() => handleClick()}>Click</button>;
+
+// Don't nest too deeply
+if (condition1) {
+  if (condition2) {
+    if (condition3) {
+      // too deep!
+    }
+  }
+}
+```
+
+## Quick Checklist
+
+- [] Descriptive variable name?
+- [] Functions under 50 lines?
+- [] No console.log statements?
+- [] Imports organized?
+- [] Dead code removed?

package/templates/antigravity/minimal/.agent/rules/react-components.md

@@ -1,164 +1,164 @@
----
-trigger: always_on
----
-
-# React Component Basics
-
-## Component Structure
-
-- Use functional components with hooks (not class components)
-- Destructure props at function signature
-- Keep components under 200 lines
-- One component per file
-
-## Props
-
-````javascript
-// Good: Destructure props
-const UserCard = ({name, email, onEdit}) => (
-  <div>
-    <h2>{name}</h2>
-    <p>{email}</p>
-    <button onClick={onEdit}>Edit</button>
-  </div>
-);
-
-// Bad: Using props object
-const UserCard = (props) => (
-  <div>
-    <h2>{props.name}</h2>
-    <p>{props.email}</p>
-    <button onClick={props.onEdit}>Edit</button>
-  </div>
-);
-
-## Hooks Basic
-
-### useState
-Use for local UI state only (modals, toggles, input values)
-```javascript
-const [isOpen, setIsOpen] = useState(false);
-const [count, setCount] = useState(0);
-````
-
-### useEffect
-
-Use for side effects (API calls, subscriptions, timers)
-
-```javascript
-useEffect(() => {
-  // Do something
-  fetchData();
-
-  // Cleanup (optional)
-  return () => cleanup();
-}, [dependencies]); // Don't forget dependencies!
-```
-
-### useCallback
-
-Prevent function recreation on every render
-
-```javascript
-const handleClick = useCallback(() => {
-  doSomething();
-}, [dependencies]);
-```
-
-## JSX Best Practices
-
-- Use semantic HTML (button, nav, header, footer)
-- No anonymous functions in JSX: onClick={handleClick} not onClick={() => handleClick()}
-- Keys must be from data, not array index: key={item.id} not key={index}
-- Use fragments <></> instead of unnecessary divs
-- Conditional rendering: use boolean values only
-
-## Common Patterns
-
-### Event Handlers
-
-```javascript
-// Good: Named function
-const handleSubmit = (e) => {
-  e.preventDefault();
-  submitForm();
-};
-
-<form onSubmit={handleSubmit}>
-
-// Bad: Anonymous function
-<form onSubmit={(e) => {
-  e.preventDefault();
-  submitForm();
-}}>
-```
-
-### Conditional Rendering
-
-```javascript
-// Good: Boolean condition
-{
-  isLoggedIn && <Dashboard />;
-}
-
-// Good: Ternary for two states
-{
-  isLoading ? <Spinner /> : <Content />;
-}
-
-// Bad: Can accidentally render "0"
-{
-  count && <Display />;
-}
-```
-
-### Lists
-
-```javascript
-// Good: Key from data
-{
-  users.map((user) => <UserCard key={user.id} {...user} />);
-}
-
-// Bad: Index as key
-{
-  users.map((user, index) => <UserCard key={index} {...user} />);
-}
-```
-
-### Component Organization
-
-```javascript
-const MyComponent = ({ prop1, prop2 }) => {
-  // 1. Hooks
-  const [state, setState] = useState();
-
-  // 2. Event handlers
-  const handleClick = () => {
-    // handle click
-  };
-
-  // 3. Early returns
-  if (!prop1) return null;
-
-  // 4. Render
-  return <div>{/* JSX here */}</div>;
-};
-```
-
-## Avoid
-
-- Class components (use functional components)
-- Direct DOM manipulation (use refs sparingly)
-- Inline styles (use CSS/styled-components)
-- Prop drilling beyond 3 levels (use context or Redux)
-- Components over 200 lines (break them down)
-
-## Quick Checklist
-
-- [] Using functional components?
-- [] Props destructured?
-- [] Event handlers named?
-- [] Keys from data, not index?
-- [] Component under 200 lines?
-- [] useEffect has dependencies?
+---
+trigger: always_on
+---
+
+# React Component Basics
+
+## Component Structure
+
+- Use functional components with hooks (not class components)
+- Destructure props at function signature
+- Keep components under 200 lines
+- One component per file
+
+## Props
+
+````javascript
+// Good: Destructure props
+const UserCard = ({name, email, onEdit}) => (
+  <div>
+    <h2>{name}</h2>
+    <p>{email}</p>
+    <button onClick={onEdit}>Edit</button>
+  </div>
+);
+
+// Bad: Using props object
+const UserCard = (props) => (
+  <div>
+    <h2>{props.name}</h2>
+    <p>{props.email}</p>
+    <button onClick={props.onEdit}>Edit</button>
+  </div>
+);
+
+## Hooks Basic
+
+### useState
+Use for local UI state only (modals, toggles, input values)
+```javascript
+const [isOpen, setIsOpen] = useState(false);
+const [count, setCount] = useState(0);
+````
+
+### useEffect
+
+Use for side effects (API calls, subscriptions, timers)
+
+```javascript
+useEffect(() => {
+  // Do something
+  fetchData();
+
+  // Cleanup (optional)
+  return () => cleanup();
+}, [dependencies]); // Don't forget dependencies!
+```
+
+### useCallback
+
+Prevent function recreation on every render
+
+```javascript
+const handleClick = useCallback(() => {
+  doSomething();
+}, [dependencies]);
+```
+
+## JSX Best Practices
+
+- Use semantic HTML (button, nav, header, footer)
+- No anonymous functions in JSX: onClick={handleClick} not onClick={() => handleClick()}
+- Keys must be from data, not array index: key={item.id} not key={index}
+- Use fragments <></> instead of unnecessary divs
+- Conditional rendering: use boolean values only
+
+## Common Patterns
+
+### Event Handlers
+
+```javascript
+// Good: Named function
+const handleSubmit = (e) => {
+  e.preventDefault();
+  submitForm();
+};
+
+<form onSubmit={handleSubmit}>
+
+// Bad: Anonymous function
+<form onSubmit={(e) => {
+  e.preventDefault();
+  submitForm();
+}}>
+```
+
+### Conditional Rendering
+
+```javascript
+// Good: Boolean condition
+{
+  isLoggedIn && <Dashboard />;
+}
+
+// Good: Ternary for two states
+{
+  isLoading ? <Spinner /> : <Content />;
+}
+
+// Bad: Can accidentally render "0"
+{
+  count && <Display />;
+}
+```
+
+### Lists
+
+```javascript
+// Good: Key from data
+{
+  users.map((user) => <UserCard key={user.id} {...user} />);
+}
+
+// Bad: Index as key
+{
+  users.map((user, index) => <UserCard key={index} {...user} />);
+}
+```
+
+### Component Organization
+
+```javascript
+const MyComponent = ({ prop1, prop2 }) => {
+  // 1. Hooks
+  const [state, setState] = useState();
+
+  // 2. Event handlers
+  const handleClick = () => {
+    // handle click
+  };
+
+  // 3. Early returns
+  if (!prop1) return null;
+
+  // 4. Render
+  return <div>{/* JSX here */}</div>;
+};
+```
+
+## Avoid
+
+- Class components (use functional components)
+- Direct DOM manipulation (use refs sparingly)
+- Inline styles (use CSS/styled-components)
+- Prop drilling beyond 3 levels (use context or Redux)
+- Components over 200 lines (break them down)
+
+## Quick Checklist
+
+- [] Using functional components?
+- [] Props destructured?
+- [] Event handlers named?
+- [] Keys from data, not index?
+- [] Component under 200 lines?
+- [] useEffect has dependencies?

package/templates/antigravity/minimal/README.md

@@ -1,34 +1,34 @@
-# Antigravity - Minimal Profile
-
-Essential rules for Antigravity AI agent in modular format.
-
-## What's Included
-
-3 focused rule files:
-
-- `accessibility.md` - Basic a11y requirements
-- `code-quality.md` - Essential patterns
-- `react-components.md` - Component basics
-
-## Installation
-
-```bash
-npx codingwithagent init
-# Select tool: 3. Antigravity
-# Select profile: 1. Minimal
-```
-
-## Files created
-
-```
-.agent/rules/
-├── accessibility.md
-├── code-quality.md
-└── react-components.md
-```
-
-## Best for
-
-- Getting started with Antigravity
-- Small projects
-- Learning the basics
+# Antigravity - Minimal Profile
+
+Essential rules for Antigravity AI agent in modular format.
+
+## What's Included
+
+3 focused rule files:
+
+- `accessibility.md` - Basic a11y requirements
+- `code-quality.md` - Essential patterns
+- `react-components.md` - Component basics
+
+## Installation
+
+```bash
+npx codingwithagent init
+# Select tool: 3. Antigravity
+# Select profile: 1. Minimal
+```
+
+## Files created
+
+```
+.agent/rules/
+├── accessibility.md
+├── code-quality.md
+└── react-components.md
+```
+
+## Best for
+
+- Getting started with Antigravity
+- Small projects
+- Learning the basics