macOS ARM64 native binary component for TailwindCSS Oxide high-performance CSS engine
npx @tessl/cli install tessl/npm-tailwindcss--oxide-darwin-arm64@4.1.0TailwindCSS 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.
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";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"
}
]);The native binary provides a high-performance Rust implementation that:
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;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 },
// ...
// ]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[];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;
}This package provides the native binary implementation specifically for:
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:
When this package is unavailable, the main package falls back to other platform binaries or WASM implementation as appropriate.