UNPKG

@wix/css-property-parser

Version:

A comprehensive TypeScript library for parsing and serializing CSS property values with full MDN specification compliance

79 lines (78 loc) 2.44 kB
import { isCssVariable, isGlobalKeyword, getValidKeyword } from '../utils/shared-utils.js'; import { parse as parseCSSVariable, toCSSValue as cssVariableToCSSValue } from './css-variable.js'; import { OVERFLOW_WRAP_KEYWORDS } from '../types.js'; /** * Parses CSS overflow-wrap property values * * Syntax: normal | anywhere | break-word | inherit | initial | unset | revert * * @param value - The CSS overflow-wrap value to parse * @returns Parsed OverflowWrapValue or null if invalid * * @example * ```typescript * parse('normal') // { type: 'keyword', keyword: 'normal' } * parse('anywhere') // { type: 'keyword', keyword: 'anywhere' } * parse('break-word') // { type: 'keyword', keyword: 'break-word' } * parse('inherit') // { type: 'keyword', keyword: 'inherit' } * parse('var(--wrap)') // { type: 'variable', variable: 'wrap' } * parse('invalid') // null * ``` */ export function parse(value) { if (!value || typeof value !== 'string') { return null; } const trimmed = value.trim(); if (trimmed === '') { return null; } // Handle CSS variables if (isCssVariable(trimmed)) { return parseCSSVariable(trimmed); } // Handle global keywords if (isGlobalKeyword(trimmed)) { return { type: 'keyword', keyword: trimmed.toLowerCase() }; } // Handle overflow-wrap specific keywords const keyword = getValidKeyword(trimmed, OVERFLOW_WRAP_KEYWORDS); if (keyword) { return { type: 'keyword', keyword: keyword }; } return null; } /** * Converts a parsed OverflowWrapValue back to a CSS string * * @param parsed - The parsed OverflowWrapValue to convert * @returns CSS string representation or null if invalid * * @example * ```typescript * toCSSValue({ type: 'keyword', keyword: 'normal' }) // 'normal' * toCSSValue({ type: 'keyword', keyword: 'anywhere' }) // 'anywhere' * toCSSValue({ type: 'keyword', keyword: 'break-word' }) // 'break-word' * toCSSValue({ type: 'keyword', keyword: 'inherit' }) // 'inherit' * ``` */ export function toCSSValue(parsed) { if (!parsed) { return null; } // Handle CSS variables if ('variable' in parsed || 'CSSvariable' in parsed) { return cssVariableToCSSValue(parsed); } // Handle keywords if ('keyword' in parsed) { return parsed.keyword; } return null; }