pagyra-js 0.0.20 → 0.0.21

package/dist/src/css/length.d.ts

@@ -13,8 +13,21 @@ export interface RelativeLength {
     readonly unit: RelativeLengthUnit;
     readonly value: number;
 }
+export interface CalcLength {
+    readonly kind: "calc";
+    readonly px: number;
+    readonly percent: number;
+    readonly em?: number;
+    readonly rem?: number;
+    readonly cqw?: number;
+    readonly cqh?: number;
+    readonly cqi?: number;
+    readonly cqb?: number;
+    readonly cqmin?: number;
+    readonly cqmax?: number;
+}
 export type CSSLength = AbsoluteLength | AutoLength;
-export type LengthLike = CSSLength | number | "auto";
+export type LengthLike = CSSLength | CalcLength | number | "auto";
 export type LengthInput = LengthLike | RelativeLength;
 export type NumericLength = number | RelativeLength;
 export declare const AUTO_LENGTH: AutoLength;
@@ -22,13 +35,24 @@ export declare function px(value: number): AbsoluteLength;
 export declare function percent(ratio: number): AbsoluteLength;
 export declare function relativeLength(unit: RelativeLengthUnit, value: number): RelativeLength;
 export declare function isRelativeLength(value: unknown): value is RelativeLength;
+export declare function isCalcLength(value: unknown): value is CalcLength;
 export declare function resolveRelativeLength(value: RelativeLength, fontSize: number, rootFontSize: number): number;
 export declare function resolveNumberLike(value: number | RelativeLength | undefined, fontSize: number, rootFontSize: number): number | undefined;
 export declare function resolveLengthInput(value: LengthInput | undefined, fontSize: number, rootFontSize: number): LengthLike | undefined;
 export declare function isAutoLength(value: LengthLike): value is AutoLength | "auto";
-export declare function normalizeLength(value: LengthLike): CSSLength;
+export declare function normalizeLength(value: LengthLike): CSSLength | CalcLength;
 export interface ResolveLengthOptions {
     auto?: "reference" | "zero" | number;
+    containerWidth?: number;
+    containerHeight?: number;
 }
 export declare function resolveLength(value: LengthLike | undefined, reference: number, options?: ResolveLengthOptions): number;
+export interface ClampNumericLength {
+    readonly kind: "clamp";
+    readonly min: number | RelativeLength;
+    readonly preferred: number | RelativeLength;
+    readonly max: number | RelativeLength;
+}
+export declare function isClampNumericLength(value: unknown): value is ClampNumericLength;
+export declare function resolveClampNumericLength(value: ClampNumericLength, fontSize: number, rootFontSize: number): number | undefined;
 export declare function clampMinMax(value: number, minValue: number | undefined, maxValue: number | undefined): number;

package/dist/src/css/length.js

@@ -14,6 +14,12 @@ export function isRelativeLength(value) {
     }
     return value.kind === "relative";
 }
+export function isCalcLength(value) {
+    if (!value || typeof value !== "object") {
+        return false;
+    }
+    return value.kind === "calc";
+}
 export function resolveRelativeLength(value, fontSize, rootFontSize) {
     return value.unit === "em" ? value.value * fontSize : value.value * rootFontSize;
 }
@@ -33,6 +39,21 @@ export function resolveLengthInput(value, fontSize, rootFontSize) {
     if (isRelativeLength(value)) {
         return resolveRelativeLength(value, fontSize, rootFontSize);
     }
+    if (isCalcLength(value)) {
+        return {
+            kind: "calc",
+            px: value.px + (value.em ?? 0) * fontSize + (value.rem ?? 0) * rootFontSize,
+            percent: value.percent,
+            em: 0,
+            rem: 0,
+            cqw: value.cqw ?? 0,
+            cqh: value.cqh ?? 0,
+            cqi: value.cqi ?? 0,
+            cqb: value.cqb ?? 0,
+            cqmin: value.cqmin ?? 0,
+            cqmax: value.cqmax ?? 0,
+        };
+    }
     return value;
 }
 export function isAutoLength(value) {
@@ -55,6 +76,8 @@ export function normalizeLength(value) {
 }
 export function resolveLength(value, reference, options = { auto: "reference" }) {
     const autoBehavior = options.auto ?? "reference";
+    const containerWidth = options.containerWidth ?? reference;
+    const containerHeight = options.containerHeight ?? reference;
     if (value === undefined) {
         return 0;
     }
@@ -67,11 +90,36 @@ export function resolveLength(value, reference, options = { auto: "reference" })
     if (value.kind === "auto") {
         return resolveAuto(autoBehavior, reference);
     }
+    if (value.kind === "calc") {
+        const inlineSize = containerWidth;
+        const blockSize = containerHeight;
+        const minSize = Math.min(inlineSize, blockSize);
+        const maxSize = Math.max(inlineSize, blockSize);
+        return (value.px +
+            value.percent * reference +
+            (value.cqw ?? 0) * inlineSize +
+            (value.cqi ?? 0) * inlineSize +
+            (value.cqh ?? 0) * blockSize +
+            (value.cqb ?? 0) * blockSize +
+            (value.cqmin ?? 0) * minSize +
+            (value.cqmax ?? 0) * maxSize);
+    }
     if (value.unit === "percent") {
         return value.value * reference;
     }
     return value.value;
 }
+export function isClampNumericLength(value) {
+    return value !== null && typeof value === "object" && value.kind === "clamp";
+}
+export function resolveClampNumericLength(value, fontSize, rootFontSize) {
+    const min = resolveNumberLike(value.min, fontSize, rootFontSize);
+    const preferred = resolveNumberLike(value.preferred, fontSize, rootFontSize);
+    const max = resolveNumberLike(value.max, fontSize, rootFontSize);
+    if (min === undefined || preferred === undefined || max === undefined)
+        return undefined;
+    return Math.min(Math.max(preferred, min), max);
+}
 export function clampMinMax(value, minValue, maxValue) {
     const upper = maxValue ?? Number.POSITIVE_INFINITY;
     const lower = minValue ?? Number.NEGATIVE_INFINITY;

package/dist/src/css/parsers/background-parser.js

@@ -284,7 +284,7 @@ function isColorValue(value) {
     if (lowerValue === "transparent") {
         return true;
     }
-    if (lowerValue.startsWith("#") && (lowerValue.length === 4 || lowerValue.length === 7)) {
+    if (lowerValue.startsWith("#") && (lowerValue.length === 4 || lowerValue.length === 5 || lowerValue.length === 7 || lowerValue.length === 9)) {
         return true;
     }
     if (lowerValue.startsWith("rgb(") || lowerValue.startsWith("rgba(")) {

package/dist/src/css/parsers/calc-parser.d.ts

@@ -0,0 +1,2 @@
+import type { CalcLength } from "../length.js";
+export declare function parseCalcLength(value: string): CalcLength | undefined;

package/dist/src/css/parsers/calc-parser.js

@@ -0,0 +1,310 @@
+import { cmToPx, inToPx, mmToPx, pcToPx, ptToPx, qToPx } from "../../units/units.js";
+import { getViewportHeight, getViewportWidth } from "../viewport.js";
+function createCalcLength(partial = {}) {
+    return {
+        kind: "calc",
+        px: partial.px ?? 0,
+        percent: partial.percent ?? 0,
+        em: partial.em ?? 0,
+        rem: partial.rem ?? 0,
+        cqw: partial.cqw ?? 0,
+        cqh: partial.cqh ?? 0,
+        cqi: partial.cqi ?? 0,
+        cqb: partial.cqb ?? 0,
+        cqmin: partial.cqmin ?? 0,
+        cqmax: partial.cqmax ?? 0,
+    };
+}
+function addCalcLengths(left, right) {
+    return createCalcLength({
+        px: left.px + right.px,
+        percent: left.percent + right.percent,
+        em: (left.em ?? 0) + (right.em ?? 0),
+        rem: (left.rem ?? 0) + (right.rem ?? 0),
+        cqw: (left.cqw ?? 0) + (right.cqw ?? 0),
+        cqh: (left.cqh ?? 0) + (right.cqh ?? 0),
+        cqi: (left.cqi ?? 0) + (right.cqi ?? 0),
+        cqb: (left.cqb ?? 0) + (right.cqb ?? 0),
+        cqmin: (left.cqmin ?? 0) + (right.cqmin ?? 0),
+        cqmax: (left.cqmax ?? 0) + (right.cqmax ?? 0),
+    });
+}
+function scaleCalcLength(value, scalar) {
+    return createCalcLength({
+        px: value.px * scalar,
+        percent: value.percent * scalar,
+        em: (value.em ?? 0) * scalar,
+        rem: (value.rem ?? 0) * scalar,
+        cqw: (value.cqw ?? 0) * scalar,
+        cqh: (value.cqh ?? 0) * scalar,
+        cqi: (value.cqi ?? 0) * scalar,
+        cqb: (value.cqb ?? 0) * scalar,
+        cqmin: (value.cqmin ?? 0) * scalar,
+        cqmax: (value.cqmax ?? 0) * scalar,
+    });
+}
+class CalcParser {
+    constructor(tokens) {
+        this.tokens = tokens;
+        this.index = 0;
+    }
+    parse() {
+        const value = this.parseExpression();
+        if (!value) {
+            return undefined;
+        }
+        if (this.index !== this.tokens.length) {
+            return undefined;
+        }
+        return value;
+    }
+    parseExpression() {
+        let left = this.parseTerm();
+        if (!left) {
+            return undefined;
+        }
+        while (true) {
+            const token = this.peek();
+            if (!token || token.type !== "op" || (token.value !== "+" && token.value !== "-")) {
+                break;
+            }
+            this.index += 1;
+            const right = this.parseTerm();
+            if (!right) {
+                return undefined;
+            }
+            left = token.value === "+" ? addValues(left, right) : subtractValues(left, right);
+            if (!left) {
+                return undefined;
+            }
+        }
+        return left;
+    }
+    parseTerm() {
+        let left = this.parseFactor();
+        if (!left) {
+            return undefined;
+        }
+        while (true) {
+            const token = this.peek();
+            if (!token || token.type !== "op" || (token.value !== "*" && token.value !== "/")) {
+                break;
+            }
+            this.index += 1;
+            const right = this.parseFactor();
+            if (!right) {
+                return undefined;
+            }
+            left = token.value === "*" ? multiplyValues(left, right) : divideValues(left, right);
+            if (!left) {
+                return undefined;
+            }
+        }
+        return left;
+    }
+    parseFactor() {
+        const token = this.peek();
+        if (!token) {
+            return undefined;
+        }
+        if (token.type === "op" && (token.value === "+" || token.value === "-")) {
+            this.index += 1;
+            const factor = this.parseFactor();
+            if (!factor) {
+                return undefined;
+            }
+            if (token.value === "+") {
+                return factor;
+            }
+            return multiplyValues({ kind: "number", value: -1 }, factor);
+        }
+        if (token.type === "lparen") {
+            this.index += 1;
+            const expression = this.parseExpression();
+            if (!expression) {
+                return undefined;
+            }
+            const closing = this.peek();
+            if (!closing || closing.type !== "rparen") {
+                return undefined;
+            }
+            this.index += 1;
+            return expression;
+        }
+        this.index += 1;
+        if (token.type === "number") {
+            return { kind: "number", value: token.value };
+        }
+        if (token.type === "dimension") {
+            return dimensionToValue(token.value, token.unit);
+        }
+        return undefined;
+    }
+    peek() {
+        return this.tokens[this.index];
+    }
+}
+function addValues(left, right) {
+    if (left.kind === "number" && right.kind === "number") {
+        return { kind: "number", value: left.value + right.value };
+    }
+    if (left.kind === "length" && right.kind === "length") {
+        return {
+            kind: "length",
+            value: addCalcLengths(left.value, right.value),
+        };
+    }
+    return undefined;
+}
+function subtractValues(left, right) {
+    const negated = multiplyValues({ kind: "number", value: -1 }, right);
+    if (!negated) {
+        return undefined;
+    }
+    return addValues(left, negated);
+}
+function multiplyValues(left, right) {
+    if (left.kind === "number" && right.kind === "number") {
+        return { kind: "number", value: left.value * right.value };
+    }
+    if (left.kind === "number" && right.kind === "length") {
+        return {
+            kind: "length",
+            value: scaleCalcLength(right.value, left.value),
+        };
+    }
+    if (left.kind === "length" && right.kind === "number") {
+        return multiplyValues(right, left);
+    }
+    return undefined;
+}
+function divideValues(left, right) {
+    if (right.kind !== "number") {
+        return undefined;
+    }
+    if (right.value === 0) {
+        return undefined;
+    }
+    return multiplyValues(left, { kind: "number", value: 1 / right.value });
+}
+function dimensionToValue(value, unit) {
+    const normalizedUnit = unit.toLowerCase();
+    switch (normalizedUnit) {
+        case "px":
+            return { kind: "length", value: createCalcLength({ px: value }) };
+        case "pt":
+            return { kind: "length", value: createCalcLength({ px: ptToPx(value) }) };
+        case "cm":
+            return { kind: "length", value: createCalcLength({ px: cmToPx(value) }) };
+        case "mm":
+            return { kind: "length", value: createCalcLength({ px: mmToPx(value) }) };
+        case "q":
+            return { kind: "length", value: createCalcLength({ px: qToPx(value) }) };
+        case "in":
+            return { kind: "length", value: createCalcLength({ px: inToPx(value) }) };
+        case "pc":
+            return { kind: "length", value: createCalcLength({ px: pcToPx(value) }) };
+        case "vw":
+            return {
+                kind: "length",
+                value: createCalcLength({ px: (value / 100) * getViewportWidth() }),
+            };
+        case "vh":
+            return {
+                kind: "length",
+                value: createCalcLength({ px: (value / 100) * getViewportHeight() }),
+            };
+        case "%":
+            return { kind: "length", value: createCalcLength({ percent: value / 100 }) };
+        case "em":
+            return { kind: "length", value: createCalcLength({ em: value }) };
+        case "rem":
+            return { kind: "length", value: createCalcLength({ rem: value }) };
+        case "cqw":
+            return { kind: "length", value: createCalcLength({ cqw: value / 100 }) };
+        case "cqh":
+            return { kind: "length", value: createCalcLength({ cqh: value / 100 }) };
+        case "cqi":
+            return { kind: "length", value: createCalcLength({ cqi: value / 100 }) };
+        case "cqb":
+            return { kind: "length", value: createCalcLength({ cqb: value / 100 }) };
+        case "cqmin":
+            return { kind: "length", value: createCalcLength({ cqmin: value / 100 }) };
+        case "cqmax":
+            return { kind: "length", value: createCalcLength({ cqmax: value / 100 }) };
+        default:
+            return undefined;
+    }
+}
+function tokenizeCalcExpression(input) {
+    const tokens = [];
+    let i = 0;
+    while (i < input.length) {
+        const char = input[i];
+        if (/\s/.test(char)) {
+            i += 1;
+            continue;
+        }
+        if (char === "+" || char === "-" || char === "*" || char === "/") {
+            tokens.push({ type: "op", value: char });
+            i += 1;
+            continue;
+        }
+        if (char === "(") {
+            tokens.push({ type: "lparen" });
+            i += 1;
+            continue;
+        }
+        if (char === ")") {
+            tokens.push({ type: "rparen" });
+            i += 1;
+            continue;
+        }
+        const numberMatch = input.slice(i).match(/^\d*\.?\d+/);
+        if (!numberMatch) {
+            return undefined;
+        }
+        const numberValue = Number.parseFloat(numberMatch[0]);
+        if (Number.isNaN(numberValue)) {
+            return undefined;
+        }
+        i += numberMatch[0].length;
+        const unitMatch = input.slice(i).match(/^(%|[a-zA-Z]+)/);
+        if (unitMatch) {
+            tokens.push({
+                type: "dimension",
+                value: numberValue,
+                unit: unitMatch[0],
+            });
+            i += unitMatch[0].length;
+            continue;
+        }
+        tokens.push({ type: "number", value: numberValue });
+    }
+    return tokens;
+}
+export function parseCalcLength(value) {
+    if (!value) {
+        return undefined;
+    }
+    const trimmed = value.trim();
+    if (!trimmed.toLowerCase().startsWith("calc(") || !trimmed.endsWith(")")) {
+        return undefined;
+    }
+    const expression = trimmed.slice(5, -1).trim();
+    if (!expression) {
+        return undefined;
+    }
+    const tokens = tokenizeCalcExpression(expression);
+    if (!tokens || tokens.length === 0) {
+        return undefined;
+    }
+    const parsed = new CalcParser(tokens).parse();
+    if (!parsed) {
+        return undefined;
+    }
+    if (parsed.kind === "number") {
+        return createCalcLength({ px: parsed.value });
+    }
+    return parsed.value;
+}

package/dist/src/css/parsers/content-parser.d.ts

@@ -12,7 +12,7 @@ export type ContentValue = {
 } | {
     type: "counter";
     counter: string;
-    style?: "decimal" | "lower-roman" | "upper-roman" | "lower-alpha" | "upper-alpha";
+    style?: CounterStyle;
 } | {
     type: "attr";
     attribute: string;
@@ -25,6 +25,7 @@ export type ContentValue = {
 } | {
     type: "no-close-quote";
 };
+export type CounterStyle = "decimal" | "decimal-leading-zero" | "lower-roman" | "upper-roman" | "lower-alpha" | "upper-alpha";
 /**
  * Parse a CSS content property value into ContentValue[]
  * Supports: strings, counter(), attr(), and quote functions

package/dist/src/css/parsers/content-parser.js

@@ -76,7 +76,7 @@ function parseContentValue(value) {
         }
         // Handle counter() function
         if (value.slice(i).startsWith("counter(")) {
-            const match = /^counter\(\s*([a-zA-Z_][a-zA-Z0-9_-]*)\s*(?:,\s*(decimal|lower-roman|upper-roman|lower-alpha|upper-alpha))?\s*\)/i.exec(value.slice(i));
+            const match = /^counter\(\s*([a-zA-Z_][a-zA-Z0-9_-]*)\s*(?:,\s*(decimal-leading-zero|decimal|lower-roman|upper-roman|lower-alpha|upper-alpha))?\s*\)/i.exec(value.slice(i));
             if (match) {
                 result.push({
                     type: "counter",
@@ -89,7 +89,7 @@ function parseContentValue(value) {
         }
         // Handle counters() function (plural - for nested counters)
         if (value.slice(i).startsWith("counters(")) {
-            const match = /^counters\(\s*([a-zA-Z_][a-zA-Z0-9_-]*)\s*,\s*(["'])(.*)\2\s*(?:,\s*(decimal|lower-roman|upper-roman|lower-alpha|upper-alpha))?\s*\)/i.exec(value.slice(i));
+            const match = /^counters\(\s*([a-zA-Z_][a-zA-Z0-9_-]*)\s*,\s*(["'])(.*)\2\s*(?:,\s*(decimal-leading-zero|decimal|lower-roman|upper-roman|lower-alpha|upper-alpha))?\s*\)/i.exec(value.slice(i));
             if (match) {
                 result.push({
                     type: "counter",
@@ -143,6 +143,11 @@ export function formatCounterValue(value, style) {
         return String(value);
     }
     const lower = style.toLowerCase();
+    if (lower === "decimal-leading-zero") {
+        const sign = value < 0 ? "-" : "";
+        const abs = Math.abs(Math.trunc(value));
+        return `${sign}${String(abs).padStart(2, "0")}`;
+    }
     if (lower === "lower-roman") {
         return toRomanNumeral(value)?.toLowerCase() ?? String(value);
     }

package/dist/src/css/parsers/dimension-parser.js

@@ -1,22 +1,18 @@
-import { parseLength, parseNumeric } from "./length-parser.js";
-import { percent } from "../length.js";
-const PERCENT_LENGTH_REGEX = /^(-?\d+(?:\.\d+)?)%$/;
-function parseLengthOrPercent(value) {
-    const parsed = parseLength(value);
-    if (parsed !== undefined) {
-        return parsed;
-    }
-    const match = PERCENT_LENGTH_REGEX.exec(value.trim());
-    if (!match) {
-        return undefined;
-    }
-    const numeric = Number.parseFloat(match[1]);
-    if (Number.isNaN(numeric)) {
-        return undefined;
-    }
-    return percent(numeric / 100);
-}
+import { parseLength, parseLengthOrPercent, parseNumeric, parseClampArgs } from "./length-parser.js";
 export function parseWidth(value, target) {
+    const clampArgs = parseClampArgs(value);
+    if (clampArgs) {
+        const min = parseLengthOrPercent(clampArgs[0]);
+        const preferred = parseLengthOrPercent(clampArgs[1]);
+        const max = parseLengthOrPercent(clampArgs[2]);
+        if (preferred !== undefined)
+            target.width = preferred;
+        if (min !== undefined)
+            target.minWidth ?? (target.minWidth = min);
+        if (max !== undefined)
+            target.maxWidth ?? (target.maxWidth = max);
+        return;
+    }
     const parsed = parseLengthOrPercent(value);
     if (parsed !== undefined) {
         target.width = parsed;
@@ -35,6 +31,19 @@ export function parseMaxWidth(value, target) {
     }
 }
 export function parseHeight(value, target) {
+    const clampArgs = parseClampArgs(value);
+    if (clampArgs) {
+        const min = parseLengthOrPercent(clampArgs[0]);
+        const preferred = parseLengthOrPercent(clampArgs[1]);
+        const max = parseLengthOrPercent(clampArgs[2]);
+        if (preferred !== undefined)
+            target.height = preferred;
+        if (min !== undefined)
+            target.minHeight ?? (target.minHeight = min);
+        if (max !== undefined)
+            target.maxHeight ?? (target.maxHeight = max);
+        return;
+    }
     const parsed = parseLengthOrPercent(value);
     if (parsed !== undefined) {
         target.height = parsed;
@@ -53,6 +62,16 @@ export function parseMaxHeight(value, target) {
     }
 }
 export function parseFontSize(value, target) {
+    const clampArgs = parseClampArgs(value);
+    if (clampArgs) {
+        const min = parseLength(clampArgs[0]) ?? parseNumeric(clampArgs[0]);
+        const preferred = parseLength(clampArgs[1]) ?? parseNumeric(clampArgs[1]);
+        const max = parseLength(clampArgs[2]) ?? parseNumeric(clampArgs[2]);
+        if (min !== undefined && preferred !== undefined && max !== undefined) {
+            target.fontSize = { kind: "clamp", min, preferred, max };
+        }
+        return;
+    }
     target.fontSize = parseNumeric(value) ?? target.fontSize;
 }
 function parseLineHeightValue(value) {

package/dist/src/css/parsers/display-flex-parser.d.ts

@@ -6,3 +6,7 @@ export declare function parseAlignContent(value: string, target: StyleAccumulato
 export declare function parseAlignSelf(value: string, target: StyleAccumulator): void;
 export declare function parseFlexDirection(value: string, target: StyleAccumulator): void;
 export declare function parseFlexWrap(value: string, target: StyleAccumulator): void;
+export declare function parseFlexGrow(value: string, target: StyleAccumulator): void;
+export declare function parseFlexShrink(value: string, target: StyleAccumulator): void;
+export declare function parseFlexBasis(value: string, target: StyleAccumulator): void;
+export declare function parseFlex(value: string, target: StyleAccumulator): void;

package/dist/src/css/parsers/display-flex-parser.js

@@ -1,5 +1,17 @@
 // src/css/parsers/display-flex-parser.ts
 import { mapAlignContentValue, mapAlignItemsValue, mapAlignSelfValue, mapDisplay, mapJustifyContent, parseFlexDirectionValue, } from "./flex-parser.js";
+import { parseLengthOrAuto } from "./length-parser.js";
+function parseNonNegativeNumber(value) {
+    const trimmed = value.trim();
+    if (!/^\d+(?:\.\d+)?$/.test(trimmed)) {
+        return undefined;
+    }
+    const parsed = Number.parseFloat(trimmed);
+    if (Number.isNaN(parsed) || parsed < 0) {
+        return undefined;
+    }
+    return parsed;
+}
 export function parseDisplay(value, target) {
     target.display = mapDisplay(value);
 }
@@ -42,3 +54,88 @@ export function parseFlexWrap(value, target) {
         target.flexWrap = true;
     }
 }
+export function parseFlexGrow(value, target) {
+    const parsed = parseNonNegativeNumber(value);
+    if (parsed !== undefined) {
+        target.flexGrow = parsed;
+    }
+}
+export function parseFlexShrink(value, target) {
+    const parsed = parseNonNegativeNumber(value);
+    if (parsed !== undefined) {
+        target.flexShrink = parsed;
+    }
+}
+export function parseFlexBasis(value, target) {
+    const parsed = parseLengthOrAuto(value);
+    if (parsed !== undefined) {
+        target.flexBasis = parsed;
+    }
+}
+export function parseFlex(value, target) {
+    const normalized = value.trim().toLowerCase();
+    if (!normalized) {
+        return;
+    }
+    if (normalized === "none") {
+        target.flexGrow = 0;
+        target.flexShrink = 0;
+        target.flexBasis = "auto";
+        return;
+    }
+    if (normalized === "auto") {
+        target.flexGrow = 1;
+        target.flexShrink = 1;
+        target.flexBasis = "auto";
+        return;
+    }
+    if (normalized === "initial") {
+        target.flexGrow = 0;
+        target.flexShrink = 1;
+        target.flexBasis = "auto";
+        return;
+    }
+    const tokens = normalized.split(/\s+/).filter(Boolean);
+    if (tokens.length === 0) {
+        return;
+    }
+    const firstNumber = parseNonNegativeNumber(tokens[0]);
+    const firstBasis = parseLengthOrAuto(tokens[0]);
+    if (tokens.length === 1) {
+        if (firstNumber !== undefined) {
+            target.flexGrow = firstNumber;
+            target.flexShrink = 1;
+            target.flexBasis = 0;
+            return;
+        }
+        if (firstBasis !== undefined) {
+            target.flexGrow = 1;
+            target.flexShrink = 1;
+            target.flexBasis = firstBasis;
+        }
+        return;
+    }
+    const secondNumber = parseNonNegativeNumber(tokens[1]);
+    const secondBasis = parseLengthOrAuto(tokens[1]);
+    if (tokens.length === 2 && firstNumber !== undefined) {
+        target.flexGrow = firstNumber;
+        if (secondNumber !== undefined) {
+            target.flexShrink = secondNumber;
+            target.flexBasis = 0;
+            return;
+        }
+        if (secondBasis !== undefined) {
+            target.flexShrink = 1;
+            target.flexBasis = secondBasis;
+        }
+        return;
+    }
+    if (tokens.length >= 3 && firstNumber !== undefined && secondNumber !== undefined) {
+        const thirdBasis = parseLengthOrAuto(tokens[2]);
+        if (thirdBasis !== undefined) {
+            target.flexGrow = firstNumber;
+            target.flexShrink = secondNumber;
+            target.flexBasis = thirdBasis;
+        }
+    }
+}