CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-tailwindcss--oxide-darwin-arm64

macOS ARM64 native binary component for TailwindCSS Oxide high-performance CSS engine

—

Pending
Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

SecuritybySnyk

Pending

The risk profile of this skill

Overview
Eval results
Files

index.mddocs/

TailwindCSS Oxide Darwin ARM64

TailwindCSS Oxide Darwin ARM64 is the native binary component for macOS ARM64 (Apple Silicon) systems that provides high-performance CSS scanning and candidate extraction capabilities for TailwindCSS v4. This package contains the compiled Rust-based native binary that enables TailwindCSS to leverage native performance for file scanning, pattern matching, and CSS generation operations.

Package Information

  • Package Name: @tailwindcss/oxide-darwin-arm64
  • Package Type: npm (native binary)
  • Language: Rust (Node.js binding)
  • Platform: darwin (macOS)
  • Architecture: arm64 (Apple Silicon)
  • Installation: Automatically installed as optional dependency of @tailwindcss/oxide when running on compatible macOS ARM64 systems

Core Imports

This package contains only the native binary file (tailwindcss-oxide.darwin-arm64.node). The JavaScript API is provided by the main @tailwindcss/oxide package:

// The native binary is automatically loaded by the main package
const { Scanner } = require("@tailwindcss/oxide");

For ESM:

import { Scanner } from "@tailwindcss/oxide";

Basic Usage

import { Scanner } from "@tailwindcss/oxide";

// Initialize scanner with source patterns
const scanner = new Scanner({
  sources: [
    {
      base: "./src",
      pattern: "**/*.{js,jsx,ts,tsx,html}",
      negated: false
    }
  ]
});

// Scan for CSS candidates from configured sources
const candidates = scanner.scan();
console.log("Found candidates:", candidates);

// Scan specific content
const contentCandidates = scanner.scan_files([
  {
    file: null,
    content: '<div class="bg-blue-500 text-white p-4">Hello</div>',
    extension: "html"
  }
]);

Architecture

The native binary provides a high-performance Rust implementation that:

  • File System Operations: Fast recursive directory scanning and file reading
  • Pattern Matching: Efficient regex-based candidate extraction from file contents
  • Memory Management: Optimized memory usage for large codebases
  • Platform Integration: Seamless Node.js integration via napi-rs bindings
  • UTF-16 Handling: Proper position mapping for JavaScript string compatibility

Capabilities

Scanner Class

Core scanner class for extracting TailwindCSS candidates from files and content.

class Scanner {
  constructor(opts: ScannerOptions);
  scan(): string[];
  scan_files(input: ChangedContent[]): string[];
  get_candidates_with_positions(input: ChangedContent): CandidateWithPosition[];
  readonly files: string[];
  readonly globs: GlobEntry[];
  readonly normalized_sources: GlobEntry[];
}

Usage Example:

const scanner = new Scanner({
  sources: [
    { base: "./src", pattern: "**/*.jsx", negated: false },
    { base: "./pages", pattern: "**/*.tsx", negated: false }
  ]
});

// Get all candidates from configured sources
const allCandidates = scanner.scan();

// Get tracked files
const trackedFiles = scanner.files;

// Get normalized glob patterns
const patterns = scanner.globs;

Content Scanning

Scan specific content or files for TailwindCSS candidates.

/**
 * Scan multiple files or content strings for CSS candidates
 * @param input - Array of content items to scan
 * @returns Array of found CSS class candidates
 */
scan_files(input: ChangedContent[]): string[];

/**
 * Get candidates with their positions in the content
 * @param input - Single content item to analyze
 * @returns Array of candidates with position information
 */
get_candidates_with_positions(input: ChangedContent): CandidateWithPosition[];

Usage Example:

// Scan specific content
const htmlContent = {
  file: null,
  content: '<div class="flex items-center justify-between p-4 bg-gray-100">Content</div>',
  extension: "html"
};

const candidates = scanner.scan_files([htmlContent]);
// Result: ["flex", "items-center", "justify-between", "p-4", "bg-gray-100"]

// Get candidates with positions
const candidatesWithPos = scanner.get_candidates_with_positions(htmlContent);
// Result: [
//   { candidate: "flex", position: 12n },
//   { candidate: "items-center", position: 17n },
//   ...
// ]

File System Scanning

Scan configured source patterns for candidates.

/**
 * Scan all configured sources for CSS candidates
 * @returns Array of unique CSS class candidates found
 */
scan(): string[];

/**
 * Get list of files being tracked by the scanner
 * @returns Array of file paths
 */
readonly files: string[];

/**
 * Get glob patterns being used for scanning  
 * @returns Array of glob entries with base and pattern
 */
readonly globs: GlobEntry[];

/**
 * Get normalized source patterns
 * @returns Array of normalized glob entries
 */
readonly normalized_sources: GlobEntry[];

Types

interface ScannerOptions {
  sources?: SourceEntry[];
}

interface SourceEntry {
  /** Base directory path for the glob pattern */
  base: string;
  /** Glob pattern to match files */
  pattern: string;
  /** Whether this is a negated pattern (exclude matching files) */
  negated: boolean;
}

interface ChangedContent {
  /** File path (when scanning files) - required for file scanning, optional for content scanning */
  file?: string | null;
  /** Content string (when scanning content directly) - required for content scanning, optional for file scanning */
  content?: string | null;
  /** File extension to determine parsing mode */
  extension: string;
}

interface GlobEntry {
  /** Base directory path */
  base: string;
  /** Glob pattern */
  pattern: string;
}

interface CandidateWithPosition {
  /** The CSS class candidate */
  candidate: string;
  /** UTF-16 position in the content (64-bit integer) */
  position: bigint;
}

Platform Integration

This package provides the native binary implementation specifically for:

  • Operating System: macOS (darwin)
  • Architecture: ARM64 (Apple Silicon - M1, M2, M3+ chips)
  • Node.js Version: >= 10
  • Integration: Automatic fallback when main package detects compatible platform

The binary (tailwindcss-oxide.darwin-arm64.node) is automatically selected by the main @tailwindcss/oxide package when running on compatible macOS ARM64 systems, providing significant performance improvements over WASM or other fallback implementations for:

  • Large codebase scanning
  • Pattern matching operations
  • File system traversal
  • Memory-intensive CSS candidate extraction

When this package is unavailable, the main package falls back to other platform binaries or WASM implementation as appropriate.

docs

index.md

tile.json