@ohos-ports/html2canvas-pro 0.0.0-stage → 2.3.2-beta.0

package/dist/lib/css/types/functions/counter.js

@@ -0,0 +1,367 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createCounterText = exports.CounterState = void 0;
+const css_line_break_1 = require("css-line-break");
+const bitwise_1 = require("../../../core/bitwise");
+class CounterState {
+    constructor() {
+        this.counters = {};
+    }
+    getCounterValue(name) {
+        const counter = this.counters[name];
+        if (counter && counter.length) {
+            return counter[counter.length - 1];
+        }
+        return 1;
+    }
+    getCounterValues(name) {
+        const counter = this.counters[name];
+        return counter ? counter : [];
+    }
+    pop(counters) {
+        counters.forEach((counter) => this.counters[counter].pop());
+    }
+    parse(style) {
+        const counterIncrement = style.counterIncrement;
+        const counterReset = style.counterReset;
+        let canReset = true;
+        if (counterIncrement !== null) {
+            counterIncrement.forEach((entry) => {
+                const counter = this.counters[entry.counter];
+                if (counter && entry.increment !== 0) {
+                    canReset = false;
+                    if (!counter.length) {
+                        counter.push(1);
+                    }
+                    counter[Math.max(0, counter.length - 1)] += entry.increment;
+                }
+            });
+        }
+        const counterNames = [];
+        if (canReset) {
+            counterReset.forEach((entry) => {
+                let counter = this.counters[entry.counter];
+                counterNames.push(entry.counter);
+                if (!counter) {
+                    counter = this.counters[entry.counter] = [];
+                }
+                counter.push(entry.reset);
+            });
+        }
+        return counterNames;
+    }
+}
+exports.CounterState = CounterState;
+const ROMAN_UPPER = {
+    integers: [1000, 900, 500, 400, 100, 90, 50, 40, 10, 9, 5, 4, 1],
+    values: ['M', 'CM', 'D', 'CD', 'C', 'XC', 'L', 'XL', 'X', 'IX', 'V', 'IV', 'I']
+};
+const ARMENIAN = {
+    integers: [
+        9000, 8000, 7000, 6000, 5000, 4000, 3000, 2000, 1000, 900, 800, 700, 600, 500, 400, 300, 200, 100, 90, 80, 70,
+        60, 50, 40, 30, 20, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1
+    ],
+    values: [
+        'Ք',
+        'Փ',
+        'Ւ',
+        'Ց',
+        'Ր',
+        'Տ',
+        'Վ',
+        'Ս',
+        'Ռ',
+        'Ջ',
+        'Պ',
+        'Չ',
+        'Ո',
+        'Շ',
+        'Ն',
+        'Յ',
+        'Մ',
+        'Ճ',
+        'Ղ',
+        'Ձ',
+        'Հ',
+        'Կ',
+        'Ծ',
+        'Խ',
+        'Լ',
+        'Ի',
+        'Ժ',
+        'Թ',
+        'Ը',
+        'Է',
+        'Զ',
+        'Ե',
+        'Դ',
+        'Գ',
+        'Բ',
+        'Ա'
+    ]
+};
+const HEBREW = {
+    integers: [
+        10000, 9000, 8000, 7000, 6000, 5000, 4000, 3000, 2000, 1000, 400, 300, 200, 100, 90, 80, 70, 60, 50, 40, 30, 20,
+        19, 18, 17, 16, 15, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1
+    ],
+    values: [
+        'י׳',
+        'ט׳',
+        'ח׳',
+        'ז׳',
+        'ו׳',
+        'ה׳',
+        'ד׳',
+        'ג׳',
+        'ב׳',
+        'א׳',
+        'ת',
+        'ש',
+        'ר',
+        'ק',
+        'צ',
+        'פ',
+        'ע',
+        'ס',
+        'נ',
+        'מ',
+        'ל',
+        'כ',
+        'יט',
+        'יח',
+        'יז',
+        'טז',
+        'טו',
+        'י',
+        'ט',
+        'ח',
+        'ז',
+        'ו',
+        'ה',
+        'ד',
+        'ג',
+        'ב',
+        'א'
+    ]
+};
+const GEORGIAN = {
+    integers: [
+        10000, 9000, 8000, 7000, 6000, 5000, 4000, 3000, 2000, 1000, 900, 800, 700, 600, 500, 400, 300, 200, 100, 90,
+        80, 70, 60, 50, 40, 30, 20, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1
+    ],
+    values: [
+        'ჵ',
+        'ჰ',
+        'ჯ',
+        'ჴ',
+        'ხ',
+        'ჭ',
+        'წ',
+        'ძ',
+        'ც',
+        'ჩ',
+        'შ',
+        'ყ',
+        'ღ',
+        'ქ',
+        'ფ',
+        'ჳ',
+        'ტ',
+        'ს',
+        'რ',
+        'ჟ',
+        'პ',
+        'ო',
+        'ჲ',
+        'ნ',
+        'მ',
+        'ლ',
+        'კ',
+        'ი',
+        'თ',
+        'ჱ',
+        'ზ',
+        'ვ',
+        'ე',
+        'დ',
+        'გ',
+        'ბ',
+        'ა'
+    ]
+};
+const createAdditiveCounter = (value, min, max, symbols, fallback, suffix) => {
+    if (value < min || value > max) {
+        return (0, exports.createCounterText)(value, fallback, suffix.length > 0);
+    }
+    return (symbols.integers.reduce((string, integer, index) => {
+        while (value >= integer) {
+            value -= integer;
+            string += symbols.values[index];
+        }
+        return string;
+    }, '') + suffix);
+};
+const createCounterStyleWithSymbolResolver = (value, codePointRangeLength, isNumeric, resolver) => {
+    let string = '';
+    do {
+        if (!isNumeric) {
+            value--;
+        }
+        string = resolver(value) + string;
+        value /= codePointRangeLength;
+    } while (value * codePointRangeLength >= codePointRangeLength);
+    return string;
+};
+const createCounterStyleFromRange = (value, codePointRangeStart, codePointRangeEnd, isNumeric, suffix) => {
+    const codePointRangeLength = codePointRangeEnd - codePointRangeStart + 1;
+    return ((value < 0 ? '-' : '') +
+        (createCounterStyleWithSymbolResolver(Math.abs(value), codePointRangeLength, isNumeric, (codePoint) => (0, css_line_break_1.fromCodePoint)(Math.floor(codePoint % codePointRangeLength) + codePointRangeStart)) +
+            suffix));
+};
+const createCounterStyleFromSymbols = (value, symbols, suffix = '. ') => {
+    const codePointRangeLength = symbols.length;
+    return (createCounterStyleWithSymbolResolver(Math.abs(value), codePointRangeLength, false, (codePoint) => symbols[Math.floor(codePoint % codePointRangeLength)]) + suffix);
+};
+const CJK_ZEROS = 1 << 0;
+const CJK_TEN_COEFFICIENTS = 1 << 1;
+const CJK_TEN_HIGH_COEFFICIENTS = 1 << 2;
+const CJK_HUNDRED_COEFFICIENTS = 1 << 3;
+const createCJKCounter = (value, numbers, multipliers, negativeSign, suffix, flags) => {
+    if (value < -9999 || value > 9999) {
+        return (0, exports.createCounterText)(value, 4 /* LIST_STYLE_TYPE.CJK_DECIMAL */, suffix.length > 0);
+    }
+    let tmp = Math.abs(value);
+    let string = suffix;
+    if (tmp === 0) {
+        return numbers[0] + string;
+    }
+    for (let digit = 0; tmp > 0 && digit <= 4; digit++) {
+        const coefficient = tmp % 10;
+        if (coefficient === 0 && (0, bitwise_1.contains)(flags, CJK_ZEROS) && string !== '') {
+            string = numbers[coefficient] + string;
+        }
+        else if (coefficient > 1 ||
+            (coefficient === 1 && digit === 0) ||
+            (coefficient === 1 && digit === 1 && (0, bitwise_1.contains)(flags, CJK_TEN_COEFFICIENTS)) ||
+            (coefficient === 1 && digit === 1 && (0, bitwise_1.contains)(flags, CJK_TEN_HIGH_COEFFICIENTS) && value > 100) ||
+            (coefficient === 1 && digit > 1 && (0, bitwise_1.contains)(flags, CJK_HUNDRED_COEFFICIENTS))) {
+            string = numbers[coefficient] + (digit > 0 ? multipliers[digit - 1] : '') + string;
+        }
+        else if (coefficient === 1 && digit > 0) {
+            string = multipliers[digit - 1] + string;
+        }
+        tmp = Math.floor(tmp / 10);
+    }
+    return (value < 0 ? negativeSign : '') + string;
+};
+const CHINESE_INFORMAL_MULTIPLIERS = '十百千萬';
+const CHINESE_FORMAL_MULTIPLIERS = '拾佰仟萬';
+const JAPANESE_NEGATIVE = 'マイナス';
+const KOREAN_NEGATIVE = '마이너스';
+const createCounterText = (value, type, appendSuffix) => {
+    const defaultSuffix = appendSuffix ? '. ' : '';
+    const cjkSuffix = appendSuffix ? '、' : '';
+    const koreanSuffix = appendSuffix ? ', ' : '';
+    const spaceSuffix = appendSuffix ? ' ' : '';
+    switch (type) {
+        case 0 /* LIST_STYLE_TYPE.DISC */:
+            return '•' + spaceSuffix;
+        case 1 /* LIST_STYLE_TYPE.CIRCLE */:
+            return '◦' + spaceSuffix;
+        case 2 /* LIST_STYLE_TYPE.SQUARE */:
+            return '◾' + spaceSuffix;
+        case 5 /* LIST_STYLE_TYPE.DECIMAL_LEADING_ZERO */:
+            const string = createCounterStyleFromRange(value, 48, 57, true, defaultSuffix);
+            return string.length < 4 ? `0${string}` : string;
+        case 4 /* LIST_STYLE_TYPE.CJK_DECIMAL */:
+            return createCounterStyleFromSymbols(value, '〇一二三四五六七八九', cjkSuffix);
+        case 6 /* LIST_STYLE_TYPE.LOWER_ROMAN */:
+            return createAdditiveCounter(value, 1, 3999, ROMAN_UPPER, 3 /* LIST_STYLE_TYPE.DECIMAL */, defaultSuffix).toLowerCase();
+        case 7 /* LIST_STYLE_TYPE.UPPER_ROMAN */:
+            return createAdditiveCounter(value, 1, 3999, ROMAN_UPPER, 3 /* LIST_STYLE_TYPE.DECIMAL */, defaultSuffix);
+        case 8 /* LIST_STYLE_TYPE.LOWER_GREEK */:
+            return createCounterStyleFromRange(value, 945, 969, false, defaultSuffix);
+        case 9 /* LIST_STYLE_TYPE.LOWER_ALPHA */:
+            return createCounterStyleFromRange(value, 97, 122, false, defaultSuffix);
+        case 10 /* LIST_STYLE_TYPE.UPPER_ALPHA */:
+            return createCounterStyleFromRange(value, 65, 90, false, defaultSuffix);
+        case 11 /* LIST_STYLE_TYPE.ARABIC_INDIC */:
+            return createCounterStyleFromRange(value, 1632, 1641, true, defaultSuffix);
+        case 12 /* LIST_STYLE_TYPE.ARMENIAN */:
+        case 49 /* LIST_STYLE_TYPE.UPPER_ARMENIAN */:
+            return createAdditiveCounter(value, 1, 9999, ARMENIAN, 3 /* LIST_STYLE_TYPE.DECIMAL */, defaultSuffix);
+        case 35 /* LIST_STYLE_TYPE.LOWER_ARMENIAN */:
+            return createAdditiveCounter(value, 1, 9999, ARMENIAN, 3 /* LIST_STYLE_TYPE.DECIMAL */, defaultSuffix).toLowerCase();
+        case 13 /* LIST_STYLE_TYPE.BENGALI */:
+            return createCounterStyleFromRange(value, 2534, 2543, true, defaultSuffix);
+        case 14 /* LIST_STYLE_TYPE.CAMBODIAN */:
+        case 30 /* LIST_STYLE_TYPE.KHMER */:
+            return createCounterStyleFromRange(value, 6112, 6121, true, defaultSuffix);
+        case 15 /* LIST_STYLE_TYPE.CJK_EARTHLY_BRANCH */:
+            return createCounterStyleFromSymbols(value, '子丑寅卯辰巳午未申酉戌亥', cjkSuffix);
+        case 16 /* LIST_STYLE_TYPE.CJK_HEAVENLY_STEM */:
+            return createCounterStyleFromSymbols(value, '甲乙丙丁戊己庚辛壬癸', cjkSuffix);
+        case 17 /* LIST_STYLE_TYPE.CJK_IDEOGRAPHIC */:
+        case 48 /* LIST_STYLE_TYPE.TRAD_CHINESE_INFORMAL */:
+            return createCJKCounter(value, '零一二三四五六七八九', CHINESE_INFORMAL_MULTIPLIERS, '負', cjkSuffix, CJK_TEN_COEFFICIENTS | CJK_TEN_HIGH_COEFFICIENTS | CJK_HUNDRED_COEFFICIENTS);
+        case 47 /* LIST_STYLE_TYPE.TRAD_CHINESE_FORMAL */:
+            return createCJKCounter(value, '零壹貳參肆伍陸柒捌玖', CHINESE_FORMAL_MULTIPLIERS, '負', cjkSuffix, CJK_ZEROS | CJK_TEN_COEFFICIENTS | CJK_TEN_HIGH_COEFFICIENTS | CJK_HUNDRED_COEFFICIENTS);
+        case 42 /* LIST_STYLE_TYPE.SIMP_CHINESE_INFORMAL */:
+            return createCJKCounter(value, '零一二三四五六七八九', CHINESE_INFORMAL_MULTIPLIERS, '负', cjkSuffix, CJK_TEN_COEFFICIENTS | CJK_TEN_HIGH_COEFFICIENTS | CJK_HUNDRED_COEFFICIENTS);
+        case 41 /* LIST_STYLE_TYPE.SIMP_CHINESE_FORMAL */:
+            return createCJKCounter(value, '零壹贰叁肆伍陆柒捌玖', CHINESE_FORMAL_MULTIPLIERS, '负', cjkSuffix, CJK_ZEROS | CJK_TEN_COEFFICIENTS | CJK_TEN_HIGH_COEFFICIENTS | CJK_HUNDRED_COEFFICIENTS);
+        case 26 /* LIST_STYLE_TYPE.JAPANESE_INFORMAL */:
+            return createCJKCounter(value, '〇一二三四五六七八九', '十百千万', JAPANESE_NEGATIVE, cjkSuffix, 0);
+        case 25 /* LIST_STYLE_TYPE.JAPANESE_FORMAL */:
+            return createCJKCounter(value, '零壱弐参四伍六七八九', '拾百千万', JAPANESE_NEGATIVE, cjkSuffix, CJK_ZEROS | CJK_TEN_COEFFICIENTS | CJK_TEN_HIGH_COEFFICIENTS);
+        case 31 /* LIST_STYLE_TYPE.KOREAN_HANGUL_FORMAL */:
+            return createCJKCounter(value, '영일이삼사오육칠팔구', '십백천만', KOREAN_NEGATIVE, koreanSuffix, CJK_ZEROS | CJK_TEN_COEFFICIENTS | CJK_TEN_HIGH_COEFFICIENTS);
+        case 33 /* LIST_STYLE_TYPE.KOREAN_HANJA_INFORMAL */:
+            return createCJKCounter(value, '零一二三四五六七八九', '十百千萬', KOREAN_NEGATIVE, koreanSuffix, 0);
+        case 32 /* LIST_STYLE_TYPE.KOREAN_HANJA_FORMAL */:
+            return createCJKCounter(value, '零壹貳參四五六七八九', '拾百千', KOREAN_NEGATIVE, koreanSuffix, CJK_ZEROS | CJK_TEN_COEFFICIENTS | CJK_TEN_HIGH_COEFFICIENTS);
+        case 18 /* LIST_STYLE_TYPE.DEVANAGARI */:
+            return createCounterStyleFromRange(value, 0x966, 0x96f, true, defaultSuffix);
+        case 20 /* LIST_STYLE_TYPE.GEORGIAN */:
+            return createAdditiveCounter(value, 1, 19999, GEORGIAN, 3 /* LIST_STYLE_TYPE.DECIMAL */, defaultSuffix);
+        case 21 /* LIST_STYLE_TYPE.GUJARATI */:
+            return createCounterStyleFromRange(value, 0xae6, 0xaef, true, defaultSuffix);
+        case 22 /* LIST_STYLE_TYPE.GURMUKHI */:
+            return createCounterStyleFromRange(value, 0xa66, 0xa6f, true, defaultSuffix);
+        case 52 /* LIST_STYLE_TYPE.HEBREW */:
+            return createAdditiveCounter(value, 1, 10999, HEBREW, 3 /* LIST_STYLE_TYPE.DECIMAL */, defaultSuffix);
+        case 23 /* LIST_STYLE_TYPE.HIRAGANA */:
+            return createCounterStyleFromSymbols(value, 'あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゆよらりるれろわゐゑをん');
+        case 24 /* LIST_STYLE_TYPE.HIRAGANA_IROHA */:
+            return createCounterStyleFromSymbols(value, 'いろはにほへとちりぬるをわかよたれそつねならむうゐのおくやまけふこえてあさきゆめみしゑひもせす');
+        case 27 /* LIST_STYLE_TYPE.KANNADA */:
+            return createCounterStyleFromRange(value, 0xce6, 0xcef, true, defaultSuffix);
+        case 28 /* LIST_STYLE_TYPE.KATAKANA */:
+            return createCounterStyleFromSymbols(value, 'アイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤユヨラリルレロワヰヱヲン', cjkSuffix);
+        case 29 /* LIST_STYLE_TYPE.KATAKANA_IROHA */:
+            return createCounterStyleFromSymbols(value, 'イロハニホヘトチリヌルヲワカヨタレソツネナラムウヰノオクヤマケフコエテアサキユメミシヱヒモセス', cjkSuffix);
+        case 34 /* LIST_STYLE_TYPE.LAO */:
+            return createCounterStyleFromRange(value, 0xed0, 0xed9, true, defaultSuffix);
+        case 37 /* LIST_STYLE_TYPE.MONGOLIAN */:
+            return createCounterStyleFromRange(value, 0x1810, 0x1819, true, defaultSuffix);
+        case 38 /* LIST_STYLE_TYPE.MYANMAR */:
+            return createCounterStyleFromRange(value, 0x1040, 0x1049, true, defaultSuffix);
+        case 39 /* LIST_STYLE_TYPE.ORIYA */:
+            return createCounterStyleFromRange(value, 0xb66, 0xb6f, true, defaultSuffix);
+        case 40 /* LIST_STYLE_TYPE.PERSIAN */:
+            return createCounterStyleFromRange(value, 0x6f0, 0x6f9, true, defaultSuffix);
+        case 43 /* LIST_STYLE_TYPE.TAMIL */:
+            return createCounterStyleFromRange(value, 0xbe6, 0xbef, true, defaultSuffix);
+        case 44 /* LIST_STYLE_TYPE.TELUGU */:
+            return createCounterStyleFromRange(value, 0xc66, 0xc6f, true, defaultSuffix);
+        case 45 /* LIST_STYLE_TYPE.THAI */:
+            return createCounterStyleFromRange(value, 0xe50, 0xe59, true, defaultSuffix);
+        case 46 /* LIST_STYLE_TYPE.TIBETAN */:
+            return createCounterStyleFromRange(value, 0xf20, 0xf29, true, defaultSuffix);
+        case 3 /* LIST_STYLE_TYPE.DECIMAL */:
+        default:
+            return createCounterStyleFromRange(value, 48, 57, true, defaultSuffix);
+    }
+};
+exports.createCounterText = createCounterText;

package/dist/lib/css/types/functions/gradient.js

@@ -0,0 +1,163 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.calculateRadius = exports.calculateGradientDirection = exports.processColorStops = exports.parseColorStop = void 0;
+const color_1 = require("../color");
+const length_percentage_1 = require("../length-percentage");
+const parseColorStop = (context, args) => {
+    const color = color_1.color.parse(context, args[0]);
+    const stop = args[1];
+    return stop && (0, length_percentage_1.isLengthPercentage)(stop) ? { color, stop } : { color, stop: null };
+};
+exports.parseColorStop = parseColorStop;
+const processColorStops = (stops, lineLength) => {
+    const first = stops[0];
+    const last = stops[stops.length - 1];
+    if (first.stop === null) {
+        first.stop = length_percentage_1.ZERO_LENGTH;
+    }
+    if (last.stop === null) {
+        last.stop = length_percentage_1.HUNDRED_PERCENT;
+    }
+    const processStops = [];
+    let previous = 0;
+    for (let i = 0; i < stops.length; i++) {
+        const stop = stops[i].stop;
+        if (stop !== null) {
+            const absoluteValue = (0, length_percentage_1.getAbsoluteValue)(stop, lineLength);
+            if (absoluteValue > previous) {
+                processStops.push(absoluteValue);
+            }
+            else {
+                processStops.push(previous);
+            }
+            previous = absoluteValue;
+        }
+        else {
+            processStops.push(null);
+        }
+    }
+    let gapBegin = null;
+    for (let i = 0; i < processStops.length; i++) {
+        const stop = processStops[i];
+        if (stop === null) {
+            if (gapBegin === null) {
+                gapBegin = i;
+            }
+        }
+        else if (gapBegin !== null) {
+            const gapLength = i - gapBegin;
+            const beforeGap = processStops[gapBegin - 1];
+            const gapValue = (stop - beforeGap) / (gapLength + 1);
+            for (let g = 1; g <= gapLength; g++) {
+                processStops[gapBegin + g - 1] = gapValue * g;
+            }
+            gapBegin = null;
+        }
+    }
+    return stops.map(({ color }, i) => {
+        return { color, stop: Math.max(Math.min(1, processStops[i] / lineLength), 0) };
+    });
+};
+exports.processColorStops = processColorStops;
+const getAngleFromCorner = (corner, width, height) => {
+    const centerX = width / 2;
+    const centerY = height / 2;
+    const x = (0, length_percentage_1.getAbsoluteValue)(corner[0], width) - centerX;
+    const y = centerY - (0, length_percentage_1.getAbsoluteValue)(corner[1], height);
+    return (Math.atan2(y, x) + Math.PI * 2) % (Math.PI * 2);
+};
+const calculateGradientDirection = (angle, width, height) => {
+    const radian = typeof angle === 'number' ? angle : getAngleFromCorner(angle, width, height);
+    const lineLength = Math.abs(width * Math.sin(radian)) + Math.abs(height * Math.cos(radian));
+    const halfWidth = width / 2;
+    const halfHeight = height / 2;
+    const halfLineLength = lineLength / 2;
+    const yDiff = Math.sin(radian - Math.PI / 2) * halfLineLength;
+    const xDiff = Math.cos(radian - Math.PI / 2) * halfLineLength;
+    return [lineLength, halfWidth - xDiff, halfWidth + xDiff, halfHeight - yDiff, halfHeight + yDiff];
+};
+exports.calculateGradientDirection = calculateGradientDirection;
+const distance = (a, b) => Math.sqrt(a * a + b * b);
+const findCorner = (width, height, x, y, closest) => {
+    const corners = [
+        [0, 0],
+        [0, height],
+        [width, 0],
+        [width, height]
+    ];
+    return corners.reduce((stat, corner) => {
+        const [cx, cy] = corner;
+        const d = distance(x - cx, y - cy);
+        if (closest ? d < stat.optimumDistance : d > stat.optimumDistance) {
+            return {
+                optimumCorner: corner,
+                optimumDistance: d
+            };
+        }
+        return stat;
+    }, {
+        optimumDistance: closest ? Infinity : -Infinity,
+        optimumCorner: null
+    }).optimumCorner;
+};
+const calculateRadius = (gradient, x, y, width, height) => {
+    let rx = 0;
+    let ry = 0;
+    switch (gradient.size) {
+        case 0 /* CSSRadialExtent.CLOSEST_SIDE */:
+            // The ending shape is sized so that that it exactly meets the side of the gradient box closest to the gradient’s center.
+            // If the shape is an ellipse, it exactly meets the closest side in each dimension.
+            if (gradient.shape === 0 /* CSSRadialShape.CIRCLE */) {
+                rx = ry = Math.min(Math.abs(x), Math.abs(x - width), Math.abs(y), Math.abs(y - height));
+            }
+            else if (gradient.shape === 1 /* CSSRadialShape.ELLIPSE */) {
+                rx = Math.min(Math.abs(x), Math.abs(x - width));
+                ry = Math.min(Math.abs(y), Math.abs(y - height));
+            }
+            break;
+        case 2 /* CSSRadialExtent.CLOSEST_CORNER */:
+            // The ending shape is sized so that that it passes through the corner of the gradient box closest to the gradient’s center.
+            // If the shape is an ellipse, the ending shape is given the same aspect-ratio it would have if closest-side were specified.
+            if (gradient.shape === 0 /* CSSRadialShape.CIRCLE */) {
+                rx = ry = Math.min(distance(x, y), distance(x, y - height), distance(x - width, y), distance(x - width, y - height));
+            }
+            else if (gradient.shape === 1 /* CSSRadialShape.ELLIPSE */) {
+                // Compute the ratio ry/rx (which is to be the same as for "closest-side")
+                const c = Math.min(Math.abs(y), Math.abs(y - height)) / Math.min(Math.abs(x), Math.abs(x - width));
+                const [cx, cy] = findCorner(width, height, x, y, true);
+                rx = distance(cx - x, (cy - y) / c);
+                ry = c * rx;
+            }
+            break;
+        case 1 /* CSSRadialExtent.FARTHEST_SIDE */:
+            // Same as closest-side, except the ending shape is sized based on the farthest side(s)
+            if (gradient.shape === 0 /* CSSRadialShape.CIRCLE */) {
+                rx = ry = Math.max(Math.abs(x), Math.abs(x - width), Math.abs(y), Math.abs(y - height));
+            }
+            else if (gradient.shape === 1 /* CSSRadialShape.ELLIPSE */) {
+                rx = Math.max(Math.abs(x), Math.abs(x - width));
+                ry = Math.max(Math.abs(y), Math.abs(y - height));
+            }
+            break;
+        case 3 /* CSSRadialExtent.FARTHEST_CORNER */:
+            // Same as closest-corner, except the ending shape is sized based on the farthest corner.
+            // If the shape is an ellipse, the ending shape is given the same aspect ratio it would have if farthest-side were specified.
+            if (gradient.shape === 0 /* CSSRadialShape.CIRCLE */) {
+                rx = ry = Math.max(distance(x, y), distance(x, y - height), distance(x - width, y), distance(x - width, y - height));
+            }
+            else if (gradient.shape === 1 /* CSSRadialShape.ELLIPSE */) {
+                // Compute the ratio ry/rx (which is to be the same as for "farthest-side")
+                const c = Math.max(Math.abs(y), Math.abs(y - height)) / Math.max(Math.abs(x), Math.abs(x - width));
+                const [cx, cy] = findCorner(width, height, x, y, false);
+                rx = distance(cx - x, (cy - y) / c);
+                ry = c * rx;
+            }
+            break;
+    }
+    if (Array.isArray(gradient.size)) {
+        rx = (0, length_percentage_1.getAbsoluteValue)(gradient.size[0], width);
+        ry = gradient.size.length === 2 ? (0, length_percentage_1.getAbsoluteValue)(gradient.size[1], height) : rx;
+    }
+    return [rx, ry];
+};
+exports.calculateRadius = calculateRadius;

package/dist/lib/css/types/functions/linear-gradient.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.linearGradient = void 0;
+const parser_1 = require("../../syntax/parser");
+const angle_1 = require("../angle");
+const gradient_1 = require("./gradient");
+const linearGradient = (context, tokens) => {
+    let angle = (0, angle_1.deg)(180);
+    const stops = [];
+    (0, parser_1.parseFunctionArgs)(tokens).forEach((arg, i) => {
+        if (i === 0) {
+            const firstToken = arg[0];
+            if (firstToken.type === 20 /* TokenType.IDENT_TOKEN */ && firstToken.value === 'to') {
+                angle = (0, angle_1.parseNamedSide)(arg);
+                return;
+            }
+            else if ((0, angle_1.isAngle)(firstToken)) {
+                angle = angle_1.angle.parse(context, firstToken);
+                return;
+            }
+        }
+        const colorStop = (0, gradient_1.parseColorStop)(context, arg);
+        stops.push(colorStop);
+    });
+    return { angle, stops, type: 1 /* CSSImageType.LINEAR_GRADIENT */ };
+};
+exports.linearGradient = linearGradient;

package/dist/lib/css/types/functions/radial-gradient.js

@@ -0,0 +1,90 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.radialGradient = exports.CONTAIN = exports.COVER = exports.ELLIPSE = exports.CIRCLE = exports.FARTHEST_CORNER = exports.CLOSEST_CORNER = exports.FARTHEST_SIDE = exports.CLOSEST_SIDE = void 0;
+const parser_1 = require("../../syntax/parser");
+const gradient_1 = require("./gradient");
+const length_percentage_1 = require("../length-percentage");
+const length_1 = require("../length");
+exports.CLOSEST_SIDE = 'closest-side';
+exports.FARTHEST_SIDE = 'farthest-side';
+exports.CLOSEST_CORNER = 'closest-corner';
+exports.FARTHEST_CORNER = 'farthest-corner';
+exports.CIRCLE = 'circle';
+exports.ELLIPSE = 'ellipse';
+exports.COVER = 'cover';
+exports.CONTAIN = 'contain';
+const radialGradient = (context, tokens) => {
+    let shape = 0 /* CSSRadialShape.CIRCLE */;
+    let size = 3 /* CSSRadialExtent.FARTHEST_CORNER */;
+    const stops = [];
+    const position = [];
+    (0, parser_1.parseFunctionArgs)(tokens).forEach((arg, i) => {
+        let isColorStop = true;
+        if (i === 0) {
+            let isAtPosition = false;
+            isColorStop = arg.reduce((acc, token) => {
+                if (isAtPosition) {
+                    if ((0, parser_1.isIdentToken)(token)) {
+                        switch (token.value) {
+                            case 'center':
+                                position.push(length_percentage_1.FIFTY_PERCENT);
+                                return acc;
+                            case 'top':
+                            case 'left':
+                                position.push(length_percentage_1.ZERO_LENGTH);
+                                return acc;
+                            case 'right':
+                            case 'bottom':
+                                position.push(length_percentage_1.HUNDRED_PERCENT);
+                                return acc;
+                        }
+                    }
+                    else if ((0, length_percentage_1.isLengthPercentage)(token) || (0, length_1.isLength)(token)) {
+                        position.push(token);
+                    }
+                }
+                else if ((0, parser_1.isIdentToken)(token)) {
+                    switch (token.value) {
+                        case exports.CIRCLE:
+                            shape = 0 /* CSSRadialShape.CIRCLE */;
+                            return false;
+                        case exports.ELLIPSE:
+                            shape = 1 /* CSSRadialShape.ELLIPSE */;
+                            return false;
+                        case 'at':
+                            isAtPosition = true;
+                            return false;
+                        case exports.CLOSEST_SIDE:
+                            size = 0 /* CSSRadialExtent.CLOSEST_SIDE */;
+                            return false;
+                        case exports.COVER:
+                        case exports.FARTHEST_SIDE:
+                            size = 1 /* CSSRadialExtent.FARTHEST_SIDE */;
+                            return false;
+                        case exports.CONTAIN:
+                        case exports.CLOSEST_CORNER:
+                            size = 2 /* CSSRadialExtent.CLOSEST_CORNER */;
+                            return false;
+                        case exports.FARTHEST_CORNER:
+                            size = 3 /* CSSRadialExtent.FARTHEST_CORNER */;
+                            return false;
+                    }
+                }
+                else if ((0, length_1.isLength)(token) || (0, length_percentage_1.isLengthPercentage)(token)) {
+                    if (!Array.isArray(size)) {
+                        size = [];
+                    }
+                    size.push(token);
+                    return false;
+                }
+                return acc;
+            }, isColorStop);
+        }
+        if (isColorStop) {
+            const colorStop = (0, gradient_1.parseColorStop)(context, arg);
+            stops.push(colorStop);
+        }
+    });
+    return { size, shape, stops, position, type: 2 /* CSSImageType.RADIAL_GRADIENT */ };
+};
+exports.radialGradient = radialGradient;

package/dist/lib/css/types/functions/repeating-linear-gradient.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.repeatingLinearGradient = void 0;
+const linear_gradient_1 = require("./linear-gradient");
+const repeatingLinearGradient = (context, tokens) => {
+    const gradient = (0, linear_gradient_1.linearGradient)(context, tokens);
+    return { ...gradient, type: 3 /* CSSImageType.REPEATING_LINEAR_GRADIENT */ };
+};
+exports.repeatingLinearGradient = repeatingLinearGradient;