postcss-lab-function 4.0.1 → 4.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +63 -0
- package/INSTALL.md +164 -0
- package/README.md +3 -3
- package/dist/cli.d.ts +1 -0
- package/dist/cli.mjs +3 -0
- package/dist/color.d.ts +3 -0
- package/dist/has-supports-at-rule-ancestor.d.ts +2 -0
- package/dist/index.cjs +2 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.ts +6 -0
- package/dist/index.mjs +2 -0
- package/dist/index.mjs.map +1 -0
- package/dist/on-css-function.d.ts +3 -0
- package/package.json +31 -47
- package/dist/index.cjs.js +0 -209
- package/dist/index.cjs.js.map +0 -1
- package/dist/index.esm.js +0 -207
- package/dist/index.esm.js.map +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../src/color.ts","../src/on-css-function.ts","../src/index.ts","../src/has-supports-at-rule-ancestor.ts"],"sourcesContent":["// Taken from @csstools/convert-colors\n// That package is in need of maintenance but this is out of scope for preset-env\n// We only need lab() -> rgb() and lch() -> rgb()\n\nexport function labToSRgb(lab: [number, number, number]): [number, number, number] {\n\treturn xyz2rgb(lab2xyz(lab, true));\n}\n\nexport function lchToSRgb(lch: [number, number, number]): [number, number, number] {\n\treturn xyz2rgb(\n\t\tlab2xyz(lch2lab(lch),\n\t\tfalse, /* do not clamp \"a\" and \"b\" when processing lch */\n\t));\n}\n\nfunction lch2lab(lch: [number, number, number]): [number, number, number] {\n\t// Convert from polar form\n\treturn [\n\t\tlch[0], // L is still L\n\t\tlch[1] * Math.cos(lch[2] * Math.PI / 180), // a\n\t\tlch[1] * Math.sin(lch[2] * Math.PI / 180), // b\n\t];\n}\n\nfunction lab2xyz(lab: [number, number, number], clamp : boolean): [number, number, number] {\n\tconst [labLRaw, labARaw, labBRaw] = lab;\n\n\tconst labL = Math.min(\n\t\tMath.max(\n\t\t\tlabLRaw,\n\t\t\t0,\n\t\t),\n\t\t100,\n\t);\n\n\tlet labA = 0;\n\tlet labB = 0;\n\n\tif (clamp) {\n\t\tlabA = Math.min(\n\t\t\tMath.max(\n\t\t\t\tlabARaw,\n\t\t\t\t-127,\n\t\t\t),\n\t\t\t128,\n\t\t);\n\n\t\tlabB = Math.min(\n\t\t\tMath.max(\n\t\t\t\tlabBRaw,\n\t\t\t\t-127,\n\t\t\t),\n\t\t\t128,\n\t\t);\n\t} else {\n\t\tlabA = labARaw;\n\t\tlabB = labBRaw;\n\t}\n\n\t// compute f, starting with the luminance-related term\n\tconst f2 = (labL + 16) / 116;\n\tconst f1 = labA / 500 + f2;\n\tconst f3 = f2 - labB / 200;\n\n\t// compute pre-scaled XYZ\n\tconst [ initX, initY, initZ ] = [\n\t\tMath.pow(f1, 3) > epsilon ? Math.pow(f1, 3) : (116 * f1 - 16) / kappa,\n\t\tlabL > kappa * epsilon ? Math.pow((labL + 16) / 116, 3) : labL / kappa,\n\t\tMath.pow(f3, 3) > epsilon ? Math.pow(f3, 3) : (116 * f3 - 16) / kappa,\n\t];\n\n\tconst [ xyzX, xyzY, xyzZ ] = matrix(\n\t\t// compute XYZ by scaling pre-scaled XYZ by reference white\n\t\t[ initX * wd50X, initY * wd50Y, initZ * wd50Z ],\n\t\t// calculate D65 XYZ from D50 XYZ\n\t\t[\n\t\t\t[ 0.9554734527042182, -0.023098536874261423, 0.0632593086610217 ],\n\t\t\t[ -0.028369706963208136, 1.0099954580058226, 0.021041398966943008 ],\n\t\t\t[ 0.012314001688319899, -0.020507696433477912, 1.3303659366080753 ],\n\t\t],\n\t);\n\n\treturn [ xyzX, xyzY, xyzZ ];\n}\n\nexport function xyz2rgb(xyz: [number, number, number]): [number, number, number] {\n\tconst [xyzX, xyzY, xyzZ] = xyz;\n\tconst [ lrgbR, lrgbB, lrgbG ] = matrix([ xyzX, xyzY, xyzZ ], [\n\t\t[ 3.2409699419045226, -1.537383177570094, -0.4986107602930034 ],\n\t\t[ -0.9692436362808796, 1.8759675015077202, 0.04155505740717559 ],\n\t\t[ 0.05563007969699366, -0.20397695888897652, 1.0569715142428786 ],\n\t]);\n\n\tconst [ rgbR, rgbG, rgbB ] = [ lrgbR, lrgbB, lrgbG ].map(\n\t\tv => v > 0.31308 ? 1.055 * Math.pow(v / 100, 1 / 2.4) * 100 - 5.5 : 12.92 * v,\n\t);\n\n\treturn [ rgbR, rgbG, rgbB ];\n}\n\nfunction matrix(params: [number, number, number], mats: [[number, number, number], [number, number, number], [number, number, number]]): [number, number, number] {\n\treturn mats.map(\n\t\tmat => mat.reduce(\n\t\t\t// (acc, value, index) => acc + params[index] * value,\n\t\t\t(acc, value, index) => acc + params[index] * precision * (value * precision) / precision / precision,\n\t\t\t0,\n\t\t),\n\t) as [number, number, number];\n}\n\n/* Precision\n/* ========================================================================== */\n\nconst precision = 100000000;\n\n/* D50 reference white\n/* ========================================================================== */\n\nconst [ wd50X, wd50Y, wd50Z ] = [ 96.422, 100.000, 82.521 ];\n\n/* Math Constants\n/* ========================================================================== */\n\nconst epsilon = Math.pow(6, 3) / Math.pow(29, 3);\nconst kappa = Math.pow(29, 3) / Math.pow(3, 3);\n","import valueParser from 'postcss-value-parser';\nimport type { FunctionNode, Dimension, Node, DivNode, WordNode } from 'postcss-value-parser';\nimport { labToSRgb, lchToSRgb } from './color';\n\nfunction onCSSFunction(node: FunctionNode) {\n\tconst value = node.value;\n\tconst rawNodes = node.nodes;\n\tconst relevantNodes = rawNodes.slice().filter((x) => {\n\t\treturn x.type !== 'comment' && x.type !== 'space';\n\t});\n\n\tlet nodes: Lch | Lab | null = null;\n\tif (value === 'lab') {\n\t\tnodes = labFunctionContents(relevantNodes);\n\t} else if (value === 'lch') {\n\t\tnodes = lchFunctionContents(relevantNodes);\n\t}\n\n\tif (!nodes) {\n\t\treturn;\n\t}\n\n\tif (relevantNodes.length > 3 && (!nodes.slash || !nodes.alpha)) {\n\t\treturn;\n\t}\n\n\t// rename the Color function to `rgb`\n\tnode.value = 'rgb';\n\n\ttransformAlpha(node, nodes.slash, nodes.alpha);\n\n\t/** Extracted Color channels. */\n\tconst [channelNode1, channelNode2, channelNode3] = channelNodes(nodes);\n\tconst [channelDimension1, channelDimension2, channelDimension3] = channelDimensions(nodes);\n\n\t/** Corresponding Color transformer. */\n\tconst toRGB = value === 'lab' ? labToSRgb : lchToSRgb;\n\n\t/** RGB channels from the source color. */\n\tconst channelNumbers: [number, number, number] = [\n\t\tchannelDimension1.number,\n\t\tchannelDimension2.number,\n\t\tchannelDimension3.number,\n\t].map(\n\t\tchannelNumber => parseFloat(channelNumber),\n\t) as [number, number, number];\n\n\tconst rgbValues = toRGB(\n\t\tchannelNumbers,\n\t).map(\n\t\tchannelValue => Math.max(Math.min(Math.round(channelValue * 2.55), 255), 0),\n\t);\n\n\tnode.nodes.splice(node.nodes.indexOf(channelNode1) + 1, 0, commaNode());\n\tnode.nodes.splice(node.nodes.indexOf(channelNode2) + 1, 0, commaNode());\n\n\treplaceWith(node.nodes, channelNode1, {\n\t\t...channelNode1,\n\t\tvalue: String(rgbValues[0]),\n\t});\n\n\treplaceWith(node.nodes, channelNode2, {\n\t\t...channelNode2,\n\t\tvalue: String(rgbValues[1]),\n\t});\n\n\treplaceWith(node.nodes, channelNode3, {\n\t\t...channelNode3,\n\t\tvalue: String(rgbValues[2]),\n\t});\n\n}\n\nexport default onCSSFunction;\n\nfunction commaNode(): DivNode {\n\treturn {\n\t\tsourceIndex: 0,\n\t\tsourceEndIndex: 1,\n\t\tvalue: ',',\n\t\ttype: 'div',\n\t\tbefore: '',\n\t\tafter: '',\n\t};\n}\n\nfunction isNumericNode(node: Node): node is WordNode {\n\tif (!node || node.type !== 'word') {\n\t\treturn false;\n\t}\n\n\tif (!canParseAsUnit(node)) {\n\t\treturn false;\n\t}\n\n\tconst unitAndValue = valueParser.unit(node.value);\n\tif (!unitAndValue) {\n\t\treturn false;\n\t}\n\n\treturn !!unitAndValue.number;\n}\n\nfunction isNumericNodeNumber(node): node is WordNode {\n\tif (!node || node.type !== 'word') {\n\t\treturn false;\n\t}\n\n\tif (!canParseAsUnit(node)) {\n\t\treturn false;\n\t}\n\n\tconst unitAndValue = valueParser.unit(node.value);\n\tif (!unitAndValue) {\n\t\treturn false;\n\t}\n\n\treturn !!unitAndValue.number && unitAndValue.unit === '';\n}\n\nfunction isNumericNodeHueLike(node: Node): node is WordNode {\n\tif (!node || node.type !== 'word') {\n\t\treturn false;\n\t}\n\n\tif (!canParseAsUnit(node)) {\n\t\treturn false;\n\t}\n\n\tconst unitAndValue = valueParser.unit(node.value);\n\tif (!unitAndValue) {\n\t\treturn false;\n\t}\n\n\treturn !!unitAndValue.number && (\n\t\tunitAndValue.unit === 'deg' ||\n\t\tunitAndValue.unit === 'grad' ||\n\t\tunitAndValue.unit === 'rad' ||\n\t\tunitAndValue.unit === 'turn' ||\n\t\tunitAndValue.unit === ''\n\t);\n}\n\nfunction isNumericNodePercentage(node: Node): node is WordNode {\n\tif (!node || node.type !== 'word') {\n\t\treturn false;\n\t}\n\n\tif (!canParseAsUnit(node)) {\n\t\treturn false;\n\t}\n\n\tconst unitAndValue = valueParser.unit(node.value);\n\tif (!unitAndValue) {\n\t\treturn false;\n\t}\n\n\treturn unitAndValue.unit === '%';\n}\n\nfunction isNumericNodePercentageOrNumber(node: Node): node is WordNode {\n\tif (!node || node.type !== 'word') {\n\t\treturn false;\n\t}\n\n\tif (!canParseAsUnit(node)) {\n\t\treturn false;\n\t}\n\n\tconst unitAndValue = valueParser.unit(node.value);\n\tif (!unitAndValue) {\n\t\treturn false;\n\t}\n\n\treturn unitAndValue.unit === '%' || unitAndValue.unit === '';\n}\n\nfunction isCalcNode(node: Node): node is FunctionNode {\n\treturn node && node.type === 'function' && node.value === 'calc';\n}\n\nfunction isVarNode(node: Node): node is FunctionNode {\n\treturn node && node.type === 'function' && node.value === 'var';\n}\n\nfunction isSlashNode(node: Node): node is DivNode {\n\treturn node && node.type === 'div' && node.value === '/';\n}\n\ntype Lch = {\n\tl: Dimension,\n\tlNode: Node,\n\tc: Dimension,\n\tcNode: Node,\n\th: Dimension,\n\thNode: Node,\n\tslash?: DivNode,\n\talpha?: WordNode|FunctionNode,\n}\n\nfunction lchFunctionContents(nodes): Lch|null {\n\tif (!isNumericNodePercentage(nodes[0])) {\n\t\treturn null;\n\t}\n\n\tif (!isNumericNodeNumber(nodes[1])) {\n\t\treturn null;\n\t}\n\n\tif (!isNumericNodeHueLike(nodes[2])) {\n\t\treturn null;\n\t}\n\n\tconst out: Lch = {\n\t\tl: valueParser.unit(nodes[0].value) as Dimension,\n\t\tlNode: nodes[0],\n\t\tc: valueParser.unit(nodes[1].value) as Dimension,\n\t\tcNode: nodes[1],\n\t\th: valueParser.unit(nodes[2].value) as Dimension,\n\t\thNode: nodes[2],\n\t};\n\n\tnormalizeHueNode(out.h);\n\tif (out.h.unit !== '') {\n\t\treturn null;\n\t}\n\n\tif (isSlashNode(nodes[3])) {\n\t\tout.slash = nodes[3];\n\t}\n\n\tif ((isNumericNodePercentageOrNumber(nodes[4]) || isCalcNode(nodes[4]) || isVarNode(nodes[4]))) {\n\t\tout.alpha = nodes[4];\n\t}\n\n\treturn out;\n}\n\ntype Lab = {\n\tl: Dimension,\n\tlNode: Node,\n\ta: Dimension,\n\taNode: Node,\n\tb: Dimension,\n\tbNode: Node,\n\tslash?: DivNode,\n\talpha?: WordNode | FunctionNode,\n}\n\nfunction labFunctionContents(nodes): Lab|null {\n\tif (!isNumericNodePercentage(nodes[0])) {\n\t\treturn null;\n\t}\n\n\tif (!isNumericNodeNumber(nodes[1])) {\n\t\treturn null;\n\t}\n\n\tif (!isNumericNodeNumber(nodes[2])) {\n\t\treturn null;\n\t}\n\n\tconst out: Lab = {\n\t\tl: valueParser.unit(nodes[0].value) as Dimension,\n\t\tlNode: nodes[0],\n\t\ta: valueParser.unit(nodes[1].value) as Dimension,\n\t\taNode: nodes[1],\n\t\tb: valueParser.unit(nodes[2].value) as Dimension,\n\t\tbNode: nodes[2],\n\t};\n\n\tif (isSlashNode(nodes[3])) {\n\t\tout.slash = nodes[3];\n\t}\n\n\tif ((isNumericNodePercentageOrNumber(nodes[4]) || isCalcNode(nodes[4]))) {\n\t\tout.alpha = nodes[4];\n\t}\n\n\treturn out;\n}\n\nfunction isLab(x: Lch | Lab): x is Lab {\n\tif (typeof (x as Lab).a !== 'undefined') {\n\t\treturn true;\n\t}\n\n\treturn false;\n}\n\nfunction channelNodes(x: Lch | Lab): [Node, Node, Node] {\n\tif (isLab(x)) {\n\t\treturn [x.lNode, x.aNode, x.bNode];\n\t}\n\n\treturn [x.lNode, x.cNode, x.hNode];\n}\n\nfunction channelDimensions(x: Lch | Lab): [Dimension, Dimension, Dimension] {\n\tif (isLab(x)) {\n\t\treturn [x.l, x.a, x.b];\n\t}\n\n\treturn [x.l, x.c, x.h];\n}\n\nfunction transformAlpha(node: FunctionNode, slashNode: DivNode | undefined, alphaNode: WordNode | FunctionNode | undefined) {\n\tif (!slashNode || !alphaNode) {\n\t\treturn;\n\t}\n\n\tnode.value = 'rgba';\n\tslashNode.value = ',';\n\tslashNode.before = '';\n\n\tif (!isNumericNode(alphaNode)) {\n\t\treturn;\n\t}\n\n\tconst unitAndValue = valueParser.unit(alphaNode.value);\n\tif (!unitAndValue) {\n\t\treturn;\n\t}\n\n\tif (unitAndValue.unit === '%') {\n\t\t// transform the Alpha channel from a Percentage to (0-1) Number\n\t\tunitAndValue.number = String(parseFloat(unitAndValue.number) / 100);\n\t\talphaNode.value = String(unitAndValue.number);\n\t}\n}\n\nfunction replaceWith(nodes: Array<Node>, oldNode: Node, newNode: Node) {\n\tconst index = nodes.indexOf(oldNode);\n\tnodes[index] = newNode;\n}\n\nfunction normalizeHueNode(dimension: Dimension) {\n\tswitch (dimension.unit) {\n\t\tcase 'deg':\n\t\t\tdimension.unit = '';\n\t\t\treturn;\n\t\tcase 'rad':\n\t\t\t// radians -> degrees\n\t\t\tdimension.unit = '';\n\t\t\tdimension.number = (parseFloat(dimension.number) * 180 / Math.PI).toString();\n\t\t\treturn;\n\n\t\tcase 'grad':\n\t\t\t// grades -> degrees\n\t\t\tdimension.unit = '';\n\t\t\tdimension.number = (parseFloat(dimension.number) * 0.9).toString();\n\t\t\treturn;\n\n\t\tcase 'turn':\n\t\t\t// turns -> degrees\n\t\t\tdimension.unit = '';\n\t\t\tdimension.number = (parseFloat(dimension.number) * 360).toString();\n\t\t\treturn;\n\t}\n}\n\nfunction canParseAsUnit(node : Node): boolean {\n\tif (!node || !node.value) {\n\t\treturn false;\n\t}\n\n\ttry {\n\t\treturn valueParser.unit(node.value) !== false;\n\t} catch (e) {\n\t\treturn false;\n\t}\n}\n","import { hasSupportsAtRuleAncestor } from './has-supports-at-rule-ancestor';\nimport valueParser from 'postcss-value-parser';\nimport type { ParsedValue, FunctionNode } from 'postcss-value-parser';\nimport type { Declaration, Postcss, Result } from 'postcss';\nimport onCSSFunction from './on-css-function';\n\nimport type { PluginCreator } from 'postcss';\n\n// NOTE : Used in unit tests.\nimport { labToSRgb, lchToSRgb } from './color';\n\n/** Transform lab() and lch() functions in CSS. */\nconst postcssPlugin: PluginCreator<{ preserve: boolean }> = (opts?: { preserve: boolean }) => {\n\tconst preserve = 'preserve' in Object(opts) ? Boolean(opts.preserve) : false;\n\n\treturn {\n\t\tpostcssPlugin: 'postcss-lab-function',\n\t\tDeclaration: (decl: Declaration, { result, postcss }: { result: Result, postcss: Postcss }) => {\n\t\t\tif (preserve && hasSupportsAtRuleAncestor(decl)) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst originalValue = decl.value;\n\t\t\tif (!(/(^|[^\\w-])(lab|lch)\\(/i.test(originalValue))) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tlet valueAST: ParsedValue|undefined;\n\n\t\t\ttry {\n\t\t\t\tvalueAST = valueParser(originalValue);\n\t\t\t} catch (error) {\n\t\t\t\tdecl.warn(\n\t\t\t\t\tresult,\n\t\t\t\t\t`Failed to parse value '${originalValue}' as a lab or hcl function. Leaving the original value intact.`,\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tif (typeof valueAST === 'undefined') {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tvalueAST.walk((node) => {\n\t\t\t\tif (!node.type || node.type !== 'function') {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tif (node.value !== 'lab' && node.value !== 'lch') {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tonCSSFunction(node as FunctionNode);\n\t\t\t});\n\t\t\tconst modifiedValue = String(valueAST);\n\n\t\t\tif (modifiedValue === originalValue) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif (preserve && decl.variable) {\n\t\t\t\tconst parent = decl.parent;\n\t\t\t\tconst atSupportsParams = '(color: lab(0% 0 0)) and (color: lch(0% 0 0))';\n\t\t\t\tconst atSupports = postcss.atRule({ name: 'supports', params: atSupportsParams, source: decl.source });\n\n\t\t\t\tconst parentClone = parent.clone();\n\t\t\t\tparentClone.removeAll();\n\n\t\t\t\tparentClone.append(decl.clone());\n\t\t\t\tatSupports.append(parentClone);\n\n\t\t\t\t// Ensure correct order of @supports rules\n\t\t\t\t// Find the last one created by us or the current parent and insert after.\n\t\t\t\tlet insertAfter = parent;\n\t\t\t\tlet nextInsertAfter = parent.next();\n\t\t\t\twhile (\n\t\t\t\t\tinsertAfter &&\n\t\t\t\t\tnextInsertAfter &&\n\t\t\t\t\tnextInsertAfter.type === 'atrule' &&\n\t\t\t\t\tnextInsertAfter.name === 'supports' &&\n\t\t\t\t\tnextInsertAfter.params === atSupportsParams\n\t\t\t\t) {\n\t\t\t\t\tinsertAfter = nextInsertAfter;\n\t\t\t\t\tnextInsertAfter = nextInsertAfter.next();\n\t\t\t\t}\n\n\t\t\t\tinsertAfter.after(atSupports);\n\n\t\t\t\tdecl.value = modifiedValue;\n\t\t\t} else if (preserve) {\n\t\t\t\tdecl.cloneBefore({ value: modifiedValue });\n\t\t\t} else {\n\t\t\t\tdecl.value = modifiedValue;\n\t\t\t}\n\t\t},\n\t};\n};\n\npostcssPlugin.postcss = true;\n\n// Used by unit tests.\n// Mixing named and default export causes issues with CJS.\n// Attaching these to the default export is the best solution.\npostcssPlugin['_labToSRgb'] = labToSRgb;\npostcssPlugin['_lchToSRgb'] = lchToSRgb;\n\nexport default postcssPlugin;\n","import type { Node, AtRule } from 'postcss';\n\nexport function hasSupportsAtRuleAncestor(node: Node): boolean {\n\tlet parent = node.parent;\n\twhile (parent) {\n\t\tif (parent.type !== 'atrule') {\n\t\t\tparent = parent.parent;\n\t\t\tcontinue;\n\t\t}\n\n\t\tif ((parent as AtRule).name === 'supports' && (parent as AtRule).params.indexOf('(color: lab(0% 0 0)) and (color: lch(0% 0 0))') !== -1) {\n\t\t\treturn true;\n\t\t}\n\n\t\tparent = parent.parent;\n\t}\n\n\treturn false;\n}\n"],"names":["labToSRgb","lab","xyz2rgb","lab2xyz","lchToSRgb","lch","Math","cos","PI","sin","lch2lab","clamp","labLRaw","labARaw","labBRaw","labL","min","max","labA","labB","f2","f1","f3","initX","initY","initZ","pow","epsilon","kappa","xyzX","xyzY","xyzZ","matrix","wd50X","wd50Y","wd50Z","xyz","lrgbR","lrgbB","lrgbG","rgbR","rgbG","rgbB","map","v","params","mats","mat","reduce","acc","value","index","precision","onCSSFunction","node","relevantNodes","nodes","slice","filter","x","type","isNumericNodePercentage","isNumericNodeNumber","out","l","valueParser","unit","lNode","a","aNode","b","bNode","isSlashNode","slash","isNumericNodePercentageOrNumber","isCalcNode","alpha","labFunctionContents","canParseAsUnit","unitAndValue","number","isNumericNodeHueLike","c","cNode","h","hNode","dimension","parseFloat","toString","normalizeHueNode","isVarNode","lchFunctionContents","length","slashNode","alphaNode","before","isNumericNode","String","transformAlpha","channelNode1","channelNode2","channelNode3","isLab","channelNodes","channelDimension1","channelDimension2","channelDimension3","channelDimensions","rgbValues","channelNumber","channelValue","round","splice","indexOf","sourceIndex","sourceEndIndex","after","replaceWith","oldNode","newNode","e","postcssPlugin","opts","preserve","Object","Boolean","Declaration","decl","result","postcss","parent","name","hasSupportsAtRuleAncestor","originalValue","test","valueAST","error","warn","walk","modifiedValue","variable","atSupportsParams","atSupports","atRule","source","parentClone","clone","removeAll","append","insertAfter","nextInsertAfter","next","cloneBefore"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,65 +1,44 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "postcss-lab-function",
|
|
3
|
-
"version": "4.0.
|
|
3
|
+
"version": "4.0.2",
|
|
4
4
|
"description": "Use lab() and lch() color functions in CSS",
|
|
5
5
|
"author": "Jonathan Neal <jonathantneal@hotmail.com>",
|
|
6
6
|
"license": "CC0-1.0",
|
|
7
|
-
"
|
|
8
|
-
"
|
|
9
|
-
"
|
|
10
|
-
"
|
|
11
|
-
"
|
|
7
|
+
"homepage": "https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-lab-function#readme",
|
|
8
|
+
"bugs": "https://github.com/csstools/postcss-plugins/issues",
|
|
9
|
+
"main": "dist/index.cjs",
|
|
10
|
+
"module": "dist/index.mjs",
|
|
11
|
+
"types": "./dist/index.d.ts",
|
|
12
12
|
"files": [
|
|
13
|
+
"CHANGELOG.md",
|
|
14
|
+
"INSTALL.md",
|
|
15
|
+
"LICENSE.md",
|
|
16
|
+
"README.md",
|
|
13
17
|
"dist"
|
|
14
18
|
],
|
|
19
|
+
"bin": {
|
|
20
|
+
"postcss-lab-function": "dist/cli.mjs"
|
|
21
|
+
},
|
|
15
22
|
"scripts": {
|
|
16
|
-
"build": "
|
|
17
|
-
"
|
|
18
|
-
"lint": "
|
|
19
|
-
"
|
|
20
|
-
"
|
|
21
|
-
"test": "
|
|
22
|
-
"tape": "npx postcss-tape",
|
|
23
|
-
"prepublishOnly": "npm test"
|
|
23
|
+
"build": "rollup -c ../../rollup/default.js",
|
|
24
|
+
"clean": "node -e \"fs.rmSync('./dist', { recursive: true, force: true });\"",
|
|
25
|
+
"lint": "eslint ./src --ext .js --ext .ts --ext .mjs --no-error-on-unmatched-pattern",
|
|
26
|
+
"prepublishOnly": "npm run clean && npm run build && npm run test",
|
|
27
|
+
"stryker": "stryker run --logLevel error",
|
|
28
|
+
"test": "node ./test/color/test.mjs && postcss-tape --ci"
|
|
24
29
|
},
|
|
25
30
|
"engines": {
|
|
26
|
-
"node": ">=
|
|
31
|
+
"node": "^12 || ^14 || >=16"
|
|
27
32
|
},
|
|
28
33
|
"dependencies": {
|
|
29
|
-
"
|
|
30
|
-
"postcss-values-parser": "6.0.1"
|
|
31
|
-
},
|
|
32
|
-
"peerDependencies": {
|
|
33
|
-
"postcss": "^8.3"
|
|
34
|
+
"postcss-value-parser": "^4.2.0"
|
|
34
35
|
},
|
|
35
36
|
"devDependencies": {
|
|
36
|
-
"
|
|
37
|
-
"
|
|
38
|
-
"@rollup/plugin-babel": "^5.3.0",
|
|
39
|
-
"eslint": "^8.2.0",
|
|
40
|
-
"postcss": "^8.3.11",
|
|
41
|
-
"postcss-tape": "^6.0.1",
|
|
42
|
-
"rollup": "^2.60.0"
|
|
37
|
+
"postcss": "^8.3.6",
|
|
38
|
+
"postcss-tape": "^6.0.1"
|
|
43
39
|
},
|
|
44
|
-
"
|
|
45
|
-
"
|
|
46
|
-
[
|
|
47
|
-
"@babel/env",
|
|
48
|
-
{
|
|
49
|
-
"targets": "maintained node versions"
|
|
50
|
-
}
|
|
51
|
-
]
|
|
52
|
-
]
|
|
53
|
-
},
|
|
54
|
-
"eslintConfig": {
|
|
55
|
-
"env": {
|
|
56
|
-
"es6": true,
|
|
57
|
-
"node": true
|
|
58
|
-
},
|
|
59
|
-
"extends": "eslint:recommended",
|
|
60
|
-
"parserOptions": {
|
|
61
|
-
"sourceType": "module"
|
|
62
|
-
}
|
|
40
|
+
"peerDependencies": {
|
|
41
|
+
"postcss": "^8.3"
|
|
63
42
|
},
|
|
64
43
|
"keywords": [
|
|
65
44
|
"postcss",
|
|
@@ -78,5 +57,10 @@
|
|
|
78
57
|
"syntax",
|
|
79
58
|
"space",
|
|
80
59
|
"comma"
|
|
81
|
-
]
|
|
60
|
+
],
|
|
61
|
+
"repository": {
|
|
62
|
+
"type": "git",
|
|
63
|
+
"url": "https://github.com/csstools/postcss-plugins.git",
|
|
64
|
+
"directory": "plugins/postcss-lab-function"
|
|
65
|
+
}
|
|
82
66
|
}
|
package/dist/index.cjs.js
DELETED
|
@@ -1,209 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var postcssValuesParser = require('postcss-values-parser');
|
|
4
|
-
var convertColors = require('@csstools/convert-colors');
|
|
5
|
-
|
|
6
|
-
/** @type {(decl: CSSFunction) => void} Transform lab() and lch() functions. */
|
|
7
|
-
|
|
8
|
-
const onCSSFunction = node => {
|
|
9
|
-
/** @type {{ name: string, nodes: CSSNode[] }} */
|
|
10
|
-
const {
|
|
11
|
-
name,
|
|
12
|
-
nodes
|
|
13
|
-
} = node;
|
|
14
|
-
|
|
15
|
-
if (isColorFunctionName(name)) {
|
|
16
|
-
if (isLabFunctionContents(nodes) || isLchFunctionContents(nodes)) {
|
|
17
|
-
// rename the Color function to `rgb`
|
|
18
|
-
Object.assign(node, {
|
|
19
|
-
name: 'rgb'
|
|
20
|
-
});
|
|
21
|
-
/** @type {CSSPunctuation} Slash punctuation before the Alpha channel. */
|
|
22
|
-
|
|
23
|
-
const slashNode = nodes[3];
|
|
24
|
-
/** @type {CSSNumber} Alpha channel. */
|
|
25
|
-
|
|
26
|
-
const alphaNode = nodes[4];
|
|
27
|
-
|
|
28
|
-
if (alphaNode) {
|
|
29
|
-
if (isPercentage(alphaNode) && !isCalc(alphaNode)) {
|
|
30
|
-
// transform the Alpha channel from a Percentage to (0-1) Number
|
|
31
|
-
Object.assign(alphaNode, {
|
|
32
|
-
value: String(alphaNode.value / 100),
|
|
33
|
-
unit: ''
|
|
34
|
-
});
|
|
35
|
-
} // if the color is fully opaque (i.e. the Alpha channel is `1`)
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
if (alphaNode.value === '1') {
|
|
39
|
-
// remove the Slash and Alpha channel
|
|
40
|
-
slashNode.remove();
|
|
41
|
-
alphaNode.remove();
|
|
42
|
-
} else {
|
|
43
|
-
// otherwise, rename the Color function to `rgba`
|
|
44
|
-
Object.assign(node, {
|
|
45
|
-
name: 'rgba'
|
|
46
|
-
});
|
|
47
|
-
}
|
|
48
|
-
} // replace a remaining Slash with a Comma
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
if (slashNode && isSlash(slashNode)) {
|
|
52
|
-
slashNode.replaceWith(commaNode.clone());
|
|
53
|
-
}
|
|
54
|
-
/** Extracted Color channels. */
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
const [channelNode1, channelNode2, channelNode3] = nodes;
|
|
58
|
-
/** Corresponding Color transformer. */
|
|
59
|
-
|
|
60
|
-
const toRGB = isLabColorFunctionName(name) ? convertColors.lab2rgb : convertColors.lch2rgb;
|
|
61
|
-
/** RGB channels from the source color. */
|
|
62
|
-
|
|
63
|
-
const rgbValues = toRGB(...[channelNode1.value, channelNode2.value, channelNode3.value].map(channelNumber => parseFloat(channelNumber))).map(channelValue => Math.max(Math.min(parseInt(channelValue * 2.55), 255), 0));
|
|
64
|
-
channelNode3.replaceWith(channelNode3.clone({
|
|
65
|
-
value: String(rgbValues[2])
|
|
66
|
-
}));
|
|
67
|
-
channelNode2.replaceWith(channelNode2.clone({
|
|
68
|
-
value: String(rgbValues[1])
|
|
69
|
-
}), commaNode.clone());
|
|
70
|
-
channelNode1.replaceWith(channelNode1.clone({
|
|
71
|
-
value: String(rgbValues[0]),
|
|
72
|
-
unit: ''
|
|
73
|
-
}), commaNode.clone());
|
|
74
|
-
}
|
|
75
|
-
}
|
|
76
|
-
};
|
|
77
|
-
const commaNode = postcssValuesParser.parse(',').first;
|
|
78
|
-
/** @type {(value: RegExp) => (value: string) => boolean} Return a function that checks whether the expression exists in a value. */
|
|
79
|
-
|
|
80
|
-
const createRegExpTest$1 = Function.bind.bind(RegExp.prototype.test);
|
|
81
|
-
/** Return whether the function name is `lab` or `lch`. */
|
|
82
|
-
|
|
83
|
-
const isColorFunctionName = createRegExpTest$1(/^(lab|lch)$/i);
|
|
84
|
-
/** Return whether the function name is `calc`. */
|
|
85
|
-
|
|
86
|
-
const isCalcFunctionName = createRegExpTest$1(/^calc$/i);
|
|
87
|
-
/** Return whether the function name is `lab`. */
|
|
88
|
-
|
|
89
|
-
const isLabColorFunctionName = createRegExpTest$1(/^lab$/i);
|
|
90
|
-
/** Return whether the unit is alpha-like. */
|
|
91
|
-
|
|
92
|
-
const isAlphaLikeUnit = createRegExpTest$1(/^%?$/i);
|
|
93
|
-
/** Return whether the unit is hue-like. */
|
|
94
|
-
|
|
95
|
-
const isHueLikeUnit = createRegExpTest$1(/^(deg|grad|rad|turn)?$/i);
|
|
96
|
-
/** @type {(node: CSSFunction) => boolean} Return whether the node is an Alpha-like unit. */
|
|
97
|
-
|
|
98
|
-
const isAlphaValue = node => isCalc(node) || node.type === 'numeric' && isAlphaLikeUnit(node.unit);
|
|
99
|
-
/** @type {(node: CSSFunction) => boolean} Return whether the node is a calc() function. */
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
const isCalc = node => node.type === 'func' && isCalcFunctionName(node.name);
|
|
103
|
-
/** @type {(node: CSSNumber) => boolean} Return whether the node is a Hue-like unit. */
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
const isHue = node => isCalc(node) || node.type === 'numeric' && isHueLikeUnit(node.unit);
|
|
107
|
-
/** @type {(node: CSSNumber) => boolean} Return whether the node is a Number unit. */
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
const isNumber = node => isCalc(node) || node.type === 'numeric' && node.unit === '';
|
|
111
|
-
/** @type {(node: CSSNumber) => boolean} Return whether the node is a Percentage unit. */
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
const isPercentage = node => isCalc(node) || node.type === 'numeric' && node.unit === '%';
|
|
115
|
-
/** @type {(node: CSSOperator) => boolean} Return whether the node is a Slash delimiter. */
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
const isSlash = node => node.type === 'operator' && node.value === '/';
|
|
119
|
-
/** @type {(nodes: Node[]) => boolean} Return whether a set of nodes is a lab() function. */
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
const isLabFunctionContents = nodes => nodes.every((node, index) => typeof labFunctionContents[index] === 'function' && labFunctionContents[index](node));
|
|
123
|
-
/** Set of nodes in a lab() function. */
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
const labFunctionContents = [isPercentage, isNumber, isNumber, isSlash, isAlphaValue];
|
|
127
|
-
/** @type {(nodes: Node[]) => boolean} Return whether a set of nodes is a lch() function. */
|
|
128
|
-
|
|
129
|
-
const isLchFunctionContents = nodes => nodes.every((node, index) => typeof lchFunctionContents[index] === 'function' && lchFunctionContents[index](node));
|
|
130
|
-
/** Set of nodes in a lch() function. */
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
const lchFunctionContents = [isPercentage, isNumber, isHue, isSlash, isAlphaValue];
|
|
134
|
-
/** @typedef {import('postcss-values-parser').Func} CSSFunction */
|
|
135
|
-
|
|
136
|
-
/** @typedef {import('postcss-values-parser').Node} CSSNode */
|
|
137
|
-
|
|
138
|
-
/** @typedef {import('postcss-values-parser').Numeric} CSSNumber */
|
|
139
|
-
|
|
140
|
-
/** @typedef {import('postcss-values-parser').Operator} CSSOperator */
|
|
141
|
-
|
|
142
|
-
/** @typedef {import('postcss-values-parser').Punctuation} CSSPunctuation */
|
|
143
|
-
|
|
144
|
-
var options = {
|
|
145
|
-
/** Whether to preserve the original functional color declaration. */
|
|
146
|
-
preserve: false
|
|
147
|
-
};
|
|
148
|
-
|
|
149
|
-
/** @type {(decl: CSSDeclaration) => void} Transform lab() and lch() functions in CSS Declarations. */
|
|
150
|
-
|
|
151
|
-
const onCSSDeclaration = (decl, {
|
|
152
|
-
result
|
|
153
|
-
}) => {
|
|
154
|
-
const {
|
|
155
|
-
value: originalValue
|
|
156
|
-
} = decl;
|
|
157
|
-
|
|
158
|
-
if (hasAnyColorFunction(originalValue)) {
|
|
159
|
-
let valueAST;
|
|
160
|
-
|
|
161
|
-
try {
|
|
162
|
-
valueAST = postcssValuesParser.parse(originalValue, {
|
|
163
|
-
ignoreUnknownWords: true
|
|
164
|
-
});
|
|
165
|
-
} catch (error) {
|
|
166
|
-
decl.warn(result, `Failed to parse value '${originalValue}' as a lab or hcl function. Leaving the original value intact.`);
|
|
167
|
-
}
|
|
168
|
-
|
|
169
|
-
if (typeof valueAST === 'undefined') {
|
|
170
|
-
return;
|
|
171
|
-
}
|
|
172
|
-
|
|
173
|
-
valueAST.walkType('func', onCSSFunction);
|
|
174
|
-
const modifiedValue = String(valueAST);
|
|
175
|
-
|
|
176
|
-
if (modifiedValue !== originalValue) {
|
|
177
|
-
if (options.preserve) decl.cloneBefore({
|
|
178
|
-
value: modifiedValue
|
|
179
|
-
});else decl.value = modifiedValue;
|
|
180
|
-
}
|
|
181
|
-
}
|
|
182
|
-
};
|
|
183
|
-
/** @type {(value: RegExp) => (value: string) => boolean} Return a function that checks whether the expression exists in a value. */
|
|
184
|
-
|
|
185
|
-
const createRegExpTest = Function.bind.bind(RegExp.prototype.test);
|
|
186
|
-
/** Return whether the value has a lab() or lch() function. */
|
|
187
|
-
|
|
188
|
-
const hasAnyColorFunction = createRegExpTest(/(^|[^\w-])(lab|lch)\(/i);
|
|
189
|
-
/** @typedef {import('postcss').Declaration} CSSDeclaration */
|
|
190
|
-
|
|
191
|
-
/** Transform lab() and lch() functions in CSS. */
|
|
192
|
-
|
|
193
|
-
const postcssPlugin =
|
|
194
|
-
/** @type {PostCSSPluginInitializer} */
|
|
195
|
-
opts => {
|
|
196
|
-
options.preserve = 'preserve' in Object(opts) ? Boolean(opts.preserve) : false;
|
|
197
|
-
return {
|
|
198
|
-
postcssPlugin: 'postcss-lab-function',
|
|
199
|
-
Declaration: onCSSDeclaration
|
|
200
|
-
};
|
|
201
|
-
};
|
|
202
|
-
|
|
203
|
-
postcssPlugin.postcss = true;
|
|
204
|
-
/** @typedef {import('postcss').Plugin} PostCSSPlugin */
|
|
205
|
-
|
|
206
|
-
/** @typedef {(opts: options) => PostCSSPlugin} PostCSSPluginInitializer */
|
|
207
|
-
|
|
208
|
-
module.exports = postcssPlugin;
|
|
209
|
-
//# sourceMappingURL=index.cjs.js.map
|
package/dist/index.cjs.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs.js","sources":["../src/onCSSFunction.js","../src/options.js","../src/onCSSDeclaration.js","../src/index.js"],"sourcesContent":["import { lab2rgb, lch2rgb } from '@csstools/convert-colors'\nimport { parse } from 'postcss-values-parser'\n\n/** @type {(decl: CSSFunction) => void} Transform lab() and lch() functions. */\nconst onCSSFunction = node => {\n\t/** @type {{ name: string, nodes: CSSNode[] }} */\n\tconst { name, nodes } = node\n\n\tif (isColorFunctionName(name)) {\n\t\tif (isLabFunctionContents(nodes) || isLchFunctionContents(nodes)) {\n\t\t\t// rename the Color function to `rgb`\n\t\t\tObject.assign(node, { name: 'rgb' })\n\n\t\t\t/** @type {CSSPunctuation} Slash punctuation before the Alpha channel. */\n\t\t\tconst slashNode = nodes[3]\n\n\t\t\t/** @type {CSSNumber} Alpha channel. */\n\t\t\tconst alphaNode = nodes[4]\n\n\t\t\tif (alphaNode) {\n\t\t\t\tif (isPercentage(alphaNode) && !isCalc(alphaNode)) {\n\t\t\t\t\t// transform the Alpha channel from a Percentage to (0-1) Number\n\t\t\t\t\tObject.assign(alphaNode, { value: String(alphaNode.value / 100), unit: '' })\n\t\t\t\t}\n\n\t\t\t\t// if the color is fully opaque (i.e. the Alpha channel is `1`)\n\t\t\t\tif (alphaNode.value === '1') {\n\t\t\t\t\t// remove the Slash and Alpha channel\n\t\t\t\t\tslashNode.remove()\n\t\t\t\t\talphaNode.remove()\n\t\t\t\t} else {\n\t\t\t\t\t// otherwise, rename the Color function to `rgba`\n\t\t\t\t\tObject.assign(node, { name: 'rgba' })\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// replace a remaining Slash with a Comma\n\t\t\tif (slashNode && isSlash(slashNode)) {\n\t\t\t\tslashNode.replaceWith(commaNode.clone())\n\t\t\t}\n\n\t\t\t/** Extracted Color channels. */\n\t\t\tconst [channelNode1, channelNode2, channelNode3] = nodes\n\n\t\t\t/** Corresponding Color transformer. */\n\t\t\tconst toRGB = isLabColorFunctionName(name) ? lab2rgb : lch2rgb\n\n\t\t\t/** RGB channels from the source color. */\n\t\t\tconst rgbValues = toRGB(\n\t\t\t\t...[\n\t\t\t\t\tchannelNode1.value,\n\t\t\t\t\tchannelNode2.value,\n\t\t\t\t\tchannelNode3.value\n\t\t\t\t].map(\n\t\t\t\t\tchannelNumber => parseFloat(channelNumber)\n\t\t\t\t)\n\t\t\t).map(\n\t\t\t\tchannelValue => Math.max(Math.min(parseInt(channelValue * 2.55), 255), 0)\n\t\t\t)\n\n\t\t\tchannelNode3.replaceWith(\n\t\t\t\tchannelNode3.clone({ value: String(rgbValues[2]) })\n\t\t\t)\n\n\t\t\tchannelNode2.replaceWith(\n\t\t\t\tchannelNode2.clone({ value: String(rgbValues[1]) }),\n\t\t\t\tcommaNode.clone()\n\t\t\t)\n\n\t\t\tchannelNode1.replaceWith(\n\t\t\t\tchannelNode1.clone({ value: String(rgbValues[0]), unit: '' }),\n\t\t\t\tcommaNode.clone()\n\t\t\t)\n\t\t}\n\t}\n}\n\nexport default onCSSFunction\n\nconst commaNode = parse(',').first\n\n/** @type {(value: RegExp) => (value: string) => boolean} Return a function that checks whether the expression exists in a value. */\nconst createRegExpTest = Function.bind.bind(RegExp.prototype.test)\n\n/** Return whether the function name is `lab` or `lch`. */\nconst isColorFunctionName = createRegExpTest(/^(lab|lch)$/i)\n\n/** Return whether the function name is `calc`. */\nconst isCalcFunctionName = createRegExpTest(/^calc$/i)\n\n/** Return whether the function name is `lab`. */\nconst isLabColorFunctionName = createRegExpTest(/^lab$/i)\n\n/** Return whether the unit is alpha-like. */\nconst isAlphaLikeUnit = createRegExpTest(/^%?$/i)\n\n/** Return whether the unit is hue-like. */\nconst isHueLikeUnit = createRegExpTest(/^(deg|grad|rad|turn)?$/i)\n\n/** @type {(node: CSSFunction) => boolean} Return whether the node is an Alpha-like unit. */\nconst isAlphaValue = node => isCalc(node) || node.type === 'numeric' && isAlphaLikeUnit(node.unit)\n\n/** @type {(node: CSSFunction) => boolean} Return whether the node is a calc() function. */\nconst isCalc = node => node.type === 'func' && isCalcFunctionName(node.name)\n\n/** @type {(node: CSSNumber) => boolean} Return whether the node is a Hue-like unit. */\nconst isHue = node => isCalc(node) || node.type === 'numeric' && isHueLikeUnit(node.unit)\n\n/** @type {(node: CSSNumber) => boolean} Return whether the node is a Number unit. */\nconst isNumber = node => isCalc(node) || node.type === 'numeric' && node.unit === ''\n\n/** @type {(node: CSSNumber) => boolean} Return whether the node is a Percentage unit. */\nconst isPercentage = node => isCalc(node) || node.type === 'numeric' && node.unit === '%'\n\n/** @type {(node: CSSOperator) => boolean} Return whether the node is a Slash delimiter. */\nconst isSlash = node => node.type === 'operator' && node.value === '/'\n\n/** @type {(nodes: Node[]) => boolean} Return whether a set of nodes is a lab() function. */\nconst isLabFunctionContents = nodes => nodes.every(\n\t(node, index) => typeof labFunctionContents[index] === 'function' && labFunctionContents[index](node)\n)\n\n/** Set of nodes in a lab() function. */\nconst labFunctionContents = [isPercentage, isNumber, isNumber, isSlash, isAlphaValue]\n\n/** @type {(nodes: Node[]) => boolean} Return whether a set of nodes is a lch() function. */\nconst isLchFunctionContents = nodes => nodes.every(\n\t(node, index) => typeof lchFunctionContents[index] === 'function' && lchFunctionContents[index](node)\n)\n\n/** Set of nodes in a lch() function. */\nconst lchFunctionContents = [isPercentage, isNumber, isHue, isSlash, isAlphaValue]\n\n/** @typedef {import('postcss-values-parser').Func} CSSFunction */\n/** @typedef {import('postcss-values-parser').Node} CSSNode */\n/** @typedef {import('postcss-values-parser').Numeric} CSSNumber */\n/** @typedef {import('postcss-values-parser').Operator} CSSOperator */\n/** @typedef {import('postcss-values-parser').Punctuation} CSSPunctuation */\n","export default {\n\t/** Whether to preserve the original functional color declaration. */\n\tpreserve: false\n}\n","import { parse } from 'postcss-values-parser'\nimport onCSSFunction from './onCSSFunction'\nimport options from './options'\n\n/** @type {(decl: CSSDeclaration) => void} Transform lab() and lch() functions in CSS Declarations. */\nconst onCSSDeclaration = (decl, { result }) => {\n\tconst { value: originalValue } = decl\n\n\tif (hasAnyColorFunction(originalValue)) {\n\t\tlet valueAST\n\n\t\ttry {\n\t\t\tvalueAST = parse(originalValue, { ignoreUnknownWords: true })\n\t\t} catch (error) {\n\t\t\tdecl.warn(\n\t\t\t\tresult,\n\t\t\t\t`Failed to parse value '${originalValue}' as a lab or hcl function. Leaving the original value intact.`\n\t\t\t)\n\t\t}\n\n\t\tif (typeof valueAST === 'undefined') {\n\t\t\treturn\n\t\t}\n\n\t\tvalueAST.walkType('func', onCSSFunction)\n\n\t\tconst modifiedValue = String(valueAST)\n\n\t\tif (modifiedValue !== originalValue) {\n\t\t\tif (options.preserve) decl.cloneBefore({ value: modifiedValue })\n\t\t\telse decl.value = modifiedValue\n\t\t}\n\t}\n}\n\nexport default onCSSDeclaration\n\n/** @type {(value: RegExp) => (value: string) => boolean} Return a function that checks whether the expression exists in a value. */\nconst createRegExpTest = Function.bind.bind(RegExp.prototype.test)\n\n/** Return whether the value has a lab() or lch() function. */\nconst hasAnyColorFunction = createRegExpTest(/(^|[^\\w-])(lab|lch)\\(/i)\n\n/** @typedef {import('postcss').Declaration} CSSDeclaration */\n","import onCSSDeclaration from './onCSSDeclaration'\nimport options from './options'\n\n/** Transform lab() and lch() functions in CSS. */\nconst postcssPlugin = /** @type {PostCSSPluginInitializer} */ opts => {\n\toptions.preserve = 'preserve' in Object(opts) ? Boolean(opts.preserve) : false\n\n\treturn {\n\t\tpostcssPlugin: 'postcss-lab-function',\n\t\tDeclaration: onCSSDeclaration,\n\t}\n}\n\npostcssPlugin.postcss = true\n\nexport default postcssPlugin\n\n/** @typedef {import('postcss').Plugin} PostCSSPlugin */\n/** @typedef {(opts: options) => PostCSSPlugin} PostCSSPluginInitializer */\n"],"names":["onCSSFunction","node","name","nodes","isColorFunctionName","isLabFunctionContents","isLchFunctionContents","Object","assign","slashNode","alphaNode","isPercentage","isCalc","value","String","unit","remove","isSlash","replaceWith","commaNode","clone","channelNode1","channelNode2","channelNode3","toRGB","isLabColorFunctionName","lab2rgb","lch2rgb","rgbValues","map","channelNumber","parseFloat","channelValue","Math","max","min","parseInt","parse","first","createRegExpTest","Function","bind","RegExp","prototype","test","isCalcFunctionName","isAlphaLikeUnit","isHueLikeUnit","isAlphaValue","type","isHue","isNumber","every","index","labFunctionContents","lchFunctionContents","preserve","onCSSDeclaration","decl","result","originalValue","hasAnyColorFunction","valueAST","ignoreUnknownWords","error","warn","walkType","modifiedValue","options","cloneBefore","postcssPlugin","opts","Boolean","Declaration","postcss"],"mappings":"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"}
|
package/dist/index.esm.js
DELETED
|
@@ -1,207 +0,0 @@
|
|
|
1
|
-
import { parse } from 'postcss-values-parser';
|
|
2
|
-
import { lab2rgb, lch2rgb } from '@csstools/convert-colors';
|
|
3
|
-
|
|
4
|
-
/** @type {(decl: CSSFunction) => void} Transform lab() and lch() functions. */
|
|
5
|
-
|
|
6
|
-
const onCSSFunction = node => {
|
|
7
|
-
/** @type {{ name: string, nodes: CSSNode[] }} */
|
|
8
|
-
const {
|
|
9
|
-
name,
|
|
10
|
-
nodes
|
|
11
|
-
} = node;
|
|
12
|
-
|
|
13
|
-
if (isColorFunctionName(name)) {
|
|
14
|
-
if (isLabFunctionContents(nodes) || isLchFunctionContents(nodes)) {
|
|
15
|
-
// rename the Color function to `rgb`
|
|
16
|
-
Object.assign(node, {
|
|
17
|
-
name: 'rgb'
|
|
18
|
-
});
|
|
19
|
-
/** @type {CSSPunctuation} Slash punctuation before the Alpha channel. */
|
|
20
|
-
|
|
21
|
-
const slashNode = nodes[3];
|
|
22
|
-
/** @type {CSSNumber} Alpha channel. */
|
|
23
|
-
|
|
24
|
-
const alphaNode = nodes[4];
|
|
25
|
-
|
|
26
|
-
if (alphaNode) {
|
|
27
|
-
if (isPercentage(alphaNode) && !isCalc(alphaNode)) {
|
|
28
|
-
// transform the Alpha channel from a Percentage to (0-1) Number
|
|
29
|
-
Object.assign(alphaNode, {
|
|
30
|
-
value: String(alphaNode.value / 100),
|
|
31
|
-
unit: ''
|
|
32
|
-
});
|
|
33
|
-
} // if the color is fully opaque (i.e. the Alpha channel is `1`)
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
if (alphaNode.value === '1') {
|
|
37
|
-
// remove the Slash and Alpha channel
|
|
38
|
-
slashNode.remove();
|
|
39
|
-
alphaNode.remove();
|
|
40
|
-
} else {
|
|
41
|
-
// otherwise, rename the Color function to `rgba`
|
|
42
|
-
Object.assign(node, {
|
|
43
|
-
name: 'rgba'
|
|
44
|
-
});
|
|
45
|
-
}
|
|
46
|
-
} // replace a remaining Slash with a Comma
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
if (slashNode && isSlash(slashNode)) {
|
|
50
|
-
slashNode.replaceWith(commaNode.clone());
|
|
51
|
-
}
|
|
52
|
-
/** Extracted Color channels. */
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
const [channelNode1, channelNode2, channelNode3] = nodes;
|
|
56
|
-
/** Corresponding Color transformer. */
|
|
57
|
-
|
|
58
|
-
const toRGB = isLabColorFunctionName(name) ? lab2rgb : lch2rgb;
|
|
59
|
-
/** RGB channels from the source color. */
|
|
60
|
-
|
|
61
|
-
const rgbValues = toRGB(...[channelNode1.value, channelNode2.value, channelNode3.value].map(channelNumber => parseFloat(channelNumber))).map(channelValue => Math.max(Math.min(parseInt(channelValue * 2.55), 255), 0));
|
|
62
|
-
channelNode3.replaceWith(channelNode3.clone({
|
|
63
|
-
value: String(rgbValues[2])
|
|
64
|
-
}));
|
|
65
|
-
channelNode2.replaceWith(channelNode2.clone({
|
|
66
|
-
value: String(rgbValues[1])
|
|
67
|
-
}), commaNode.clone());
|
|
68
|
-
channelNode1.replaceWith(channelNode1.clone({
|
|
69
|
-
value: String(rgbValues[0]),
|
|
70
|
-
unit: ''
|
|
71
|
-
}), commaNode.clone());
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
};
|
|
75
|
-
const commaNode = parse(',').first;
|
|
76
|
-
/** @type {(value: RegExp) => (value: string) => boolean} Return a function that checks whether the expression exists in a value. */
|
|
77
|
-
|
|
78
|
-
const createRegExpTest$1 = Function.bind.bind(RegExp.prototype.test);
|
|
79
|
-
/** Return whether the function name is `lab` or `lch`. */
|
|
80
|
-
|
|
81
|
-
const isColorFunctionName = createRegExpTest$1(/^(lab|lch)$/i);
|
|
82
|
-
/** Return whether the function name is `calc`. */
|
|
83
|
-
|
|
84
|
-
const isCalcFunctionName = createRegExpTest$1(/^calc$/i);
|
|
85
|
-
/** Return whether the function name is `lab`. */
|
|
86
|
-
|
|
87
|
-
const isLabColorFunctionName = createRegExpTest$1(/^lab$/i);
|
|
88
|
-
/** Return whether the unit is alpha-like. */
|
|
89
|
-
|
|
90
|
-
const isAlphaLikeUnit = createRegExpTest$1(/^%?$/i);
|
|
91
|
-
/** Return whether the unit is hue-like. */
|
|
92
|
-
|
|
93
|
-
const isHueLikeUnit = createRegExpTest$1(/^(deg|grad|rad|turn)?$/i);
|
|
94
|
-
/** @type {(node: CSSFunction) => boolean} Return whether the node is an Alpha-like unit. */
|
|
95
|
-
|
|
96
|
-
const isAlphaValue = node => isCalc(node) || node.type === 'numeric' && isAlphaLikeUnit(node.unit);
|
|
97
|
-
/** @type {(node: CSSFunction) => boolean} Return whether the node is a calc() function. */
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
const isCalc = node => node.type === 'func' && isCalcFunctionName(node.name);
|
|
101
|
-
/** @type {(node: CSSNumber) => boolean} Return whether the node is a Hue-like unit. */
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
const isHue = node => isCalc(node) || node.type === 'numeric' && isHueLikeUnit(node.unit);
|
|
105
|
-
/** @type {(node: CSSNumber) => boolean} Return whether the node is a Number unit. */
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
const isNumber = node => isCalc(node) || node.type === 'numeric' && node.unit === '';
|
|
109
|
-
/** @type {(node: CSSNumber) => boolean} Return whether the node is a Percentage unit. */
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
const isPercentage = node => isCalc(node) || node.type === 'numeric' && node.unit === '%';
|
|
113
|
-
/** @type {(node: CSSOperator) => boolean} Return whether the node is a Slash delimiter. */
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
const isSlash = node => node.type === 'operator' && node.value === '/';
|
|
117
|
-
/** @type {(nodes: Node[]) => boolean} Return whether a set of nodes is a lab() function. */
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
const isLabFunctionContents = nodes => nodes.every((node, index) => typeof labFunctionContents[index] === 'function' && labFunctionContents[index](node));
|
|
121
|
-
/** Set of nodes in a lab() function. */
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
const labFunctionContents = [isPercentage, isNumber, isNumber, isSlash, isAlphaValue];
|
|
125
|
-
/** @type {(nodes: Node[]) => boolean} Return whether a set of nodes is a lch() function. */
|
|
126
|
-
|
|
127
|
-
const isLchFunctionContents = nodes => nodes.every((node, index) => typeof lchFunctionContents[index] === 'function' && lchFunctionContents[index](node));
|
|
128
|
-
/** Set of nodes in a lch() function. */
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
const lchFunctionContents = [isPercentage, isNumber, isHue, isSlash, isAlphaValue];
|
|
132
|
-
/** @typedef {import('postcss-values-parser').Func} CSSFunction */
|
|
133
|
-
|
|
134
|
-
/** @typedef {import('postcss-values-parser').Node} CSSNode */
|
|
135
|
-
|
|
136
|
-
/** @typedef {import('postcss-values-parser').Numeric} CSSNumber */
|
|
137
|
-
|
|
138
|
-
/** @typedef {import('postcss-values-parser').Operator} CSSOperator */
|
|
139
|
-
|
|
140
|
-
/** @typedef {import('postcss-values-parser').Punctuation} CSSPunctuation */
|
|
141
|
-
|
|
142
|
-
var options = {
|
|
143
|
-
/** Whether to preserve the original functional color declaration. */
|
|
144
|
-
preserve: false
|
|
145
|
-
};
|
|
146
|
-
|
|
147
|
-
/** @type {(decl: CSSDeclaration) => void} Transform lab() and lch() functions in CSS Declarations. */
|
|
148
|
-
|
|
149
|
-
const onCSSDeclaration = (decl, {
|
|
150
|
-
result
|
|
151
|
-
}) => {
|
|
152
|
-
const {
|
|
153
|
-
value: originalValue
|
|
154
|
-
} = decl;
|
|
155
|
-
|
|
156
|
-
if (hasAnyColorFunction(originalValue)) {
|
|
157
|
-
let valueAST;
|
|
158
|
-
|
|
159
|
-
try {
|
|
160
|
-
valueAST = parse(originalValue, {
|
|
161
|
-
ignoreUnknownWords: true
|
|
162
|
-
});
|
|
163
|
-
} catch (error) {
|
|
164
|
-
decl.warn(result, `Failed to parse value '${originalValue}' as a lab or hcl function. Leaving the original value intact.`);
|
|
165
|
-
}
|
|
166
|
-
|
|
167
|
-
if (typeof valueAST === 'undefined') {
|
|
168
|
-
return;
|
|
169
|
-
}
|
|
170
|
-
|
|
171
|
-
valueAST.walkType('func', onCSSFunction);
|
|
172
|
-
const modifiedValue = String(valueAST);
|
|
173
|
-
|
|
174
|
-
if (modifiedValue !== originalValue) {
|
|
175
|
-
if (options.preserve) decl.cloneBefore({
|
|
176
|
-
value: modifiedValue
|
|
177
|
-
});else decl.value = modifiedValue;
|
|
178
|
-
}
|
|
179
|
-
}
|
|
180
|
-
};
|
|
181
|
-
/** @type {(value: RegExp) => (value: string) => boolean} Return a function that checks whether the expression exists in a value. */
|
|
182
|
-
|
|
183
|
-
const createRegExpTest = Function.bind.bind(RegExp.prototype.test);
|
|
184
|
-
/** Return whether the value has a lab() or lch() function. */
|
|
185
|
-
|
|
186
|
-
const hasAnyColorFunction = createRegExpTest(/(^|[^\w-])(lab|lch)\(/i);
|
|
187
|
-
/** @typedef {import('postcss').Declaration} CSSDeclaration */
|
|
188
|
-
|
|
189
|
-
/** Transform lab() and lch() functions in CSS. */
|
|
190
|
-
|
|
191
|
-
const postcssPlugin =
|
|
192
|
-
/** @type {PostCSSPluginInitializer} */
|
|
193
|
-
opts => {
|
|
194
|
-
options.preserve = 'preserve' in Object(opts) ? Boolean(opts.preserve) : false;
|
|
195
|
-
return {
|
|
196
|
-
postcssPlugin: 'postcss-lab-function',
|
|
197
|
-
Declaration: onCSSDeclaration
|
|
198
|
-
};
|
|
199
|
-
};
|
|
200
|
-
|
|
201
|
-
postcssPlugin.postcss = true;
|
|
202
|
-
/** @typedef {import('postcss').Plugin} PostCSSPlugin */
|
|
203
|
-
|
|
204
|
-
/** @typedef {(opts: options) => PostCSSPlugin} PostCSSPluginInitializer */
|
|
205
|
-
|
|
206
|
-
export { postcssPlugin as default };
|
|
207
|
-
//# sourceMappingURL=index.esm.js.map
|