@taiga-ui/cdk
Version:
Base library for creating Angular components and applications using Taiga UI principles regarding of actual visual appearance
70 lines • 9.34 kB
JavaScript
import { tuiParseColor } from './parse-color';
//
// TypeScript parser based on Dean Taylor's answer:
// https://stackoverflow.com/a/20238168/2706426
//
// SETUP CODE
const COMMA = String.raw `\s*,\s*`; // Allow space around comma.
const HEX = '#(?:[a-f0-9]{6}|[a-f0-9]{3})'; // 3 or 6 character form
const RGB = String.raw `\(\s*(?:\d{1,3}\s*,\s*){2}\d{1,3}\s*\)`; // "(1, 2, 3)"
const RGBA = String.raw `\(\s*(?:\d{1,3}\s*,\s*){2}\d{1,3}\s*,\s*\d*\.?\d+\)`; // "(1, 2, 3, 4)"
const VALUE = String.raw `(?:[+-]?\d*\.?\d+)(?:%|[a-z]+)?`; // ".9", "-5px", "100%".
const KEYWORD = '[_a-z-][_a-z0-9-]*'; // "red", "transparent", "border-collapse".
const COLOR = [
'(?:',
HEX,
'|',
'(?:rgb|hsl)',
RGB,
'|',
'(?:rgba|hsla)',
RGBA,
'|',
KEYWORD,
')',
];
const REGEXP_ARRAY = [
String.raw `\s*(`,
...COLOR,
')',
String.raw `(?:\s+`,
'(',
VALUE,
'))?',
'(?:',
COMMA,
String.raw `\s*)?`,
];
function getPosition(match, stops) {
const fallback = stops === 1 ? '100%' : `${stops}%`;
return match?.includes('%') ? match : fallback;
}
export function tuiParseGradient(input) {
const stopsRegexp = new RegExp(REGEXP_ARRAY.join(''), 'gi');
const stopsString = input.startsWith('to') || /^\d/.exec(input)
? input.slice(Math.max(0, input.indexOf(',') + 1)).trim()
: input;
const side = input.startsWith('to')
? input.split(',')[0]
: 'to bottom';
let stops = [];
let matchColorStop = stopsRegexp.exec(stopsString);
while (matchColorStop !== null) {
stops = stops.concat({
color: matchColorStop[1] || '',
position: getPosition(matchColorStop[2] || '', stops.length),
});
matchColorStop = stopsRegexp.exec(stopsString);
}
stops = stops.filter(({ color }) => color.startsWith('#') || color.startsWith('rgb'));
return {
stops,
side,
};
}
export function tuiToGradient({ stops, side }) {
return `linear-gradient(${side}, ${stops
.map(({ color, position }) => `rgba(${tuiParseColor(color).join(', ')}) ${position}`)
.join(', ')})`;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFyc2UtZ3JhZGllbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jZGsvdXRpbHMvY29sb3IvcGFyc2UtZ3JhZGllbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLGFBQWEsRUFBQyxNQUFNLGVBQWUsQ0FBQztBQW9CNUMsRUFBRTtBQUNGLG1EQUFtRDtBQUNuRCwrQ0FBK0M7QUFDL0MsRUFBRTtBQUNGLGFBQWE7QUFDYixNQUFNLEtBQUssR0FBRyxNQUFNLENBQUMsR0FBRyxDQUFBLFNBQVMsQ0FBQyxDQUFDLDRCQUE0QjtBQUMvRCxNQUFNLEdBQUcsR0FBRyw4QkFBOEIsQ0FBQyxDQUFDLHdCQUF3QjtBQUNwRSxNQUFNLEdBQUcsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUFBLHdDQUF3QyxDQUFDLENBQUMsY0FBYztBQUM5RSxNQUFNLElBQUksR0FBRyxNQUFNLENBQUMsR0FBRyxDQUFBLHFEQUFxRCxDQUFDLENBQUMsaUJBQWlCO0FBQy9GLE1BQU0sS0FBSyxHQUFHLE1BQU0sQ0FBQyxHQUFHLENBQUEsaUNBQWlDLENBQUMsQ0FBQyx3QkFBd0I7QUFDbkYsTUFBTSxPQUFPLEdBQUcsb0JBQW9CLENBQUMsQ0FBQywyQ0FBMkM7QUFDakYsTUFBTSxLQUFLLEdBQUc7SUFDVixLQUFLO0lBQ0wsR0FBRztJQUNILEdBQUc7SUFDSCxhQUFhO0lBQ2IsR0FBRztJQUNILEdBQUc7SUFDSCxlQUFlO0lBQ2YsSUFBSTtJQUNKLEdBQUc7SUFDSCxPQUFPO0lBQ1AsR0FBRztDQUNOLENBQUM7QUFDRixNQUFNLFlBQVksR0FBRztJQUNqQixNQUFNLENBQUMsR0FBRyxDQUFBLE1BQU07SUFDaEIsR0FBRyxLQUFLO0lBQ1IsR0FBRztJQUNILE1BQU0sQ0FBQyxHQUFHLENBQUEsUUFBUTtJQUNsQixHQUFHO0lBQ0gsS0FBSztJQUNMLEtBQUs7SUFDTCxLQUFLO0lBQ0wsS0FBSztJQUNMLE1BQU0sQ0FBQyxHQUFHLENBQUEsT0FBTztDQUNwQixDQUFDO0FBRUYsU0FBUyxXQUFXLENBQUMsS0FBYSxFQUFFLEtBQWE7SUFDN0MsTUFBTSxRQUFRLEdBQUcsS0FBSyxLQUFLLENBQUMsQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQyxHQUFHLEtBQUssR0FBRyxDQUFDO0lBRXBELE9BQU8sS0FBSyxFQUFFLFFBQVEsQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxRQUFRLENBQUM7QUFDbkQsQ0FBQztBQUVELE1BQU0sVUFBVSxnQkFBZ0IsQ0FBQyxLQUFhO0lBQzFDLE1BQU0sV0FBVyxHQUFHLElBQUksTUFBTSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDLEVBQUUsSUFBSSxDQUFDLENBQUM7SUFDNUQsTUFBTSxXQUFXLEdBQ2IsS0FBSyxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMsSUFBSSxLQUFLLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQztRQUN2QyxDQUFDLENBQUMsS0FBSyxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUMsRUFBRSxLQUFLLENBQUMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDLENBQUMsSUFBSSxFQUFFO1FBQ3pELENBQUMsQ0FBQyxLQUFLLENBQUM7SUFFaEIsTUFBTSxJQUFJLEdBQUcsS0FBSyxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUM7UUFDL0IsQ0FBQyxDQUFFLEtBQUssQ0FBQyxLQUFLLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxDQUEwQjtRQUMvQyxDQUFDLENBQUMsV0FBVyxDQUFDO0lBQ2xCLElBQUksS0FBSyxHQUErQixFQUFFLENBQUM7SUFFM0MsSUFBSSxjQUFjLEdBQUcsV0FBVyxDQUFDLElBQUksQ0FBQyxXQUFXLENBQUMsQ0FBQztJQUVuRCxPQUFPLGNBQWMsS0FBSyxJQUFJLEVBQUU7UUFDNUIsS0FBSyxHQUFHLEtBQUssQ0FBQyxNQUFNLENBQUM7WUFDakIsS0FBSyxFQUFFLGNBQWMsQ0FBQyxDQUFDLENBQUMsSUFBSSxFQUFFO1lBQzlCLFFBQVEsRUFBRSxXQUFXLENBQUMsY0FBYyxDQUFDLENBQUMsQ0FBQyxJQUFJLEVBQUUsRUFBRSxLQUFLLENBQUMsTUFBTSxDQUFDO1NBQy9ELENBQUMsQ0FBQztRQUVILGNBQWMsR0FBRyxXQUFXLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDO0tBQ2xEO0lBRUQsS0FBSyxHQUFHLEtBQUssQ0FBQyxNQUFNLENBQUMsQ0FBQyxFQUFDLEtBQUssRUFBQyxFQUFFLEVBQUUsQ0FBQyxLQUFLLENBQUMsVUFBVSxDQUFDLEdBQUcsQ0FBQyxJQUFJLEtBQUssQ0FBQyxVQUFVLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQztJQUVwRixPQUFPO1FBQ0gsS0FBSztRQUNMLElBQUk7S0FDUCxDQUFDO0FBQ04sQ0FBQztBQUVELE1BQU0sVUFBVSxhQUFhLENBQUMsRUFBQyxLQUFLLEVBQUUsSUFBSSxFQUFvQjtJQUMxRCxPQUFPLG1CQUFtQixJQUFJLEtBQUssS0FBSztTQUNuQyxHQUFHLENBQ0EsQ0FBQyxFQUFDLEtBQUssRUFBRSxRQUFRLEVBQUMsRUFBRSxFQUFFLENBQUMsUUFBUSxhQUFhLENBQUMsS0FBSyxDQUFDLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLFFBQVEsRUFBRSxDQUNoRjtTQUNBLElBQUksQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDO0FBQ3ZCLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge3R1aVBhcnNlQ29sb3J9IGZyb20gJy4vcGFyc2UtY29sb3InO1xuXG5leHBvcnQgaW50ZXJmYWNlIFR1aVBhcnNlZEdyYWRpZW50IHtcbiAgICByZWFkb25seSBzaWRlOiBUdWlHcmFkaWVudERpcmVjdGlvbjtcbiAgICByZWFkb25seSBzdG9wczogUmVhZG9ubHlBcnJheTx7XG4gICAgICAgIHJlYWRvbmx5IGNvbG9yOiBzdHJpbmc7XG4gICAgICAgIHJlYWRvbmx5IHBvc2l0aW9uOiBzdHJpbmc7XG4gICAgfT47XG59XG5cbmV4cG9ydCB0eXBlIFR1aUdyYWRpZW50RGlyZWN0aW9uID1cbiAgICB8ICd0byBib3R0b20gbGVmdCdcbiAgICB8ICd0byBib3R0b20gcmlnaHQnXG4gICAgfCAndG8gYm90dG9tJ1xuICAgIHwgJ3RvIGxlZnQnXG4gICAgfCAndG8gcmlnaHQnXG4gICAgfCAndG8gdG9wIGxlZnQnXG4gICAgfCAndG8gdG9wIHJpZ2h0J1xuICAgIHwgJ3RvIHRvcCc7XG5cbi8vXG4vLyBUeXBlU2NyaXB0IHBhcnNlciBiYXNlZCBvbiBEZWFuIFRheWxvcidzIGFuc3dlcjpcbi8vIGh0dHBzOi8vc3RhY2tvdmVyZmxvdy5jb20vYS8yMDIzODE2OC8yNzA2NDI2XG4vL1xuLy8gU0VUVVAgQ09ERVxuY29uc3QgQ09NTUEgPSBTdHJpbmcucmF3YFxccyosXFxzKmA7IC8vIEFsbG93IHNwYWNlIGFyb3VuZCBjb21tYS5cbmNvbnN0IEhFWCA9ICcjKD86W2EtZjAtOV17Nn18W2EtZjAtOV17M30pJzsgLy8gMyBvciA2IGNoYXJhY3RlciBmb3JtXG5jb25zdCBSR0IgPSBTdHJpbmcucmF3YFxcKFxccyooPzpcXGR7MSwzfVxccyosXFxzKil7Mn1cXGR7MSwzfVxccypcXClgOyAvLyBcIigxLCAyLCAzKVwiXG5jb25zdCBSR0JBID0gU3RyaW5nLnJhd2BcXChcXHMqKD86XFxkezEsM31cXHMqLFxccyopezJ9XFxkezEsM31cXHMqLFxccypcXGQqXFwuP1xcZCtcXClgOyAvLyBcIigxLCAyLCAzLCA0KVwiXG5jb25zdCBWQUxVRSA9IFN0cmluZy5yYXdgKD86WystXT9cXGQqXFwuP1xcZCspKD86JXxbYS16XSspP2A7IC8vIFwiLjlcIiwgXCItNXB4XCIsIFwiMTAwJVwiLlxuY29uc3QgS0VZV09SRCA9ICdbX2Etei1dW19hLXowLTktXSonOyAvLyBcInJlZFwiLCBcInRyYW5zcGFyZW50XCIsIFwiYm9yZGVyLWNvbGxhcHNlXCIuXG5jb25zdCBDT0xPUiA9IFtcbiAgICAnKD86JyxcbiAgICBIRVgsXG4gICAgJ3wnLFxuICAgICcoPzpyZ2J8aHNsKScsXG4gICAgUkdCLFxuICAgICd8JyxcbiAgICAnKD86cmdiYXxoc2xhKScsXG4gICAgUkdCQSxcbiAgICAnfCcsXG4gICAgS0VZV09SRCxcbiAgICAnKScsXG5dO1xuY29uc3QgUkVHRVhQX0FSUkFZID0gW1xuICAgIFN0cmluZy5yYXdgXFxzKihgLFxuICAgIC4uLkNPTE9SLFxuICAgICcpJyxcbiAgICBTdHJpbmcucmF3YCg/OlxccytgLFxuICAgICcoJyxcbiAgICBWQUxVRSxcbiAgICAnKSk/JyxcbiAgICAnKD86JyxcbiAgICBDT01NQSxcbiAgICBTdHJpbmcucmF3YFxccyopP2AsXG5dO1xuXG5mdW5jdGlvbiBnZXRQb3NpdGlvbihtYXRjaDogc3RyaW5nLCBzdG9wczogbnVtYmVyKTogc3RyaW5nIHtcbiAgICBjb25zdCBmYWxsYmFjayA9IHN0b3BzID09PSAxID8gJzEwMCUnIDogYCR7c3RvcHN9JWA7XG5cbiAgICByZXR1cm4gbWF0Y2g/LmluY2x1ZGVzKCclJykgPyBtYXRjaCA6IGZhbGxiYWNrO1xufVxuXG5leHBvcnQgZnVuY3Rpb24gdHVpUGFyc2VHcmFkaWVudChpbnB1dDogc3RyaW5nKTogVHVpUGFyc2VkR3JhZGllbnQge1xuICAgIGNvbnN0IHN0b3BzUmVnZXhwID0gbmV3IFJlZ0V4cChSRUdFWFBfQVJSQVkuam9pbignJyksICdnaScpO1xuICAgIGNvbnN0IHN0b3BzU3RyaW5nID1cbiAgICAgICAgaW5wdXQuc3RhcnRzV2l0aCgndG8nKSB8fCAvXlxcZC8uZXhlYyhpbnB1dClcbiAgICAgICAgICAgID8gaW5wdXQuc2xpY2UoTWF0aC5tYXgoMCwgaW5wdXQuaW5kZXhPZignLCcpICsgMSkpLnRyaW0oKVxuICAgICAgICAgICAgOiBpbnB1dDtcblxuICAgIGNvbnN0IHNpZGUgPSBpbnB1dC5zdGFydHNXaXRoKCd0bycpXG4gICAgICAgID8gKGlucHV0LnNwbGl0KCcsJylbMF0gYXMgVHVpR3JhZGllbnREaXJlY3Rpb24pXG4gICAgICAgIDogJ3RvIGJvdHRvbSc7XG4gICAgbGV0IHN0b3BzOiBUdWlQYXJzZWRHcmFkaWVudFsnc3RvcHMnXSA9IFtdO1xuXG4gICAgbGV0IG1hdGNoQ29sb3JTdG9wID0gc3RvcHNSZWdleHAuZXhlYyhzdG9wc1N0cmluZyk7XG5cbiAgICB3aGlsZSAobWF0Y2hDb2xvclN0b3AgIT09IG51bGwpIHtcbiAgICAgICAgc3RvcHMgPSBzdG9wcy5jb25jYXQoe1xuICAgICAgICAgICAgY29sb3I6IG1hdGNoQ29sb3JTdG9wWzFdIHx8ICcnLFxuICAgICAgICAgICAgcG9zaXRpb246IGdldFBvc2l0aW9uKG1hdGNoQ29sb3JTdG9wWzJdIHx8ICcnLCBzdG9wcy5sZW5ndGgpLFxuICAgICAgICB9KTtcblxuICAgICAgICBtYXRjaENvbG9yU3RvcCA9IHN0b3BzUmVnZXhwLmV4ZWMoc3RvcHNTdHJpbmcpO1xuICAgIH1cblxuICAgIHN0b3BzID0gc3RvcHMuZmlsdGVyKCh7Y29sb3J9KSA9PiBjb2xvci5zdGFydHNXaXRoKCcjJykgfHwgY29sb3Iuc3RhcnRzV2l0aCgncmdiJykpO1xuXG4gICAgcmV0dXJuIHtcbiAgICAgICAgc3RvcHMsXG4gICAgICAgIHNpZGUsXG4gICAgfTtcbn1cblxuZXhwb3J0IGZ1bmN0aW9uIHR1aVRvR3JhZGllbnQoe3N0b3BzLCBzaWRlfTogVHVpUGFyc2VkR3JhZGllbnQpOiBzdHJpbmcge1xuICAgIHJldHVybiBgbGluZWFyLWdyYWRpZW50KCR7c2lkZX0sICR7c3RvcHNcbiAgICAgICAgLm1hcChcbiAgICAgICAgICAgICh7Y29sb3IsIHBvc2l0aW9ufSkgPT4gYHJnYmEoJHt0dWlQYXJzZUNvbG9yKGNvbG9yKS5qb2luKCcsICcpfSkgJHtwb3NpdGlvbn1gLFxuICAgICAgICApXG4gICAgICAgIC5qb2luKCcsICcpfSlgO1xufVxuIl19