@baseline-suite/core

Core Baseline compatibility analysis engine for the Baseline Developer Suite.

Features

• 🔍 Web Features Data - Integrates with web-features npm package
• 📊 Multi-language Parsing - HTML, CSS, JavaScript/TypeScript
• 🎯 Feature Detection - Detects Web APIs, CSS properties, HTML elements
• 📈 Baseline Status - Categorizes features as widely/newly/limited support

Installation

pnpm add @baseline-suite/core

Usage

Load Baseline Data

import { BaselineDataProvider } from '@baseline-suite/core';

const provider = new BaselineDataProvider();
await provider.loadFeatures();

// Get all features
const allFeatures = provider.getAllFeatures();

// Search for a feature
const fetchFeature = provider.getFeatureById('fetch');

// Find by API usage
const shareFeature = provider.findFeatureByAPI('navigator.share');

Parse JavaScript

import { JSParser } from '@baseline-suite/core';

const parser = new JSParser();
const code = `
  await navigator.share({ title: 'Test' });
  const data = await fetch('/api/data');
`;

const features = parser.parse(code);
// Returns: [
//   { feature: 'navigator.share', category: 'api', line: 2, ... },
//   { feature: 'fetch', category: 'api', line: 3, ... }
// ]

Parse CSS

import { CSSParser } from '@baseline-suite/core';

const parser = new CSSParser();
const css = `
  .container {
    container-type: inline-size;
    display: grid;
  }
  
  .card:has(> .header) {
    padding: 20px;
  }
`;

const features = parser.parse(css);
// Returns features like: container-type, display: grid, :has()

Parse HTML

import { HTMLParser } from '@baseline-suite/core';

const parser = new HTMLParser();
const html = `
  <dialog open>
    <p>Dialog content</p>
  </dialog>
  <img src="image.jpg" loading="lazy" alt="Image">
`;

const features = parser.parse(html);
// Returns features like: <dialog>, lazy loading

API Reference

Types

• BaselineFeature - Feature with Baseline status and browser support
• FeatureUsage - Detected feature usage in code
• BaselineStatus - 'widely' | 'newly' | 'limited'

BaselineDataProvider

• loadFeatures() - Load web-features data
• getFeatureById(id) - Get feature by ID
• getAllFeatures() - Get all features
• searchFeatures(query) - Search features
• findFeatureByAPI(apiPath) - Find by JavaScript API
• findFeatureByCSSProperty(prop) - Find by CSS property

Parsers

• JSParser.parse(code, isTypeScript?) - Parse JavaScript/TypeScript
• CSSParser.parse(css) - Parse CSS
• HTMLParser.parse(html) - Parse HTML

Development

# Build
pnpm build

# Test
pnpm test

# Watch mode
pnpm dev

License

MIT