diff --git a/plugins/postcss-custom-functions/CHANGELOG.md b/plugins/postcss-custom-functions/CHANGELOG.md index f405d07e4..030b0d9a1 100644 --- a/plugins/postcss-custom-functions/CHANGELOG.md +++ b/plugins/postcss-custom-functions/CHANGELOG.md @@ -1,5 +1,9 @@ # Changes to PostCSS Custom Functions +### Unreleased (patch) + +- Drop `node:path` and `node:crypto` dependencies + ### 1.0.0 _October 1, 2026_ diff --git a/plugins/postcss-custom-functions/README.md b/plugins/postcss-custom-functions/README.md index 1cfdaba51..446b619a8 100644 --- a/plugins/postcss-custom-functions/README.md +++ b/plugins/postcss-custom-functions/README.md @@ -56,14 +56,14 @@ html { html { --gap: 1em; - --_csstools-cf-1agle9gi-1-arg-0: var(--gap); - --_csstools-cf-1agle9gi-0-result: calc(-1 * var(--_csstools-cf-1agle9gi-1-arg-0)); - padding: var(--_csstools-cf-1agle9gi-0-result); - --_csstools-cf-1agle9gi-3-arg-0: 4px; - --_csstools-cf-1agle9gi-2-result: calc(2 * var(--_csstools-cf-1agle9gi-3-arg-0)); - margin: var(--_csstools-cf-1agle9gi-2-result); + --_csstools-cf-1gice1e-1-arg-0: var(--gap); + --_csstools-cf-1gice1e-0-result: calc(-1 * var(--_csstools-cf-1gice1e-1-arg-0)); + padding: var(--_csstools-cf-1gice1e-0-result); + --_csstools-cf-1gice1e-3-arg-0: 4px; + --_csstools-cf-1gice1e-2-result: calc(2 * var(--_csstools-cf-1gice1e-3-arg-0)); + margin: var(--_csstools-cf-1gice1e-2-result); } -@property --_csstools-cf-1agle9gi-3-arg-0 { +@property --_csstools-cf-1gice1e-3-arg-0 { syntax: ""; inherits: false; initial-value: 1px; @@ -138,17 +138,17 @@ html { html { --gap: 1em; - --_csstools-cf-1agle9gi-1-arg-0: var(--gap); - --_csstools-cf-1agle9gi-0-result: calc(-1 * var(--_csstools-cf-1agle9gi-1-arg-0)); - padding: var(--_csstools-cf-1agle9gi-0-result); + --_csstools-cf-1gice1e-1-arg-0: var(--gap); + --_csstools-cf-1gice1e-0-result: calc(-1 * var(--_csstools-cf-1gice1e-1-arg-0)); + padding: var(--_csstools-cf-1gice1e-0-result); padding: --negative(var(--gap)); - --_csstools-cf-1agle9gi-3-arg-0: 4px; - --_csstools-cf-1agle9gi-2-result: calc(2 * var(--_csstools-cf-1agle9gi-3-arg-0)); - margin: var(--_csstools-cf-1agle9gi-2-result); + --_csstools-cf-1gice1e-3-arg-0: 4px; + --_csstools-cf-1gice1e-2-result: calc(2 * var(--_csstools-cf-1gice1e-3-arg-0)); + margin: var(--_csstools-cf-1gice1e-2-result); margin: --double(4px); } -@property --_csstools-cf-1agle9gi-3-arg-0 { +@property --_csstools-cf-1gice1e-3-arg-0 { syntax: ""; inherits: false; initial-value: 1px; diff --git a/plugins/postcss-custom-functions/dist/index.mjs b/plugins/postcss-custom-functions/dist/index.mjs index 3a0cfc20f..8a652a25a 100644 --- a/plugins/postcss-custom-functions/dist/index.mjs +++ b/plugins/postcss-custom-functions/dist/index.mjs @@ -1 +1 @@ -import{parse as e,addLayerToModel as t}from"@csstools/cascade-layer-name-parser";import r from"node:crypto";import n from"node:path";import{tokenize as s,isTokenDimension as o,isTokenPercentage as a,isTokenIdent as i,stringify as u,isTokenComment as l,isTokenComma as c,isTokenDelim as f,isTokenColon as p,isTokenOpenCurly as m,isTokenFunction as h,TokenType as d,mutateIdent as g}from"@csstools/css-tokenizer";import{parseListOfComponentValues as v,isFunctionNode as y,isSimpleBlockNode as w,isTokenNode as C,isWhiteSpaceOrCommentNode as N,isWhitespaceNode as F,replaceComponentValues as k,stringify as b,TokenNode as L,parseCommaSeparatedListOfComponentValues as R,FunctionNode as T}from"@csstools/css-parser-algorithms";import{AtRule as S,Declaration as B}from"postcss";const P=e("csstools-implicit-layer")[0];function collectCascadeLayerOrder(r){const n=new Map,s=new Map,o=[];let a=1;r.walkAtRules(r=>{if("layer"!==r.name.toLowerCase())return;{let e=r.parent;for(;e;){if("atrule"!==e.type||"layer"!==e.name.toLowerCase()){if(e===r.root())break;return}e=e.parent}}let i;if(r.nodes)i=normalizeLayerName(r.params,a++);else{if(!r.params.trim())return;i=r.params}let u=e(i);if(u?.length){{let e=r.parent;for(;e&&"atrule"===e.type&&"layer"===e.name.toLowerCase();){const t=s.get(e);t?(u=u.map(e=>t.concat(e)),e=e.parent):e=e.parent}}if(t(o,u),r.nodes){const e=u[0].concat(P);n.set(r,e),s.set(r,u[0])}}});for(const e of n.values())t(o,[e]);const i=new Map;for(let e=0;e{if(!parameterType(e))return!0;const t=e.getDefaultValue();return!!t&&areComponentsIndependent(v(s({css:t})),!1)})}function staticKeywordResult(e){let t=!1;if(e.walkAtRules(e=>{e.walkDecls(e=>{"result"===e.prop.toLowerCase()&&(t=!0)})}),t)return null;let r=null;for(const t of e.nodes||[])"decl"===t.type&&"result"===t.prop.toLowerCase()&&(r=t.value.trim());return r&&A.has(r.toLowerCase())?r:null}function hasKeywordResult(e){let t=!1;return e.walkDecls(e=>{if("result"===e.prop.toLowerCase())for(const r of s({css:e.value}))i(r)&&A.has(r[4].value.toLowerCase())&&(t=!0)}),t}var O,q;(q=O||(O={})).CustomFunction="custom-function",q.FunctionParameter="function-parameter";class CustomFunction{type=O.CustomFunction;function;parameters;returnsKeyword;returnType;before;after;constructor(e,t,r,n,s=[],o=[]){this.function=e,this.parameters=t,this.returnsKeyword=r,this.returnType=n,this.before=s,this.after=o}getName(){return this.function.getName()}getReturnType(){const e=v(this.returnType).filter(e=>!N(e));return 1===e.length&&y(e[0])&&"type"===e[0].getName().toLowerCase()?u(...e[0].value.flatMap(e=>e.tokens()).filter(e=>!l(e))).trim():u(...this.returnType.filter(e=>!l(e))).trim()}tokens(){return[...this.before,...this.function.tokens(),...this.returnsKeyword,...this.returnType,...this.after]}toString(){return u(...this.before)+u(...this.function.tokens())+u(...this.returnsKeyword)+u(...this.returnType)+u(...this.after)}toJSON(){return{type:this.type,name:this.getName(),string:this.toString(),tokens:this.tokens(),parameters:this.parameters.map(e=>e.toJSON()),returnsKeyword:this.returnsKeyword,returnType:this.returnType,before:this.before,after:this.after}}isCustomFunction(){return CustomFunction.isCustomFunction(this)}static isCustomFunction(e){return!!e&&e instanceof CustomFunction&&e.type===O.CustomFunction}}class FunctionParameter{type=O.FunctionParameter;name;argumentType;colon;defaultValue;before;after;constructor(e,t,r,n,s=[],o=[]){this.name=e,this.argumentType=t,this.colon=r,this.defaultValue=n,this.before=s,this.after=o}getName(){return this.name[4].value}getNameToken(){return this.name}getArgumentType(){return u(...this.argumentType.filter(e=>!l(e))).trim()}getDefaultValue(){return u(...this.defaultValue).trim()}toJSON(){return{type:this.type,name:this.getName(),argumentType:this.argumentType,colon:this.colon,defaultValue:this.defaultValue,before:this.before,after:this.after}}isFunctionParameter(){return FunctionParameter.isFunctionParameter(this)}static isFunctionParameter(e){return!!e&&e instanceof FunctionParameter&&e.type===O.FunctionParameter}}function parseCustomFunction(e){let t=null,r=-1,n=-1,s=-1,o=e.length;for(let o=0;os;t--){const r=e[t];if(!N(r))break;o=t}const a=parseFunctionParameters(t.value);return!!a&&new CustomFunction(t,a,-1===s?[]:e.slice(r+1,s).flatMap(e=>e.tokens()),-1===s?[]:e.slice(s,o).flatMap(e=>e.tokens()),e.slice(0,r).flatMap(e=>e.tokens()),e.slice(o).flatMap(e=>e.tokens()))}function parseFunctionParameters(e){if(!e.some(e=>!N(e)))return[];const t=[],r=new Set;for(let n=0;n0&&C(m)&&f(m.value)&&">"===m.value[4].value)t--;else if(-1===s&&0===t&&C(m)&&p(m.value))s=l,o=m.value;else if(-1===s){if(-1!==s)return!1}else a=l}}if(!n)return!1;if(-1!==s&&-1===a)return!1;const h=-1!==s?s-1:l-1;for(let t=e.length-1;t>Math.max(h,a);t--){const r=e[t];if(!F(r))break;u=t}let d;{const t=e.slice(r+1,h+1),n=t.filter(e=>!N(e));d=1===n.length&&y(n[0])&&"type"===n[0].getName().toLowerCase()?n[0].value.flatMap(e=>e.tokens()):t.flatMap(e=>e.tokens())}let g=[];if(-1!==a){const t=e.slice(s+1,u);if(hasTopLevelImportant(t))return!1;const r=t.filter(e=>!N(e));g=1===r.length&&w(r[0])&&m(r[0].startToken)?r[0].value.flatMap(e=>e.tokens()):t.flatMap(e=>e.tokens())}return{advance:l,node:new FunctionParameter(n,d,o,g,e.slice(0,r).flatMap(e=>e.tokens()),e.slice(u,l+1).flatMap(e=>e.tokens()))}}function hasTopLevelImportant(e){for(let t=0;t{r=!0,t?.onParseError?.(e)}});return!r&&parseCustomFunction(n)}function parse(e,t){return parseFromTokens(s({css:e},{onParseError:t?.onParseError}),t)}function layerStrength(e){return!1===e?1/0:e}const z=/^(media|supports|container|starting-style)$/i;function getCustomFunctions(e,t){const r=new Map;let n=new WeakMap;try{n=collectCascadeLayerOrder(e)}catch(e){t.warn(`Failed to collect cascade layer order: "${e instanceof Error?e.message:e}"`)}let s=0;e.walkAtRules(e=>{if(!isProcessableRule(e))return;const o=parse(e.params.trim(),{onParseError:r=>{e.warn(t,`Failed to parse custom function : "${e.params}" with message: "${r instanceof Error?r.message:r}"`)}});if(!o)return;const a=classifyCustomFunction(e,o),i=o.getName(),u=a.supported&&!isInConditionalLayer(e),l={node:e,function:o,supported:u,keywordResult:a.keywordResult,hasKeywordResult:a.hasKeywordResult,conditionals:collectConditionalAncestors(e),layer:cascadeLayerNumberForNode(e,n),order:s++},c=r.get(i)??{definitions:[],supported:!0};c.definitions.push(l),c.supported=c.supported&&u,r.set(i,c)});for(const e of r.values())if(e.definitions.sort((e,t)=>layerStrength(e.layer)-layerStrength(t.layer)||e.order-t.order),e.definitions.some(e=>e.hasKeywordResult)){1===e.definitions.length&&null!==e.definitions[0].keywordResult||(e.supported=!1)}return r}function removeUnusedCustomFunctions(e,t){const r=new Set;for(const e of t.values())if(e.supported)for(const t of e.definitions)r.add(t.node);const n=new Set;collectCustomFunctionReferences(e,r,n,!0);const s=new Set,o=[...n];for(;o.length;){const e=o.pop();if(s.has(e))continue;s.add(e);const r=t.get(e);if(r&&r.supported)for(const e of r.definitions){const t=new Set;collectCustomFunctionReferences(e.node,new Set,t,!1);for(const e of t)n.has(e)||(n.add(e),o.push(e))}}for(const[e,r]of t)if(r.supported&&!n.has(e))for(const e of r.definitions){const t=e.node.parent;e.node.remove(),removeEmptyAncestorBlocks(t)}}function collectCustomFunctionReferences(e,t,r,n){e.walk(e=>{if("decl"===e.type&&e.value.includes("--")&&!(isInsideAny(e,t)||n&&isProcessableDeclaration(e)))for(const t of s({css:e.value}))h(t)&&t[4].value.startsWith("--")&&r.add(t[4].value)})}function isInsideAny(e,t){let r=e.parent;for(;r;){if(t.has(r))return!0;r=r.parent}return!1}function collectConditionalAncestors(e){const t=[];let r=e.parent;for(;r;)"atrule"===r.type&&z.test(r.name)&&t.unshift(r),r=r.parent;return t}function removeEmptyAncestorBlocks(e){if(!e)return;let t=e;for(;t;){if(t.nodes&&t.nodes.length>0)return;const e=t.parent;t.remove(),t=e}}const G=1e5;class Scope{names=new Map;parent;constructor(e){this.parent=e}get(e){const t=this.names.get(e);return void 0!==t?t:this.parent?.get(e)}}class CustomFunctionTranspiler{customFunctions=new Map;counter=0;frames=[];registrations=[];names=new GeneratedNames("0");budget=G;emittedNodes=[];setCustomFunctions(e){this.customFunctions=e,this.budget=G}spendBudget(e=1){if(this.budget-=e,this.budget<0)throw new Error("Maximum custom function expansion size exceeded, reduce the complexity of your custom functions")}getRegistrations(){return this.registrations}processDeclaration(e){const t=s({css:e.value});if(!t.some(e=>h(e)&&e[4].value.startsWith("--")))return null;const r=e.parent;if(!r||"rule"!==r.type)return null;this.names=new GeneratedNames(sourceHashFor(e.source?.input.from));const n=r,o=v(t),a=[];this.emittedNodes=[],k([o],e=>{if(!y(e))return;const t=e.getName();if(!t.startsWith("--"))return;const r=this.customFunctions.get(t);return r&&r.supported?this.processCall(e,n,new Scope(null),a):void 0});const i=b([o]);return i!==e.value||a.length||this.emittedNodes.length?(this.emittedNodes.length&&(n.before(this.emittedNodes),this.emittedNodes=[]),a.length&&e.before(a),i===e.value?null:i):null}processCall(e,t,r,n){const s=e.getName(),o=this.customFunctions.get(s);if(!o||!o.supported)return[this.varReference(I)];const a=this.frames.find(e=>e.name===s);if(a)return a.cyclic=!0,[this.varReference(I)];const i=this.parseArguments(e);if(!i)return[this.varReference(I)];const u=1===o.definitions.length?o.definitions[0].keywordResult:null,l=i.map(e=>this.rewriteValue(b([e]),t,r,n)),c=(this.counter++).toString(36),f=this.resultName(c),p={name:s,cyclic:!1};this.frames.push(p);for(const e of o.definitions)this.emitDefinition(e,i,l,t,r,f,n);return p.cyclic&&n.push(this.invalidResultDeclaration(f,t)),this.frames.pop(),p.cyclic?[this.varReference(I)]:u?[new L([d.Ident,u,-1,-1,{value:u}])]:[this.varReference(f)]}emitDefinition(e,t,r,n,s,o,a){const i=e.function.parameters;let u=t.length<=i.length;if(u)for(let e=t.length;e{u.length&&(i.push(...wrapInConditionals([t.clone({nodes:u})],a)),u=[])};for(const l of e){if("decl"===l.type){const e=this.processBodyDeclaration(l,t,r,n,s,o,u);e&&u.push(e);continue}"atrule"!==l.type||(flush(),i.push(...this.emitBody(l.nodes||[],t,r,n,s,o,[...a,l])))}return flush(),i}emitBodyInline(e,t,r,n,s,o,a){for(const i of e){if("decl"===i.type){const e=this.processBodyDeclaration(i,t,r,n,s,o,a);e&&a.push(e);continue}"atrule"===i.type&&this.emitBodyInline(i.nodes||[],t,r,n,s,o,a)}}processBodyDeclaration(e,t,r,n,s,o,a){let i;if("result"===e.prop.toLowerCase())i=o;else{if(!e.prop.startsWith("--"))return null;{const t=r.get(e.prop);if(!t)return null;i=t}}let u=this.rewriteValue(e.value,t,r,a);return e.prop.startsWith("--")&&(u=this.resolveBodyKeywords(u,e.prop,r,n)),this.spendBudget(),e.clone({prop:i,value:u})}resolveBodyKeywords(e,t,r,n){const o=s({css:e});if(!o.some(e=>h(e)&&"var"===e[4].value.toLowerCase())){const s=e.trim().toLowerCase(),o=A.has(s)?this.resolveLocalKeyword(s,t,r,n):null;return o?b([o]):e}const a=v(o);return rewriteVarFallbackKeywords(a,e=>this.resolveLocalKeyword(e,t,r,n))?b([a]):e}rewriteDefault(e,t,r,n,s,o){const a=this.rewriteValue(e,r,n,o);return this.resolveBodyKeywords(a,t,n,s)}resolveLocalKeyword(e,t,r,n){return"initial"===e?[this.varReference(n.get(t)??I)]:"inherit"===e?[this.varReference(r.parent?.get(t)??t)]:A.has(e)?[this.varReference(I)]:null}rewriteValue(e,t,r,n){const o=s({css:e});if(!o.some(e=>h(e)&&("var"===e[4].value.toLowerCase()||e[4].value.startsWith("--"))))return e;const a=v(o);return k([a],e=>{if(!y(e))return;const s=e.getName();if("var"===s.toLowerCase())return void this.rewriteVarReference(e,r);if(!s.startsWith("--"))return;const o=this.customFunctions.get(s);return o&&o.supported?this.processCall(e,t,r,n):void 0}),b([a])}rewriteVarReference(e,t){for(const r of e.value){if(N(r))continue;if(!C(r)||!i(r.value))return;const e=r.value[4].value;if(!e.startsWith("--"))return;const n=t.get(e);if(!n)return;return void g(r.value,n)}}parseArguments(e){if(0===e.value.filter(e=>!N(e)).length)return[];const t=R(e.value.flatMap(e=>e.tokens())),r=[];for(const e of t){const t=unwrapArgument(e);if(!t)return!1;r.push(t)}return r}invalidResultDeclaration(e,t){return this.spendBudget(),new B({prop:e,value:`var(${I})`,source:t.source})}varReference(e){return new T([d.Function,"var(",-1,-1,{value:"var"}],[d.CloseParen,")",-1,-1,void 0],[new L([d.Ident,e,-1,-1,{value:e}])])}argName(e,t){return this.names.argName(e,t)}rawName(e,t){return this.names.rawName(e,t)}localName(e,t){return this.names.localName(e,t)}resultName(e){return this.names.resultName(e)}}function wrapInConditionals(e,t){let r=e;for(let e=t.length-1;e>=0;e--)r=[t[e].clone({nodes:r})];return r}function rewriteVarFallbackKeywords(e,t){let r=!1;for(const n of e){if(!y(n)||"var"!==n.getName().toLowerCase())continue;const e=findTopLevelCommaIndex(n.value);if(-1===e)continue;const s=n.value.slice(e+1).filter(e=>!N(e));if(1!==s.length)continue;const o=s[0];if(C(o)&&i(o.value)){const s=t(o.value[4].value.toLowerCase());s&&(n.value=[...n.value.slice(0,e+1),...s],r=!0);continue}y(o)&&rewriteVarFallbackKeywords([o],t)&&(r=!0)}return r}function findTopLevelCommaIndex(e){for(let t=0;t!N(e));return 0!==t.length&&(1===t.length&&w(t[0])&&m(t[0].startToken)?t[0].value:e)}function hasConditionalBody(e){let t=!1;return e.walkAtRules(e=>{e.nodes&&(t=!0)}),t}function collectLocalNames(e){const t=new Set;return e.walkDecls(e=>{e.prop.startsWith("--")&&t.add(e.prop)}),t}const J=/--[^:;\s(){}[\]]+\(/,creator=e=>{const t=Object.assign({preserve:!1},e);return{postcssPlugin:"postcss-custom-functions",prepare(){let e=new Map;const r=new CustomFunctionTranspiler;return{postcssPlugin:"postcss-custom-functions",Once(n,{result:s}){e=getCustomFunctions(n,s),t.preserve||removeUnusedCustomFunctions(n,e),r.setCustomFunctions(e)},OnceExit(e){for(const t of r.getRegistrations())e.append(t)},Declaration(e){if(!J.test(e.value))return;if(!isProcessableDeclaration(e))return;const n=r.processDeclaration(e);null!==n&&(e.cloneBefore({value:n}),t.preserve||e.remove())}}}}};creator.postcss=!0;export{creator as default,creator as"module.exports"}; +import{parse as e,addLayerToModel as t}from"@csstools/cascade-layer-name-parser";import{tokenize as r,isTokenDimension as n,isTokenPercentage as s,isTokenIdent as o,stringify as a,isTokenComment as i,isTokenComma as u,isTokenDelim as l,isTokenColon as c,isTokenOpenCurly as f,isTokenFunction as p,TokenType as h,mutateIdent as m}from"@csstools/css-tokenizer";import{parseListOfComponentValues as d,isFunctionNode as g,isSimpleBlockNode as v,isTokenNode as y,isWhiteSpaceOrCommentNode as w,isWhitespaceNode as C,replaceComponentValues as N,stringify as F,TokenNode as k,parseCommaSeparatedListOfComponentValues as b,FunctionNode as L}from"@csstools/css-parser-algorithms";import{AtRule as R,Declaration as T}from"postcss";const S=e("csstools-implicit-layer")[0];function collectCascadeLayerOrder(r){const n=new Map,s=new Map,o=[];let a=1;r.walkAtRules(r=>{if("layer"!==r.name.toLowerCase())return;{let e=r.parent;for(;e;){if("atrule"!==e.type||"layer"!==e.name.toLowerCase()){if(e===r.root())break;return}e=e.parent}}let i;if(r.nodes)i=normalizeLayerName(r.params,a++);else{if(!r.params.trim())return;i=r.params}let u=e(i);if(u?.length){{let e=r.parent;for(;e&&"atrule"===e.type&&"layer"===e.name.toLowerCase();){const t=s.get(e);t?(u=u.map(e=>t.concat(e)),e=e.parent):e=e.parent}}if(t(o,u),r.nodes){const e=u[0].concat(S);n.set(r,e),s.set(r,u[0])}}});for(const e of n.values())t(o,[e]);const i=new Map;for(let e=0;e>>0).toString(36)}function sourceKey(e){const t=e.replaceAll("\\","/").split("/").filter(e=>e.length>0);return 0===t.length?".":1===t.length?`./${t[0]}`:t.slice(-2).join("/")}class GeneratedNames{sourceHash;constructor(e){this.sourceHash=e}argName(e,t){return`${$}-${this.sourceHash}-${e}-arg-${t}`}rawName(e,t){return`${$}-${this.sourceHash}-${e}-raw-${t}`}localName(e,t){return`${$}-${this.sourceHash}-${e}-local-${t.slice(2)}`}resultName(e){return`${$}-${this.sourceHash}-${e}-result`}}const A=new Set(["function","keyframes"]);function isProcessableDeclaration(e){if(e.prop.startsWith($))return!1;if(!e.parent||"rule"!==e.parent.type)return!1;let t=e.parent;for(;t;){if("atrule"===t.type&&A.has(t.name.toLowerCase()))return!1;t=t.parent}return!0}const I=new Set(["initial","inherit","unset","revert","revert-layer","revert-rule"]),V=new Set(["em","rem","ex","rex","cap","rcap","ch","rch","ic","ric","lh","rlh","vw","vh","vi","vb","vmin","vmax","svw","svh","svi","svb","svmin","svmax","lvw","lvh","lvi","lvb","lvmin","lvmax","dvw","dvh","dvi","dvb","dvmin","dvmax","cqw","cqh","cqi","cqb","cqmin","cqmax","fr"]),x=new Set(["var","env","attr","light-dark","image-set","-webkit-image-set","anchor","anchor-size","sibling-index","sibling-count","random","random-item","toggle","state","running","progress","media-progress","container-progress","calc-size","paint","element","inherit","first-valid","if","scroll","view"]),W=new Set(["rgb","rgba","hsl","hsla","hwb","lab","lch","oklab","oklch","color","color-mix","color-contrast","device-cmyk"]);function areComponentsIndependent(e,t){for(const r of e){if(g(r)){const e=r.getName().toLowerCase();if(x.has(e))return!1;if(!areComponentsIndependent(r.value,t||W.has(e)))return!1;continue}if(v(r)){if(!areComponentsIndependent(r.value,t))return!1;continue}if(!y(r))continue;const e=r.value;if(n(e)){if(V.has(e[4].unit.toLowerCase()))return!1}else if(s(e)){if(!t)return!1}else if(o(e)){const t=e[4].value.toLowerCase();if("currentcolor"===t||I.has(t))return!1}}return!0}function parameterType(e){const t=e.getArgumentType();return t&&"*"!==t?t:null}function returnType(e){const t=e.getReturnType();return t&&"*"!==t?t:null}function classifyCustomFunction(e,t){return{supported:isSupportedCustomFunction(t),keywordResult:staticKeywordResult(e),hasKeywordResult:hasKeywordResult(e)}}function isSupportedCustomFunction(e){return!returnType(e)&&e.parameters.every(e=>{if(!parameterType(e))return!0;const t=e.getDefaultValue();return!!t&&areComponentsIndependent(d(r({css:t})),!1)})}function staticKeywordResult(e){let t=!1;if(e.walkAtRules(e=>{e.walkDecls(e=>{"result"===e.prop.toLowerCase()&&(t=!0)})}),t)return null;let r=null;for(const t of e.nodes||[])"decl"===t.type&&"result"===t.prop.toLowerCase()&&(r=t.value.trim());return r&&I.has(r.toLowerCase())?r:null}function hasKeywordResult(e){let t=!1;return e.walkDecls(e=>{if("result"===e.prop.toLowerCase())for(const n of r({css:e.value}))o(n)&&I.has(n[4].value.toLowerCase())&&(t=!0)}),t}var E,H;(H=E||(E={})).CustomFunction="custom-function",H.FunctionParameter="function-parameter";class CustomFunction{type=E.CustomFunction;function;parameters;returnsKeyword;returnType;before;after;constructor(e,t,r,n,s=[],o=[]){this.function=e,this.parameters=t,this.returnsKeyword=r,this.returnType=n,this.before=s,this.after=o}getName(){return this.function.getName()}getReturnType(){const e=d(this.returnType).filter(e=>!w(e));return 1===e.length&&g(e[0])&&"type"===e[0].getName().toLowerCase()?a(...e[0].value.flatMap(e=>e.tokens()).filter(e=>!i(e))).trim():a(...this.returnType.filter(e=>!i(e))).trim()}tokens(){return[...this.before,...this.function.tokens(),...this.returnsKeyword,...this.returnType,...this.after]}toString(){return a(...this.before)+a(...this.function.tokens())+a(...this.returnsKeyword)+a(...this.returnType)+a(...this.after)}toJSON(){return{type:this.type,name:this.getName(),string:this.toString(),tokens:this.tokens(),parameters:this.parameters.map(e=>e.toJSON()),returnsKeyword:this.returnsKeyword,returnType:this.returnType,before:this.before,after:this.after}}isCustomFunction(){return CustomFunction.isCustomFunction(this)}static isCustomFunction(e){return!!e&&e instanceof CustomFunction&&e.type===E.CustomFunction}}class FunctionParameter{type=E.FunctionParameter;name;argumentType;colon;defaultValue;before;after;constructor(e,t,r,n,s=[],o=[]){this.name=e,this.argumentType=t,this.colon=r,this.defaultValue=n,this.before=s,this.after=o}getName(){return this.name[4].value}getNameToken(){return this.name}getArgumentType(){return a(...this.argumentType.filter(e=>!i(e))).trim()}getDefaultValue(){return a(...this.defaultValue).trim()}toJSON(){return{type:this.type,name:this.getName(),argumentType:this.argumentType,colon:this.colon,defaultValue:this.defaultValue,before:this.before,after:this.after}}isFunctionParameter(){return FunctionParameter.isFunctionParameter(this)}static isFunctionParameter(e){return!!e&&e instanceof FunctionParameter&&e.type===E.FunctionParameter}}function parseCustomFunction(e){let t=null,r=-1,n=-1,s=-1,a=e.length;for(let a=0;as;t--){const r=e[t];if(!w(r))break;a=t}const i=parseFunctionParameters(t.value);return!!i&&new CustomFunction(t,i,-1===s?[]:e.slice(r+1,s).flatMap(e=>e.tokens()),-1===s?[]:e.slice(s,a).flatMap(e=>e.tokens()),e.slice(0,r).flatMap(e=>e.tokens()),e.slice(a).flatMap(e=>e.tokens()))}function parseFunctionParameters(e){if(!e.some(e=>!w(e)))return[];const t=[],r=new Set;for(let n=0;n0&&y(f)&&l(f.value)&&">"===f.value[4].value)t--;else if(-1===s&&0===t&&y(f)&&c(f.value))s=h,a=f.value;else if(-1===s){if(-1!==s)return!1}else i=h}}if(!n)return!1;if(-1!==s&&-1===i)return!1;const m=-1!==s?s-1:h-1;for(let t=e.length-1;t>Math.max(m,i);t--){const r=e[t];if(!C(r))break;p=t}let d;{const t=e.slice(r+1,m+1),n=t.filter(e=>!w(e));d=1===n.length&&g(n[0])&&"type"===n[0].getName().toLowerCase()?n[0].value.flatMap(e=>e.tokens()):t.flatMap(e=>e.tokens())}let N=[];if(-1!==i){const t=e.slice(s+1,p);if(hasTopLevelImportant(t))return!1;const r=t.filter(e=>!w(e));N=1===r.length&&v(r[0])&&f(r[0].startToken)?r[0].value.flatMap(e=>e.tokens()):t.flatMap(e=>e.tokens())}return{advance:h,node:new FunctionParameter(n,d,a,N,e.slice(0,r).flatMap(e=>e.tokens()),e.slice(p,h+1).flatMap(e=>e.tokens()))}}function hasTopLevelImportant(e){for(let t=0;t{r=!0,t?.onParseError?.(e)}});return!r&&parseCustomFunction(n)}function parse(e,t){return parseFromTokens(r({css:e},{onParseError:t?.onParseError}),t)}function layerStrength(e){return!1===e?1/0:e}const O=/^(media|supports|container|starting-style)$/i;function getCustomFunctions(e,t){const r=new Map;let n=new WeakMap;try{n=collectCascadeLayerOrder(e)}catch(e){t.warn(`Failed to collect cascade layer order: "${e instanceof Error?e.message:e}"`)}let s=0;e.walkAtRules(e=>{if(!isProcessableRule(e))return;const o=parse(e.params.trim(),{onParseError:r=>{e.warn(t,`Failed to parse custom function : "${e.params}" with message: "${r instanceof Error?r.message:r}"`)}});if(!o)return;const a=classifyCustomFunction(e,o),i=o.getName(),u=a.supported&&!isInConditionalLayer(e),l={node:e,function:o,supported:u,keywordResult:a.keywordResult,hasKeywordResult:a.hasKeywordResult,conditionals:collectConditionalAncestors(e),layer:cascadeLayerNumberForNode(e,n),order:s++},c=r.get(i)??{definitions:[],supported:!0};c.definitions.push(l),c.supported=c.supported&&u,r.set(i,c)});for(const e of r.values())if(e.definitions.sort((e,t)=>layerStrength(e.layer)-layerStrength(t.layer)||e.order-t.order),e.definitions.some(e=>e.hasKeywordResult)){1===e.definitions.length&&null!==e.definitions[0].keywordResult||(e.supported=!1)}return r}function removeUnusedCustomFunctions(e,t){const r=new Set;for(const e of t.values())if(e.supported)for(const t of e.definitions)r.add(t.node);const n=new Set;collectCustomFunctionReferences(e,r,n,!0);const s=new Set,o=[...n];for(;o.length;){const e=o.pop();if(s.has(e))continue;s.add(e);const r=t.get(e);if(r&&r.supported)for(const e of r.definitions){const t=new Set;collectCustomFunctionReferences(e.node,new Set,t,!1);for(const e of t)n.has(e)||(n.add(e),o.push(e))}}for(const[e,r]of t)if(r.supported&&!n.has(e))for(const e of r.definitions){const t=e.node.parent;e.node.remove(),removeEmptyAncestorBlocks(t)}}function collectCustomFunctionReferences(e,t,n,s){e.walk(e=>{if("decl"===e.type&&e.value.includes("--")&&!(isInsideAny(e,t)||s&&isProcessableDeclaration(e)))for(const t of r({css:e.value}))p(t)&&t[4].value.startsWith("--")&&n.add(t[4].value)})}function isInsideAny(e,t){let r=e.parent;for(;r;){if(t.has(r))return!0;r=r.parent}return!1}function collectConditionalAncestors(e){const t=[];let r=e.parent;for(;r;)"atrule"===r.type&&O.test(r.name)&&t.unshift(r),r=r.parent;return t}function removeEmptyAncestorBlocks(e){if(!e)return;let t=e;for(;t;){if(t.nodes&&t.nodes.length>0)return;const e=t.parent;t.remove(),t=e}}const q=1e5;class Scope{names=new Map;parent;constructor(e){this.parent=e}get(e){const t=this.names.get(e);return void 0!==t?t:this.parent?.get(e)}}class CustomFunctionTranspiler{customFunctions=new Map;counter=0;frames=[];registrations=[];names=new GeneratedNames("0");budget=q;emittedNodes=[];setCustomFunctions(e){this.customFunctions=e,this.budget=q}spendBudget(e=1){if(this.budget-=e,this.budget<0)throw new Error("Maximum custom function expansion size exceeded, reduce the complexity of your custom functions")}getRegistrations(){return this.registrations}processDeclaration(e){const t=r({css:e.value});if(!t.some(e=>p(e)&&e[4].value.startsWith("--")))return null;const n=e.parent;if(!n||"rule"!==n.type)return null;this.names=new GeneratedNames(sourceHashFor(e.source?.input.from));const s=n,o=d(t),a=[];this.emittedNodes=[],N([o],e=>{if(!g(e))return;const t=e.getName();if(!t.startsWith("--"))return;const r=this.customFunctions.get(t);return r&&r.supported?this.processCall(e,s,new Scope(null),a):void 0});const i=F([o]);return i!==e.value||a.length||this.emittedNodes.length?(this.emittedNodes.length&&(s.before(this.emittedNodes),this.emittedNodes=[]),a.length&&e.before(a),i===e.value?null:i):null}processCall(e,t,r,n){const s=e.getName(),o=this.customFunctions.get(s);if(!o||!o.supported)return[this.varReference(M)];const a=this.frames.find(e=>e.name===s);if(a)return a.cyclic=!0,[this.varReference(M)];const i=this.parseArguments(e);if(!i)return[this.varReference(M)];const u=1===o.definitions.length?o.definitions[0].keywordResult:null,l=i.map(e=>this.rewriteValue(F([e]),t,r,n)),c=(this.counter++).toString(36),f=this.resultName(c),p={name:s,cyclic:!1};this.frames.push(p);for(const e of o.definitions)this.emitDefinition(e,i,l,t,r,f,n);return p.cyclic&&n.push(this.invalidResultDeclaration(f,t)),this.frames.pop(),p.cyclic?[this.varReference(M)]:u?[new k([h.Ident,u,-1,-1,{value:u}])]:[this.varReference(f)]}emitDefinition(e,t,r,n,s,o,a){const i=e.function.parameters;let u=t.length<=i.length;if(u)for(let e=t.length;e{u.length&&(i.push(...wrapInConditionals([t.clone({nodes:u})],a)),u=[])};for(const l of e){if("decl"===l.type){const e=this.processBodyDeclaration(l,t,r,n,s,o,u);e&&u.push(e);continue}"atrule"!==l.type||(flush(),i.push(...this.emitBody(l.nodes||[],t,r,n,s,o,[...a,l])))}return flush(),i}emitBodyInline(e,t,r,n,s,o,a){for(const i of e){if("decl"===i.type){const e=this.processBodyDeclaration(i,t,r,n,s,o,a);e&&a.push(e);continue}"atrule"===i.type&&this.emitBodyInline(i.nodes||[],t,r,n,s,o,a)}}processBodyDeclaration(e,t,r,n,s,o,a){let i;if("result"===e.prop.toLowerCase())i=o;else{if(!e.prop.startsWith("--"))return null;{const t=r.get(e.prop);if(!t)return null;i=t}}let u=this.rewriteValue(e.value,t,r,a);return e.prop.startsWith("--")&&(u=this.resolveBodyKeywords(u,e.prop,r,n)),this.spendBudget(),e.clone({prop:i,value:u})}resolveBodyKeywords(e,t,n,s){const o=r({css:e});if(!o.some(e=>p(e)&&"var"===e[4].value.toLowerCase())){const r=e.trim().toLowerCase(),o=I.has(r)?this.resolveLocalKeyword(r,t,n,s):null;return o?F([o]):e}const a=d(o);return rewriteVarFallbackKeywords(a,e=>this.resolveLocalKeyword(e,t,n,s))?F([a]):e}rewriteDefault(e,t,r,n,s,o){const a=this.rewriteValue(e,r,n,o);return this.resolveBodyKeywords(a,t,n,s)}resolveLocalKeyword(e,t,r,n){return"initial"===e?[this.varReference(n.get(t)??M)]:"inherit"===e?[this.varReference(r.parent?.get(t)??t)]:I.has(e)?[this.varReference(M)]:null}rewriteValue(e,t,n,s){const o=r({css:e});if(!o.some(e=>p(e)&&("var"===e[4].value.toLowerCase()||e[4].value.startsWith("--"))))return e;const a=d(o);return N([a],e=>{if(!g(e))return;const r=e.getName();if("var"===r.toLowerCase())return void this.rewriteVarReference(e,n);if(!r.startsWith("--"))return;const o=this.customFunctions.get(r);return o&&o.supported?this.processCall(e,t,n,s):void 0}),F([a])}rewriteVarReference(e,t){for(const r of e.value){if(w(r))continue;if(!y(r)||!o(r.value))return;const e=r.value[4].value;if(!e.startsWith("--"))return;const n=t.get(e);if(!n)return;return void m(r.value,n)}}parseArguments(e){if(0===e.value.filter(e=>!w(e)).length)return[];const t=b(e.value.flatMap(e=>e.tokens())),r=[];for(const e of t){const t=unwrapArgument(e);if(!t)return!1;r.push(t)}return r}invalidResultDeclaration(e,t){return this.spendBudget(),new T({prop:e,value:`var(${M})`,source:t.source})}varReference(e){return new L([h.Function,"var(",-1,-1,{value:"var"}],[h.CloseParen,")",-1,-1,void 0],[new k([h.Ident,e,-1,-1,{value:e}])])}argName(e,t){return this.names.argName(e,t)}rawName(e,t){return this.names.rawName(e,t)}localName(e,t){return this.names.localName(e,t)}resultName(e){return this.names.resultName(e)}}function wrapInConditionals(e,t){let r=e;for(let e=t.length-1;e>=0;e--)r=[t[e].clone({nodes:r})];return r}function rewriteVarFallbackKeywords(e,t){let r=!1;for(const n of e){if(!g(n)||"var"!==n.getName().toLowerCase())continue;const e=findTopLevelCommaIndex(n.value);if(-1===e)continue;const s=n.value.slice(e+1).filter(e=>!w(e));if(1!==s.length)continue;const a=s[0];if(y(a)&&o(a.value)){const s=t(a.value[4].value.toLowerCase());s&&(n.value=[...n.value.slice(0,e+1),...s],r=!0);continue}g(a)&&rewriteVarFallbackKeywords([a],t)&&(r=!0)}return r}function findTopLevelCommaIndex(e){for(let t=0;t!w(e));return 0!==t.length&&(1===t.length&&v(t[0])&&f(t[0].startToken)?t[0].value:e)}function hasConditionalBody(e){let t=!1;return e.walkAtRules(e=>{e.nodes&&(t=!0)}),t}function collectLocalNames(e){const t=new Set;return e.walkDecls(e=>{e.prop.startsWith("--")&&t.add(e.prop)}),t}const z=/--[^:;\s(){}[\]]+\(/,creator=e=>{const t=Object.assign({preserve:!1},e);return{postcssPlugin:"postcss-custom-functions",prepare(){let e=new Map;const r=new CustomFunctionTranspiler;return{postcssPlugin:"postcss-custom-functions",Once(n,{result:s}){e=getCustomFunctions(n,s),t.preserve||removeUnusedCustomFunctions(n,e),r.setCustomFunctions(e)},OnceExit(e){for(const t of r.getRegistrations())e.append(t)},Declaration(e){if(!z.test(e.value))return;if(!isProcessableDeclaration(e))return;const n=r.processDeclaration(e);null!==n&&(e.cloneBefore({value:n}),t.preserve||e.remove())}}}}};creator.postcss=!0;export{creator as default,creator as"module.exports"}; diff --git a/plugins/postcss-custom-functions/src/generated-names.ts b/plugins/postcss-custom-functions/src/generated-names.ts index b796bfbc5..389c0907b 100644 --- a/plugins/postcss-custom-functions/src/generated-names.ts +++ b/plugins/postcss-custom-functions/src/generated-names.ts @@ -1,6 +1,3 @@ -import crypto from 'node:crypto'; -import path from 'node:path'; - /** * Prefix for every custom property this plugin generates. * @@ -40,14 +37,43 @@ export function sourceHashFor(from: string | undefined): string { return existing; } - const hash = crypto.createHash('md5'); - hash.update(path.basename(path.dirname(from)) + '/' + path.basename(from), 'utf8'); - const value = parseInt(hash.digest('hex'), 16).toString(36).slice(0, 8); + const value = hashSourcePath(from); sourceHashes.set(from, value); return value; } +/** + * Hash only the last two path segments, so that names are stable regardless + * of the absolute location of a project, and avoid `node:crypto` / `node:path` + * so that this plugin can run in a browser bundle. + */ +function hashSourcePath(from: string): string { + let hash = 2166136261; + const source = sourceKey(from); + + for (let i = 0; i < source.length; i++) { + hash ^= source.charCodeAt(i); + hash = Math.imul(hash, 16777619); + } + + return (hash >>> 0).toString(36); +} + +function sourceKey(from: string): string { + const segments = from.replaceAll('\\', '/').split('/').filter((segment) => segment.length > 0); + + if (segments.length === 0) { + return '.'; + } + + if (segments.length === 1) { + return `./${segments[0]}`; + } + + return segments.slice(-2).join('/'); +} + /** * Builds the custom property names emitted for a single source file. * diff --git a/plugins/postcss-custom-functions/test/anonymous-layers.expect.css b/plugins/postcss-custom-functions/test/anonymous-layers.expect.css index 79bfd72bb..e21d9e5e1 100644 --- a/plugins/postcss-custom-functions/test/anonymous-layers.expect.css +++ b/plugins/postcss-custom-functions/test/anonymous-layers.expect.css @@ -1,21 +1,21 @@ /* Every anonymous layer is its own layer and must not collapse into a single layer. */ .anon { - --_csstools-cf-3ynakb2p-0-result: 1px; + --_csstools-cf-1k7kax1-0-result: 1px; } .anon { - --_csstools-cf-3ynakb2p-0-result: 2px; + --_csstools-cf-1k7kax1-0-result: 2px; } .anon { - --_csstools-cf-3ynakb2p-0-result: 3px; + --_csstools-cf-1k7kax1-0-result: 3px; } .anon { - --_csstools-cf-3ynakb2p-0-result: 4px; + --_csstools-cf-1k7kax1-0-result: 4px; } .anon { - width: var(--_csstools-cf-3ynakb2p-0-result); + width: var(--_csstools-cf-1k7kax1-0-result); } diff --git a/plugins/postcss-custom-functions/test/basic.expect.css b/plugins/postcss-custom-functions/test/basic.expect.css index feea94365..7f88c05c5 100644 --- a/plugins/postcss-custom-functions/test/basic.expect.css +++ b/plugins/postcss-custom-functions/test/basic.expect.css @@ -1,19 +1,19 @@ .negative-a { --gap: 1em; - --_csstools-cf-86hq2t3p-1-arg-0: var(--gap); - --_csstools-cf-86hq2t3p-0-result: calc(-1 * var(--_csstools-cf-86hq2t3p-1-arg-0)); - padding: var(--_csstools-cf-86hq2t3p-0-result); + --_csstools-cf-wv7kid-1-arg-0: var(--gap); + --_csstools-cf-wv7kid-0-result: calc(-1 * var(--_csstools-cf-wv7kid-1-arg-0)); + padding: var(--_csstools-cf-wv7kid-0-result); } .negative-b { - --_csstools-cf-86hq2t3p-3-arg-0: 1em; - --_csstools-cf-86hq2t3p-2-result: calc(-1 * var(--_csstools-cf-86hq2t3p-3-arg-0)); - padding: var(--_csstools-cf-86hq2t3p-2-result); + --_csstools-cf-wv7kid-3-arg-0: 1em; + --_csstools-cf-wv7kid-2-result: calc(-1 * var(--_csstools-cf-wv7kid-3-arg-0)); + padding: var(--_csstools-cf-wv7kid-2-result); } .circle { - --_csstools-cf-86hq2t3p-5-arg-0: 2px; - --_csstools-cf-86hq2t3p-5-local-r2: calc(var(--_csstools-cf-86hq2t3p-5-arg-0) * var(--_csstools-cf-86hq2t3p-5-arg-0)); - --_csstools-cf-86hq2t3p-4-result: calc(3.14159 * var(--_csstools-cf-86hq2t3p-5-local-r2)); - width: var(--_csstools-cf-86hq2t3p-4-result); + --_csstools-cf-wv7kid-5-arg-0: 2px; + --_csstools-cf-wv7kid-5-local-r2: calc(var(--_csstools-cf-wv7kid-5-arg-0) * var(--_csstools-cf-wv7kid-5-arg-0)); + --_csstools-cf-wv7kid-4-result: calc(3.14159 * var(--_csstools-cf-wv7kid-5-local-r2)); + width: var(--_csstools-cf-wv7kid-4-result); } diff --git a/plugins/postcss-custom-functions/test/basic.preserve-true.expect.css b/plugins/postcss-custom-functions/test/basic.preserve-true.expect.css index ec9678daa..b072dd394 100644 --- a/plugins/postcss-custom-functions/test/basic.preserve-true.expect.css +++ b/plugins/postcss-custom-functions/test/basic.preserve-true.expect.css @@ -4,16 +4,16 @@ .negative-a { --gap: 1em; - --_csstools-cf-86hq2t3p-1-arg-0: var(--gap); - --_csstools-cf-86hq2t3p-0-result: calc(-1 * var(--_csstools-cf-86hq2t3p-1-arg-0)); - padding: var(--_csstools-cf-86hq2t3p-0-result); + --_csstools-cf-wv7kid-1-arg-0: var(--gap); + --_csstools-cf-wv7kid-0-result: calc(-1 * var(--_csstools-cf-wv7kid-1-arg-0)); + padding: var(--_csstools-cf-wv7kid-0-result); padding: --negative(var(--gap)); } .negative-b { - --_csstools-cf-86hq2t3p-3-arg-0: 1em; - --_csstools-cf-86hq2t3p-2-result: calc(-1 * var(--_csstools-cf-86hq2t3p-3-arg-0)); - padding: var(--_csstools-cf-86hq2t3p-2-result); + --_csstools-cf-wv7kid-3-arg-0: 1em; + --_csstools-cf-wv7kid-2-result: calc(-1 * var(--_csstools-cf-wv7kid-3-arg-0)); + padding: var(--_csstools-cf-wv7kid-2-result); padding: --negative(1em); } @@ -23,9 +23,9 @@ } .circle { - --_csstools-cf-86hq2t3p-5-arg-0: 2px; - --_csstools-cf-86hq2t3p-5-local-r2: calc(var(--_csstools-cf-86hq2t3p-5-arg-0) * var(--_csstools-cf-86hq2t3p-5-arg-0)); - --_csstools-cf-86hq2t3p-4-result: calc(3.14159 * var(--_csstools-cf-86hq2t3p-5-local-r2)); - width: var(--_csstools-cf-86hq2t3p-4-result); + --_csstools-cf-wv7kid-5-arg-0: 2px; + --_csstools-cf-wv7kid-5-local-r2: calc(var(--_csstools-cf-wv7kid-5-arg-0) * var(--_csstools-cf-wv7kid-5-arg-0)); + --_csstools-cf-wv7kid-4-result: calc(3.14159 * var(--_csstools-cf-wv7kid-5-local-r2)); + width: var(--_csstools-cf-wv7kid-4-result); width: --circle-area(2px); } diff --git a/plugins/postcss-custom-functions/test/classification.expect.css b/plugins/postcss-custom-functions/test/classification.expect.css index 2ea6c7d44..a5ff4c3cd 100644 --- a/plugins/postcss-custom-functions/test/classification.expect.css +++ b/plugins/postcss-custom-functions/test/classification.expect.css @@ -1,16 +1,16 @@ /* `type(*)` is the universal syntax and counts as untyped. */ .universal { - --_csstools-cf-eru3g4zo-1-arg-0: var(--_csstools-cf-eru3g4zo-1-raw-0, 1px); - --_csstools-cf-eru3g4zo-0-result: var(--_csstools-cf-eru3g4zo-1-arg-0); - width: var(--_csstools-cf-eru3g4zo-0-result); + --_csstools-cf-77lo8z-1-arg-0: var(--_csstools-cf-77lo8z-1-raw-0, 1px); + --_csstools-cf-77lo8z-0-result: var(--_csstools-cf-77lo8z-1-arg-0); + width: var(--_csstools-cf-77lo8z-0-result); } /* `returns type(*)` is the default return type and counts as no return type. */ .universal-return { - --_csstools-cf-eru3g4zo-2-result: 2px; - width: var(--_csstools-cf-eru3g4zo-2-result); + --_csstools-cf-77lo8z-2-result: 2px; + width: var(--_csstools-cf-77lo8z-2-result); } /* A typed parameter with a computationally independent default is supported. */ diff --git a/plugins/postcss-custom-functions/test/conditional-definitions.expect.css b/plugins/postcss-custom-functions/test/conditional-definitions.expect.css index c929eb0f6..36469a142 100644 --- a/plugins/postcss-custom-functions/test/conditional-definitions.expect.css +++ b/plugins/postcss-custom-functions/test/conditional-definitions.expect.css @@ -1,45 +1,45 @@ @supports (width: 100px) {.conditional { - --_csstools-cf-7hov6p4v-0-result: PASS; + --_csstools-cf-154dd4k-0-result: PASS; } }@supports (not (width: 100px)) {.conditional { - --_csstools-cf-7hov6p4v-0-result: FAIL; + --_csstools-cf-154dd4k-0-result: FAIL; } } .conditional { - width: var(--_csstools-cf-7hov6p4v-0-result); + width: var(--_csstools-cf-154dd4k-0-result); } @media (width >= 50px) { .media { - --_csstools-cf-7hov6p4v-3-result: 50px; + --_csstools-cf-154dd4k-3-result: 50px; } } @media (width >= 100px) { .media { - --_csstools-cf-7hov6p4v-3-result: 100px; + --_csstools-cf-154dd4k-3-result: 100px; } } .media { - width: var(--_csstools-cf-7hov6p4v-3-result); + width: var(--_csstools-cf-154dd4k-3-result); } @media (width >= 50px) { .layered-media { - --_csstools-cf-7hov6p4v-6-result: 1px; + --_csstools-cf-154dd4k-6-result: 1px; } } @media (width >= 99999px) { .layered-media { - --_csstools-cf-7hov6p4v-6-result: 2px; + --_csstools-cf-154dd4k-6-result: 2px; } } .layered-media { - width: var(--_csstools-cf-7hov6p4v-6-result); + width: var(--_csstools-cf-154dd4k-6-result); } diff --git a/plugins/postcss-custom-functions/test/conditional-definitions.preserve-true.expect.css b/plugins/postcss-custom-functions/test/conditional-definitions.preserve-true.expect.css index 75c25c82d..38f3f5249 100644 --- a/plugins/postcss-custom-functions/test/conditional-definitions.preserve-true.expect.css +++ b/plugins/postcss-custom-functions/test/conditional-definitions.preserve-true.expect.css @@ -11,19 +11,19 @@ }@supports (width: 100px) { .conditional { - --_csstools-cf-7hov6p4v-0-result: PASS; + --_csstools-cf-154dd4k-0-result: PASS; } } @supports (not (width: 100px)) { .conditional { - --_csstools-cf-7hov6p4v-0-result: FAIL; + --_csstools-cf-154dd4k-0-result: FAIL; } } .conditional { - width: var(--_csstools-cf-7hov6p4v-0-result); + width: var(--_csstools-cf-154dd4k-0-result); width: --f(); } @@ -42,19 +42,19 @@ @media (width >= 50px) { .media { - --_csstools-cf-7hov6p4v-3-result: 50px; + --_csstools-cf-154dd4k-3-result: 50px; } } @media (width >= 100px) { .media { - --_csstools-cf-7hov6p4v-3-result: 100px; + --_csstools-cf-154dd4k-3-result: 100px; } } .media { - width: var(--_csstools-cf-7hov6p4v-3-result); + width: var(--_csstools-cf-154dd4k-3-result); width: --g(); } @@ -76,17 +76,17 @@ @media (width >= 50px) { .layered-media { - --_csstools-cf-7hov6p4v-6-result: 1px; + --_csstools-cf-154dd4k-6-result: 1px; } } @media (width >= 99999px) { .layered-media { - --_csstools-cf-7hov6p4v-6-result: 2px; + --_csstools-cf-154dd4k-6-result: 2px; } } .layered-media { - width: var(--_csstools-cf-7hov6p4v-6-result); + width: var(--_csstools-cf-154dd4k-6-result); width: --h(); } diff --git a/plugins/postcss-custom-functions/test/conditional-keyword-result.expect.css b/plugins/postcss-custom-functions/test/conditional-keyword-result.expect.css index c918517f4..32d20de59 100644 --- a/plugins/postcss-custom-functions/test/conditional-keyword-result.expect.css +++ b/plugins/postcss-custom-functions/test/conditional-keyword-result.expect.css @@ -22,6 +22,6 @@ } .static-keyword { - --_csstools-cf-5a7fouo8-0-result: inherit; + --_csstools-cf-101b7vj-0-result: inherit; width: inherit; } diff --git a/plugins/postcss-custom-functions/test/conditional-layers.expect.css b/plugins/postcss-custom-functions/test/conditional-layers.expect.css index d776e3801..53b0470ba 100644 --- a/plugins/postcss-custom-functions/test/conditional-layers.expect.css +++ b/plugins/postcss-custom-functions/test/conditional-layers.expect.css @@ -35,16 +35,16 @@ @media (min-width: 0px) { .layered-conditional { - --_csstools-cf-d6h7kjw3-0-result: 20px; + --_csstools-cf-1jusoma-0-result: 20px; } } @media (min-width: 0px) { .layered-conditional { - --_csstools-cf-d6h7kjw3-0-result: 10px; + --_csstools-cf-1jusoma-0-result: 10px; } } .layered-conditional { - width: var(--_csstools-cf-d6h7kjw3-0-result); + width: var(--_csstools-cf-1jusoma-0-result); } diff --git a/plugins/postcss-custom-functions/test/conditionals.expect.css b/plugins/postcss-custom-functions/test/conditionals.expect.css index cb258dfe4..e0396972d 100644 --- a/plugins/postcss-custom-functions/test/conditionals.expect.css +++ b/plugins/postcss-custom-functions/test/conditionals.expect.css @@ -1,29 +1,29 @@ .conditional { - --_csstools-cf-c7hag91p-0-result: 16px; + --_csstools-cf-i8vbbi-0-result: 16px; } @media (width > 1000px) {.conditional { - --_csstools-cf-c7hag91p-0-result: 20px; + --_csstools-cf-i8vbbi-0-result: 20px; } } .conditional { - width: var(--_csstools-cf-c7hag91p-0-result); + width: var(--_csstools-cf-i8vbbi-0-result); } .conditional-locals { - --_csstools-cf-c7hag91p-3-local-x: FAIL; + --_csstools-cf-i8vbbi-3-local-x: FAIL; } @media (width > 0px) { .conditional-locals { - --_csstools-cf-c7hag91p-3-local-x: PASS; + --_csstools-cf-i8vbbi-3-local-x: PASS; } } .conditional-locals { - --_csstools-cf-c7hag91p-2-result: var(--_csstools-cf-c7hag91p-3-local-x); + --_csstools-cf-i8vbbi-2-result: var(--_csstools-cf-i8vbbi-3-local-x); } .conditional-locals { - width: var(--_csstools-cf-c7hag91p-2-result); + width: var(--_csstools-cf-i8vbbi-2-result); } diff --git a/plugins/postcss-custom-functions/test/cycles.expect.css b/plugins/postcss-custom-functions/test/cycles.expect.css index f8ed7de90..10e63f9cd 100644 --- a/plugins/postcss-custom-functions/test/cycles.expect.css +++ b/plugins/postcss-custom-functions/test/cycles.expect.css @@ -1,30 +1,30 @@ .cycle-through-unused-local { - --_csstools-cf-63y219qj-1-local-unused: var(--_csstools-cf-invalid); - --_csstools-cf-63y219qj-0-result: FAIL-result; - --_csstools-cf-63y219qj-0-result: var(--_csstools-cf-invalid); + --_csstools-cf-sw0cts-1-local-unused: var(--_csstools-cf-invalid); + --_csstools-cf-sw0cts-0-result: FAIL-result; + --_csstools-cf-sw0cts-0-result: var(--_csstools-cf-invalid); --tmp: var(--_csstools-cf-invalid); --actual: var(--tmp, PASS); } .self-cycle { - --_csstools-cf-63y219qj-2-result: var(--_csstools-cf-invalid); - --_csstools-cf-63y219qj-2-result: var(--_csstools-cf-invalid); + --_csstools-cf-sw0cts-2-result: var(--_csstools-cf-invalid); + --_csstools-cf-sw0cts-2-result: var(--_csstools-cf-invalid); --tmp: var(--_csstools-cf-invalid); --actual: var(--tmp, PASS); } .ping-pong { - --_csstools-cf-63y219qj-6-result: var(--_csstools-cf-invalid); - --_csstools-cf-63y219qj-4-result: var(--_csstools-cf-63y219qj-6-result); - --_csstools-cf-63y219qj-4-result: var(--_csstools-cf-invalid); + --_csstools-cf-sw0cts-6-result: var(--_csstools-cf-invalid); + --_csstools-cf-sw0cts-4-result: var(--_csstools-cf-sw0cts-6-result); + --_csstools-cf-sw0cts-4-result: var(--_csstools-cf-invalid); --tmp: var(--_csstools-cf-invalid); --actual: var(--tmp, PASS); } .keyword-with-cycle { - --_csstools-cf-63y219qj-9-local-unused: var(--_csstools-cf-invalid); - --_csstools-cf-63y219qj-8-result: inherit; - --_csstools-cf-63y219qj-8-result: var(--_csstools-cf-invalid); + --_csstools-cf-sw0cts-9-local-unused: var(--_csstools-cf-invalid); + --_csstools-cf-sw0cts-8-result: inherit; + --_csstools-cf-sw0cts-8-result: var(--_csstools-cf-invalid); --tmp: var(--_csstools-cf-invalid); --actual: var(--tmp, PASS); } diff --git a/plugins/postcss-custom-functions/test/examples/example.expect.css b/plugins/postcss-custom-functions/test/examples/example.expect.css index c7ea2d436..f218d2cdf 100644 --- a/plugins/postcss-custom-functions/test/examples/example.expect.css +++ b/plugins/postcss-custom-functions/test/examples/example.expect.css @@ -1,13 +1,13 @@ html { --gap: 1em; - --_csstools-cf-1agle9gi-1-arg-0: var(--gap); - --_csstools-cf-1agle9gi-0-result: calc(-1 * var(--_csstools-cf-1agle9gi-1-arg-0)); - padding: var(--_csstools-cf-1agle9gi-0-result); - --_csstools-cf-1agle9gi-3-arg-0: 4px; - --_csstools-cf-1agle9gi-2-result: calc(2 * var(--_csstools-cf-1agle9gi-3-arg-0)); - margin: var(--_csstools-cf-1agle9gi-2-result); + --_csstools-cf-1gice1e-1-arg-0: var(--gap); + --_csstools-cf-1gice1e-0-result: calc(-1 * var(--_csstools-cf-1gice1e-1-arg-0)); + padding: var(--_csstools-cf-1gice1e-0-result); + --_csstools-cf-1gice1e-3-arg-0: 4px; + --_csstools-cf-1gice1e-2-result: calc(2 * var(--_csstools-cf-1gice1e-3-arg-0)); + margin: var(--_csstools-cf-1gice1e-2-result); } -@property --_csstools-cf-1agle9gi-3-arg-0 { +@property --_csstools-cf-1gice1e-3-arg-0 { syntax: ""; inherits: false; initial-value: 1px; diff --git a/plugins/postcss-custom-functions/test/examples/example.preserve-true.expect.css b/plugins/postcss-custom-functions/test/examples/example.preserve-true.expect.css index 605c60fac..b908f21e6 100644 --- a/plugins/postcss-custom-functions/test/examples/example.preserve-true.expect.css +++ b/plugins/postcss-custom-functions/test/examples/example.preserve-true.expect.css @@ -8,17 +8,17 @@ html { --gap: 1em; - --_csstools-cf-1agle9gi-1-arg-0: var(--gap); - --_csstools-cf-1agle9gi-0-result: calc(-1 * var(--_csstools-cf-1agle9gi-1-arg-0)); - padding: var(--_csstools-cf-1agle9gi-0-result); + --_csstools-cf-1gice1e-1-arg-0: var(--gap); + --_csstools-cf-1gice1e-0-result: calc(-1 * var(--_csstools-cf-1gice1e-1-arg-0)); + padding: var(--_csstools-cf-1gice1e-0-result); padding: --negative(var(--gap)); - --_csstools-cf-1agle9gi-3-arg-0: 4px; - --_csstools-cf-1agle9gi-2-result: calc(2 * var(--_csstools-cf-1agle9gi-3-arg-0)); - margin: var(--_csstools-cf-1agle9gi-2-result); + --_csstools-cf-1gice1e-3-arg-0: 4px; + --_csstools-cf-1gice1e-2-result: calc(2 * var(--_csstools-cf-1gice1e-3-arg-0)); + margin: var(--_csstools-cf-1gice1e-2-result); margin: --double(4px); } -@property --_csstools-cf-1agle9gi-3-arg-0 { +@property --_csstools-cf-1gice1e-3-arg-0 { syntax: ""; inherits: false; initial-value: 1px; diff --git a/plugins/postcss-custom-functions/test/inlining.expect.css b/plugins/postcss-custom-functions/test/inlining.expect.css index ea63f1045..5861ee3d5 100644 --- a/plugins/postcss-custom-functions/test/inlining.expect.css +++ b/plugins/postcss-custom-functions/test/inlining.expect.css @@ -2,33 +2,33 @@ .inlined-a { --gap: 1em; - --_csstools-cf-7csnaj5b-1-arg-0: var(--gap); - --_csstools-cf-7csnaj5b-0-result: calc(-1 * var(--_csstools-cf-7csnaj5b-1-arg-0)); - width: var(--_csstools-cf-7csnaj5b-0-result); + --_csstools-cf-19up9hh-1-arg-0: var(--gap); + --_csstools-cf-19up9hh-0-result: calc(-1 * var(--_csstools-cf-19up9hh-1-arg-0)); + width: var(--_csstools-cf-19up9hh-0-result); } .inlined-b { - --_csstools-cf-7csnaj5b-3-arg-0: 1em; - --_csstools-cf-7csnaj5b-2-result: calc(-1 * var(--_csstools-cf-7csnaj5b-3-arg-0)); - width: var(--_csstools-cf-7csnaj5b-2-result); + --_csstools-cf-19up9hh-3-arg-0: 1em; + --_csstools-cf-19up9hh-2-result: calc(-1 * var(--_csstools-cf-19up9hh-3-arg-0)); + width: var(--_csstools-cf-19up9hh-2-result); } /* Nested calls are inlined into the same rule as well. */ .inlined-nested { - --_csstools-cf-7csnaj5b-5-arg-0: 1; - --_csstools-cf-7csnaj5b-5-local-b: 2; - --_csstools-cf-7csnaj5b-6-result: var(--_csstools-cf-7csnaj5b-5-arg-0) var(--_csstools-cf-7csnaj5b-5-local-b); - --_csstools-cf-7csnaj5b-4-result: var(--_csstools-cf-7csnaj5b-6-result); - width: var(--_csstools-cf-7csnaj5b-4-result); + --_csstools-cf-19up9hh-5-arg-0: 1; + --_csstools-cf-19up9hh-5-local-b: 2; + --_csstools-cf-19up9hh-6-result: var(--_csstools-cf-19up9hh-5-arg-0) var(--_csstools-cf-19up9hh-5-local-b); + --_csstools-cf-19up9hh-4-result: var(--_csstools-cf-19up9hh-6-result); + width: var(--_csstools-cf-19up9hh-4-result); } /* A definition in a cascade layer can not be inlined. */ .layered { - --_csstools-cf-7csnaj5b-8-result: 1px; + --_csstools-cf-19up9hh-8-result: 1px; } .layered { - width: var(--_csstools-cf-7csnaj5b-8-result); + width: var(--_csstools-cf-19up9hh-8-result); } diff --git a/plugins/postcss-custom-functions/test/invalid.expect.css b/plugins/postcss-custom-functions/test/invalid.expect.css index 08872556b..fc3cb9a4c 100644 --- a/plugins/postcss-custom-functions/test/invalid.expect.css +++ b/plugins/postcss-custom-functions/test/invalid.expect.css @@ -1,11 +1,11 @@ .missing { - --_csstools-cf-3ft7zk9k-0-result: var(--_csstools-cf-invalid); - width: var(--_csstools-cf-3ft7zk9k-0-result); + --_csstools-cf-1lkn6xo-0-result: var(--_csstools-cf-invalid); + width: var(--_csstools-cf-1lkn6xo-0-result); } .extra { - --_csstools-cf-3ft7zk9k-2-result: var(--_csstools-cf-invalid); - width: var(--_csstools-cf-3ft7zk9k-2-result); + --_csstools-cf-1lkn6xo-2-result: var(--_csstools-cf-invalid); + width: var(--_csstools-cf-1lkn6xo-2-result); } .unknown { @@ -13,6 +13,6 @@ } .empty-args { - --_csstools-cf-3ft7zk9k-4-result: var(--_csstools-cf-invalid); - width: var(--_csstools-cf-3ft7zk9k-4-result); + --_csstools-cf-1lkn6xo-4-result: var(--_csstools-cf-invalid); + width: var(--_csstools-cf-1lkn6xo-4-result); } diff --git a/plugins/postcss-custom-functions/test/local-keywords.expect.css b/plugins/postcss-custom-functions/test/local-keywords.expect.css index 4ab116ad7..c11d7de7f 100644 --- a/plugins/postcss-custom-functions/test/local-keywords.expect.css +++ b/plugins/postcss-custom-functions/test/local-keywords.expect.css @@ -2,52 +2,52 @@ resolve to the guaranteed-invalid value. */ .unset-local { - --_csstools-cf-2bgb251r-1-local-x: var(--_csstools-cf-invalid); - --_csstools-cf-2bgb251r-0-result: var(--_csstools-cf-2bgb251r-1-local-x, PASS); - width: var(--_csstools-cf-2bgb251r-0-result); + --_csstools-cf-1a6pyhl-1-local-x: var(--_csstools-cf-invalid); + --_csstools-cf-1a6pyhl-0-result: var(--_csstools-cf-1a6pyhl-1-local-x, PASS); + width: var(--_csstools-cf-1a6pyhl-0-result); } .revert-local { - --_csstools-cf-2bgb251r-3-local-x: var(--_csstools-cf-invalid); - --_csstools-cf-2bgb251r-2-result: var(--_csstools-cf-2bgb251r-3-local-x, PASS); - width: var(--_csstools-cf-2bgb251r-2-result); + --_csstools-cf-1a6pyhl-3-local-x: var(--_csstools-cf-invalid); + --_csstools-cf-1a6pyhl-2-result: var(--_csstools-cf-1a6pyhl-3-local-x, PASS); + width: var(--_csstools-cf-1a6pyhl-2-result); } .revert-layer-local { - --_csstools-cf-2bgb251r-5-local-x: var(--_csstools-cf-invalid); - --_csstools-cf-2bgb251r-4-result: var(--_csstools-cf-2bgb251r-5-local-x, PASS); - width: var(--_csstools-cf-2bgb251r-4-result); + --_csstools-cf-1a6pyhl-5-local-x: var(--_csstools-cf-invalid); + --_csstools-cf-1a6pyhl-4-result: var(--_csstools-cf-1a6pyhl-5-local-x, PASS); + width: var(--_csstools-cf-1a6pyhl-4-result); } .revert-rule-local { - --_csstools-cf-2bgb251r-7-local-x: var(--_csstools-cf-invalid); - --_csstools-cf-2bgb251r-6-result: var(--_csstools-cf-2bgb251r-7-local-x, PASS); - width: var(--_csstools-cf-2bgb251r-6-result); + --_csstools-cf-1a6pyhl-7-local-x: var(--_csstools-cf-invalid); + --_csstools-cf-1a6pyhl-6-result: var(--_csstools-cf-1a6pyhl-7-local-x, PASS); + width: var(--_csstools-cf-1a6pyhl-6-result); } .unset-fallback { - --_csstools-cf-2bgb251r-9-local-x: var(--unknown,var(--_csstools-cf-invalid)); - --_csstools-cf-2bgb251r-8-result: var(--_csstools-cf-2bgb251r-9-local-x, PASS); - width: var(--_csstools-cf-2bgb251r-8-result); + --_csstools-cf-1a6pyhl-9-local-x: var(--unknown,var(--_csstools-cf-invalid)); + --_csstools-cf-1a6pyhl-8-result: var(--_csstools-cf-1a6pyhl-9-local-x, PASS); + width: var(--_csstools-cf-1a6pyhl-8-result); } .unset-parameter { - --_csstools-cf-2bgb251r-b-arg-0: var(--_csstools-cf-2bgb251r-b-raw-0, PARAM); - --_csstools-cf-2bgb251r-b-local-x: var(--_csstools-cf-invalid); - --_csstools-cf-2bgb251r-a-result: var(--_csstools-cf-2bgb251r-b-local-x, PASS); - width: var(--_csstools-cf-2bgb251r-a-result); + --_csstools-cf-1a6pyhl-b-arg-0: var(--_csstools-cf-1a6pyhl-b-raw-0, PARAM); + --_csstools-cf-1a6pyhl-b-local-x: var(--_csstools-cf-invalid); + --_csstools-cf-1a6pyhl-a-result: var(--_csstools-cf-1a6pyhl-b-local-x, PASS); + width: var(--_csstools-cf-1a6pyhl-a-result); } .inherit-parameter { - --_csstools-cf-2bgb251r-d-arg-0: var(--_csstools-cf-2bgb251r-d-raw-0, PARAM); - --_csstools-cf-2bgb251r-d-local-x: var(--x); - --_csstools-cf-2bgb251r-c-result: var(--_csstools-cf-2bgb251r-d-local-x, PASS); - width: var(--_csstools-cf-2bgb251r-c-result); + --_csstools-cf-1a6pyhl-d-arg-0: var(--_csstools-cf-1a6pyhl-d-raw-0, PARAM); + --_csstools-cf-1a6pyhl-d-local-x: var(--x); + --_csstools-cf-1a6pyhl-c-result: var(--_csstools-cf-1a6pyhl-d-local-x, PASS); + width: var(--_csstools-cf-1a6pyhl-c-result); } .initial-parameter { - --_csstools-cf-2bgb251r-f-arg-0: var(--_csstools-cf-2bgb251r-f-raw-0, PARAM); - --_csstools-cf-2bgb251r-f-local-x: var(--_csstools-cf-2bgb251r-f-arg-0); - --_csstools-cf-2bgb251r-e-result: var(--_csstools-cf-2bgb251r-f-local-x, PASS); - width: var(--_csstools-cf-2bgb251r-e-result); + --_csstools-cf-1a6pyhl-f-arg-0: var(--_csstools-cf-1a6pyhl-f-raw-0, PARAM); + --_csstools-cf-1a6pyhl-f-local-x: var(--_csstools-cf-1a6pyhl-f-arg-0); + --_csstools-cf-1a6pyhl-e-result: var(--_csstools-cf-1a6pyhl-f-local-x, PASS); + width: var(--_csstools-cf-1a6pyhl-e-result); } diff --git a/plugins/postcss-custom-functions/test/locals.expect.css b/plugins/postcss-custom-functions/test/locals.expect.css index 87546bdd9..4e37b69e3 100644 --- a/plugins/postcss-custom-functions/test/locals.expect.css +++ b/plugins/postcss-custom-functions/test/locals.expect.css @@ -1,28 +1,28 @@ .initial-local { - --_csstools-cf-e2576d6c-1-arg-0: 5px; - --_csstools-cf-e2576d6c-1-local-x: 20px; - --_csstools-cf-e2576d6c-1-local-x: var(--_csstools-cf-e2576d6c-1-arg-0); - --_csstools-cf-e2576d6c-0-result: var(--_csstools-cf-e2576d6c-1-local-x); - width: var(--_csstools-cf-e2576d6c-0-result); + --_csstools-cf-p7npk3-1-arg-0: 5px; + --_csstools-cf-p7npk3-1-local-x: 20px; + --_csstools-cf-p7npk3-1-local-x: var(--_csstools-cf-p7npk3-1-arg-0); + --_csstools-cf-p7npk3-0-result: var(--_csstools-cf-p7npk3-1-local-x); + width: var(--_csstools-cf-p7npk3-0-result); } .inherit-local { --x: 20px; - --_csstools-cf-e2576d6c-3-local-x: var(--x); - --_csstools-cf-e2576d6c-2-result: var(--_csstools-cf-e2576d6c-3-local-x); - width: var(--_csstools-cf-e2576d6c-2-result); + --_csstools-cf-p7npk3-3-local-x: var(--x); + --_csstools-cf-p7npk3-2-result: var(--_csstools-cf-p7npk3-3-local-x); + width: var(--_csstools-cf-p7npk3-2-result); } .inherit-outer { --x: 1px; - --_csstools-cf-e2576d6c-5-local-x: 20px; - --_csstools-cf-e2576d6c-7-local-x: var(--_csstools-cf-e2576d6c-5-local-x); - --_csstools-cf-e2576d6c-6-result: var(--_csstools-cf-e2576d6c-7-local-x); - --_csstools-cf-e2576d6c-4-result: var(--_csstools-cf-e2576d6c-6-result); - width: var(--_csstools-cf-e2576d6c-4-result); + --_csstools-cf-p7npk3-5-local-x: 20px; + --_csstools-cf-p7npk3-7-local-x: var(--_csstools-cf-p7npk3-5-local-x); + --_csstools-cf-p7npk3-6-result: var(--_csstools-cf-p7npk3-7-local-x); + --_csstools-cf-p7npk3-4-result: var(--_csstools-cf-p7npk3-6-result); + width: var(--_csstools-cf-p7npk3-4-result); } -@property --_csstools-cf-e2576d6c-1-arg-0 { +@property --_csstools-cf-p7npk3-1-arg-0 { syntax: ""; inherits: false; initial-value: 10px; diff --git a/plugins/postcss-custom-functions/test/nested.expect.css b/plugins/postcss-custom-functions/test/nested.expect.css index 66065cb27..9f4542b5e 100644 --- a/plugins/postcss-custom-functions/test/nested.expect.css +++ b/plugins/postcss-custom-functions/test/nested.expect.css @@ -1,19 +1,19 @@ .scope { --x: FAIL; - --_csstools-cf-ln0emwu0-1-arg-0: PASS; - --_csstools-cf-ln0emwu0-2-result: var(--_csstools-cf-ln0emwu0-1-arg-0); - --_csstools-cf-ln0emwu0-0-result: var(--_csstools-cf-ln0emwu0-2-result); - width: var(--_csstools-cf-ln0emwu0-0-result); + --_csstools-cf-uofdfs-1-arg-0: PASS; + --_csstools-cf-uofdfs-2-result: var(--_csstools-cf-uofdfs-1-arg-0); + --_csstools-cf-uofdfs-0-result: var(--_csstools-cf-uofdfs-2-result); + width: var(--_csstools-cf-uofdfs-0-result); } .scopes { --x: 0; - --_csstools-cf-ln0emwu0-5-local-x: 1; - --_csstools-cf-ln0emwu0-6-result: var(--_csstools-cf-ln0emwu0-5-local-x); - --_csstools-cf-ln0emwu0-4-result: var(--_csstools-cf-ln0emwu0-6-result); - --_csstools-cf-ln0emwu0-9-local-x: 2; - --_csstools-cf-ln0emwu0-a-result: var(--_csstools-cf-ln0emwu0-9-local-x); - --_csstools-cf-ln0emwu0-8-result: var(--_csstools-cf-ln0emwu0-a-result); - --_csstools-cf-ln0emwu0-c-result: var(--x); - width: var(--_csstools-cf-ln0emwu0-4-result) var(--_csstools-cf-ln0emwu0-8-result) var(--_csstools-cf-ln0emwu0-c-result); + --_csstools-cf-uofdfs-5-local-x: 1; + --_csstools-cf-uofdfs-6-result: var(--_csstools-cf-uofdfs-5-local-x); + --_csstools-cf-uofdfs-4-result: var(--_csstools-cf-uofdfs-6-result); + --_csstools-cf-uofdfs-9-local-x: 2; + --_csstools-cf-uofdfs-a-result: var(--_csstools-cf-uofdfs-9-local-x); + --_csstools-cf-uofdfs-8-result: var(--_csstools-cf-uofdfs-a-result); + --_csstools-cf-uofdfs-c-result: var(--x); + width: var(--_csstools-cf-uofdfs-4-result) var(--_csstools-cf-uofdfs-8-result) var(--_csstools-cf-uofdfs-c-result); } diff --git a/plugins/postcss-custom-functions/test/typed.expect.css b/plugins/postcss-custom-functions/test/typed.expect.css index c90527dbd..c58a5c5ca 100644 --- a/plugins/postcss-custom-functions/test/typed.expect.css +++ b/plugins/postcss-custom-functions/test/typed.expect.css @@ -1,54 +1,54 @@ .sized-a { - --_csstools-cf-3ammwpqj-1-arg-0: 20px; - --_csstools-cf-3ammwpqj-0-result: var(--_csstools-cf-3ammwpqj-1-arg-0); - width: var(--_csstools-cf-3ammwpqj-0-result); + --_csstools-cf-15up11z-1-arg-0: 20px; + --_csstools-cf-15up11z-0-result: var(--_csstools-cf-15up11z-1-arg-0); + width: var(--_csstools-cf-15up11z-0-result); } .sized-b { - --_csstools-cf-3ammwpqj-3-arg-0: 10px; - --_csstools-cf-3ammwpqj-2-result: var(--_csstools-cf-3ammwpqj-3-arg-0); - width: var(--_csstools-cf-3ammwpqj-2-result); + --_csstools-cf-15up11z-3-arg-0: 10px; + --_csstools-cf-15up11z-2-result: var(--_csstools-cf-15up11z-3-arg-0); + width: var(--_csstools-cf-15up11z-2-result); } .colorized { - --_csstools-cf-3ammwpqj-5-arg-0: blue; - --_csstools-cf-3ammwpqj-4-result: var(--_csstools-cf-3ammwpqj-5-arg-0); - color: var(--_csstools-cf-3ammwpqj-4-result); + --_csstools-cf-15up11z-5-arg-0: blue; + --_csstools-cf-15up11z-4-result: var(--_csstools-cf-15up11z-5-arg-0); + color: var(--_csstools-cf-15up11z-4-result); } .mixed { - --_csstools-cf-3ammwpqj-7-arg-0: 1px; - --_csstools-cf-3ammwpqj-7-arg-1: 2px; - --_csstools-cf-3ammwpqj-7-arg-2: 3px; - --_csstools-cf-3ammwpqj-6-result: var(--_csstools-cf-3ammwpqj-7-arg-0) var(--_csstools-cf-3ammwpqj-7-arg-1) var(--_csstools-cf-3ammwpqj-7-arg-2); - width: var(--_csstools-cf-3ammwpqj-6-result); + --_csstools-cf-15up11z-7-arg-0: 1px; + --_csstools-cf-15up11z-7-arg-1: 2px; + --_csstools-cf-15up11z-7-arg-2: 3px; + --_csstools-cf-15up11z-6-result: var(--_csstools-cf-15up11z-7-arg-0) var(--_csstools-cf-15up11z-7-arg-1) var(--_csstools-cf-15up11z-7-arg-2); + width: var(--_csstools-cf-15up11z-6-result); } -@property --_csstools-cf-3ammwpqj-1-arg-0 { +@property --_csstools-cf-15up11z-1-arg-0 { syntax: ""; inherits: false; initial-value: 10px; } -@property --_csstools-cf-3ammwpqj-3-arg-0 { +@property --_csstools-cf-15up11z-3-arg-0 { syntax: ""; inherits: false; initial-value: 10px; } -@property --_csstools-cf-3ammwpqj-5-arg-0 { +@property --_csstools-cf-15up11z-5-arg-0 { syntax: ""; inherits: false; initial-value: red; } -@property --_csstools-cf-3ammwpqj-7-arg-1 { +@property --_csstools-cf-15up11z-7-arg-1 { syntax: ""; inherits: false; initial-value: 2px; } -@property --_csstools-cf-3ammwpqj-7-arg-2 { +@property --_csstools-cf-15up11z-7-arg-2 { syntax: ""; inherits: false; initial-value: 3px; diff --git a/plugins/postcss-custom-functions/test/typed.preserve-true.expect.css b/plugins/postcss-custom-functions/test/typed.preserve-true.expect.css index 57c85f6c1..c9bdb75c4 100644 --- a/plugins/postcss-custom-functions/test/typed.preserve-true.expect.css +++ b/plugins/postcss-custom-functions/test/typed.preserve-true.expect.css @@ -3,16 +3,16 @@ } .sized-a { - --_csstools-cf-3ammwpqj-1-arg-0: 20px; - --_csstools-cf-3ammwpqj-0-result: var(--_csstools-cf-3ammwpqj-1-arg-0); - width: var(--_csstools-cf-3ammwpqj-0-result); + --_csstools-cf-15up11z-1-arg-0: 20px; + --_csstools-cf-15up11z-0-result: var(--_csstools-cf-15up11z-1-arg-0); + width: var(--_csstools-cf-15up11z-0-result); width: --sized(20px); } .sized-b { - --_csstools-cf-3ammwpqj-3-arg-0: 10px; - --_csstools-cf-3ammwpqj-2-result: var(--_csstools-cf-3ammwpqj-3-arg-0); - width: var(--_csstools-cf-3ammwpqj-2-result); + --_csstools-cf-15up11z-3-arg-0: 10px; + --_csstools-cf-15up11z-2-result: var(--_csstools-cf-15up11z-3-arg-0); + width: var(--_csstools-cf-15up11z-2-result); width: --sized(); } @@ -21,9 +21,9 @@ } .colorized { - --_csstools-cf-3ammwpqj-5-arg-0: blue; - --_csstools-cf-3ammwpqj-4-result: var(--_csstools-cf-3ammwpqj-5-arg-0); - color: var(--_csstools-cf-3ammwpqj-4-result); + --_csstools-cf-15up11z-5-arg-0: blue; + --_csstools-cf-15up11z-4-result: var(--_csstools-cf-15up11z-5-arg-0); + color: var(--_csstools-cf-15up11z-4-result); color: --colorized(blue); } @@ -32,39 +32,39 @@ } .mixed { - --_csstools-cf-3ammwpqj-7-arg-0: 1px; - --_csstools-cf-3ammwpqj-7-arg-1: 2px; - --_csstools-cf-3ammwpqj-7-arg-2: 3px; - --_csstools-cf-3ammwpqj-6-result: var(--_csstools-cf-3ammwpqj-7-arg-0) var(--_csstools-cf-3ammwpqj-7-arg-1) var(--_csstools-cf-3ammwpqj-7-arg-2); - width: var(--_csstools-cf-3ammwpqj-6-result); + --_csstools-cf-15up11z-7-arg-0: 1px; + --_csstools-cf-15up11z-7-arg-1: 2px; + --_csstools-cf-15up11z-7-arg-2: 3px; + --_csstools-cf-15up11z-6-result: var(--_csstools-cf-15up11z-7-arg-0) var(--_csstools-cf-15up11z-7-arg-1) var(--_csstools-cf-15up11z-7-arg-2); + width: var(--_csstools-cf-15up11z-6-result); width: --mixed(1px); } -@property --_csstools-cf-3ammwpqj-1-arg-0 { +@property --_csstools-cf-15up11z-1-arg-0 { syntax: ""; inherits: false; initial-value: 10px; } -@property --_csstools-cf-3ammwpqj-3-arg-0 { +@property --_csstools-cf-15up11z-3-arg-0 { syntax: ""; inherits: false; initial-value: 10px; } -@property --_csstools-cf-3ammwpqj-5-arg-0 { +@property --_csstools-cf-15up11z-5-arg-0 { syntax: ""; inherits: false; initial-value: red; } -@property --_csstools-cf-3ammwpqj-7-arg-1 { +@property --_csstools-cf-15up11z-7-arg-1 { syntax: ""; inherits: false; initial-value: 2px; } -@property --_csstools-cf-3ammwpqj-7-arg-2 { +@property --_csstools-cf-15up11z-7-arg-2 { syntax: ""; inherits: false; initial-value: 3px; diff --git a/plugins/postcss-custom-functions/test/unprocessed-call-sites.expect.css b/plugins/postcss-custom-functions/test/unprocessed-call-sites.expect.css index c40c1767f..5434f4d3d 100644 --- a/plugins/postcss-custom-functions/test/unprocessed-call-sites.expect.css +++ b/plugins/postcss-custom-functions/test/unprocessed-call-sites.expect.css @@ -7,8 +7,8 @@ } .processed { - --_csstools-cf-2ubgliyf-0-result: 3px; - width: var(--_csstools-cf-2ubgliyf-0-result); + --_csstools-cf-gdqk56-0-result: 3px; + width: var(--_csstools-cf-gdqk56-0-result); } @keyframes kf { diff --git a/plugins/postcss-custom-functions/test/untyped-defaults.expect.css b/plugins/postcss-custom-functions/test/untyped-defaults.expect.css index c3190b4f8..7fa1e3aa6 100644 --- a/plugins/postcss-custom-functions/test/untyped-defaults.expect.css +++ b/plugins/postcss-custom-functions/test/untyped-defaults.expect.css @@ -1,71 +1,71 @@ .untyped-default-missing { - --_csstools-cf-32hl5jbk-1-arg-0: var(--_csstools-cf-32hl5jbk-1-raw-0, PASS); - --_csstools-cf-32hl5jbk-0-result: var(--_csstools-cf-32hl5jbk-1-arg-0); - --actual: var(--_csstools-cf-32hl5jbk-0-result); + --_csstools-cf-1urbt0l-1-arg-0: var(--_csstools-cf-1urbt0l-1-raw-0, PASS); + --_csstools-cf-1urbt0l-0-result: var(--_csstools-cf-1urbt0l-1-arg-0); + --actual: var(--_csstools-cf-1urbt0l-0-result); } .untyped-default-valid { - --_csstools-cf-32hl5jbk-3-raw-0: 5px; - --_csstools-cf-32hl5jbk-3-arg-0: var(--_csstools-cf-32hl5jbk-3-raw-0, PASS); - --_csstools-cf-32hl5jbk-2-result: var(--_csstools-cf-32hl5jbk-3-arg-0); - --actual: var(--_csstools-cf-32hl5jbk-2-result); + --_csstools-cf-1urbt0l-3-raw-0: 5px; + --_csstools-cf-1urbt0l-3-arg-0: var(--_csstools-cf-1urbt0l-3-raw-0, PASS); + --_csstools-cf-1urbt0l-2-result: var(--_csstools-cf-1urbt0l-3-arg-0); + --actual: var(--_csstools-cf-1urbt0l-2-result); } .untyped-default-iacvt { - --_csstools-cf-32hl5jbk-5-raw-0: var(--unknown); - --_csstools-cf-32hl5jbk-5-arg-0: var(--_csstools-cf-32hl5jbk-5-raw-0, PASS); - --_csstools-cf-32hl5jbk-4-result: var(--_csstools-cf-32hl5jbk-5-arg-0); - --actual: var(--_csstools-cf-32hl5jbk-4-result); + --_csstools-cf-1urbt0l-5-raw-0: var(--unknown); + --_csstools-cf-1urbt0l-5-arg-0: var(--_csstools-cf-1urbt0l-5-raw-0, PASS); + --_csstools-cf-1urbt0l-4-result: var(--_csstools-cf-1urbt0l-5-arg-0); + --actual: var(--_csstools-cf-1urbt0l-4-result); } .untyped-var-default { --y: 3px; - --_csstools-cf-32hl5jbk-7-arg-0: var(--_csstools-cf-32hl5jbk-7-raw-0, var(--y)); - --_csstools-cf-32hl5jbk-6-result: var(--_csstools-cf-32hl5jbk-7-arg-0); - --actual: var(--_csstools-cf-32hl5jbk-6-result); + --_csstools-cf-1urbt0l-7-arg-0: var(--_csstools-cf-1urbt0l-7-raw-0, var(--y)); + --_csstools-cf-1urbt0l-6-result: var(--_csstools-cf-1urbt0l-7-arg-0); + --actual: var(--_csstools-cf-1urbt0l-6-result); } .untyped-initial-fallback { - --_csstools-cf-32hl5jbk-9-arg-0: var(--_csstools-cf-32hl5jbk-9-raw-0, PASS); - --_csstools-cf-32hl5jbk-9-local-x: var(--unknown,var(--_csstools-cf-32hl5jbk-9-arg-0)); - --_csstools-cf-32hl5jbk-8-result: var(--_csstools-cf-32hl5jbk-9-local-x); - --actual: var(--_csstools-cf-32hl5jbk-8-result); + --_csstools-cf-1urbt0l-9-arg-0: var(--_csstools-cf-1urbt0l-9-raw-0, PASS); + --_csstools-cf-1urbt0l-9-local-x: var(--unknown,var(--_csstools-cf-1urbt0l-9-arg-0)); + --_csstools-cf-1urbt0l-8-result: var(--_csstools-cf-1urbt0l-9-local-x); + --actual: var(--_csstools-cf-1urbt0l-8-result); } .untyped-initial-local { - --_csstools-cf-32hl5jbk-b-raw-0: PASS; - --_csstools-cf-32hl5jbk-b-arg-0: var(--_csstools-cf-32hl5jbk-b-raw-0, FAIL1); - --_csstools-cf-32hl5jbk-b-local-x: FAIL2; - --_csstools-cf-32hl5jbk-b-local-x: var(--_csstools-cf-32hl5jbk-b-arg-0); - --_csstools-cf-32hl5jbk-a-result: var(--_csstools-cf-32hl5jbk-b-local-x); - --actual: var(--_csstools-cf-32hl5jbk-a-result); + --_csstools-cf-1urbt0l-b-raw-0: PASS; + --_csstools-cf-1urbt0l-b-arg-0: var(--_csstools-cf-1urbt0l-b-raw-0, FAIL1); + --_csstools-cf-1urbt0l-b-local-x: FAIL2; + --_csstools-cf-1urbt0l-b-local-x: var(--_csstools-cf-1urbt0l-b-arg-0); + --_csstools-cf-1urbt0l-a-result: var(--_csstools-cf-1urbt0l-b-local-x); + --actual: var(--_csstools-cf-1urbt0l-a-result); } .default-ref-param { --x: FAIL; --y: FAIL; - --_csstools-cf-32hl5jbk-d-arg-0: 5px; - --_csstools-cf-32hl5jbk-d-arg-1: var(--_csstools-cf-32hl5jbk-d-raw-1, var(--_csstools-cf-32hl5jbk-d-arg-0)); - --_csstools-cf-32hl5jbk-c-result: var(--_csstools-cf-32hl5jbk-d-arg-0) var(--_csstools-cf-32hl5jbk-d-arg-1); - --actual: var(--_csstools-cf-32hl5jbk-c-result); + --_csstools-cf-1urbt0l-d-arg-0: 5px; + --_csstools-cf-1urbt0l-d-arg-1: var(--_csstools-cf-1urbt0l-d-raw-1, var(--_csstools-cf-1urbt0l-d-arg-0)); + --_csstools-cf-1urbt0l-c-result: var(--_csstools-cf-1urbt0l-d-arg-0) var(--_csstools-cf-1urbt0l-d-arg-1); + --actual: var(--_csstools-cf-1urbt0l-c-result); } .default-ref-param-local { --x: FAIL; --y: FAIL; - --_csstools-cf-32hl5jbk-f-arg-0: 5px; - --_csstools-cf-32hl5jbk-f-arg-1: var(--_csstools-cf-32hl5jbk-f-raw-1, var(--_csstools-cf-32hl5jbk-f-arg-0)); - --_csstools-cf-32hl5jbk-f-local-x: 17px; - --_csstools-cf-32hl5jbk-e-result: var(--_csstools-cf-32hl5jbk-f-local-x) var(--_csstools-cf-32hl5jbk-f-arg-1); - --actual: var(--_csstools-cf-32hl5jbk-e-result); + --_csstools-cf-1urbt0l-f-arg-0: 5px; + --_csstools-cf-1urbt0l-f-arg-1: var(--_csstools-cf-1urbt0l-f-raw-1, var(--_csstools-cf-1urbt0l-f-arg-0)); + --_csstools-cf-1urbt0l-f-local-x: 17px; + --_csstools-cf-1urbt0l-e-result: var(--_csstools-cf-1urbt0l-f-local-x) var(--_csstools-cf-1urbt0l-f-arg-1); + --actual: var(--_csstools-cf-1urbt0l-e-result); } .default-inherit { --x: PASS1; - --_csstools-cf-32hl5jbk-h-arg-0: var(--_csstools-cf-32hl5jbk-h-raw-0, var(--x)); - --_csstools-cf-32hl5jbk-g-result: var(--_csstools-cf-32hl5jbk-h-arg-0); - --_csstools-cf-32hl5jbk-j-raw-0: PASS2; - --_csstools-cf-32hl5jbk-j-arg-0: var(--_csstools-cf-32hl5jbk-j-raw-0, var(--x)); - --_csstools-cf-32hl5jbk-i-result: var(--_csstools-cf-32hl5jbk-j-arg-0); - --actual: var(--_csstools-cf-32hl5jbk-g-result) var(--_csstools-cf-32hl5jbk-i-result); + --_csstools-cf-1urbt0l-h-arg-0: var(--_csstools-cf-1urbt0l-h-raw-0, var(--x)); + --_csstools-cf-1urbt0l-g-result: var(--_csstools-cf-1urbt0l-h-arg-0); + --_csstools-cf-1urbt0l-j-raw-0: PASS2; + --_csstools-cf-1urbt0l-j-arg-0: var(--_csstools-cf-1urbt0l-j-raw-0, var(--x)); + --_csstools-cf-1urbt0l-i-result: var(--_csstools-cf-1urbt0l-j-arg-0); + --actual: var(--_csstools-cf-1urbt0l-g-result) var(--_csstools-cf-1urbt0l-i-result); } diff --git a/plugins/postcss-custom-functions/test/untyped-defaults.preserve-true.expect.css b/plugins/postcss-custom-functions/test/untyped-defaults.preserve-true.expect.css index d7099cf42..4d18e6f8c 100644 --- a/plugins/postcss-custom-functions/test/untyped-defaults.preserve-true.expect.css +++ b/plugins/postcss-custom-functions/test/untyped-defaults.preserve-true.expect.css @@ -3,25 +3,25 @@ } .untyped-default-missing { - --_csstools-cf-32hl5jbk-1-arg-0: var(--_csstools-cf-32hl5jbk-1-raw-0, PASS); - --_csstools-cf-32hl5jbk-0-result: var(--_csstools-cf-32hl5jbk-1-arg-0); - --actual: var(--_csstools-cf-32hl5jbk-0-result); + --_csstools-cf-1urbt0l-1-arg-0: var(--_csstools-cf-1urbt0l-1-raw-0, PASS); + --_csstools-cf-1urbt0l-0-result: var(--_csstools-cf-1urbt0l-1-arg-0); + --actual: var(--_csstools-cf-1urbt0l-0-result); --actual: --with-default(); } .untyped-default-valid { - --_csstools-cf-32hl5jbk-3-raw-0: 5px; - --_csstools-cf-32hl5jbk-3-arg-0: var(--_csstools-cf-32hl5jbk-3-raw-0, PASS); - --_csstools-cf-32hl5jbk-2-result: var(--_csstools-cf-32hl5jbk-3-arg-0); - --actual: var(--_csstools-cf-32hl5jbk-2-result); + --_csstools-cf-1urbt0l-3-raw-0: 5px; + --_csstools-cf-1urbt0l-3-arg-0: var(--_csstools-cf-1urbt0l-3-raw-0, PASS); + --_csstools-cf-1urbt0l-2-result: var(--_csstools-cf-1urbt0l-3-arg-0); + --actual: var(--_csstools-cf-1urbt0l-2-result); --actual: --with-default(5px); } .untyped-default-iacvt { - --_csstools-cf-32hl5jbk-5-raw-0: var(--unknown); - --_csstools-cf-32hl5jbk-5-arg-0: var(--_csstools-cf-32hl5jbk-5-raw-0, PASS); - --_csstools-cf-32hl5jbk-4-result: var(--_csstools-cf-32hl5jbk-5-arg-0); - --actual: var(--_csstools-cf-32hl5jbk-4-result); + --_csstools-cf-1urbt0l-5-raw-0: var(--unknown); + --_csstools-cf-1urbt0l-5-arg-0: var(--_csstools-cf-1urbt0l-5-raw-0, PASS); + --_csstools-cf-1urbt0l-4-result: var(--_csstools-cf-1urbt0l-5-arg-0); + --actual: var(--_csstools-cf-1urbt0l-4-result); --actual: --with-default(var(--unknown)); } @@ -31,9 +31,9 @@ .untyped-var-default { --y: 3px; - --_csstools-cf-32hl5jbk-7-arg-0: var(--_csstools-cf-32hl5jbk-7-raw-0, var(--y)); - --_csstools-cf-32hl5jbk-6-result: var(--_csstools-cf-32hl5jbk-7-arg-0); - --actual: var(--_csstools-cf-32hl5jbk-6-result); + --_csstools-cf-1urbt0l-7-arg-0: var(--_csstools-cf-1urbt0l-7-raw-0, var(--y)); + --_csstools-cf-1urbt0l-6-result: var(--_csstools-cf-1urbt0l-7-arg-0); + --actual: var(--_csstools-cf-1urbt0l-6-result); --actual: --with-var-default(); } @@ -43,10 +43,10 @@ } .untyped-initial-fallback { - --_csstools-cf-32hl5jbk-9-arg-0: var(--_csstools-cf-32hl5jbk-9-raw-0, PASS); - --_csstools-cf-32hl5jbk-9-local-x: var(--unknown,var(--_csstools-cf-32hl5jbk-9-arg-0)); - --_csstools-cf-32hl5jbk-8-result: var(--_csstools-cf-32hl5jbk-9-local-x); - --actual: var(--_csstools-cf-32hl5jbk-8-result); + --_csstools-cf-1urbt0l-9-arg-0: var(--_csstools-cf-1urbt0l-9-raw-0, PASS); + --_csstools-cf-1urbt0l-9-local-x: var(--unknown,var(--_csstools-cf-1urbt0l-9-arg-0)); + --_csstools-cf-1urbt0l-8-result: var(--_csstools-cf-1urbt0l-9-local-x); + --actual: var(--_csstools-cf-1urbt0l-8-result); --actual: --with-initial-fallback(); } @@ -57,12 +57,12 @@ } .untyped-initial-local { - --_csstools-cf-32hl5jbk-b-raw-0: PASS; - --_csstools-cf-32hl5jbk-b-arg-0: var(--_csstools-cf-32hl5jbk-b-raw-0, FAIL1); - --_csstools-cf-32hl5jbk-b-local-x: FAIL2; - --_csstools-cf-32hl5jbk-b-local-x: var(--_csstools-cf-32hl5jbk-b-arg-0); - --_csstools-cf-32hl5jbk-a-result: var(--_csstools-cf-32hl5jbk-b-local-x); - --actual: var(--_csstools-cf-32hl5jbk-a-result); + --_csstools-cf-1urbt0l-b-raw-0: PASS; + --_csstools-cf-1urbt0l-b-arg-0: var(--_csstools-cf-1urbt0l-b-raw-0, FAIL1); + --_csstools-cf-1urbt0l-b-local-x: FAIL2; + --_csstools-cf-1urbt0l-b-local-x: var(--_csstools-cf-1urbt0l-b-arg-0); + --_csstools-cf-1urbt0l-a-result: var(--_csstools-cf-1urbt0l-b-local-x); + --actual: var(--_csstools-cf-1urbt0l-a-result); --actual: --with-initial-local(PASS); } @@ -73,10 +73,10 @@ .default-ref-param { --x: FAIL; --y: FAIL; - --_csstools-cf-32hl5jbk-d-arg-0: 5px; - --_csstools-cf-32hl5jbk-d-arg-1: var(--_csstools-cf-32hl5jbk-d-raw-1, var(--_csstools-cf-32hl5jbk-d-arg-0)); - --_csstools-cf-32hl5jbk-c-result: var(--_csstools-cf-32hl5jbk-d-arg-0) var(--_csstools-cf-32hl5jbk-d-arg-1); - --actual: var(--_csstools-cf-32hl5jbk-c-result); + --_csstools-cf-1urbt0l-d-arg-0: 5px; + --_csstools-cf-1urbt0l-d-arg-1: var(--_csstools-cf-1urbt0l-d-raw-1, var(--_csstools-cf-1urbt0l-d-arg-0)); + --_csstools-cf-1urbt0l-c-result: var(--_csstools-cf-1urbt0l-d-arg-0) var(--_csstools-cf-1urbt0l-d-arg-1); + --actual: var(--_csstools-cf-1urbt0l-c-result); --actual: --default-ref-param(5px); } @@ -88,11 +88,11 @@ .default-ref-param-local { --x: FAIL; --y: FAIL; - --_csstools-cf-32hl5jbk-f-arg-0: 5px; - --_csstools-cf-32hl5jbk-f-arg-1: var(--_csstools-cf-32hl5jbk-f-raw-1, var(--_csstools-cf-32hl5jbk-f-arg-0)); - --_csstools-cf-32hl5jbk-f-local-x: 17px; - --_csstools-cf-32hl5jbk-e-result: var(--_csstools-cf-32hl5jbk-f-local-x) var(--_csstools-cf-32hl5jbk-f-arg-1); - --actual: var(--_csstools-cf-32hl5jbk-e-result); + --_csstools-cf-1urbt0l-f-arg-0: 5px; + --_csstools-cf-1urbt0l-f-arg-1: var(--_csstools-cf-1urbt0l-f-raw-1, var(--_csstools-cf-1urbt0l-f-arg-0)); + --_csstools-cf-1urbt0l-f-local-x: 17px; + --_csstools-cf-1urbt0l-e-result: var(--_csstools-cf-1urbt0l-f-local-x) var(--_csstools-cf-1urbt0l-f-arg-1); + --actual: var(--_csstools-cf-1urbt0l-e-result); --actual: --default-ref-param-local(5px); } @@ -102,11 +102,11 @@ .default-inherit { --x: PASS1; - --_csstools-cf-32hl5jbk-h-arg-0: var(--_csstools-cf-32hl5jbk-h-raw-0, var(--x)); - --_csstools-cf-32hl5jbk-g-result: var(--_csstools-cf-32hl5jbk-h-arg-0); - --_csstools-cf-32hl5jbk-j-raw-0: PASS2; - --_csstools-cf-32hl5jbk-j-arg-0: var(--_csstools-cf-32hl5jbk-j-raw-0, var(--x)); - --_csstools-cf-32hl5jbk-i-result: var(--_csstools-cf-32hl5jbk-j-arg-0); - --actual: var(--_csstools-cf-32hl5jbk-g-result) var(--_csstools-cf-32hl5jbk-i-result); + --_csstools-cf-1urbt0l-h-arg-0: var(--_csstools-cf-1urbt0l-h-raw-0, var(--x)); + --_csstools-cf-1urbt0l-g-result: var(--_csstools-cf-1urbt0l-h-arg-0); + --_csstools-cf-1urbt0l-j-raw-0: PASS2; + --_csstools-cf-1urbt0l-j-arg-0: var(--_csstools-cf-1urbt0l-j-raw-0, var(--x)); + --_csstools-cf-1urbt0l-i-result: var(--_csstools-cf-1urbt0l-j-arg-0); + --actual: var(--_csstools-cf-1urbt0l-g-result) var(--_csstools-cf-1urbt0l-i-result); --actual: --default-inherit() --default-inherit(PASS2); } diff --git a/plugins/postcss-mixins/README.md b/plugins/postcss-mixins/README.md index c27fe04ec..a30a2a233 100644 --- a/plugins/postcss-mixins/README.md +++ b/plugins/postcss-mixins/README.md @@ -53,9 +53,9 @@ Unsupported: } .bar { - --_csstools-p-1agle9gi-0--arg-0: 200; - --_csstools-p-1agle9gi-1--baz: var(--_csstools-p-1agle9gi-0--arg-0); - color: rgb(var(--_csstools-p-1agle9gi-1--baz) 127 0); + --_csstools-p-1gice1e-0--arg-0: 200; + --_csstools-p-1gice1e-1--baz: var(--_csstools-p-1gice1e-0--arg-0); + color: rgb(var(--_csstools-p-1gice1e-1--baz) 127 0); } .c { @@ -151,9 +151,9 @@ postcssMixins({ preserve: true }) } .bar { - --_csstools-p-1agle9gi-0--arg-0: 200; - --_csstools-p-1agle9gi-1--baz: var(--_csstools-p-1agle9gi-0--arg-0); - color: rgb(var(--_csstools-p-1agle9gi-1--baz) 127 0); + --_csstools-p-1gice1e-0--arg-0: 200; + --_csstools-p-1gice1e-1--baz: var(--_csstools-p-1gice1e-0--arg-0); + color: rgb(var(--_csstools-p-1gice1e-1--baz) 127 0); @apply --bar(200); } diff --git a/plugins/postcss-mixins/test/arguments.expect.css b/plugins/postcss-mixins/test/arguments.expect.css index 977007afa..510291deb 100644 --- a/plugins/postcss-mixins/test/arguments.expect.css +++ b/plugins/postcss-mixins/test/arguments.expect.css @@ -1,39 +1,39 @@ .a { - --_csstools-p-9bomswmf-0--arg-0: green; - --_csstools-p-9bomswmf-1--color: var(--_csstools-p-9bomswmf-0--arg-0); - color: var(--_csstools-p-9bomswmf-1--color); + --_csstools-p-165tpc7-0--arg-0: green; + --_csstools-p-165tpc7-1--color: var(--_csstools-p-165tpc7-0--arg-0); + color: var(--_csstools-p-165tpc7-1--color); } .b { - --_csstools-p-9bomswmf-2--color: blue; - --_csstools-p-9bomswmf-2--background: red; - color: var(--_csstools-p-9bomswmf-2--color); - background-color: var(--_csstools-p-9bomswmf-2--background); + --_csstools-p-165tpc7-2--color: blue; + --_csstools-p-165tpc7-2--background: red; + color: var(--_csstools-p-165tpc7-2--color); + background-color: var(--_csstools-p-165tpc7-2--background); } .c { - --_csstools-p-9bomswmf-3--arg-1: red; - --_csstools-p-9bomswmf-4--color: var(--_csstools-p-9bomswmf-3--arg-1); - --_csstools-p-9bomswmf-4--background: red; - color: var(--_csstools-p-9bomswmf-4--color); - background-color: var(--_csstools-p-9bomswmf-4--background); + --_csstools-p-165tpc7-3--arg-1: red; + --_csstools-p-165tpc7-4--color: var(--_csstools-p-165tpc7-3--arg-1); + --_csstools-p-165tpc7-4--background: red; + color: var(--_csstools-p-165tpc7-4--color); + background-color: var(--_csstools-p-165tpc7-4--background); } .d { - --_csstools-p-9bomswmf-5--color: initial; - outline-color: var(--_csstools-p-9bomswmf-5--color, navy); + --_csstools-p-165tpc7-5--color: initial; + outline-color: var(--_csstools-p-165tpc7-5--color, navy); } .e { - --_csstools-p-9bomswmf-6--arg-2: green; - --_csstools-p-9bomswmf-7--color: var(--_csstools-p-9bomswmf-6--arg-2); - outline-color: var(--_csstools-p-9bomswmf-7--color, navy); + --_csstools-p-165tpc7-6--arg-2: green; + --_csstools-p-165tpc7-7--color: var(--_csstools-p-165tpc7-6--arg-2); + outline-color: var(--_csstools-p-165tpc7-7--color, navy); } .f { - --_csstools-p-9bomswmf-8--arg-3: color, background; - --_csstools-p-9bomswmf-9--list: var(--_csstools-p-9bomswmf-8--arg-3); - transition-property: var(--_csstools-p-9bomswmf-9--list); + --_csstools-p-165tpc7-8--arg-3: color, background; + --_csstools-p-165tpc7-9--list: var(--_csstools-p-165tpc7-8--arg-3); + transition-property: var(--_csstools-p-165tpc7-9--list); } .g { diff --git a/plugins/postcss-mixins/test/arguments.preserve-true.expect.css b/plugins/postcss-mixins/test/arguments.preserve-true.expect.css index ded2a75a5..012391cd8 100644 --- a/plugins/postcss-mixins/test/arguments.preserve-true.expect.css +++ b/plugins/postcss-mixins/test/arguments.preserve-true.expect.css @@ -3,9 +3,9 @@ } .a { - --_csstools-p-9bomswmf-0--arg-0: green; - --_csstools-p-9bomswmf-1--color: var(--_csstools-p-9bomswmf-0--arg-0); - color: var(--_csstools-p-9bomswmf-1--color); + --_csstools-p-165tpc7-0--arg-0: green; + --_csstools-p-165tpc7-1--color: var(--_csstools-p-165tpc7-0--arg-0); + color: var(--_csstools-p-165tpc7-1--color); @apply --basic(green); } @@ -15,19 +15,19 @@ } .b { - --_csstools-p-9bomswmf-2--color: blue; - --_csstools-p-9bomswmf-2--background: red; - color: var(--_csstools-p-9bomswmf-2--color); - background-color: var(--_csstools-p-9bomswmf-2--background); + --_csstools-p-165tpc7-2--color: blue; + --_csstools-p-165tpc7-2--background: red; + color: var(--_csstools-p-165tpc7-2--color); + background-color: var(--_csstools-p-165tpc7-2--background); @apply --defaults; } .c { - --_csstools-p-9bomswmf-3--arg-1: red; - --_csstools-p-9bomswmf-4--color: var(--_csstools-p-9bomswmf-3--arg-1); - --_csstools-p-9bomswmf-4--background: red; - color: var(--_csstools-p-9bomswmf-4--color); - background-color: var(--_csstools-p-9bomswmf-4--background); + --_csstools-p-165tpc7-3--arg-1: red; + --_csstools-p-165tpc7-4--color: var(--_csstools-p-165tpc7-3--arg-1); + --_csstools-p-165tpc7-4--background: red; + color: var(--_csstools-p-165tpc7-4--color); + background-color: var(--_csstools-p-165tpc7-4--background); @apply --defaults(red); } @@ -36,15 +36,15 @@ } .d { - --_csstools-p-9bomswmf-5--color: initial; - outline-color: var(--_csstools-p-9bomswmf-5--color, navy); + --_csstools-p-165tpc7-5--color: initial; + outline-color: var(--_csstools-p-165tpc7-5--color, navy); @apply --fallback; } .e { - --_csstools-p-9bomswmf-6--arg-2: green; - --_csstools-p-9bomswmf-7--color: var(--_csstools-p-9bomswmf-6--arg-2); - outline-color: var(--_csstools-p-9bomswmf-7--color, navy); + --_csstools-p-165tpc7-6--arg-2: green; + --_csstools-p-165tpc7-7--color: var(--_csstools-p-165tpc7-6--arg-2); + outline-color: var(--_csstools-p-165tpc7-7--color, navy); @apply --fallback(green); } @@ -53,9 +53,9 @@ } .f { - --_csstools-p-9bomswmf-8--arg-3: color, background; - --_csstools-p-9bomswmf-9--list: var(--_csstools-p-9bomswmf-8--arg-3); - transition-property: var(--_csstools-p-9bomswmf-9--list); + --_csstools-p-165tpc7-8--arg-3: color, background; + --_csstools-p-165tpc7-9--list: var(--_csstools-p-165tpc7-8--arg-3); + transition-property: var(--_csstools-p-165tpc7-9--list); @apply --braces({color, background}); } diff --git a/plugins/postcss-mixins/test/contents.expect.css b/plugins/postcss-mixins/test/contents.expect.css index 4853b8400..5e42d2ef5 100644 --- a/plugins/postcss-mixins/test/contents.expect.css +++ b/plugins/postcss-mixins/test/contents.expect.css @@ -34,8 +34,8 @@ } .i { - --_csstools-p-8akl2q02-0--arg-0: green; - --_csstools-p-8akl2q02-1--color: var(--_csstools-p-8akl2q02-0--arg-0); - color: var(--_csstools-p-8akl2q02-1--color); + --_csstools-p-1i0jh25-0--arg-0: green; + --_csstools-p-1i0jh25-1--color: var(--_csstools-p-1i0jh25-0--arg-0); + color: var(--_csstools-p-1i0jh25-1--color); background-color: var(--color) } diff --git a/plugins/postcss-mixins/test/contents.preserve-true.expect.css b/plugins/postcss-mixins/test/contents.preserve-true.expect.css index 25ff22ec2..d9dc5645c 100644 --- a/plugins/postcss-mixins/test/contents.preserve-true.expect.css +++ b/plugins/postcss-mixins/test/contents.preserve-true.expect.css @@ -76,9 +76,9 @@ } .i { - --_csstools-p-8akl2q02-0--arg-0: green; - --_csstools-p-8akl2q02-1--color: var(--_csstools-p-8akl2q02-0--arg-0); - color: var(--_csstools-p-8akl2q02-1--color); + --_csstools-p-1i0jh25-0--arg-0: green; + --_csstools-p-1i0jh25-1--color: var(--_csstools-p-1i0jh25-0--arg-0); + color: var(--_csstools-p-1i0jh25-1--color); background-color: var(--color); @apply --args-and-contents(green) { background-color: var(--color); diff --git a/plugins/postcss-mixins/test/examples/example.expect.css b/plugins/postcss-mixins/test/examples/example.expect.css index 384580e72..be1ce98b6 100644 --- a/plugins/postcss-mixins/test/examples/example.expect.css +++ b/plugins/postcss-mixins/test/examples/example.expect.css @@ -3,9 +3,9 @@ } .bar { - --_csstools-p-1agle9gi-0--arg-0: 200; - --_csstools-p-1agle9gi-1--baz: var(--_csstools-p-1agle9gi-0--arg-0); - color: rgb(var(--_csstools-p-1agle9gi-1--baz) 127 0); + --_csstools-p-1gice1e-0--arg-0: 200; + --_csstools-p-1gice1e-1--baz: var(--_csstools-p-1gice1e-0--arg-0); + color: rgb(var(--_csstools-p-1gice1e-1--baz) 127 0); } .c { diff --git a/plugins/postcss-mixins/test/examples/example.preserve-true.expect.css b/plugins/postcss-mixins/test/examples/example.preserve-true.expect.css index fdbd6e847..79a9e5908 100644 --- a/plugins/postcss-mixins/test/examples/example.preserve-true.expect.css +++ b/plugins/postcss-mixins/test/examples/example.preserve-true.expect.css @@ -12,9 +12,9 @@ } .bar { - --_csstools-p-1agle9gi-0--arg-0: 200; - --_csstools-p-1agle9gi-1--baz: var(--_csstools-p-1agle9gi-0--arg-0); - color: rgb(var(--_csstools-p-1agle9gi-1--baz) 127 0); + --_csstools-p-1gice1e-0--arg-0: 200; + --_csstools-p-1gice1e-1--baz: var(--_csstools-p-1gice1e-0--arg-0); + color: rgb(var(--_csstools-p-1gice1e-1--baz) 127 0); @apply --bar(200); } diff --git a/plugins/postcss-mixins/test/nested-mixins.expect.css b/plugins/postcss-mixins/test/nested-mixins.expect.css index 3dc2a75cc..6c662c96e 100644 --- a/plugins/postcss-mixins/test/nested-mixins.expect.css +++ b/plugins/postcss-mixins/test/nested-mixins.expect.css @@ -4,20 +4,20 @@ } .b { - --_csstools-p-2ljfeuxq-0--arg-0: red; - --_csstools-p-2ljfeuxq-1--outer-color: var(--_csstools-p-2ljfeuxq-0--arg-0); - --_csstools-p-2ljfeuxq-2--arg-1: var(--_csstools-p-2ljfeuxq-1--outer-color); - --_csstools-p-2ljfeuxq-3--inner-color: var(--_csstools-p-2ljfeuxq-2--arg-1); - border-color: var(--_csstools-p-2ljfeuxq-3--inner-color); + --_csstools-p-1rmdrz7-0--arg-0: red; + --_csstools-p-1rmdrz7-1--outer-color: var(--_csstools-p-1rmdrz7-0--arg-0); + --_csstools-p-1rmdrz7-2--arg-1: var(--_csstools-p-1rmdrz7-1--outer-color); + --_csstools-p-1rmdrz7-3--inner-color: var(--_csstools-p-1rmdrz7-2--arg-1); + border-color: var(--_csstools-p-1rmdrz7-3--inner-color); } .c { - --_csstools-p-2ljfeuxq-4--arg-2: red; - --_csstools-p-2ljfeuxq-5--color: var(--_csstools-p-2ljfeuxq-4--arg-2); - --_csstools-p-2ljfeuxq-6--arg-3: blue; - --_csstools-p-2ljfeuxq-7--color: var(--_csstools-p-2ljfeuxq-6--arg-3); - border-color: var(--_csstools-p-2ljfeuxq-7--color); - color: var(--_csstools-p-2ljfeuxq-5--color); + --_csstools-p-1rmdrz7-4--arg-2: red; + --_csstools-p-1rmdrz7-5--color: var(--_csstools-p-1rmdrz7-4--arg-2); + --_csstools-p-1rmdrz7-6--arg-3: blue; + --_csstools-p-1rmdrz7-7--color: var(--_csstools-p-1rmdrz7-6--arg-3); + border-color: var(--_csstools-p-1rmdrz7-7--color); + color: var(--_csstools-p-1rmdrz7-5--color); } .d { diff --git a/plugins/postcss-mixins/test/nested-mixins.preserve-true.expect.css b/plugins/postcss-mixins/test/nested-mixins.preserve-true.expect.css index 6d8621a98..f417dceb0 100644 --- a/plugins/postcss-mixins/test/nested-mixins.preserve-true.expect.css +++ b/plugins/postcss-mixins/test/nested-mixins.preserve-true.expect.css @@ -22,11 +22,11 @@ } .b { - --_csstools-p-2ljfeuxq-0--arg-0: red; - --_csstools-p-2ljfeuxq-1--outer-color: var(--_csstools-p-2ljfeuxq-0--arg-0); - --_csstools-p-2ljfeuxq-2--arg-1: var(--_csstools-p-2ljfeuxq-1--outer-color); - --_csstools-p-2ljfeuxq-3--inner-color: var(--_csstools-p-2ljfeuxq-2--arg-1); - border-color: var(--_csstools-p-2ljfeuxq-3--inner-color); + --_csstools-p-1rmdrz7-0--arg-0: red; + --_csstools-p-1rmdrz7-1--outer-color: var(--_csstools-p-1rmdrz7-0--arg-0); + --_csstools-p-1rmdrz7-2--arg-1: var(--_csstools-p-1rmdrz7-1--outer-color); + --_csstools-p-1rmdrz7-3--inner-color: var(--_csstools-p-1rmdrz7-2--arg-1); + border-color: var(--_csstools-p-1rmdrz7-3--inner-color); @apply --outer-args(red); } @@ -40,12 +40,12 @@ } .c { - --_csstools-p-2ljfeuxq-4--arg-2: red; - --_csstools-p-2ljfeuxq-5--color: var(--_csstools-p-2ljfeuxq-4--arg-2); - --_csstools-p-2ljfeuxq-6--arg-3: blue; - --_csstools-p-2ljfeuxq-7--color: var(--_csstools-p-2ljfeuxq-6--arg-3); - border-color: var(--_csstools-p-2ljfeuxq-7--color); - color: var(--_csstools-p-2ljfeuxq-5--color); + --_csstools-p-1rmdrz7-4--arg-2: red; + --_csstools-p-1rmdrz7-5--color: var(--_csstools-p-1rmdrz7-4--arg-2); + --_csstools-p-1rmdrz7-6--arg-3: blue; + --_csstools-p-1rmdrz7-7--color: var(--_csstools-p-1rmdrz7-6--arg-3); + border-color: var(--_csstools-p-1rmdrz7-7--color); + color: var(--_csstools-p-1rmdrz7-5--color); @apply --shadow-outer(red); } diff --git a/plugins/postcss-mixins/test/nesting.expect.css b/plugins/postcss-mixins/test/nesting.expect.css index 7a6a640e8..99242775e 100644 --- a/plugins/postcss-mixins/test/nesting.expect.css +++ b/plugins/postcss-mixins/test/nesting.expect.css @@ -13,10 +13,10 @@ } .b { - --_csstools-p-7fww6zpl-0--arg-0: red; - --_csstools-p-7fww6zpl-1--color: var(--_csstools-p-7fww6zpl-0--arg-0); + --_csstools-p-1sa7v3t-0--arg-0: red; + --_csstools-p-1sa7v3t-1--color: var(--_csstools-p-1sa7v3t-0--arg-0); & { - color: var(--_csstools-p-7fww6zpl-1--color); + color: var(--_csstools-p-1sa7v3t-1--color); } } diff --git a/plugins/postcss-mixins/test/nesting.preserve-true.expect.css b/plugins/postcss-mixins/test/nesting.preserve-true.expect.css index dd5a21adf..5b0c5566b 100644 --- a/plugins/postcss-mixins/test/nesting.preserve-true.expect.css +++ b/plugins/postcss-mixins/test/nesting.preserve-true.expect.css @@ -28,10 +28,10 @@ } .b { - --_csstools-p-7fww6zpl-0--arg-0: red; - --_csstools-p-7fww6zpl-1--color: var(--_csstools-p-7fww6zpl-0--arg-0); + --_csstools-p-1sa7v3t-0--arg-0: red; + --_csstools-p-1sa7v3t-1--color: var(--_csstools-p-1sa7v3t-0--arg-0); & { - color: var(--_csstools-p-7fww6zpl-1--color); + color: var(--_csstools-p-1sa7v3t-1--color); } @apply --author-nesting-with-args(red); } diff --git a/plugins/postcss-mixins/test/private.expect.css b/plugins/postcss-mixins/test/private.expect.css index 144038043..0f1abefbc 100644 --- a/plugins/postcss-mixins/test/private.expect.css +++ b/plugins/postcss-mixins/test/private.expect.css @@ -1,11 +1,11 @@ .a { - --_csstools-p-45fs09jl-0--shadow: 2px 2px black; - box-shadow: var(--_csstools-p-45fs09jl-0--shadow); + --_csstools-p-pjvzd8-0--shadow: 2px 2px black; + box-shadow: var(--_csstools-p-pjvzd8-0--shadow); } .b { - --_csstools-p-45fs09jl-1--arg-0: red; - --_csstools-p-45fs09jl-2--color: var(--_csstools-p-45fs09jl-1--arg-0); - --_csstools-p-45fs09jl-2--local: var(--_csstools-p-45fs09jl-2--color); - color: var(--_csstools-p-45fs09jl-2--local); + --_csstools-p-pjvzd8-1--arg-0: red; + --_csstools-p-pjvzd8-2--color: var(--_csstools-p-pjvzd8-1--arg-0); + --_csstools-p-pjvzd8-2--local: var(--_csstools-p-pjvzd8-2--color); + color: var(--_csstools-p-pjvzd8-2--local); } diff --git a/plugins/postcss-mixins/test/private.preserve-true.expect.css b/plugins/postcss-mixins/test/private.preserve-true.expect.css index 1aa56fb65..fc8467667 100644 --- a/plugins/postcss-mixins/test/private.preserve-true.expect.css +++ b/plugins/postcss-mixins/test/private.preserve-true.expect.css @@ -7,8 +7,8 @@ } .a { - --_csstools-p-45fs09jl-0--shadow: 2px 2px black; - box-shadow: var(--_csstools-p-45fs09jl-0--shadow); + --_csstools-p-pjvzd8-0--shadow: 2px 2px black; + box-shadow: var(--_csstools-p-pjvzd8-0--shadow); @apply --with-private; } @@ -21,9 +21,9 @@ } .b { - --_csstools-p-45fs09jl-1--arg-0: red; - --_csstools-p-45fs09jl-2--color: var(--_csstools-p-45fs09jl-1--arg-0); - --_csstools-p-45fs09jl-2--local: var(--_csstools-p-45fs09jl-2--color); - color: var(--_csstools-p-45fs09jl-2--local); + --_csstools-p-pjvzd8-1--arg-0: red; + --_csstools-p-pjvzd8-2--color: var(--_csstools-p-pjvzd8-1--arg-0); + --_csstools-p-pjvzd8-2--local: var(--_csstools-p-pjvzd8-2--color); + color: var(--_csstools-p-pjvzd8-2--local); @apply --args-and-private(red); } diff --git a/plugins/postcss-mixins/test/spaces.expect.css b/plugins/postcss-mixins/test/spaces.expect.css index 86da1aa52..f636189cf 100644 --- a/plugins/postcss-mixins/test/spaces.expect.css +++ b/plugins/postcss-mixins/test/spaces.expect.css @@ -1,106 +1,106 @@ .space-after-open { - --_csstools-p-d994g2bk-0--arg-0: green; - --_csstools-p-d994g2bk-0--arg-1: blue; - --_csstools-p-d994g2bk-1--color: var(--_csstools-p-d994g2bk-0--arg-0); - --_csstools-p-d994g2bk-1--background: var(--_csstools-p-d994g2bk-0--arg-1); - color: var(--_csstools-p-d994g2bk-1--color); - background-color: var(--_csstools-p-d994g2bk-1--background); + --_csstools-p-1kp0udk-0--arg-0: green; + --_csstools-p-1kp0udk-0--arg-1: blue; + --_csstools-p-1kp0udk-1--color: var(--_csstools-p-1kp0udk-0--arg-0); + --_csstools-p-1kp0udk-1--background: var(--_csstools-p-1kp0udk-0--arg-1); + color: var(--_csstools-p-1kp0udk-1--color); + background-color: var(--_csstools-p-1kp0udk-1--background); } .space-before-close { - --_csstools-p-d994g2bk-2--arg-2: green; - --_csstools-p-d994g2bk-2--arg-3: blue; - --_csstools-p-d994g2bk-3--color: var(--_csstools-p-d994g2bk-2--arg-2); - --_csstools-p-d994g2bk-3--background: var(--_csstools-p-d994g2bk-2--arg-3); - color: var(--_csstools-p-d994g2bk-3--color); - background-color: var(--_csstools-p-d994g2bk-3--background); + --_csstools-p-1kp0udk-2--arg-2: green; + --_csstools-p-1kp0udk-2--arg-3: blue; + --_csstools-p-1kp0udk-3--color: var(--_csstools-p-1kp0udk-2--arg-2); + --_csstools-p-1kp0udk-3--background: var(--_csstools-p-1kp0udk-2--arg-3); + color: var(--_csstools-p-1kp0udk-3--color); + background-color: var(--_csstools-p-1kp0udk-3--background); } .space-around-both { - --_csstools-p-d994g2bk-4--arg-4: green; - --_csstools-p-d994g2bk-4--arg-5: blue; - --_csstools-p-d994g2bk-5--color: var(--_csstools-p-d994g2bk-4--arg-4); - --_csstools-p-d994g2bk-5--background: var(--_csstools-p-d994g2bk-4--arg-5); - color: var(--_csstools-p-d994g2bk-5--color); - background-color: var(--_csstools-p-d994g2bk-5--background); + --_csstools-p-1kp0udk-4--arg-4: green; + --_csstools-p-1kp0udk-4--arg-5: blue; + --_csstools-p-1kp0udk-5--color: var(--_csstools-p-1kp0udk-4--arg-4); + --_csstools-p-1kp0udk-5--background: var(--_csstools-p-1kp0udk-4--arg-5); + color: var(--_csstools-p-1kp0udk-5--color); + background-color: var(--_csstools-p-1kp0udk-5--background); } .tabs-and-newlines { - --_csstools-p-d994g2bk-6--arg-6: green; - --_csstools-p-d994g2bk-6--arg-7: blue; - --_csstools-p-d994g2bk-7--color: var(--_csstools-p-d994g2bk-6--arg-6); - --_csstools-p-d994g2bk-7--background: var(--_csstools-p-d994g2bk-6--arg-7); - color: var(--_csstools-p-d994g2bk-7--color); - background-color: var(--_csstools-p-d994g2bk-7--background); + --_csstools-p-1kp0udk-6--arg-6: green; + --_csstools-p-1kp0udk-6--arg-7: blue; + --_csstools-p-1kp0udk-7--color: var(--_csstools-p-1kp0udk-6--arg-6); + --_csstools-p-1kp0udk-7--background: var(--_csstools-p-1kp0udk-6--arg-7); + color: var(--_csstools-p-1kp0udk-7--color); + background-color: var(--_csstools-p-1kp0udk-7--background); } .space-around-comma { - --_csstools-p-d994g2bk-8--arg-8: green; - --_csstools-p-d994g2bk-8--arg-9: blue; - --_csstools-p-d994g2bk-9--color: var(--_csstools-p-d994g2bk-8--arg-8); - --_csstools-p-d994g2bk-9--background: var(--_csstools-p-d994g2bk-8--arg-9); - color: var(--_csstools-p-d994g2bk-9--color); - background-color: var(--_csstools-p-d994g2bk-9--background); + --_csstools-p-1kp0udk-8--arg-8: green; + --_csstools-p-1kp0udk-8--arg-9: blue; + --_csstools-p-1kp0udk-9--color: var(--_csstools-p-1kp0udk-8--arg-8); + --_csstools-p-1kp0udk-9--background: var(--_csstools-p-1kp0udk-8--arg-9); + color: var(--_csstools-p-1kp0udk-9--color); + background-color: var(--_csstools-p-1kp0udk-9--background); } .comment-before-comma { - --_csstools-p-d994g2bk-a--arg-a: green; - --_csstools-p-d994g2bk-a--arg-b: blue; - --_csstools-p-d994g2bk-b--color: var(--_csstools-p-d994g2bk-a--arg-a); - --_csstools-p-d994g2bk-b--background: var(--_csstools-p-d994g2bk-a--arg-b); - color: var(--_csstools-p-d994g2bk-b--color); - background-color: var(--_csstools-p-d994g2bk-b--background); + --_csstools-p-1kp0udk-a--arg-a: green; + --_csstools-p-1kp0udk-a--arg-b: blue; + --_csstools-p-1kp0udk-b--color: var(--_csstools-p-1kp0udk-a--arg-a); + --_csstools-p-1kp0udk-b--background: var(--_csstools-p-1kp0udk-a--arg-b); + color: var(--_csstools-p-1kp0udk-b--color); + background-color: var(--_csstools-p-1kp0udk-b--background); } .comment-around-arguments { - --_csstools-p-d994g2bk-c--arg-c: green; - --_csstools-p-d994g2bk-c--arg-d: blue; - --_csstools-p-d994g2bk-d--color: var(--_csstools-p-d994g2bk-c--arg-c); - --_csstools-p-d994g2bk-d--background: var(--_csstools-p-d994g2bk-c--arg-d); - color: var(--_csstools-p-d994g2bk-d--color); - background-color: var(--_csstools-p-d994g2bk-d--background); + --_csstools-p-1kp0udk-c--arg-c: green; + --_csstools-p-1kp0udk-c--arg-d: blue; + --_csstools-p-1kp0udk-d--color: var(--_csstools-p-1kp0udk-c--arg-c); + --_csstools-p-1kp0udk-d--background: var(--_csstools-p-1kp0udk-c--arg-d); + color: var(--_csstools-p-1kp0udk-d--color); + background-color: var(--_csstools-p-1kp0udk-d--background); } .comment-only-default { - --_csstools-p-d994g2bk-e--color: green; - color: var(--_csstools-p-d994g2bk-e--color); + --_csstools-p-1kp0udk-e--color: green; + color: var(--_csstools-p-1kp0udk-e--color); } .space-around-default { - --_csstools-p-d994g2bk-f--color: green; - --_csstools-p-d994g2bk-f--background: blue; - color: var(--_csstools-p-d994g2bk-f--color); - background-color: var(--_csstools-p-d994g2bk-f--background); + --_csstools-p-1kp0udk-f--color: green; + --_csstools-p-1kp0udk-f--background: blue; + color: var(--_csstools-p-1kp0udk-f--color); + background-color: var(--_csstools-p-1kp0udk-f--background); } .space-around-argument-defaults { - --_csstools-p-d994g2bk-g--arg-e: red; - --_csstools-p-d994g2bk-g--arg-f: blue; - --_csstools-p-d994g2bk-h--color: var(--_csstools-p-d994g2bk-g--arg-e); - --_csstools-p-d994g2bk-h--background: var(--_csstools-p-d994g2bk-g--arg-f); - color: var(--_csstools-p-d994g2bk-h--color); - background-color: var(--_csstools-p-d994g2bk-h--background); + --_csstools-p-1kp0udk-g--arg-e: red; + --_csstools-p-1kp0udk-g--arg-f: blue; + --_csstools-p-1kp0udk-h--color: var(--_csstools-p-1kp0udk-g--arg-e); + --_csstools-p-1kp0udk-h--background: var(--_csstools-p-1kp0udk-g--arg-f); + color: var(--_csstools-p-1kp0udk-h--color); + background-color: var(--_csstools-p-1kp0udk-h--background); } .comment-before-parameter-name { - --_csstools-p-d994g2bk-i--arg-g: green; - --_csstools-p-d994g2bk-i--arg-h: blue; - --_csstools-p-d994g2bk-j--color: var(--_csstools-p-d994g2bk-i--arg-g); - --_csstools-p-d994g2bk-j--background: var(--_csstools-p-d994g2bk-i--arg-h); - color: var(--_csstools-p-d994g2bk-j--color); - background-color: var(--_csstools-p-d994g2bk-j--background); + --_csstools-p-1kp0udk-i--arg-g: green; + --_csstools-p-1kp0udk-i--arg-h: blue; + --_csstools-p-1kp0udk-j--color: var(--_csstools-p-1kp0udk-i--arg-g); + --_csstools-p-1kp0udk-j--background: var(--_csstools-p-1kp0udk-i--arg-h); + color: var(--_csstools-p-1kp0udk-j--color); + background-color: var(--_csstools-p-1kp0udk-j--background); } .space-before-parameter-name { - --_csstools-p-d994g2bk-k--arg-i: green; - --_csstools-p-d994g2bk-k--arg-j: blue; - --_csstools-p-d994g2bk-l--color: var(--_csstools-p-d994g2bk-k--arg-i); - --_csstools-p-d994g2bk-l--background: var(--_csstools-p-d994g2bk-k--arg-j); - color: var(--_csstools-p-d994g2bk-l--color); - background-color: var(--_csstools-p-d994g2bk-l--background); + --_csstools-p-1kp0udk-k--arg-i: green; + --_csstools-p-1kp0udk-k--arg-j: blue; + --_csstools-p-1kp0udk-l--color: var(--_csstools-p-1kp0udk-k--arg-i); + --_csstools-p-1kp0udk-l--background: var(--_csstools-p-1kp0udk-k--arg-j); + color: var(--_csstools-p-1kp0udk-l--color); + background-color: var(--_csstools-p-1kp0udk-l--background); } .comment-before-default-name { - --_csstools-p-d994g2bk-m--color: green; - color: var(--_csstools-p-d994g2bk-m--color); + --_csstools-p-1kp0udk-m--color: green; + color: var(--_csstools-p-1kp0udk-m--color); } diff --git a/plugins/postcss-mixins/test/spaces.preserve-true.expect.css b/plugins/postcss-mixins/test/spaces.preserve-true.expect.css index ddceaf92b..b250a1987 100644 --- a/plugins/postcss-mixins/test/spaces.preserve-true.expect.css +++ b/plugins/postcss-mixins/test/spaces.preserve-true.expect.css @@ -4,42 +4,42 @@ } .space-after-open { - --_csstools-p-d994g2bk-0--arg-0: green; - --_csstools-p-d994g2bk-0--arg-1: blue; - --_csstools-p-d994g2bk-1--color: var(--_csstools-p-d994g2bk-0--arg-0); - --_csstools-p-d994g2bk-1--background: var(--_csstools-p-d994g2bk-0--arg-1); - color: var(--_csstools-p-d994g2bk-1--color); - background-color: var(--_csstools-p-d994g2bk-1--background); + --_csstools-p-1kp0udk-0--arg-0: green; + --_csstools-p-1kp0udk-0--arg-1: blue; + --_csstools-p-1kp0udk-1--color: var(--_csstools-p-1kp0udk-0--arg-0); + --_csstools-p-1kp0udk-1--background: var(--_csstools-p-1kp0udk-0--arg-1); + color: var(--_csstools-p-1kp0udk-1--color); + background-color: var(--_csstools-p-1kp0udk-1--background); @apply --spaces( green, blue); } .space-before-close { - --_csstools-p-d994g2bk-2--arg-2: green; - --_csstools-p-d994g2bk-2--arg-3: blue; - --_csstools-p-d994g2bk-3--color: var(--_csstools-p-d994g2bk-2--arg-2); - --_csstools-p-d994g2bk-3--background: var(--_csstools-p-d994g2bk-2--arg-3); - color: var(--_csstools-p-d994g2bk-3--color); - background-color: var(--_csstools-p-d994g2bk-3--background); + --_csstools-p-1kp0udk-2--arg-2: green; + --_csstools-p-1kp0udk-2--arg-3: blue; + --_csstools-p-1kp0udk-3--color: var(--_csstools-p-1kp0udk-2--arg-2); + --_csstools-p-1kp0udk-3--background: var(--_csstools-p-1kp0udk-2--arg-3); + color: var(--_csstools-p-1kp0udk-3--color); + background-color: var(--_csstools-p-1kp0udk-3--background); @apply --spaces(green, blue ); } .space-around-both { - --_csstools-p-d994g2bk-4--arg-4: green; - --_csstools-p-d994g2bk-4--arg-5: blue; - --_csstools-p-d994g2bk-5--color: var(--_csstools-p-d994g2bk-4--arg-4); - --_csstools-p-d994g2bk-5--background: var(--_csstools-p-d994g2bk-4--arg-5); - color: var(--_csstools-p-d994g2bk-5--color); - background-color: var(--_csstools-p-d994g2bk-5--background); + --_csstools-p-1kp0udk-4--arg-4: green; + --_csstools-p-1kp0udk-4--arg-5: blue; + --_csstools-p-1kp0udk-5--color: var(--_csstools-p-1kp0udk-4--arg-4); + --_csstools-p-1kp0udk-5--background: var(--_csstools-p-1kp0udk-4--arg-5); + color: var(--_csstools-p-1kp0udk-5--color); + background-color: var(--_csstools-p-1kp0udk-5--background); @apply --spaces( green, blue ); } .tabs-and-newlines { - --_csstools-p-d994g2bk-6--arg-6: green; - --_csstools-p-d994g2bk-6--arg-7: blue; - --_csstools-p-d994g2bk-7--color: var(--_csstools-p-d994g2bk-6--arg-6); - --_csstools-p-d994g2bk-7--background: var(--_csstools-p-d994g2bk-6--arg-7); - color: var(--_csstools-p-d994g2bk-7--color); - background-color: var(--_csstools-p-d994g2bk-7--background); + --_csstools-p-1kp0udk-6--arg-6: green; + --_csstools-p-1kp0udk-6--arg-7: blue; + --_csstools-p-1kp0udk-7--color: var(--_csstools-p-1kp0udk-6--arg-6); + --_csstools-p-1kp0udk-7--background: var(--_csstools-p-1kp0udk-6--arg-7); + color: var(--_csstools-p-1kp0udk-7--color); + background-color: var(--_csstools-p-1kp0udk-7--background); @apply --spaces( green, blue @@ -47,12 +47,12 @@ } .space-around-comma { - --_csstools-p-d994g2bk-8--arg-8: green; - --_csstools-p-d994g2bk-8--arg-9: blue; - --_csstools-p-d994g2bk-9--color: var(--_csstools-p-d994g2bk-8--arg-8); - --_csstools-p-d994g2bk-9--background: var(--_csstools-p-d994g2bk-8--arg-9); - color: var(--_csstools-p-d994g2bk-9--color); - background-color: var(--_csstools-p-d994g2bk-9--background); + --_csstools-p-1kp0udk-8--arg-8: green; + --_csstools-p-1kp0udk-8--arg-9: blue; + --_csstools-p-1kp0udk-9--color: var(--_csstools-p-1kp0udk-8--arg-8); + --_csstools-p-1kp0udk-9--background: var(--_csstools-p-1kp0udk-8--arg-9); + color: var(--_csstools-p-1kp0udk-9--color); + background-color: var(--_csstools-p-1kp0udk-9--background); @apply --spaces(green , blue); } @@ -62,12 +62,12 @@ } .comment-before-comma { - --_csstools-p-d994g2bk-a--arg-a: green; - --_csstools-p-d994g2bk-a--arg-b: blue; - --_csstools-p-d994g2bk-b--color: var(--_csstools-p-d994g2bk-a--arg-a); - --_csstools-p-d994g2bk-b--background: var(--_csstools-p-d994g2bk-a--arg-b); - color: var(--_csstools-p-d994g2bk-b--color); - background-color: var(--_csstools-p-d994g2bk-b--background); + --_csstools-p-1kp0udk-a--arg-a: green; + --_csstools-p-1kp0udk-a--arg-b: blue; + --_csstools-p-1kp0udk-b--color: var(--_csstools-p-1kp0udk-a--arg-a); + --_csstools-p-1kp0udk-b--background: var(--_csstools-p-1kp0udk-a--arg-b); + color: var(--_csstools-p-1kp0udk-b--color); + background-color: var(--_csstools-p-1kp0udk-b--background); @apply --comment-in-parameters(green /* one */, blue /* two */); } @@ -77,12 +77,12 @@ } .comment-around-arguments { - --_csstools-p-d994g2bk-c--arg-c: green; - --_csstools-p-d994g2bk-c--arg-d: blue; - --_csstools-p-d994g2bk-d--color: var(--_csstools-p-d994g2bk-c--arg-c); - --_csstools-p-d994g2bk-d--background: var(--_csstools-p-d994g2bk-c--arg-d); - color: var(--_csstools-p-d994g2bk-d--color); - background-color: var(--_csstools-p-d994g2bk-d--background); + --_csstools-p-1kp0udk-c--arg-c: green; + --_csstools-p-1kp0udk-c--arg-d: blue; + --_csstools-p-1kp0udk-d--color: var(--_csstools-p-1kp0udk-c--arg-c); + --_csstools-p-1kp0udk-d--background: var(--_csstools-p-1kp0udk-c--arg-d); + color: var(--_csstools-p-1kp0udk-d--color); + background-color: var(--_csstools-p-1kp0udk-d--background); @apply --comment-parameters-and-arguments( /* before */ green /* mid */, blue /* after */ ); } @@ -91,8 +91,8 @@ } .comment-only-default { - --_csstools-p-d994g2bk-e--color: green; - color: var(--_csstools-p-d994g2bk-e--color); + --_csstools-p-1kp0udk-e--color: green; + color: var(--_csstools-p-1kp0udk-e--color); @apply --comment-only-default; } @@ -102,20 +102,20 @@ } .space-around-default { - --_csstools-p-d994g2bk-f--color: green; - --_csstools-p-d994g2bk-f--background: blue; - color: var(--_csstools-p-d994g2bk-f--color); - background-color: var(--_csstools-p-d994g2bk-f--background); + --_csstools-p-1kp0udk-f--color: green; + --_csstools-p-1kp0udk-f--background: blue; + color: var(--_csstools-p-1kp0udk-f--color); + background-color: var(--_csstools-p-1kp0udk-f--background); @apply --space-around-default; } .space-around-argument-defaults { - --_csstools-p-d994g2bk-g--arg-e: red; - --_csstools-p-d994g2bk-g--arg-f: blue; - --_csstools-p-d994g2bk-h--color: var(--_csstools-p-d994g2bk-g--arg-e); - --_csstools-p-d994g2bk-h--background: var(--_csstools-p-d994g2bk-g--arg-f); - color: var(--_csstools-p-d994g2bk-h--color); - background-color: var(--_csstools-p-d994g2bk-h--background); + --_csstools-p-1kp0udk-g--arg-e: red; + --_csstools-p-1kp0udk-g--arg-f: blue; + --_csstools-p-1kp0udk-h--color: var(--_csstools-p-1kp0udk-g--arg-e); + --_csstools-p-1kp0udk-h--background: var(--_csstools-p-1kp0udk-g--arg-f); + color: var(--_csstools-p-1kp0udk-h--color); + background-color: var(--_csstools-p-1kp0udk-h--background); @apply --space-around-default( red , blue ); } @@ -125,12 +125,12 @@ } .comment-before-parameter-name { - --_csstools-p-d994g2bk-i--arg-g: green; - --_csstools-p-d994g2bk-i--arg-h: blue; - --_csstools-p-d994g2bk-j--color: var(--_csstools-p-d994g2bk-i--arg-g); - --_csstools-p-d994g2bk-j--background: var(--_csstools-p-d994g2bk-i--arg-h); - color: var(--_csstools-p-d994g2bk-j--color); - background-color: var(--_csstools-p-d994g2bk-j--background); + --_csstools-p-1kp0udk-i--arg-g: green; + --_csstools-p-1kp0udk-i--arg-h: blue; + --_csstools-p-1kp0udk-j--color: var(--_csstools-p-1kp0udk-i--arg-g); + --_csstools-p-1kp0udk-j--background: var(--_csstools-p-1kp0udk-i--arg-h); + color: var(--_csstools-p-1kp0udk-j--color); + background-color: var(--_csstools-p-1kp0udk-j--background); @apply --comment-before-parameter-name(green, blue); } @@ -140,12 +140,12 @@ } .space-before-parameter-name { - --_csstools-p-d994g2bk-k--arg-i: green; - --_csstools-p-d994g2bk-k--arg-j: blue; - --_csstools-p-d994g2bk-l--color: var(--_csstools-p-d994g2bk-k--arg-i); - --_csstools-p-d994g2bk-l--background: var(--_csstools-p-d994g2bk-k--arg-j); - color: var(--_csstools-p-d994g2bk-l--color); - background-color: var(--_csstools-p-d994g2bk-l--background); + --_csstools-p-1kp0udk-k--arg-i: green; + --_csstools-p-1kp0udk-k--arg-j: blue; + --_csstools-p-1kp0udk-l--color: var(--_csstools-p-1kp0udk-k--arg-i); + --_csstools-p-1kp0udk-l--background: var(--_csstools-p-1kp0udk-k--arg-j); + color: var(--_csstools-p-1kp0udk-l--color); + background-color: var(--_csstools-p-1kp0udk-l--background); @apply --space-before-parameter-name(green, blue); } @@ -154,7 +154,7 @@ } .comment-before-default-name { - --_csstools-p-d994g2bk-m--color: green; - color: var(--_csstools-p-d994g2bk-m--color); + --_csstools-p-1kp0udk-m--color: green; + color: var(--_csstools-p-1kp0udk-m--color); @apply --comment-before-default-name; } diff --git a/plugins/postcss-private-rule/CHANGELOG.md b/plugins/postcss-private-rule/CHANGELOG.md index b3bd67f7e..c990e39eb 100644 --- a/plugins/postcss-private-rule/CHANGELOG.md +++ b/plugins/postcss-private-rule/CHANGELOG.md @@ -1,5 +1,9 @@ # Changes to PostCSS Private Rule +### Unreleased (patch) + +- Drop `node:path` and `node:crypto` dependencies + ### 1.1.0 _October 1, 2026_ diff --git a/plugins/postcss-private-rule/README.md b/plugins/postcss-private-rule/README.md index b9cb47792..46fd14cc2 100644 --- a/plugins/postcss-private-rule/README.md +++ b/plugins/postcss-private-rule/README.md @@ -26,10 +26,10 @@ section > h1 { /* becomes */ section { - --_csstools-p-1agle9gi-0--size: 2px; + --_csstools-p-1gice1e-0--size: 2px; &, & > h1 { - border-width: var(--_csstools-p-1agle9gi-0--size); + border-width: var(--_csstools-p-1gice1e-0--size); } } diff --git a/plugins/postcss-private-rule/dist/index.mjs b/plugins/postcss-private-rule/dist/index.mjs index 916672109..b8d8f6722 100644 --- a/plugins/postcss-private-rule/dist/index.mjs +++ b/plugins/postcss-private-rule/dist/index.mjs @@ -1 +1 @@ -import e from"node:crypto";import t from"node:path";import{tokenize as r,isTokenIdent as s,mutateIdent as a}from"@csstools/css-tokenizer";import{parseListOfComponentValues as i,walk as n,isFunctionNode as o,isWhiteSpaceOrCommentNode as l,isTokenNode as u,stringify as p}from"@csstools/css-parser-algorithms";const f=/^keyframes$/i,c=/^(container|layer|media|scope|starting-style|supports)$/i,v=/^private$/i;function findStyleRule(e){if(!e.parent)return!1;if("rule"===e.parent.type){const t=e.parent;return("atrule"!==t.parent?.type||!f.test(t.parent.name))&&t}if("atrule"===e.parent.type){const t=e.parent;if(c.test(t.name))return findStyleRule(t)}return!1}function findAllStyleRules(e){let t=e;const r=[];for(;;){const e=findStyleRule(t);if(!e)break;r.push(e),t=e}return r.reverse(),r}function findPrivateRule(e){return"atrule"===e.parent?.type&&(c.test(e.parent.name)?findPrivateRule(e.parent):!!v.test(e.parent.name)&&e.parent)}const h=/\b(var|if)\(/i,m=/^container$/i,d=/^if$/i,g=/^style$/i,P=/^var$/i;class Transpiler{privateForRule=new Map;counter=0;hashes=new Map;getOrFillPrivateForRule(r){const s=this.privateForRule.get(r);if(s)return s;let a;if(r.source?.input.from){if(a=this.hashes.get(r.source.input.from),!a){const s=e.createHash("md5");s.update(t.basename(t.dirname(r.source?.input.from))+"/"+t.basename(r.source?.input.from),"utf8"),a=parseInt(s.digest("hex"),16).toString(36).slice(0,8),this.hashes.set(r.source.input.from,a)}}else a="0";const i=`--_csstools-p-${a}-${this.counter.toString(36)}`;this.counter++;const n={prefix:i,privateProperties:new Set};return this.privateForRule.set(r,n),n}getStyleRulesWithPrivateProperties(e){return findAllStyleRules(e).map(e=>{const t=this.privateForRule.get(e);return!!t&&{prefix:t.prefix,privateProperties:t.privateProperties,rule:e}}).filter(Boolean).reverse()}registerAndRemovePrivateRules(e,t){if(!e.nodes?.length)return;const{prefix:r,privateProperties:s}=this.getOrFillPrivateForRule(t);e.walk(t=>{if("decl"===t.type&&t.variable&&t.prop.startsWith("--"))return s.add(t.prop),void(t.prop=`${r}${t.prop}`);"atrule"===t.type&&findPrivateRule(t)===e||t.remove()}),e.before(e.nodes.map(e=>e.clone())),e.remove()}transpileDeclaration(e){this.transpileDeclarationPropertyNames(e),this.transpileDeclarationValues(e)}transpileDeclarationPropertyNames(e){if(!e.variable||!e.prop.startsWith("--"))return;const t=this.getStyleRulesWithPrivateProperties(e);if(!t.length)return;let r=!1;for(const{prefix:s,privateProperties:a}of t)if(a.has(e.prop)){r=s;break}if(!r)return;const s=`${r}${e.prop}`;e.prop!==s&&(e.prop=s)}transpileDeclarationValues(e){if(!h.test(e.value))return;const t=this.getStyleRulesWithPrivateProperties(e);if(!t.length)return;const f=i(r({css:e.value}));n(f,e=>{if(o(e.node)){if(P.test(e.node.getName())){const r=e.node.value;for(let e=0;e{if(!o(e.node))return;if(!g.test(e.node.getName()))return;const r=e.node.value;for(let e=0;e({postcssPlugin:"postcss-private-rule",prepare(){const e=new Transpiler;return{postcssPlugin:"postcss-private-rule",Once(t){t.walkAtRules(v,t=>{const r=findStyleRule(t);r&&e.registerAndRemovePrivateRules(t,r)}),t.walkDecls(t=>{e.transpileDeclaration(t)}),t.walkAtRules(t=>{e.transpileAtRule(t)})}}}});creator.postcss=!0;export{Transpiler,creator as default,creator as"module.exports"}; +import{tokenize as e,isTokenIdent as t,mutateIdent as r}from"@csstools/css-tokenizer";import{parseListOfComponentValues as s,walk as i,isFunctionNode as a,isWhiteSpaceOrCommentNode as n,isTokenNode as o,stringify as l}from"@csstools/css-parser-algorithms";const u=/^keyframes$/i,p=/^(container|layer|media|scope|starting-style|supports)$/i,c=/^private$/i;function findStyleRule(e){if(!e.parent)return!1;if("rule"===e.parent.type){const t=e.parent;return("atrule"!==t.parent?.type||!u.test(t.parent.name))&&t}if("atrule"===e.parent.type){const t=e.parent;if(p.test(t.name))return findStyleRule(t)}return!1}function findAllStyleRules(e){let t=e;const r=[];for(;;){const e=findStyleRule(t);if(!e)break;r.push(e),t=e}return r.reverse(),r}function findPrivateRule(e){return"atrule"===e.parent?.type&&(p.test(e.parent.name)?findPrivateRule(e.parent):!!c.test(e.parent.name)&&e.parent)}const f=/\b(var|if)\(/i,v=/^container$/i,h=/^if$/i,m=/^style$/i,g=/^var$/i;class Transpiler{privateForRule=new Map;counter=0;hashes=new Map;getOrFillPrivateForRule(e){const t=this.privateForRule.get(e);if(t)return t;let r;e.source?.input.from?(r=this.hashes.get(e.source.input.from),r||(r=sourceHashFor(e.source.input.from),this.hashes.set(e.source.input.from,r))):r="0";const s=`--_csstools-p-${r}-${this.counter.toString(36)}`;this.counter++;const i={prefix:s,privateProperties:new Set};return this.privateForRule.set(e,i),i}getStyleRulesWithPrivateProperties(e){return findAllStyleRules(e).map(e=>{const t=this.privateForRule.get(e);return!!t&&{prefix:t.prefix,privateProperties:t.privateProperties,rule:e}}).filter(Boolean).reverse()}registerAndRemovePrivateRules(e,t){if(!e.nodes?.length)return;const{prefix:r,privateProperties:s}=this.getOrFillPrivateForRule(t);e.walk(t=>{if("decl"===t.type&&t.variable&&t.prop.startsWith("--"))return s.add(t.prop),void(t.prop=`${r}${t.prop}`);"atrule"===t.type&&findPrivateRule(t)===e||t.remove()}),e.before(e.nodes.map(e=>e.clone())),e.remove()}transpileDeclaration(e){this.transpileDeclarationPropertyNames(e),this.transpileDeclarationValues(e)}transpileDeclarationPropertyNames(e){if(!e.variable||!e.prop.startsWith("--"))return;const t=this.getStyleRulesWithPrivateProperties(e);if(!t.length)return;let r=!1;for(const{prefix:s,privateProperties:i}of t)if(i.has(e.prop)){r=s;break}if(!r)return;const s=`${r}${e.prop}`;e.prop!==s&&(e.prop=s)}transpileDeclarationValues(u){if(!f.test(u.value))return;const p=this.getStyleRulesWithPrivateProperties(u);if(!p.length)return;const c=s(e({css:u.value}));i(c,e=>{if(a(e.node)){if(g.test(e.node.getName())){const s=e.node.value;for(let e=0;e{if(!a(e.node))return;if(!m.test(e.node.getName()))return;const s=e.node.value;for(let e=0;e>>0).toString(36)}function sourceKey(e){const t=e.replaceAll("\\","/").split("/").filter(e=>e.length>0);return 0===t.length?".":1===t.length?`./${t[0]}`:t.slice(-2).join("/")}const creator=()=>({postcssPlugin:"postcss-private-rule",prepare(){const e=new Transpiler;return{postcssPlugin:"postcss-private-rule",Once(t){t.walkAtRules(c,t=>{const r=findStyleRule(t);r&&e.registerAndRemovePrivateRules(t,r)}),t.walkDecls(t=>{e.transpileDeclaration(t)}),t.walkAtRules(t=>{e.transpileAtRule(t)})}}}});creator.postcss=!0;export{Transpiler,creator as default,creator as"module.exports"}; diff --git a/plugins/postcss-private-rule/src/transpiler.ts b/plugins/postcss-private-rule/src/transpiler.ts index fed5bae5a..1293592e1 100644 --- a/plugins/postcss-private-rule/src/transpiler.ts +++ b/plugins/postcss-private-rule/src/transpiler.ts @@ -1,6 +1,4 @@ import type { AtRule, Declaration, Node, Rule } from 'postcss'; -import crypto from 'node:crypto'; -import path from 'node:path'; import { findAllStyleRules, findPrivateRule } from './valid-atrules'; import { isTokenIdent, mutateIdent, tokenize } from '@csstools/css-tokenizer'; import { isFunctionNode, isTokenNode, isWhiteSpaceOrCommentNode, parseListOfComponentValues, stringify, walk } from '@csstools/css-parser-algorithms'; @@ -29,9 +27,7 @@ export class Transpiler { fromHash = this.hashes.get(rule.source.input.from); if (!fromHash) { - const hash = crypto.createHash('md5'); - hash.update(path.basename(path.dirname(rule.source?.input.from)) + '/' + path.basename(rule.source?.input.from), 'utf8'); - fromHash = parseInt(hash.digest('hex'), 16).toString(36).slice(0, 8); + fromHash = sourceHashFor(rule.source.input.from); this.hashes.set(rule.source.input.from, fromHash); } } else { @@ -268,3 +264,39 @@ export class Transpiler { atRule.params = replacement; } } + +/** + * A short, stable hash of a stylesheet source path. + * + * Generated names embed this hash so that names from different stylesheets can + * not collide. Only the last two path segments are used, so that names are + * stable regardless of the absolute location of a project. + * + * This intentionally avoids `node:crypto` and `node:path` so that this plugin + * can run in a browser bundle. + */ +function sourceHashFor(from: string): string { + let hash = 2166136261; + const source = sourceKey(from); + + for (let i = 0; i < source.length; i++) { + hash ^= source.charCodeAt(i); + hash = Math.imul(hash, 16777619); + } + + return (hash >>> 0).toString(36); +} + +function sourceKey(from: string): string { + const segments = from.replaceAll('\\', '/').split('/').filter((segment) => segment.length > 0); + + if (segments.length === 0) { + return '.'; + } + + if (segments.length === 1) { + return `./${segments[0]}`; + } + + return segments.slice(-2).join('/'); +} diff --git a/plugins/postcss-private-rule/test/basic.expect.css b/plugins/postcss-private-rule/test/basic.expect.css index ee69f4682..578af31df 100644 --- a/plugins/postcss-private-rule/test/basic.expect.css +++ b/plugins/postcss-private-rule/test/basic.expect.css @@ -1,10 +1,10 @@ section { - --_csstools-p-86hq2t3p-0--size: 2px; - --_csstools-p-86hq2t3p-0--color: red; + --_csstools-p-wv7kid-0--size: 2px; + --_csstools-p-wv7kid-0--color: red; &, & > h1, & > h1 > small { - border-width: var(--_csstools-p-86hq2t3p-0--size); - border-color: var(--_csstools-p-86hq2t3p-0--color); + border-width: var(--_csstools-p-wv7kid-0--size); + border-color: var(--_csstools-p-wv7kid-0--color); } } @@ -17,89 +17,89 @@ section > h1 > small { } .multiple-private-rules { - --_csstools-p-86hq2t3p-1--alpha: 2px; - --_csstools-p-86hq2t3p-1--alpha: 3px; + --_csstools-p-wv7kid-1--alpha: 2px; + --_csstools-p-wv7kid-1--alpha: 3px; - --beta: var(--_csstools-p-86hq2t3p-1--alpha); + --beta: var(--_csstools-p-wv7kid-1--alpha); } .lexically-scoped-before-private { - --_csstools-p-86hq2t3p-2--alpha: 1px; - --_csstools-p-86hq2t3p-2--alpha: 2px; + --_csstools-p-wv7kid-2--alpha: 1px; + --_csstools-p-wv7kid-2--alpha: 2px; - --beta: var(--_csstools-p-86hq2t3p-2--alpha); + --beta: var(--_csstools-p-wv7kid-2--alpha); } .private-before-lexically-scoped { - --_csstools-p-86hq2t3p-3--alpha: 2px; + --_csstools-p-wv7kid-3--alpha: 2px; - --_csstools-p-86hq2t3p-3--alpha: 3px; + --_csstools-p-wv7kid-3--alpha: 3px; - --beta: var(--_csstools-p-86hq2t3p-3--alpha); + --beta: var(--_csstools-p-wv7kid-3--alpha); } .single-private { - --_csstools-p-86hq2t3p-4--alpha: var(--beta) + --_csstools-p-wv7kid-4--alpha: var(--beta) } .two-private { - --_csstools-p-86hq2t3p-5--alpha: 1; - --_csstools-p-86hq2t3p-5--beta: 2 + --_csstools-p-wv7kid-5--alpha: 1; + --_csstools-p-wv7kid-5--beta: 2 } .container-query { - --_csstools-p-86hq2t3p-6--alpha: private; + --_csstools-p-wv7kid-6--alpha: private; - @container style(--_csstools-p-86hq2t3p-6--alpha: private) { + @container style(--_csstools-p-wv7kid-6--alpha: private) { --bar: cyan; } } .container-query-and-nesting { - --_csstools-p-86hq2t3p-7--alpha: private; + --_csstools-p-wv7kid-7--alpha: private; & .bar { - @container style(--_csstools-p-86hq2t3p-7--alpha: private) { + @container style(--_csstools-p-wv7kid-7--alpha: private) { --bar: cyan; } } } .if-function { - --_csstools-p-86hq2t3p-8--alpha: private; + --_csstools-p-wv7kid-8--alpha: private; --bar: if( - style(--_csstools-p-86hq2t3p-8--alpha: private): cyan; + style(--_csstools-p-wv7kid-8--alpha: private): cyan; else: orange; ); --baz: if( - style(--something: var(--_csstools-p-86hq2t3p-8--alpha)): cyan; + style(--something: var(--_csstools-p-wv7kid-8--alpha)): cyan; else: orange; ); } .invalid-private-contents{ - --_csstools-p-86hq2t3p-9--alpha: 2px; + --_csstools-p-wv7kid-9--alpha: 2px; - --beta: var(--_csstools-p-86hq2t3p-9--alpha); + --beta: var(--_csstools-p-wv7kid-9--alpha); } .conditional-private { - --_csstools-p-86hq2t3p-a--alpha: 2px; + --_csstools-p-wv7kid-a--alpha: 2px; @media screen { - --_csstools-p-86hq2t3p-a--alpha: 3px; + --_csstools-p-wv7kid-a--alpha: 3px; } - --beta: var(--_csstools-p-86hq2t3p-a--alpha); + --beta: var(--_csstools-p-wv7kid-a--alpha); } .conditional-private-use { - --_csstools-p-86hq2t3p-b--alpha: 2px; + --_csstools-p-wv7kid-b--alpha: 2px; @media screen { - --beta: var(--_csstools-p-86hq2t3p-b--alpha); + --beta: var(--_csstools-p-wv7kid-b--alpha); } } @@ -121,19 +121,19 @@ section > h1 > small { } .ignore { - --_csstools-p-86hq2t3p-c--alpha: 2px; + --_csstools-p-wv7kid-c--alpha: 2px; --beta: var(--foo, --alpha); } .ignore { - --_csstools-p-86hq2t3p-d--alpha: 2px; + --_csstools-p-wv7kid-d--alpha: 2px; --beta: --alpha; } .ignore { - --_csstools-p-86hq2t3p-e--alpha: 2px; + --_csstools-p-wv7kid-e--alpha: 2px; --bar: if( style(--foo: --alpha): cyan; @@ -142,7 +142,7 @@ section > h1 > small { } .ignore { - --_csstools-p-86hq2t3p-f--alpha: 2px; + --_csstools-p-wv7kid-f--alpha: 2px; & .bar { @container style(--something: --alpha) { @@ -152,11 +152,11 @@ section > h1 > small { } .outer { - --_csstools-p-86hq2t3p-g--foo: outer; + --_csstools-p-wv7kid-g--foo: outer; .inner { - --_csstools-p-86hq2t3p-h--foo: inner; + --_csstools-p-wv7kid-h--foo: inner; - content: var(--_csstools-p-86hq2t3p-h--foo); + content: var(--_csstools-p-wv7kid-h--foo); } } diff --git a/plugins/postcss-private-rule/test/bundled.expect.css b/plugins/postcss-private-rule/test/bundled.expect.css index 9a3b5c49d..0e2b6f41d 100644 --- a/plugins/postcss-private-rule/test/bundled.expect.css +++ b/plugins/postcss-private-rule/test/bundled.expect.css @@ -1,27 +1,27 @@ /* ./fixtures/imported-a.css */ a { - --_csstools-p-e141ntxa-0--a: 2px; + --_csstools-p-kavj0z-0--a: 2px; - top: var(--_csstools-p-e141ntxa-0--a); + top: var(--_csstools-p-kavj0z-0--a); } /* ./fixtures/imported-b.css */ /* ./imported-a.css */ a { - --_csstools-p-e141ntxa-1--a: 2px; + --_csstools-p-kavj0z-1--a: 2px; - top: var(--_csstools-p-e141ntxa-1--a); + top: var(--_csstools-p-kavj0z-1--a); } b { - --_csstools-p-3uyhw73m-2--b: 2px; + --_csstools-p-uoau7i-2--b: 2px; - top: var(--_csstools-p-3uyhw73m-2--b); + top: var(--_csstools-p-uoau7i-2--b); } div { - --_csstools-p-334w13mg-3--z: 2px; + --_csstools-p-r38lbr-3--z: 2px; - top: var(--_csstools-p-334w13mg-3--z); + top: var(--_csstools-p-r38lbr-3--z); } diff --git a/plugins/postcss-private-rule/test/encoding.expect.css b/plugins/postcss-private-rule/test/encoding.expect.css index 8add7754b..5272a6f51 100644 --- a/plugins/postcss-private-rule/test/encoding.expect.css +++ b/plugins/postcss-private-rule/test/encoding.expect.css @@ -1,271 +1,271 @@ .encoding { - --_csstools-p-70c9usyd-0--a--0000: x + --_csstools-p-1ge982m-0--a--0000: x } .encoding { - --_csstools-p-70c9usyd-1--a--0001: x + --_csstools-p-1ge982m-1--a--0001: x } .encoding { - --_csstools-p-70c9usyd-2--a--0002: x + --_csstools-p-1ge982m-2--a--0002: x } .encoding { - --_csstools-p-70c9usyd-3--a--0003: x + --_csstools-p-1ge982m-3--a--0003: x } .encoding { - --_csstools-p-70c9usyd-4--a--0004: x + --_csstools-p-1ge982m-4--a--0004: x } .encoding { - --_csstools-p-70c9usyd-5--a--0005: x + --_csstools-p-1ge982m-5--a--0005: x } .encoding { - --_csstools-p-70c9usyd-6--a--0006: x + --_csstools-p-1ge982m-6--a--0006: x } .encoding { - --_csstools-p-70c9usyd-7--a--0007: x + --_csstools-p-1ge982m-7--a--0007: x } .encoding { - --_csstools-p-70c9usyd-8--a--0008: x + --_csstools-p-1ge982m-8--a--0008: x } .encoding { - --_csstools-p-70c9usyd-9--a--0009: x + --_csstools-p-1ge982m-9--a--0009: x } .encoding { - --_csstools-p-70c9usyd-a--a--0010: x + --_csstools-p-1ge982m-a--a--0010: x } .encoding { - --_csstools-p-70c9usyd-b--a--0011: x + --_csstools-p-1ge982m-b--a--0011: x } .encoding { - --_csstools-p-70c9usyd-c--a--0012: x + --_csstools-p-1ge982m-c--a--0012: x } .encoding { - --_csstools-p-70c9usyd-d--a--0013: x + --_csstools-p-1ge982m-d--a--0013: x } .encoding { - --_csstools-p-70c9usyd-e--a--0014: x + --_csstools-p-1ge982m-e--a--0014: x } .encoding { - --_csstools-p-70c9usyd-f--a--0015: x + --_csstools-p-1ge982m-f--a--0015: x } .encoding { - --_csstools-p-70c9usyd-g--a--0016: x + --_csstools-p-1ge982m-g--a--0016: x } .encoding { - --_csstools-p-70c9usyd-h--a--0017: x + --_csstools-p-1ge982m-h--a--0017: x } .encoding { - --_csstools-p-70c9usyd-i--a--0018: x + --_csstools-p-1ge982m-i--a--0018: x } .encoding { - --_csstools-p-70c9usyd-j--a--0019: x + --_csstools-p-1ge982m-j--a--0019: x } .encoding { - --_csstools-p-70c9usyd-k--a--0020: x + --_csstools-p-1ge982m-k--a--0020: x } .encoding { - --_csstools-p-70c9usyd-l--a--0021: x + --_csstools-p-1ge982m-l--a--0021: x } .encoding { - --_csstools-p-70c9usyd-m--a--0022: x + --_csstools-p-1ge982m-m--a--0022: x } .encoding { - --_csstools-p-70c9usyd-n--a--0023: x + --_csstools-p-1ge982m-n--a--0023: x } .encoding { - --_csstools-p-70c9usyd-o--a--0024: x + --_csstools-p-1ge982m-o--a--0024: x } .encoding { - --_csstools-p-70c9usyd-p--a--0025: x + --_csstools-p-1ge982m-p--a--0025: x } .encoding { - --_csstools-p-70c9usyd-q--a--0026: x + --_csstools-p-1ge982m-q--a--0026: x } .encoding { - --_csstools-p-70c9usyd-r--a--0027: x + --_csstools-p-1ge982m-r--a--0027: x } .encoding { - --_csstools-p-70c9usyd-s--a--0028: x + --_csstools-p-1ge982m-s--a--0028: x } .encoding { - --_csstools-p-70c9usyd-t--a--0029: x + --_csstools-p-1ge982m-t--a--0029: x } .encoding { - --_csstools-p-70c9usyd-u--a--0030: x + --_csstools-p-1ge982m-u--a--0030: x } .encoding { - --_csstools-p-70c9usyd-v--a--0031: x + --_csstools-p-1ge982m-v--a--0031: x } .encoding { - --_csstools-p-70c9usyd-w--a--0032: x + --_csstools-p-1ge982m-w--a--0032: x } .encoding { - --_csstools-p-70c9usyd-x--a--0033: x + --_csstools-p-1ge982m-x--a--0033: x } .encoding { - --_csstools-p-70c9usyd-y--a--0034: x + --_csstools-p-1ge982m-y--a--0034: x } .encoding { - --_csstools-p-70c9usyd-z--a--0035: x + --_csstools-p-1ge982m-z--a--0035: x } .encoding { - --_csstools-p-70c9usyd-10--a--0036: x + --_csstools-p-1ge982m-10--a--0036: x } .encoding { - --_csstools-p-70c9usyd-11--a--0037: x + --_csstools-p-1ge982m-11--a--0037: x } .encoding { - --_csstools-p-70c9usyd-12--a--0038: x + --_csstools-p-1ge982m-12--a--0038: x } .encoding { - --_csstools-p-70c9usyd-13--a--0039: x + --_csstools-p-1ge982m-13--a--0039: x } .encoding { - --_csstools-p-70c9usyd-14--a--0040: x + --_csstools-p-1ge982m-14--a--0040: x } .encoding { - --_csstools-p-70c9usyd-15--a--0041: x + --_csstools-p-1ge982m-15--a--0041: x } .encoding { - --_csstools-p-70c9usyd-16--a--0042: x + --_csstools-p-1ge982m-16--a--0042: x } .encoding { - --_csstools-p-70c9usyd-17--a--0043: x + --_csstools-p-1ge982m-17--a--0043: x } .encoding { - --_csstools-p-70c9usyd-18--a--0044: x + --_csstools-p-1ge982m-18--a--0044: x } .encoding { - --_csstools-p-70c9usyd-19--a--0045: x + --_csstools-p-1ge982m-19--a--0045: x } .encoding { - --_csstools-p-70c9usyd-1a--a--0046: x + --_csstools-p-1ge982m-1a--a--0046: x } .encoding { - --_csstools-p-70c9usyd-1b--a--0047: x + --_csstools-p-1ge982m-1b--a--0047: x } .encoding { - --_csstools-p-70c9usyd-1c--a--0048: x + --_csstools-p-1ge982m-1c--a--0048: x } .encoding { - --_csstools-p-70c9usyd-1d--a--0049: x + --_csstools-p-1ge982m-1d--a--0049: x } .encoding { - --_csstools-p-70c9usyd-1e--a--0050: x + --_csstools-p-1ge982m-1e--a--0050: x } .encoding { - --_csstools-p-70c9usyd-1f--a--0051: x + --_csstools-p-1ge982m-1f--a--0051: x } .encoding { - --_csstools-p-70c9usyd-1g--a--0052: x + --_csstools-p-1ge982m-1g--a--0052: x } .encoding { - --_csstools-p-70c9usyd-1h--a--0053: x + --_csstools-p-1ge982m-1h--a--0053: x } .encoding { - --_csstools-p-70c9usyd-1i--a--0054: x + --_csstools-p-1ge982m-1i--a--0054: x } .encoding { - --_csstools-p-70c9usyd-1j--a--0055: x + --_csstools-p-1ge982m-1j--a--0055: x } .encoding { - --_csstools-p-70c9usyd-1k--a--0056: x + --_csstools-p-1ge982m-1k--a--0056: x } .encoding { - --_csstools-p-70c9usyd-1l--a--0057: x + --_csstools-p-1ge982m-1l--a--0057: x } .encoding { - --_csstools-p-70c9usyd-1m--a--0058: x + --_csstools-p-1ge982m-1m--a--0058: x } .encoding { - --_csstools-p-70c9usyd-1n--a--0059: x + --_csstools-p-1ge982m-1n--a--0059: x } .encoding { - --_csstools-p-70c9usyd-1o--a--0060: x + --_csstools-p-1ge982m-1o--a--0060: x } .encoding { - --_csstools-p-70c9usyd-1p--a--0061: x + --_csstools-p-1ge982m-1p--a--0061: x } .encoding { - --_csstools-p-70c9usyd-1q--a--0062: x + --_csstools-p-1ge982m-1q--a--0062: x } .encoding { - --_csstools-p-70c9usyd-1r--a--0063: x + --_csstools-p-1ge982m-1r--a--0063: x } .encoding { - --_csstools-p-70c9usyd-1s--a--0064: x + --_csstools-p-1ge982m-1s--a--0064: x } .encoding { - --_csstools-p-70c9usyd-1t--a--0065: x + --_csstools-p-1ge982m-1t--a--0065: x } .encoding { - --_csstools-p-70c9usyd-1u--a--0066: x + --_csstools-p-1ge982m-1u--a--0066: x } .encoding { - --_csstools-p-70c9usyd-1v--a--0067: x + --_csstools-p-1ge982m-1v--a--0067: x } .encoding { - --_csstools-p-70c9usyd-1w--a--0068: x + --_csstools-p-1ge982m-1w--a--0068: x } .encoding { - --_csstools-p-70c9usyd-1x--a--0069: x + --_csstools-p-1ge982m-1x--a--0069: x } .encoding { - --_csstools-p-70c9usyd-1y--a--0070: x + --_csstools-p-1ge982m-1y--a--0070: x } .encoding { - --_csstools-p-70c9usyd-1z--a--0071: x + --_csstools-p-1ge982m-1z--a--0071: x } .encoding { - --_csstools-p-70c9usyd-20--a--0072: x + --_csstools-p-1ge982m-20--a--0072: x } .encoding { - --_csstools-p-70c9usyd-21--a--0073: x + --_csstools-p-1ge982m-21--a--0073: x } .encoding { - --_csstools-p-70c9usyd-22--a--0074: x + --_csstools-p-1ge982m-22--a--0074: x } .encoding { - --_csstools-p-70c9usyd-23--a--0075: x + --_csstools-p-1ge982m-23--a--0075: x } .encoding { - --_csstools-p-70c9usyd-24--a--0076: x + --_csstools-p-1ge982m-24--a--0076: x } .encoding { - --_csstools-p-70c9usyd-25--a--0077: x + --_csstools-p-1ge982m-25--a--0077: x } .encoding { - --_csstools-p-70c9usyd-26--a--0078: x + --_csstools-p-1ge982m-26--a--0078: x } .encoding { - --_csstools-p-70c9usyd-27--a--0079: x + --_csstools-p-1ge982m-27--a--0079: x } .encoding { - --_csstools-p-70c9usyd-28--a--0080: x + --_csstools-p-1ge982m-28--a--0080: x } .encoding { - --_csstools-p-70c9usyd-29--a--0081: x + --_csstools-p-1ge982m-29--a--0081: x } .encoding { - --_csstools-p-70c9usyd-2a--a--0082: x + --_csstools-p-1ge982m-2a--a--0082: x } .encoding { - --_csstools-p-70c9usyd-2b--a--0083: x + --_csstools-p-1ge982m-2b--a--0083: x } .encoding { - --_csstools-p-70c9usyd-2c--a--0084: x + --_csstools-p-1ge982m-2c--a--0084: x } .encoding { - --_csstools-p-70c9usyd-2d--a--0085: x + --_csstools-p-1ge982m-2d--a--0085: x } .encoding { - --_csstools-p-70c9usyd-2e--a--0086: x + --_csstools-p-1ge982m-2e--a--0086: x } .encoding { - --_csstools-p-70c9usyd-2f--a--0087: x + --_csstools-p-1ge982m-2f--a--0087: x } .encoding { - --_csstools-p-70c9usyd-2g--a--0088: x + --_csstools-p-1ge982m-2g--a--0088: x } .encoding { - --_csstools-p-70c9usyd-2h--a--0089: x + --_csstools-p-1ge982m-2h--a--0089: x } diff --git a/plugins/postcss-private-rule/test/examples/example.expect.css b/plugins/postcss-private-rule/test/examples/example.expect.css index fa083ebcc..81e20eadf 100644 --- a/plugins/postcss-private-rule/test/examples/example.expect.css +++ b/plugins/postcss-private-rule/test/examples/example.expect.css @@ -1,8 +1,8 @@ section { - --_csstools-p-1agle9gi-0--size: 2px; + --_csstools-p-1gice1e-0--size: 2px; &, & > h1 { - border-width: var(--_csstools-p-1agle9gi-0--size); + border-width: var(--_csstools-p-1gice1e-0--size); } } diff --git a/plugins/postcss-private-rule/test/nesting.expect.css b/plugins/postcss-private-rule/test/nesting.expect.css index 01aa3e68e..be562333f 100644 --- a/plugins/postcss-private-rule/test/nesting.expect.css +++ b/plugins/postcss-private-rule/test/nesting.expect.css @@ -1,55 +1,55 @@ .zero { - --_csstools-p-7fww6zpl-0--zero: 0px; + --_csstools-p-1sa7v3t-0--zero: 0px; - border: var(--_csstools-p-7fww6zpl-0--zero); + border: var(--_csstools-p-1sa7v3t-0--zero); .one { - --_csstools-p-7fww6zpl-1--one: 1px; + --_csstools-p-1sa7v3t-1--one: 1px; - border: var(--_csstools-p-7fww6zpl-0--zero); - padding: var(--_csstools-p-7fww6zpl-1--one); + border: var(--_csstools-p-1sa7v3t-0--zero); + padding: var(--_csstools-p-1sa7v3t-1--one); .two { - --_csstools-p-7fww6zpl-2--two: 2px; + --_csstools-p-1sa7v3t-2--two: 2px; - border: var(--_csstools-p-7fww6zpl-0--zero); - padding: var(--_csstools-p-7fww6zpl-1--one); - margin: var(--_csstools-p-7fww6zpl-2--two); + border: var(--_csstools-p-1sa7v3t-0--zero); + padding: var(--_csstools-p-1sa7v3t-1--one); + margin: var(--_csstools-p-1sa7v3t-2--two); .three { - --_csstools-p-7fww6zpl-3--three: 3px; + --_csstools-p-1sa7v3t-3--three: 3px; - border: var(--_csstools-p-7fww6zpl-0--zero); - padding: var(--_csstools-p-7fww6zpl-1--one); - margin: var(--_csstools-p-7fww6zpl-2--two); - inset: var(--_csstools-p-7fww6zpl-3--three); + border: var(--_csstools-p-1sa7v3t-0--zero); + padding: var(--_csstools-p-1sa7v3t-1--one); + margin: var(--_csstools-p-1sa7v3t-2--two); + inset: var(--_csstools-p-1sa7v3t-3--three); } } } } .zero { - border: var(--_csstools-p-7fww6zpl-7--zero); + border: var(--_csstools-p-1sa7v3t-7--zero); .one { - border: var(--_csstools-p-7fww6zpl-7--zero); - padding: var(--_csstools-p-7fww6zpl-6--one); + border: var(--_csstools-p-1sa7v3t-7--zero); + padding: var(--_csstools-p-1sa7v3t-6--one); .two { - border: var(--_csstools-p-7fww6zpl-7--zero); - padding: var(--_csstools-p-7fww6zpl-6--one); - margin: var(--_csstools-p-7fww6zpl-5--two); + border: var(--_csstools-p-1sa7v3t-7--zero); + padding: var(--_csstools-p-1sa7v3t-6--one); + margin: var(--_csstools-p-1sa7v3t-5--two); .three { - border: var(--_csstools-p-7fww6zpl-7--zero); - padding: var(--_csstools-p-7fww6zpl-6--one); - margin: var(--_csstools-p-7fww6zpl-5--two); - inset: var(--_csstools-p-7fww6zpl-4--three); - --_csstools-p-7fww6zpl-4--three: 3px + border: var(--_csstools-p-1sa7v3t-7--zero); + padding: var(--_csstools-p-1sa7v3t-6--one); + margin: var(--_csstools-p-1sa7v3t-5--two); + inset: var(--_csstools-p-1sa7v3t-4--three); + --_csstools-p-1sa7v3t-4--three: 3px } - --_csstools-p-7fww6zpl-5--two: 2px + --_csstools-p-1sa7v3t-5--two: 2px } - --_csstools-p-7fww6zpl-6--one: 1px + --_csstools-p-1sa7v3t-6--one: 1px } - --_csstools-p-7fww6zpl-7--zero: 0px + --_csstools-p-1sa7v3t-7--zero: 0px }