npm - @cwcss/crosswind - Versions diffs - 0.1.5 → 0.1.6 - Mend

@cwcss/crosswind 0.1.5 → 0.1.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (86) hide show

package/LICENSE.md +21 -0
package/README.md +390 -0
package/dist/build.d.ts +24 -0
package/dist/config.d.ts +5 -0
package/dist/generator.d.ts +31 -0
package/dist/index.d.ts +10 -0
package/dist/index.js +12798 -0
package/dist/parser.d.ts +42 -0
package/dist/plugin.d.ts +22 -0
package/dist/preflight-forms.d.ts +5 -0
package/dist/preflight.d.ts +2 -0
package/dist/rules-advanced.d.ts +27 -0
package/dist/rules-effects.d.ts +25 -0
package/dist/rules-forms.d.ts +7 -0
package/dist/rules-grid.d.ts +13 -0
package/dist/rules-interactivity.d.ts +41 -0
package/dist/rules-layout.d.ts +26 -0
package/dist/rules-transforms.d.ts +33 -0
package/dist/rules-typography.d.ts +41 -0
package/dist/rules.d.ts +39 -0
package/dist/scanner.d.ts +18 -0
package/dist/transformer-compile-class.d.ts +37 -0
package/{src/types.ts → dist/types.d.ts} +17 -86
package/package.json +1 -1
package/PLUGIN.md +0 -235
package/benchmark/framework-comparison.bench.ts +0 -850
package/bin/cli.ts +0 -365
package/bin/crosswind +0 -0
package/bin/headwind +0 -0
package/build.ts +0 -8
package/crosswind.config.ts +0 -9
package/example/comprehensive.html +0 -70
package/example/index.html +0 -21
package/example/output.css +0 -236
package/examples/plugin/README.md +0 -112
package/examples/plugin/build.ts +0 -32
package/examples/plugin/src/index.html +0 -34
package/examples/plugin/src/index.ts +0 -7
package/headwind +0 -2
package/src/build.ts +0 -101
package/src/config.ts +0 -529
package/src/generator.ts +0 -2173
package/src/index.ts +0 -10
package/src/parser.ts +0 -1471
package/src/plugin.ts +0 -118
package/src/preflight-forms.ts +0 -229
package/src/preflight.ts +0 -388
package/src/rules-advanced.ts +0 -477
package/src/rules-effects.ts +0 -461
package/src/rules-forms.ts +0 -103
package/src/rules-grid.ts +0 -241
package/src/rules-interactivity.ts +0 -525
package/src/rules-layout.ts +0 -385
package/src/rules-transforms.ts +0 -412
package/src/rules-typography.ts +0 -486
package/src/rules.ts +0 -809
package/src/scanner.ts +0 -84
package/src/transformer-compile-class.ts +0 -275
package/test/advanced-features.test.ts +0 -911
package/test/arbitrary.test.ts +0 -396
package/test/attributify.test.ts +0 -592
package/test/bracket-syntax.test.ts +0 -1133
package/test/build.test.ts +0 -99
package/test/colors.test.ts +0 -934
package/test/flexbox.test.ts +0 -669
package/test/generator.test.ts +0 -597
package/test/grid.test.ts +0 -584
package/test/layout.test.ts +0 -404
package/test/modifiers.test.ts +0 -417
package/test/parser.test.ts +0 -564
package/test/performance-regression.test.ts +0 -376
package/test/performance.test.ts +0 -568
package/test/plugin.test.ts +0 -160
package/test/scanner.test.ts +0 -94
package/test/sizing.test.ts +0 -481
package/test/spacing.test.ts +0 -394
package/test/transformer-compile-class.test.ts +0 -287
package/test/transforms.test.ts +0 -448
package/test/typography.test.ts +0 -632
package/test/variants-form-states.test.ts +0 -225
package/test/variants-group-peer.test.ts +0 -66
package/test/variants-media.test.ts +0 -213
package/test/variants-positional.test.ts +0 -58
package/test/variants-pseudo-elements.test.ts +0 -47
package/test/variants-state.test.ts +0 -62
package/tsconfig.json +0 -18

package/PLUGIN.md DELETED Viewed

@@ -1,235 +0,0 @@
-# Crosswind Bun Plugin
-A Bun plugin that automatically generates and injects Crosswind CSS into your HTML files during the build process.
-## Installation
-```bash
-bun add @cwcss/crosswind
-```
-## Quick Start
-**1. Create your HTML file** (`src/template.html`):
-```html
-<!DOCTYPE html>
-<html>
-<head>
-  <title>My App</title>
-</head>
-<body>
-  <div class="flex items-center p-4 bg-blue-500 text-white rounded-lg">
-    <h1 class="text-2xl font-bold">Hello Crosswind!</h1>
-  </div>
-</body>
-</html>
-```
-**2. Import it in your TypeScript** (`src/index.ts`):
-```typescript
-import template from './template.html'
-// The HTML now has Crosswind CSS injected
-document.body.innerHTML = template
-```
-**3. Build with the plugin**:
-```typescript
-import { plugin } from '@cwcss/crosswind'
-await Bun.build({
-  entrypoints: ['./src/index.ts'],
-  outdir: './dist',
-  plugins: [plugin()],
-})
-```
-The plugin will automatically:
-- Scan the HTML for utility classes
-- Generate CSS for those classes
-- Inject the CSS into the `<head>` section
-## Configuration
-### Basic Configuration
-```typescript
-import { plugin } from '@cwcss/crosswind'
-await Bun.build({
-  entrypoints: ['./src/index.ts'],
-  outdir: './dist',
-  plugins: [
-    plugin({
-      includePreflight: true, // Include CSS reset (default: true)
-    }),
-  ],
-})
-```
-### Custom Theme
-```typescript
-import { plugin } from '@cwcss/crosswind'
-await Bun.build({
-  entrypoints: ['./src/index.ts'],
-  outdir: './dist',
-  plugins: [
-    plugin({
-      config: {
-        minify: true,
-        theme: {
-          colors: {
-            primary: '#3b82f6',
-            secondary: '#10b981',
-            danger: '#ef4444',
-          },
-          spacing: {
-            18: '4.5rem',
-            88: '22rem',
-          },
-        },
-        shortcuts: {
-          btn: 'px-4 py-2 rounded bg-primary text-white hover:bg-blue-600',
-          card: 'p-6 bg-white rounded-lg shadow-md',
-        },
-      },
-    }),
-  ],
-})
-```
-### Advanced Configuration
-```typescript
-import { plugin } from '@cwcss/crosswind'
-await Bun.build({
-  entrypoints: ['./src/index.ts'],
-  outdir: './dist',
-  plugins: [
-    plugin({
-      config: {
-        minify: true,
-        safelist: ['bg-red-500', 'text-green-500'], // Always include these
-        blocklist: ['debug-*'], // Never include these
-        theme: {
-          colors: {
-            brand: {
-              50: '#f0f9ff',
-              100: '#e0f2fe',
-              500: '#0ea5e9',
-              900: '#0c4a6e',
-            },
-          },
-        },
-        shortcuts: {
-          'btn-primary': 'px-4 py-2 rounded bg-brand-500 text-white hover:bg-brand-600',
-        },
-      },
-      includePreflight: true,
-    }),
-  ],
-})
-```
-## API Reference
-### `plugin(options?)`
-Creates a Crosswind Bun plugin instance.
-#### Options
-- **`config`** (`Partial<CrosswindConfig>`) - Custom Crosswind configuration
-  - `minify` - Minify the generated CSS
-  - `theme` - Custom theme (colors, spacing, fonts, etc.)
-  - `shortcuts` - Utility class shortcuts
-  - `safelist` - Classes to always include
-  - `blocklist` - Classes to never include
-  - `variants` - Enable/disable variants
-  - And more...
-- **`includePreflight`** (`boolean`) - Include preflight CSS (default: `true`)
-## How It Works
-1. The plugin registers an `onLoad` handler for `.html` files
-2. When Bun encounters an HTML import, the plugin intercepts it
-3. It extracts all utility classes from the HTML using Crosswind's parser
-4. It generates CSS for those classes using Crosswind's generator
-5. The CSS is injected into the `<head>` section
-6. The processed HTML is returned to the bundle
-## Use Cases
-- **SPAs**: Import HTML templates with automatic CSS generation
-- **Web Components**: Load component templates with scoped styles
-- **Static Sites**: Process HTML pages during build
-- **Email Templates**: Generate inline CSS for email HTML
-## Examples
-See the [examples/plugin](./examples/plugin) directory for a complete working example.
-## Comparison with CLI
-| Feature | Plugin | CLI |
-|---------|--------|-----|
-| Automatic CSS generation | ✅ | ✅ |
-| Watches files | ✅ (via Bun) | ✅ |
-| Injects CSS | ✅ | ❌ |
-| Separate CSS file | ❌ | ✅ |
-| Build integration | ✅ | ❌ |
-| Standalone usage | ❌ | ✅ |
-## Performance
-The plugin is highly performant:
-- Processes 1000 utilities in ~7ms
-- Minimal overhead in build process
-- Lazy loading - only processes imported HTML files
-## TypeScript Support
-The plugin is fully typed. Import the types:
-```typescript
-import type { CrosswindPluginOptions } from '@cwcss/crosswind'
-const options: CrosswindPluginOptions = {
-  config: {
-    minify: true,
-  },
-}
-```
-## Configuration File
-The plugin also respects `crosswind.config.ts` in your project root:
-```typescript
-// crosswind.config.ts
-import type { CrosswindOptions } from '@cwcss/crosswind'
-export default {
-  minify: true,
-  theme: {
-    colors: {
-      primary: '#3b82f6',
-    },
-  },
-} satisfies CrosswindOptions
-```
-The plugin will merge this config with any options passed to it.
-## License
-MIT