Skip to content

Commit dda2696

Browse files
shellscapeshellscape
committed
fix: add support for oklab and oklch colors from #148 
1 parent 4fe7a5c commit dda2696

File tree

3 files changed

+274
-1
lines changed

3 files changed

+274
-1
lines changed

‎src/nodes/Func.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import { FunctionNode } from 'css-tree';
1313
import { Container } from './Container.js';
1414
import { NodeOptions } from './Node.js';
1515

16-
const reColorFunctions = /^(hsla?|hwb|lab|lch|rgba?)$/i;
16+
const reColorFunctions = /^(hsla?|hwb|(ok)?lab|(ok)?lch|rgba?)$/i;
1717
const reVar = /^var$/i;
1818

1919
export class Func extends Container {

‎test/fixtures/func.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,9 @@
1414
"RGBA( 29, 439 , 29 )",
1515
"RgBa( 29, 439 , 29 )",
1616
"Lab( 40% 56.6 39 )",
17+
"okLab( 40% 56.6 39 )",
1718
"lCH(40% 68.8 34.5 / 50%)",
19+
"oklCH(40% 68.8 34.5 / 50%)",
1820
"hwb(90deg 0% 0% / 0.5)",
1921
"calc(-0.5 * var(foo))",
2022
"calc(var(--foo)*var(--bar))",

‎test/snapshots/func.test.ts.snap

Lines changed: 271 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2805,6 +2805,277 @@ exports[`function parsing > should parse: local(foo),local(bar) 3`] = `
28052805
]
28062806
`;
28072807

2808+
exports[`function parsing > should parse: okLab( 40% 56.6 39 ) 1`] = `"okLab(40% 56.6 39)"`;
2809+
2810+
exports[`function parsing > should parse: okLab( 40% 56.6 39 ) 2`] = `"okLab(40% 56.6 39)"`;
2811+
2812+
exports[`function parsing > should parse: okLab( 40% 56.6 39 ) 3`] = `
2813+
[
2814+
{
2815+
"inputs": [
2816+
{
2817+
"css": "<unknown>",
2818+
"hasBOM": false,
2819+
"id": "<input css [ID]>",
2820+
},
2821+
{
2822+
"css": "<unknown>",
2823+
"hasBOM": false,
2824+
"id": "<input css [ID]>",
2825+
},
2826+
{
2827+
"css": "<unknown>",
2828+
"hasBOM": false,
2829+
"id": "<input css [ID]>",
2830+
},
2831+
{
2832+
"css": "<unknown>",
2833+
"hasBOM": false,
2834+
"id": "<input css [ID]>",
2835+
},
2836+
],
2837+
"isColor": true,
2838+
"isVar": false,
2839+
"name": "okLab",
2840+
"nodes": [
2841+
{
2842+
"raws": {},
2843+
"source": {
2844+
"end": {
2845+
"column": 11,
2846+
"line": 1,
2847+
"offset": 10,
2848+
},
2849+
"inputId": 0,
2850+
"start": {
2851+
"column": 8,
2852+
"line": 1,
2853+
"offset": 7,
2854+
},
2855+
},
2856+
"type": "numeric",
2857+
"unit": "%",
2858+
"value": "40%",
2859+
},
2860+
{
2861+
"raws": {},
2862+
"source": {
2863+
"end": {
2864+
"column": 17,
2865+
"line": 1,
2866+
"offset": 16,
2867+
},
2868+
"inputId": 0,
2869+
"start": {
2870+
"column": 13,
2871+
"line": 1,
2872+
"offset": 12,
2873+
},
2874+
},
2875+
"type": "numeric",
2876+
"unit": "",
2877+
"value": "56.6",
2878+
},
2879+
{
2880+
"raws": {},
2881+
"source": {
2882+
"end": {
2883+
"column": 22,
2884+
"line": 1,
2885+
"offset": 21,
2886+
},
2887+
"inputId": 0,
2888+
"start": {
2889+
"column": 20,
2890+
"line": 1,
2891+
"offset": 19,
2892+
},
2893+
},
2894+
"type": "numeric",
2895+
"unit": "",
2896+
"value": "39",
2897+
},
2898+
],
2899+
"params": "",
2900+
"raws": {},
2901+
"source": {
2902+
"end": {
2903+
"column": 24,
2904+
"line": 1,
2905+
"offset": 23,
2906+
},
2907+
"inputId": 0,
2908+
"start": {
2909+
"column": 1,
2910+
"line": 1,
2911+
"offset": 0,
2912+
},
2913+
},
2914+
"type": "func",
2915+
"value": "",
2916+
},
2917+
]
2918+
`;
2919+
2920+
exports[`function parsing > should parse: oklCH(40% 68.8 34.5 / 50%) 1`] = `"oklCH(40% 68.8 34.5/50%)"`;
2921+
2922+
exports[`function parsing > should parse: oklCH(40% 68.8 34.5 / 50%) 2`] = `"oklCH(40% 68.8 34.5/50%)"`;
2923+
2924+
exports[`function parsing > should parse: oklCH(40% 68.8 34.5 / 50%) 3`] = `
2925+
[
2926+
{
2927+
"inputs": [
2928+
{
2929+
"css": "<unknown>",
2930+
"hasBOM": false,
2931+
"id": "<input css [ID]>",
2932+
},
2933+
{
2934+
"css": "<unknown>",
2935+
"hasBOM": false,
2936+
"id": "<input css [ID]>",
2937+
},
2938+
{
2939+
"css": "<unknown>",
2940+
"hasBOM": false,
2941+
"id": "<input css [ID]>",
2942+
},
2943+
{
2944+
"css": "<unknown>",
2945+
"hasBOM": false,
2946+
"id": "<input css [ID]>",
2947+
},
2948+
{
2949+
"css": "<unknown>",
2950+
"hasBOM": false,
2951+
"id": "<input css [ID]>",
2952+
},
2953+
{
2954+
"css": "<unknown>",
2955+
"hasBOM": false,
2956+
"id": "<input css [ID]>",
2957+
},
2958+
],
2959+
"isColor": true,
2960+
"isVar": false,
2961+
"name": "oklCH",
2962+
"nodes": [
2963+
{
2964+
"raws": {},
2965+
"source": {
2966+
"end": {
2967+
"column": 10,
2968+
"line": 1,
2969+
"offset": 9,
2970+
},
2971+
"inputId": 0,
2972+
"start": {
2973+
"column": 7,
2974+
"line": 1,
2975+
"offset": 6,
2976+
},
2977+
},
2978+
"type": "numeric",
2979+
"unit": "%",
2980+
"value": "40%",
2981+
},
2982+
{
2983+
"raws": {},
2984+
"source": {
2985+
"end": {
2986+
"column": 15,
2987+
"line": 1,
2988+
"offset": 14,
2989+
},
2990+
"inputId": 0,
2991+
"start": {
2992+
"column": 11,
2993+
"line": 1,
2994+
"offset": 10,
2995+
},
2996+
},
2997+
"type": "numeric",
2998+
"unit": "",
2999+
"value": "68.8",
3000+
},
3001+
{
3002+
"raws": {},
3003+
"source": {
3004+
"end": {
3005+
"column": 20,
3006+
"line": 1,
3007+
"offset": 19,
3008+
},
3009+
"inputId": 0,
3010+
"start": {
3011+
"column": 16,
3012+
"line": 1,
3013+
"offset": 15,
3014+
},
3015+
},
3016+
"type": "numeric",
3017+
"unit": "",
3018+
"value": "34.5",
3019+
},
3020+
{
3021+
"raws": {},
3022+
"source": {
3023+
"end": {
3024+
"column": 22,
3025+
"line": 1,
3026+
"offset": 21,
3027+
},
3028+
"inputId": 0,
3029+
"start": {
3030+
"column": 21,
3031+
"line": 1,
3032+
"offset": 20,
3033+
},
3034+
},
3035+
"type": "operator",
3036+
"value": "/",
3037+
},
3038+
{
3039+
"raws": {},
3040+
"source": {
3041+
"end": {
3042+
"column": 26,
3043+
"line": 1,
3044+
"offset": 25,
3045+
},
3046+
"inputId": 0,
3047+
"start": {
3048+
"column": 23,
3049+
"line": 1,
3050+
"offset": 22,
3051+
},
3052+
},
3053+
"type": "numeric",
3054+
"unit": "%",
3055+
"value": "50%",
3056+
},
3057+
],
3058+
"params": "",
3059+
"raws": {},
3060+
"source": {
3061+
"end": {
3062+
"column": 27,
3063+
"line": 1,
3064+
"offset": 26,
3065+
},
3066+
"inputId": 0,
3067+
"start": {
3068+
"column": 1,
3069+
"line": 1,
3070+
"offset": 0,
3071+
},
3072+
},
3073+
"type": "func",
3074+
"value": "",
3075+
},
3076+
]
3077+
`;
3078+
28083079
exports[`function parsing > should parse: rgba( 29, 439 , 29 ) 1`] = `"rgba(29,439,29)"`;
28093080

28103081
exports[`function parsing > should parse: rgba( 29, 439 , 29 ) 2`] = `"rgba(29,439,29)"`;

0 commit comments

Comments
 (0)