Type Predicates

/**
 * Checks if value is a valid CSS token
 * @param value - Value to check
 * @returns true if value is a CSS token
 */
function isToken(value: any): value is CSSToken;

/**
 * Checks if token is numeric (Number, Dimension, Percentage)
 * @param token - Token to check
 * @returns true if token is a numeric token
 */
function isTokenNumeric(token: CSSToken): token is NumericToken;

/**
 * Checks if token is whitespace or comment
 * @param token - Token to check
 * @returns true if token is whitespace or comment
 */
function isTokenWhiteSpaceOrComment(token: CSSToken): token is TokenWhitespace | TokenComment;

/**
 * Type guard for AtKeyword tokens
 * @param token - Token to check
 * @returns true if token is AtKeyword token
 */
function isTokenAtKeyword(token: CSSToken): token is TokenAtKeyword;

/**
 * Type guard for BadString tokens
 * @param token - Token to check
 * @returns true if token is BadString token
 */
function isTokenBadString(token: CSSToken): token is TokenBadString;

/**
 * Type guard for BadURL tokens
 * @param token - Token to check
 * @returns true if token is BadURL token
 */
function isTokenBadURL(token: CSSToken): token is TokenBadURL;

/**
 * Type guard for CDC tokens
 * @param token - Token to check
 * @returns true if token is CDC token
 */
function isTokenCDC(token: CSSToken): token is TokenCDC;

/**
 * Type guard for CDO tokens
 * @param token - Token to check
 * @returns true if token is CDO token
 */
function isTokenCDO(token: CSSToken): token is TokenCDO;

/**
 * Type guard for Colon tokens
 * @param token - Token to check
 * @returns true if token is Colon token
 */
function isTokenColon(token: CSSToken): token is TokenColon;

/**
 * Type guard for Comma tokens
 * @param token - Token to check
 * @returns true if token is Comma token
 */
function isTokenComma(token: CSSToken): token is TokenComma;

/**
 * Type guard for Comment tokens
 * @param token - Token to check
 * @returns true if token is Comment token
 */
function isTokenComment(token: CSSToken): token is TokenComment;

/**
 * Type guard for Delim tokens
 * @param token - Token to check
 * @returns true if token is Delim token
 */
function isTokenDelim(token: CSSToken): token is TokenDelim;

/**
 * Type guard for Dimension tokens
 * @param token - Token to check
 * @returns true if token is Dimension token
 */
function isTokenDimension(token: CSSToken): token is TokenDimension;

/**
 * Type guard for EOF tokens
 * @param token - Token to check
 * @returns true if token is EOF token
 */
function isTokenEOF(token: CSSToken): token is TokenEOF;

/**
 * Type guard for Function tokens
 * @param token - Token to check
 * @returns true if token is Function token
 */
function isTokenFunction(token: CSSToken): token is TokenFunction;

/**
 * Type guard for Hash tokens
 * @param token - Token to check
 * @returns true if token is Hash token
 */
function isTokenHash(token: CSSToken): token is TokenHash;

/**
 * Type guard for Ident tokens
 * @param token - Token to check
 * @returns true if token is Ident token
 */
function isTokenIdent(token: CSSToken): token is TokenIdent;

/**
 * Type guard for Number tokens
 * @param token - Token to check
 * @returns true if token is Number token
 */
function isTokenNumber(token: CSSToken): token is TokenNumber;

/**
 * Type guard for Percentage tokens
 * @param token - Token to check
 * @returns true if token is Percentage token
 */
function isTokenPercentage(token: CSSToken): token is TokenPercentage;

/**
 * Type guard for Semicolon tokens
 * @param token - Token to check
 * @returns true if token is Semicolon token
 */
function isTokenSemicolon(token: CSSToken): token is TokenSemicolon;

/**
 * Type guard for String tokens
 * @param token - Token to check
 * @returns true if token is String token
 */
function isTokenString(token: CSSToken): token is TokenString;

/**
 * Type guard for URL tokens
 * @param token - Token to check
 * @returns true if token is URL token
 */
function isTokenURL(token: CSSToken): token is TokenURL;

/**
 * Type guard for Whitespace tokens
 * @param token - Token to check
 * @returns true if token is Whitespace token
 */
function isTokenWhitespace(token: CSSToken): token is TokenWhitespace;

/**
 * Type guard for OpenParen tokens
 * @param token - Token to check
 * @returns true if token is OpenParen token
 */
function isTokenOpenParen(token: CSSToken): token is TokenOpenParen;

/**
 * Type guard for CloseParen tokens
 * @param token - Token to check
 * @returns true if token is CloseParen token
 */
function isTokenCloseParen(token: CSSToken): token is TokenCloseParen;

/**
 * Type guard for OpenSquare tokens
 * @param token - Token to check
 * @returns true if token is OpenSquare token
 */
function isTokenOpenSquare(token: CSSToken): token is TokenOpenSquare;

/**
 * Type guard for CloseSquare tokens
 * @param token - Token to check
 * @returns true if token is CloseSquare token
 */
function isTokenCloseSquare(token: CSSToken): token is TokenCloseSquare;

/**
 * Type guard for OpenCurly tokens
 * @param token - Token to check
 * @returns true if token is OpenCurly token
 */
function isTokenOpenCurly(token: CSSToken): token is TokenOpenCurly;

/**
 * Type guard for CloseCurly tokens
 * @param token - Token to check
 * @returns true if token is CloseCurly token
 */
function isTokenCloseCurly(token: CSSToken): token is TokenCloseCurly;

/**
 * Type guard for UnicodeRange tokens
 * @param token - Token to check
 * @returns true if token is UnicodeRange token
 */
function isTokenUnicodeRange(token: CSSToken): token is TokenUnicodeRange;

import { 
  tokenize, 
  isTokenIdent, 
  isTokenDimension, 
  isTokenNumeric, 
  isTokenFunction,
  CSSToken 
} from "@csstools/css-tokenizer";

const tokens = tokenize({ css: ".foo { width: 10px; height: calc(100% - 20px); }" });

function processTokens(tokens: CSSToken[]) {
  tokens.forEach((token) => {
    // Type-safe token processing
    if (isTokenIdent(token)) {
      // token is now typed as TokenIdent
      console.log('Identifier:', token[4].value);
    } else if (isTokenDimension(token)) {
      // token is now typed as TokenDimension
      console.log(`Dimension: ${token[4].value}${token[4].unit}`);
    } else if (isTokenFunction(token)) {
      // token is now typed as TokenFunction
      console.log('Function:', token[4].value);
    }
  });
}

// Filter tokens by type
const identTokens = tokens.filter(isTokenIdent);
const numericTokens = tokens.filter(isTokenNumeric);

// Process specific token types
identTokens.forEach(token => {
  // TypeScript knows token is TokenIdent
  console.log('Processing identifier:', token[4].value);
});

numericTokens.forEach(token => {
  // TypeScript knows token is NumericToken (Number | Dimension | Percentage)
  console.log('Processing numeric value:', token[4].value);
  
  if (isTokenDimension(token)) {
    // Further narrow to dimension
    console.log('Unit:', token[4].unit);
  }
});

import { tokenize, isTokenHash, isTokenIdent } from "@csstools/css-tokenizer";

const tokens = tokenize({ css: "#header .nav-item" });

tokens.forEach(token => {
  // Without type predicate - TypeScript error
  // console.log(token[4].value); // Error: Property 'value' does not exist on 'undefined'
  
  // With type predicate - Type safe
  if (isTokenHash(token)) {
    console.log('Hash value:', token[4].value); // ✓ TypeScript knows token[4] has value
    console.log('Hash type:', token[4].type);   // ✓ TypeScript knows token[4] has type property
  } else if (isTokenIdent(token)) {
    console.log('Ident value:', token[4].value); // ✓ Type safe access
  }
});