UNPKG

@wix/css-property-parser

Version:

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

82 lines (81 loc) 2.99 kB
// CSS align-self property evaluator // Handles CSS align-self property values according to MDN specification // https://developer.mozilla.org/en-US/docs/Web/CSS/align-self import { BASIC_ALIGNMENT_WITH_AUTO_KEYWORDS, POSITIONAL_ALIGNMENT_KEYWORDS, BASELINE_ALIGNMENT_KEYWORDS, OVERFLOW_ALIGNMENT_KEYWORDS } from '../types.js'; import { isCssVariable, isGlobalKeyword, getValidKeyword } from '../utils/shared-utils.js'; import { parse as parseCSSVariable, toCSSValue as cssVariableToCSSValue } from './css-variable.js'; // Use imported keyword arrays const BASIC_KEYWORDS = BASIC_ALIGNMENT_WITH_AUTO_KEYWORDS; const POSITIONAL_KEYWORDS = POSITIONAL_ALIGNMENT_KEYWORDS; const BASELINE_KEYWORDS = BASELINE_ALIGNMENT_KEYWORDS; const OVERFLOW_KEYWORDS = OVERFLOW_ALIGNMENT_KEYWORDS; // All valid alignment values (excluding overflow combinations) const ALL_ALIGNMENT_VALUES = [ ...BASIC_KEYWORDS, ...POSITIONAL_KEYWORDS, ...BASELINE_KEYWORDS ]; export function parse(value) { if (!value || typeof value !== 'string') { return null; } const trimmed = value.trim(); if (trimmed === '') { return null; } // CSS variables can be parsed directly if (isCssVariable(trimmed)) { return parseCSSVariable(trimmed); } // Handle global keywords if (isGlobalKeyword(trimmed)) { return { type: 'keyword', keyword: trimmed.toLowerCase() }; } const normalized = trimmed.toLowerCase(); // Handle overflow alignment (e.g., "safe center", "unsafe end") const tokens = normalized.split(/\s+/); if (tokens.length === 2) { const [modifier, alignment] = tokens; const validModifier = getValidKeyword(modifier, OVERFLOW_KEYWORDS); const validAlignment = getValidKeyword(alignment, POSITIONAL_KEYWORDS); if (validModifier && validAlignment) { // Cast to the union type that includes template literal types const combinedKeyword = `${validModifier} ${validAlignment}`; return { type: 'keyword', keyword: combinedKeyword }; } } // Handle baseline keywords with multiple spaces const normalizedSpaces = normalized.replace(/\s+/g, ' '); // Handle baseline keywords explicitly if (normalizedSpaces === 'first baseline' || normalizedSpaces === 'last baseline') { return { type: 'keyword', keyword: normalizedSpaces }; } // Handle all single keywords const validKeyword = getValidKeyword(normalizedSpaces, ALL_ALIGNMENT_VALUES); if (validKeyword) { return { type: 'keyword', keyword: validKeyword }; } return null; } export function toCSSValue(parsed) { if (!parsed) { return null; } // Handle CSS variables if ('CSSvariable' in parsed) { return cssVariableToCSSValue(parsed); } return parsed.keyword; }