@cloudwick/astral-ui-cli 0.2.1 → 0.3.0

package/README.md

@@ -2,19 +2,30 @@
 
 A command-line tool for installing and managing Astral UI components in any codebase.
 
-## Installation
+## Usage
 
-```bash
-# Install globally with npm
-npm install -g @cloudwick/astral-ui-cli
+For most projects, we recommend using the CLI with `npx` or `yarn dlx` instead of installing it globally:
 
-# Install globally with yarn
-yarn global add @cloudwick/astral-ui-cli
-
-# Or run directly with npx/yarn without installing
+```bash
+# Using npx
 npx @cloudwick/astral-ui-cli init
 # or more simply:
 npx astral-ui init
+
+# Using yarn
+yarn dlx @cloudwick/astral-ui-cli init
+# or:
+yarn dlx astral-ui init
+```
+
+If you frequently use the CLI in your workflow, you can install it globally:
+
+```bash
+# Install globally with npm (only if needed)
+npm install -g @cloudwick/astral-ui-cli
+
+# Install globally with yarn (only if needed)
+yarn global add @cloudwick/astral-ui-cli
 ```
 
 ## Quick Start
@@ -39,10 +50,10 @@ import { keyboardKeys, mobileBreakPoint } from '@constants';
 
 For the best experience, follow these steps in order:
 
-1. **Initialize** your project with `astral-ui init`
-2. **Set up path aliases** using `astral-ui setup-aliases` and follow the instructions
-3. **Add components** with `astral-ui add [component...]`
-4. **Repair Tailwind** if needed with `astral-ui repair-tailwind`
+1. **Initialize** your project with `npx astral-ui init`
+2. **Set up path aliases** using `npx astral-ui setup-aliases` and follow the instructions
+3. **Add components** with `npx astral-ui add [component...]`
+4. **Repair Tailwind** if needed with `npx astral-ui repair-tailwind`
 5. **Import and use** components in your application
 
 ## Commands
@@ -52,7 +63,7 @@ For the best experience, follow these steps in order:
 Initialize a project with Astral Core configuration.
 
 ```bash
-astral-ui init
+npx astral-ui init
 ```
 
 This command will:
@@ -61,6 +72,8 @@ This command will:
 - Install Tailwind CSS if not already present
 - Add required configuration to existing Tailwind config or create a new one
 - Add utility functions
+- Add Inter font files for consistent typography
+- Set up font CSS for proper font rendering
 
 #### Options
 
@@ -77,7 +90,7 @@ This command will:
 Display instructions for setting up path aliases in your project.
 
 ```bash
-astral-ui setup-aliases
+npx astral-ui setup-aliases
 ```
 
 This command will:
@@ -97,10 +110,10 @@ This command will:
 
 ```bash
 # Generate instructions for current directory
-astral-ui setup-aliases
+npx astral-ui setup-aliases
 
 # Generate instructions for a specific project
-astral-ui setup-aliases --cwd ./my-project
+npx astral-ui setup-aliases --cwd ./my-project
 ```
 
 ### `add`
@@ -108,7 +121,7 @@ astral-ui setup-aliases --cwd ./my-project
 Add components to your project.
 
 ```bash
-astral-ui add [component...]
+npx astral-ui add [component...]
 ```
 
 #### Options
@@ -127,16 +140,16 @@ astral-ui add [component...]
 
 ```bash
 # Add specific components
-astral-ui add button card select
+npx astral-ui add button card select
 
 # Add all components
-astral-ui add --all
+npx astral-ui add --all
 
 # Add a component to a specific directory
-astral-ui add button --path ./components/custom
+npx astral-ui add button --path ./components/custom
 
 # Skip installing internal component dependencies
-astral-ui add button --skip-dependencies
+npx astral-ui add button --skip-dependencies
 ```
 
 ### `repair-tailwind`
@@ -144,7 +157,7 @@ astral-ui add button --skip-dependencies
 Repair Tailwind configuration when setup fails - only use if experiencing issues with Tailwind.
 
 ```bash
-astral-ui repair-tailwind
+npx astral-ui repair-tailwind
 ```
 
 This command will:
@@ -250,7 +263,7 @@ The `cn` function allows you to conditionally combine class names and automatica
 
 ## Styling Components
 
-The components in the registry require Tailwind CSS to be properly configured in your application. When you run `astral-ui init`, the CLI will:
+The components in the registry require Tailwind CSS to be properly configured in your application. When you run `npx astral-ui init`, the CLI will:
 
 1. Check for an existing Tailwind configuration and upgrade it with required settings
 2. Create a CSS file with required CSS variables for component styling
@@ -273,7 +286,6 @@ Required Tailwind features included in the configuration:
 - Color system with RGB variables for primary, secondary, success, warning, error, and gray scales
 - Custom box shadows for card components
 - Dark mode support ("class" mode for theme toggling)
-- Animation utilities via tailwindcss-animate plugin
 
 ### CSS Variables
 
@@ -294,7 +306,7 @@ If you're having problems with imports:
    - **Next.js**: Make sure you're using the correct import format for your Next.js version
    - **Angular**: Configure paths in tsconfig.app.json instead of tsconfig.json
    - **Create React App**: You'll need CRACO or similar to enable path aliases
-3. **Verify setup**: Run `astral-ui setup-aliases` again to get fresh instructions
+3. **Verify setup**: Run `npx astral-ui setup-aliases` again to get fresh instructions
 4. **Check components.json**: Make sure the paths in the "aliases" section match your project structure
 
 ### Styling Issues
@@ -304,57 +316,12 @@ If components don't appear correctly styled:
 1. Make sure the Tailwind CSS configuration is properly loaded in your application
 2. Verify the CSS variables are included in your main CSS file 
 3. Check that your component is properly importing the required utilities
-4. Run `astral-ui repair-tailwind` to create a fresh Tailwind configuration
+4. Run `npx astral-ui repair-tailwind` to create a fresh Tailwind configuration
 5. If you need to combine the new configuration with your existing customizations, use your backup file as a reference
 
-## Development
-
-### Setup
-
-```bash
-# Install dependencies
-yarn install
-```
+## Contributing
 
-### Building
-
-```bash
-# Build the CLI
-yarn build
-
-# Watch for changes and rebuild automatically
-yarn dev
-```
-
-### Linting
-
-```bash
-# Run both ESLint and Stylelint
-yarn lint
-
-# Run only ESLint for TypeScript
-yarn lint:js
-
-# Run only Stylelint for CSS/SCSS
-yarn lint:style
-
-# Fix auto-fixable ESLint issues
-yarn lint:fix
-```
-
-### Testing
-
-```bash
-# Run tests
-yarn test
-```
-
-### Utilities
-
-```bash
-# Copy CSS variables from the UI library
-yarn copy-css
-```
+For information on developing and contributing to the CLI, please see the [CONTRIBUTING.md](../../CONTRIBUTING.md) file in the root of the repository.
 
 ## License