Skip to content

Commit 6a6a08a

Browse files
romainmenkeromainmenke
committed
small improvements
1 parent 9b32f13 commit 6a6a08a

File tree

11 files changed

+23
-17
lines changed

11 files changed

+23
-17
lines changed

‎package-lock.json

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎packages/css-color-parser/dist/color-data.d.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ export declare enum SyntaxFlag {
2626
}
2727
export declare function colorData_to_XYZ_D50(colorData: ColorData): ColorData;
2828
export declare function colorDataTo(colorData: ColorData, toNotation: ColorNotation): ColorData;
29-
export declare function setPowerlessComponents(a: Color, colorNotation: ColorNotation): Color;
29+
export declare function convertPowerlessComponentsToMissingComponents(a: Color, colorNotation: ColorNotation): Color;
3030
export declare function fillInMissingComponents(a: Color, b: Color): Color;
3131
export declare function colorDataChannelsToCalcGlobals(x: ColorData): Map<string, TokenNumber>;
3232
export declare function colorDataFitsRGB_Gamut(x: ColorData): boolean;

‎packages/css-color-parser/dist/index.cjs

Lines changed: 1 addition & 1 deletion
Large diffs are not rendered by default.

‎packages/css-color-parser/dist/index.mjs

Lines changed: 1 addition & 1 deletion
Large diffs are not rendered by default.

‎packages/css-color-parser/src/color-data.ts

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -280,13 +280,12 @@ export function colorDataTo(colorData: ColorData, toNotation: ColorNotation): Co
280280
}
281281
}
282282

283-
// 3. Convert powerless components to missing components
284-
outputColorData.channels = setPowerlessComponents(outputColorData.channels, toNotation);
283+
outputColorData.channels = convertPowerlessComponentsToMissingComponents(outputColorData.channels, toNotation);
285284

286285
return outputColorData;
287286
}
288287

289-
export function setPowerlessComponents(a: Color, colorNotation: ColorNotation): Color {
288+
export function convertPowerlessComponentsToMissingComponents(a: Color, colorNotation: ColorNotation): Color {
290289
const out: Color = [...a];
291290

292291
switch (colorNotation) {

‎packages/css-color-parser/src/serialize/p3.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { ColorData, setPowerlessComponents } from '../color-data';
1+
import { ColorData, convertPowerlessComponentsToMissingComponents } from '../color-data';
22
import type { TokenCloseParen, TokenFunction, TokenWhitespace } from '@csstools/css-tokenizer';
33
import { colorData_to_XYZ_D50 } from '../color-data';
44
import { ColorNotation } from '../color-notation';
@@ -8,7 +8,7 @@ import { calculations, Color, conversions, utils, xyz } from '@csstools/color-he
88
import { toPrecision } from './to-precision';
99

1010
export function serializeP3(color: ColorData, gamutMapping = true): FunctionNode {
11-
color.channels = setPowerlessComponents(color.channels, color.colorNotation);
11+
color.channels = convertPowerlessComponentsToMissingComponents(color.channels, color.colorNotation);
1212
let p3 = color.channels.map((x) => Number.isNaN(x) ? 0 : x);
1313

1414
if (

‎packages/css-color-parser/src/serialize/rgb.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { ColorData, setPowerlessComponents } from '../color-data';
1+
import { ColorData, convertPowerlessComponentsToMissingComponents } from '../color-data';
22
import type { TokenCloseParen, TokenComma, TokenWhitespace } from '@csstools/css-tokenizer';
33
import { ColorNotation } from '../color-notation';
44
import { FunctionNode, TokenNode } from '@csstools/css-parser-algorithms';
@@ -8,7 +8,7 @@ import { colorData_to_XYZ_D50 } from '../color-data';
88
import { toPrecision } from './to-precision';
99

1010
export function serializeRGB(color: ColorData, gamutMapping = true): FunctionNode {
11-
color.channels = setPowerlessComponents(color.channels, color.colorNotation);
11+
color.channels = convertPowerlessComponentsToMissingComponents(color.channels, color.colorNotation);
1212
let srgb = color.channels.map((x) => Number.isNaN(x) ? 0 : x);
1313

1414
if (

‎plugins/postcss-gradients-interpolation-method/dist/index.cjs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
"use strict";var e=require("@csstools/postcss-progressive-custom-properties"),o=require("@csstools/css-parser-algorithms"),t=require("@csstools/css-tokenizer"),n=require("@csstools/css-color-parser");const i=/(repeating-)?(linear|radial|conic)-gradient\(/i,s=/^(repeating-)?(linear|radial|conic)-gradient$/i;function hasFallback(e){const o=e.parent;if(!o)return!1;const t=e.prop.toLowerCase(),n=o.index(e);for(let e=0;e<n;e++){const n=o.nodes[e];if("decl"===n.type&&n.prop.toLowerCase()===t)return!0}return!1}function hasSupportsAtRuleAncestor(e){let o=e.parent;for(;o;)if("atrule"===o.type){if("supports"===o.name&&i.test(o.params))return!0;o=o.parent}else o=o.parent;return!1}function interpolateColorsInColorStopsList(e,i,s,r=!1){const a=[],l=[];for(let r=0;r<e.length-1;r++){const a=e[r],c=e[r+1];if(l.push(a),n.serializeP3(a.colorData,!1).toString()!==n.serializeP3(c.colorData,!1).toString()&&a.position.toString()!==c.position.toString())for(let e=1;e<=9;e++){const r=10*e;let p=[];s&&(p=[new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]]),s,new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]]),new o.TokenNode([t.TokenType.Ident,"hue",-1,-1,{value:"hue"}])]);const u=new o.FunctionNode([t.TokenType.Function,"color-mix(",-1,-1,{value:"color-mix"}],[t.TokenType.CloseParen,")",-1,-1,void 0],[new o.TokenNode([t.TokenType.Ident,"in",-1,-1,{value:"in"}]),new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]]),i,...p,new o.TokenNode([t.TokenType.Comma,",",-1,-1,void 0]),new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]]),a.color,new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]]),new o.TokenNode([t.TokenType.Percentage,100-r+"%",-1,-1,{value:100-r}]),new o.TokenNode([t.TokenType.Comma,",",-1,-1,void 0]),new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]]),c.color,new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]]),new o.TokenNode([t.TokenType.Percentage,`${r}%`,-1,-1,{value:r}])]),d=n.color(u);if(!d)return!1;l.push({colorData:d})}r===e.length-2&&l.push(c)}for(let e=0;e<l.length;e++)r&&!n.colorDataFitsRGB_Gamut(l[e].colorData)?l[e].color=n.serializeP3(l[e].colorData,!1):l[e].color=n.serializeRGB(l[e].colorData,!1);for(let e=0;e<l.length;e++){const n=l[e];n.position?a.push(n.color,new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]]),n.position):a.push(n.color),e!==l.length-1&&a.push(new o.TokenNode([t.TokenType.Comma,",",-1,-1,void 0]),new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]]))}return a}function parseColorStops(e){const i=[];let s={};for(let r=0;r<e.length;r++){const a=e[r];if(o.isCommentNode(a)||o.isWhitespaceNode(a))continue;if(o.isTokenNode(a)&&a.value[0]===t.TokenType.Comma){if(s.color&&s.colorData&&s.positionA){i.push({color:s.color,colorData:s.colorData,position:s.positionA}),s.positionB&&i.push({color:s.color,colorData:s.colorData,position:s.positionB}),s={};continue}return!1}const l=n.color(a);if(l){if(s.color)return!1;s.color=a,s.colorData=l}else{if(!s.color)return!1;if(s.positionA){if(!s.positionA||s.positionB)return!1;s.positionB=a}else s.positionA=a}}return!(!s.color||!s.positionA)&&(s.color&&s.colorData&&s.positionA&&(i.push({color:s.color,colorData:s.colorData,position:s.positionA}),s.positionB&&i.push({color:s.color,colorData:s.colorData,position:s.positionB})),!(i.length<2)&&i)}const r=/^(srgb|srgb-linear|lab|oklab|xyz|xyz-d50|xyz-d65|hsl|hwb|lch|oklch)$/i,a=/^(hsl|hwb|lch|oklch)$/i,l=/^(shorter|longer|increasing|decreasing)$/i,c=/^in$/i,p=/^hue$/i;function modifyGradientFunctionComponentValues(e,n=!1){const i=e.getName();if(!s.test(i))return!1;let u="srgb",d=null,T=null,f=null,h=null,v=null,m=[];{let n=0,i=e.value[n];for(;!o.isTokenNode(i)||i.value[0]!==t.TokenType.Ident||!c.test(i.value[4].value);){if(o.isTokenNode(i)&&i.value[0]===t.TokenType.Comma)return!1;n++,i=e.value[n]}for(d=i,n++,i=e.value[n];o.isCommentNode(i)||o.isWhitespaceNode(i);)n++,i=e.value[n];if(o.isTokenNode(i)&&i.value[0]===t.TokenType.Ident&&r.test(i.value[4].value)){if(T)return!1;T=i,u=i.value[4].value,n++,i=e.value[n]}for(;o.isCommentNode(i)||o.isWhitespaceNode(i);)n++,i=e.value[n];if(o.isTokenNode(i)&&i.value[0]===t.TokenType.Ident&&l.test(i.value[4].value)&&a.test(u)){if(f||!T)return!1;f=i,n++,i=e.value[n]}for(;o.isCommentNode(i)||o.isWhitespaceNode(i);)n++,i=e.value[n];if(o.isTokenNode(i)&&i.value[0]===t.TokenType.Ident&&p.test(i.value[4].value)){if(h||!T||!f)return!1;h=i,n++,i=e.value[n]}for(;!o.isTokenNode(i)||i.value[0]!==t.TokenType.Comma;)n++,i=e.value[n];v=i,m=e.value.slice(n+1)}if(!T)return!1;if(f&&!h)return!1;if(h&&!f)return!1;const k=parseColorStops(m);if(!k)return!1;const g=interpolateColorsInColorStopsList(k,T,f,n);if(!g)return!1;const N=trim([...e.value.slice(0,e.value.indexOf(d)),...e.value.slice(e.value.indexOf(h||T)+1,e.value.indexOf(v))]);return N.length>0&&N.some((e=>!o.isCommentNode(e)))&&N.push(new o.TokenNode([t.TokenType.Comma,",",-1,-1,void 0]),new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]])),trim([...N,...trim(g)])}function trim(e){let t=0,n=e.length-1;for(let n=0;n<e.length;n++)if(!o.isWhitespaceNode(e[n])){t=n;break}for(let t=e.length-1;t>=0;t--)if(!o.isWhitespaceNode(e[t])){n=t;break}return e.slice(t,n+1)}const basePlugin=e=>({postcssPlugin:"postcss-gradients-interpolation-method",Declaration(n){if(!i.test(n.value))return;if(hasFallback(n))return;if(hasSupportsAtRuleAncestor(n))return;const s=t.tokenize({css:n.value}),r=o.stringify(o.replaceComponentValues(o.parseCommaSeparatedListOfComponentValues(s),(e=>{if(!o.isFunctionNode(e))return;const t=modifyGradientFunctionComponentValues(e);t&&(e.value=t)})));if(r===n.value)return;const a=o.stringify(o.replaceComponentValues(o.parseCommaSeparatedListOfComponentValues(t.cloneTokens(s)),(e=>{if(!o.isFunctionNode(e))return;const t=modifyGradientFunctionComponentValues(e,!0);t&&(e.value=t)})));n.cloneBefore({value:r}),r!=a&&n.cloneBefore({value:a}),null!=e&&e.preserve||n.remove()}});basePlugin.postcss=!0;const postcssPlugin=o=>{const t=Object.assign({enableProgressiveCustomProperties:!0,preserve:!0},o);return t.enableProgressiveCustomProperties?{postcssPlugin:"postcss-gradients-interpolation-method",plugins:[e(),basePlugin(t)]}:basePlugin(t)};postcssPlugin.postcss=!0,module.exports=postcssPlugin;
1+
"use strict";var e=require("@csstools/postcss-progressive-custom-properties"),o=require("@csstools/css-parser-algorithms"),t=require("@csstools/css-tokenizer"),n=require("@csstools/css-color-parser");const i=/(repeating-)?(linear|radial|conic)-gradient\(/i,s=/^(repeating-)?(linear|radial|conic)-gradient$/i;function hasFallback(e){const o=e.parent;if(!o)return!1;const t=e.prop.toLowerCase(),n=o.index(e);for(let e=0;e<n;e++){const n=o.nodes[e];if("decl"===n.type&&n.prop.toLowerCase()===t)return!0}return!1}function hasSupportsAtRuleAncestor(e){let o=e.parent;for(;o;)if("atrule"===o.type){if("supports"===o.name&&i.test(o.params))return!0;o=o.parent}else o=o.parent;return!1}function interpolateColorsInColorStopsList(e,i,s,r=!1){const a=[],l=[];for(let r=0;r<e.length-1;r++){const a=e[r],c=e[r+1];if(l.push(a),n.serializeP3(a.colorData,!1).toString()!==n.serializeP3(c.colorData,!1).toString()&&a.position.toString()!==c.position.toString())for(let e=1;e<=9;e++){const r=10*e;let p=[];s&&(p=[new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]]),s,new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]]),new o.TokenNode([t.TokenType.Ident,"hue",-1,-1,{value:"hue"}])]);const u=new o.FunctionNode([t.TokenType.Function,"color-mix(",-1,-1,{value:"color-mix"}],[t.TokenType.CloseParen,")",-1,-1,void 0],[new o.TokenNode([t.TokenType.Ident,"in",-1,-1,{value:"in"}]),new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]]),i,...p,new o.TokenNode([t.TokenType.Comma,",",-1,-1,void 0]),new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]]),a.color,new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]]),new o.TokenNode([t.TokenType.Percentage,100-r+"%",-1,-1,{value:100-r}]),new o.TokenNode([t.TokenType.Comma,",",-1,-1,void 0]),new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]]),c.color,new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]]),new o.TokenNode([t.TokenType.Percentage,`${r}%`,-1,-1,{value:r}])]),d=n.color(u);if(!d)return!1;l.push({colorData:d})}r===e.length-2&&l.push(c)}for(let e=0;e<l.length;e++)r&&!n.colorDataFitsRGB_Gamut(l[e].colorData)?l[e].color=n.serializeP3(l[e].colorData,!1):l[e].color=n.serializeRGB(l[e].colorData,!1);for(let e=0;e<l.length;e++){const n=l[e];n.position?a.push(n.color,new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]]),n.position):a.push(n.color),e!==l.length-1&&a.push(new o.TokenNode([t.TokenType.Comma,",",-1,-1,void 0]),new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]]))}return a}function parseColorStops(e){const i=[];let s={};for(let r=0;r<e.length;r++){const a=e[r];if(o.isCommentNode(a)||o.isWhitespaceNode(a))continue;if(o.isTokenNode(a)&&a.value[0]===t.TokenType.Comma){if(s.color&&s.colorData&&s.positionA){i.push({color:s.color,colorData:s.colorData,position:s.positionA}),s.positionB&&i.push({color:s.color,colorData:s.colorData,position:s.positionB}),s={};continue}return!1}const l=n.color(a);if(l){if(s.color)return!1;s.color=a,s.colorData=l}else{if(!s.color)return!1;if(s.positionA){if(!s.positionA||s.positionB)return!1;s.positionB=a}else s.positionA=a}}return!(!s.color||!s.positionA)&&(s.color&&s.colorData&&s.positionA&&(i.push({color:s.color,colorData:s.colorData,position:s.positionA}),s.positionB&&i.push({color:s.color,colorData:s.colorData,position:s.positionB})),!(i.length<2)&&i)}const r=/^(srgb|srgb-linear|lab|oklab|xyz|xyz-d50|xyz-d65|hsl|hwb|lch|oklch)$/i,a=/^(hsl|hwb|lch|oklch)$/i,l=/^(shorter|longer|increasing|decreasing)$/i,c=/^in$/i,p=/^hue$/i;function modifyGradientFunctionComponentValues(e,n=!1){const i=e.getName();if(!s.test(i))return!1;let u="srgb",d=null,T=null,f=null,h=null,v=null,m=[];{let n=0,i=e.value[n];for(;!o.isTokenNode(i)||i.value[0]!==t.TokenType.Ident||!c.test(i.value[4].value);){if(o.isTokenNode(i)&&i.value[0]===t.TokenType.Comma)return!1;n++,i=e.value[n]}for(d=i,n++,i=e.value[n];o.isCommentNode(i)||o.isWhitespaceNode(i);)n++,i=e.value[n];if(o.isTokenNode(i)&&i.value[0]===t.TokenType.Ident&&r.test(i.value[4].value)){if(T)return!1;T=i,u=i.value[4].value,n++,i=e.value[n]}for(;o.isCommentNode(i)||o.isWhitespaceNode(i);)n++,i=e.value[n];if(o.isTokenNode(i)&&i.value[0]===t.TokenType.Ident&&l.test(i.value[4].value)&&a.test(u)){if(f||!T)return!1;f=i,n++,i=e.value[n]}for(;o.isCommentNode(i)||o.isWhitespaceNode(i);)n++,i=e.value[n];if(o.isTokenNode(i)&&i.value[0]===t.TokenType.Ident&&p.test(i.value[4].value)){if(h||!T||!f)return!1;h=i,n++,i=e.value[n]}for(;!o.isTokenNode(i)||i.value[0]!==t.TokenType.Comma;)n++,i=e.value[n];v=i,m=e.value.slice(n+1)}if(!T)return!1;if(f&&!h)return!1;if(h&&!f)return!1;const k=parseColorStops(m);if(!k)return!1;const g=interpolateColorsInColorStopsList(k,T,f,n);if(!g)return!1;const N=trim([...e.value.slice(0,e.value.indexOf(d)),...e.value.slice(e.value.indexOf(h||T)+1,e.value.indexOf(v))]);return N.length>0&&N.some((e=>!o.isCommentNode(e)))&&N.push(new o.TokenNode([t.TokenType.Comma,",",-1,-1,void 0]),new o.WhitespaceNode([[t.TokenType.Whitespace," ",-1,-1,void 0]])),trim([...N,...trim(g)])}function trim(e){let t=0,n=e.length-1;for(let n=0;n<e.length;n++)if(!o.isWhitespaceNode(e[n])){t=n;break}for(let t=e.length-1;t>=0;t--)if(!o.isWhitespaceNode(e[t])){n=t;break}return e.slice(t,n+1)}const basePlugin=e=>({postcssPlugin:"postcss-gradients-interpolation-method",Declaration(n){if(!i.test(n.value))return;if(hasFallback(n))return;if(hasSupportsAtRuleAncestor(n))return;const s=t.tokenize({css:n.value}),r=o.stringify(o.replaceComponentValues(o.parseCommaSeparatedListOfComponentValues(s),(e=>{if(!o.isFunctionNode(e))return;const t=modifyGradientFunctionComponentValues(e);t&&(e.value=t)})));if(r===n.value)return;const a=o.stringify(o.replaceComponentValues(o.parseCommaSeparatedListOfComponentValues(t.cloneTokens(s)),(e=>{if(!o.isFunctionNode(e))return;const t=modifyGradientFunctionComponentValues(e,!0);t&&(e.value=t)})));n.cloneBefore({value:r}),r!==a&&n.cloneBefore({value:a}),null!=e&&e.preserve||n.remove()}});basePlugin.postcss=!0;const postcssPlugin=o=>{const t=Object.assign({enableProgressiveCustomProperties:!0,preserve:!0},o);return t.enableProgressiveCustomProperties?{postcssPlugin:"postcss-gradients-interpolation-method",plugins:[e(),basePlugin(t)]}:basePlugin(t)};postcssPlugin.postcss=!0,module.exports=postcssPlugin;

0 commit comments

Comments
 (0)