Big News: Socket raises $60M Series C at a $1B valuation to secure software supply chains for AI-driven development.Announcement →
Sign In

tailwindcss

Package Overview
Dependencies
Maintainers
3
Versions
2567
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

tailwindcss - npm Package Compare versions

Comparing version
0.0.0-insiders.d0269c2
 to
0.0.0-insiders.d03edef
+1
dist/chunk-4VTQOGRC.mjs
function h(n){if(arguments.length===0)throw new TypeError("`CSS.escape` requires an argument.");let e=String(n),i=e.length,r=-1,t,s="",l=e.charCodeAt(0);if(i===1&&l===45)return"\\"+e;for(;++r<i;){if(t=e.charCodeAt(r),t===0){s+="\uFFFD";continue}if(t>=1&&t<=31||t===127||r===0&&t>=48&&t<=57||r===1&&t>=48&&t<=57&&l===45){s+="\\"+t.toString(16)+" ";continue}if(t>=128||t===45||t===95||t>=48&&t<=57||t>=65&&t<=90||t>=97&&t<=122){s+=e.charAt(r);continue}s+="\\"+e.charAt(r)}return s}function a(n){return n.replace(/\\([\dA-Fa-f]{1,6}[\t\n\f\r ]?|[\S\s])/g,e=>{if(e.length<=2)return e[1];let i=Number.parseInt(e.slice(1).trim(),16);return i===0||i>1114111||i>=55296&&i<=57343?"\uFFFD":String.fromCodePoint(i)})}var c=new Map([["--font",["--font-weight","--font-size"]],["--inset",["--inset-shadow","--inset-ring"]],["--text",["--text-color","--text-decoration-color","--text-decoration-thickness","--text-indent","--text-shadow","--text-underline-offset"]],["--grid-column",["--grid-column-start","--grid-column-end"]],["--grid-row",["--grid-row-start","--grid-row-end"]]]);function g(n,e){return(c.get(e)??[]).some(i=>n===i||n.startsWith(`${i}-`))}var p=class{constructor(e=new Map,i=new Set([])){this.values=e;this.keyframes=i}prefix=null;get size(){return this.values.size}add(e,i,r=0,t){if(e.endsWith("-*")){if(i!=="initial")throw new Error(`Invalid theme value \`${i}\` for namespace \`${e}\``);e==="--*"?this.values.clear():this.clearNamespace(e.slice(0,-2),0)}if(r&4){let s=this.values.get(e);if(s&&!(s.options&4))return}i==="initial"?this.values.delete(e):this.values.set(e,{value:i,options:r,src:t})}keysInNamespaces(e){let i=[];for(let r of e){let t=`${r}-`;for(let s of this.values.keys())s.startsWith(t)&&s.indexOf("--",2)===-1&&(g(s,r)||i.push(s.slice(t.length)))}return i}get(e){for(let i of e){let r=this.values.get(i);if(r)return r.value}return null}hasDefault(e){return(this.getOptions(e)&4)===4}getOptions(e){return e=a(this.#i(e)),this.values.get(e)?.options??0}entries(){return this.prefix?Array.from(this.values,e=>(e[0]=this.prefixKey(e[0]),e)):this.values.entries()}prefixKey(e){return this.prefix?`--${this.prefix}-${e.slice(2)}`:e}#i(e){return this.prefix?`--${e.slice(3+this.prefix.length)}`:e}clearNamespace(e,i){let r=c.get(e)??[];e:for(let t of this.values.keys())if(t.startsWith(e)){if(i!==0&&(this.getOptions(t)&i)!==i)continue;for(let s of r)if(t.startsWith(s))continue e;this.values.delete(t)}}#e(e,i){for(let r of i){let t=e!==null?`${r}-${e}`:r;if(!this.values.has(t))if(e!==null&&e.includes(".")){if(t=`${r}-${e.replaceAll(".","_")}`,!this.values.has(t))continue}else continue;if(!g(t,r))return t}return null}#t(e){let i=this.values.get(e);if(!i)return null;let r=null;return i.options&2&&(r=i.value),`var(${h(this.prefixKey(e))}${r?`, ${r}`:""})`}markUsedVariable(e){let i=a(this.#i(e)),r=this.values.get(i);if(!r)return!1;let t=r.options&16;return r.options|=16,!t}resolve(e,i,r=0){let t=this.#e(e,i);if(!t)return null;let s=this.values.get(t);return(r|s.options)&1?s.value:this.#t(t)}resolveValue(e,i){let r=this.#e(e,i);return r?this.values.get(r).value:null}resolveWith(e,i,r=[]){let t=this.#e(e,i);if(!t)return null;let s={};for(let u of r){let f=`${t}${u}`,o=this.values.get(f);o&&(o.options&1?s[u]=o.value:s[u]=this.#t(f))}let l=this.values.get(t);return l.options&1?[l.value,s]:[this.#t(t),s]}namespace(e){let i=new Map,r=`${e}-`;for(let[t,s]of this.values)t===e?i.set(null,s.value):t.startsWith(`${r}-`)?i.set(t.slice(e.length),s.value):t.startsWith(r)&&i.set(t.slice(r.length),s.value);return i}addKeyframes(e){this.keyframes.add(e)}getKeyframes(){return Array.from(this.keyframes)}};export{h as a,a as b,p as c};
+1
dist/chunk-X4GG3EDV.mjs
var l={inherit:"inherit",current:"currentcolor",transparent:"transparent",black:"#000",white:"#fff",slate:{50:"oklch(98.4% 0.003 247.858)",100:"oklch(96.8% 0.007 247.896)",200:"oklch(92.9% 0.013 255.508)",300:"oklch(86.9% 0.022 252.894)",400:"oklch(70.4% 0.04 256.788)",500:"oklch(55.4% 0.046 257.417)",600:"oklch(44.6% 0.043 257.281)",700:"oklch(37.2% 0.044 257.287)",800:"oklch(27.9% 0.041 260.031)",900:"oklch(20.8% 0.042 265.755)",950:"oklch(12.9% 0.042 264.695)"},gray:{50:"oklch(98.5% 0.002 247.839)",100:"oklch(96.7% 0.003 264.542)",200:"oklch(92.8% 0.006 264.531)",300:"oklch(87.2% 0.01 258.338)",400:"oklch(70.7% 0.022 261.325)",500:"oklch(55.1% 0.027 264.364)",600:"oklch(44.6% 0.03 256.802)",700:"oklch(37.3% 0.034 259.733)",800:"oklch(27.8% 0.033 256.848)",900:"oklch(21% 0.034 264.665)",950:"oklch(13% 0.028 261.692)"},zinc:{50:"oklch(98.5% 0 0)",100:"oklch(96.7% 0.001 286.375)",200:"oklch(92% 0.004 286.32)",300:"oklch(87.1% 0.006 286.286)",400:"oklch(70.5% 0.015 286.067)",500:"oklch(55.2% 0.016 285.938)",600:"oklch(44.2% 0.017 285.786)",700:"oklch(37% 0.013 285.805)",800:"oklch(27.4% 0.006 286.033)",900:"oklch(21% 0.006 285.885)",950:"oklch(14.1% 0.005 285.823)"},neutral:{50:"oklch(98.5% 0 0)",100:"oklch(97% 0 0)",200:"oklch(92.2% 0 0)",300:"oklch(87% 0 0)",400:"oklch(70.8% 0 0)",500:"oklch(55.6% 0 0)",600:"oklch(43.9% 0 0)",700:"oklch(37.1% 0 0)",800:"oklch(26.9% 0 0)",900:"oklch(20.5% 0 0)",950:"oklch(14.5% 0 0)"},stone:{50:"oklch(98.5% 0.001 106.423)",100:"oklch(97% 0.001 106.424)",200:"oklch(92.3% 0.003 48.717)",300:"oklch(86.9% 0.005 56.366)",400:"oklch(70.9% 0.01 56.259)",500:"oklch(55.3% 0.013 58.071)",600:"oklch(44.4% 0.011 73.639)",700:"oklch(37.4% 0.01 67.558)",800:"oklch(26.8% 0.007 34.298)",900:"oklch(21.6% 0.006 56.043)",950:"oklch(14.7% 0.004 49.25)"},mauve:{50:"oklch(98.5% 0 0)",100:"oklch(96% 0.003 325.6)",200:"oklch(92.2% 0.005 325.62)",300:"oklch(86.5% 0.012 325.68)",400:"oklch(71.1% 0.019 323.02)",500:"oklch(54.2% 0.034 322.5)",600:"oklch(43.5% 0.029 321.78)",700:"oklch(36.4% 0.029 323.89)",800:"oklch(26.3% 0.024 320.12)",900:"oklch(21.2% 0.019 322.12)",950:"oklch(14.5% 0.008 326)"},olive:{50:"oklch(98.8% 0.003 106.5)",100:"oklch(96.6% 0.005 106.5)",200:"oklch(93% 0.007 106.5)",300:"oklch(88% 0.011 106.6)",400:"oklch(73.7% 0.021 106.9)",500:"oklch(58% 0.031 107.3)",600:"oklch(46.6% 0.025 107.3)",700:"oklch(39.4% 0.023 107.4)",800:"oklch(28.6% 0.016 107.4)",900:"oklch(22.8% 0.013 107.4)",950:"oklch(15.3% 0.006 107.1)"},mist:{50:"oklch(98.7% 0.002 197.1)",100:"oklch(96.3% 0.002 197.1)",200:"oklch(92.5% 0.005 214.3)",300:"oklch(87.2% 0.007 219.6)",400:"oklch(72.3% 0.014 214.4)",500:"oklch(56% 0.021 213.5)",600:"oklch(45% 0.017 213.2)",700:"oklch(37.8% 0.015 216)",800:"oklch(27.5% 0.011 216.9)",900:"oklch(21.8% 0.008 223.9)",950:"oklch(14.8% 0.004 228.8)"},taupe:{50:"oklch(98.6% 0.002 67.8)",100:"oklch(96% 0.002 17.2)",200:"oklch(92.2% 0.005 34.3)",300:"oklch(86.8% 0.007 39.5)",400:"oklch(71.4% 0.014 41.2)",500:"oklch(54.7% 0.021 43.1)",600:"oklch(43.8% 0.017 39.3)",700:"oklch(36.7% 0.016 35.7)",800:"oklch(26.8% 0.011 36.5)",900:"oklch(21.4% 0.009 43.1)",950:"oklch(14.7% 0.004 49.3)"},red:{50:"oklch(97.1% 0.013 17.38)",100:"oklch(93.6% 0.032 17.717)",200:"oklch(88.5% 0.062 18.334)",300:"oklch(80.8% 0.114 19.571)",400:"oklch(70.4% 0.191 22.216)",500:"oklch(63.7% 0.237 25.331)",600:"oklch(57.7% 0.245 27.325)",700:"oklch(50.5% 0.213 27.518)",800:"oklch(44.4% 0.177 26.899)",900:"oklch(39.6% 0.141 25.723)",950:"oklch(25.8% 0.092 26.042)"},orange:{50:"oklch(98% 0.016 73.684)",100:"oklch(95.4% 0.038 75.164)",200:"oklch(90.1% 0.076 70.697)",300:"oklch(83.7% 0.128 66.29)",400:"oklch(75% 0.183 55.934)",500:"oklch(70.5% 0.213 47.604)",600:"oklch(64.6% 0.222 41.116)",700:"oklch(55.3% 0.195 38.402)",800:"oklch(47% 0.157 37.304)",900:"oklch(40.8% 0.123 38.172)",950:"oklch(26.6% 0.079 36.259)"},amber:{50:"oklch(98.7% 0.022 95.277)",100:"oklch(96.2% 0.059 95.617)",200:"oklch(92.4% 0.12 95.746)",300:"oklch(87.9% 0.169 91.605)",400:"oklch(82.8% 0.189 84.429)",500:"oklch(76.9% 0.188 70.08)",600:"oklch(66.6% 0.179 58.318)",700:"oklch(55.5% 0.163 48.998)",800:"oklch(47.3% 0.137 46.201)",900:"oklch(41.4% 0.112 45.904)",950:"oklch(27.9% 0.077 45.635)"},yellow:{50:"oklch(98.7% 0.026 102.212)",100:"oklch(97.3% 0.071 103.193)",200:"oklch(94.5% 0.129 101.54)",300:"oklch(90.5% 0.182 98.111)",400:"oklch(85.2% 0.199 91.936)",500:"oklch(79.5% 0.184 86.047)",600:"oklch(68.1% 0.162 75.834)",700:"oklch(55.4% 0.135 66.442)",800:"oklch(47.6% 0.114 61.907)",900:"oklch(42.1% 0.095 57.708)",950:"oklch(28.6% 0.066 53.813)"},lime:{50:"oklch(98.6% 0.031 120.757)",100:"oklch(96.7% 0.067 122.328)",200:"oklch(93.8% 0.127 124.321)",300:"oklch(89.7% 0.196 126.665)",400:"oklch(84.1% 0.238 128.85)",500:"oklch(76.8% 0.233 130.85)",600:"oklch(64.8% 0.2 131.684)",700:"oklch(53.2% 0.157 131.589)",800:"oklch(45.3% 0.124 130.933)",900:"oklch(40.5% 0.101 131.063)",950:"oklch(27.4% 0.072 132.109)"},green:{50:"oklch(98.2% 0.018 155.826)",100:"oklch(96.2% 0.044 156.743)",200:"oklch(92.5% 0.084 155.995)",300:"oklch(87.1% 0.15 154.449)",400:"oklch(79.2% 0.209 151.711)",500:"oklch(72.3% 0.219 149.579)",600:"oklch(62.7% 0.194 149.214)",700:"oklch(52.7% 0.154 150.069)",800:"oklch(44.8% 0.119 151.328)",900:"oklch(39.3% 0.095 152.535)",950:"oklch(26.6% 0.065 152.934)"},emerald:{50:"oklch(97.9% 0.021 166.113)",100:"oklch(95% 0.052 163.051)",200:"oklch(90.5% 0.093 164.15)",300:"oklch(84.5% 0.143 164.978)",400:"oklch(76.5% 0.177 163.223)",500:"oklch(69.6% 0.17 162.48)",600:"oklch(59.6% 0.145 163.225)",700:"oklch(50.8% 0.118 165.612)",800:"oklch(43.2% 0.095 166.913)",900:"oklch(37.8% 0.077 168.94)",950:"oklch(26.2% 0.051 172.552)"},teal:{50:"oklch(98.4% 0.014 180.72)",100:"oklch(95.3% 0.051 180.801)",200:"oklch(91% 0.096 180.426)",300:"oklch(85.5% 0.138 181.071)",400:"oklch(77.7% 0.152 181.912)",500:"oklch(70.4% 0.14 182.503)",600:"oklch(60% 0.118 184.704)",700:"oklch(51.1% 0.096 186.391)",800:"oklch(43.7% 0.078 188.216)",900:"oklch(38.6% 0.063 188.416)",950:"oklch(27.7% 0.046 192.524)"},cyan:{50:"oklch(98.4% 0.019 200.873)",100:"oklch(95.6% 0.045 203.388)",200:"oklch(91.7% 0.08 205.041)",300:"oklch(86.5% 0.127 207.078)",400:"oklch(78.9% 0.154 211.53)",500:"oklch(71.5% 0.143 215.221)",600:"oklch(60.9% 0.126 221.723)",700:"oklch(52% 0.105 223.128)",800:"oklch(45% 0.085 224.283)",900:"oklch(39.8% 0.07 227.392)",950:"oklch(30.2% 0.056 229.695)"},sky:{50:"oklch(97.7% 0.013 236.62)",100:"oklch(95.1% 0.026 236.824)",200:"oklch(90.1% 0.058 230.902)",300:"oklch(82.8% 0.111 230.318)",400:"oklch(74.6% 0.16 232.661)",500:"oklch(68.5% 0.169 237.323)",600:"oklch(58.8% 0.158 241.966)",700:"oklch(50% 0.134 242.749)",800:"oklch(44.3% 0.11 240.79)",900:"oklch(39.1% 0.09 240.876)",950:"oklch(29.3% 0.066 243.157)"},blue:{50:"oklch(97% 0.014 254.604)",100:"oklch(93.2% 0.032 255.585)",200:"oklch(88.2% 0.059 254.128)",300:"oklch(80.9% 0.105 251.813)",400:"oklch(70.7% 0.165 254.624)",500:"oklch(62.3% 0.214 259.815)",600:"oklch(54.6% 0.245 262.881)",700:"oklch(48.8% 0.243 264.376)",800:"oklch(42.4% 0.199 265.638)",900:"oklch(37.9% 0.146 265.522)",950:"oklch(28.2% 0.091 267.935)"},indigo:{50:"oklch(96.2% 0.018 272.314)",100:"oklch(93% 0.034 272.788)",200:"oklch(87% 0.065 274.039)",300:"oklch(78.5% 0.115 274.713)",400:"oklch(67.3% 0.182 276.935)",500:"oklch(58.5% 0.233 277.117)",600:"oklch(51.1% 0.262 276.966)",700:"oklch(45.7% 0.24 277.023)",800:"oklch(39.8% 0.195 277.366)",900:"oklch(35.9% 0.144 278.697)",950:"oklch(25.7% 0.09 281.288)"},violet:{50:"oklch(96.9% 0.016 293.756)",100:"oklch(94.3% 0.029 294.588)",200:"oklch(89.4% 0.057 293.283)",300:"oklch(81.1% 0.111 293.571)",400:"oklch(70.2% 0.183 293.541)",500:"oklch(60.6% 0.25 292.717)",600:"oklch(54.1% 0.281 293.009)",700:"oklch(49.1% 0.27 292.581)",800:"oklch(43.2% 0.232 292.759)",900:"oklch(38% 0.189 293.745)",950:"oklch(28.3% 0.141 291.089)"},purple:{50:"oklch(97.7% 0.014 308.299)",100:"oklch(94.6% 0.033 307.174)",200:"oklch(90.2% 0.063 306.703)",300:"oklch(82.7% 0.119 306.383)",400:"oklch(71.4% 0.203 305.504)",500:"oklch(62.7% 0.265 303.9)",600:"oklch(55.8% 0.288 302.321)",700:"oklch(49.6% 0.265 301.924)",800:"oklch(43.8% 0.218 303.724)",900:"oklch(38.1% 0.176 304.987)",950:"oklch(29.1% 0.149 302.717)"},fuchsia:{50:"oklch(97.7% 0.017 320.058)",100:"oklch(95.2% 0.037 318.852)",200:"oklch(90.3% 0.076 319.62)",300:"oklch(83.3% 0.145 321.434)",400:"oklch(74% 0.238 322.16)",500:"oklch(66.7% 0.295 322.15)",600:"oklch(59.1% 0.293 322.896)",700:"oklch(51.8% 0.253 323.949)",800:"oklch(45.2% 0.211 324.591)",900:"oklch(40.1% 0.17 325.612)",950:"oklch(29.3% 0.136 325.661)"},pink:{50:"oklch(97.1% 0.014 343.198)",100:"oklch(94.8% 0.028 342.258)",200:"oklch(89.9% 0.061 343.231)",300:"oklch(82.3% 0.12 346.018)",400:"oklch(71.8% 0.202 349.761)",500:"oklch(65.6% 0.241 354.308)",600:"oklch(59.2% 0.249 0.584)",700:"oklch(52.5% 0.223 3.958)",800:"oklch(45.9% 0.187 3.815)",900:"oklch(40.8% 0.153 2.432)",950:"oklch(28.4% 0.109 3.907)"},rose:{50:"oklch(96.9% 0.015 12.422)",100:"oklch(94.1% 0.03 12.58)",200:"oklch(89.2% 0.058 10.001)",300:"oklch(81% 0.117 11.638)",400:"oklch(71.2% 0.194 13.428)",500:"oklch(64.5% 0.246 16.439)",600:"oklch(58.6% 0.253 17.585)",700:"oklch(51.4% 0.222 16.935)",800:"oklch(45.5% 0.188 13.697)",900:"oklch(41% 0.159 10.272)",950:"oklch(27.1% 0.105 12.094)"}};export{l as a};
+1
dist/chunk-XVOTX5KS.mjs
import{a as k}from"./chunk-X4GG3EDV.mjs";var S=new Set(["black","silver","gray","white","maroon","red","purple","fuchsia","green","lime","olive","yellow","navy","blue","teal","aqua","aliceblue","antiquewhite","aqua","aquamarine","azure","beige","bisque","black","blanchedalmond","blue","blueviolet","brown","burlywood","cadetblue","chartreuse","chocolate","coral","cornflowerblue","cornsilk","crimson","cyan","darkblue","darkcyan","darkgoldenrod","darkgray","darkgreen","darkgrey","darkkhaki","darkmagenta","darkolivegreen","darkorange","darkorchid","darkred","darksalmon","darkseagreen","darkslateblue","darkslategray","darkslategrey","darkturquoise","darkviolet","deeppink","deepskyblue","dimgray","dimgrey","dodgerblue","firebrick","floralwhite","forestgreen","fuchsia","gainsboro","ghostwhite","gold","goldenrod","gray","green","greenyellow","grey","honeydew","hotpink","indianred","indigo","ivory","khaki","lavender","lavenderblush","lawngreen","lemonchiffon","lightblue","lightcoral","lightcyan","lightgoldenrodyellow","lightgray","lightgreen","lightgrey","lightpink","lightsalmon","lightseagreen","lightskyblue","lightslategray","lightslategrey","lightsteelblue","lightyellow","lime","limegreen","linen","magenta","maroon","mediumaquamarine","mediumblue","mediumorchid","mediumpurple","mediumseagreen","mediumslateblue","mediumspringgreen","mediumturquoise","mediumvioletred","midnightblue","mintcream","mistyrose","moccasin","navajowhite","navy","oldlace","olive","olivedrab","orange","orangered","orchid","palegoldenrod","palegreen","paleturquoise","palevioletred","papayawhip","peachpuff","peru","pink","plum","powderblue","purple","rebeccapurple","red","rosybrown","royalblue","saddlebrown","salmon","sandybrown","seagreen","seashell","sienna","silver","skyblue","slateblue","slategray","slategrey","snow","springgreen","steelblue","tan","teal","thistle","tomato","turquoise","violet","wheat","white","whitesmoke","yellow","yellowgreen","transparent","currentcolor","canvas","canvastext","linktext","visitedtext","activetext","buttonface","buttontext","buttonborder","field","fieldtext","highlight","highlighttext","selecteditem","selecteditemtext","mark","marktext","graytext","accentcolor","accentcolortext"]),U=/^(rgba?|hsla?|hwb|color|(ok)?(lab|lch)|light-dark|color-mix)\(/i;function R(e){return e.charCodeAt(0)===35||U.test(e)||S.has(e.toLowerCase())}function ne(e){return S.has(e.toLowerCase())}var A=["calc","min","max","clamp","mod","rem","sin","cos","tan","asin","acos","atan","atan2","pow","sqrt","hypot","log","exp","round"];function b(e){return e.indexOf("(")!==-1&&A.some(t=>e.includes(`${t}(`))}function ie(e){if(!A.some(n=>e.includes(n)))return e;let t="",r=[],s=null,m=null;for(let n=0;n<e.length;n++){let a=e.charCodeAt(n);if(a>=48&&a<=57||s!==null&&(a===37||a>=97&&a<=122||a>=65&&a<=90)?s=n:(m=s,s=null),a===40){t+=e[n];let i=n;for(let p=n-1;p>=0;p--){let c=e.charCodeAt(p);if(c>=48&&c<=57)i=p;else if(c>=97&&c<=122)i=p;else break}let o=e.slice(i,n);if(A.includes(o)){r.unshift(!0);continue}else if(r[0]&&o===""){r.unshift(!0);continue}r.unshift(!1);continue}else if(a===41)t+=e[n],r.shift();else if(a===44&&r[0]){t+=", ";continue}else{if(a===32&&r[0]&&t.charCodeAt(t.length-1)===32)continue;if((a===43||a===42||a===47||a===45)&&r[0]){let i=t.trimEnd(),o=i.charCodeAt(i.length-1),p=i.charCodeAt(i.length-2),c=e.charCodeAt(n+1);if((o===101||o===69)&&p>=48&&p<=57){t+=e[n];continue}else if(o===43||o===42||o===47||o===45){t+=e[n];continue}else if(o===40||o===44){t+=e[n];continue}else e.charCodeAt(n-1)===32?t+=`${e[n]} `:o>=48&&o<=57||c>=48&&c<=57||o===41||c===40||c===43||c===42||c===47||c===45||m!==null&&m===n-1?t+=` ${e[n]} `:t+=e[n]}else t+=e[n]}}return t}var E=new Uint8Array(256);function d(e,t){let r=0,s=[],m=0,n=e.length,a=t.charCodeAt(0);for(let i=0;i<n;i++){let o=e.charCodeAt(i);if(r===0&&o===a){s.push(e.slice(m,i)),m=i+1;continue}switch(o){case 92:i+=1;break;case 39:case 34:for(;++i<n;){let p=e.charCodeAt(i);if(p===92){i+=1;continue}if(p===o)break}break;case 40:E[r]=41,r++;break;case 91:E[r]=93,r++;break;case 123:E[r]=125,r++;break;case 93:case 125:case 41:r>0&&o===E[r-1]&&r--;break}}return s.push(e.slice(m)),s}var P={color:R,length:y,percentage:C,ratio:G,number:v,integer:u,url:N,position:K,"bg-size":Y,"line-width":T,image:F,"family-name":M,"generic-name":H,"absolute-size":$,"relative-size":W,angle:X,vector:te};function pe(e,t){if(e.startsWith("var("))return null;for(let r of t)if(P[r]?.(e))return r;return null}var z=/^url\(.*\)$/;function N(e){return z.test(e)}function T(e){return d(e," ").every(t=>y(t)||v(t)||t==="thin"||t==="medium"||t==="thick")}var D=/^(?:element|image|cross-fade|image-set)\(/,I=/^(repeating-)?(conic|linear|radial)-gradient\(/;function F(e){let t=0;for(let r of d(e,","))if(!r.startsWith("var(")){if(N(r)){t+=1;continue}if(I.test(r)){t+=1;continue}if(D.test(r)){t+=1;continue}return!1}return t>0}function H(e){return e==="serif"||e==="sans-serif"||e==="monospace"||e==="cursive"||e==="fantasy"||e==="system-ui"||e==="ui-serif"||e==="ui-sans-serif"||e==="ui-monospace"||e==="ui-rounded"||e==="math"||e==="emoji"||e==="fangsong"}function M(e){let t=0;for(let r of d(e,",")){let s=r.charCodeAt(0);if(s>=48&&s<=57)return!1;r.startsWith("var(")||(t+=1)}return t>0}function $(e){return e==="xx-small"||e==="x-small"||e==="small"||e==="medium"||e==="large"||e==="x-large"||e==="xx-large"||e==="xxx-large"}function W(e){return e==="larger"||e==="smaller"}var x=/[+-]?\d*\.?\d+(?:[eE][+-]?\d+)?/,B=new RegExp(`^${x.source}$`);function v(e){return B.test(e)||b(e)}var q=new RegExp(`^${x.source}%$`);function C(e){return q.test(e)||b(e)}var V=new RegExp(`^${x.source}\\s*/\\s*${x.source}$`);function G(e){return V.test(e)||b(e)}var Z=["cm","mm","Q","in","pc","pt","px","em","ex","ch","rem","lh","rlh","vw","vh","vmin","vmax","vb","vi","svw","svh","lvw","lvh","dvw","dvh","cqw","cqh","cqi","cqb","cqmin","cqmax"],j=new RegExp(`^${x.source}(${Z.join("|")})$`);function y(e){return j.test(e)||b(e)}function K(e){let t=0;for(let r of d(e," ")){if(r==="center"||r==="top"||r==="right"||r==="bottom"||r==="left"){t+=1;continue}if(!r.startsWith("var(")){if(y(r)||C(r)){t+=1;continue}return!1}}return t>0}function Y(e){let t=0;for(let r of d(e,",")){if(r==="cover"||r==="contain"){t+=1;continue}let s=d(r," ");if(s.length!==1&&s.length!==2)return!1;if(s.every(m=>m==="auto"||y(m)||C(m))){t+=1;continue}}return t>0}var Q=["deg","rad","grad","turn"],J=new RegExp(`^${x.source}(${Q.join("|")})$`);function X(e){return J.test(e)}var ee=new RegExp(`^${x.source} +${x.source} +${x.source}$`);function te(e){return ee.test(e)}function u(e){let t=Number(e);return Number.isInteger(t)&&t>=0&&String(t)===String(e)}function ge(e){let t=Number(e);return Number.isInteger(t)&&t>0&&String(t)===String(e)}function ue(e){return O(e,.25)}function de(e){return O(e,.25)}function O(e,t){let r=Number(e);return r>=0&&r%t===0&&String(r)===String(e)}function h(e){return{__BARE_VALUE__:e}}var g=h(e=>{if(u(e.value))return e.value}),l=h(e=>{if(u(e.value))return`${e.value}%`}),f=h(e=>{if(u(e.value))return`${e.value}px`}),L=h(e=>{if(u(e.value))return`${e.value}ms`}),w=h(e=>{if(u(e.value))return`${e.value}deg`}),re=h(e=>{if(e.fraction===null)return;let[t,r]=d(e.fraction,"/");if(!(!u(t)||!u(r)))return e.fraction}),_=h(e=>{if(u(Number(e.value)))return`repeat(${e.value}, minmax(0, 1fr))`}),Ee={accentColor:({theme:e})=>e("colors"),animation:{none:"none",spin:"spin 1s linear infinite",ping:"ping 1s cubic-bezier(0, 0, 0.2, 1) infinite",pulse:"pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite",bounce:"bounce 1s infinite"},aria:{busy:'busy="true"',checked:'checked="true"',disabled:'disabled="true"',expanded:'expanded="true"',hidden:'hidden="true"',pressed:'pressed="true"',readonly:'readonly="true"',required:'required="true"',selected:'selected="true"'},aspectRatio:{auto:"auto",square:"1 / 1",video:"16 / 9",...re},backdropBlur:({theme:e})=>e("blur"),backdropBrightness:({theme:e})=>({...e("brightness"),...l}),backdropContrast:({theme:e})=>({...e("contrast"),...l}),backdropGrayscale:({theme:e})=>({...e("grayscale"),...l}),backdropHueRotate:({theme:e})=>({...e("hueRotate"),...w}),backdropInvert:({theme:e})=>({...e("invert"),...l}),backdropOpacity:({theme:e})=>({...e("opacity"),...l}),backdropSaturate:({theme:e})=>({...e("saturate"),...l}),backdropSepia:({theme:e})=>({...e("sepia"),...l}),backgroundColor:({theme:e})=>e("colors"),backgroundImage:{none:"none","gradient-to-t":"linear-gradient(to top, var(--tw-gradient-stops))","gradient-to-tr":"linear-gradient(to top right, var(--tw-gradient-stops))","gradient-to-r":"linear-gradient(to right, var(--tw-gradient-stops))","gradient-to-br":"linear-gradient(to bottom right, var(--tw-gradient-stops))","gradient-to-b":"linear-gradient(to bottom, var(--tw-gradient-stops))","gradient-to-bl":"linear-gradient(to bottom left, var(--tw-gradient-stops))","gradient-to-l":"linear-gradient(to left, var(--tw-gradient-stops))","gradient-to-tl":"linear-gradient(to top left, var(--tw-gradient-stops))"},backgroundOpacity:({theme:e})=>e("opacity"),backgroundPosition:{bottom:"bottom",center:"center",left:"left","left-bottom":"left bottom","left-top":"left top",right:"right","right-bottom":"right bottom","right-top":"right top",top:"top"},backgroundSize:{auto:"auto",cover:"cover",contain:"contain"},blur:{0:"0",none:"",sm:"4px",DEFAULT:"8px",md:"12px",lg:"16px",xl:"24px","2xl":"40px","3xl":"64px"},borderColor:({theme:e})=>({DEFAULT:"currentcolor",...e("colors")}),borderOpacity:({theme:e})=>e("opacity"),borderRadius:{none:"0px",sm:"0.125rem",DEFAULT:"0.25rem",md:"0.375rem",lg:"0.5rem",xl:"0.75rem","2xl":"1rem","3xl":"1.5rem",full:"9999px"},borderSpacing:({theme:e})=>e("spacing"),borderWidth:{DEFAULT:"1px",0:"0px",2:"2px",4:"4px",8:"8px",...f},boxShadow:{sm:"0 1px 2px 0 rgb(0 0 0 / 0.05)",DEFAULT:"0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)",md:"0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)",lg:"0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)",xl:"0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)","2xl":"0 25px 50px -12px rgb(0 0 0 / 0.25)",inner:"inset 0 2px 4px 0 rgb(0 0 0 / 0.05)",none:"none"},boxShadowColor:({theme:e})=>e("colors"),brightness:{0:"0",50:".5",75:".75",90:".9",95:".95",100:"1",105:"1.05",110:"1.1",125:"1.25",150:"1.5",200:"2",...l},caretColor:({theme:e})=>e("colors"),colors:()=>({...k}),columns:{auto:"auto",1:"1",2:"2",3:"3",4:"4",5:"5",6:"6",7:"7",8:"8",9:"9",10:"10",11:"11",12:"12","3xs":"16rem","2xs":"18rem",xs:"20rem",sm:"24rem",md:"28rem",lg:"32rem",xl:"36rem","2xl":"42rem","3xl":"48rem","4xl":"56rem","5xl":"64rem","6xl":"72rem","7xl":"80rem",...g},container:{},content:{none:"none"},contrast:{0:"0",50:".5",75:".75",100:"1",125:"1.25",150:"1.5",200:"2",...l},cursor:{auto:"auto",default:"default",pointer:"pointer",wait:"wait",text:"text",move:"move",help:"help","not-allowed":"not-allowed",none:"none","context-menu":"context-menu",progress:"progress",cell:"cell",crosshair:"crosshair","vertical-text":"vertical-text",alias:"alias",copy:"copy","no-drop":"no-drop",grab:"grab",grabbing:"grabbing","all-scroll":"all-scroll","col-resize":"col-resize","row-resize":"row-resize","n-resize":"n-resize","e-resize":"e-resize","s-resize":"s-resize","w-resize":"w-resize","ne-resize":"ne-resize","nw-resize":"nw-resize","se-resize":"se-resize","sw-resize":"sw-resize","ew-resize":"ew-resize","ns-resize":"ns-resize","nesw-resize":"nesw-resize","nwse-resize":"nwse-resize","zoom-in":"zoom-in","zoom-out":"zoom-out"},divideColor:({theme:e})=>e("borderColor"),divideOpacity:({theme:e})=>e("borderOpacity"),divideWidth:({theme:e})=>({...e("borderWidth"),...f}),dropShadow:{sm:"0 1px 1px rgb(0 0 0 / 0.05)",DEFAULT:["0 1px 2px rgb(0 0 0 / 0.1)","0 1px 1px rgb(0 0 0 / 0.06)"],md:["0 4px 3px rgb(0 0 0 / 0.07)","0 2px 2px rgb(0 0 0 / 0.06)"],lg:["0 10px 8px rgb(0 0 0 / 0.04)","0 4px 3px rgb(0 0 0 / 0.1)"],xl:["0 20px 13px rgb(0 0 0 / 0.03)","0 8px 5px rgb(0 0 0 / 0.08)"],"2xl":"0 25px 25px rgb(0 0 0 / 0.15)",none:"0 0 #0000"},fill:({theme:e})=>e("colors"),flex:{1:"1 1 0%",auto:"1 1 auto",initial:"0 1 auto",none:"none"},flexBasis:({theme:e})=>({auto:"auto","1/2":"50%","1/3":"33.333333%","2/3":"66.666667%","1/4":"25%","2/4":"50%","3/4":"75%","1/5":"20%","2/5":"40%","3/5":"60%","4/5":"80%","1/6":"16.666667%","2/6":"33.333333%","3/6":"50%","4/6":"66.666667%","5/6":"83.333333%","1/12":"8.333333%","2/12":"16.666667%","3/12":"25%","4/12":"33.333333%","5/12":"41.666667%","6/12":"50%","7/12":"58.333333%","8/12":"66.666667%","9/12":"75%","10/12":"83.333333%","11/12":"91.666667%",full:"100%",...e("spacing")}),flexGrow:{0:"0",DEFAULT:"1",...g},flexShrink:{0:"0",DEFAULT:"1",...g},fontFamily:{sans:["ui-sans-serif","system-ui","sans-serif",'"Apple Color Emoji"','"Segoe UI Emoji"','"Segoe UI Symbol"','"Noto Color Emoji"'],serif:["ui-serif","Georgia","Cambria",'"Times New Roman"',"Times","serif"],mono:["ui-monospace","SFMono-Regular","Menlo","Monaco","Consolas",'"Liberation Mono"','"Courier New"',"monospace"]},fontSize:{xs:["0.75rem",{lineHeight:"1rem"}],sm:["0.875rem",{lineHeight:"1.25rem"}],base:["1rem",{lineHeight:"1.5rem"}],lg:["1.125rem",{lineHeight:"1.75rem"}],xl:["1.25rem",{lineHeight:"1.75rem"}],"2xl":["1.5rem",{lineHeight:"2rem"}],"3xl":["1.875rem",{lineHeight:"2.25rem"}],"4xl":["2.25rem",{lineHeight:"2.5rem"}],"5xl":["3rem",{lineHeight:"1"}],"6xl":["3.75rem",{lineHeight:"1"}],"7xl":["4.5rem",{lineHeight:"1"}],"8xl":["6rem",{lineHeight:"1"}],"9xl":["8rem",{lineHeight:"1"}]},fontWeight:{thin:"100",extralight:"200",light:"300",normal:"400",medium:"500",semibold:"600",bold:"700",extrabold:"800",black:"900"},gap:({theme:e})=>e("spacing"),gradientColorStops:({theme:e})=>e("colors"),gradientColorStopPositions:{"0%":"0%","5%":"5%","10%":"10%","15%":"15%","20%":"20%","25%":"25%","30%":"30%","35%":"35%","40%":"40%","45%":"45%","50%":"50%","55%":"55%","60%":"60%","65%":"65%","70%":"70%","75%":"75%","80%":"80%","85%":"85%","90%":"90%","95%":"95%","100%":"100%",...l},grayscale:{0:"0",DEFAULT:"100%",...l},gridAutoColumns:{auto:"auto",min:"min-content",max:"max-content",fr:"minmax(0, 1fr)"},gridAutoRows:{auto:"auto",min:"min-content",max:"max-content",fr:"minmax(0, 1fr)"},gridColumn:{auto:"auto","span-1":"span 1 / span 1","span-2":"span 2 / span 2","span-3":"span 3 / span 3","span-4":"span 4 / span 4","span-5":"span 5 / span 5","span-6":"span 6 / span 6","span-7":"span 7 / span 7","span-8":"span 8 / span 8","span-9":"span 9 / span 9","span-10":"span 10 / span 10","span-11":"span 11 / span 11","span-12":"span 12 / span 12","span-full":"1 / -1"},gridColumnEnd:{auto:"auto",1:"1",2:"2",3:"3",4:"4",5:"5",6:"6",7:"7",8:"8",9:"9",10:"10",11:"11",12:"12",13:"13",...g},gridColumnStart:{auto:"auto",1:"1",2:"2",3:"3",4:"4",5:"5",6:"6",7:"7",8:"8",9:"9",10:"10",11:"11",12:"12",13:"13",...g},gridRow:{auto:"auto","span-1":"span 1 / span 1","span-2":"span 2 / span 2","span-3":"span 3 / span 3","span-4":"span 4 / span 4","span-5":"span 5 / span 5","span-6":"span 6 / span 6","span-7":"span 7 / span 7","span-8":"span 8 / span 8","span-9":"span 9 / span 9","span-10":"span 10 / span 10","span-11":"span 11 / span 11","span-12":"span 12 / span 12","span-full":"1 / -1"},gridRowEnd:{auto:"auto",1:"1",2:"2",3:"3",4:"4",5:"5",6:"6",7:"7",8:"8",9:"9",10:"10",11:"11",12:"12",13:"13",...g},gridRowStart:{auto:"auto",1:"1",2:"2",3:"3",4:"4",5:"5",6:"6",7:"7",8:"8",9:"9",10:"10",11:"11",12:"12",13:"13",...g},gridTemplateColumns:{none:"none",subgrid:"subgrid",1:"repeat(1, minmax(0, 1fr))",2:"repeat(2, minmax(0, 1fr))",3:"repeat(3, minmax(0, 1fr))",4:"repeat(4, minmax(0, 1fr))",5:"repeat(5, minmax(0, 1fr))",6:"repeat(6, minmax(0, 1fr))",7:"repeat(7, minmax(0, 1fr))",8:"repeat(8, minmax(0, 1fr))",9:"repeat(9, minmax(0, 1fr))",10:"repeat(10, minmax(0, 1fr))",11:"repeat(11, minmax(0, 1fr))",12:"repeat(12, minmax(0, 1fr))",..._},gridTemplateRows:{none:"none",subgrid:"subgrid",1:"repeat(1, minmax(0, 1fr))",2:"repeat(2, minmax(0, 1fr))",3:"repeat(3, minmax(0, 1fr))",4:"repeat(4, minmax(0, 1fr))",5:"repeat(5, minmax(0, 1fr))",6:"repeat(6, minmax(0, 1fr))",7:"repeat(7, minmax(0, 1fr))",8:"repeat(8, minmax(0, 1fr))",9:"repeat(9, minmax(0, 1fr))",10:"repeat(10, minmax(0, 1fr))",11:"repeat(11, minmax(0, 1fr))",12:"repeat(12, minmax(0, 1fr))",..._},height:({theme:e})=>({auto:"auto","1/2":"50%","1/3":"33.333333%","2/3":"66.666667%","1/4":"25%","2/4":"50%","3/4":"75%","1/5":"20%","2/5":"40%","3/5":"60%","4/5":"80%","1/6":"16.666667%","2/6":"33.333333%","3/6":"50%","4/6":"66.666667%","5/6":"83.333333%",full:"100%",screen:"100vh",svh:"100svh",lvh:"100lvh",dvh:"100dvh",min:"min-content",max:"max-content",fit:"fit-content",...e("spacing")}),hueRotate:{0:"0deg",15:"15deg",30:"30deg",60:"60deg",90:"90deg",180:"180deg",...w},inset:({theme:e})=>({auto:"auto","1/2":"50%","1/3":"33.333333%","2/3":"66.666667%","1/4":"25%","2/4":"50%","3/4":"75%",full:"100%",...e("spacing")}),invert:{0:"0",DEFAULT:"100%",...l},keyframes:{spin:{to:{transform:"rotate(360deg)"}},ping:{"75%, 100%":{transform:"scale(2)",opacity:"0"}},pulse:{"50%":{opacity:".5"}},bounce:{"0%, 100%":{transform:"translateY(-25%)",animationTimingFunction:"cubic-bezier(0.8,0,1,1)"},"50%":{transform:"none",animationTimingFunction:"cubic-bezier(0,0,0.2,1)"}}},letterSpacing:{tighter:"-0.05em",tight:"-0.025em",normal:"0em",wide:"0.025em",wider:"0.05em",widest:"0.1em"},lineHeight:{none:"1",tight:"1.25",snug:"1.375",normal:"1.5",relaxed:"1.625",loose:"2",3:".75rem",4:"1rem",5:"1.25rem",6:"1.5rem",7:"1.75rem",8:"2rem",9:"2.25rem",10:"2.5rem"},listStyleType:{none:"none",disc:"disc",decimal:"decimal"},listStyleImage:{none:"none"},margin:({theme:e})=>({auto:"auto",...e("spacing")}),lineClamp:{1:"1",2:"2",3:"3",4:"4",5:"5",6:"6",...g},maxHeight:({theme:e})=>({none:"none",full:"100%",screen:"100vh",svh:"100svh",lvh:"100lvh",dvh:"100dvh",min:"min-content",max:"max-content",fit:"fit-content",...e("spacing")}),maxWidth:({theme:e})=>({none:"none",xs:"20rem",sm:"24rem",md:"28rem",lg:"32rem",xl:"36rem","2xl":"42rem","3xl":"48rem","4xl":"56rem","5xl":"64rem","6xl":"72rem","7xl":"80rem",full:"100%",min:"min-content",max:"max-content",fit:"fit-content",prose:"65ch",...e("spacing")}),minHeight:({theme:e})=>({full:"100%",screen:"100vh",svh:"100svh",lvh:"100lvh",dvh:"100dvh",min:"min-content",max:"max-content",fit:"fit-content",...e("spacing")}),minWidth:({theme:e})=>({full:"100%",min:"min-content",max:"max-content",fit:"fit-content",...e("spacing")}),objectPosition:{bottom:"bottom",center:"center",left:"left","left-bottom":"left bottom","left-top":"left top",right:"right","right-bottom":"right bottom","right-top":"right top",top:"top"},opacity:{0:"0",5:"0.05",10:"0.1",15:"0.15",20:"0.2",25:"0.25",30:"0.3",35:"0.35",40:"0.4",45:"0.45",50:"0.5",55:"0.55",60:"0.6",65:"0.65",70:"0.7",75:"0.75",80:"0.8",85:"0.85",90:"0.9",95:"0.95",100:"1",...l},order:{first:"-9999",last:"9999",none:"0",1:"1",2:"2",3:"3",4:"4",5:"5",6:"6",7:"7",8:"8",9:"9",10:"10",11:"11",12:"12",...g},outlineColor:({theme:e})=>e("colors"),outlineOffset:{0:"0px",1:"1px",2:"2px",4:"4px",8:"8px",...f},outlineWidth:{0:"0px",1:"1px",2:"2px",4:"4px",8:"8px",...f},padding:({theme:e})=>e("spacing"),placeholderColor:({theme:e})=>e("colors"),placeholderOpacity:({theme:e})=>e("opacity"),ringColor:({theme:e})=>({DEFAULT:"currentcolor",...e("colors")}),ringOffsetColor:({theme:e})=>e("colors"),ringOffsetWidth:{0:"0px",1:"1px",2:"2px",4:"4px",8:"8px",...f},ringOpacity:({theme:e})=>({DEFAULT:"0.5",...e("opacity")}),ringWidth:{DEFAULT:"3px",0:"0px",1:"1px",2:"2px",4:"4px",8:"8px",...f},rotate:{0:"0deg",1:"1deg",2:"2deg",3:"3deg",6:"6deg",12:"12deg",45:"45deg",90:"90deg",180:"180deg",...w},saturate:{0:"0",50:".5",100:"1",150:"1.5",200:"2",...l},scale:{0:"0",50:".5",75:".75",90:".9",95:".95",100:"1",105:"1.05",110:"1.1",125:"1.25",150:"1.5",...l},screens:{sm:"40rem",md:"48rem",lg:"64rem",xl:"80rem","2xl":"96rem"},scrollMargin:({theme:e})=>e("spacing"),scrollPadding:({theme:e})=>e("spacing"),sepia:{0:"0",DEFAULT:"100%",...l},skew:{0:"0deg",1:"1deg",2:"2deg",3:"3deg",6:"6deg",12:"12deg",...w},space:({theme:e})=>e("spacing"),spacing:{px:"1px",0:"0px",.5:"0.125rem",1:"0.25rem",1.5:"0.375rem",2:"0.5rem",2.5:"0.625rem",3:"0.75rem",3.5:"0.875rem",4:"1rem",5:"1.25rem",6:"1.5rem",7:"1.75rem",8:"2rem",9:"2.25rem",10:"2.5rem",11:"2.75rem",12:"3rem",14:"3.5rem",16:"4rem",20:"5rem",24:"6rem",28:"7rem",32:"8rem",36:"9rem",40:"10rem",44:"11rem",48:"12rem",52:"13rem",56:"14rem",60:"15rem",64:"16rem",72:"18rem",80:"20rem",96:"24rem"},stroke:({theme:e})=>({none:"none",...e("colors")}),strokeWidth:{0:"0",1:"1",2:"2",...g},supports:{},data:{},textColor:({theme:e})=>e("colors"),textDecorationColor:({theme:e})=>e("colors"),textDecorationThickness:{auto:"auto","from-font":"from-font",0:"0px",1:"1px",2:"2px",4:"4px",8:"8px",...f},textIndent:({theme:e})=>e("spacing"),textOpacity:({theme:e})=>e("opacity"),textUnderlineOffset:{auto:"auto",0:"0px",1:"1px",2:"2px",4:"4px",8:"8px",...f},transformOrigin:{center:"center",top:"top","top-right":"top right",right:"right","bottom-right":"bottom right",bottom:"bottom","bottom-left":"bottom left",left:"left","top-left":"top left"},transitionDelay:{0:"0s",75:"75ms",100:"100ms",150:"150ms",200:"200ms",300:"300ms",500:"500ms",700:"700ms",1e3:"1000ms",...L},transitionDuration:{DEFAULT:"150ms",0:"0s",75:"75ms",100:"100ms",150:"150ms",200:"200ms",300:"300ms",500:"500ms",700:"700ms",1e3:"1000ms",...L},transitionProperty:{none:"none",all:"all",DEFAULT:"color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter",colors:"color, background-color, border-color, outline-color, text-decoration-color, fill, stroke",opacity:"opacity",shadow:"box-shadow",transform:"transform"},transitionTimingFunction:{DEFAULT:"cubic-bezier(0.4, 0, 0.2, 1)",linear:"linear",in:"cubic-bezier(0.4, 0, 1, 1)",out:"cubic-bezier(0, 0, 0.2, 1)","in-out":"cubic-bezier(0.4, 0, 0.2, 1)"},translate:({theme:e})=>({"1/2":"50%","1/3":"33.333333%","2/3":"66.666667%","1/4":"25%","2/4":"50%","3/4":"75%",full:"100%",...e("spacing")}),size:({theme:e})=>({auto:"auto","1/2":"50%","1/3":"33.333333%","2/3":"66.666667%","1/4":"25%","2/4":"50%","3/4":"75%","1/5":"20%","2/5":"40%","3/5":"60%","4/5":"80%","1/6":"16.666667%","2/6":"33.333333%","3/6":"50%","4/6":"66.666667%","5/6":"83.333333%","1/12":"8.333333%","2/12":"16.666667%","3/12":"25%","4/12":"33.333333%","5/12":"41.666667%","6/12":"50%","7/12":"58.333333%","8/12":"66.666667%","9/12":"75%","10/12":"83.333333%","11/12":"91.666667%",full:"100%",min:"min-content",max:"max-content",fit:"fit-content",...e("spacing")}),width:({theme:e})=>({auto:"auto","1/2":"50%","1/3":"33.333333%","2/3":"66.666667%","1/4":"25%","2/4":"50%","3/4":"75%","1/5":"20%","2/5":"40%","3/5":"60%","4/5":"80%","1/6":"16.666667%","2/6":"33.333333%","3/6":"50%","4/6":"66.666667%","5/6":"83.333333%","1/12":"8.333333%","2/12":"16.666667%","3/12":"25%","4/12":"33.333333%","5/12":"41.666667%","6/12":"50%","7/12":"58.333333%","8/12":"66.666667%","9/12":"75%","10/12":"83.333333%","11/12":"91.666667%",full:"100%",screen:"100vw",svw:"100svw",lvw:"100lvw",dvw:"100dvw",min:"min-content",max:"max-content",fit:"fit-content",...e("spacing")}),willChange:{auto:"auto",scroll:"scroll-position",contents:"contents",transform:"transform"},zIndex:{auto:"auto",0:"0",10:"10",20:"20",30:"30",40:"40",50:"50",...g}};export{ie as a,d as b,ne as c,pe as d,y as e,u as f,ge as g,ue as h,de as i,Ee as j};
+347
dist/colors-C__qRT83.d.ts
declare const _default: {
inherit: string;
current: string;
transparent: string;
black: string;
white: string;
slate: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
gray: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
zinc: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
neutral: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
stone: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
mauve: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
olive: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
mist: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
taupe: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
red: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
orange: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
amber: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
yellow: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
lime: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
green: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
emerald: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
teal: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
cyan: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
sky: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
blue: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
indigo: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
violet: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
purple: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
fuchsia: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
pink: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
rose: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
};
export { _default as _ };
+347
dist/colors.d.mts
declare const _default: {
inherit: string;
current: string;
transparent: string;
black: string;
white: string;
slate: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
gray: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
zinc: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
neutral: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
stone: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
mauve: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
olive: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
mist: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
taupe: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
red: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
orange: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
amber: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
yellow: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
lime: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
green: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
emerald: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
teal: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
cyan: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
sky: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
blue: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
indigo: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
violet: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
purple: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
fuchsia: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
pink: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
rose: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
};
export { _default as default };
+5
dist/colors.d.ts
import { _ as _default } from './colors-C__qRT83.js';
export { _default as default };
+1
dist/colors.js
"use strict";var l={inherit:"inherit",current:"currentcolor",transparent:"transparent",black:"#000",white:"#fff",slate:{50:"oklch(98.4% 0.003 247.858)",100:"oklch(96.8% 0.007 247.896)",200:"oklch(92.9% 0.013 255.508)",300:"oklch(86.9% 0.022 252.894)",400:"oklch(70.4% 0.04 256.788)",500:"oklch(55.4% 0.046 257.417)",600:"oklch(44.6% 0.043 257.281)",700:"oklch(37.2% 0.044 257.287)",800:"oklch(27.9% 0.041 260.031)",900:"oklch(20.8% 0.042 265.755)",950:"oklch(12.9% 0.042 264.695)"},gray:{50:"oklch(98.5% 0.002 247.839)",100:"oklch(96.7% 0.003 264.542)",200:"oklch(92.8% 0.006 264.531)",300:"oklch(87.2% 0.01 258.338)",400:"oklch(70.7% 0.022 261.325)",500:"oklch(55.1% 0.027 264.364)",600:"oklch(44.6% 0.03 256.802)",700:"oklch(37.3% 0.034 259.733)",800:"oklch(27.8% 0.033 256.848)",900:"oklch(21% 0.034 264.665)",950:"oklch(13% 0.028 261.692)"},zinc:{50:"oklch(98.5% 0 0)",100:"oklch(96.7% 0.001 286.375)",200:"oklch(92% 0.004 286.32)",300:"oklch(87.1% 0.006 286.286)",400:"oklch(70.5% 0.015 286.067)",500:"oklch(55.2% 0.016 285.938)",600:"oklch(44.2% 0.017 285.786)",700:"oklch(37% 0.013 285.805)",800:"oklch(27.4% 0.006 286.033)",900:"oklch(21% 0.006 285.885)",950:"oklch(14.1% 0.005 285.823)"},neutral:{50:"oklch(98.5% 0 0)",100:"oklch(97% 0 0)",200:"oklch(92.2% 0 0)",300:"oklch(87% 0 0)",400:"oklch(70.8% 0 0)",500:"oklch(55.6% 0 0)",600:"oklch(43.9% 0 0)",700:"oklch(37.1% 0 0)",800:"oklch(26.9% 0 0)",900:"oklch(20.5% 0 0)",950:"oklch(14.5% 0 0)"},stone:{50:"oklch(98.5% 0.001 106.423)",100:"oklch(97% 0.001 106.424)",200:"oklch(92.3% 0.003 48.717)",300:"oklch(86.9% 0.005 56.366)",400:"oklch(70.9% 0.01 56.259)",500:"oklch(55.3% 0.013 58.071)",600:"oklch(44.4% 0.011 73.639)",700:"oklch(37.4% 0.01 67.558)",800:"oklch(26.8% 0.007 34.298)",900:"oklch(21.6% 0.006 56.043)",950:"oklch(14.7% 0.004 49.25)"},mauve:{50:"oklch(98.5% 0 0)",100:"oklch(96% 0.003 325.6)",200:"oklch(92.2% 0.005 325.62)",300:"oklch(86.5% 0.012 325.68)",400:"oklch(71.1% 0.019 323.02)",500:"oklch(54.2% 0.034 322.5)",600:"oklch(43.5% 0.029 321.78)",700:"oklch(36.4% 0.029 323.89)",800:"oklch(26.3% 0.024 320.12)",900:"oklch(21.2% 0.019 322.12)",950:"oklch(14.5% 0.008 326)"},olive:{50:"oklch(98.8% 0.003 106.5)",100:"oklch(96.6% 0.005 106.5)",200:"oklch(93% 0.007 106.5)",300:"oklch(88% 0.011 106.6)",400:"oklch(73.7% 0.021 106.9)",500:"oklch(58% 0.031 107.3)",600:"oklch(46.6% 0.025 107.3)",700:"oklch(39.4% 0.023 107.4)",800:"oklch(28.6% 0.016 107.4)",900:"oklch(22.8% 0.013 107.4)",950:"oklch(15.3% 0.006 107.1)"},mist:{50:"oklch(98.7% 0.002 197.1)",100:"oklch(96.3% 0.002 197.1)",200:"oklch(92.5% 0.005 214.3)",300:"oklch(87.2% 0.007 219.6)",400:"oklch(72.3% 0.014 214.4)",500:"oklch(56% 0.021 213.5)",600:"oklch(45% 0.017 213.2)",700:"oklch(37.8% 0.015 216)",800:"oklch(27.5% 0.011 216.9)",900:"oklch(21.8% 0.008 223.9)",950:"oklch(14.8% 0.004 228.8)"},taupe:{50:"oklch(98.6% 0.002 67.8)",100:"oklch(96% 0.002 17.2)",200:"oklch(92.2% 0.005 34.3)",300:"oklch(86.8% 0.007 39.5)",400:"oklch(71.4% 0.014 41.2)",500:"oklch(54.7% 0.021 43.1)",600:"oklch(43.8% 0.017 39.3)",700:"oklch(36.7% 0.016 35.7)",800:"oklch(26.8% 0.011 36.5)",900:"oklch(21.4% 0.009 43.1)",950:"oklch(14.7% 0.004 49.3)"},red:{50:"oklch(97.1% 0.013 17.38)",100:"oklch(93.6% 0.032 17.717)",200:"oklch(88.5% 0.062 18.334)",300:"oklch(80.8% 0.114 19.571)",400:"oklch(70.4% 0.191 22.216)",500:"oklch(63.7% 0.237 25.331)",600:"oklch(57.7% 0.245 27.325)",700:"oklch(50.5% 0.213 27.518)",800:"oklch(44.4% 0.177 26.899)",900:"oklch(39.6% 0.141 25.723)",950:"oklch(25.8% 0.092 26.042)"},orange:{50:"oklch(98% 0.016 73.684)",100:"oklch(95.4% 0.038 75.164)",200:"oklch(90.1% 0.076 70.697)",300:"oklch(83.7% 0.128 66.29)",400:"oklch(75% 0.183 55.934)",500:"oklch(70.5% 0.213 47.604)",600:"oklch(64.6% 0.222 41.116)",700:"oklch(55.3% 0.195 38.402)",800:"oklch(47% 0.157 37.304)",900:"oklch(40.8% 0.123 38.172)",950:"oklch(26.6% 0.079 36.259)"},amber:{50:"oklch(98.7% 0.022 95.277)",100:"oklch(96.2% 0.059 95.617)",200:"oklch(92.4% 0.12 95.746)",300:"oklch(87.9% 0.169 91.605)",400:"oklch(82.8% 0.189 84.429)",500:"oklch(76.9% 0.188 70.08)",600:"oklch(66.6% 0.179 58.318)",700:"oklch(55.5% 0.163 48.998)",800:"oklch(47.3% 0.137 46.201)",900:"oklch(41.4% 0.112 45.904)",950:"oklch(27.9% 0.077 45.635)"},yellow:{50:"oklch(98.7% 0.026 102.212)",100:"oklch(97.3% 0.071 103.193)",200:"oklch(94.5% 0.129 101.54)",300:"oklch(90.5% 0.182 98.111)",400:"oklch(85.2% 0.199 91.936)",500:"oklch(79.5% 0.184 86.047)",600:"oklch(68.1% 0.162 75.834)",700:"oklch(55.4% 0.135 66.442)",800:"oklch(47.6% 0.114 61.907)",900:"oklch(42.1% 0.095 57.708)",950:"oklch(28.6% 0.066 53.813)"},lime:{50:"oklch(98.6% 0.031 120.757)",100:"oklch(96.7% 0.067 122.328)",200:"oklch(93.8% 0.127 124.321)",300:"oklch(89.7% 0.196 126.665)",400:"oklch(84.1% 0.238 128.85)",500:"oklch(76.8% 0.233 130.85)",600:"oklch(64.8% 0.2 131.684)",700:"oklch(53.2% 0.157 131.589)",800:"oklch(45.3% 0.124 130.933)",900:"oklch(40.5% 0.101 131.063)",950:"oklch(27.4% 0.072 132.109)"},green:{50:"oklch(98.2% 0.018 155.826)",100:"oklch(96.2% 0.044 156.743)",200:"oklch(92.5% 0.084 155.995)",300:"oklch(87.1% 0.15 154.449)",400:"oklch(79.2% 0.209 151.711)",500:"oklch(72.3% 0.219 149.579)",600:"oklch(62.7% 0.194 149.214)",700:"oklch(52.7% 0.154 150.069)",800:"oklch(44.8% 0.119 151.328)",900:"oklch(39.3% 0.095 152.535)",950:"oklch(26.6% 0.065 152.934)"},emerald:{50:"oklch(97.9% 0.021 166.113)",100:"oklch(95% 0.052 163.051)",200:"oklch(90.5% 0.093 164.15)",300:"oklch(84.5% 0.143 164.978)",400:"oklch(76.5% 0.177 163.223)",500:"oklch(69.6% 0.17 162.48)",600:"oklch(59.6% 0.145 163.225)",700:"oklch(50.8% 0.118 165.612)",800:"oklch(43.2% 0.095 166.913)",900:"oklch(37.8% 0.077 168.94)",950:"oklch(26.2% 0.051 172.552)"},teal:{50:"oklch(98.4% 0.014 180.72)",100:"oklch(95.3% 0.051 180.801)",200:"oklch(91% 0.096 180.426)",300:"oklch(85.5% 0.138 181.071)",400:"oklch(77.7% 0.152 181.912)",500:"oklch(70.4% 0.14 182.503)",600:"oklch(60% 0.118 184.704)",700:"oklch(51.1% 0.096 186.391)",800:"oklch(43.7% 0.078 188.216)",900:"oklch(38.6% 0.063 188.416)",950:"oklch(27.7% 0.046 192.524)"},cyan:{50:"oklch(98.4% 0.019 200.873)",100:"oklch(95.6% 0.045 203.388)",200:"oklch(91.7% 0.08 205.041)",300:"oklch(86.5% 0.127 207.078)",400:"oklch(78.9% 0.154 211.53)",500:"oklch(71.5% 0.143 215.221)",600:"oklch(60.9% 0.126 221.723)",700:"oklch(52% 0.105 223.128)",800:"oklch(45% 0.085 224.283)",900:"oklch(39.8% 0.07 227.392)",950:"oklch(30.2% 0.056 229.695)"},sky:{50:"oklch(97.7% 0.013 236.62)",100:"oklch(95.1% 0.026 236.824)",200:"oklch(90.1% 0.058 230.902)",300:"oklch(82.8% 0.111 230.318)",400:"oklch(74.6% 0.16 232.661)",500:"oklch(68.5% 0.169 237.323)",600:"oklch(58.8% 0.158 241.966)",700:"oklch(50% 0.134 242.749)",800:"oklch(44.3% 0.11 240.79)",900:"oklch(39.1% 0.09 240.876)",950:"oklch(29.3% 0.066 243.157)"},blue:{50:"oklch(97% 0.014 254.604)",100:"oklch(93.2% 0.032 255.585)",200:"oklch(88.2% 0.059 254.128)",300:"oklch(80.9% 0.105 251.813)",400:"oklch(70.7% 0.165 254.624)",500:"oklch(62.3% 0.214 259.815)",600:"oklch(54.6% 0.245 262.881)",700:"oklch(48.8% 0.243 264.376)",800:"oklch(42.4% 0.199 265.638)",900:"oklch(37.9% 0.146 265.522)",950:"oklch(28.2% 0.091 267.935)"},indigo:{50:"oklch(96.2% 0.018 272.314)",100:"oklch(93% 0.034 272.788)",200:"oklch(87% 0.065 274.039)",300:"oklch(78.5% 0.115 274.713)",400:"oklch(67.3% 0.182 276.935)",500:"oklch(58.5% 0.233 277.117)",600:"oklch(51.1% 0.262 276.966)",700:"oklch(45.7% 0.24 277.023)",800:"oklch(39.8% 0.195 277.366)",900:"oklch(35.9% 0.144 278.697)",950:"oklch(25.7% 0.09 281.288)"},violet:{50:"oklch(96.9% 0.016 293.756)",100:"oklch(94.3% 0.029 294.588)",200:"oklch(89.4% 0.057 293.283)",300:"oklch(81.1% 0.111 293.571)",400:"oklch(70.2% 0.183 293.541)",500:"oklch(60.6% 0.25 292.717)",600:"oklch(54.1% 0.281 293.009)",700:"oklch(49.1% 0.27 292.581)",800:"oklch(43.2% 0.232 292.759)",900:"oklch(38% 0.189 293.745)",950:"oklch(28.3% 0.141 291.089)"},purple:{50:"oklch(97.7% 0.014 308.299)",100:"oklch(94.6% 0.033 307.174)",200:"oklch(90.2% 0.063 306.703)",300:"oklch(82.7% 0.119 306.383)",400:"oklch(71.4% 0.203 305.504)",500:"oklch(62.7% 0.265 303.9)",600:"oklch(55.8% 0.288 302.321)",700:"oklch(49.6% 0.265 301.924)",800:"oklch(43.8% 0.218 303.724)",900:"oklch(38.1% 0.176 304.987)",950:"oklch(29.1% 0.149 302.717)"},fuchsia:{50:"oklch(97.7% 0.017 320.058)",100:"oklch(95.2% 0.037 318.852)",200:"oklch(90.3% 0.076 319.62)",300:"oklch(83.3% 0.145 321.434)",400:"oklch(74% 0.238 322.16)",500:"oklch(66.7% 0.295 322.15)",600:"oklch(59.1% 0.293 322.896)",700:"oklch(51.8% 0.253 323.949)",800:"oklch(45.2% 0.211 324.591)",900:"oklch(40.1% 0.17 325.612)",950:"oklch(29.3% 0.136 325.661)"},pink:{50:"oklch(97.1% 0.014 343.198)",100:"oklch(94.8% 0.028 342.258)",200:"oklch(89.9% 0.061 343.231)",300:"oklch(82.3% 0.12 346.018)",400:"oklch(71.8% 0.202 349.761)",500:"oklch(65.6% 0.241 354.308)",600:"oklch(59.2% 0.249 0.584)",700:"oklch(52.5% 0.223 3.958)",800:"oklch(45.9% 0.187 3.815)",900:"oklch(40.8% 0.153 2.432)",950:"oklch(28.4% 0.109 3.907)"},rose:{50:"oklch(96.9% 0.015 12.422)",100:"oklch(94.1% 0.03 12.58)",200:"oklch(89.2% 0.058 10.001)",300:"oklch(81% 0.117 11.638)",400:"oklch(71.2% 0.194 13.428)",500:"oklch(64.5% 0.246 16.439)",600:"oklch(58.6% 0.253 17.585)",700:"oklch(51.4% 0.222 16.935)",800:"oklch(45.5% 0.188 13.697)",900:"oklch(41% 0.159 10.272)",950:"oklch(27.1% 0.105 12.094)"}};module.exports=l;
+1
dist/colors.mjs
import{a}from"./chunk-X4GG3EDV.mjs";export{a as default};
+1199
dist/default-theme.d.mts
import { P as PluginUtils, N as NamedUtilityValue } from './resolve-config-QUZ9b-Gn.mjs';
import './colors.mjs';
declare const _default: {
accentColor: ({ theme }: PluginUtils) => any;
animation: {
none: string;
spin: string;
ping: string;
pulse: string;
bounce: string;
};
aria: {
busy: string;
checked: string;
disabled: string;
expanded: string;
hidden: string;
pressed: string;
readonly: string;
required: string;
selected: string;
};
aspectRatio: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
auto: string;
square: string;
video: string;
};
backdropBlur: ({ theme }: PluginUtils) => any;
backdropBrightness: ({ theme }: PluginUtils) => any;
backdropContrast: ({ theme }: PluginUtils) => any;
backdropGrayscale: ({ theme }: PluginUtils) => any;
backdropHueRotate: ({ theme }: PluginUtils) => any;
backdropInvert: ({ theme }: PluginUtils) => any;
backdropOpacity: ({ theme }: PluginUtils) => any;
backdropSaturate: ({ theme }: PluginUtils) => any;
backdropSepia: ({ theme }: PluginUtils) => any;
backgroundColor: ({ theme }: PluginUtils) => any;
backgroundImage: {
none: string;
'gradient-to-t': string;
'gradient-to-tr': string;
'gradient-to-r': string;
'gradient-to-br': string;
'gradient-to-b': string;
'gradient-to-bl': string;
'gradient-to-l': string;
'gradient-to-tl': string;
};
backgroundOpacity: ({ theme }: PluginUtils) => any;
backgroundPosition: {
bottom: string;
center: string;
left: string;
'left-bottom': string;
'left-top': string;
right: string;
'right-bottom': string;
'right-top': string;
top: string;
};
backgroundSize: {
auto: string;
cover: string;
contain: string;
};
blur: {
0: string;
none: string;
sm: string;
DEFAULT: string;
md: string;
lg: string;
xl: string;
'2xl': string;
'3xl': string;
};
borderColor: ({ theme }: PluginUtils) => any;
borderOpacity: ({ theme }: PluginUtils) => any;
borderRadius: {
none: string;
sm: string;
DEFAULT: string;
md: string;
lg: string;
xl: string;
'2xl': string;
'3xl': string;
full: string;
};
borderSpacing: ({ theme }: PluginUtils) => any;
borderWidth: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
DEFAULT: string;
0: string;
2: string;
4: string;
8: string;
};
boxShadow: {
sm: string;
DEFAULT: string;
md: string;
lg: string;
xl: string;
'2xl': string;
inner: string;
none: string;
};
boxShadowColor: ({ theme }: PluginUtils) => any;
brightness: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
50: string;
75: string;
90: string;
95: string;
100: string;
105: string;
110: string;
125: string;
150: string;
200: string;
};
caretColor: ({ theme }: PluginUtils) => any;
colors: () => {
inherit: string;
current: string;
transparent: string;
black: string;
white: string;
slate: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
gray: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
zinc: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
neutral: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
stone: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
mauve: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
olive: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
mist: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
taupe: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
red: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
orange: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
amber: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
yellow: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
lime: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
green: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
emerald: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
teal: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
cyan: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
sky: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
blue: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
indigo: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
violet: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
purple: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
fuchsia: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
pink: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
rose: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
};
columns: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
auto: string;
1: string;
2: string;
3: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
11: string;
12: string;
'3xs': string;
'2xs': string;
xs: string;
sm: string;
md: string;
lg: string;
xl: string;
'2xl': string;
'3xl': string;
'4xl': string;
'5xl': string;
'6xl': string;
'7xl': string;
};
container: {};
content: {
none: string;
};
contrast: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
50: string;
75: string;
100: string;
125: string;
150: string;
200: string;
};
cursor: {
auto: string;
default: string;
pointer: string;
wait: string;
text: string;
move: string;
help: string;
'not-allowed': string;
none: string;
'context-menu': string;
progress: string;
cell: string;
crosshair: string;
'vertical-text': string;
alias: string;
copy: string;
'no-drop': string;
grab: string;
grabbing: string;
'all-scroll': string;
'col-resize': string;
'row-resize': string;
'n-resize': string;
'e-resize': string;
's-resize': string;
'w-resize': string;
'ne-resize': string;
'nw-resize': string;
'se-resize': string;
'sw-resize': string;
'ew-resize': string;
'ns-resize': string;
'nesw-resize': string;
'nwse-resize': string;
'zoom-in': string;
'zoom-out': string;
};
divideColor: ({ theme }: PluginUtils) => any;
divideOpacity: ({ theme }: PluginUtils) => any;
divideWidth: ({ theme }: PluginUtils) => any;
dropShadow: {
sm: string;
DEFAULT: string[];
md: string[];
lg: string[];
xl: string[];
'2xl': string;
none: string;
};
fill: ({ theme }: PluginUtils) => any;
flex: {
1: string;
auto: string;
initial: string;
none: string;
};
flexBasis: ({ theme }: PluginUtils) => any;
flexGrow: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
DEFAULT: string;
};
flexShrink: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
DEFAULT: string;
};
fontFamily: {
sans: string[];
serif: string[];
mono: string[];
};
fontSize: {
xs: (string | {
lineHeight: string;
})[];
sm: (string | {
lineHeight: string;
})[];
base: (string | {
lineHeight: string;
})[];
lg: (string | {
lineHeight: string;
})[];
xl: (string | {
lineHeight: string;
})[];
'2xl': (string | {
lineHeight: string;
})[];
'3xl': (string | {
lineHeight: string;
})[];
'4xl': (string | {
lineHeight: string;
})[];
'5xl': (string | {
lineHeight: string;
})[];
'6xl': (string | {
lineHeight: string;
})[];
'7xl': (string | {
lineHeight: string;
})[];
'8xl': (string | {
lineHeight: string;
})[];
'9xl': (string | {
lineHeight: string;
})[];
};
fontWeight: {
thin: string;
extralight: string;
light: string;
normal: string;
medium: string;
semibold: string;
bold: string;
extrabold: string;
black: string;
};
gap: ({ theme }: PluginUtils) => any;
gradientColorStops: ({ theme }: PluginUtils) => any;
gradientColorStopPositions: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
'0%': string;
'5%': string;
'10%': string;
'15%': string;
'20%': string;
'25%': string;
'30%': string;
'35%': string;
'40%': string;
'45%': string;
'50%': string;
'55%': string;
'60%': string;
'65%': string;
'70%': string;
'75%': string;
'80%': string;
'85%': string;
'90%': string;
'95%': string;
'100%': string;
};
grayscale: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
DEFAULT: string;
};
gridAutoColumns: {
auto: string;
min: string;
max: string;
fr: string;
};
gridAutoRows: {
auto: string;
min: string;
max: string;
fr: string;
};
gridColumn: {
auto: string;
'span-1': string;
'span-2': string;
'span-3': string;
'span-4': string;
'span-5': string;
'span-6': string;
'span-7': string;
'span-8': string;
'span-9': string;
'span-10': string;
'span-11': string;
'span-12': string;
'span-full': string;
};
gridColumnEnd: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
auto: string;
1: string;
2: string;
3: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
11: string;
12: string;
13: string;
};
gridColumnStart: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
auto: string;
1: string;
2: string;
3: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
11: string;
12: string;
13: string;
};
gridRow: {
auto: string;
'span-1': string;
'span-2': string;
'span-3': string;
'span-4': string;
'span-5': string;
'span-6': string;
'span-7': string;
'span-8': string;
'span-9': string;
'span-10': string;
'span-11': string;
'span-12': string;
'span-full': string;
};
gridRowEnd: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
auto: string;
1: string;
2: string;
3: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
11: string;
12: string;
13: string;
};
gridRowStart: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
auto: string;
1: string;
2: string;
3: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
11: string;
12: string;
13: string;
};
gridTemplateColumns: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
none: string;
subgrid: string;
1: string;
2: string;
3: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
11: string;
12: string;
};
gridTemplateRows: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
none: string;
subgrid: string;
1: string;
2: string;
3: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
11: string;
12: string;
};
height: ({ theme }: PluginUtils) => any;
hueRotate: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
15: string;
30: string;
60: string;
90: string;
180: string;
};
inset: ({ theme }: PluginUtils) => any;
invert: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
DEFAULT: string;
};
keyframes: {
spin: {
to: {
transform: string;
};
};
ping: {
'75%, 100%': {
transform: string;
opacity: string;
};
};
pulse: {
'50%': {
opacity: string;
};
};
bounce: {
'0%, 100%': {
transform: string;
animationTimingFunction: string;
};
'50%': {
transform: string;
animationTimingFunction: string;
};
};
};
letterSpacing: {
tighter: string;
tight: string;
normal: string;
wide: string;
wider: string;
widest: string;
};
lineHeight: {
none: string;
tight: string;
snug: string;
normal: string;
relaxed: string;
loose: string;
3: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
};
listStyleType: {
none: string;
disc: string;
decimal: string;
};
listStyleImage: {
none: string;
};
margin: ({ theme }: PluginUtils) => any;
lineClamp: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
1: string;
2: string;
3: string;
4: string;
5: string;
6: string;
};
maxHeight: ({ theme }: PluginUtils) => any;
maxWidth: ({ theme }: PluginUtils) => any;
minHeight: ({ theme }: PluginUtils) => any;
minWidth: ({ theme }: PluginUtils) => any;
objectPosition: {
bottom: string;
center: string;
left: string;
'left-bottom': string;
'left-top': string;
right: string;
'right-bottom': string;
'right-top': string;
top: string;
};
opacity: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
5: string;
10: string;
15: string;
20: string;
25: string;
30: string;
35: string;
40: string;
45: string;
50: string;
55: string;
60: string;
65: string;
70: string;
75: string;
80: string;
85: string;
90: string;
95: string;
100: string;
};
order: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
first: string;
last: string;
none: string;
1: string;
2: string;
3: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
11: string;
12: string;
};
outlineColor: ({ theme }: PluginUtils) => any;
outlineOffset: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
1: string;
2: string;
4: string;
8: string;
};
outlineWidth: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
1: string;
2: string;
4: string;
8: string;
};
padding: ({ theme }: PluginUtils) => any;
placeholderColor: ({ theme }: PluginUtils) => any;
placeholderOpacity: ({ theme }: PluginUtils) => any;
ringColor: ({ theme }: PluginUtils) => any;
ringOffsetColor: ({ theme }: PluginUtils) => any;
ringOffsetWidth: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
1: string;
2: string;
4: string;
8: string;
};
ringOpacity: ({ theme }: PluginUtils) => any;
ringWidth: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
DEFAULT: string;
0: string;
1: string;
2: string;
4: string;
8: string;
};
rotate: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
1: string;
2: string;
3: string;
6: string;
12: string;
45: string;
90: string;
180: string;
};
saturate: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
50: string;
100: string;
150: string;
200: string;
};
scale: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
50: string;
75: string;
90: string;
95: string;
100: string;
105: string;
110: string;
125: string;
150: string;
};
screens: {
sm: string;
md: string;
lg: string;
xl: string;
'2xl': string;
};
scrollMargin: ({ theme }: PluginUtils) => any;
scrollPadding: ({ theme }: PluginUtils) => any;
sepia: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
DEFAULT: string;
};
skew: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
1: string;
2: string;
3: string;
6: string;
12: string;
};
space: ({ theme }: PluginUtils) => any;
spacing: {
px: string;
0: string;
0.5: string;
1: string;
1.5: string;
2: string;
2.5: string;
3: string;
3.5: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
11: string;
12: string;
14: string;
16: string;
20: string;
24: string;
28: string;
32: string;
36: string;
40: string;
44: string;
48: string;
52: string;
56: string;
60: string;
64: string;
72: string;
80: string;
96: string;
};
stroke: ({ theme }: PluginUtils) => any;
strokeWidth: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
1: string;
2: string;
};
supports: {};
data: {};
textColor: ({ theme }: PluginUtils) => any;
textDecorationColor: ({ theme }: PluginUtils) => any;
textDecorationThickness: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
auto: string;
'from-font': string;
0: string;
1: string;
2: string;
4: string;
8: string;
};
textIndent: ({ theme }: PluginUtils) => any;
textOpacity: ({ theme }: PluginUtils) => any;
textUnderlineOffset: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
auto: string;
0: string;
1: string;
2: string;
4: string;
8: string;
};
transformOrigin: {
center: string;
top: string;
'top-right': string;
right: string;
'bottom-right': string;
bottom: string;
'bottom-left': string;
left: string;
'top-left': string;
};
transitionDelay: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
75: string;
100: string;
150: string;
200: string;
300: string;
500: string;
700: string;
1000: string;
};
transitionDuration: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
DEFAULT: string;
0: string;
75: string;
100: string;
150: string;
200: string;
300: string;
500: string;
700: string;
1000: string;
};
transitionProperty: {
none: string;
all: string;
DEFAULT: string;
colors: string;
opacity: string;
shadow: string;
transform: string;
};
transitionTimingFunction: {
DEFAULT: string;
linear: string;
in: string;
out: string;
'in-out': string;
};
translate: ({ theme }: PluginUtils) => any;
size: ({ theme }: PluginUtils) => any;
width: ({ theme }: PluginUtils) => any;
willChange: {
auto: string;
scroll: string;
contents: string;
transform: string;
};
zIndex: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
auto: string;
0: string;
10: string;
20: string;
30: string;
40: string;
50: string;
};
};
export { _default as default };
+1199
dist/default-theme.d.ts
import { P as PluginUtils, N as NamedUtilityValue } from './resolve-config-B4yBzhca.js';
import './colors-C__qRT83.js';
declare const _default: {
accentColor: ({ theme }: PluginUtils) => any;
animation: {
none: string;
spin: string;
ping: string;
pulse: string;
bounce: string;
};
aria: {
busy: string;
checked: string;
disabled: string;
expanded: string;
hidden: string;
pressed: string;
readonly: string;
required: string;
selected: string;
};
aspectRatio: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
auto: string;
square: string;
video: string;
};
backdropBlur: ({ theme }: PluginUtils) => any;
backdropBrightness: ({ theme }: PluginUtils) => any;
backdropContrast: ({ theme }: PluginUtils) => any;
backdropGrayscale: ({ theme }: PluginUtils) => any;
backdropHueRotate: ({ theme }: PluginUtils) => any;
backdropInvert: ({ theme }: PluginUtils) => any;
backdropOpacity: ({ theme }: PluginUtils) => any;
backdropSaturate: ({ theme }: PluginUtils) => any;
backdropSepia: ({ theme }: PluginUtils) => any;
backgroundColor: ({ theme }: PluginUtils) => any;
backgroundImage: {
none: string;
'gradient-to-t': string;
'gradient-to-tr': string;
'gradient-to-r': string;
'gradient-to-br': string;
'gradient-to-b': string;
'gradient-to-bl': string;
'gradient-to-l': string;
'gradient-to-tl': string;
};
backgroundOpacity: ({ theme }: PluginUtils) => any;
backgroundPosition: {
bottom: string;
center: string;
left: string;
'left-bottom': string;
'left-top': string;
right: string;
'right-bottom': string;
'right-top': string;
top: string;
};
backgroundSize: {
auto: string;
cover: string;
contain: string;
};
blur: {
0: string;
none: string;
sm: string;
DEFAULT: string;
md: string;
lg: string;
xl: string;
'2xl': string;
'3xl': string;
};
borderColor: ({ theme }: PluginUtils) => any;
borderOpacity: ({ theme }: PluginUtils) => any;
borderRadius: {
none: string;
sm: string;
DEFAULT: string;
md: string;
lg: string;
xl: string;
'2xl': string;
'3xl': string;
full: string;
};
borderSpacing: ({ theme }: PluginUtils) => any;
borderWidth: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
DEFAULT: string;
0: string;
2: string;
4: string;
8: string;
};
boxShadow: {
sm: string;
DEFAULT: string;
md: string;
lg: string;
xl: string;
'2xl': string;
inner: string;
none: string;
};
boxShadowColor: ({ theme }: PluginUtils) => any;
brightness: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
50: string;
75: string;
90: string;
95: string;
100: string;
105: string;
110: string;
125: string;
150: string;
200: string;
};
caretColor: ({ theme }: PluginUtils) => any;
colors: () => {
inherit: string;
current: string;
transparent: string;
black: string;
white: string;
slate: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
gray: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
zinc: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
neutral: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
stone: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
mauve: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
olive: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
mist: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
taupe: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
red: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
orange: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
amber: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
yellow: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
lime: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
green: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
emerald: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
teal: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
cyan: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
sky: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
blue: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
indigo: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
violet: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
purple: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
fuchsia: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
pink: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
rose: {
'50': string;
'100': string;
'200': string;
'300': string;
'400': string;
'500': string;
'600': string;
'700': string;
'800': string;
'900': string;
'950': string;
};
};
columns: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
auto: string;
1: string;
2: string;
3: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
11: string;
12: string;
'3xs': string;
'2xs': string;
xs: string;
sm: string;
md: string;
lg: string;
xl: string;
'2xl': string;
'3xl': string;
'4xl': string;
'5xl': string;
'6xl': string;
'7xl': string;
};
container: {};
content: {
none: string;
};
contrast: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
50: string;
75: string;
100: string;
125: string;
150: string;
200: string;
};
cursor: {
auto: string;
default: string;
pointer: string;
wait: string;
text: string;
move: string;
help: string;
'not-allowed': string;
none: string;
'context-menu': string;
progress: string;
cell: string;
crosshair: string;
'vertical-text': string;
alias: string;
copy: string;
'no-drop': string;
grab: string;
grabbing: string;
'all-scroll': string;
'col-resize': string;
'row-resize': string;
'n-resize': string;
'e-resize': string;
's-resize': string;
'w-resize': string;
'ne-resize': string;
'nw-resize': string;
'se-resize': string;
'sw-resize': string;
'ew-resize': string;
'ns-resize': string;
'nesw-resize': string;
'nwse-resize': string;
'zoom-in': string;
'zoom-out': string;
};
divideColor: ({ theme }: PluginUtils) => any;
divideOpacity: ({ theme }: PluginUtils) => any;
divideWidth: ({ theme }: PluginUtils) => any;
dropShadow: {
sm: string;
DEFAULT: string[];
md: string[];
lg: string[];
xl: string[];
'2xl': string;
none: string;
};
fill: ({ theme }: PluginUtils) => any;
flex: {
1: string;
auto: string;
initial: string;
none: string;
};
flexBasis: ({ theme }: PluginUtils) => any;
flexGrow: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
DEFAULT: string;
};
flexShrink: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
DEFAULT: string;
};
fontFamily: {
sans: string[];
serif: string[];
mono: string[];
};
fontSize: {
xs: (string | {
lineHeight: string;
})[];
sm: (string | {
lineHeight: string;
})[];
base: (string | {
lineHeight: string;
})[];
lg: (string | {
lineHeight: string;
})[];
xl: (string | {
lineHeight: string;
})[];
'2xl': (string | {
lineHeight: string;
})[];
'3xl': (string | {
lineHeight: string;
})[];
'4xl': (string | {
lineHeight: string;
})[];
'5xl': (string | {
lineHeight: string;
})[];
'6xl': (string | {
lineHeight: string;
})[];
'7xl': (string | {
lineHeight: string;
})[];
'8xl': (string | {
lineHeight: string;
})[];
'9xl': (string | {
lineHeight: string;
})[];
};
fontWeight: {
thin: string;
extralight: string;
light: string;
normal: string;
medium: string;
semibold: string;
bold: string;
extrabold: string;
black: string;
};
gap: ({ theme }: PluginUtils) => any;
gradientColorStops: ({ theme }: PluginUtils) => any;
gradientColorStopPositions: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
'0%': string;
'5%': string;
'10%': string;
'15%': string;
'20%': string;
'25%': string;
'30%': string;
'35%': string;
'40%': string;
'45%': string;
'50%': string;
'55%': string;
'60%': string;
'65%': string;
'70%': string;
'75%': string;
'80%': string;
'85%': string;
'90%': string;
'95%': string;
'100%': string;
};
grayscale: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
DEFAULT: string;
};
gridAutoColumns: {
auto: string;
min: string;
max: string;
fr: string;
};
gridAutoRows: {
auto: string;
min: string;
max: string;
fr: string;
};
gridColumn: {
auto: string;
'span-1': string;
'span-2': string;
'span-3': string;
'span-4': string;
'span-5': string;
'span-6': string;
'span-7': string;
'span-8': string;
'span-9': string;
'span-10': string;
'span-11': string;
'span-12': string;
'span-full': string;
};
gridColumnEnd: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
auto: string;
1: string;
2: string;
3: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
11: string;
12: string;
13: string;
};
gridColumnStart: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
auto: string;
1: string;
2: string;
3: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
11: string;
12: string;
13: string;
};
gridRow: {
auto: string;
'span-1': string;
'span-2': string;
'span-3': string;
'span-4': string;
'span-5': string;
'span-6': string;
'span-7': string;
'span-8': string;
'span-9': string;
'span-10': string;
'span-11': string;
'span-12': string;
'span-full': string;
};
gridRowEnd: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
auto: string;
1: string;
2: string;
3: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
11: string;
12: string;
13: string;
};
gridRowStart: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
auto: string;
1: string;
2: string;
3: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
11: string;
12: string;
13: string;
};
gridTemplateColumns: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
none: string;
subgrid: string;
1: string;
2: string;
3: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
11: string;
12: string;
};
gridTemplateRows: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
none: string;
subgrid: string;
1: string;
2: string;
3: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
11: string;
12: string;
};
height: ({ theme }: PluginUtils) => any;
hueRotate: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
15: string;
30: string;
60: string;
90: string;
180: string;
};
inset: ({ theme }: PluginUtils) => any;
invert: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
DEFAULT: string;
};
keyframes: {
spin: {
to: {
transform: string;
};
};
ping: {
'75%, 100%': {
transform: string;
opacity: string;
};
};
pulse: {
'50%': {
opacity: string;
};
};
bounce: {
'0%, 100%': {
transform: string;
animationTimingFunction: string;
};
'50%': {
transform: string;
animationTimingFunction: string;
};
};
};
letterSpacing: {
tighter: string;
tight: string;
normal: string;
wide: string;
wider: string;
widest: string;
};
lineHeight: {
none: string;
tight: string;
snug: string;
normal: string;
relaxed: string;
loose: string;
3: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
};
listStyleType: {
none: string;
disc: string;
decimal: string;
};
listStyleImage: {
none: string;
};
margin: ({ theme }: PluginUtils) => any;
lineClamp: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
1: string;
2: string;
3: string;
4: string;
5: string;
6: string;
};
maxHeight: ({ theme }: PluginUtils) => any;
maxWidth: ({ theme }: PluginUtils) => any;
minHeight: ({ theme }: PluginUtils) => any;
minWidth: ({ theme }: PluginUtils) => any;
objectPosition: {
bottom: string;
center: string;
left: string;
'left-bottom': string;
'left-top': string;
right: string;
'right-bottom': string;
'right-top': string;
top: string;
};
opacity: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
5: string;
10: string;
15: string;
20: string;
25: string;
30: string;
35: string;
40: string;
45: string;
50: string;
55: string;
60: string;
65: string;
70: string;
75: string;
80: string;
85: string;
90: string;
95: string;
100: string;
};
order: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
first: string;
last: string;
none: string;
1: string;
2: string;
3: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
11: string;
12: string;
};
outlineColor: ({ theme }: PluginUtils) => any;
outlineOffset: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
1: string;
2: string;
4: string;
8: string;
};
outlineWidth: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
1: string;
2: string;
4: string;
8: string;
};
padding: ({ theme }: PluginUtils) => any;
placeholderColor: ({ theme }: PluginUtils) => any;
placeholderOpacity: ({ theme }: PluginUtils) => any;
ringColor: ({ theme }: PluginUtils) => any;
ringOffsetColor: ({ theme }: PluginUtils) => any;
ringOffsetWidth: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
1: string;
2: string;
4: string;
8: string;
};
ringOpacity: ({ theme }: PluginUtils) => any;
ringWidth: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
DEFAULT: string;
0: string;
1: string;
2: string;
4: string;
8: string;
};
rotate: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
1: string;
2: string;
3: string;
6: string;
12: string;
45: string;
90: string;
180: string;
};
saturate: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
50: string;
100: string;
150: string;
200: string;
};
scale: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
50: string;
75: string;
90: string;
95: string;
100: string;
105: string;
110: string;
125: string;
150: string;
};
screens: {
sm: string;
md: string;
lg: string;
xl: string;
'2xl': string;
};
scrollMargin: ({ theme }: PluginUtils) => any;
scrollPadding: ({ theme }: PluginUtils) => any;
sepia: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
DEFAULT: string;
};
skew: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
1: string;
2: string;
3: string;
6: string;
12: string;
};
space: ({ theme }: PluginUtils) => any;
spacing: {
px: string;
0: string;
0.5: string;
1: string;
1.5: string;
2: string;
2.5: string;
3: string;
3.5: string;
4: string;
5: string;
6: string;
7: string;
8: string;
9: string;
10: string;
11: string;
12: string;
14: string;
16: string;
20: string;
24: string;
28: string;
32: string;
36: string;
40: string;
44: string;
48: string;
52: string;
56: string;
60: string;
64: string;
72: string;
80: string;
96: string;
};
stroke: ({ theme }: PluginUtils) => any;
strokeWidth: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
1: string;
2: string;
};
supports: {};
data: {};
textColor: ({ theme }: PluginUtils) => any;
textDecorationColor: ({ theme }: PluginUtils) => any;
textDecorationThickness: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
auto: string;
'from-font': string;
0: string;
1: string;
2: string;
4: string;
8: string;
};
textIndent: ({ theme }: PluginUtils) => any;
textOpacity: ({ theme }: PluginUtils) => any;
textUnderlineOffset: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
auto: string;
0: string;
1: string;
2: string;
4: string;
8: string;
};
transformOrigin: {
center: string;
top: string;
'top-right': string;
right: string;
'bottom-right': string;
bottom: string;
'bottom-left': string;
left: string;
'top-left': string;
};
transitionDelay: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
0: string;
75: string;
100: string;
150: string;
200: string;
300: string;
500: string;
700: string;
1000: string;
};
transitionDuration: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
DEFAULT: string;
0: string;
75: string;
100: string;
150: string;
200: string;
300: string;
500: string;
700: string;
1000: string;
};
transitionProperty: {
none: string;
all: string;
DEFAULT: string;
colors: string;
opacity: string;
shadow: string;
transform: string;
};
transitionTimingFunction: {
DEFAULT: string;
linear: string;
in: string;
out: string;
'in-out': string;
};
translate: ({ theme }: PluginUtils) => any;
size: ({ theme }: PluginUtils) => any;
width: ({ theme }: PluginUtils) => any;
willChange: {
auto: string;
scroll: string;
contents: string;
transform: string;
};
zIndex: {
__BARE_VALUE__: (value: NamedUtilityValue) => string | undefined;
auto: string;
0: string;
10: string;
20: string;
30: string;
40: string;
50: string;
};
};
export { _default as default };
+1
dist/default-theme.js
"use strict";var m=new Uint8Array(256);function u(e,c){let t=0,g=[],k=0,d=e.length,w=c.charCodeAt(0);for(let n=0;n<d;n++){let h=e.charCodeAt(n);if(t===0&&h===w){g.push(e.slice(k,n)),k=n+1;continue}switch(h){case 92:n+=1;break;case 39:case 34:for(;++n<d;){let x=e.charCodeAt(n);if(x===92){n+=1;continue}if(x===h)break}break;case 40:m[t]=41,t++;break;case 91:m[t]=93,t++;break;case 123:m[t]=125,t++;break;case 93:case 125:case 41:t>0&&h===m[t-1]&&t--;break}}return g.push(e.slice(k)),g}var l=/[+-]?\d*\.?\d+(?:[eE][+-]?\d+)?/,z=new RegExp(`^${l.source}$`);var T=new RegExp(`^${l.source}%$`);var D=new RegExp(`^${l.source}\\s*/\\s*${l.source}$`);var A=["cm","mm","Q","in","pc","pt","px","em","ex","ch","rem","lh","rlh","vw","vh","vmin","vmax","vb","vi","svw","svh","lvw","lvh","dvw","dvh","cqw","cqh","cqi","cqb","cqmin","cqmax"],I=new RegExp(`^${l.source}(${A.join("|")})$`);var C=["deg","rad","grad","turn"],F=new RegExp(`^${l.source}(${C.join("|")})$`);var H=new RegExp(`^${l.source} +${l.source} +${l.source}$`);function i(e){let c=Number(e);return Number.isInteger(c)&&c>=0&&String(c)===String(e)}var f={inherit:"inherit",current:"currentcolor",transparent:"transparent",black:"#000",white:"#fff",slate:{50:"oklch(98.4% 0.003 247.858)",100:"oklch(96.8% 0.007 247.896)",200:"oklch(92.9% 0.013 255.508)",300:"oklch(86.9% 0.022 252.894)",400:"oklch(70.4% 0.04 256.788)",500:"oklch(55.4% 0.046 257.417)",600:"oklch(44.6% 0.043 257.281)",700:"oklch(37.2% 0.044 257.287)",800:"oklch(27.9% 0.041 260.031)",900:"oklch(20.8% 0.042 265.755)",950:"oklch(12.9% 0.042 264.695)"},gray:{50:"oklch(98.5% 0.002 247.839)",100:"oklch(96.7% 0.003 264.542)",200:"oklch(92.8% 0.006 264.531)",300:"oklch(87.2% 0.01 258.338)",400:"oklch(70.7% 0.022 261.325)",500:"oklch(55.1% 0.027 264.364)",600:"oklch(44.6% 0.03 256.802)",700:"oklch(37.3% 0.034 259.733)",800:"oklch(27.8% 0.033 256.848)",900:"oklch(21% 0.034 264.665)",950:"oklch(13% 0.028 261.692)"},zinc:{50:"oklch(98.5% 0 0)",100:"oklch(96.7% 0.001 286.375)",200:"oklch(92% 0.004 286.32)",300:"oklch(87.1% 0.006 286.286)",400:"oklch(70.5% 0.015 286.067)",500:"oklch(55.2% 0.016 285.938)",600:"oklch(44.2% 0.017 285.786)",700:"oklch(37% 0.013 285.805)",800:"oklch(27.4% 0.006 286.033)",900:"oklch(21% 0.006 285.885)",950:"oklch(14.1% 0.005 285.823)"},neutral:{50:"oklch(98.5% 0 0)",100:"oklch(97% 0 0)",200:"oklch(92.2% 0 0)",300:"oklch(87% 0 0)",400:"oklch(70.8% 0 0)",500:"oklch(55.6% 0 0)",600:"oklch(43.9% 0 0)",700:"oklch(37.1% 0 0)",800:"oklch(26.9% 0 0)",900:"oklch(20.5% 0 0)",950:"oklch(14.5% 0 0)"},stone:{50:"oklch(98.5% 0.001 106.423)",100:"oklch(97% 0.001 106.424)",200:"oklch(92.3% 0.003 48.717)",300:"oklch(86.9% 0.005 56.366)",400:"oklch(70.9% 0.01 56.259)",500:"oklch(55.3% 0.013 58.071)",600:"oklch(44.4% 0.011 73.639)",700:"oklch(37.4% 0.01 67.558)",800:"oklch(26.8% 0.007 34.298)",900:"oklch(21.6% 0.006 56.043)",950:"oklch(14.7% 0.004 49.25)"},mauve:{50:"oklch(98.5% 0 0)",100:"oklch(96% 0.003 325.6)",200:"oklch(92.2% 0.005 325.62)",300:"oklch(86.5% 0.012 325.68)",400:"oklch(71.1% 0.019 323.02)",500:"oklch(54.2% 0.034 322.5)",600:"oklch(43.5% 0.029 321.78)",700:"oklch(36.4% 0.029 323.89)",800:"oklch(26.3% 0.024 320.12)",900:"oklch(21.2% 0.019 322.12)",950:"oklch(14.5% 0.008 326)"},olive:{50:"oklch(98.8% 0.003 106.5)",100:"oklch(96.6% 0.005 106.5)",200:"oklch(93% 0.007 106.5)",300:"oklch(88% 0.011 106.6)",400:"oklch(73.7% 0.021 106.9)",500:"oklch(58% 0.031 107.3)",600:"oklch(46.6% 0.025 107.3)",700:"oklch(39.4% 0.023 107.4)",800:"oklch(28.6% 0.016 107.4)",900:"oklch(22.8% 0.013 107.4)",950:"oklch(15.3% 0.006 107.1)"},mist:{50:"oklch(98.7% 0.002 197.1)",100:"oklch(96.3% 0.002 197.1)",200:"oklch(92.5% 0.005 214.3)",300:"oklch(87.2% 0.007 219.6)",400:"oklch(72.3% 0.014 214.4)",500:"oklch(56% 0.021 213.5)",600:"oklch(45% 0.017 213.2)",700:"oklch(37.8% 0.015 216)",800:"oklch(27.5% 0.011 216.9)",900:"oklch(21.8% 0.008 223.9)",950:"oklch(14.8% 0.004 228.8)"},taupe:{50:"oklch(98.6% 0.002 67.8)",100:"oklch(96% 0.002 17.2)",200:"oklch(92.2% 0.005 34.3)",300:"oklch(86.8% 0.007 39.5)",400:"oklch(71.4% 0.014 41.2)",500:"oklch(54.7% 0.021 43.1)",600:"oklch(43.8% 0.017 39.3)",700:"oklch(36.7% 0.016 35.7)",800:"oklch(26.8% 0.011 36.5)",900:"oklch(21.4% 0.009 43.1)",950:"oklch(14.7% 0.004 49.3)"},red:{50:"oklch(97.1% 0.013 17.38)",100:"oklch(93.6% 0.032 17.717)",200:"oklch(88.5% 0.062 18.334)",300:"oklch(80.8% 0.114 19.571)",400:"oklch(70.4% 0.191 22.216)",500:"oklch(63.7% 0.237 25.331)",600:"oklch(57.7% 0.245 27.325)",700:"oklch(50.5% 0.213 27.518)",800:"oklch(44.4% 0.177 26.899)",900:"oklch(39.6% 0.141 25.723)",950:"oklch(25.8% 0.092 26.042)"},orange:{50:"oklch(98% 0.016 73.684)",100:"oklch(95.4% 0.038 75.164)",200:"oklch(90.1% 0.076 70.697)",300:"oklch(83.7% 0.128 66.29)",400:"oklch(75% 0.183 55.934)",500:"oklch(70.5% 0.213 47.604)",600:"oklch(64.6% 0.222 41.116)",700:"oklch(55.3% 0.195 38.402)",800:"oklch(47% 0.157 37.304)",900:"oklch(40.8% 0.123 38.172)",950:"oklch(26.6% 0.079 36.259)"},amber:{50:"oklch(98.7% 0.022 95.277)",100:"oklch(96.2% 0.059 95.617)",200:"oklch(92.4% 0.12 95.746)",300:"oklch(87.9% 0.169 91.605)",400:"oklch(82.8% 0.189 84.429)",500:"oklch(76.9% 0.188 70.08)",600:"oklch(66.6% 0.179 58.318)",700:"oklch(55.5% 0.163 48.998)",800:"oklch(47.3% 0.137 46.201)",900:"oklch(41.4% 0.112 45.904)",950:"oklch(27.9% 0.077 45.635)"},yellow:{50:"oklch(98.7% 0.026 102.212)",100:"oklch(97.3% 0.071 103.193)",200:"oklch(94.5% 0.129 101.54)",300:"oklch(90.5% 0.182 98.111)",400:"oklch(85.2% 0.199 91.936)",500:"oklch(79.5% 0.184 86.047)",600:"oklch(68.1% 0.162 75.834)",700:"oklch(55.4% 0.135 66.442)",800:"oklch(47.6% 0.114 61.907)",900:"oklch(42.1% 0.095 57.708)",950:"oklch(28.6% 0.066 53.813)"},lime:{50:"oklch(98.6% 0.031 120.757)",100:"oklch(96.7% 0.067 122.328)",200:"oklch(93.8% 0.127 124.321)",300:"oklch(89.7% 0.196 126.665)",400:"oklch(84.1% 0.238 128.85)",500:"oklch(76.8% 0.233 130.85)",600:"oklch(64.8% 0.2 131.684)",700:"oklch(53.2% 0.157 131.589)",800:"oklch(45.3% 0.124 130.933)",900:"oklch(40.5% 0.101 131.063)",950:"oklch(27.4% 0.072 132.109)"},green:{50:"oklch(98.2% 0.018 155.826)",100:"oklch(96.2% 0.044 156.743)",200:"oklch(92.5% 0.084 155.995)",300:"oklch(87.1% 0.15 154.449)",400:"oklch(79.2% 0.209 151.711)",500:"oklch(72.3% 0.219 149.579)",600:"oklch(62.7% 0.194 149.214)",700:"oklch(52.7% 0.154 150.069)",800:"oklch(44.8% 0.119 151.328)",900:"oklch(39.3% 0.095 152.535)",950:"oklch(26.6% 0.065 152.934)"},emerald:{50:"oklch(97.9% 0.021 166.113)",100:"oklch(95% 0.052 163.051)",200:"oklch(90.5% 0.093 164.15)",300:"oklch(84.5% 0.143 164.978)",400:"oklch(76.5% 0.177 163.223)",500:"oklch(69.6% 0.17 162.48)",600:"oklch(59.6% 0.145 163.225)",700:"oklch(50.8% 0.118 165.612)",800:"oklch(43.2% 0.095 166.913)",900:"oklch(37.8% 0.077 168.94)",950:"oklch(26.2% 0.051 172.552)"},teal:{50:"oklch(98.4% 0.014 180.72)",100:"oklch(95.3% 0.051 180.801)",200:"oklch(91% 0.096 180.426)",300:"oklch(85.5% 0.138 181.071)",400:"oklch(77.7% 0.152 181.912)",500:"oklch(70.4% 0.14 182.503)",600:"oklch(60% 0.118 184.704)",700:"oklch(51.1% 0.096 186.391)",800:"oklch(43.7% 0.078 188.216)",900:"oklch(38.6% 0.063 188.416)",950:"oklch(27.7% 0.046 192.524)"},cyan:{50:"oklch(98.4% 0.019 200.873)",100:"oklch(95.6% 0.045 203.388)",200:"oklch(91.7% 0.08 205.041)",300:"oklch(86.5% 0.127 207.078)",400:"oklch(78.9% 0.154 211.53)",500:"oklch(71.5% 0.143 215.221)",600:"oklch(60.9% 0.126 221.723)",700:"oklch(52% 0.105 223.128)",800:"oklch(45% 0.085 224.283)",900:"oklch(39.8% 0.07 227.392)",950:"oklch(30.2% 0.056 229.695)"},sky:{50:"oklch(97.7% 0.013 236.62)",100:"oklch(95.1% 0.026 236.824)",200:"oklch(90.1% 0.058 230.902)",300:"oklch(82.8% 0.111 230.318)",400:"oklch(74.6% 0.16 232.661)",500:"oklch(68.5% 0.169 237.323)",600:"oklch(58.8% 0.158 241.966)",700:"oklch(50% 0.134 242.749)",800:"oklch(44.3% 0.11 240.79)",900:"oklch(39.1% 0.09 240.876)",950:"oklch(29.3% 0.066 243.157)"},blue:{50:"oklch(97% 0.014 254.604)",100:"oklch(93.2% 0.032 255.585)",200:"oklch(88.2% 0.059 254.128)",300:"oklch(80.9% 0.105 251.813)",400:"oklch(70.7% 0.165 254.624)",500:"oklch(62.3% 0.214 259.815)",600:"oklch(54.6% 0.245 262.881)",700:"oklch(48.8% 0.243 264.376)",800:"oklch(42.4% 0.199 265.638)",900:"oklch(37.9% 0.146 265.522)",950:"oklch(28.2% 0.091 267.935)"},indigo:{50:"oklch(96.2% 0.018 272.314)",100:"oklch(93% 0.034 272.788)",200:"oklch(87% 0.065 274.039)",300:"oklch(78.5% 0.115 274.713)",400:"oklch(67.3% 0.182 276.935)",500:"oklch(58.5% 0.233 277.117)",600:"oklch(51.1% 0.262 276.966)",700:"oklch(45.7% 0.24 277.023)",800:"oklch(39.8% 0.195 277.366)",900:"oklch(35.9% 0.144 278.697)",950:"oklch(25.7% 0.09 281.288)"},violet:{50:"oklch(96.9% 0.016 293.756)",100:"oklch(94.3% 0.029 294.588)",200:"oklch(89.4% 0.057 293.283)",300:"oklch(81.1% 0.111 293.571)",400:"oklch(70.2% 0.183 293.541)",500:"oklch(60.6% 0.25 292.717)",600:"oklch(54.1% 0.281 293.009)",700:"oklch(49.1% 0.27 292.581)",800:"oklch(43.2% 0.232 292.759)",900:"oklch(38% 0.189 293.745)",950:"oklch(28.3% 0.141 291.089)"},purple:{50:"oklch(97.7% 0.014 308.299)",100:"oklch(94.6% 0.033 307.174)",200:"oklch(90.2% 0.063 306.703)",300:"oklch(82.7% 0.119 306.383)",400:"oklch(71.4% 0.203 305.504)",500:"oklch(62.7% 0.265 303.9)",600:"oklch(55.8% 0.288 302.321)",700:"oklch(49.6% 0.265 301.924)",800:"oklch(43.8% 0.218 303.724)",900:"oklch(38.1% 0.176 304.987)",950:"oklch(29.1% 0.149 302.717)"},fuchsia:{50:"oklch(97.7% 0.017 320.058)",100:"oklch(95.2% 0.037 318.852)",200:"oklch(90.3% 0.076 319.62)",300:"oklch(83.3% 0.145 321.434)",400:"oklch(74% 0.238 322.16)",500:"oklch(66.7% 0.295 322.15)",600:"oklch(59.1% 0.293 322.896)",700:"oklch(51.8% 0.253 323.949)",800:"oklch(45.2% 0.211 324.591)",900:"oklch(40.1% 0.17 325.612)",950:"oklch(29.3% 0.136 325.661)"},pink:{50:"oklch(97.1% 0.014 343.198)",100:"oklch(94.8% 0.028 342.258)",200:"oklch(89.9% 0.061 343.231)",300:"oklch(82.3% 0.12 346.018)",400:"oklch(71.8% 0.202 349.761)",500:"oklch(65.6% 0.241 354.308)",600:"oklch(59.2% 0.249 0.584)",700:"oklch(52.5% 0.223 3.958)",800:"oklch(45.9% 0.187 3.815)",900:"oklch(40.8% 0.153 2.432)",950:"oklch(28.4% 0.109 3.907)"},rose:{50:"oklch(96.9% 0.015 12.422)",100:"oklch(94.1% 0.03 12.58)",200:"oklch(89.2% 0.058 10.001)",300:"oklch(81% 0.117 11.638)",400:"oklch(71.2% 0.194 13.428)",500:"oklch(64.5% 0.246 16.439)",600:"oklch(58.6% 0.253 17.585)",700:"oklch(51.4% 0.222 16.935)",800:"oklch(45.5% 0.188 13.697)",900:"oklch(41% 0.159 10.272)",950:"oklch(27.1% 0.105 12.094)"}};function s(e){return{__BARE_VALUE__:e}}var r=s(e=>{if(i(e.value))return e.value}),o=s(e=>{if(i(e.value))return`${e.value}%`}),a=s(e=>{if(i(e.value))return`${e.value}px`}),b=s(e=>{if(i(e.value))return`${e.value}ms`}),p=s(e=>{if(i(e.value))return`${e.value}deg`}),S=s(e=>{if(e.fraction===null)return;let[c,t]=u(e.fraction,"/");if(!(!i(c)||!i(t)))return e.fraction}),E=s(e=>{if(i(Number(e.value)))return`repeat(${e.value}, minmax(0, 1fr))`}),y={accentColor:({theme:e})=>e("colors"),animation:{none:"none",spin:"spin 1s linear infinite",ping:"ping 1s cubic-bezier(0, 0, 0.2, 1) infinite",pulse:"pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite",bounce:"bounce 1s infinite"},aria:{busy:'busy="true"',checked:'checked="true"',disabled:'disabled="true"',expanded:'expanded="true"',hidden:'hidden="true"',pressed:'pressed="true"',readonly:'readonly="true"',required:'required="true"',selected:'selected="true"'},aspectRatio:{auto:"auto",square:"1 / 1",video:"16 / 9",...S},backdropBlur:({theme:e})=>e("blur"),backdropBrightness:({theme:e})=>({...e("brightness"),...o}),backdropContrast:({theme:e})=>({...e("contrast"),...o}),backdropGrayscale:({theme:e})=>({...e("grayscale"),...o}),backdropHueRotate:({theme:e})=>({...e("hueRotate"),...p}),backdropInvert:({theme:e})=>({...e("invert"),...o}),backdropOpacity:({theme:e})=>({...e("opacity"),...o}),backdropSaturate:({theme:e})=>({...e("saturate"),...o}),backdropSepia:({theme:e})=>({...e("sepia"),...o}),backgroundColor:({theme:e})=>e("colors"),backgroundImage:{none:"none","gradient-to-t":"linear-gradient(to top, var(--tw-gradient-stops))","gradient-to-tr":"linear-gradient(to top right, var(--tw-gradient-stops))","gradient-to-r":"linear-gradient(to right, var(--tw-gradient-stops))","gradient-to-br":"linear-gradient(to bottom right, var(--tw-gradient-stops))","gradient-to-b":"linear-gradient(to bottom, var(--tw-gradient-stops))","gradient-to-bl":"linear-gradient(to bottom left, var(--tw-gradient-stops))","gradient-to-l":"linear-gradient(to left, var(--tw-gradient-stops))","gradient-to-tl":"linear-gradient(to top left, var(--tw-gradient-stops))"},backgroundOpacity:({theme:e})=>e("opacity"),backgroundPosition:{bottom:"bottom",center:"center",left:"left","left-bottom":"left bottom","left-top":"left top",right:"right","right-bottom":"right bottom","right-top":"right top",top:"top"},backgroundSize:{auto:"auto",cover:"cover",contain:"contain"},blur:{0:"0",none:"",sm:"4px",DEFAULT:"8px",md:"12px",lg:"16px",xl:"24px","2xl":"40px","3xl":"64px"},borderColor:({theme:e})=>({DEFAULT:"currentcolor",...e("colors")}),borderOpacity:({theme:e})=>e("opacity"),borderRadius:{none:"0px",sm:"0.125rem",DEFAULT:"0.25rem",md:"0.375rem",lg:"0.5rem",xl:"0.75rem","2xl":"1rem","3xl":"1.5rem",full:"9999px"},borderSpacing:({theme:e})=>e("spacing"),borderWidth:{DEFAULT:"1px",0:"0px",2:"2px",4:"4px",8:"8px",...a},boxShadow:{sm:"0 1px 2px 0 rgb(0 0 0 / 0.05)",DEFAULT:"0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)",md:"0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)",lg:"0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)",xl:"0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)","2xl":"0 25px 50px -12px rgb(0 0 0 / 0.25)",inner:"inset 0 2px 4px 0 rgb(0 0 0 / 0.05)",none:"none"},boxShadowColor:({theme:e})=>e("colors"),brightness:{0:"0",50:".5",75:".75",90:".9",95:".95",100:"1",105:"1.05",110:"1.1",125:"1.25",150:"1.5",200:"2",...o},caretColor:({theme:e})=>e("colors"),colors:()=>({...f}),columns:{auto:"auto",1:"1",2:"2",3:"3",4:"4",5:"5",6:"6",7:"7",8:"8",9:"9",10:"10",11:"11",12:"12","3xs":"16rem","2xs":"18rem",xs:"20rem",sm:"24rem",md:"28rem",lg:"32rem",xl:"36rem","2xl":"42rem","3xl":"48rem","4xl":"56rem","5xl":"64rem","6xl":"72rem","7xl":"80rem",...r},container:{},content:{none:"none"},contrast:{0:"0",50:".5",75:".75",100:"1",125:"1.25",150:"1.5",200:"2",...o},cursor:{auto:"auto",default:"default",pointer:"pointer",wait:"wait",text:"text",move:"move",help:"help","not-allowed":"not-allowed",none:"none","context-menu":"context-menu",progress:"progress",cell:"cell",crosshair:"crosshair","vertical-text":"vertical-text",alias:"alias",copy:"copy","no-drop":"no-drop",grab:"grab",grabbing:"grabbing","all-scroll":"all-scroll","col-resize":"col-resize","row-resize":"row-resize","n-resize":"n-resize","e-resize":"e-resize","s-resize":"s-resize","w-resize":"w-resize","ne-resize":"ne-resize","nw-resize":"nw-resize","se-resize":"se-resize","sw-resize":"sw-resize","ew-resize":"ew-resize","ns-resize":"ns-resize","nesw-resize":"nesw-resize","nwse-resize":"nwse-resize","zoom-in":"zoom-in","zoom-out":"zoom-out"},divideColor:({theme:e})=>e("borderColor"),divideOpacity:({theme:e})=>e("borderOpacity"),divideWidth:({theme:e})=>({...e("borderWidth"),...a}),dropShadow:{sm:"0 1px 1px rgb(0 0 0 / 0.05)",DEFAULT:["0 1px 2px rgb(0 0 0 / 0.1)","0 1px 1px rgb(0 0 0 / 0.06)"],md:["0 4px 3px rgb(0 0 0 / 0.07)","0 2px 2px rgb(0 0 0 / 0.06)"],lg:["0 10px 8px rgb(0 0 0 / 0.04)","0 4px 3px rgb(0 0 0 / 0.1)"],xl:["0 20px 13px rgb(0 0 0 / 0.03)","0 8px 5px rgb(0 0 0 / 0.08)"],"2xl":"0 25px 25px rgb(0 0 0 / 0.15)",none:"0 0 #0000"},fill:({theme:e})=>e("colors"),flex:{1:"1 1 0%",auto:"1 1 auto",initial:"0 1 auto",none:"none"},flexBasis:({theme:e})=>({auto:"auto","1/2":"50%","1/3":"33.333333%","2/3":"66.666667%","1/4":"25%","2/4":"50%","3/4":"75%","1/5":"20%","2/5":"40%","3/5":"60%","4/5":"80%","1/6":"16.666667%","2/6":"33.333333%","3/6":"50%","4/6":"66.666667%","5/6":"83.333333%","1/12":"8.333333%","2/12":"16.666667%","3/12":"25%","4/12":"33.333333%","5/12":"41.666667%","6/12":"50%","7/12":"58.333333%","8/12":"66.666667%","9/12":"75%","10/12":"83.333333%","11/12":"91.666667%",full:"100%",...e("spacing")}),flexGrow:{0:"0",DEFAULT:"1",...r},flexShrink:{0:"0",DEFAULT:"1",...r},fontFamily:{sans:["ui-sans-serif","system-ui","sans-serif",'"Apple Color Emoji"','"Segoe UI Emoji"','"Segoe UI Symbol"','"Noto Color Emoji"'],serif:["ui-serif","Georgia","Cambria",'"Times New Roman"',"Times","serif"],mono:["ui-monospace","SFMono-Regular","Menlo","Monaco","Consolas",'"Liberation Mono"','"Courier New"',"monospace"]},fontSize:{xs:["0.75rem",{lineHeight:"1rem"}],sm:["0.875rem",{lineHeight:"1.25rem"}],base:["1rem",{lineHeight:"1.5rem"}],lg:["1.125rem",{lineHeight:"1.75rem"}],xl:["1.25rem",{lineHeight:"1.75rem"}],"2xl":["1.5rem",{lineHeight:"2rem"}],"3xl":["1.875rem",{lineHeight:"2.25rem"}],"4xl":["2.25rem",{lineHeight:"2.5rem"}],"5xl":["3rem",{lineHeight:"1"}],"6xl":["3.75rem",{lineHeight:"1"}],"7xl":["4.5rem",{lineHeight:"1"}],"8xl":["6rem",{lineHeight:"1"}],"9xl":["8rem",{lineHeight:"1"}]},fontWeight:{thin:"100",extralight:"200",light:"300",normal:"400",medium:"500",semibold:"600",bold:"700",extrabold:"800",black:"900"},gap:({theme:e})=>e("spacing"),gradientColorStops:({theme:e})=>e("colors"),gradientColorStopPositions:{"0%":"0%","5%":"5%","10%":"10%","15%":"15%","20%":"20%","25%":"25%","30%":"30%","35%":"35%","40%":"40%","45%":"45%","50%":"50%","55%":"55%","60%":"60%","65%":"65%","70%":"70%","75%":"75%","80%":"80%","85%":"85%","90%":"90%","95%":"95%","100%":"100%",...o},grayscale:{0:"0",DEFAULT:"100%",...o},gridAutoColumns:{auto:"auto",min:"min-content",max:"max-content",fr:"minmax(0, 1fr)"},gridAutoRows:{auto:"auto",min:"min-content",max:"max-content",fr:"minmax(0, 1fr)"},gridColumn:{auto:"auto","span-1":"span 1 / span 1","span-2":"span 2 / span 2","span-3":"span 3 / span 3","span-4":"span 4 / span 4","span-5":"span 5 / span 5","span-6":"span 6 / span 6","span-7":"span 7 / span 7","span-8":"span 8 / span 8","span-9":"span 9 / span 9","span-10":"span 10 / span 10","span-11":"span 11 / span 11","span-12":"span 12 / span 12","span-full":"1 / -1"},gridColumnEnd:{auto:"auto",1:"1",2:"2",3:"3",4:"4",5:"5",6:"6",7:"7",8:"8",9:"9",10:"10",11:"11",12:"12",13:"13",...r},gridColumnStart:{auto:"auto",1:"1",2:"2",3:"3",4:"4",5:"5",6:"6",7:"7",8:"8",9:"9",10:"10",11:"11",12:"12",13:"13",...r},gridRow:{auto:"auto","span-1":"span 1 / span 1","span-2":"span 2 / span 2","span-3":"span 3 / span 3","span-4":"span 4 / span 4","span-5":"span 5 / span 5","span-6":"span 6 / span 6","span-7":"span 7 / span 7","span-8":"span 8 / span 8","span-9":"span 9 / span 9","span-10":"span 10 / span 10","span-11":"span 11 / span 11","span-12":"span 12 / span 12","span-full":"1 / -1"},gridRowEnd:{auto:"auto",1:"1",2:"2",3:"3",4:"4",5:"5",6:"6",7:"7",8:"8",9:"9",10:"10",11:"11",12:"12",13:"13",...r},gridRowStart:{auto:"auto",1:"1",2:"2",3:"3",4:"4",5:"5",6:"6",7:"7",8:"8",9:"9",10:"10",11:"11",12:"12",13:"13",...r},gridTemplateColumns:{none:"none",subgrid:"subgrid",1:"repeat(1, minmax(0, 1fr))",2:"repeat(2, minmax(0, 1fr))",3:"repeat(3, minmax(0, 1fr))",4:"repeat(4, minmax(0, 1fr))",5:"repeat(5, minmax(0, 1fr))",6:"repeat(6, minmax(0, 1fr))",7:"repeat(7, minmax(0, 1fr))",8:"repeat(8, minmax(0, 1fr))",9:"repeat(9, minmax(0, 1fr))",10:"repeat(10, minmax(0, 1fr))",11:"repeat(11, minmax(0, 1fr))",12:"repeat(12, minmax(0, 1fr))",...E},gridTemplateRows:{none:"none",subgrid:"subgrid",1:"repeat(1, minmax(0, 1fr))",2:"repeat(2, minmax(0, 1fr))",3:"repeat(3, minmax(0, 1fr))",4:"repeat(4, minmax(0, 1fr))",5:"repeat(5, minmax(0, 1fr))",6:"repeat(6, minmax(0, 1fr))",7:"repeat(7, minmax(0, 1fr))",8:"repeat(8, minmax(0, 1fr))",9:"repeat(9, minmax(0, 1fr))",10:"repeat(10, minmax(0, 1fr))",11:"repeat(11, minmax(0, 1fr))",12:"repeat(12, minmax(0, 1fr))",...E},height:({theme:e})=>({auto:"auto","1/2":"50%","1/3":"33.333333%","2/3":"66.666667%","1/4":"25%","2/4":"50%","3/4":"75%","1/5":"20%","2/5":"40%","3/5":"60%","4/5":"80%","1/6":"16.666667%","2/6":"33.333333%","3/6":"50%","4/6":"66.666667%","5/6":"83.333333%",full:"100%",screen:"100vh",svh:"100svh",lvh:"100lvh",dvh:"100dvh",min:"min-content",max:"max-content",fit:"fit-content",...e("spacing")}),hueRotate:{0:"0deg",15:"15deg",30:"30deg",60:"60deg",90:"90deg",180:"180deg",...p},inset:({theme:e})=>({auto:"auto","1/2":"50%","1/3":"33.333333%","2/3":"66.666667%","1/4":"25%","2/4":"50%","3/4":"75%",full:"100%",...e("spacing")}),invert:{0:"0",DEFAULT:"100%",...o},keyframes:{spin:{to:{transform:"rotate(360deg)"}},ping:{"75%, 100%":{transform:"scale(2)",opacity:"0"}},pulse:{"50%":{opacity:".5"}},bounce:{"0%, 100%":{transform:"translateY(-25%)",animationTimingFunction:"cubic-bezier(0.8,0,1,1)"},"50%":{transform:"none",animationTimingFunction:"cubic-bezier(0,0,0.2,1)"}}},letterSpacing:{tighter:"-0.05em",tight:"-0.025em",normal:"0em",wide:"0.025em",wider:"0.05em",widest:"0.1em"},lineHeight:{none:"1",tight:"1.25",snug:"1.375",normal:"1.5",relaxed:"1.625",loose:"2",3:".75rem",4:"1rem",5:"1.25rem",6:"1.5rem",7:"1.75rem",8:"2rem",9:"2.25rem",10:"2.5rem"},listStyleType:{none:"none",disc:"disc",decimal:"decimal"},listStyleImage:{none:"none"},margin:({theme:e})=>({auto:"auto",...e("spacing")}),lineClamp:{1:"1",2:"2",3:"3",4:"4",5:"5",6:"6",...r},maxHeight:({theme:e})=>({none:"none",full:"100%",screen:"100vh",svh:"100svh",lvh:"100lvh",dvh:"100dvh",min:"min-content",max:"max-content",fit:"fit-content",...e("spacing")}),maxWidth:({theme:e})=>({none:"none",xs:"20rem",sm:"24rem",md:"28rem",lg:"32rem",xl:"36rem","2xl":"42rem","3xl":"48rem","4xl":"56rem","5xl":"64rem","6xl":"72rem","7xl":"80rem",full:"100%",min:"min-content",max:"max-content",fit:"fit-content",prose:"65ch",...e("spacing")}),minHeight:({theme:e})=>({full:"100%",screen:"100vh",svh:"100svh",lvh:"100lvh",dvh:"100dvh",min:"min-content",max:"max-content",fit:"fit-content",...e("spacing")}),minWidth:({theme:e})=>({full:"100%",min:"min-content",max:"max-content",fit:"fit-content",...e("spacing")}),objectPosition:{bottom:"bottom",center:"center",left:"left","left-bottom":"left bottom","left-top":"left top",right:"right","right-bottom":"right bottom","right-top":"right top",top:"top"},opacity:{0:"0",5:"0.05",10:"0.1",15:"0.15",20:"0.2",25:"0.25",30:"0.3",35:"0.35",40:"0.4",45:"0.45",50:"0.5",55:"0.55",60:"0.6",65:"0.65",70:"0.7",75:"0.75",80:"0.8",85:"0.85",90:"0.9",95:"0.95",100:"1",...o},order:{first:"-9999",last:"9999",none:"0",1:"1",2:"2",3:"3",4:"4",5:"5",6:"6",7:"7",8:"8",9:"9",10:"10",11:"11",12:"12",...r},outlineColor:({theme:e})=>e("colors"),outlineOffset:{0:"0px",1:"1px",2:"2px",4:"4px",8:"8px",...a},outlineWidth:{0:"0px",1:"1px",2:"2px",4:"4px",8:"8px",...a},padding:({theme:e})=>e("spacing"),placeholderColor:({theme:e})=>e("colors"),placeholderOpacity:({theme:e})=>e("opacity"),ringColor:({theme:e})=>({DEFAULT:"currentcolor",...e("colors")}),ringOffsetColor:({theme:e})=>e("colors"),ringOffsetWidth:{0:"0px",1:"1px",2:"2px",4:"4px",8:"8px",...a},ringOpacity:({theme:e})=>({DEFAULT:"0.5",...e("opacity")}),ringWidth:{DEFAULT:"3px",0:"0px",1:"1px",2:"2px",4:"4px",8:"8px",...a},rotate:{0:"0deg",1:"1deg",2:"2deg",3:"3deg",6:"6deg",12:"12deg",45:"45deg",90:"90deg",180:"180deg",...p},saturate:{0:"0",50:".5",100:"1",150:"1.5",200:"2",...o},scale:{0:"0",50:".5",75:".75",90:".9",95:".95",100:"1",105:"1.05",110:"1.1",125:"1.25",150:"1.5",...o},screens:{sm:"40rem",md:"48rem",lg:"64rem",xl:"80rem","2xl":"96rem"},scrollMargin:({theme:e})=>e("spacing"),scrollPadding:({theme:e})=>e("spacing"),sepia:{0:"0",DEFAULT:"100%",...o},skew:{0:"0deg",1:"1deg",2:"2deg",3:"3deg",6:"6deg",12:"12deg",...p},space:({theme:e})=>e("spacing"),spacing:{px:"1px",0:"0px",.5:"0.125rem",1:"0.25rem",1.5:"0.375rem",2:"0.5rem",2.5:"0.625rem",3:"0.75rem",3.5:"0.875rem",4:"1rem",5:"1.25rem",6:"1.5rem",7:"1.75rem",8:"2rem",9:"2.25rem",10:"2.5rem",11:"2.75rem",12:"3rem",14:"3.5rem",16:"4rem",20:"5rem",24:"6rem",28:"7rem",32:"8rem",36:"9rem",40:"10rem",44:"11rem",48:"12rem",52:"13rem",56:"14rem",60:"15rem",64:"16rem",72:"18rem",80:"20rem",96:"24rem"},stroke:({theme:e})=>({none:"none",...e("colors")}),strokeWidth:{0:"0",1:"1",2:"2",...r},supports:{},data:{},textColor:({theme:e})=>e("colors"),textDecorationColor:({theme:e})=>e("colors"),textDecorationThickness:{auto:"auto","from-font":"from-font",0:"0px",1:"1px",2:"2px",4:"4px",8:"8px",...a},textIndent:({theme:e})=>e("spacing"),textOpacity:({theme:e})=>e("opacity"),textUnderlineOffset:{auto:"auto",0:"0px",1:"1px",2:"2px",4:"4px",8:"8px",...a},transformOrigin:{center:"center",top:"top","top-right":"top right",right:"right","bottom-right":"bottom right",bottom:"bottom","bottom-left":"bottom left",left:"left","top-left":"top left"},transitionDelay:{0:"0s",75:"75ms",100:"100ms",150:"150ms",200:"200ms",300:"300ms",500:"500ms",700:"700ms",1e3:"1000ms",...b},transitionDuration:{DEFAULT:"150ms",0:"0s",75:"75ms",100:"100ms",150:"150ms",200:"200ms",300:"300ms",500:"500ms",700:"700ms",1e3:"1000ms",...b},transitionProperty:{none:"none",all:"all",DEFAULT:"color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter",colors:"color, background-color, border-color, outline-color, text-decoration-color, fill, stroke",opacity:"opacity",shadow:"box-shadow",transform:"transform"},transitionTimingFunction:{DEFAULT:"cubic-bezier(0.4, 0, 0.2, 1)",linear:"linear",in:"cubic-bezier(0.4, 0, 1, 1)",out:"cubic-bezier(0, 0, 0.2, 1)","in-out":"cubic-bezier(0.4, 0, 0.2, 1)"},translate:({theme:e})=>({"1/2":"50%","1/3":"33.333333%","2/3":"66.666667%","1/4":"25%","2/4":"50%","3/4":"75%",full:"100%",...e("spacing")}),size:({theme:e})=>({auto:"auto","1/2":"50%","1/3":"33.333333%","2/3":"66.666667%","1/4":"25%","2/4":"50%","3/4":"75%","1/5":"20%","2/5":"40%","3/5":"60%","4/5":"80%","1/6":"16.666667%","2/6":"33.333333%","3/6":"50%","4/6":"66.666667%","5/6":"83.333333%","1/12":"8.333333%","2/12":"16.666667%","3/12":"25%","4/12":"33.333333%","5/12":"41.666667%","6/12":"50%","7/12":"58.333333%","8/12":"66.666667%","9/12":"75%","10/12":"83.333333%","11/12":"91.666667%",full:"100%",min:"min-content",max:"max-content",fit:"fit-content",...e("spacing")}),width:({theme:e})=>({auto:"auto","1/2":"50%","1/3":"33.333333%","2/3":"66.666667%","1/4":"25%","2/4":"50%","3/4":"75%","1/5":"20%","2/5":"40%","3/5":"60%","4/5":"80%","1/6":"16.666667%","2/6":"33.333333%","3/6":"50%","4/6":"66.666667%","5/6":"83.333333%","1/12":"8.333333%","2/12":"16.666667%","3/12":"25%","4/12":"33.333333%","5/12":"41.666667%","6/12":"50%","7/12":"58.333333%","8/12":"66.666667%","9/12":"75%","10/12":"83.333333%","11/12":"91.666667%",full:"100%",screen:"100vw",svw:"100svw",lvw:"100lvw",dvw:"100dvw",min:"min-content",max:"max-content",fit:"fit-content",...e("spacing")}),willChange:{auto:"auto",scroll:"scroll-position",contents:"contents",transform:"transform"},zIndex:{auto:"auto",0:"0",10:"10",20:"20",30:"30",40:"40",50:"50",...r}};module.exports=y;
+1
dist/default-theme.mjs
import{j as a}from"./chunk-XVOTX5KS.mjs";import"./chunk-X4GG3EDV.mjs";export{a as default};
+6
dist/flatten-color-palette.d.mts
type Colors = {
[key: string | number]: string | Colors;
};
declare function flattenColorPalette(colors: Colors): Record<string, string>;
export { flattenColorPalette as default };
+6
dist/flatten-color-palette.d.ts
type Colors = {
[key: string | number]: string | Colors;
};
declare function flattenColorPalette(colors: Colors): Record<string, string>;
export { flattenColorPalette as default };
+1
dist/flatten-color-palette.js
"use strict";function n(r){let i={};for(let[e,t]of Object.entries(r??{}))if(e!=="__CSS_VALUES__")if(typeof t=="object"&&t!==null)for(let[s,l]of Object.entries(n(t)))i[`${e}${s==="DEFAULT"?"":`-${s}`}`]=l;else i[e]=t;if("__CSS_VALUES__"in r)for(let[e,t]of Object.entries(r.__CSS_VALUES__))(Number(t)&4)===0&&(i[e]=r[e]);return i}module.exports=n;
+1
dist/flatten-color-palette.mjs
import"./chunk-4VTQOGRC.mjs";function i(r){let n={};for(let[e,t]of Object.entries(r??{}))if(e!=="__CSS_VALUES__")if(typeof t=="object"&&t!==null)for(let[o,f]of Object.entries(i(t)))n[`${e}${o==="DEFAULT"?"":`-${o}`}`]=f;else n[e]=t;if("__CSS_VALUES__"in r)for(let[e,t]of Object.entries(r.__CSS_VALUES__))(Number(t)&4)===0&&(n[e]=r[e]);return n}export{i as default};
+379
dist/lib.d.mts
import { S as SourceLocation, U as UserConfig, P as Plugin } from './types-CJYAW1ql.mjs';
import { V as Variant, C as Candidate } from './resolve-config-QUZ9b-Gn.mjs';
import './colors.mjs';
declare const enum ThemeOptions {
NONE = 0,
INLINE = 1,
REFERENCE = 2,
DEFAULT = 4,
STATIC = 8,
USED = 16
}
declare class Theme {
#private;
private values;
private keyframes;
prefix: string | null;
constructor(values?: Map<string, {
value: string;
options: ThemeOptions;
src: Declaration["src"];
}>, keyframes?: Set<AtRule>);
get size(): number;
add(key: string, value: string, options?: ThemeOptions, src?: Declaration['src']): void;
keysInNamespaces(themeKeys: Iterable<ThemeKey>): string[];
get(themeKeys: ThemeKey[]): string | null;
hasDefault(key: string): boolean;
getOptions(key: string): ThemeOptions;
entries(): MapIterator<[string, {
value: string;
options: ThemeOptions;
src: Declaration["src"];
}]> | [string, {
value: string;
options: ThemeOptions;
src: Declaration["src"];
}][];
prefixKey(key: string): string;
clearNamespace(namespace: string, clearOptions: ThemeOptions): void;
markUsedVariable(themeKey: string): boolean;
resolve(candidateValue: string | null, themeKeys: ThemeKey[], options?: ThemeOptions): string | null;
resolveValue(candidateValue: string | null, themeKeys: ThemeKey[]): string | null;
resolveWith(candidateValue: string, themeKeys: ThemeKey[], nestedKeys?: `--${string}`[]): [string, Record<string, string>] | null;
namespace(namespace: string): Map<string | null, string>;
addKeyframes(value: AtRule): void;
getKeyframes(): AtRule[];
}
type ThemeKey = `--${string}`;
type VariantFn<T extends Variant['kind']> = (rule: Rule, variant: Extract<Variant, {
kind: T;
}>) => null | void;
type CompareFn = (a: Variant, z: Variant) => number;
declare const enum Compounds {
Never = 0,
AtRules = 1,
StyleRules = 2
}
declare class Variants {
compareFns: Map<number, CompareFn>;
variants: Map<string, {
kind: Variant["kind"];
order: number;
applyFn: VariantFn<any>;
compoundsWith: Compounds;
compounds: Compounds;
}>;
private completions;
/**
* Registering a group of variants should result in the same sort number for
* all the variants. This is to ensure that the variants are applied in the
* correct order.
*/
private groupOrder;
/**
* Keep track of the last sort order instead of using the size of the map to
* avoid unnecessarily skipping order numbers.
*/
private lastOrder;
static(name: string, applyFn: VariantFn<'static'>, { compounds, order }?: {
compounds?: Compounds;
order?: number;
}): void;
fromAst(name: string, ast: AstNode[], designSystem: DesignSystem): void;
functional(name: string, applyFn: VariantFn<'functional'>, { compounds, order }?: {
compounds?: Compounds;
order?: number;
}): void;
compound(name: string, compoundsWith: Compounds, applyFn: VariantFn<'compound'>, { compounds, order }?: {
compounds?: Compounds;
order?: number;
}): void;
group(fn: () => void, compareFn?: CompareFn): void;
has(name: string): boolean;
get(name: string): {
kind: Variant["kind"];
order: number;
applyFn: VariantFn<any>;
compoundsWith: Compounds;
compounds: Compounds;
} | undefined;
kind(name: string): "static" | "arbitrary" | "functional" | "compound";
compoundsWith(parent: string, child: string | Variant): boolean;
suggest(name: string, suggestions: () => string[]): void;
getCompletions(name: string): string[];
compare(a: Variant | null, z: Variant | null): number;
keys(): MapIterator<string>;
entries(): MapIterator<[string, {
kind: Variant["kind"];
order: number;
applyFn: VariantFn<any>;
compoundsWith: Compounds;
compounds: Compounds;
}]>;
private set;
private nextOrder;
}
declare function compileAstNodes(candidate: Candidate, designSystem: DesignSystem, flags: CompileAstFlags): {
node: AstNode;
propertySort: {
order: number[];
count: number;
};
}[];
interface CanonicalizeOptions {
/**
* The root font size in pixels. If provided, `rem` values will be normalized
* to `px` values.
*
* E.g.: `mt-[16px]` with `rem: 16` will become `mt-4` (assuming `--spacing: 0.25rem`).
*/
rem?: number;
/**
* Whether to collapse multiple utilities into a single utility if possible.
*
* E.g.: `mt-2 mr-2 mb-2 ml-2` → `m-2`
*/
collapse?: boolean;
/**
* Whether to convert between logical and physical properties when collapsing
* utilities.
*
* E.g.: `mr-2 ml-2` → `mx-2`
*/
logicalToPhysical?: boolean;
}
interface ClassMetadata {
modifiers: string[];
}
type ClassEntry = [string, ClassMetadata];
interface SelectorOptions {
modifier?: string;
value?: string;
}
interface VariantEntry {
name: string;
isArbitrary: boolean;
values: string[];
hasDash: boolean;
selectors: (options: SelectorOptions) => string[];
}
type CompileFn<T extends Candidate['kind']> = (value: Extract<Candidate, {
kind: T;
}>) => AstNode[] | undefined | null;
interface SuggestionGroup {
supportsNegative?: boolean;
values: (string | null)[];
modifiers: string[];
}
type UtilityOptions = {
types: string[];
};
type Utility = {
kind: 'static' | 'functional';
compileFn: CompileFn<any>;
options?: UtilityOptions;
};
declare class Utilities {
private utilities;
private completions;
static(name: string, compileFn: CompileFn<'static'>): void;
functional(name: string, compileFn: CompileFn<'functional'>, options?: UtilityOptions): void;
has(name: string, kind: 'static' | 'functional'): boolean;
get(name: string): Utility[];
getCompletions(name: string): SuggestionGroup[];
suggest(name: string, groups: () => SuggestionGroup[]): void;
keys(kind: 'static' | 'functional'): string[];
}
declare const enum CompileAstFlags {
None = 0,
RespectImportant = 1
}
type DesignSystem = {
theme: Theme;
utilities: Utilities;
variants: Variants;
invalidCandidates: Set<string>;
important: boolean;
getClassOrder(classes: string[]): [string, bigint | null][];
getClassList(): ClassEntry[];
getVariants(): VariantEntry[];
parseCandidate(candidate: string): Readonly<Candidate>[];
parseVariant(variant: string): Readonly<Variant> | null;
compileAstNodes(candidate: Candidate, flags?: CompileAstFlags): ReturnType<typeof compileAstNodes>;
printCandidate(candidate: Candidate): string;
printVariant(variant: Variant): string;
getVariantOrder(): Map<Variant, number>;
resolveThemeValue(path: string, forceInline?: boolean): string | undefined;
trackUsedVariables(raw: string): void;
canonicalizeCandidates(candidates: string[], options?: CanonicalizeOptions): string[];
candidatesToCss(classes: string[]): (string | null)[];
candidatesToAst(classes: string[]): AstNode[][];
storage: Record<symbol, unknown>;
};
type StyleRule = {
kind: 'rule';
selector: string;
nodes: AstNode[];
src?: SourceLocation;
dst?: SourceLocation;
};
type AtRule = {
kind: 'at-rule';
name: string;
params: string;
nodes: AstNode[];
src?: SourceLocation;
dst?: SourceLocation;
};
type Declaration = {
kind: 'declaration';
property: string;
value: string | undefined;
important: boolean;
src?: SourceLocation;
dst?: SourceLocation;
};
type Comment = {
kind: 'comment';
value: string;
src?: SourceLocation;
dst?: SourceLocation;
};
type Context = {
kind: 'context';
context: Record<string, string | boolean>;
nodes: AstNode[];
src?: undefined;
dst?: undefined;
};
type AtRoot = {
kind: 'at-root';
nodes: AstNode[];
src?: undefined;
dst?: undefined;
};
type Rule = StyleRule | AtRule;
type AstNode = StyleRule | AtRule | Declaration | Comment | Context | AtRoot;
/**
* Line offset tables are the key to generating our source maps. They allow us
* to store indexes with our AST nodes and later convert them into positions as
* when given the source that the indexes refer to.
*/
/**
* A position in source code
*
* https://tc39.es/ecma426/#sec-position-record-type
*/
interface Position {
/** The line number, one-based */
line: number;
/** The column/character number, one-based */
column: number;
}
interface OriginalPosition extends Position {
source: DecodedSource;
}
/**
* A "decoded" sourcemap
*
* @see https://tc39.es/ecma426/#decoded-source-map-record
*/
interface DecodedSourceMap {
file: string | null;
sources: DecodedSource[];
mappings: DecodedMapping[];
}
/**
* A "decoded" source
*
* @see https://tc39.es/ecma426/#decoded-source-record
*/
interface DecodedSource {
url: string | null;
content: string | null;
ignore: boolean;
}
/**
* A "decoded" mapping
*
* @see https://tc39.es/ecma426/#decoded-mapping-record
*/
interface DecodedMapping {
originalPosition: OriginalPosition | null;
generatedPosition: Position;
name: string | null;
}
interface Config extends UserConfig {
}
declare const enum Polyfills {
None = 0,
AtProperty = 1,
ColorMix = 2,
All = 3
}
type CompileOptions = {
base?: string;
from?: string;
polyfills?: Polyfills;
loadModule?: (id: string, base: string, resourceHint: 'plugin' | 'config') => Promise<{
path: string;
base: string;
module: Plugin | Config;
}>;
loadStylesheet?: (id: string, base: string) => Promise<{
path: string;
base: string;
content: string;
}>;
};
type Root = null | 'none' | {
base: string;
pattern: string;
};
declare const enum Features {
None = 0,
AtApply = 1,
AtImport = 2,
JsPluginCompat = 4,
ThemeFunction = 8,
Utilities = 16,
Variants = 32,
AtTheme = 64
}
declare function compileAst(input: AstNode[], opts?: CompileOptions): Promise<{
sources: {
base: string;
pattern: string;
negated: boolean;
}[];
root: Root;
features: Features;
build(candidates: string[]): AstNode[];
}>;
declare function compile(css: string, opts?: CompileOptions): Promise<{
sources: {
base: string;
pattern: string;
negated: boolean;
}[];
root: Root;
features: Features;
build(candidates: string[]): string;
buildSourceMap(): DecodedSourceMap;
}>;
declare function __unstable__loadDesignSystem(css: string, opts?: CompileOptions): Promise<DesignSystem>;
declare function postcssPluginWarning(): void;
export { type Config, type DecodedSourceMap, Features, Polyfills, __unstable__loadDesignSystem, compile, compileAst, postcssPluginWarning as default };
+3
dist/lib.d.ts
declare function postcssPluginWarning(): void;
export { postcssPluginWarning as default };
dist/lib.js

Sorry, the diff of this file is too big to display

dist/lib.mjs

Sorry, the diff of this file is too big to display

+11
dist/plugin.d.mts
export { P as PluginUtils } from './resolve-config-QUZ9b-Gn.mjs';
import { a as PluginFn, C as Config, b as PluginWithConfig, c as PluginWithOptions } from './types-CJYAW1ql.mjs';
export { d as PluginAPI, P as PluginsConfig, T as ThemeConfig } from './types-CJYAW1ql.mjs';
import './colors.mjs';
declare function createPlugin(handler: PluginFn, config?: Partial<Config>): PluginWithConfig;
declare namespace createPlugin {
var withOptions: <T>(pluginFunction: (options?: T) => PluginFn, configFunction?: (options?: T) => Partial<Config>) => PluginWithOptions<T>;
}
export { Config, PluginFn as PluginCreator, PluginWithConfig, createPlugin as default };
+134
dist/plugin.d.ts
import { N as NamedUtilityValue, P as PluginUtils } from './resolve-config-B4yBzhca.js';
import './colors-C__qRT83.js';
/**
* The source code for one or more nodes in the AST
*
* This generally corresponds to a stylesheet
*/
interface Source {
/**
* The path to the file that contains the referenced source code
*
* If this references the *output* source code, this is `null`.
*/
file: string | null;
/**
* The referenced source code
*/
code: string;
}
/**
* The file and offsets within it that this node covers
*
* This can represent either:
* - A location in the original CSS which caused this node to be created
* - A location in the output CSS where this node resides
*/
type SourceLocation = [source: Source, start: number, end: number];
type Config = UserConfig;
type PluginFn = (api: PluginAPI) => void;
type PluginWithConfig = {
handler: PluginFn;
config?: UserConfig;
/** @internal */
reference?: boolean;
src?: SourceLocation | undefined;
};
type PluginWithOptions<T> = {
(options?: T): PluginWithConfig;
__isOptionsFunction: true;
};
type Plugin = PluginFn | PluginWithConfig | PluginWithOptions<any>;
type PluginAPI = {
addBase(base: CssInJs): void;
addVariant(name: string, variant: string | string[] | CssInJs): void;
matchVariant<T = string>(name: string, cb: (value: T | string, extra: {
modifier: string | null;
}) => string | string[], options?: {
values?: Record<string, T>;
sort?(a: {
value: T | string;
modifier: string | null;
}, b: {
value: T | string;
modifier: string | null;
}): number;
}): void;
addUtilities(utilities: Record<string, CssInJs | CssInJs[]> | Record<string, CssInJs | CssInJs[]>[], options?: {}): void;
matchUtilities(utilities: Record<string, (value: string, extra: {
modifier: string | null;
}) => CssInJs | CssInJs[]>, options?: Partial<{
type: string | string[];
supportsNegativeValues: boolean;
values: Record<string, string> & {
__BARE_VALUE__?: (value: NamedUtilityValue) => string | undefined;
};
modifiers: 'any' | Record<string, string>;
}>): void;
addComponents(utilities: Record<string, CssInJs> | Record<string, CssInJs>[], options?: {}): void;
matchComponents(utilities: Record<string, (value: string, extra: {
modifier: string | null;
}) => CssInJs>, options?: Partial<{
type: string | string[];
supportsNegativeValues: boolean;
values: Record<string, string> & {
__BARE_VALUE__?: (value: NamedUtilityValue) => string | undefined;
};
modifiers: 'any' | Record<string, string>;
}>): void;
theme(path: string, defaultValue?: any): any;
config(path?: string, defaultValue?: any): any;
prefix(className: string): string;
};
type CssInJs = {
[key: string]: string | string[] | CssInJs | CssInJs[];
};
type ResolvableTo<T> = T | ((utils: PluginUtils) => T);
type ThemeValue = ResolvableTo<Record<string, unknown>> | null | undefined;
type ThemeConfig = Record<string, ThemeValue> & {
extend?: Record<string, ThemeValue>;
};
type ContentFile = string | {
raw: string;
extension?: string;
};
type DarkModeStrategy = false | 'media' | 'class' | ['class', string] | 'selector' | ['selector', string] | ['variant', string | string[]];
interface UserConfig {
presets?: UserConfig[];
theme?: ThemeConfig;
plugins?: Plugin[];
}
interface UserConfig {
content?: ContentFile[] | {
relative?: boolean;
files: ContentFile[];
};
}
interface UserConfig {
darkMode?: DarkModeStrategy;
}
interface UserConfig {
prefix?: string;
}
interface UserConfig {
blocklist?: string[];
}
interface UserConfig {
important?: boolean | string;
}
interface UserConfig {
future?: 'all' | Record<string, boolean>;
}
interface UserConfig {
experimental?: 'all' | Record<string, boolean>;
}
declare function createPlugin(handler: PluginFn, config?: Partial<Config>): PluginWithConfig;
declare namespace createPlugin {
var withOptions: <T>(pluginFunction: (options?: T) => PluginFn, configFunction?: (options?: T) => Partial<Config>) => PluginWithOptions<T>;
}
export { createPlugin as default };
+1
dist/plugin.js
"use strict";function g(i,n){return{handler:i,config:n}}g.withOptions=function(i,n=()=>({})){function t(o){return{handler:i(o),config:n(o)}}return t.__isOptionsFunction=!0,t};var u=g;module.exports=u;
+1
dist/plugin.mjs
function g(i,n){return{handler:i,config:n}}g.withOptions=function(i,n=()=>({})){function t(o){return{handler:i(o),config:n(o)}}return t.__isOptionsFunction=!0,t};var u=g;export{u as default};
+29
dist/resolve-config-B4yBzhca.d.ts
import { _ as _default } from './colors-C__qRT83.js';
type NamedUtilityValue = {
kind: 'named';
/**
* ```
* bg-red-500
* ^^^^^^^
*
* w-1/2
* ^
* ```
*/
value: string;
/**
* ```
* w-1/2
* ^^^
* ```
*/
fraction: string | null;
};
type PluginUtils = {
theme: (keypath: string, defaultValue?: any) => any;
colors: typeof _default;
};
export type { NamedUtilityValue as N, PluginUtils as P };
+190
dist/resolve-config-QUZ9b-Gn.d.mts
import _default from './colors.mjs';
type ArbitraryUtilityValue = {
kind: 'arbitrary';
/**
* ```
* bg-[color:var(--my-color)]
* ^^^^^
*
* bg-(color:--my-color)
* ^^^^^
* ```
*/
dataType: string | null;
/**
* ```
* bg-[#0088cc]
* ^^^^^^^
*
* bg-[var(--my_variable)]
* ^^^^^^^^^^^^^^^^^^
*
* bg-(--my_variable)
* ^^^^^^^^^^^^^^
* ```
*/
value: string;
};
type NamedUtilityValue = {
kind: 'named';
/**
* ```
* bg-red-500
* ^^^^^^^
*
* w-1/2
* ^
* ```
*/
value: string;
/**
* ```
* w-1/2
* ^^^
* ```
*/
fraction: string | null;
};
type ArbitraryModifier = {
kind: 'arbitrary';
/**
* ```
* bg-red-500/[50%]
* ^^^
* ```
*/
value: string;
};
type NamedModifier = {
kind: 'named';
/**
* ```
* bg-red-500/50
* ^^
* ```
*/
value: string;
};
type ArbitraryVariantValue = {
kind: 'arbitrary';
value: string;
};
type NamedVariantValue = {
kind: 'named';
value: string;
};
type Variant =
/**
* Arbitrary variants are variants that take a selector and generate a variant
* on the fly.
*
* E.g.: `[&_p]`
*/
{
kind: 'arbitrary';
selector: string;
relative: boolean;
}
/**
* Static variants are variants that don't take any arguments.
*
* E.g.: `hover`
*/
| {
kind: 'static';
root: string;
}
/**
* Functional variants are variants that can take an argument. The argument is
* either a named variant value or an arbitrary variant value.
*
* E.g.:
*
* - `aria-disabled`
* - `aria-[disabled]`
* - `@container-size` -> @container, with named value `size`
* - `@container-[inline-size]` -> @container, with arbitrary variant value `inline-size`
* - `@container` -> @container, with no value
*/
| {
kind: 'functional';
root: string;
value: ArbitraryVariantValue | NamedVariantValue | null;
modifier: ArbitraryModifier | NamedModifier | null;
}
/**
* Compound variants are variants that take another variant as an argument.
*
* E.g.:
*
* - `has-[&_p]`
* - `group-*`
* - `peer-*`
*/
| {
kind: 'compound';
root: string;
modifier: ArbitraryModifier | NamedModifier | null;
variant: Variant;
};
type Candidate =
/**
* Arbitrary candidates are candidates that register utilities on the fly with
* a property and a value.
*
* E.g.:
*
* - `[color:red]`
* - `[color:red]/50`
* - `[color:red]/50!`
*/
{
kind: 'arbitrary';
property: string;
value: string;
modifier: ArbitraryModifier | NamedModifier | null;
variants: Variant[];
important: boolean;
raw: string;
}
/**
* Static candidates are candidates that don't take any arguments.
*
* E.g.:
*
* - `underline`
* - `box-border`
*/
| {
kind: 'static';
root: string;
variants: Variant[];
important: boolean;
raw: string;
}
/**
* Functional candidates are candidates that can take an argument.
*
* E.g.:
*
* - `bg-red-500`
* - `bg-[#0088cc]`
* - `w-1/2`
*/
| {
kind: 'functional';
root: string;
value: ArbitraryUtilityValue | NamedUtilityValue | null;
modifier: ArbitraryModifier | NamedModifier | null;
variants: Variant[];
important: boolean;
raw: string;
};
type PluginUtils = {
theme: (keypath: string, defaultValue?: any) => any;
colors: typeof _default;
};
export type { Candidate as C, NamedUtilityValue as N, PluginUtils as P, Variant as V };
+128
dist/types-CJYAW1ql.d.mts
import { N as NamedUtilityValue, P as PluginUtils } from './resolve-config-QUZ9b-Gn.mjs';
/**
* The source code for one or more nodes in the AST
*
* This generally corresponds to a stylesheet
*/
interface Source {
/**
* The path to the file that contains the referenced source code
*
* If this references the *output* source code, this is `null`.
*/
file: string | null;
/**
* The referenced source code
*/
code: string;
}
/**
* The file and offsets within it that this node covers
*
* This can represent either:
* - A location in the original CSS which caused this node to be created
* - A location in the output CSS where this node resides
*/
type SourceLocation = [source: Source, start: number, end: number];
type Config = UserConfig;
type PluginFn = (api: PluginAPI) => void;
type PluginWithConfig = {
handler: PluginFn;
config?: UserConfig;
/** @internal */
reference?: boolean;
src?: SourceLocation | undefined;
};
type PluginWithOptions<T> = {
(options?: T): PluginWithConfig;
__isOptionsFunction: true;
};
type Plugin = PluginFn | PluginWithConfig | PluginWithOptions<any>;
type PluginAPI = {
addBase(base: CssInJs): void;
addVariant(name: string, variant: string | string[] | CssInJs): void;
matchVariant<T = string>(name: string, cb: (value: T | string, extra: {
modifier: string | null;
}) => string | string[], options?: {
values?: Record<string, T>;
sort?(a: {
value: T | string;
modifier: string | null;
}, b: {
value: T | string;
modifier: string | null;
}): number;
}): void;
addUtilities(utilities: Record<string, CssInJs | CssInJs[]> | Record<string, CssInJs | CssInJs[]>[], options?: {}): void;
matchUtilities(utilities: Record<string, (value: string, extra: {
modifier: string | null;
}) => CssInJs | CssInJs[]>, options?: Partial<{
type: string | string[];
supportsNegativeValues: boolean;
values: Record<string, string> & {
__BARE_VALUE__?: (value: NamedUtilityValue) => string | undefined;
};
modifiers: 'any' | Record<string, string>;
}>): void;
addComponents(utilities: Record<string, CssInJs> | Record<string, CssInJs>[], options?: {}): void;
matchComponents(utilities: Record<string, (value: string, extra: {
modifier: string | null;
}) => CssInJs>, options?: Partial<{
type: string | string[];
supportsNegativeValues: boolean;
values: Record<string, string> & {
__BARE_VALUE__?: (value: NamedUtilityValue) => string | undefined;
};
modifiers: 'any' | Record<string, string>;
}>): void;
theme(path: string, defaultValue?: any): any;
config(path?: string, defaultValue?: any): any;
prefix(className: string): string;
};
type CssInJs = {
[key: string]: string | string[] | CssInJs | CssInJs[];
};
type ResolvableTo<T> = T | ((utils: PluginUtils) => T);
type ThemeValue = ResolvableTo<Record<string, unknown>> | null | undefined;
type ThemeConfig = Record<string, ThemeValue> & {
extend?: Record<string, ThemeValue>;
};
type ContentFile = string | {
raw: string;
extension?: string;
};
type DarkModeStrategy = false | 'media' | 'class' | ['class', string] | 'selector' | ['selector', string] | ['variant', string | string[]];
interface UserConfig {
presets?: UserConfig[];
theme?: ThemeConfig;
plugins?: Plugin[];
}
interface UserConfig {
content?: ContentFile[] | {
relative?: boolean;
files: ContentFile[];
};
}
interface UserConfig {
darkMode?: DarkModeStrategy;
}
interface UserConfig {
prefix?: string;
}
interface UserConfig {
blocklist?: string[];
}
interface UserConfig {
important?: boolean | string;
}
interface UserConfig {
future?: 'all' | Record<string, boolean>;
}
interface UserConfig {
experimental?: 'all' | Record<string, boolean>;
}
export type { Config as C, Plugin as P, SourceLocation as S, ThemeConfig as T, UserConfig as U, PluginFn as a, PluginWithConfig as b, PluginWithOptions as c, PluginAPI as d };
+944
index.css
@layer theme, base, components, utilities;
@layer theme {
@theme default {
--font-sans:
ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
"Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
--font-mono:
ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
"Courier New", monospace;
--color-red-50: oklch(97.1% 0.013 17.38);
--color-red-100: oklch(93.6% 0.032 17.717);
--color-red-200: oklch(88.5% 0.062 18.334);
--color-red-300: oklch(80.8% 0.114 19.571);
--color-red-400: oklch(70.4% 0.191 22.216);
--color-red-500: oklch(63.7% 0.237 25.331);
--color-red-600: oklch(57.7% 0.245 27.325);
--color-red-700: oklch(50.5% 0.213 27.518);
--color-red-800: oklch(44.4% 0.177 26.899);
--color-red-900: oklch(39.6% 0.141 25.723);
--color-red-950: oklch(25.8% 0.092 26.042);
--color-orange-50: oklch(98% 0.016 73.684);
--color-orange-100: oklch(95.4% 0.038 75.164);
--color-orange-200: oklch(90.1% 0.076 70.697);
--color-orange-300: oklch(83.7% 0.128 66.29);
--color-orange-400: oklch(75% 0.183 55.934);
--color-orange-500: oklch(70.5% 0.213 47.604);
--color-orange-600: oklch(64.6% 0.222 41.116);
--color-orange-700: oklch(55.3% 0.195 38.402);
--color-orange-800: oklch(47% 0.157 37.304);
--color-orange-900: oklch(40.8% 0.123 38.172);
--color-orange-950: oklch(26.6% 0.079 36.259);
--color-amber-50: oklch(98.7% 0.022 95.277);
--color-amber-100: oklch(96.2% 0.059 95.617);
--color-amber-200: oklch(92.4% 0.12 95.746);
--color-amber-300: oklch(87.9% 0.169 91.605);
--color-amber-400: oklch(82.8% 0.189 84.429);
--color-amber-500: oklch(76.9% 0.188 70.08);
--color-amber-600: oklch(66.6% 0.179 58.318);
--color-amber-700: oklch(55.5% 0.163 48.998);
--color-amber-800: oklch(47.3% 0.137 46.201);
--color-amber-900: oklch(41.4% 0.112 45.904);
--color-amber-950: oklch(27.9% 0.077 45.635);
--color-yellow-50: oklch(98.7% 0.026 102.212);
--color-yellow-100: oklch(97.3% 0.071 103.193);
--color-yellow-200: oklch(94.5% 0.129 101.54);
--color-yellow-300: oklch(90.5% 0.182 98.111);
--color-yellow-400: oklch(85.2% 0.199 91.936);
--color-yellow-500: oklch(79.5% 0.184 86.047);
--color-yellow-600: oklch(68.1% 0.162 75.834);
--color-yellow-700: oklch(55.4% 0.135 66.442);
--color-yellow-800: oklch(47.6% 0.114 61.907);
--color-yellow-900: oklch(42.1% 0.095 57.708);
--color-yellow-950: oklch(28.6% 0.066 53.813);
--color-lime-50: oklch(98.6% 0.031 120.757);
--color-lime-100: oklch(96.7% 0.067 122.328);
--color-lime-200: oklch(93.8% 0.127 124.321);
--color-lime-300: oklch(89.7% 0.196 126.665);
--color-lime-400: oklch(84.1% 0.238 128.85);
--color-lime-500: oklch(76.8% 0.233 130.85);
--color-lime-600: oklch(64.8% 0.2 131.684);
--color-lime-700: oklch(53.2% 0.157 131.589);
--color-lime-800: oklch(45.3% 0.124 130.933);
--color-lime-900: oklch(40.5% 0.101 131.063);
--color-lime-950: oklch(27.4% 0.072 132.109);
--color-green-50: oklch(98.2% 0.018 155.826);
--color-green-100: oklch(96.2% 0.044 156.743);
--color-green-200: oklch(92.5% 0.084 155.995);
--color-green-300: oklch(87.1% 0.15 154.449);
--color-green-400: oklch(79.2% 0.209 151.711);
--color-green-500: oklch(72.3% 0.219 149.579);
--color-green-600: oklch(62.7% 0.194 149.214);
--color-green-700: oklch(52.7% 0.154 150.069);
--color-green-800: oklch(44.8% 0.119 151.328);
--color-green-900: oklch(39.3% 0.095 152.535);
--color-green-950: oklch(26.6% 0.065 152.934);
--color-emerald-50: oklch(97.9% 0.021 166.113);
--color-emerald-100: oklch(95% 0.052 163.051);
--color-emerald-200: oklch(90.5% 0.093 164.15);
--color-emerald-300: oklch(84.5% 0.143 164.978);
--color-emerald-400: oklch(76.5% 0.177 163.223);
--color-emerald-500: oklch(69.6% 0.17 162.48);
--color-emerald-600: oklch(59.6% 0.145 163.225);
--color-emerald-700: oklch(50.8% 0.118 165.612);
--color-emerald-800: oklch(43.2% 0.095 166.913);
--color-emerald-900: oklch(37.8% 0.077 168.94);
--color-emerald-950: oklch(26.2% 0.051 172.552);
--color-teal-50: oklch(98.4% 0.014 180.72);
--color-teal-100: oklch(95.3% 0.051 180.801);
--color-teal-200: oklch(91% 0.096 180.426);
--color-teal-300: oklch(85.5% 0.138 181.071);
--color-teal-400: oklch(77.7% 0.152 181.912);
--color-teal-500: oklch(70.4% 0.14 182.503);
--color-teal-600: oklch(60% 0.118 184.704);
--color-teal-700: oklch(51.1% 0.096 186.391);
--color-teal-800: oklch(43.7% 0.078 188.216);
--color-teal-900: oklch(38.6% 0.063 188.416);
--color-teal-950: oklch(27.7% 0.046 192.524);
--color-cyan-50: oklch(98.4% 0.019 200.873);
--color-cyan-100: oklch(95.6% 0.045 203.388);
--color-cyan-200: oklch(91.7% 0.08 205.041);
--color-cyan-300: oklch(86.5% 0.127 207.078);
--color-cyan-400: oklch(78.9% 0.154 211.53);
--color-cyan-500: oklch(71.5% 0.143 215.221);
--color-cyan-600: oklch(60.9% 0.126 221.723);
--color-cyan-700: oklch(52% 0.105 223.128);
--color-cyan-800: oklch(45% 0.085 224.283);
--color-cyan-900: oklch(39.8% 0.07 227.392);
--color-cyan-950: oklch(30.2% 0.056 229.695);
--color-sky-50: oklch(97.7% 0.013 236.62);
--color-sky-100: oklch(95.1% 0.026 236.824);
--color-sky-200: oklch(90.1% 0.058 230.902);
--color-sky-300: oklch(82.8% 0.111 230.318);
--color-sky-400: oklch(74.6% 0.16 232.661);
--color-sky-500: oklch(68.5% 0.169 237.323);
--color-sky-600: oklch(58.8% 0.158 241.966);
--color-sky-700: oklch(50% 0.134 242.749);
--color-sky-800: oklch(44.3% 0.11 240.79);
--color-sky-900: oklch(39.1% 0.09 240.876);
--color-sky-950: oklch(29.3% 0.066 243.157);
--color-blue-50: oklch(97% 0.014 254.604);
--color-blue-100: oklch(93.2% 0.032 255.585);
--color-blue-200: oklch(88.2% 0.059 254.128);
--color-blue-300: oklch(80.9% 0.105 251.813);
--color-blue-400: oklch(70.7% 0.165 254.624);
--color-blue-500: oklch(62.3% 0.214 259.815);
--color-blue-600: oklch(54.6% 0.245 262.881);
--color-blue-700: oklch(48.8% 0.243 264.376);
--color-blue-800: oklch(42.4% 0.199 265.638);
--color-blue-900: oklch(37.9% 0.146 265.522);
--color-blue-950: oklch(28.2% 0.091 267.935);
--color-indigo-50: oklch(96.2% 0.018 272.314);
--color-indigo-100: oklch(93% 0.034 272.788);
--color-indigo-200: oklch(87% 0.065 274.039);
--color-indigo-300: oklch(78.5% 0.115 274.713);
--color-indigo-400: oklch(67.3% 0.182 276.935);
--color-indigo-500: oklch(58.5% 0.233 277.117);
--color-indigo-600: oklch(51.1% 0.262 276.966);
--color-indigo-700: oklch(45.7% 0.24 277.023);
--color-indigo-800: oklch(39.8% 0.195 277.366);
--color-indigo-900: oklch(35.9% 0.144 278.697);
--color-indigo-950: oklch(25.7% 0.09 281.288);
--color-violet-50: oklch(96.9% 0.016 293.756);
--color-violet-100: oklch(94.3% 0.029 294.588);
--color-violet-200: oklch(89.4% 0.057 293.283);
--color-violet-300: oklch(81.1% 0.111 293.571);
--color-violet-400: oklch(70.2% 0.183 293.541);
--color-violet-500: oklch(60.6% 0.25 292.717);
--color-violet-600: oklch(54.1% 0.281 293.009);
--color-violet-700: oklch(49.1% 0.27 292.581);
--color-violet-800: oklch(43.2% 0.232 292.759);
--color-violet-900: oklch(38% 0.189 293.745);
--color-violet-950: oklch(28.3% 0.141 291.089);
--color-purple-50: oklch(97.7% 0.014 308.299);
--color-purple-100: oklch(94.6% 0.033 307.174);
--color-purple-200: oklch(90.2% 0.063 306.703);
--color-purple-300: oklch(82.7% 0.119 306.383);
--color-purple-400: oklch(71.4% 0.203 305.504);
--color-purple-500: oklch(62.7% 0.265 303.9);
--color-purple-600: oklch(55.8% 0.288 302.321);
--color-purple-700: oklch(49.6% 0.265 301.924);
--color-purple-800: oklch(43.8% 0.218 303.724);
--color-purple-900: oklch(38.1% 0.176 304.987);
--color-purple-950: oklch(29.1% 0.149 302.717);
--color-fuchsia-50: oklch(97.7% 0.017 320.058);
--color-fuchsia-100: oklch(95.2% 0.037 318.852);
--color-fuchsia-200: oklch(90.3% 0.076 319.62);
--color-fuchsia-300: oklch(83.3% 0.145 321.434);
--color-fuchsia-400: oklch(74% 0.238 322.16);
--color-fuchsia-500: oklch(66.7% 0.295 322.15);
--color-fuchsia-600: oklch(59.1% 0.293 322.896);
--color-fuchsia-700: oklch(51.8% 0.253 323.949);
--color-fuchsia-800: oklch(45.2% 0.211 324.591);
--color-fuchsia-900: oklch(40.1% 0.17 325.612);
--color-fuchsia-950: oklch(29.3% 0.136 325.661);
--color-pink-50: oklch(97.1% 0.014 343.198);
--color-pink-100: oklch(94.8% 0.028 342.258);
--color-pink-200: oklch(89.9% 0.061 343.231);
--color-pink-300: oklch(82.3% 0.12 346.018);
--color-pink-400: oklch(71.8% 0.202 349.761);
--color-pink-500: oklch(65.6% 0.241 354.308);
--color-pink-600: oklch(59.2% 0.249 0.584);
--color-pink-700: oklch(52.5% 0.223 3.958);
--color-pink-800: oklch(45.9% 0.187 3.815);
--color-pink-900: oklch(40.8% 0.153 2.432);
--color-pink-950: oklch(28.4% 0.109 3.907);
--color-rose-50: oklch(96.9% 0.015 12.422);
--color-rose-100: oklch(94.1% 0.03 12.58);
--color-rose-200: oklch(89.2% 0.058 10.001);
--color-rose-300: oklch(81% 0.117 11.638);
--color-rose-400: oklch(71.2% 0.194 13.428);
--color-rose-500: oklch(64.5% 0.246 16.439);
--color-rose-600: oklch(58.6% 0.253 17.585);
--color-rose-700: oklch(51.4% 0.222 16.935);
--color-rose-800: oklch(45.5% 0.188 13.697);
--color-rose-900: oklch(41% 0.159 10.272);
--color-rose-950: oklch(27.1% 0.105 12.094);
--color-slate-50: oklch(98.4% 0.003 247.858);
--color-slate-100: oklch(96.8% 0.007 247.896);
--color-slate-200: oklch(92.9% 0.013 255.508);
--color-slate-300: oklch(86.9% 0.022 252.894);
--color-slate-400: oklch(70.4% 0.04 256.788);
--color-slate-500: oklch(55.4% 0.046 257.417);
--color-slate-600: oklch(44.6% 0.043 257.281);
--color-slate-700: oklch(37.2% 0.044 257.287);
--color-slate-800: oklch(27.9% 0.041 260.031);
--color-slate-900: oklch(20.8% 0.042 265.755);
--color-slate-950: oklch(12.9% 0.042 264.695);
--color-gray-50: oklch(98.5% 0.002 247.839);
--color-gray-100: oklch(96.7% 0.003 264.542);
--color-gray-200: oklch(92.8% 0.006 264.531);
--color-gray-300: oklch(87.2% 0.01 258.338);
--color-gray-400: oklch(70.7% 0.022 261.325);
--color-gray-500: oklch(55.1% 0.027 264.364);
--color-gray-600: oklch(44.6% 0.03 256.802);
--color-gray-700: oklch(37.3% 0.034 259.733);
--color-gray-800: oklch(27.8% 0.033 256.848);
--color-gray-900: oklch(21% 0.034 264.665);
--color-gray-950: oklch(13% 0.028 261.692);
--color-zinc-50: oklch(98.5% 0 0);
--color-zinc-100: oklch(96.7% 0.001 286.375);
--color-zinc-200: oklch(92% 0.004 286.32);
--color-zinc-300: oklch(87.1% 0.006 286.286);
--color-zinc-400: oklch(70.5% 0.015 286.067);
--color-zinc-500: oklch(55.2% 0.016 285.938);
--color-zinc-600: oklch(44.2% 0.017 285.786);
--color-zinc-700: oklch(37% 0.013 285.805);
--color-zinc-800: oklch(27.4% 0.006 286.033);
--color-zinc-900: oklch(21% 0.006 285.885);
--color-zinc-950: oklch(14.1% 0.005 285.823);
--color-neutral-50: oklch(98.5% 0 0);
--color-neutral-100: oklch(97% 0 0);
--color-neutral-200: oklch(92.2% 0 0);
--color-neutral-300: oklch(87% 0 0);
--color-neutral-400: oklch(70.8% 0 0);
--color-neutral-500: oklch(55.6% 0 0);
--color-neutral-600: oklch(43.9% 0 0);
--color-neutral-700: oklch(37.1% 0 0);
--color-neutral-800: oklch(26.9% 0 0);
--color-neutral-900: oklch(20.5% 0 0);
--color-neutral-950: oklch(14.5% 0 0);
--color-stone-50: oklch(98.5% 0.001 106.423);
--color-stone-100: oklch(97% 0.001 106.424);
--color-stone-200: oklch(92.3% 0.003 48.717);
--color-stone-300: oklch(86.9% 0.005 56.366);
--color-stone-400: oklch(70.9% 0.01 56.259);
--color-stone-500: oklch(55.3% 0.013 58.071);
--color-stone-600: oklch(44.4% 0.011 73.639);
--color-stone-700: oklch(37.4% 0.01 67.558);
--color-stone-800: oklch(26.8% 0.007 34.298);
--color-stone-900: oklch(21.6% 0.006 56.043);
--color-stone-950: oklch(14.7% 0.004 49.25);
--color-mauve-50: oklch(98.5% 0 0);
--color-mauve-100: oklch(96% 0.003 325.6);
--color-mauve-200: oklch(92.2% 0.005 325.62);
--color-mauve-300: oklch(86.5% 0.012 325.68);
--color-mauve-400: oklch(71.1% 0.019 323.02);
--color-mauve-500: oklch(54.2% 0.034 322.5);
--color-mauve-600: oklch(43.5% 0.029 321.78);
--color-mauve-700: oklch(36.4% 0.029 323.89);
--color-mauve-800: oklch(26.3% 0.024 320.12);
--color-mauve-900: oklch(21.2% 0.019 322.12);
--color-mauve-950: oklch(14.5% 0.008 326);
--color-olive-50: oklch(98.8% 0.003 106.5);
--color-olive-100: oklch(96.6% 0.005 106.5);
--color-olive-200: oklch(93% 0.007 106.5);
--color-olive-300: oklch(88% 0.011 106.6);
--color-olive-400: oklch(73.7% 0.021 106.9);
--color-olive-500: oklch(58% 0.031 107.3);
--color-olive-600: oklch(46.6% 0.025 107.3);
--color-olive-700: oklch(39.4% 0.023 107.4);
--color-olive-800: oklch(28.6% 0.016 107.4);
--color-olive-900: oklch(22.8% 0.013 107.4);
--color-olive-950: oklch(15.3% 0.006 107.1);
--color-mist-50: oklch(98.7% 0.002 197.1);
--color-mist-100: oklch(96.3% 0.002 197.1);
--color-mist-200: oklch(92.5% 0.005 214.3);
--color-mist-300: oklch(87.2% 0.007 219.6);
--color-mist-400: oklch(72.3% 0.014 214.4);
--color-mist-500: oklch(56% 0.021 213.5);
--color-mist-600: oklch(45% 0.017 213.2);
--color-mist-700: oklch(37.8% 0.015 216);
--color-mist-800: oklch(27.5% 0.011 216.9);
--color-mist-900: oklch(21.8% 0.008 223.9);
--color-mist-950: oklch(14.8% 0.004 228.8);
--color-taupe-50: oklch(98.6% 0.002 67.8);
--color-taupe-100: oklch(96% 0.002 17.2);
--color-taupe-200: oklch(92.2% 0.005 34.3);
--color-taupe-300: oklch(86.8% 0.007 39.5);
--color-taupe-400: oklch(71.4% 0.014 41.2);
--color-taupe-500: oklch(54.7% 0.021 43.1);
--color-taupe-600: oklch(43.8% 0.017 39.3);
--color-taupe-700: oklch(36.7% 0.016 35.7);
--color-taupe-800: oklch(26.8% 0.011 36.5);
--color-taupe-900: oklch(21.4% 0.009 43.1);
--color-taupe-950: oklch(14.7% 0.004 49.3);
--color-black: #000;
--color-white: #fff;
--spacing: 0.25rem;
--breakpoint-sm: 40rem;
--breakpoint-md: 48rem;
--breakpoint-lg: 64rem;
--breakpoint-xl: 80rem;
--breakpoint-2xl: 96rem;
--container-3xs: 16rem;
--container-2xs: 18rem;
--container-xs: 20rem;
--container-sm: 24rem;
--container-md: 28rem;
--container-lg: 32rem;
--container-xl: 36rem;
--container-2xl: 42rem;
--container-3xl: 48rem;
--container-4xl: 56rem;
--container-5xl: 64rem;
--container-6xl: 72rem;
--container-7xl: 80rem;
--text-xs: 0.75rem;
--text-xs--line-height: calc(1 / 0.75);
--text-sm: 0.875rem;
--text-sm--line-height: calc(1.25 / 0.875);
--text-base: 1rem;
--text-base--line-height: calc(1.5 / 1);
--text-lg: 1.125rem;
--text-lg--line-height: calc(1.75 / 1.125);
--text-xl: 1.25rem;
--text-xl--line-height: calc(1.75 / 1.25);
--text-2xl: 1.5rem;
--text-2xl--line-height: calc(2 / 1.5);
--text-3xl: 1.875rem;
--text-3xl--line-height: calc(2.25 / 1.875);
--text-4xl: 2.25rem;
--text-4xl--line-height: calc(2.5 / 2.25);
--text-5xl: 3rem;
--text-5xl--line-height: 1;
--text-6xl: 3.75rem;
--text-6xl--line-height: 1;
--text-7xl: 4.5rem;
--text-7xl--line-height: 1;
--text-8xl: 6rem;
--text-8xl--line-height: 1;
--text-9xl: 8rem;
--text-9xl--line-height: 1;
--font-weight-thin: 100;
--font-weight-extralight: 200;
--font-weight-light: 300;
--font-weight-normal: 400;
--font-weight-medium: 500;
--font-weight-semibold: 600;
--font-weight-bold: 700;
--font-weight-extrabold: 800;
--font-weight-black: 900;
--tracking-tighter: -0.05em;
--tracking-tight: -0.025em;
--tracking-normal: 0em;
--tracking-wide: 0.025em;
--tracking-wider: 0.05em;
--tracking-widest: 0.1em;
--leading-tight: 1.25;
--leading-snug: 1.375;
--leading-normal: 1.5;
--leading-relaxed: 1.625;
--leading-loose: 2;
--radius-xs: 0.125rem;
--radius-sm: 0.25rem;
--radius-md: 0.375rem;
--radius-lg: 0.5rem;
--radius-xl: 0.75rem;
--radius-2xl: 1rem;
--radius-3xl: 1.5rem;
--radius-4xl: 2rem;
--shadow-2xs: 0 1px rgb(0 0 0 / 0.05);
--shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);
--shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
--shadow-md:
0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
--shadow-lg:
0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
--shadow-xl:
0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
--shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
--inset-shadow-2xs: inset 0 1px rgb(0 0 0 / 0.05);
--inset-shadow-xs: inset 0 1px 1px rgb(0 0 0 / 0.05);
--inset-shadow-sm: inset 0 2px 4px rgb(0 0 0 / 0.05);
--drop-shadow-xs: 0 1px 1px rgb(0 0 0 / 0.05);
--drop-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.15);
--drop-shadow-md: 0 3px 3px rgb(0 0 0 / 0.12);
--drop-shadow-lg: 0 4px 4px rgb(0 0 0 / 0.15);
--drop-shadow-xl: 0 9px 7px rgb(0 0 0 / 0.1);
--drop-shadow-2xl: 0 25px 25px rgb(0 0 0 / 0.15);
--text-shadow-2xs: 0px 1px 0px rgb(0 0 0 / 0.15);
--text-shadow-xs: 0px 1px 1px rgb(0 0 0 / 0.2);
--text-shadow-sm:
0px 1px 0px rgb(0 0 0 / 0.075), 0px 1px 1px rgb(0 0 0 / 0.075),
0px 2px 2px rgb(0 0 0 / 0.075);
--text-shadow-md:
0px 1px 1px rgb(0 0 0 / 0.1), 0px 1px 2px rgb(0 0 0 / 0.1),
0px 2px 4px rgb(0 0 0 / 0.1);
--text-shadow-lg:
0px 1px 2px rgb(0 0 0 / 0.1), 0px 3px 2px rgb(0 0 0 / 0.1),
0px 4px 8px rgb(0 0 0 / 0.1);
--ease-in: cubic-bezier(0.4, 0, 1, 1);
--ease-out: cubic-bezier(0, 0, 0.2, 1);
--ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
--animate-spin: spin 1s linear infinite;
--animate-ping: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
--animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
--animate-bounce: bounce 1s infinite;
@keyframes spin {
to {
transform: rotate(360deg);
}
}
@keyframes ping {
75%,
100% {
transform: scale(2);
opacity: 0;
}
}
@keyframes pulse {
50% {
opacity: 0.5;
}
}
@keyframes bounce {
0%,
100% {
transform: translateY(-25%);
animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
}
50% {
transform: none;
animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
}
}
--blur-xs: 4px;
--blur-sm: 8px;
--blur-md: 12px;
--blur-lg: 16px;
--blur-xl: 24px;
--blur-2xl: 40px;
--blur-3xl: 64px;
--perspective-dramatic: 100px;
--perspective-near: 300px;
--perspective-normal: 500px;
--perspective-midrange: 800px;
--perspective-distant: 1200px;
--aspect-video: 16 / 9;
--default-transition-duration: 150ms;
--default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
--default-font-family: --theme(--font-sans, initial);
--default-font-feature-settings: --theme(
--font-sans--font-feature-settings,
initial
);
--default-font-variation-settings: --theme(
--font-sans--font-variation-settings,
initial
);
--default-mono-font-family: --theme(--font-mono, initial);
--default-mono-font-feature-settings: --theme(
--font-mono--font-feature-settings,
initial
);
--default-mono-font-variation-settings: --theme(
--font-mono--font-variation-settings,
initial
);
}
/* Deprecated */
@theme default inline reference {
--blur: 8px;
--shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
--shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
--drop-shadow: 0 1px 2px rgb(0 0 0 / 0.1), 0 1px 1px rgb(0 0 0 / 0.06);
--radius: 0.25rem;
--max-width-prose: 65ch;
}
}
@layer base {
/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Remove default margins and padding
3. Reset all borders.
*/
*,
::after,
::before,
::backdrop,
::file-selector-button {
box-sizing: border-box; /* 1 */
margin: 0; /* 2 */
padding: 0; /* 2 */
border: 0 solid; /* 3 */
}
/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS.
*/
html,
:host {
line-height: 1.5; /* 1 */
-webkit-text-size-adjust: 100%; /* 2 */
tab-size: 4; /* 3 */
font-family: --theme(
--default-font-family,
ui-sans-serif,
system-ui,
sans-serif,
"Apple Color Emoji",
"Segoe UI Emoji",
"Segoe UI Symbol",
"Noto Color Emoji"
); /* 4 */
font-feature-settings: --theme(
--default-font-feature-settings,
normal
); /* 5 */
font-variation-settings: --theme(
--default-font-variation-settings,
normal
); /* 6 */
-webkit-tap-highlight-color: transparent; /* 7 */
}
/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Reset the default border style to a 1px solid border.
*/
hr {
height: 0; /* 1 */
color: inherit; /* 2 */
border-top-width: 1px; /* 3 */
}
/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/
abbr:where([title]) {
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted;
}
/*
Remove the default font size and weight for headings.
*/
h1,
h2,
h3,
h4,
h5,
h6 {
font-size: inherit;
font-weight: inherit;
}
/*
Reset links to optimize for opt-in styling instead of opt-out.
*/
a {
color: inherit;
-webkit-text-decoration: inherit;
text-decoration: inherit;
}
/*
Add the correct font weight in Edge and Safari.
*/
b,
strong {
font-weight: bolder;
}
/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp,
pre {
font-family: --theme(
--default-mono-font-family,
ui-monospace,
SFMono-Regular,
Menlo,
Monaco,
Consolas,
"Liberation Mono",
"Courier New",
monospace
); /* 1 */
font-feature-settings: --theme(
--default-mono-font-feature-settings,
normal
); /* 2 */
font-variation-settings: --theme(
--default-mono-font-variation-settings,
normal
); /* 3 */
font-size: 1em; /* 4 */
}
/*
Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/
table {
text-indent: 0; /* 1 */
border-color: inherit; /* 2 */
border-collapse: collapse; /* 3 */
}
/*
Use the modern Firefox focus style for all focusable elements.
*/
:-moz-focusring {
outline: auto;
}
/*
Add the correct vertical alignment in Chrome and Firefox.
*/
progress {
vertical-align: baseline;
}
/*
Add the correct display in Chrome and Safari.
*/
summary {
display: list-item;
}
/*
Make lists unstyled by default.
*/
ol,
ul,
menu {
list-style: none;
}
/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
This can trigger a poorly considered lint error in some tools but is included by design.
*/
img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
display: block; /* 1 */
vertical-align: middle; /* 2 */
}
/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/
img,
video {
max-width: 100%;
height: auto;
}
/*
1. Inherit font styles in all browsers.
2. Remove border radius in all browsers.
3. Remove background color in all browsers.
4. Ensure consistent opacity for disabled states in all browsers.
*/
button,
input,
select,
optgroup,
textarea,
::file-selector-button {
font: inherit; /* 1 */
font-feature-settings: inherit; /* 1 */
font-variation-settings: inherit; /* 1 */
letter-spacing: inherit; /* 1 */
color: inherit; /* 1 */
border-radius: 0; /* 2 */
background-color: transparent; /* 3 */
opacity: 1; /* 4 */
}
/*
Restore default font weight.
*/
:where(select:is([multiple], [size])) optgroup {
font-weight: bolder;
}
/*
Restore indentation.
*/
:where(select:is([multiple], [size])) optgroup option {
padding-inline-start: 20px;
}
/*
Restore space after button.
*/
::file-selector-button {
margin-inline-end: 4px;
}
/*
Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
*/
::placeholder {
opacity: 1;
}
/*
Set the default placeholder color to a semi-transparent version of the current text color in browsers that do not
crash when using `color-mix(…)` with `currentcolor`. (https://github.com/tailwindlabs/tailwindcss/issues/17194)
*/
@supports (not (-webkit-appearance: -apple-pay-button)) /* Not Safari */ or
(contain-intrinsic-size: 1px) /* Safari 17+ */ {
::placeholder {
color: color-mix(in oklab, currentcolor 50%, transparent);
}
}
/*
Prevent resizing textareas horizontally by default.
*/
textarea {
resize: vertical;
}
/*
Remove the inner padding in Chrome and Safari on macOS.
*/
::-webkit-search-decoration {
-webkit-appearance: none;
}
/*
1. Ensure date/time inputs have the same height when empty in iOS Safari.
2. Ensure text alignment can be changed on date/time inputs in iOS Safari.
*/
::-webkit-date-and-time-value {
min-height: 1lh; /* 1 */
text-align: inherit; /* 2 */
}
/*
Prevent height from changing on date/time inputs in macOS Safari when the input is set to `display: block`.
*/
::-webkit-datetime-edit {
display: inline-flex;
}
/*
Remove excess padding from pseudo-elements in date/time inputs to ensure consistent height across browsers.
*/
::-webkit-datetime-edit-fields-wrapper {
padding: 0;
}
::-webkit-datetime-edit,
::-webkit-datetime-edit-year-field,
::-webkit-datetime-edit-month-field,
::-webkit-datetime-edit-day-field,
::-webkit-datetime-edit-hour-field,
::-webkit-datetime-edit-minute-field,
::-webkit-datetime-edit-second-field,
::-webkit-datetime-edit-millisecond-field,
::-webkit-datetime-edit-meridiem-field {
padding-block: 0;
}
/*
Center dropdown marker shown on inputs with paired `<datalist>`s in Chrome. (https://github.com/tailwindlabs/tailwindcss/issues/18499)
*/
::-webkit-calendar-picker-indicator {
line-height: 1;
}
/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/
:-moz-ui-invalid {
box-shadow: none;
}
/*
Correct the inability to style the border radius in iOS Safari.
*/
button,
input:where([type="button"], [type="reset"], [type="submit"]),
::file-selector-button {
appearance: button;
}
/*
Correct the cursor style of increment and decrement buttons in Safari.
*/
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
height: auto;
}
/*
Make elements with the HTML hidden attribute stay hidden by default.
*/
[hidden]:where(:not([hidden="until-found"])) {
display: none !important;
}
}
@layer utilities {
@tailwind utilities;
}
+393
preflight.css
/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Remove default margins and padding
3. Reset all borders.
*/
*,
::after,
::before,
::backdrop,
::file-selector-button {
box-sizing: border-box; /* 1 */
margin: 0; /* 2 */
padding: 0; /* 2 */
border: 0 solid; /* 3 */
}
/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS.
*/
html,
:host {
line-height: 1.5; /* 1 */
-webkit-text-size-adjust: 100%; /* 2 */
tab-size: 4; /* 3 */
font-family: --theme(
--default-font-family,
ui-sans-serif,
system-ui,
sans-serif,
'Apple Color Emoji',
'Segoe UI Emoji',
'Segoe UI Symbol',
'Noto Color Emoji'
); /* 4 */
font-feature-settings: --theme(--default-font-feature-settings, normal); /* 5 */
font-variation-settings: --theme(--default-font-variation-settings, normal); /* 6 */
-webkit-tap-highlight-color: transparent; /* 7 */
}
/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Reset the default border style to a 1px solid border.
*/
hr {
height: 0; /* 1 */
color: inherit; /* 2 */
border-top-width: 1px; /* 3 */
}
/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/
abbr:where([title]) {
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted;
}
/*
Remove the default font size and weight for headings.
*/
h1,
h2,
h3,
h4,
h5,
h6 {
font-size: inherit;
font-weight: inherit;
}
/*
Reset links to optimize for opt-in styling instead of opt-out.
*/
a {
color: inherit;
-webkit-text-decoration: inherit;
text-decoration: inherit;
}
/*
Add the correct font weight in Edge and Safari.
*/
b,
strong {
font-weight: bolder;
}
/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp,
pre {
font-family: --theme(
--default-mono-font-family,
ui-monospace,
SFMono-Regular,
Menlo,
Monaco,
Consolas,
'Liberation Mono',
'Courier New',
monospace
); /* 1 */
font-feature-settings: --theme(--default-mono-font-feature-settings, normal); /* 2 */
font-variation-settings: --theme(--default-mono-font-variation-settings, normal); /* 3 */
font-size: 1em; /* 4 */
}
/*
Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/
table {
text-indent: 0; /* 1 */
border-color: inherit; /* 2 */
border-collapse: collapse; /* 3 */
}
/*
Use the modern Firefox focus style for all focusable elements.
*/
:-moz-focusring {
outline: auto;
}
/*
Add the correct vertical alignment in Chrome and Firefox.
*/
progress {
vertical-align: baseline;
}
/*
Add the correct display in Chrome and Safari.
*/
summary {
display: list-item;
}
/*
Make lists unstyled by default.
*/
ol,
ul,
menu {
list-style: none;
}
/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
This can trigger a poorly considered lint error in some tools but is included by design.
*/
img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
display: block; /* 1 */
vertical-align: middle; /* 2 */
}
/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/
img,
video {
max-width: 100%;
height: auto;
}
/*
1. Inherit font styles in all browsers.
2. Remove border radius in all browsers.
3. Remove background color in all browsers.
4. Ensure consistent opacity for disabled states in all browsers.
*/
button,
input,
select,
optgroup,
textarea,
::file-selector-button {
font: inherit; /* 1 */
font-feature-settings: inherit; /* 1 */
font-variation-settings: inherit; /* 1 */
letter-spacing: inherit; /* 1 */
color: inherit; /* 1 */
border-radius: 0; /* 2 */
background-color: transparent; /* 3 */
opacity: 1; /* 4 */
}
/*
Restore default font weight.
*/
:where(select:is([multiple], [size])) optgroup {
font-weight: bolder;
}
/*
Restore indentation.
*/
:where(select:is([multiple], [size])) optgroup option {
padding-inline-start: 20px;
}
/*
Restore space after button.
*/
::file-selector-button {
margin-inline-end: 4px;
}
/*
Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
*/
::placeholder {
opacity: 1;
}
/*
Set the default placeholder color to a semi-transparent version of the current text color in browsers that do not
crash when using `color-mix(…)` with `currentcolor`. (https://github.com/tailwindlabs/tailwindcss/issues/17194)
*/
@supports (not (-webkit-appearance: -apple-pay-button)) /* Not Safari */ or
(contain-intrinsic-size: 1px) /* Safari 17+ */ {
::placeholder {
color: color-mix(in oklab, currentcolor 50%, transparent);
}
}
/*
Prevent resizing textareas horizontally by default.
*/
textarea {
resize: vertical;
}
/*
Remove the inner padding in Chrome and Safari on macOS.
*/
::-webkit-search-decoration {
-webkit-appearance: none;
}
/*
1. Ensure date/time inputs have the same height when empty in iOS Safari.
2. Ensure text alignment can be changed on date/time inputs in iOS Safari.
*/
::-webkit-date-and-time-value {
min-height: 1lh; /* 1 */
text-align: inherit; /* 2 */
}
/*
Prevent height from changing on date/time inputs in macOS Safari when the input is set to `display: block`.
*/
::-webkit-datetime-edit {
display: inline-flex;
}
/*
Remove excess padding from pseudo-elements in date/time inputs to ensure consistent height across browsers.
*/
::-webkit-datetime-edit-fields-wrapper {
padding: 0;
}
::-webkit-datetime-edit,
::-webkit-datetime-edit-year-field,
::-webkit-datetime-edit-month-field,
::-webkit-datetime-edit-day-field,
::-webkit-datetime-edit-hour-field,
::-webkit-datetime-edit-minute-field,
::-webkit-datetime-edit-second-field,
::-webkit-datetime-edit-millisecond-field,
::-webkit-datetime-edit-meridiem-field {
padding-block: 0;
}
/*
Center dropdown marker shown on inputs with paired `<datalist>`s in Chrome. (https://github.com/tailwindlabs/tailwindcss/issues/18499)
*/
::-webkit-calendar-picker-indicator {
line-height: 1;
}
/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/
:-moz-ui-invalid {
box-shadow: none;
}
/*
Correct the inability to style the border radius in iOS Safari.
*/
button,
input:where([type='button'], [type='reset'], [type='submit']),
::file-selector-button {
appearance: button;
}
/*
Correct the cursor style of increment and decrement buttons in Safari.
*/
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
height: auto;
}
/*
Make elements with the HTML hidden attribute stay hidden by default.
*/
[hidden]:where(:not([hidden='until-found'])) {
display: none !important;
}
+510
theme.css
@theme default {
--font-sans:
ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
'Noto Color Emoji';
--font-serif: ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif;
--font-mono:
ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',
monospace;
--color-red-50: oklch(97.1% 0.013 17.38);
--color-red-100: oklch(93.6% 0.032 17.717);
--color-red-200: oklch(88.5% 0.062 18.334);
--color-red-300: oklch(80.8% 0.114 19.571);
--color-red-400: oklch(70.4% 0.191 22.216);
--color-red-500: oklch(63.7% 0.237 25.331);
--color-red-600: oklch(57.7% 0.245 27.325);
--color-red-700: oklch(50.5% 0.213 27.518);
--color-red-800: oklch(44.4% 0.177 26.899);
--color-red-900: oklch(39.6% 0.141 25.723);
--color-red-950: oklch(25.8% 0.092 26.042);
--color-orange-50: oklch(98% 0.016 73.684);
--color-orange-100: oklch(95.4% 0.038 75.164);
--color-orange-200: oklch(90.1% 0.076 70.697);
--color-orange-300: oklch(83.7% 0.128 66.29);
--color-orange-400: oklch(75% 0.183 55.934);
--color-orange-500: oklch(70.5% 0.213 47.604);
--color-orange-600: oklch(64.6% 0.222 41.116);
--color-orange-700: oklch(55.3% 0.195 38.402);
--color-orange-800: oklch(47% 0.157 37.304);
--color-orange-900: oklch(40.8% 0.123 38.172);
--color-orange-950: oklch(26.6% 0.079 36.259);
--color-amber-50: oklch(98.7% 0.022 95.277);
--color-amber-100: oklch(96.2% 0.059 95.617);
--color-amber-200: oklch(92.4% 0.12 95.746);
--color-amber-300: oklch(87.9% 0.169 91.605);
--color-amber-400: oklch(82.8% 0.189 84.429);
--color-amber-500: oklch(76.9% 0.188 70.08);
--color-amber-600: oklch(66.6% 0.179 58.318);
--color-amber-700: oklch(55.5% 0.163 48.998);
--color-amber-800: oklch(47.3% 0.137 46.201);
--color-amber-900: oklch(41.4% 0.112 45.904);
--color-amber-950: oklch(27.9% 0.077 45.635);
--color-yellow-50: oklch(98.7% 0.026 102.212);
--color-yellow-100: oklch(97.3% 0.071 103.193);
--color-yellow-200: oklch(94.5% 0.129 101.54);
--color-yellow-300: oklch(90.5% 0.182 98.111);
--color-yellow-400: oklch(85.2% 0.199 91.936);
--color-yellow-500: oklch(79.5% 0.184 86.047);
--color-yellow-600: oklch(68.1% 0.162 75.834);
--color-yellow-700: oklch(55.4% 0.135 66.442);
--color-yellow-800: oklch(47.6% 0.114 61.907);
--color-yellow-900: oklch(42.1% 0.095 57.708);
--color-yellow-950: oklch(28.6% 0.066 53.813);
--color-lime-50: oklch(98.6% 0.031 120.757);
--color-lime-100: oklch(96.7% 0.067 122.328);
--color-lime-200: oklch(93.8% 0.127 124.321);
--color-lime-300: oklch(89.7% 0.196 126.665);
--color-lime-400: oklch(84.1% 0.238 128.85);
--color-lime-500: oklch(76.8% 0.233 130.85);
--color-lime-600: oklch(64.8% 0.2 131.684);
--color-lime-700: oklch(53.2% 0.157 131.589);
--color-lime-800: oklch(45.3% 0.124 130.933);
--color-lime-900: oklch(40.5% 0.101 131.063);
--color-lime-950: oklch(27.4% 0.072 132.109);
--color-green-50: oklch(98.2% 0.018 155.826);
--color-green-100: oklch(96.2% 0.044 156.743);
--color-green-200: oklch(92.5% 0.084 155.995);
--color-green-300: oklch(87.1% 0.15 154.449);
--color-green-400: oklch(79.2% 0.209 151.711);
--color-green-500: oklch(72.3% 0.219 149.579);
--color-green-600: oklch(62.7% 0.194 149.214);
--color-green-700: oklch(52.7% 0.154 150.069);
--color-green-800: oklch(44.8% 0.119 151.328);
--color-green-900: oklch(39.3% 0.095 152.535);
--color-green-950: oklch(26.6% 0.065 152.934);
--color-emerald-50: oklch(97.9% 0.021 166.113);
--color-emerald-100: oklch(95% 0.052 163.051);
--color-emerald-200: oklch(90.5% 0.093 164.15);
--color-emerald-300: oklch(84.5% 0.143 164.978);
--color-emerald-400: oklch(76.5% 0.177 163.223);
--color-emerald-500: oklch(69.6% 0.17 162.48);
--color-emerald-600: oklch(59.6% 0.145 163.225);
--color-emerald-700: oklch(50.8% 0.118 165.612);
--color-emerald-800: oklch(43.2% 0.095 166.913);
--color-emerald-900: oklch(37.8% 0.077 168.94);
--color-emerald-950: oklch(26.2% 0.051 172.552);
--color-teal-50: oklch(98.4% 0.014 180.72);
--color-teal-100: oklch(95.3% 0.051 180.801);
--color-teal-200: oklch(91% 0.096 180.426);
--color-teal-300: oklch(85.5% 0.138 181.071);
--color-teal-400: oklch(77.7% 0.152 181.912);
--color-teal-500: oklch(70.4% 0.14 182.503);
--color-teal-600: oklch(60% 0.118 184.704);
--color-teal-700: oklch(51.1% 0.096 186.391);
--color-teal-800: oklch(43.7% 0.078 188.216);
--color-teal-900: oklch(38.6% 0.063 188.416);
--color-teal-950: oklch(27.7% 0.046 192.524);
--color-cyan-50: oklch(98.4% 0.019 200.873);
--color-cyan-100: oklch(95.6% 0.045 203.388);
--color-cyan-200: oklch(91.7% 0.08 205.041);
--color-cyan-300: oklch(86.5% 0.127 207.078);
--color-cyan-400: oklch(78.9% 0.154 211.53);
--color-cyan-500: oklch(71.5% 0.143 215.221);
--color-cyan-600: oklch(60.9% 0.126 221.723);
--color-cyan-700: oklch(52% 0.105 223.128);
--color-cyan-800: oklch(45% 0.085 224.283);
--color-cyan-900: oklch(39.8% 0.07 227.392);
--color-cyan-950: oklch(30.2% 0.056 229.695);
--color-sky-50: oklch(97.7% 0.013 236.62);
--color-sky-100: oklch(95.1% 0.026 236.824);
--color-sky-200: oklch(90.1% 0.058 230.902);
--color-sky-300: oklch(82.8% 0.111 230.318);
--color-sky-400: oklch(74.6% 0.16 232.661);
--color-sky-500: oklch(68.5% 0.169 237.323);
--color-sky-600: oklch(58.8% 0.158 241.966);
--color-sky-700: oklch(50% 0.134 242.749);
--color-sky-800: oklch(44.3% 0.11 240.79);
--color-sky-900: oklch(39.1% 0.09 240.876);
--color-sky-950: oklch(29.3% 0.066 243.157);
--color-blue-50: oklch(97% 0.014 254.604);
--color-blue-100: oklch(93.2% 0.032 255.585);
--color-blue-200: oklch(88.2% 0.059 254.128);
--color-blue-300: oklch(80.9% 0.105 251.813);
--color-blue-400: oklch(70.7% 0.165 254.624);
--color-blue-500: oklch(62.3% 0.214 259.815);
--color-blue-600: oklch(54.6% 0.245 262.881);
--color-blue-700: oklch(48.8% 0.243 264.376);
--color-blue-800: oklch(42.4% 0.199 265.638);
--color-blue-900: oklch(37.9% 0.146 265.522);
--color-blue-950: oklch(28.2% 0.091 267.935);
--color-indigo-50: oklch(96.2% 0.018 272.314);
--color-indigo-100: oklch(93% 0.034 272.788);
--color-indigo-200: oklch(87% 0.065 274.039);
--color-indigo-300: oklch(78.5% 0.115 274.713);
--color-indigo-400: oklch(67.3% 0.182 276.935);
--color-indigo-500: oklch(58.5% 0.233 277.117);
--color-indigo-600: oklch(51.1% 0.262 276.966);
--color-indigo-700: oklch(45.7% 0.24 277.023);
--color-indigo-800: oklch(39.8% 0.195 277.366);
--color-indigo-900: oklch(35.9% 0.144 278.697);
--color-indigo-950: oklch(25.7% 0.09 281.288);
--color-violet-50: oklch(96.9% 0.016 293.756);
--color-violet-100: oklch(94.3% 0.029 294.588);
--color-violet-200: oklch(89.4% 0.057 293.283);
--color-violet-300: oklch(81.1% 0.111 293.571);
--color-violet-400: oklch(70.2% 0.183 293.541);
--color-violet-500: oklch(60.6% 0.25 292.717);
--color-violet-600: oklch(54.1% 0.281 293.009);
--color-violet-700: oklch(49.1% 0.27 292.581);
--color-violet-800: oklch(43.2% 0.232 292.759);
--color-violet-900: oklch(38% 0.189 293.745);
--color-violet-950: oklch(28.3% 0.141 291.089);
--color-purple-50: oklch(97.7% 0.014 308.299);
--color-purple-100: oklch(94.6% 0.033 307.174);
--color-purple-200: oklch(90.2% 0.063 306.703);
--color-purple-300: oklch(82.7% 0.119 306.383);
--color-purple-400: oklch(71.4% 0.203 305.504);
--color-purple-500: oklch(62.7% 0.265 303.9);
--color-purple-600: oklch(55.8% 0.288 302.321);
--color-purple-700: oklch(49.6% 0.265 301.924);
--color-purple-800: oklch(43.8% 0.218 303.724);
--color-purple-900: oklch(38.1% 0.176 304.987);
--color-purple-950: oklch(29.1% 0.149 302.717);
--color-fuchsia-50: oklch(97.7% 0.017 320.058);
--color-fuchsia-100: oklch(95.2% 0.037 318.852);
--color-fuchsia-200: oklch(90.3% 0.076 319.62);
--color-fuchsia-300: oklch(83.3% 0.145 321.434);
--color-fuchsia-400: oklch(74% 0.238 322.16);
--color-fuchsia-500: oklch(66.7% 0.295 322.15);
--color-fuchsia-600: oklch(59.1% 0.293 322.896);
--color-fuchsia-700: oklch(51.8% 0.253 323.949);
--color-fuchsia-800: oklch(45.2% 0.211 324.591);
--color-fuchsia-900: oklch(40.1% 0.17 325.612);
--color-fuchsia-950: oklch(29.3% 0.136 325.661);
--color-pink-50: oklch(97.1% 0.014 343.198);
--color-pink-100: oklch(94.8% 0.028 342.258);
--color-pink-200: oklch(89.9% 0.061 343.231);
--color-pink-300: oklch(82.3% 0.12 346.018);
--color-pink-400: oklch(71.8% 0.202 349.761);
--color-pink-500: oklch(65.6% 0.241 354.308);
--color-pink-600: oklch(59.2% 0.249 0.584);
--color-pink-700: oklch(52.5% 0.223 3.958);
--color-pink-800: oklch(45.9% 0.187 3.815);
--color-pink-900: oklch(40.8% 0.153 2.432);
--color-pink-950: oklch(28.4% 0.109 3.907);
--color-rose-50: oklch(96.9% 0.015 12.422);
--color-rose-100: oklch(94.1% 0.03 12.58);
--color-rose-200: oklch(89.2% 0.058 10.001);
--color-rose-300: oklch(81% 0.117 11.638);
--color-rose-400: oklch(71.2% 0.194 13.428);
--color-rose-500: oklch(64.5% 0.246 16.439);
--color-rose-600: oklch(58.6% 0.253 17.585);
--color-rose-700: oklch(51.4% 0.222 16.935);
--color-rose-800: oklch(45.5% 0.188 13.697);
--color-rose-900: oklch(41% 0.159 10.272);
--color-rose-950: oklch(27.1% 0.105 12.094);
--color-slate-50: oklch(98.4% 0.003 247.858);
--color-slate-100: oklch(96.8% 0.007 247.896);
--color-slate-200: oklch(92.9% 0.013 255.508);
--color-slate-300: oklch(86.9% 0.022 252.894);
--color-slate-400: oklch(70.4% 0.04 256.788);
--color-slate-500: oklch(55.4% 0.046 257.417);
--color-slate-600: oklch(44.6% 0.043 257.281);
--color-slate-700: oklch(37.2% 0.044 257.287);
--color-slate-800: oklch(27.9% 0.041 260.031);
--color-slate-900: oklch(20.8% 0.042 265.755);
--color-slate-950: oklch(12.9% 0.042 264.695);
--color-gray-50: oklch(98.5% 0.002 247.839);
--color-gray-100: oklch(96.7% 0.003 264.542);
--color-gray-200: oklch(92.8% 0.006 264.531);
--color-gray-300: oklch(87.2% 0.01 258.338);
--color-gray-400: oklch(70.7% 0.022 261.325);
--color-gray-500: oklch(55.1% 0.027 264.364);
--color-gray-600: oklch(44.6% 0.03 256.802);
--color-gray-700: oklch(37.3% 0.034 259.733);
--color-gray-800: oklch(27.8% 0.033 256.848);
--color-gray-900: oklch(21% 0.034 264.665);
--color-gray-950: oklch(13% 0.028 261.692);
--color-zinc-50: oklch(98.5% 0 0);
--color-zinc-100: oklch(96.7% 0.001 286.375);
--color-zinc-200: oklch(92% 0.004 286.32);
--color-zinc-300: oklch(87.1% 0.006 286.286);
--color-zinc-400: oklch(70.5% 0.015 286.067);
--color-zinc-500: oklch(55.2% 0.016 285.938);
--color-zinc-600: oklch(44.2% 0.017 285.786);
--color-zinc-700: oklch(37% 0.013 285.805);
--color-zinc-800: oklch(27.4% 0.006 286.033);
--color-zinc-900: oklch(21% 0.006 285.885);
--color-zinc-950: oklch(14.1% 0.005 285.823);
--color-neutral-50: oklch(98.5% 0 0);
--color-neutral-100: oklch(97% 0 0);
--color-neutral-200: oklch(92.2% 0 0);
--color-neutral-300: oklch(87% 0 0);
--color-neutral-400: oklch(70.8% 0 0);
--color-neutral-500: oklch(55.6% 0 0);
--color-neutral-600: oklch(43.9% 0 0);
--color-neutral-700: oklch(37.1% 0 0);
--color-neutral-800: oklch(26.9% 0 0);
--color-neutral-900: oklch(20.5% 0 0);
--color-neutral-950: oklch(14.5% 0 0);
--color-stone-50: oklch(98.5% 0.001 106.423);
--color-stone-100: oklch(97% 0.001 106.424);
--color-stone-200: oklch(92.3% 0.003 48.717);
--color-stone-300: oklch(86.9% 0.005 56.366);
--color-stone-400: oklch(70.9% 0.01 56.259);
--color-stone-500: oklch(55.3% 0.013 58.071);
--color-stone-600: oklch(44.4% 0.011 73.639);
--color-stone-700: oklch(37.4% 0.01 67.558);
--color-stone-800: oklch(26.8% 0.007 34.298);
--color-stone-900: oklch(21.6% 0.006 56.043);
--color-stone-950: oklch(14.7% 0.004 49.25);
--color-mauve-50: oklch(98.5% 0 0);
--color-mauve-100: oklch(96% 0.003 325.6);
--color-mauve-200: oklch(92.2% 0.005 325.62);
--color-mauve-300: oklch(86.5% 0.012 325.68);
--color-mauve-400: oklch(71.1% 0.019 323.02);
--color-mauve-500: oklch(54.2% 0.034 322.5);
--color-mauve-600: oklch(43.5% 0.029 321.78);
--color-mauve-700: oklch(36.4% 0.029 323.89);
--color-mauve-800: oklch(26.3% 0.024 320.12);
--color-mauve-900: oklch(21.2% 0.019 322.12);
--color-mauve-950: oklch(14.5% 0.008 326);
--color-olive-50: oklch(98.8% 0.003 106.5);
--color-olive-100: oklch(96.6% 0.005 106.5);
--color-olive-200: oklch(93% 0.007 106.5);
--color-olive-300: oklch(88% 0.011 106.6);
--color-olive-400: oklch(73.7% 0.021 106.9);
--color-olive-500: oklch(58% 0.031 107.3);
--color-olive-600: oklch(46.6% 0.025 107.3);
--color-olive-700: oklch(39.4% 0.023 107.4);
--color-olive-800: oklch(28.6% 0.016 107.4);
--color-olive-900: oklch(22.8% 0.013 107.4);
--color-olive-950: oklch(15.3% 0.006 107.1);
--color-mist-50: oklch(98.7% 0.002 197.1);
--color-mist-100: oklch(96.3% 0.002 197.1);
--color-mist-200: oklch(92.5% 0.005 214.3);
--color-mist-300: oklch(87.2% 0.007 219.6);
--color-mist-400: oklch(72.3% 0.014 214.4);
--color-mist-500: oklch(56% 0.021 213.5);
--color-mist-600: oklch(45% 0.017 213.2);
--color-mist-700: oklch(37.8% 0.015 216);
--color-mist-800: oklch(27.5% 0.011 216.9);
--color-mist-900: oklch(21.8% 0.008 223.9);
--color-mist-950: oklch(14.8% 0.004 228.8);
--color-taupe-50: oklch(98.6% 0.002 67.8);
--color-taupe-100: oklch(96% 0.002 17.2);
--color-taupe-200: oklch(92.2% 0.005 34.3);
--color-taupe-300: oklch(86.8% 0.007 39.5);
--color-taupe-400: oklch(71.4% 0.014 41.2);
--color-taupe-500: oklch(54.7% 0.021 43.1);
--color-taupe-600: oklch(43.8% 0.017 39.3);
--color-taupe-700: oklch(36.7% 0.016 35.7);
--color-taupe-800: oklch(26.8% 0.011 36.5);
--color-taupe-900: oklch(21.4% 0.009 43.1);
--color-taupe-950: oklch(14.7% 0.004 49.3);
--color-black: #000;
--color-white: #fff;
--spacing: 0.25rem;
--breakpoint-sm: 40rem;
--breakpoint-md: 48rem;
--breakpoint-lg: 64rem;
--breakpoint-xl: 80rem;
--breakpoint-2xl: 96rem;
--container-3xs: 16rem;
--container-2xs: 18rem;
--container-xs: 20rem;
--container-sm: 24rem;
--container-md: 28rem;
--container-lg: 32rem;
--container-xl: 36rem;
--container-2xl: 42rem;
--container-3xl: 48rem;
--container-4xl: 56rem;
--container-5xl: 64rem;
--container-6xl: 72rem;
--container-7xl: 80rem;
--text-xs: 0.75rem;
--text-xs--line-height: calc(1 / 0.75);
--text-sm: 0.875rem;
--text-sm--line-height: calc(1.25 / 0.875);
--text-base: 1rem;
--text-base--line-height: calc(1.5 / 1);
--text-lg: 1.125rem;
--text-lg--line-height: calc(1.75 / 1.125);
--text-xl: 1.25rem;
--text-xl--line-height: calc(1.75 / 1.25);
--text-2xl: 1.5rem;
--text-2xl--line-height: calc(2 / 1.5);
--text-3xl: 1.875rem;
--text-3xl--line-height: calc(2.25 / 1.875);
--text-4xl: 2.25rem;
--text-4xl--line-height: calc(2.5 / 2.25);
--text-5xl: 3rem;
--text-5xl--line-height: 1;
--text-6xl: 3.75rem;
--text-6xl--line-height: 1;
--text-7xl: 4.5rem;
--text-7xl--line-height: 1;
--text-8xl: 6rem;
--text-8xl--line-height: 1;
--text-9xl: 8rem;
--text-9xl--line-height: 1;
--font-weight-thin: 100;
--font-weight-extralight: 200;
--font-weight-light: 300;
--font-weight-normal: 400;
--font-weight-medium: 500;
--font-weight-semibold: 600;
--font-weight-bold: 700;
--font-weight-extrabold: 800;
--font-weight-black: 900;
--tracking-tighter: -0.05em;
--tracking-tight: -0.025em;
--tracking-normal: 0em;
--tracking-wide: 0.025em;
--tracking-wider: 0.05em;
--tracking-widest: 0.1em;
--leading-tight: 1.25;
--leading-snug: 1.375;
--leading-normal: 1.5;
--leading-relaxed: 1.625;
--leading-loose: 2;
--radius-xs: 0.125rem;
--radius-sm: 0.25rem;
--radius-md: 0.375rem;
--radius-lg: 0.5rem;
--radius-xl: 0.75rem;
--radius-2xl: 1rem;
--radius-3xl: 1.5rem;
--radius-4xl: 2rem;
--shadow-2xs: 0 1px rgb(0 0 0 / 0.05);
--shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);
--shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
--shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
--shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
--inset-shadow-2xs: inset 0 1px rgb(0 0 0 / 0.05);
--inset-shadow-xs: inset 0 1px 1px rgb(0 0 0 / 0.05);
--inset-shadow-sm: inset 0 2px 4px rgb(0 0 0 / 0.05);
--drop-shadow-xs: 0 1px 1px rgb(0 0 0 / 0.05);
--drop-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.15);
--drop-shadow-md: 0 3px 3px rgb(0 0 0 / 0.12);
--drop-shadow-lg: 0 4px 4px rgb(0 0 0 / 0.15);
--drop-shadow-xl: 0 9px 7px rgb(0 0 0 / 0.1);
--drop-shadow-2xl: 0 25px 25px rgb(0 0 0 / 0.15);
--text-shadow-2xs: 0px 1px 0px rgb(0 0 0 / 0.15);
--text-shadow-xs: 0px 1px 1px rgb(0 0 0 / 0.2);
--text-shadow-sm:
0px 1px 0px rgb(0 0 0 / 0.075), 0px 1px 1px rgb(0 0 0 / 0.075), 0px 2px 2px rgb(0 0 0 / 0.075);
--text-shadow-md:
0px 1px 1px rgb(0 0 0 / 0.1), 0px 1px 2px rgb(0 0 0 / 0.1), 0px 2px 4px rgb(0 0 0 / 0.1);
--text-shadow-lg:
0px 1px 2px rgb(0 0 0 / 0.1), 0px 3px 2px rgb(0 0 0 / 0.1), 0px 4px 8px rgb(0 0 0 / 0.1);
--ease-in: cubic-bezier(0.4, 0, 1, 1);
--ease-out: cubic-bezier(0, 0, 0.2, 1);
--ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
--animate-spin: spin 1s linear infinite;
--animate-ping: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
--animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
--animate-bounce: bounce 1s infinite;
@keyframes spin {
to {
transform: rotate(360deg);
}
}
@keyframes ping {
75%,
100% {
transform: scale(2);
opacity: 0;
}
}
@keyframes pulse {
50% {
opacity: 0.5;
}
}
@keyframes bounce {
0%,
100% {
transform: translateY(-25%);
animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
}
50% {
transform: none;
animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
}
}
--blur-xs: 4px;
--blur-sm: 8px;
--blur-md: 12px;
--blur-lg: 16px;
--blur-xl: 24px;
--blur-2xl: 40px;
--blur-3xl: 64px;
--perspective-dramatic: 100px;
--perspective-near: 300px;
--perspective-normal: 500px;
--perspective-midrange: 800px;
--perspective-distant: 1200px;
--aspect-video: 16 / 9;
--default-transition-duration: 150ms;
--default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
--default-font-family: --theme(--font-sans, initial);
--default-font-feature-settings: --theme(--font-sans--font-feature-settings, initial);
--default-font-variation-settings: --theme(--font-sans--font-variation-settings, initial);
--default-mono-font-family: --theme(--font-mono, initial);
--default-mono-font-feature-settings: --theme(--font-mono--font-feature-settings, initial);
--default-mono-font-variation-settings: --theme(--font-mono--font-variation-settings, initial);
}
/* Deprecated */
@theme default inline reference {
--blur: 8px;
--shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
--shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
--drop-shadow: 0 1px 2px rgb(0 0 0 / 0.1), 0 1px 1px rgb(0 0 0 / 0.06);
--radius: 0.25rem;
--max-width-prose: 65ch;
}
+76
-95
package.json
{
"name": "tailwindcss",
"version": "0.0.0-insiders.d0269c2",
"version": "0.0.0-insiders.d03edef",
"description": "A utility-first CSS framework for rapidly building custom user interfaces.",
"license": "MIT",
"main": "lib/index.js",
"repository": "https://github.com/tailwindlabs/tailwindcss.git",
"repository": {
"type": "git",
"url": "https://github.com/tailwindlabs/tailwindcss.git",
"directory": "packages/tailwindcss"
},
"bugs": "https://github.com/tailwindlabs/tailwindcss/issues",
"homepage": "https://tailwindcss.com",
"bin": {
"tailwind": "lib/cli.js",
"tailwindcss": "lib/cli.js"
"exports": {
".": {
"types": "./dist/lib.d.mts",
"style": "./index.css",
"require": "./dist/lib.js",
"import": "./dist/lib.mjs"
},
"./plugin": {
"require": "./dist/plugin.js",
"import": "./dist/plugin.mjs"
},
"./plugin.js": {
"require": "./dist/plugin.js",
"import": "./dist/plugin.mjs"
},
"./defaultTheme": {
"require": "./dist/default-theme.js",
"import": "./dist/default-theme.mjs"
},
"./defaultTheme.js": {
"require": "./dist/default-theme.js",
"import": "./dist/default-theme.mjs"
},
"./colors": {
"require": "./dist/colors.js",
"import": "./dist/colors.mjs"
},
"./colors.js": {
"require": "./dist/colors.js",
"import": "./dist/colors.mjs"
},
"./lib/util/flattenColorPalette": {
"require": "./dist/flatten-color-palette.js",
"import": "./dist/flatten-color-palette.mjs"
},
"./lib/util/flattenColorPalette.js": {
"require": "./dist/flatten-color-palette.js",
"import": "./dist/flatten-color-palette.mjs"
},
"./package.json": "./package.json",
"./index.css": "./index.css",
"./index": "./index.css",
"./preflight.css": "./preflight.css",
"./preflight": "./preflight.css",
"./theme.css": "./theme.css",
"./theme": "./theme.css",
"./utilities.css": "./utilities.css",
"./utilities": "./utilities.css"
},
"scripts": {
"preswcify": "npm run generate && rimraf lib",
"swcify": "swc src --out-dir lib --copy-files",
"postswcify": "esbuild lib/cli-peer-dependencies.js --bundle --platform=node --outfile=peers/index.js",
"rebuild-fixtures": "npm run swcify && node -r @swc/register scripts/rebuildFixtures.js",
"prepublishOnly": "npm install --force && npm run swcify",
"style": "eslint .",
"pretest": "npm run generate",
"test": "jest",
"test:integrations": "npm run test --prefix ./integrations",
"install:integrations": "node scripts/install-integrations.js",
"posttest": "npm run style",
"generate:plugin-list": "node -r @swc/register scripts/create-plugin-list.js",
"generate:types": "node -r @swc/register scripts/generate-types.js",
"generate": "npm run generate:plugin-list"
"publishConfig": {
"provenance": true,
"access": "public"
},
"style": "index.css",
"files": [
"src/*",
"cli/*",
"lib/*",
"peers/*",
"scripts/*.js",
"stubs/*.stub.js",
"nesting/*",
"*.css",
"*.js"
"dist",
"index.css",
"preflight.css",
"theme.css",
"utilities.css"
],
"devDependencies": {
"@swc/cli": "^0.1.56",
"@swc/core": "^1.2.160",
"@swc/jest": "^0.2.20",
"@swc/register": "^0.1.10",
"autoprefixer": "^10.4.4",
"cssnano": "^5.1.7",
"esbuild": "^0.14.25",
"eslint": "^8.11.0",
"eslint-config-prettier": "^8.5.0",
"eslint-plugin-prettier": "^4.0.0",
"jest": "^27.5.1",
"jest-diff": "^27.5.1",
"prettier": "^2.6.0",
"prettier-plugin-tailwindcss": "^0.1.8",
"rimraf": "^3.0.0",
"source-map-js": "^1.0.2"
"@jridgewell/remapping": "^2.3.5",
"@types/node": "^22.19.17",
"dedent": "1.7.2",
"lightningcss": "1.32.0",
"magic-string": "^0.30.21",
"source-map-js": "^1.2.1",
"@tailwindcss/oxide": "0.0.0-insiders.d03edef"
},
"peerDependencies": {
"postcss": "^8.0.9"
},
"dependencies": {
"arg": "^5.0.1",
"chokidar": "^3.5.3",
"color-name": "^1.1.4",
"detective": "^5.2.0",
"didyoumean": "^1.2.2",
"dlv": "^1.1.3",
"fast-glob": "^3.2.11",
"glob-parent": "^6.0.2",
"is-glob": "^4.0.3",
"lilconfig": "^2.0.5",
"normalize-path": "^3.0.0",
"object-hash": "^3.0.0",
"picocolors": "^1.0.0",
"postcss": "^8.4.12",
"postcss-js": "^4.0.0",
"postcss-load-config": "^3.1.4",
"postcss-nested": "5.0.6",
"postcss-selector-parser": "^6.0.10",
"postcss-value-parser": "^4.2.0",
"quick-lru": "^5.1.1",
"resolve": "^1.22.0"
},
"browserslist": [
"> 1%",
"not edge <= 18",
"not ie 11",
"not op_mini all"
],
"jest": {
"testTimeout": 30000,
"setupFilesAfterEnv": [
"<rootDir>/jest/customMatchers.js"
],
"testPathIgnorePatterns": [
"/node_modules/",
"/integrations/",
"/standalone-cli/"
],
"transform": {
"\\.js$": "@swc/jest"
}
},
"engines": {
"node": ">=12.13.0"
"scripts": {
"lint": "tsc --noEmit",
"build": "tsup-node --env.NODE_ENV production",
"dev": "tsup-node --env.NODE_ENV development --watch",
"test:ui": "playwright test"
}
}
}
+19
-20
README.md

@@ -1,37 +0,36 @@

<p>
<a href="https://tailwindcss.com/#gh-light-mode-only" target="_blank">
<img src="./.github/logo-light.svg" alt="Tailwind CSS" width="350" height="70">
<p align="center">
<a href="https://tailwindcss.com" target="_blank">
<picture>
<source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg">
<source media="(prefers-color-scheme: light)" srcset="https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg">
<img alt="Tailwind CSS" src="https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg" width="350" height="70" style="max-width: 100%;">
</picture>
</a>
<a href="https://tailwindcss.com/#gh-dark-mode-only" target="_blank">
<img src="./.github/logo-dark.svg" alt="Tailwind CSS" width="350" height="70">
</a>
</p>
A utility-first CSS framework for rapidly building custom user interfaces.
<p align="center">
A utility-first CSS framework for rapidly building custom user interfaces.
</p>
<p>
<a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/workflow/status/tailwindlabs/tailwindcss/Node.js%20CI" alt="Build Status"></a>
<p align="center">
<a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main" alt="Build Status"></a>
<a href="https://www.npmjs.com/package/tailwindcss"><img src="https://img.shields.io/npm/dt/tailwindcss.svg" alt="Total Downloads"></a>
<a href="https://github.com/tailwindcss/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
<a href="https://github.com/tailwindcss/tailwindcss/blob/master/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
<a href="https://github.com/tailwindlabs/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
<a href="https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
</p>
------
---
## Documentation
For full documentation, visit [tailwindcss.com](https://tailwindcss.com/).
For full documentation, visit [tailwindcss.com](https://tailwindcss.com).
## Community
For help, discussion about best practices, or any other conversation that would benefit from being searchable:
For help, discussion about best practices, or feature ideas:
[Discuss Tailwind CSS on GitHub](https://github.com/tailwindcss/tailwindcss/discussions)
[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)
For casual chit-chat with others using the framework:
[Join the Tailwind CSS Discord Server](https://discord.gg/7NF8GNe)
## Contributing
If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindcss/tailwindcss/blob/master/.github/CONTRIBUTING.md) **before submitting a pull request**.
If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.
-1
base.css
@tailwind base;
CHANGELOG.md

Sorry, the diff of this file is too big to display

-2
colors.js
let colors = require('./lib/public/colors')
module.exports = (colors.__esModule ? colors : { default: colors }).default
-1
components.css
@tailwind components;
-2
defaultConfig.js
let defaultConfig = require('./lib/public/default-config')
module.exports = (defaultConfig.__esModule ? defaultConfig : { default: defaultConfig }).default
-2
defaultTheme.js
let defaultTheme = require('./lib/public/default-theme')
module.exports = (defaultTheme.__esModule ? defaultTheme : { default: defaultTheme }).default
-15
lib/cli-peer-dependencies.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.lazyAutoprefixer = lazyAutoprefixer;
exports.lazyCssnano = lazyCssnano;
exports.postcss = void 0;
let postcss = require("postcss");
exports.postcss = postcss;
function lazyAutoprefixer() {
return require("autoprefixer");
}
function lazyCssnano() {
return require("cssnano");
}
-763
lib/cli.js
#!/usr/bin/env node
"use strict";
var _indexJs = require("../peers/index.js");
var _chokidar = _interopRequireDefault(require("chokidar"));
var _path = _interopRequireDefault(require("path"));
var _arg = _interopRequireDefault(require("arg"));
var _fs = _interopRequireDefault(require("fs"));
var _postcssLoadConfig = _interopRequireDefault(require("postcss-load-config"));
var _lilconfig = require("lilconfig");
var _plugins // Little bit scary, looking at private/internal API
= _interopRequireDefault(require("postcss-load-config/src/plugins"));
var _processTailwindFeatures = _interopRequireDefault(require("./processTailwindFeatures"));
var _resolveConfig = _interopRequireDefault(require("../resolveConfig"));
var _fastGlob = _interopRequireDefault(require("fast-glob"));
var _getModuleDependencies = _interopRequireDefault(require("./lib/getModuleDependencies"));
var _log = _interopRequireDefault(require("./util/log"));
var _packageJson = _interopRequireDefault(require("../package.json"));
var _normalizePath = _interopRequireDefault(require("normalize-path"));
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
let env = {
DEBUG: process.env.DEBUG !== undefined && process.env.DEBUG !== "0"
};
// ---
function indentRecursive(node, indent = 0) {
node.each && node.each((child, i)=>{
if (!child.raws.before || !child.raws.before.trim() || child.raws.before.includes("\n")) {
child.raws.before = `\n${node.type !== "rule" && i > 0 ? "\n" : ""}${" ".repeat(indent)}`;
}
child.raws.after = `\n${" ".repeat(indent)}`;
indentRecursive(child, indent + 1);
});
}
function formatNodes(root) {
indentRecursive(root);
if (root.first) {
root.first.raws.before = "";
}
}
async function outputFile(file, contents) {
if (_fs.default.existsSync(file) && await _fs.default.promises.readFile(file, "utf8") === contents) {
return; // Skip writing the file
}
// Write the file
await _fs.default.promises.writeFile(file, contents, "utf8");
}
function drainStdin() {
return new Promise((resolve, reject)=>{
let result = "";
process.stdin.on("data", (chunk)=>{
result += chunk;
});
process.stdin.on("end", ()=>resolve(result)
);
process.stdin.on("error", (err)=>reject(err)
);
});
}
function help({ message , usage , commands: commands1 , options }) {
let indent = 2;
// Render header
console.log();
console.log(`${_packageJson.default.name} v${_packageJson.default.version}`);
// Render message
if (message) {
console.log();
for (let msg of message.split("\n")){
console.log(msg);
}
}
// Render usage
if (usage && usage.length > 0) {
console.log();
console.log("Usage:");
for (let example of usage){
console.log(" ".repeat(indent), example);
}
}
// Render commands
if (commands1 && commands1.length > 0) {
console.log();
console.log("Commands:");
for (let command1 of commands1){
console.log(" ".repeat(indent), command1);
}
}
// Render options
if (options) {
let groupedOptions = {};
for (let [key, value] of Object.entries(options)){
if (typeof value === "object") {
groupedOptions[key] = {
...value,
flags: [
key
]
};
} else {
groupedOptions[value].flags.push(key);
}
}
console.log();
console.log("Options:");
for (let { flags: flags1 , description , deprecated } of Object.values(groupedOptions)){
if (deprecated) continue;
if (flags1.length === 1) {
console.log(" ".repeat(indent + 4 /* 4 = "-i, ".length */ ), flags1.slice().reverse().join(", ").padEnd(20, " "), description);
} else {
console.log(" ".repeat(indent), flags1.slice().reverse().join(", ").padEnd(24, " "), description);
}
}
}
console.log();
}
function oneOf(...options) {
return Object.assign((value = true)=>{
for (let option of options){
let parsed = option(value);
if (parsed === value) {
return parsed;
}
}
throw new Error("...");
}, {
manualParsing: true
});
}
let commands = {
init: {
run: init,
args: {
"--full": {
type: Boolean,
description: "Initialize a full `tailwind.config.js` file"
},
"--postcss": {
type: Boolean,
description: "Initialize a `postcss.config.js` file"
},
"--types": {
type: Boolean,
description: "Add TypeScript types for the `tailwind.config.js` file"
},
"-f": "--full",
"-p": "--postcss"
}
},
build: {
run: build,
args: {
"--input": {
type: String,
description: "Input file"
},
"--output": {
type: String,
description: "Output file"
},
"--watch": {
type: Boolean,
description: "Watch for changes and rebuild as needed"
},
/*
'--poll': {
type: Boolean,
description: 'Use polling instead of filesystem events when watching',
},
*/ "--content": {
type: String,
description: "Content paths to use for removing unused classes"
},
"--purge": {
type: String,
deprecated: true
},
"--postcss": {
type: oneOf(String, Boolean),
description: "Load custom PostCSS configuration"
},
"--minify": {
type: Boolean,
description: "Minify the output"
},
"--config": {
type: String,
description: "Path to a custom config file"
},
"--no-autoprefixer": {
type: Boolean,
description: "Disable autoprefixer"
},
"-c": "--config",
"-i": "--input",
"-o": "--output",
"-m": "--minify",
"-w": "--watch"
}
}
};
let sharedFlags = {
"--help": {
type: Boolean,
description: "Display usage information"
},
"-h": "--help"
};
if (process.stdout.isTTY /* Detect redirecting output to a file */ && (process.argv[2] === undefined || process.argv.slice(2).every((flag)=>sharedFlags[flag] !== undefined
))) {
help({
usage: [
"tailwindcss [--input input.css] [--output output.css] [--watch] [options...]",
"tailwindcss init [--full] [--postcss] [--types] [options...]",
],
commands: Object.keys(commands).filter((command2)=>command2 !== "build"
).map((command3)=>`${command3} [options]`
),
options: {
...commands.build.args,
...sharedFlags
}
});
process.exit(0);
}
let command = ((arg = "")=>arg.startsWith("-") ? undefined : arg
)(process.argv[2]) || "build";
if (commands[command] === undefined) {
if (_fs.default.existsSync(_path.default.resolve(command))) {
// TODO: Deprecate this in future versions
// Check if non-existing command, might be a file.
command = "build";
} else {
help({
message: `Invalid command: ${command}`,
usage: [
"tailwindcss <command> [options]"
],
commands: Object.keys(commands).filter((command4)=>command4 !== "build"
).map((command5)=>`${command5} [options]`
),
options: sharedFlags
});
process.exit(1);
}
}
// Execute command
let { args: flags , run } = commands[command];
let args = (()=>{
try {
let result = (0, _arg).default(Object.fromEntries(Object.entries({
...flags,
...sharedFlags
}).filter(([_key, value])=>{
var ref;
return !(value === null || value === void 0 ? void 0 : (ref = value.type) === null || ref === void 0 ? void 0 : ref.manualParsing);
}).map(([key, value])=>[
key,
typeof value === "object" ? value.type : value
]
)), {
permissive: true
});
// Manual parsing of flags to allow for special flags like oneOf(Boolean, String)
for(let i = result["_"].length - 1; i >= 0; --i){
let flag = result["_"][i];
if (!flag.startsWith("-")) continue;
let flagName = flag;
let handler = flags[flag];
// Resolve flagName & handler
while(typeof handler === "string"){
flagName = handler;
handler = flags[handler];
}
if (!handler) continue;
let args1 = [];
let offset = i + 1;
// Parse args for current flag
while(result["_"][offset] && !result["_"][offset].startsWith("-")){
args1.push(result["_"][offset++]);
}
// Cleanup manually parsed flags + args
result["_"].splice(i, 1 + args1.length);
// Set the resolved value in the `result` object
result[flagName] = handler.type(args1.length === 0 ? undefined : args1.length === 1 ? args1[0] : args1, flagName);
}
// Ensure that the `command` is always the first argument in the `args`.
// This is important so that we don't have to check if a default command
// (build) was used or not from within each plugin.
//
// E.g.: tailwindcss input.css -> _: ['build', 'input.css']
// E.g.: tailwindcss build input.css -> _: ['build', 'input.css']
if (result["_"][0] !== command) {
result["_"].unshift(command);
}
return result;
} catch (err) {
if (err.code === "ARG_UNKNOWN_OPTION") {
help({
message: err.message,
usage: [
"tailwindcss <command> [options]"
],
options: sharedFlags
});
process.exit(1);
}
throw err;
}
})();
if (args["--help"]) {
help({
options: {
...flags,
...sharedFlags
},
usage: [
`tailwindcss ${command} [options]`
]
});
process.exit(0);
}
run();
// ---
function init() {
let messages = [];
var ref;
let tailwindConfigLocation = _path.default.resolve((ref = args["_"][1]) !== null && ref !== void 0 ? ref : "./tailwind.config.js");
if (_fs.default.existsSync(tailwindConfigLocation)) {
messages.push(`${_path.default.basename(tailwindConfigLocation)} already exists.`);
} else {
let stubFile = _fs.default.readFileSync(args["--full"] ? _path.default.resolve(__dirname, "../stubs/defaultConfig.stub.js") : _path.default.resolve(__dirname, "../stubs/simpleConfig.stub.js"), "utf8");
if (args["--types"]) {
let typesHeading = "/** @type {import('tailwindcss/types').Config} */";
stubFile = stubFile.replace(`module.exports = `, `${typesHeading}\nconst config = `) + "\nmodule.exports = config";
}
// Change colors import
stubFile = stubFile.replace("../colors", "tailwindcss/colors");
_fs.default.writeFileSync(tailwindConfigLocation, stubFile, "utf8");
messages.push(`Created Tailwind CSS config file: ${_path.default.basename(tailwindConfigLocation)}`);
}
if (args["--postcss"]) {
let postcssConfigLocation = _path.default.resolve("./postcss.config.js");
if (_fs.default.existsSync(postcssConfigLocation)) {
messages.push(`${_path.default.basename(postcssConfigLocation)} already exists.`);
} else {
let stubFile = _fs.default.readFileSync(_path.default.resolve(__dirname, "../stubs/defaultPostCssConfig.stub.js"), "utf8");
_fs.default.writeFileSync(postcssConfigLocation, stubFile, "utf8");
messages.push(`Created PostCSS config file: ${_path.default.basename(postcssConfigLocation)}`);
}
}
if (messages.length > 0) {
console.log();
for (let message of messages){
console.log(message);
}
}
}
async function build() {
let input = args["--input"];
let output = args["--output"];
let shouldWatch = args["--watch"];
let shouldPoll = false;
/*
let shouldPoll = args['--poll']
*/ let shouldCoalesceWriteEvents = shouldPoll || process.platform === "win32";
let includePostCss = args["--postcss"];
// Polling interval in milliseconds
// Used only when polling or coalescing add/change events on Windows
let pollInterval = 10;
// TODO: Deprecate this in future versions
if (!input && args["_"][1]) {
console.error("[deprecation] Running tailwindcss without -i, please provide an input file.");
input = args["--input"] = args["_"][1];
}
if (input && input !== "-" && !_fs.default.existsSync(input = _path.default.resolve(input))) {
console.error(`Specified input file ${args["--input"]} does not exist.`);
process.exit(9);
}
if (args["--config"] && !_fs.default.existsSync(args["--config"] = _path.default.resolve(args["--config"]))) {
console.error(`Specified config file ${args["--config"]} does not exist.`);
process.exit(9);
}
let configPath = args["--config"] ? args["--config"] : ((defaultPath)=>_fs.default.existsSync(defaultPath) ? defaultPath : null
)(_path.default.resolve("./tailwind.config.js"));
async function loadPostCssPlugins() {
let customPostCssPath = typeof args["--postcss"] === "string" ? args["--postcss"] : undefined;
let { plugins: configPlugins } = customPostCssPath ? await (async ()=>{
let file = _path.default.resolve(customPostCssPath);
// Implementation, see: https://unpkg.com/browse/postcss-load-config@3.1.0/src/index.js
let { config ={} } = await (0, _lilconfig).lilconfig("postcss").load(file);
if (typeof config === "function") {
config = config();
} else {
config = Object.assign({}, config);
}
if (!config.plugins) {
config.plugins = [];
}
return {
plugins: (0, _plugins).default(config, file)
};
})() : await (0, _postcssLoadConfig).default();
let configPluginTailwindIdx = configPlugins.findIndex((plugin)=>{
if (typeof plugin === "function" && plugin.name === "tailwindcss") {
return true;
}
if (typeof plugin === "object" && plugin !== null && plugin.postcssPlugin === "tailwindcss") {
return true;
}
return false;
});
let beforePlugins = configPluginTailwindIdx === -1 ? [] : configPlugins.slice(0, configPluginTailwindIdx);
let afterPlugins = configPluginTailwindIdx === -1 ? configPlugins : configPlugins.slice(configPluginTailwindIdx + 1);
return [
beforePlugins,
afterPlugins
];
}
function resolveConfig() {
let config = configPath ? require(configPath) : {};
if (args["--purge"]) {
_log.default.warn("purge-flag-deprecated", [
"The `--purge` flag has been deprecated.",
"Please use `--content` instead.",
]);
if (!args["--content"]) {
args["--content"] = args["--purge"];
}
}
if (args["--content"]) {
let files = args["--content"].split(/(?<!{[^}]+),/);
let resolvedConfig = (0, _resolveConfig).default(config, {
content: {
files
}
});
resolvedConfig.content.files = files;
return resolvedConfig;
}
return (0, _resolveConfig).default(config);
}
function extractFileGlobs(config) {
return config.content.files.filter((file)=>{
// Strings in this case are files / globs. If it is something else,
// like an object it's probably a raw content object. But this object
// is not watchable, so let's remove it.
return typeof file === "string";
}).map((glob)=>(0, _normalizePath).default(glob)
);
}
function extractRawContent(config) {
return config.content.files.filter((file)=>{
return typeof file === "object" && file !== null;
});
}
function getChangedContent(config) {
let changedContent = [];
// Resolve globs from the content config
let globs = extractFileGlobs(config);
let files = _fastGlob.default.sync(globs);
for (let file of files){
changedContent.push({
content: _fs.default.readFileSync(_path.default.resolve(file), "utf8"),
extension: _path.default.extname(file).slice(1)
});
}
// Resolve raw content in the tailwind config
for (let { raw: content , extension ="html" } of extractRawContent(config)){
changedContent.push({
content,
extension
});
}
return changedContent;
}
async function buildOnce() {
let config = resolveConfig();
let changedContent = getChangedContent(config);
let tailwindPlugin = ()=>{
return {
postcssPlugin: "tailwindcss",
Once (root, { result }) {
(0, _processTailwindFeatures).default(({ createContext })=>{
return ()=>{
return createContext(config, changedContent);
};
})(root, result);
}
};
};
tailwindPlugin.postcss = true;
let [beforePlugins, afterPlugins] = includePostCss ? await loadPostCssPlugins() : [
[],
[]
];
let plugins = [
...beforePlugins,
tailwindPlugin,
!args["--minify"] && formatNodes,
...afterPlugins,
!args["--no-autoprefixer"] && (()=>{
// Try to load a local `autoprefixer` version first
try {
return require("autoprefixer");
} catch {}
return (0, _indexJs).lazyAutoprefixer();
})(),
args["--minify"] && (()=>{
let options = {
preset: [
"default",
{
cssDeclarationSorter: false
}
]
};
// Try to load a local `cssnano` version first
try {
return require("cssnano");
} catch {}
return (0, _indexJs).lazyCssnano()(options);
})(),
].filter(Boolean);
let processor = (0, _indexJs).postcss(plugins);
function processCSS(css) {
let start = process.hrtime.bigint();
return Promise.resolve().then(()=>output ? _fs.default.promises.mkdir(_path.default.dirname(output), {
recursive: true
}) : null
).then(()=>processor.process(css, {
from: input,
to: output
})
).then((result)=>{
if (!output) {
return process.stdout.write(result.css);
}
return Promise.all([
outputFile(output, result.css),
result.map && outputFile(output + ".map", result.map.toString()),
].filter(Boolean));
}).then(()=>{
let end = process.hrtime.bigint();
console.error();
console.error("Done in", (end - start) / BigInt(1000000) + "ms.");
});
}
let css1 = await (()=>{
// Piping in data, let's drain the stdin
if (input === "-") {
return drainStdin();
}
// Input file has been provided
if (input) {
return _fs.default.readFileSync(_path.default.resolve(input), "utf8");
}
// No input file provided, fallback to default atrules
return "@tailwind base; @tailwind components; @tailwind utilities";
})();
return processCSS(css1);
}
let context = null;
async function startWatcher() {
let changedContent = [];
let configDependencies = [];
let contextDependencies = new Set();
let watcher = null;
function refreshConfig() {
env.DEBUG && console.time("Module dependencies");
for (let file1 of configDependencies){
delete require.cache[require.resolve(file1)];
}
if (configPath) {
configDependencies = (0, _getModuleDependencies).default(configPath).map(({ file })=>file
);
for (let dependency of configDependencies){
contextDependencies.add(dependency);
}
}
env.DEBUG && console.timeEnd("Module dependencies");
return resolveConfig();
}
let [beforePlugins, afterPlugins] = includePostCss ? await loadPostCssPlugins() : [
[],
[]
];
let plugins = [
...beforePlugins,
"__TAILWIND_PLUGIN_POSITION__",
!args["--minify"] && formatNodes,
...afterPlugins,
!args["--no-autoprefixer"] && (()=>{
// Try to load a local `autoprefixer` version first
try {
return require("autoprefixer");
} catch {}
return (0, _indexJs).lazyAutoprefixer();
})(),
args["--minify"] && (()=>{
let options = {
preset: [
"default",
{
cssDeclarationSorter: false
}
]
};
// Try to load a local `cssnano` version first
try {
return require("cssnano");
} catch {}
return (0, _indexJs).lazyCssnano()(options);
})(),
].filter(Boolean);
async function rebuild(config) {
env.DEBUG && console.time("Finished in");
let tailwindPlugin = ()=>{
return {
postcssPlugin: "tailwindcss",
Once (root, { result }) {
env.DEBUG && console.time("Compiling CSS");
(0, _processTailwindFeatures).default(({ createContext })=>{
console.error();
console.error("Rebuilding...");
return ()=>{
if (context !== null) {
context.changedContent = changedContent.splice(0);
return context;
}
env.DEBUG && console.time("Creating context");
context = createContext(config, changedContent.splice(0));
env.DEBUG && console.timeEnd("Creating context");
return context;
};
})(root, result);
env.DEBUG && console.timeEnd("Compiling CSS");
}
};
};
tailwindPlugin.postcss = true;
let tailwindPluginIdx = plugins.indexOf("__TAILWIND_PLUGIN_POSITION__");
let copy = plugins.slice();
copy.splice(tailwindPluginIdx, 1, tailwindPlugin);
let processor = (0, _indexJs).postcss(copy);
function processCSS(css) {
let start = process.hrtime.bigint();
return Promise.resolve().then(()=>output ? _fs.default.promises.mkdir(_path.default.dirname(output), {
recursive: true
}) : null
).then(()=>processor.process(css, {
from: input,
to: output
})
).then(async (result)=>{
for (let message of result.messages){
if (message.type === "dependency") {
contextDependencies.add(message.file);
}
}
watcher.add([
...contextDependencies
]);
if (!output) {
return process.stdout.write(result.css);
}
return Promise.all([
outputFile(output, result.css),
result.map && outputFile(output + ".map", result.map.toString()),
].filter(Boolean));
}).then(()=>{
let end = process.hrtime.bigint();
console.error("Done in", (end - start) / BigInt(1000000) + "ms.");
}).catch((err)=>{
if (err.name === "CssSyntaxError") {
console.error(err.toString());
} else {
console.error(err);
}
});
}
let css2 = await (()=>{
// Piping in data, let's drain the stdin
if (input === "-") {
return drainStdin();
}
// Input file has been provided
if (input) {
return _fs.default.readFileSync(_path.default.resolve(input), "utf8");
}
// No input file provided, fallback to default atrules
return "@tailwind base; @tailwind components; @tailwind utilities";
})();
let result1 = await processCSS(css2);
env.DEBUG && console.timeEnd("Finished in");
return result1;
}
let config1 = refreshConfig(configPath);
if (input) {
contextDependencies.add(_path.default.resolve(input));
}
watcher = _chokidar.default.watch([
...contextDependencies,
...extractFileGlobs(config1)
], {
usePolling: shouldPoll,
interval: shouldPoll ? pollInterval : undefined,
ignoreInitial: true,
awaitWriteFinish: shouldCoalesceWriteEvents ? {
stabilityThreshold: 50,
pollInterval: pollInterval
} : false
});
let chain = Promise.resolve();
watcher.on("change", async (file)=>{
if (contextDependencies.has(file)) {
env.DEBUG && console.time("Resolve config");
context = null;
config1 = refreshConfig(configPath);
env.DEBUG && console.timeEnd("Resolve config");
env.DEBUG && console.time("Watch new files");
let globs = extractFileGlobs(config1);
watcher.add(configDependencies);
watcher.add(globs);
env.DEBUG && console.timeEnd("Watch new files");
chain = chain.then(async ()=>{
changedContent.push(...getChangedContent(config1));
await rebuild(config1);
});
} else {
chain = chain.then(async ()=>{
changedContent.push({
content: _fs.default.readFileSync(_path.default.resolve(file), "utf8"),
extension: _path.default.extname(file).slice(1)
});
await rebuild(config1);
});
}
});
watcher.on("add", async (file)=>{
chain = chain.then(async ()=>{
changedContent.push({
content: _fs.default.readFileSync(_path.default.resolve(file), "utf8"),
extension: _path.default.extname(file).slice(1)
});
await rebuild(config1);
});
});
chain = chain.then(()=>{
changedContent.push(...getChangedContent(config1));
return rebuild(config1);
});
}
if (shouldWatch) {
/* Abort the watcher if stdin is closed to avoid zombie processes */ process.stdin.on("end", ()=>process.exit(0)
);
process.stdin.resume();
startWatcher();
} else {
buildOnce();
}
}
-37
lib/constants.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.defaultPostCssConfigStubFile = exports.simpleConfigStubFile = exports.defaultConfigStubFile = exports.supportedPostCssConfigFile = exports.supportedConfigFiles = exports.cjsPostCssConfigFile = exports.cjsConfigFile = exports.defaultPostCssConfigFile = exports.defaultConfigFile = exports.cli = void 0;
var _path = _interopRequireDefault(require("path"));
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
const cli = "tailwind";
exports.cli = cli;
const defaultConfigFile = "./tailwind.config.js";
exports.defaultConfigFile = defaultConfigFile;
const defaultPostCssConfigFile = "./postcss.config.js";
exports.defaultPostCssConfigFile = defaultPostCssConfigFile;
const cjsConfigFile = "./tailwind.config.cjs";
exports.cjsConfigFile = cjsConfigFile;
const cjsPostCssConfigFile = "./postcss.config.cjs";
exports.cjsPostCssConfigFile = cjsPostCssConfigFile;
const supportedConfigFiles = [
cjsConfigFile,
defaultConfigFile
];
exports.supportedConfigFiles = supportedConfigFiles;
const supportedPostCssConfigFile = [
cjsPostCssConfigFile,
defaultPostCssConfigFile
];
exports.supportedPostCssConfigFile = supportedPostCssConfigFile;
const defaultConfigStubFile = _path.default.resolve(__dirname, "../stubs/defaultConfig.stub.js");
exports.defaultConfigStubFile = defaultConfigStubFile;
const simpleConfigStubFile = _path.default.resolve(__dirname, "../stubs/simpleConfig.stub.js");
exports.simpleConfigStubFile = simpleConfigStubFile;
const defaultPostCssConfigStubFile = _path.default.resolve(__dirname, "../stubs/defaultPostCssConfig.stub.js");
exports.defaultPostCssConfigStubFile = defaultPostCssConfigStubFile;
-178
lib/corePluginList.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _default = [
"preflight",
"container",
"accessibility",
"pointerEvents",
"visibility",
"position",
"inset",
"isolation",
"zIndex",
"order",
"gridColumn",
"gridColumnStart",
"gridColumnEnd",
"gridRow",
"gridRowStart",
"gridRowEnd",
"float",
"clear",
"margin",
"boxSizing",
"display",
"aspectRatio",
"height",
"maxHeight",
"minHeight",
"width",
"minWidth",
"maxWidth",
"flex",
"flexShrink",
"flexGrow",
"flexBasis",
"tableLayout",
"borderCollapse",
"transformOrigin",
"translate",
"rotate",
"skew",
"scale",
"transform",
"animation",
"cursor",
"touchAction",
"userSelect",
"resize",
"scrollSnapType",
"scrollSnapAlign",
"scrollSnapStop",
"scrollMargin",
"scrollPadding",
"listStylePosition",
"listStyleType",
"appearance",
"columns",
"breakBefore",
"breakInside",
"breakAfter",
"gridAutoColumns",
"gridAutoFlow",
"gridAutoRows",
"gridTemplateColumns",
"gridTemplateRows",
"flexDirection",
"flexWrap",
"placeContent",
"placeItems",
"alignContent",
"alignItems",
"justifyContent",
"justifyItems",
"gap",
"space",
"divideWidth",
"divideStyle",
"divideColor",
"divideOpacity",
"placeSelf",
"alignSelf",
"justifySelf",
"overflow",
"overscrollBehavior",
"scrollBehavior",
"textOverflow",
"whitespace",
"wordBreak",
"borderRadius",
"borderWidth",
"borderStyle",
"borderColor",
"borderOpacity",
"backgroundColor",
"backgroundOpacity",
"backgroundImage",
"gradientColorStops",
"boxDecorationBreak",
"backgroundSize",
"backgroundAttachment",
"backgroundClip",
"backgroundPosition",
"backgroundRepeat",
"backgroundOrigin",
"fill",
"stroke",
"strokeWidth",
"objectFit",
"objectPosition",
"padding",
"textAlign",
"textIndent",
"verticalAlign",
"fontFamily",
"fontSize",
"fontWeight",
"textTransform",
"fontStyle",
"fontVariantNumeric",
"lineHeight",
"letterSpacing",
"textColor",
"textOpacity",
"textDecoration",
"textDecorationColor",
"textDecorationStyle",
"textDecorationThickness",
"textUnderlineOffset",
"fontSmoothing",
"placeholderColor",
"placeholderOpacity",
"caretColor",
"accentColor",
"opacity",
"backgroundBlendMode",
"mixBlendMode",
"boxShadow",
"boxShadowColor",
"outlineStyle",
"outlineWidth",
"outlineOffset",
"outlineColor",
"ringWidth",
"ringColor",
"ringOpacity",
"ringOffsetWidth",
"ringOffsetColor",
"blur",
"brightness",
"contrast",
"dropShadow",
"grayscale",
"hueRotate",
"invert",
"saturate",
"sepia",
"filter",
"backdropBlur",
"backdropBrightness",
"backdropContrast",
"backdropGrayscale",
"backdropHueRotate",
"backdropInvert",
"backdropOpacity",
"backdropSaturate",
"backdropSepia",
"backdropFilter",
"transitionProperty",
"transitionDelay",
"transitionDuration",
"transitionTimingFunction",
"willChange",
"content"
];
exports.default = _default;
lib/corePlugins.js

Sorry, the diff of this file is too big to display

-25
lib/css/LICENSE
MIT License
Copyright (c) Nicolas Gallagher
Copyright (c) Jonathan Neal
Copyright (c) Sindre Sorhus <sindresorhus@gmail.com> (sindresorhus.com)
Copyright (c) Adam Wathan
Copyright (c) Jonathan Reinink
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
-367
lib/css/preflight.css
/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/
*,
::before,
::after {
box-sizing: border-box; /* 1 */
border-width: 0; /* 2 */
border-style: solid; /* 2 */
border-color: theme('borderColor.DEFAULT', currentColor); /* 2 */
}
::before,
::after {
--tw-content: '';
}
/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
*/
html {
line-height: 1.5; /* 1 */
-webkit-text-size-adjust: 100%; /* 2 */
-moz-tab-size: 4; /* 3 */
tab-size: 4; /* 3 */
font-family: theme('fontFamily.sans', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); /* 4 */
}
/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/
body {
margin: 0; /* 1 */
line-height: inherit; /* 2 */
}
/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/
hr {
height: 0; /* 1 */
color: inherit; /* 2 */
border-top-width: 1px; /* 3 */
}
/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/
abbr:where([title]) {
text-decoration: underline dotted;
}
/*
Remove the default font size and weight for headings.
*/
h1,
h2,
h3,
h4,
h5,
h6 {
font-size: inherit;
font-weight: inherit;
}
/*
Reset links to optimize for opt-in styling instead of opt-out.
*/
a {
color: inherit;
text-decoration: inherit;
}
/*
Add the correct font weight in Edge and Safari.
*/
b,
strong {
font-weight: bolder;
}
/*
1. Use the user's configured `mono` font family by default.
2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp,
pre {
font-family: theme('fontFamily.mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); /* 1 */
font-size: 1em; /* 2 */
}
/*
Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/
table {
text-indent: 0; /* 1 */
border-color: inherit; /* 2 */
border-collapse: collapse; /* 3 */
}
/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/
button,
input,
optgroup,
select,
textarea {
font-family: inherit; /* 1 */
font-size: 100%; /* 1 */
line-height: inherit; /* 1 */
color: inherit; /* 1 */
margin: 0; /* 2 */
padding: 0; /* 3 */
}
/*
Remove the inheritance of text transform in Edge and Firefox.
*/
button,
select {
text-transform: none;
}
/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/
button,
[type='button'],
[type='reset'],
[type='submit'] {
-webkit-appearance: button; /* 1 */
background-color: transparent; /* 2 */
background-image: none; /* 2 */
}
/*
Use the modern Firefox focus style for all focusable elements.
*/
:-moz-focusring {
outline: auto;
}
/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/
:-moz-ui-invalid {
box-shadow: none;
}
/*
Add the correct vertical alignment in Chrome and Firefox.
*/
progress {
vertical-align: baseline;
}
/*
Correct the cursor style of increment and decrement buttons in Safari.
*/
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
height: auto;
}
/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/
[type='search'] {
-webkit-appearance: textfield; /* 1 */
outline-offset: -2px; /* 2 */
}
/*
Remove the inner padding in Chrome and Safari on macOS.
*/
::-webkit-search-decoration {
-webkit-appearance: none;
}
/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button; /* 1 */
font: inherit; /* 2 */
}
/*
Add the correct display in Chrome and Safari.
*/
summary {
display: list-item;
}
/*
Removes the default spacing and border for appropriate elements.
*/
blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
margin: 0;
}
fieldset {
margin: 0;
padding: 0;
}
legend {
padding: 0;
}
ol,
ul,
menu {
list-style: none;
margin: 0;
padding: 0;
}
/*
Prevent resizing textareas horizontally by default.
*/
textarea {
resize: vertical;
}
/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/
input::placeholder,
textarea::placeholder {
opacity: 1; /* 1 */
color: theme('colors.gray.400', #9ca3af); /* 2 */
}
/*
Set the default cursor for buttons.
*/
button,
[role="button"] {
cursor: pointer;
}
/*
Make sure disabled buttons don't get the pointer cursor.
*/
:disabled {
cursor: default;
}
/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
This can trigger a poorly considered lint error in some tools but is included by design.
*/
img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
display: block; /* 1 */
vertical-align: middle; /* 2 */
}
/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/
img,
video {
max-width: 100%;
height: auto;
}
/*
Ensure the default browser behavior of the `hidden` attribute.
*/
[hidden] {
display: none;
}
-59
lib/featureFlags.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.flagEnabled = flagEnabled;
exports.issueFlagNotices = issueFlagNotices;
exports.default = void 0;
var _picocolors = _interopRequireDefault(require("picocolors"));
var _log = _interopRequireDefault(require("./util/log"));
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
let defaults = {
optimizeUniversalDefaults: false
};
let featureFlags = {
future: [],
experimental: [
"optimizeUniversalDefaults"
]
};
function flagEnabled(config, flag) {
if (featureFlags.future.includes(flag)) {
var ref;
var ref1, ref2;
return config.future === "all" || ((ref2 = (ref1 = config === null || config === void 0 ? void 0 : (ref = config.future) === null || ref === void 0 ? void 0 : ref[flag]) !== null && ref1 !== void 0 ? ref1 : defaults[flag]) !== null && ref2 !== void 0 ? ref2 : false);
}
if (featureFlags.experimental.includes(flag)) {
var ref3;
var ref4, ref5;
return config.experimental === "all" || ((ref5 = (ref4 = config === null || config === void 0 ? void 0 : (ref3 = config.experimental) === null || ref3 === void 0 ? void 0 : ref3[flag]) !== null && ref4 !== void 0 ? ref4 : defaults[flag]) !== null && ref5 !== void 0 ? ref5 : false);
}
return false;
}
function experimentalFlagsEnabled(config) {
if (config.experimental === "all") {
return featureFlags.experimental;
}
var ref;
return Object.keys((ref = config === null || config === void 0 ? void 0 : config.experimental) !== null && ref !== void 0 ? ref : {}).filter((flag)=>featureFlags.experimental.includes(flag) && config.experimental[flag]
);
}
function issueFlagNotices(config) {
if (process.env.JEST_WORKER_ID !== undefined) {
return;
}
if (experimentalFlagsEnabled(config).length > 0) {
let changes = experimentalFlagsEnabled(config).map((s)=>_picocolors.default.yellow(s)
).join(", ");
_log.default.warn("experimental-flags-enabled", [
`You have enabled experimental features: ${changes}`,
"Experimental features in Tailwind CSS are not covered by semver, may introduce breaking changes, and can change at any time.",
]);
}
}
var _default = featureFlags;
exports.default = _default;
-43
lib/index.js
"use strict";
var _setupTrackingContext = _interopRequireDefault(require("./lib/setupTrackingContext"));
var _processTailwindFeatures = _interopRequireDefault(require("./processTailwindFeatures"));
var _sharedState = require("./lib/sharedState");
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
module.exports = function tailwindcss(configOrPath) {
return {
postcssPlugin: "tailwindcss",
plugins: [
_sharedState.env.DEBUG && function(root) {
console.log("\n");
console.time("JIT TOTAL");
return root;
},
function(root, result) {
let context = (0, _setupTrackingContext).default(configOrPath);
/*
if (root.type === 'document') {
let roots = root.nodes.filter((node) => node.type === 'root')
for (const root of roots) {
if (root.type === 'root') {
processTailwindFeatures(context)(root, result)
}
}
return
}
*/ (0, _processTailwindFeatures).default(context)(root, result);
},
_sharedState.env.DEBUG && function(root) {
console.timeEnd("JIT TOTAL");
console.log("\n");
return root;
},
].filter(Boolean)
};
};
module.exports.postcss = true;
-69
lib/lib/cacheInvalidation.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.hasContentChanged = hasContentChanged;
var _crypto = _interopRequireDefault(require("crypto"));
var sharedState = _interopRequireWildcard(require("./sharedState"));
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
function _interopRequireWildcard(obj) {
if (obj && obj.__esModule) {
return obj;
} else {
var newObj = {};
if (obj != null) {
for(var key in obj){
if (Object.prototype.hasOwnProperty.call(obj, key)) {
var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {};
if (desc.get || desc.set) {
Object.defineProperty(newObj, key, desc);
} else {
newObj[key] = obj[key];
}
}
}
}
newObj.default = obj;
return newObj;
}
}
/**
* Calculate the hash of a string.
*
* This doesn't need to be cryptographically secure or
* anything like that since it's used only to detect
* when the CSS changes to invalidate the context.
*
* This is wrapped in a try/catch because it's really dependent
* on how Node itself is build and the environment and OpenSSL
* version / build that is installed on the user's machine.
*
* Based on the environment this can just outright fail.
*
* See https://github.com/nodejs/node/issues/40455
*
* @param {string} str
*/ function getHash(str) {
try {
return _crypto.default.createHash("md5").update(str, "utf-8").digest("binary");
} catch (err) {
return "";
}
}
function hasContentChanged(sourcePath, root) {
let css = root.toString();
// We only care about files with @tailwind directives
// Other files use an existing context
if (!css.includes("@tailwind")) {
return false;
}
let existingHash = sharedState.sourceHashMap.get(sourcePath);
let rootHash = getHash(css);
let didChange = existingHash !== rootHash;
sharedState.sourceHashMap.set(sourcePath, rootHash);
return didChange;
}
-54
lib/lib/collapseAdjacentRules.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = collapseAdjacentRules;
function collapseAdjacentRules() {
function collapseRulesIn(root) {
let currentRule = null;
root.each((node)=>{
if (!types.has(node.type)) {
currentRule = null;
return;
}
if (currentRule === null) {
currentRule = node;
return;
}
let properties = comparisonMap[node.type];
var _property, _property1;
if (node.type === "atrule" && node.name === "font-face") {
currentRule = node;
} else if (properties.every((property)=>((_property = node[property]) !== null && _property !== void 0 ? _property : "").replace(/\s+/g, " ") === ((_property1 = currentRule[property]) !== null && _property1 !== void 0 ? _property1 : "").replace(/\s+/g, " ")
)) {
currentRule.append(node.nodes);
node.remove();
} else {
currentRule = node;
}
});
// After we've collapsed adjacent rules & at-rules, we need to collapse
// adjacent rules & at-rules that are children of at-rules.
// We do not care about nesting rules because Tailwind CSS
// explicitly does not handle rule nesting on its own as
// the user is expected to use a nesting plugin
root.each((node)=>{
if (node.type === "atrule") {
collapseRulesIn(node);
}
});
}
return (root)=>{
collapseRulesIn(root);
};
}
let comparisonMap = {
atrule: [
"name",
"params"
],
rule: [
"selector"
]
};
let types = new Set(Object.keys(comparisonMap));
-80
lib/lib/collapseDuplicateDeclarations.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = collapseDuplicateDeclarations;
function collapseDuplicateDeclarations() {
return (root)=>{
root.walkRules((node)=>{
let seen = new Map();
let droppable = new Set([]);
let byProperty = new Map();
node.walkDecls((decl)=>{
// This could happen if we have nested selectors. In that case the
// parent will loop over all its declarations but also the declarations
// of nested rules. With this we ensure that we are shallowly checking
// declarations.
if (decl.parent !== node) {
return;
}
if (seen.has(decl.prop)) {
// Exact same value as what we have seen so far
if (seen.get(decl.prop).value === decl.value) {
// Keep the last one, drop the one we've seen so far
droppable.add(seen.get(decl.prop));
// Override the existing one with the new value. This is necessary
// so that if we happen to have more than one declaration with the
// same value, that we keep removing the previous one. Otherwise we
// will only remove the *first* one.
seen.set(decl.prop, decl);
return;
}
// Not the same value, so we need to check if we can merge it so
// let's collect it first.
if (!byProperty.has(decl.prop)) {
byProperty.set(decl.prop, new Set());
}
byProperty.get(decl.prop).add(seen.get(decl.prop));
byProperty.get(decl.prop).add(decl);
}
seen.set(decl.prop, decl);
});
// Drop all the duplicate declarations with the exact same value we've
// already seen so far.
for (let decl1 of droppable){
decl1.remove();
}
// Analyze the declarations based on its unit, drop all the declarations
// with the same unit but the last one in the list.
for (let declarations of byProperty.values()){
let byUnit = new Map();
for (let decl of declarations){
let unit = resolveUnit(decl.value);
if (unit === null) {
continue;
}
if (!byUnit.has(unit)) {
byUnit.set(unit, new Set());
}
byUnit.get(unit).add(decl);
}
for (let declarations1 of byUnit.values()){
// Get all but the last one
let removableDeclarations = Array.from(declarations1).slice(0, -1);
for (let decl of removableDeclarations){
decl.remove();
}
}
}
});
};
}
let UNITLESS_NUMBER = Symbol("unitless-number");
function resolveUnit(input) {
let result = /^-?\d*.?\d+([\w%]+)?$/g.exec(input);
if (result) {
var ref;
return (ref = result[1]) !== null && ref !== void 0 ? ref : UNITLESS_NUMBER;
}
return null;
}
-44
lib/lib/defaultExtractor.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.defaultExtractor = defaultExtractor;
const PATTERNS = [
/(?:\['([^'\s]+[^<>"'`\s:\\])')/.source,
/(?:\["([^"\s]+[^<>"'`\s:\\])")/.source,
/(?:\[`([^`\s]+[^<>"'`\s:\\])`)/.source,
/([^${(<>"'`\s]*\[\w*'[^"`\s]*'?\])/.source,
/([^${(<>"'`\s]*\[\w*"[^'`\s]*"?\])/.source,
/([^<>"'`\s]*\[\w*\('[^"'`\s]*'\)\])/.source,
/([^<>"'`\s]*\[\w*\("[^"'`\s]*"\)\])/.source,
/([^<>"'`\s]*\[\w*\('[^"`\s]*'\)\])/.source,
/([^<>"'`\s]*\[\w*\("[^'`\s]*"\)\])/.source,
/([^<>"'`\s]*\[[^<>"'`\s]*\('[^"`\s]*'\)+\])/.source,
/([^<>"'`\s]*\[[^<>"'`\s]*\("[^'`\s]*"\)+\])/.source,
/([^${(<>"'`\s]*\['[^"'`\s]*'\])/.source,
/([^${(<>"'`\s]*\["[^"'`\s]*"\])/.source,
/([^<>"'`\s]*\[[^<>"'`\s]*:[^\]\s]*\])/.source,
/([^<>"'`\s]*\[[^<>"'`\s]*:'[^"'`\s]*'\])/.source,
/([^<>"'`\s]*\[[^<>"'`\s]*:"[^"'`\s]*"\])/.source,
/([^<>"'`\s]*\[[^"'`\s]+\][^<>"'`\s]*)/.source,
/([^"'`\s]*[^<>"'`\s:\\])/.source,
/([^<>"'`\s]*[^"'`\s:\\])/.source,
].join("|");
const BROAD_MATCH_GLOBAL_REGEXP = new RegExp(PATTERNS, "g");
const INNER_MATCH_GLOBAL_REGEXP = /[^<>"'`\s.(){}[\]#=%$]*[^<>"'`\s.(){}[\]#=%:$]/g;
function defaultExtractor(content) {
let broadMatches = content.matchAll(BROAD_MATCH_GLOBAL_REGEXP);
let innerMatches = content.match(INNER_MATCH_GLOBAL_REGEXP) || [];
let results = [
...broadMatches,
...innerMatches
].flat().filter((v)=>v !== undefined
);
return results;
} // Regular utilities
// {{modifier}:}*{namespace}{-{suffix}}*{/{opacityModifier}}?
// Arbitrary values
// {{modifier}:}*{namespace}-[{arbitraryValue}]{/{opacityModifier}}?
// arbitraryValue: no whitespace, balanced quotes unless within quotes, balanced brackets unless within quotes
// Arbitrary properties
// {{modifier}:}*[{validCssPropertyName}:{arbitraryValue}]
-34
lib/lib/detectNesting.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = _default;
function _default(_context) {
return (root, result)=>{
let found = false;
root.walkAtRules("tailwind", (node)=>{
if (found) return false;
if (node.parent && node.parent.type !== "root") {
found = true;
node.warn(result, [
"Nested @tailwind rules were detected, but are not supported.",
"Consider using a prefix to scope Tailwind's classes: https://tailwindcss.com/docs/configuration#prefix",
"Alternatively, use the important selector strategy: https://tailwindcss.com/docs/configuration#selector-strategy",
].join("\n"));
return false;
}
});
root.walkRules((rule)=>{
if (found) return false;
rule.walkRules((nestedRule)=>{
found = true;
nestedRule.warn(result, [
"Nested CSS was detected, but CSS nesting has not been configured correctly.",
"Please enable a CSS nesting plugin *before* Tailwind in your configuration.",
"See how here: https://tailwindcss.com/docs/using-with-preprocessors#nesting",
].join("\n"));
return false;
});
});
};
}
-171
lib/lib/evaluateTailwindFunctions.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = _default;
var _dlv = _interopRequireDefault(require("dlv"));
var _didyoumean = _interopRequireDefault(require("didyoumean"));
var _transformThemeValue = _interopRequireDefault(require("../util/transformThemeValue"));
var _postcssValueParser = _interopRequireDefault(require("postcss-value-parser"));
var _normalizeScreens = require("../util/normalizeScreens");
var _buildMediaQuery = _interopRequireDefault(require("../util/buildMediaQuery"));
var _toPath = require("../util/toPath");
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
function isObject(input) {
return typeof input === "object" && input !== null;
}
function findClosestExistingPath(theme, path) {
let parts = (0, _toPath).toPath(path);
do {
parts.pop();
if ((0, _dlv).default(theme, parts) !== undefined) break;
}while (parts.length);
return parts.length ? parts : undefined;
}
function pathToString(path) {
if (typeof path === "string") return path;
return path.reduce((acc, cur, i)=>{
if (cur.includes(".")) return `${acc}[${cur}]`;
return i === 0 ? cur : `${acc}.${cur}`;
}, "");
}
function list(items) {
return items.map((key)=>`'${key}'`
).join(", ");
}
function listKeys(obj) {
return list(Object.keys(obj));
}
function validatePath(config, path, defaultValue) {
const pathString = Array.isArray(path) ? pathToString(path) : path.replace(/^['"]+/g, "").replace(/['"]+$/g, "");
const pathSegments = Array.isArray(path) ? path : (0, _toPath).toPath(pathString);
const value = (0, _dlv).default(config.theme, pathSegments, defaultValue);
if (value === undefined) {
let error = `'${pathString}' does not exist in your theme config.`;
const parentSegments = pathSegments.slice(0, -1);
const parentValue = (0, _dlv).default(config.theme, parentSegments);
if (isObject(parentValue)) {
const validKeys = Object.keys(parentValue).filter((key)=>validatePath(config, [
...parentSegments,
key
]).isValid
);
const suggestion = (0, _didyoumean).default(pathSegments[pathSegments.length - 1], validKeys);
if (suggestion) {
error += ` Did you mean '${pathToString([
...parentSegments,
suggestion
])}'?`;
} else if (validKeys.length > 0) {
error += ` '${pathToString(parentSegments)}' has the following valid keys: ${list(validKeys)}`;
}
} else {
const closestPath = findClosestExistingPath(config.theme, pathString);
if (closestPath) {
const closestValue = (0, _dlv).default(config.theme, closestPath);
if (isObject(closestValue)) {
error += ` '${pathToString(closestPath)}' has the following keys: ${listKeys(closestValue)}`;
} else {
error += ` '${pathToString(closestPath)}' is not an object.`;
}
} else {
error += ` Your theme has the following top-level keys: ${listKeys(config.theme)}`;
}
}
return {
isValid: false,
error
};
}
if (!(typeof value === "string" || typeof value === "number" || typeof value === "function" || value instanceof String || value instanceof Number || Array.isArray(value))) {
let error = `'${pathString}' was found but does not resolve to a string.`;
if (isObject(value)) {
let validKeys = Object.keys(value).filter((key)=>validatePath(config, [
...pathSegments,
key
]).isValid
);
if (validKeys.length) {
error += ` Did you mean something like '${pathToString([
...pathSegments,
validKeys[0]
])}'?`;
}
}
return {
isValid: false,
error
};
}
const [themeSection] = pathSegments;
return {
isValid: true,
value: (0, _transformThemeValue).default(themeSection)(value)
};
}
function extractArgs(node, vNodes, functions) {
vNodes = vNodes.map((vNode)=>resolveVNode(node, vNode, functions)
);
let args = [
""
];
for (let vNode1 of vNodes){
if (vNode1.type === "div" && vNode1.value === ",") {
args.push("");
} else {
args[args.length - 1] += _postcssValueParser.default.stringify(vNode1);
}
}
return args;
}
function resolveVNode(node, vNode, functions) {
if (vNode.type === "function" && functions[vNode.value] !== undefined) {
let args = extractArgs(node, vNode.nodes, functions);
vNode.type = "word";
vNode.value = functions[vNode.value](node, ...args);
}
return vNode;
}
function resolveFunctions(node, input, functions) {
return (0, _postcssValueParser).default(input).walk((vNode)=>{
resolveVNode(node, vNode, functions);
}).toString();
}
let nodeTypePropertyMap = {
atrule: "params",
decl: "value"
};
function _default({ tailwindConfig: config }) {
let functions = {
theme: (node, path, ...defaultValue)=>{
const { isValid , value , error } = validatePath(config, path, defaultValue.length ? defaultValue : undefined);
if (!isValid) {
throw node.error(error);
}
return value;
},
screen: (node, screen)=>{
screen = screen.replace(/^['"]+/g, "").replace(/['"]+$/g, "");
let screens = (0, _normalizeScreens).normalizeScreens(config.theme.screens);
let screenDefinition = screens.find(({ name })=>name === screen
);
if (!screenDefinition) {
throw node.error(`The '${screen}' screen does not exist in your theme.`);
}
return (0, _buildMediaQuery).default(screenDefinition);
}
};
return (root)=>{
root.walk((node)=>{
let property = nodeTypePropertyMap[node.type];
if (property === undefined) {
return;
}
node[property] = resolveFunctions(node, node[property], functions);
});
};
}
-433
lib/lib/expandApplyAtRules.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = expandApplyAtRules;
var _postcss = _interopRequireDefault(require("postcss"));
var _postcssSelectorParser = _interopRequireDefault(require("postcss-selector-parser"));
var _generateRules = require("./generateRules");
var _bigSign = _interopRequireDefault(require("../util/bigSign"));
var _escapeClassName = _interopRequireDefault(require("../util/escapeClassName"));
function expandApplyAtRules(context) {
return (root)=>{
// Build a cache of the user's CSS so we can use it to resolve classes used by @apply
let localCache = lazyCache(()=>buildLocalApplyCache(root, context)
);
processApply(root, context, localCache);
};
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
/** @typedef {Map<string, [any, import('postcss').Rule[]]>} ApplyCache */ function extractClasses(node) {
let classes = new Set();
let container = _postcss.default.root({
nodes: [
node.clone()
]
});
container.walkRules((rule)=>{
(0, _postcssSelectorParser).default((selectors)=>{
selectors.walkClasses((classSelector)=>{
classes.add(classSelector.value);
});
}).processSync(rule.selector);
});
return Array.from(classes);
}
function extractBaseCandidates(candidates, separator) {
let baseClasses = new Set();
for (let candidate of candidates){
baseClasses.add(candidate.split(separator).pop());
}
return Array.from(baseClasses);
}
function prefix(context, selector) {
let prefix1 = context.tailwindConfig.prefix;
return typeof prefix1 === "function" ? prefix1(selector) : prefix1 + selector;
}
function* pathToRoot(node) {
yield node;
while(node.parent){
yield node.parent;
node = node.parent;
}
}
/**
* Only clone the node itself and not its children
*
* @param {*} node
* @param {*} overrides
* @returns
*/ function shallowClone(node, overrides = {}) {
let children = node.nodes;
node.nodes = [];
let tmp = node.clone(overrides);
node.nodes = children;
return tmp;
}
/**
* Clone just the nodes all the way to the top that are required to represent
* this singular rule in the tree.
*
* For example, if we have CSS like this:
* ```css
* @media (min-width: 768px) {
* @supports (display: grid) {
* .foo {
* display: grid;
* grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
* }
* }
*
* @supports (backdrop-filter: blur(1px)) {
* .bar {
* backdrop-filter: blur(1px);
* }
* }
*
* .baz {
* color: orange;
* }
* }
* ```
*
* And we're cloning `.bar` it'll return a cloned version of what's required for just that single node:
*
* ```css
* @media (min-width: 768px) {
* @supports (backdrop-filter: blur(1px)) {
* .bar {
* backdrop-filter: blur(1px);
* }
* }
* }
* ```
*
* @param {import('postcss').Node} node
*/ function nestedClone(node) {
for (let parent of pathToRoot(node)){
if (node === parent) {
continue;
}
if (parent.type === "root") {
break;
}
node = shallowClone(parent, {
nodes: [
node
]
});
}
return node;
}
/**
* @param {import('postcss').Root} root
*/ function buildLocalApplyCache(root, context) {
/** @type {ApplyCache} */ let cache = new Map();
let highestOffset = context.layerOrder.user >> 4n;
root.walkRules((rule, idx)=>{
// Ignore rules generated by Tailwind
for (let node of pathToRoot(rule)){
var ref;
if (((ref = node.raws.tailwind) === null || ref === void 0 ? void 0 : ref.layer) !== undefined) {
return;
}
}
// Clone what's required to represent this singular rule in the tree
let container = nestedClone(rule);
for (let className of extractClasses(rule)){
let list = cache.get(className) || [];
cache.set(className, list);
list.push([
{
layer: "user",
sort: BigInt(idx) + highestOffset,
important: false
},
container,
]);
}
});
return cache;
}
/**
* @returns {ApplyCache}
*/ function buildApplyCache(applyCandidates, context) {
for (let candidate of applyCandidates){
if (context.notClassCache.has(candidate) || context.applyClassCache.has(candidate)) {
continue;
}
if (context.classCache.has(candidate)) {
context.applyClassCache.set(candidate, context.classCache.get(candidate).map(([meta, rule])=>[
meta,
rule.clone()
]
));
continue;
}
let matches = Array.from((0, _generateRules).resolveMatches(candidate, context));
if (matches.length === 0) {
context.notClassCache.add(candidate);
continue;
}
context.applyClassCache.set(candidate, matches);
}
return context.applyClassCache;
}
/**
* Build a cache only when it's first used
*
* @param {() => ApplyCache} buildCacheFn
* @returns {ApplyCache}
*/ function lazyCache(buildCacheFn) {
let cache = null;
return {
get: (name)=>{
cache = cache || buildCacheFn();
return cache.get(name);
},
has: (name)=>{
cache = cache || buildCacheFn();
return cache.has(name);
}
};
}
/**
* Take a series of multiple caches and merge
* them so they act like one large cache
*
* @param {ApplyCache[]} caches
* @returns {ApplyCache}
*/ function combineCaches(caches) {
return {
get: (name)=>caches.flatMap((cache)=>cache.get(name) || []
)
,
has: (name)=>caches.some((cache)=>cache.has(name)
)
};
}
function extractApplyCandidates(params) {
let candidates = params.split(/[\s\t\n]+/g);
if (candidates[candidates.length - 1] === "!important") {
return [
candidates.slice(0, -1),
true
];
}
return [
candidates,
false
];
}
function processApply(root, context, localCache) {
let applyCandidates = new Set();
// Collect all @apply rules and candidates
let applies = [];
root.walkAtRules("apply", (rule)=>{
let [candidates] = extractApplyCandidates(rule.params);
for (let util of candidates){
applyCandidates.add(util);
}
applies.push(rule);
});
// Start the @apply process if we have rules with @apply in them
if (applies.length > 0) {
// Fill up some caches!
let applyClassCache = combineCaches([
localCache,
buildApplyCache(applyCandidates, context)
]);
/**
* When we have an apply like this:
*
* .abc {
* @apply hover:font-bold;
* }
*
* What we essentially will do is resolve to this:
*
* .abc {
* @apply .hover\:font-bold:hover {
* font-weight: 500;
* }
* }
*
* Notice that the to-be-applied class is `.hover\:font-bold:hover` and that the utility candidate was `hover:font-bold`.
* What happens in this function is that we prepend a `.` and escape the candidate.
* This will result in `.hover\:font-bold`
* Which means that we can replace `.hover\:font-bold` with `.abc` in `.hover\:font-bold:hover` resulting in `.abc:hover`
*/ // TODO: Should we use postcss-selector-parser for this instead?
function replaceSelector(selector, utilitySelectors, candidate) {
let needle = `.${(0, _escapeClassName).default(candidate)}`;
let utilitySelectorsList = utilitySelectors.split(/\s*\,(?![^(]*\))\s*/g);
return selector.split(/\s*\,(?![^(]*\))\s*/g).map((s)=>{
let replaced = [];
for (let utilitySelector of utilitySelectorsList){
let replacedSelector = utilitySelector.replace(needle, s);
if (replacedSelector === utilitySelector) {
continue;
}
replaced.push(replacedSelector);
}
return replaced.join(", ");
}).join(", ");
}
let perParentApplies = new Map();
// Collect all apply candidates and their rules
for (let apply of applies){
let candidates = perParentApplies.get(apply.parent) || [];
perParentApplies.set(apply.parent, [
candidates,
apply.source
]);
let [applyCandidates, important] = extractApplyCandidates(apply.params);
if (apply.parent.type === "atrule") {
if (apply.parent.name === "screen") {
const screenType = apply.parent.params;
throw apply.error(`@apply is not supported within nested at-rules like @screen. We suggest you write this as @apply ${applyCandidates.map((c)=>`${screenType}:${c}`
).join(" ")} instead.`);
}
throw apply.error(`@apply is not supported within nested at-rules like @${apply.parent.name}. You can fix this by un-nesting @${apply.parent.name}.`);
}
for (let applyCandidate of applyCandidates){
if ([
prefix(context, "group"),
prefix(context, "peer")
].includes(applyCandidate)) {
// TODO: Link to specific documentation page with error code.
throw apply.error(`@apply should not be used with the '${applyCandidate}' utility`);
}
if (!applyClassCache.has(applyCandidate)) {
throw apply.error(`The \`${applyCandidate}\` class does not exist. If \`${applyCandidate}\` is a custom class, make sure it is defined within a \`@layer\` directive.`);
}
let rules = applyClassCache.get(applyCandidate);
candidates.push([
applyCandidate,
important,
rules
]);
}
}
for (const [parent, [candidates, atApplySource]] of perParentApplies){
let siblings = [];
for (let [applyCandidate, important, rules] of candidates){
for (let [meta, node1] of rules){
let parentClasses = extractClasses(parent);
let nodeClasses = extractClasses(node1);
// Add base utility classes from the @apply node to the list of
// classes to check whether it intersects and therefore results in a
// circular dependency or not.
//
// E.g.:
// .foo {
// @apply hover:a; // This applies "a" but with a modifier
// }
//
// We only have to do that with base classes of the `node`, not of the `parent`
// E.g.:
// .hover\:foo {
// @apply bar;
// }
// .bar {
// @apply foo;
// }
//
// This should not result in a circular dependency because we are
// just applying `.foo` and the rule above is `.hover\:foo` which is
// unrelated. However, if we were to apply `hover:foo` then we _did_
// have to include this one.
nodeClasses = nodeClasses.concat(extractBaseCandidates(nodeClasses, context.tailwindConfig.separator));
let intersects = parentClasses.some((selector)=>nodeClasses.includes(selector)
);
if (intersects) {
throw node1.error(`You cannot \`@apply\` the \`${applyCandidate}\` utility here because it creates a circular dependency.`);
}
let root = _postcss.default.root({
nodes: [
node1.clone()
]
});
// Make sure every node in the entire tree points back at the @apply rule that generated it
root.walk((node)=>{
node.source = atApplySource;
});
let canRewriteSelector = node1.type !== "atrule" || node1.type === "atrule" && node1.name !== "keyframes";
if (canRewriteSelector) {
root.walkRules((rule)=>{
// Let's imagine you have the following structure:
//
// .foo {
// @apply bar;
// }
//
// @supports (a: b) {
// .bar {
// color: blue
// }
//
// .something-unrelated {}
// }
//
// In this case we want to apply `.bar` but it happens to be in
// an atrule node. We clone that node instead of the nested one
// because we still want that @supports rule to be there once we
// applied everything.
//
// However it happens to be that the `.something-unrelated` is
// also in that same shared @supports atrule. This is not good,
// and this should not be there. The good part is that this is
// a clone already and it can be safely removed. The question is
// how do we know we can remove it. Basically what we can do is
// match it against the applyCandidate that you want to apply. If
// it doesn't match the we can safely delete it.
//
// If we didn't do this, then the `replaceSelector` function
// would have replaced this with something that didn't exist and
// therefore it removed the selector altogether. In this specific
// case it would result in `{}` instead of `.something-unrelated {}`
if (!extractClasses(rule).some((candidate)=>candidate === applyCandidate
)) {
rule.remove();
return;
}
rule.selector = replaceSelector(parent.selector, rule.selector, applyCandidate);
rule.walkDecls((d)=>{
d.important = meta.important || important;
});
});
}
// Insert it
siblings.push([
// Ensure that when we are sorting, that we take the layer order into account
{
...meta,
sort: meta.sort | context.layerOrder[meta.layer]
},
root.nodes[0],
]);
}
}
// Inject the rules, sorted, correctly
let nodes = siblings.sort(([a], [z])=>(0, _bigSign).default(a.sort - z.sort)
).map((s)=>s[1]
);
// `parent` refers to the node at `.abc` in: .abc { @apply mt-2 }
parent.after(nodes);
}
for (let apply1 of applies){
// If there are left-over declarations, just remove the @apply
if (apply1.parent.nodes.length > 1) {
apply1.remove();
} else {
// The node is empty, drop the full node
apply1.parent.remove();
}
}
// Do it again, in case we have other `@apply` rules
processApply(root, context, localCache);
}
}
-262
lib/lib/expandTailwindAtRules.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = expandTailwindAtRules;
var _quickLru = _interopRequireDefault(require("quick-lru"));
var sharedState = _interopRequireWildcard(require("./sharedState"));
var _generateRules = require("./generateRules");
var _bigSign = _interopRequireDefault(require("../util/bigSign"));
var _log = _interopRequireDefault(require("../util/log"));
var _cloneNodes = _interopRequireDefault(require("../util/cloneNodes"));
var _defaultExtractor = require("./defaultExtractor");
function expandTailwindAtRules(context) {
return (root)=>{
let layerNodes = {
base: null,
components: null,
utilities: null,
variants: null
};
root.walkAtRules((rule)=>{
// Make sure this file contains Tailwind directives. If not, we can save
// a lot of work and bail early. Also we don't have to register our touch
// file as a dependency since the output of this CSS does not depend on
// the source of any templates. Think Vue <style> blocks for example.
if (rule.name === "tailwind") {
if (Object.keys(layerNodes).includes(rule.params)) {
layerNodes[rule.params] = rule;
}
}
});
if (Object.values(layerNodes).every((n)=>n === null
)) {
return root;
}
// ---
// Find potential rules in changed files
let candidates = new Set([
sharedState.NOT_ON_DEMAND
]);
let seen = new Set();
env.DEBUG && console.time("Reading changed files");
for (let { content , extension } of context.changedContent){
let transformer = getTransformer(context.tailwindConfig, extension);
let extractor = getExtractor(context.tailwindConfig, extension);
getClassCandidates(transformer(content), extractor, candidates, seen);
}
env.DEBUG && console.timeEnd("Reading changed files");
// ---
// Generate the actual CSS
let classCacheCount = context.classCache.size;
env.DEBUG && console.time("Generate rules");
let rules = (0, _generateRules).generateRules(candidates, context);
env.DEBUG && console.timeEnd("Generate rules");
// We only ever add to the classCache, so if it didn't grow, there is nothing new.
env.DEBUG && console.time("Build stylesheet");
if (context.stylesheetCache === null || context.classCache.size !== classCacheCount) {
for (let rule of rules){
context.ruleCache.add(rule);
}
context.stylesheetCache = buildStylesheet([
...context.ruleCache
], context);
}
env.DEBUG && console.timeEnd("Build stylesheet");
let { defaults: defaultNodes , base: baseNodes , components: componentNodes , utilities: utilityNodes , variants: screenNodes , } = context.stylesheetCache;
// ---
// Replace any Tailwind directives with generated CSS
if (layerNodes.base) {
layerNodes.base.before((0, _cloneNodes).default([
...baseNodes,
...defaultNodes
], layerNodes.base.source, {
layer: "base"
}));
layerNodes.base.remove();
}
if (layerNodes.components) {
layerNodes.components.before((0, _cloneNodes).default([
...componentNodes
], layerNodes.components.source, {
layer: "components"
}));
layerNodes.components.remove();
}
if (layerNodes.utilities) {
layerNodes.utilities.before((0, _cloneNodes).default([
...utilityNodes
], layerNodes.utilities.source, {
layer: "utilities"
}));
layerNodes.utilities.remove();
}
// We do post-filtering to not alter the emitted order of the variants
const variantNodes = Array.from(screenNodes).filter((node)=>{
var ref;
const parentLayer = (ref = node.raws.tailwind) === null || ref === void 0 ? void 0 : ref.parentLayer;
if (parentLayer === "components") {
return layerNodes.components !== null;
}
if (parentLayer === "utilities") {
return layerNodes.utilities !== null;
}
return true;
});
if (layerNodes.variants) {
layerNodes.variants.before((0, _cloneNodes).default(variantNodes, layerNodes.variants.source, {
layer: "variants"
}));
layerNodes.variants.remove();
} else if (variantNodes.length > 0) {
root.append((0, _cloneNodes).default(variantNodes, root.source, {
layer: "variants"
}));
}
// If we've got a utility layer and no utilities are generated there's likely something wrong
const hasUtilityVariants = variantNodes.some((node)=>{
var ref;
return ((ref = node.raws.tailwind) === null || ref === void 0 ? void 0 : ref.parentLayer) === "utilities";
});
if (layerNodes.utilities && utilityNodes.size === 0 && !hasUtilityVariants) {
_log.default.warn("content-problems", [
"No utility classes were detected in your source files. If this is unexpected, double-check the `content` option in your Tailwind CSS configuration.",
"https://tailwindcss.com/docs/content-configuration",
]);
}
// ---
if (env.DEBUG) {
console.log("Potential classes: ", candidates.size);
console.log("Active contexts: ", sharedState.contextSourcesMap.size);
}
// Clear the cache for the changed files
context.changedContent = [];
// Cleanup any leftover @layer atrules
root.walkAtRules("layer", (rule)=>{
if (Object.keys(layerNodes).includes(rule.params)) {
rule.remove();
}
});
};
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
function _interopRequireWildcard(obj) {
if (obj && obj.__esModule) {
return obj;
} else {
var newObj = {};
if (obj != null) {
for(var key in obj){
if (Object.prototype.hasOwnProperty.call(obj, key)) {
var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {};
if (desc.get || desc.set) {
Object.defineProperty(newObj, key, desc);
} else {
newObj[key] = obj[key];
}
}
}
}
newObj.default = obj;
return newObj;
}
}
let env = sharedState.env;
const builtInExtractors = {
DEFAULT: _defaultExtractor.defaultExtractor
};
const builtInTransformers = {
DEFAULT: (content)=>content
,
svelte: (content)=>content.replace(/(?:^|\s)class:/g, " ")
};
function getExtractor(tailwindConfig, fileExtension) {
let extractors = tailwindConfig.content.extract;
return extractors[fileExtension] || extractors.DEFAULT || builtInExtractors[fileExtension] || builtInExtractors.DEFAULT;
}
function getTransformer(tailwindConfig, fileExtension) {
let transformers = tailwindConfig.content.transform;
return transformers[fileExtension] || transformers.DEFAULT || builtInTransformers[fileExtension] || builtInTransformers.DEFAULT;
}
let extractorCache = new WeakMap();
// Scans template contents for possible classes. This is a hot path on initial build but
// not too important for subsequent builds. The faster the better though — if we can speed
// up these regexes by 50% that could cut initial build time by like 20%.
function getClassCandidates(content, extractor, candidates, seen) {
if (!extractorCache.has(extractor)) {
extractorCache.set(extractor, new _quickLru.default({
maxSize: 25000
}));
}
for (let line of content.split("\n")){
line = line.trim();
if (seen.has(line)) {
continue;
}
seen.add(line);
if (extractorCache.get(extractor).has(line)) {
for (let match of extractorCache.get(extractor).get(line)){
candidates.add(match);
}
} else {
let extractorMatches = extractor(line).filter((s)=>s !== "!*"
);
let lineMatchesSet = new Set(extractorMatches);
for (let match of lineMatchesSet){
candidates.add(match);
}
extractorCache.get(extractor).set(line, lineMatchesSet);
}
}
}
function buildStylesheet(rules, context) {
let sortedRules = rules.sort(([a], [z])=>(0, _bigSign).default(a - z)
);
let returnValue = {
base: new Set(),
defaults: new Set(),
components: new Set(),
utilities: new Set(),
variants: new Set(),
// All the CSS that is not Tailwind related can be put in this bucket. This
// will make it easier to later use this information when we want to
// `@apply` for example. The main reason we do this here is because we
// still need to make sure the order is correct. Last but not least, we
// will make sure to always re-inject this section into the css, even if
// certain rules were not used. This means that it will look like a no-op
// from the user's perspective, but we gathered all the useful information
// we need.
user: new Set()
};
for (let [sort, rule] of sortedRules){
if (sort >= context.minimumScreen) {
returnValue.variants.add(rule);
continue;
}
if (sort & context.layerOrder.base) {
returnValue.base.add(rule);
continue;
}
if (sort & context.layerOrder.defaults) {
returnValue.defaults.add(rule);
continue;
}
if (sort & context.layerOrder.components) {
returnValue.components.add(rule);
continue;
}
if (sort & context.layerOrder.utilities) {
returnValue.utilities.add(rule);
continue;
}
if (sort & context.layerOrder.user) {
returnValue.user.add(rule);
continue;
}
}
return returnValue;
}
-646
lib/lib/generateRules.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.generateRules = exports.resolveMatches = void 0;
var _postcss = _interopRequireDefault(require("postcss"));
var _postcssSelectorParser = _interopRequireDefault(require("postcss-selector-parser"));
var _parseObjectStyles = _interopRequireDefault(require("../util/parseObjectStyles"));
var _isPlainObject = _interopRequireDefault(require("../util/isPlainObject"));
var _prefixSelector = _interopRequireDefault(require("../util/prefixSelector"));
var _pluginUtils = require("../util/pluginUtils");
var _log = _interopRequireDefault(require("../util/log"));
var sharedState = _interopRequireWildcard(require("./sharedState"));
var _formatVariantSelector = require("../util/formatVariantSelector");
var _nameClass = require("../util/nameClass");
var _dataTypes = require("../util/dataTypes");
var _isValidArbitraryValue = _interopRequireDefault(require("../util/isValidArbitraryValue"));
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
function _interopRequireWildcard(obj) {
if (obj && obj.__esModule) {
return obj;
} else {
var newObj = {};
if (obj != null) {
for(var key in obj){
if (Object.prototype.hasOwnProperty.call(obj, key)) {
var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {};
if (desc.get || desc.set) {
Object.defineProperty(newObj, key, desc);
} else {
newObj[key] = obj[key];
}
}
}
}
newObj.default = obj;
return newObj;
}
}
let classNameParser = (0, _postcssSelectorParser).default((selectors)=>{
return selectors.first.filter(({ type })=>type === "class"
).pop().value;
});
function getClassNameFromSelector(selector) {
return classNameParser.transformSync(selector);
}
// Generate match permutations for a class candidate, like:
// ['ring-offset-blue', '100']
// ['ring-offset', 'blue-100']
// ['ring', 'offset-blue-100']
// Example with dynamic classes:
// ['grid-cols', '[[linename],1fr,auto]']
// ['grid', 'cols-[[linename],1fr,auto]']
function* candidatePermutations(candidate) {
let lastIndex = Infinity;
while(lastIndex >= 0){
let dashIdx;
if (lastIndex === Infinity && candidate.endsWith("]")) {
let bracketIdx = candidate.indexOf("[");
// If character before `[` isn't a dash or a slash, this isn't a dynamic class
// eg. string[]
dashIdx = [
"-",
"/"
].includes(candidate[bracketIdx - 1]) ? bracketIdx - 1 : -1;
} else {
dashIdx = candidate.lastIndexOf("-", lastIndex);
}
if (dashIdx < 0) {
break;
}
let prefix = candidate.slice(0, dashIdx);
let modifier = candidate.slice(dashIdx + 1);
yield [
prefix,
modifier
];
lastIndex = dashIdx - 1;
}
}
function applyPrefix(matches, context) {
if (matches.length === 0 || context.tailwindConfig.prefix === "") {
return matches;
}
for (let match of matches){
let [meta] = match;
if (meta.options.respectPrefix) {
let container = _postcss.default.root({
nodes: [
match[1].clone()
]
});
let classCandidate = match[1].raws.tailwind.classCandidate;
container.walkRules((r)=>{
// If this is a negative utility with a dash *before* the prefix we
// have to ensure that the generated selector matches the candidate
// Not doing this will cause `-tw-top-1` to generate the class `.tw--top-1`
// The disconnect between candidate <-> class can cause @apply to hard crash.
let shouldPrependNegative = classCandidate.startsWith("-");
r.selector = (0, _prefixSelector).default(context.tailwindConfig.prefix, r.selector, shouldPrependNegative);
});
match[1] = container.nodes[0];
}
}
return matches;
}
function applyImportant(matches, classCandidate) {
if (matches.length === 0) {
return matches;
}
let result = [];
for (let [meta, rule] of matches){
let container = _postcss.default.root({
nodes: [
rule.clone()
]
});
container.walkRules((r)=>{
r.selector = (0, _pluginUtils).updateAllClasses(r.selector, (className)=>{
if (className === classCandidate) {
return `!${className}`;
}
return className;
});
r.walkDecls((d)=>d.important = true
);
});
result.push([
{
...meta,
important: true
},
container.nodes[0]
]);
}
return result;
}
// Takes a list of rule tuples and applies a variant like `hover`, sm`,
// whatever to it. We used to do some extra caching here to avoid generating
// a variant of the same rule more than once, but this was never hit because
// we cache at the entire selector level further up the tree.
//
// Technically you can get a cache hit if you have `hover:focus:text-center`
// and `focus:hover:text-center` in the same project, but it doesn't feel
// worth the complexity for that case.
function applyVariant(variant, matches, context) {
if (matches.length === 0) {
return matches;
}
if (context.variantMap.has(variant)) {
let variantFunctionTuples = context.variantMap.get(variant);
let result = [];
for (let [meta, rule1] of matches){
// Don't generate variants for user css
if (meta.layer === "user") {
continue;
}
let container = _postcss.default.root({
nodes: [
rule1.clone()
]
});
for (let [variantSort, variantFunction] of variantFunctionTuples){
let clone = container.clone();
let collectedFormats = [];
let originals = new Map();
function prepareBackup() {
if (originals.size > 0) return; // Already prepared, chicken out
clone.walkRules((rule)=>originals.set(rule, rule.selector)
);
}
function modifySelectors(modifierFunction) {
prepareBackup();
clone.each((rule)=>{
if (rule.type !== "rule") {
return;
}
rule.selectors = rule.selectors.map((selector)=>{
return modifierFunction({
get className () {
return getClassNameFromSelector(selector);
},
selector
});
});
});
return clone;
}
let ruleWithVariant = variantFunction({
// Public API
get container () {
prepareBackup();
return clone;
},
separator: context.tailwindConfig.separator,
modifySelectors,
// Private API for now
wrap (wrapper) {
let nodes = clone.nodes;
clone.removeAll();
wrapper.append(nodes);
clone.append(wrapper);
},
format (selectorFormat) {
collectedFormats.push(selectorFormat);
}
});
if (typeof ruleWithVariant === "string") {
collectedFormats.push(ruleWithVariant);
}
if (ruleWithVariant === null) {
continue;
}
// We filled the `originals`, therefore we assume that somebody touched
// `container` or `modifySelectors`. Let's see if they did, so that we
// can restore the selectors, and collect the format strings.
if (originals.size > 0) {
clone.walkRules((rule)=>{
if (!originals.has(rule)) return;
let before = originals.get(rule);
if (before === rule.selector) return; // No mutation happened
let modified = rule.selector;
// Rebuild the base selector, this is what plugin authors would do
// as well. E.g.: `${variant}${separator}${className}`.
// However, plugin authors probably also prepend or append certain
// classes, pseudos, ids, ...
let rebuiltBase = (0, _postcssSelectorParser).default((selectors)=>{
selectors.walkClasses((classNode)=>{
classNode.value = `${variant}${context.tailwindConfig.separator}${classNode.value}`;
});
}).processSync(before);
// Now that we know the original selector, the new selector, and
// the rebuild part in between, we can replace the part that plugin
// authors need to rebuild with `&`, and eventually store it in the
// collectedFormats. Similar to what `format('...')` would do.
//
// E.g.:
// variant: foo
// selector: .markdown > p
// modified (by plugin): .foo .foo\\:markdown > p
// rebuiltBase (internal): .foo\\:markdown > p
// format: .foo &
collectedFormats.push(modified.replace(rebuiltBase, "&"));
rule.selector = before;
});
}
// This tracks the originating layer for the variant
// For example:
// .sm:underline {} is a variant of something in the utilities layer
// .sm:container {} is a variant of the container component
clone.nodes[0].raws.tailwind = {
...clone.nodes[0].raws.tailwind,
parentLayer: meta.layer
};
var _collectedFormats;
let withOffset = [
{
...meta,
sort: variantSort | meta.sort,
collectedFormats: ((_collectedFormats = meta.collectedFormats) !== null && _collectedFormats !== void 0 ? _collectedFormats : []).concat(collectedFormats)
},
clone.nodes[0],
];
result.push(withOffset);
}
}
return result;
}
return [];
}
function parseRules(rule, cache, options = {}) {
// PostCSS node
if (!(0, _isPlainObject).default(rule) && !Array.isArray(rule)) {
return [
[
rule
],
options
];
}
// Tuple
if (Array.isArray(rule)) {
return parseRules(rule[0], cache, rule[1]);
}
// Simple object
if (!cache.has(rule)) {
cache.set(rule, (0, _parseObjectStyles).default(rule));
}
return [
cache.get(rule),
options
];
}
const IS_VALID_PROPERTY_NAME = /^[a-z_-]/;
function isValidPropName(name) {
return IS_VALID_PROPERTY_NAME.test(name);
}
/**
* @param {string} declaration
* @returns {boolean}
*/ function looksLikeUri(declaration) {
// Quick bailout for obvious non-urls
// This doesn't support schemes that don't use a leading // but that's unlikely to be a problem
if (!declaration.includes("://")) {
return false;
}
try {
const url = new URL(declaration);
return url.scheme !== "" && url.host !== "";
} catch (err) {
// Definitely not a valid url
return false;
}
}
function isParsableNode(node) {
let isParsable = true;
node.walkDecls((decl)=>{
if (!isParsableCssValue(decl.name, decl.value)) {
isParsable = false;
return false;
}
});
return isParsable;
}
function isParsableCssValue(property, value) {
// We don't want to to treat [https://example.com] as a custom property
// Even though, according to the CSS grammar, it's a totally valid CSS declaration
// So we short-circuit here by checking if the custom property looks like a url
if (looksLikeUri(`${property}:${value}`)) {
return false;
}
try {
_postcss.default.parse(`a{${property}:${value}}`).toResult();
return true;
} catch (err) {
return false;
}
}
function extractArbitraryProperty(classCandidate, context) {
var ref;
let [, property, value] = (ref = classCandidate.match(/^\[([a-zA-Z0-9-_]+):(\S+)\]$/)) !== null && ref !== void 0 ? ref : [];
if (value === undefined) {
return null;
}
if (!isValidPropName(property)) {
return null;
}
if (!(0, _isValidArbitraryValue).default(value)) {
return null;
}
let normalized = (0, _dataTypes).normalize(value);
if (!isParsableCssValue(property, normalized)) {
return null;
}
return [
[
{
sort: context.arbitraryPropertiesSort,
layer: "utilities"
},
()=>({
[(0, _nameClass).asClass(classCandidate)]: {
[property]: normalized
}
})
,
],
];
}
function* resolveMatchedPlugins(classCandidate, context) {
if (context.candidateRuleMap.has(classCandidate)) {
yield [
context.candidateRuleMap.get(classCandidate),
"DEFAULT"
];
}
yield* function*(arbitraryPropertyRule) {
if (arbitraryPropertyRule !== null) {
yield [
arbitraryPropertyRule,
"DEFAULT"
];
}
}(extractArbitraryProperty(classCandidate, context));
let candidatePrefix = classCandidate;
let negative = false;
const twConfigPrefix = context.tailwindConfig.prefix;
const twConfigPrefixLen = twConfigPrefix.length;
if (candidatePrefix[twConfigPrefixLen] === "-") {
negative = true;
candidatePrefix = twConfigPrefix + candidatePrefix.slice(twConfigPrefixLen + 1);
}
if (negative && context.candidateRuleMap.has(candidatePrefix)) {
yield [
context.candidateRuleMap.get(candidatePrefix),
"-DEFAULT"
];
}
for (let [prefix, modifier] of candidatePermutations(candidatePrefix)){
if (context.candidateRuleMap.has(prefix)) {
yield [
context.candidateRuleMap.get(prefix),
negative ? `-${modifier}` : modifier
];
}
}
}
function splitWithSeparator(input, separator) {
if (input === sharedState.NOT_ON_DEMAND) {
return [
sharedState.NOT_ON_DEMAND
];
}
return input.split(new RegExp(`\\${separator}(?![^[]*\\])`, "g"));
}
function* recordCandidates(matches, classCandidate) {
for (const match of matches){
match[1].raws.tailwind = {
...match[1].raws.tailwind,
classCandidate
};
yield match;
}
}
function* resolveMatches(candidate, context) {
let separator = context.tailwindConfig.separator;
let [classCandidate, ...variants] = splitWithSeparator(candidate, separator).reverse();
let important = false;
if (classCandidate.startsWith("!")) {
important = true;
classCandidate = classCandidate.slice(1);
}
// TODO: Reintroduce this in ways that doesn't break on false positives
// function sortAgainst(toSort, against) {
// return toSort.slice().sort((a, z) => {
// return bigSign(against.get(a)[0] - against.get(z)[0])
// })
// }
// let sorted = sortAgainst(variants, context.variantMap)
// if (sorted.toString() !== variants.toString()) {
// let corrected = sorted.reverse().concat(classCandidate).join(':')
// throw new Error(`Class ${candidate} should be written as ${corrected}`)
// }
for (let matchedPlugins of resolveMatchedPlugins(classCandidate, context)){
let matches = [];
let typesByMatches = new Map();
let [plugins, modifier] = matchedPlugins;
let isOnlyPlugin = plugins.length === 1;
for (let [sort, plugin] of plugins){
let matchesPerPlugin = [];
if (typeof plugin === "function") {
for (let ruleSet of [].concat(plugin(modifier, {
isOnlyPlugin
}))){
let [rules, options] = parseRules(ruleSet, context.postCssNodeCache);
for (let rule of rules){
matchesPerPlugin.push([
{
...sort,
options: {
...sort.options,
...options
}
},
rule
]);
}
}
} else if (modifier === "DEFAULT" || modifier === "-DEFAULT") {
let ruleSet = plugin;
let [rules, options] = parseRules(ruleSet, context.postCssNodeCache);
for (let rule of rules){
matchesPerPlugin.push([
{
...sort,
options: {
...sort.options,
...options
}
},
rule
]);
}
}
if (matchesPerPlugin.length > 0) {
var ref;
typesByMatches.set(matchesPerPlugin, (ref = sort.options) === null || ref === void 0 ? void 0 : ref.type);
matches.push(matchesPerPlugin);
}
}
if (isArbitraryValue(modifier)) {
// When generated arbitrary values are ambiguous, we can't know
// which to pick so don't generate any utilities for them
if (matches.length > 1) {
var ref1;
let typesPerPlugin = matches.map((match)=>new Set([
...(ref1 = typesByMatches.get(match)) !== null && ref1 !== void 0 ? ref1 : []
])
);
// Remove duplicates, so that we can detect proper unique types for each plugin.
for (let pluginTypes of typesPerPlugin){
for (let type of pluginTypes){
let removeFromOwnGroup = false;
for (let otherGroup of typesPerPlugin){
if (pluginTypes === otherGroup) continue;
if (otherGroup.has(type)) {
otherGroup.delete(type);
removeFromOwnGroup = true;
}
}
if (removeFromOwnGroup) pluginTypes.delete(type);
}
}
let messages = [];
for (let [idx, group] of typesPerPlugin.entries()){
for (let type of group){
let rules = matches[idx].map(([, rule])=>rule
).flat().map((rule)=>rule.toString().split("\n").slice(1, -1) // Remove selector and closing '}'
.map((line)=>line.trim()
).map((x)=>` ${x}`
) // Re-indent
.join("\n")
).join("\n\n");
messages.push(` Use \`${candidate.replace("[", `[${type}:`)}\` for \`${rules.trim()}\``);
break;
}
}
_log.default.warn([
`The class \`${candidate}\` is ambiguous and matches multiple utilities.`,
...messages,
`If this is content and not a class, replace it with \`${candidate.replace("[", "&lsqb;").replace("]", "&rsqb;")}\` to silence this warning.`,
]);
continue;
}
matches = matches.map((list)=>list.filter((match)=>isParsableNode(match[1])
)
);
}
matches = matches.flat();
matches = Array.from(recordCandidates(matches, classCandidate));
matches = applyPrefix(matches, context);
if (important) {
matches = applyImportant(matches, classCandidate);
}
for (let variant of variants){
matches = applyVariant(variant, matches, context);
}
for (let match1 of matches){
match1[1].raws.tailwind = {
...match1[1].raws.tailwind,
candidate
};
// Apply final format selector
if (match1[0].collectedFormats) {
let finalFormat = (0, _formatVariantSelector).formatVariantSelector("&", ...match1[0].collectedFormats);
let container = _postcss.default.root({
nodes: [
match1[1].clone()
]
});
container.walkRules((rule)=>{
if (inKeyframes(rule)) return;
rule.selector = (0, _formatVariantSelector).finalizeSelector(finalFormat, {
selector: rule.selector,
candidate,
context
});
});
match1[1] = container.nodes[0];
}
yield match1;
}
}
}
exports.resolveMatches = resolveMatches;
function inKeyframes(rule) {
return rule.parent && rule.parent.type === "atrule" && rule.parent.name === "keyframes";
}
function generateRules(candidates, context) {
let allRules = [];
for (let candidate of candidates){
if (context.notClassCache.has(candidate)) {
continue;
}
if (context.classCache.has(candidate)) {
allRules.push(context.classCache.get(candidate));
continue;
}
let matches = Array.from(resolveMatches(candidate, context));
if (matches.length === 0) {
context.notClassCache.add(candidate);
continue;
}
context.classCache.set(candidate, matches);
allRules.push(matches);
}
// Strategy based on `tailwindConfig.important`
let strategy = ((important)=>{
if (important === true) {
return (rule)=>{
rule.walkDecls((d)=>{
if (d.parent.type === "rule" && !inKeyframes(d.parent)) {
d.important = true;
}
});
};
}
if (typeof important === "string") {
return (rule)=>{
rule.selectors = rule.selectors.map((selector)=>{
return `${important} ${selector}`;
});
};
}
})(context.tailwindConfig.important);
return allRules.flat(1).map(([{ sort , layer , options }, rule])=>{
if (options.respectImportant) {
if (strategy) {
let container = _postcss.default.root({
nodes: [
rule.clone()
]
});
container.walkRules((r)=>{
if (inKeyframes(r)) {
return;
}
strategy(r);
});
rule = container.nodes[0];
}
}
return [
sort | context.layerOrder[layer],
rule
];
});
}
exports.generateRules = generateRules;
function isArbitraryValue(input) {
return input.startsWith("[") && input.endsWith("]");
}
-48
lib/lib/getModuleDependencies.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = getModuleDependencies;
var _fs = _interopRequireDefault(require("fs"));
var _path = _interopRequireDefault(require("path"));
var _resolve = _interopRequireDefault(require("resolve"));
var _detective = _interopRequireDefault(require("detective"));
function getModuleDependencies(entryFile) {
const rootModule = createModule(entryFile);
const modules = [
rootModule
];
// Iterate over the modules, even when new
// ones are being added
for (const mdl of modules){
mdl.requires.filter((dep)=>{
// Only track local modules, not node_modules
return dep.startsWith("./") || dep.startsWith("../");
}).forEach((dep)=>{
try {
const basedir = _path.default.dirname(mdl.file);
const depPath = _resolve.default.sync(dep, {
basedir
});
const depModule = createModule(depPath);
modules.push(depModule);
} catch (_err) {
// eslint-disable-next-line no-empty
}
});
}
return modules;
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
function createModule(file) {
const source = _fs.default.readFileSync(file, "utf-8");
const requires = (0, _detective).default(source);
return {
file,
requires
};
}
-84
lib/lib/normalizeTailwindDirectives.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = normalizeTailwindDirectives;
var _log = _interopRequireDefault(require("../util/log"));
function normalizeTailwindDirectives(root) {
let tailwindDirectives = new Set();
let layerDirectives = new Set();
let applyDirectives = new Set();
root.walkAtRules((atRule)=>{
if (atRule.name === "apply") {
applyDirectives.add(atRule);
}
if (atRule.name === "import") {
if (atRule.params === '"tailwindcss/base"' || atRule.params === "'tailwindcss/base'") {
atRule.name = "tailwind";
atRule.params = "base";
} else if (atRule.params === '"tailwindcss/components"' || atRule.params === "'tailwindcss/components'") {
atRule.name = "tailwind";
atRule.params = "components";
} else if (atRule.params === '"tailwindcss/utilities"' || atRule.params === "'tailwindcss/utilities'") {
atRule.name = "tailwind";
atRule.params = "utilities";
} else if (atRule.params === '"tailwindcss/screens"' || atRule.params === "'tailwindcss/screens'" || atRule.params === '"tailwindcss/variants"' || atRule.params === "'tailwindcss/variants'") {
atRule.name = "tailwind";
atRule.params = "variants";
}
}
if (atRule.name === "tailwind") {
if (atRule.params === "screens") {
atRule.params = "variants";
}
tailwindDirectives.add(atRule.params);
}
if ([
"layer",
"responsive",
"variants"
].includes(atRule.name)) {
if ([
"responsive",
"variants"
].includes(atRule.name)) {
_log.default.warn(`${atRule.name}-at-rule-deprecated`, [
`The \`@${atRule.name}\` directive has been deprecated in Tailwind CSS v3.0.`,
`Use \`@layer utilities\` or \`@layer components\` instead.`,
"https://tailwindcss.com/docs/upgrade-guide#replace-variants-with-layer",
]);
}
layerDirectives.add(atRule);
}
});
if (!tailwindDirectives.has("base") || !tailwindDirectives.has("components") || !tailwindDirectives.has("utilities")) {
for (let rule of layerDirectives){
if (rule.name === "layer" && [
"base",
"components",
"utilities"
].includes(rule.params)) {
if (!tailwindDirectives.has(rule.params)) {
throw rule.error(`\`@layer ${rule.params}\` is used but no matching \`@tailwind ${rule.params}\` directive is present.`);
}
} else if (rule.name === "responsive") {
if (!tailwindDirectives.has("utilities")) {
throw rule.error("`@responsive` is used but `@tailwind utilities` is missing.");
}
} else if (rule.name === "variants") {
if (!tailwindDirectives.has("utilities")) {
throw rule.error("`@variants` is used but `@tailwind utilities` is missing.");
}
}
}
}
return {
tailwindDirectives,
applyDirectives
};
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
-53
lib/lib/partitionApplyAtRules.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = expandApplyAtRules;
function expandApplyAtRules() {
return (root)=>{
partitionRules(root);
};
}
function partitionRules(root) {
if (!root.walkAtRules) return;
let applyParents = new Set();
root.walkAtRules("apply", (rule)=>{
applyParents.add(rule.parent);
});
if (applyParents.size === 0) {
return;
}
for (let rule1 of applyParents){
let nodeGroups = [];
let lastGroup = [];
for (let node of rule1.nodes){
if (node.type === "atrule" && node.name === "apply") {
if (lastGroup.length > 0) {
nodeGroups.push(lastGroup);
lastGroup = [];
}
nodeGroups.push([
node
]);
} else {
lastGroup.push(node);
}
}
if (lastGroup.length > 0) {
nodeGroups.push(lastGroup);
}
if (nodeGroups.length === 1) {
continue;
}
for (let group of [
...nodeGroups
].reverse()){
let clone = rule1.clone({
nodes: []
});
clone.append(group);
rule1.after(clone);
}
rule1.remove();
}
}
-143
lib/lib/resolveDefaultsAtRules.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = resolveDefaultsAtRules;
exports.elementSelectorParser = void 0;
var _postcss = _interopRequireDefault(require("postcss"));
var _postcssSelectorParser = _interopRequireDefault(require("postcss-selector-parser"));
var _featureFlags = require("../featureFlags");
function resolveDefaultsAtRules({ tailwindConfig }) {
return (root)=>{
let variableNodeMap = new Map();
/** @type {Set<import('postcss').AtRule>} */ let universals = new Set();
root.walkAtRules("defaults", (rule)=>{
if (rule.nodes && rule.nodes.length > 0) {
universals.add(rule);
return;
}
let variable = rule.params;
if (!variableNodeMap.has(variable)) {
variableNodeMap.set(variable, new Set());
}
variableNodeMap.get(variable).add(rule.parent);
rule.remove();
});
for (let universal of universals){
/** @type {Map<string, Set<string>>} */ let selectorGroups = new Map();
var ref;
let rules = (ref = variableNodeMap.get(universal.params)) !== null && ref !== void 0 ? ref : [];
for (let rule of rules){
for (let selector of extractElementSelector(rule.selector)){
// If selector contains a vendor prefix after a pseudo element or class,
// we consider them separately because merging the declarations into
// a single rule will cause browsers that do not understand the
// vendor prefix to throw out the whole rule
let selectorGroupName = selector.includes(":-") || selector.includes("::-") ? selector : "__DEFAULT__";
var ref1;
let selectors = (ref1 = selectorGroups.get(selectorGroupName)) !== null && ref1 !== void 0 ? ref1 : new Set();
selectorGroups.set(selectorGroupName, selectors);
selectors.add(selector);
}
}
if ((0, _featureFlags).flagEnabled(tailwindConfig, "optimizeUniversalDefaults")) {
if (selectorGroups.size === 0) {
universal.remove();
continue;
}
for (let [, selectors] of selectorGroups){
let universalRule = _postcss.default.rule({
source: universal.source
});
universalRule.selectors = [
...selectors
];
universalRule.append(universal.nodes.map((node)=>node.clone()
));
universal.before(universalRule);
}
} else {
let universalRule = _postcss.default.rule({
source: universal.source
});
universalRule.selectors = [
"*",
"::before",
"::after"
];
universalRule.append(universal.nodes);
universal.before(universalRule);
}
universal.remove();
}
};
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
let getNode = {
id (node) {
return _postcssSelectorParser.default.attribute({
attribute: "id",
operator: "=",
value: node.value,
quoteMark: '"'
});
}
};
function minimumImpactSelector(nodes) {
let rest = nodes.filter((node)=>{
// Keep non-pseudo nodes
if (node.type !== "pseudo") return true;
// Keep pseudo nodes that have subnodes
// E.g.: `:not()` contains subnodes inside the parentheses
if (node.nodes.length > 0) return true;
// Keep pseudo `elements`
// This implicitly means that we ignore pseudo `classes`
return node.value.startsWith("::") || [
":before",
":after",
":first-line",
":first-letter"
].includes(node.value);
}).reverse();
let searchFor = new Set([
"tag",
"class",
"id",
"attribute"
]);
let splitPointIdx = rest.findIndex((n)=>searchFor.has(n.type)
);
if (splitPointIdx === -1) return rest.reverse().join("").trim();
let node1 = rest[splitPointIdx];
let bestNode = getNode[node1.type] ? getNode[node1.type](node1) : node1;
rest = rest.slice(0, splitPointIdx);
let combinatorIdx = rest.findIndex((n)=>n.type === "combinator" && n.value === ">"
);
if (combinatorIdx !== -1) {
rest.splice(0, combinatorIdx);
rest.unshift(_postcssSelectorParser.default.universal());
}
return [
bestNode,
...rest.reverse()
].join("").trim();
}
let elementSelectorParser = (0, _postcssSelectorParser).default((selectors)=>{
return selectors.map((s)=>{
let nodes = s.split((n)=>n.type === "combinator" && n.value === " "
).pop();
return minimumImpactSelector(nodes);
});
});
exports.elementSelectorParser = elementSelectorParser;
let cache = new Map();
function extractElementSelector(selector) {
if (!cache.has(selector)) {
cache.set(selector, elementSelectorParser.transformSync(selector));
}
return cache.get(selector);
}
-873
lib/lib/setupContextUtils.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.getFileModifiedMap = getFileModifiedMap;
exports.createContext = createContext;
exports.getContext = getContext;
var _fs = _interopRequireDefault(require("fs"));
var _url = _interopRequireDefault(require("url"));
var _postcss = _interopRequireDefault(require("postcss"));
var _dlv = _interopRequireDefault(require("dlv"));
var _postcssSelectorParser = _interopRequireDefault(require("postcss-selector-parser"));
var _transformThemeValue = _interopRequireDefault(require("../util/transformThemeValue"));
var _parseObjectStyles = _interopRequireDefault(require("../util/parseObjectStyles"));
var _prefixSelector = _interopRequireDefault(require("../util/prefixSelector"));
var _isPlainObject = _interopRequireDefault(require("../util/isPlainObject"));
var _escapeClassName = _interopRequireDefault(require("../util/escapeClassName"));
var _nameClass = _interopRequireWildcard(require("../util/nameClass"));
var _pluginUtils = require("../util/pluginUtils");
var _bigSign = _interopRequireDefault(require("../util/bigSign"));
var _corePlugins = require("../corePlugins");
var sharedState = _interopRequireWildcard(require("./sharedState"));
var _toPath = require("../util/toPath");
var _log = _interopRequireDefault(require("../util/log"));
var _negateValue = _interopRequireDefault(require("../util/negateValue"));
var _isValidArbitraryValue = _interopRequireDefault(require("../util/isValidArbitraryValue"));
var _generateRules = require("./generateRules");
var _cacheInvalidationJs = require("./cacheInvalidation.js");
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
function _interopRequireWildcard(obj) {
if (obj && obj.__esModule) {
return obj;
} else {
var newObj = {};
if (obj != null) {
for(var key in obj){
if (Object.prototype.hasOwnProperty.call(obj, key)) {
var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {};
if (desc.get || desc.set) {
Object.defineProperty(newObj, key, desc);
} else {
newObj[key] = obj[key];
}
}
}
}
newObj.default = obj;
return newObj;
}
}
function prefix(context, selector) {
let prefix1 = context.tailwindConfig.prefix;
return typeof prefix1 === "function" ? prefix1(selector) : prefix1 + selector;
}
function parseVariantFormatString(input) {
if (input.includes("{")) {
if (!isBalanced(input)) throw new Error(`Your { and } are unbalanced.`);
return input.split(/{(.*)}/gim).flatMap((line)=>parseVariantFormatString(line)
).filter(Boolean);
}
return [
input.trim()
];
}
function isBalanced(input) {
let count = 0;
for (let char of input){
if (char === "{") {
count++;
} else if (char === "}") {
if (--count < 0) {
return false // unbalanced
;
}
}
}
return count === 0;
}
function insertInto(list, value, { before =[] } = {}) {
before = [].concat(before);
if (before.length <= 0) {
list.push(value);
return;
}
let idx = list.length - 1;
for (let other of before){
let iidx = list.indexOf(other);
if (iidx === -1) continue;
idx = Math.min(idx, iidx);
}
list.splice(idx, 0, value);
}
function parseStyles(styles) {
if (!Array.isArray(styles)) {
return parseStyles([
styles
]);
}
return styles.flatMap((style)=>{
let isNode = !Array.isArray(style) && !(0, _isPlainObject).default(style);
return isNode ? style : (0, _parseObjectStyles).default(style);
});
}
function getClasses(selector, mutate) {
let parser = (0, _postcssSelectorParser).default((selectors)=>{
let allClasses = [];
if (mutate) {
mutate(selectors);
}
selectors.walkClasses((classNode)=>{
allClasses.push(classNode.value);
});
return allClasses;
});
return parser.transformSync(selector);
}
function extractCandidates(node, state = {
containsNonOnDemandable: false
}, depth = 0) {
let classes = [];
// Handle normal rules
if (node.type === "rule") {
// Ignore everything inside a :not(...). This allows you to write code like
// `div:not(.foo)`. If `.foo` is never found in your code, then we used to
// not generated it. But now we will ignore everything inside a `:not`, so
// that it still gets generated.
function ignoreNot(selectors) {
selectors.walkPseudos((pseudo)=>{
if (pseudo.value === ":not") {
pseudo.remove();
}
});
}
for (let selector of node.selectors){
let classCandidates = getClasses(selector, ignoreNot);
// At least one of the selectors contains non-"on-demandable" candidates.
if (classCandidates.length === 0) {
state.containsNonOnDemandable = true;
}
for (let classCandidate of classCandidates){
classes.push(classCandidate);
}
}
} else if (node.type === "atrule") {
node.walkRules((rule)=>{
for (let classCandidate of rule.selectors.flatMap((selector)=>getClasses(selector)
)){
classes.push(classCandidate);
}
});
}
if (depth === 0) {
return [
state.containsNonOnDemandable || classes.length === 0,
classes
];
}
return classes;
}
function withIdentifiers(styles) {
return parseStyles(styles).flatMap((node)=>{
let nodeMap = new Map();
let [containsNonOnDemandableSelectors, candidates] = extractCandidates(node);
// If this isn't "on-demandable", assign it a universal candidate to always include it.
if (containsNonOnDemandableSelectors) {
candidates.unshift(sharedState.NOT_ON_DEMAND);
}
// However, it could be that it also contains "on-demandable" candidates.
// E.g.: `span, .foo {}`, in that case it should still be possible to use
// `@apply foo` for example.
return candidates.map((c)=>{
if (!nodeMap.has(node)) {
nodeMap.set(node, node);
}
return [
c,
nodeMap.get(node)
];
});
});
}
function buildPluginApi(tailwindConfig, context, { variantList , variantMap , offsets , classList }) {
function getConfigValue(path, defaultValue) {
return path ? (0, _dlv).default(tailwindConfig, path, defaultValue) : tailwindConfig;
}
function applyConfiguredPrefix(selector) {
return (0, _prefixSelector).default(tailwindConfig.prefix, selector);
}
function prefixIdentifier(identifier, options) {
if (identifier === sharedState.NOT_ON_DEMAND) {
return sharedState.NOT_ON_DEMAND;
}
if (!options.respectPrefix) {
return identifier;
}
return context.tailwindConfig.prefix + identifier;
}
return {
addVariant (variantName, variantFunctions, options = {}) {
variantFunctions = [].concat(variantFunctions).map((variantFunction)=>{
if (typeof variantFunction !== "string") {
// Safelist public API functions
return ({ modifySelectors , container , separator })=>{
return variantFunction({
modifySelectors,
container,
separator
});
};
}
variantFunction = variantFunction.replace(/\n+/g, "").replace(/\s{1,}/g, " ").trim();
let fns = parseVariantFormatString(variantFunction).map((str)=>{
if (!str.startsWith("@")) {
return ({ format })=>format(str)
;
}
let [, name, params] = /@(.*?) (.*)/g.exec(str);
return ({ wrap })=>wrap(_postcss.default.atRule({
name,
params
}))
;
}).reverse();
return (api)=>{
for (let fn of fns){
fn(api);
}
};
});
insertInto(variantList, variantName, options);
variantMap.set(variantName, variantFunctions);
},
postcss: _postcss.default,
prefix: applyConfiguredPrefix,
e: _escapeClassName.default,
config: getConfigValue,
theme (path, defaultValue) {
const [pathRoot, ...subPaths] = (0, _toPath).toPath(path);
const value = getConfigValue([
"theme",
pathRoot,
...subPaths
], defaultValue);
return (0, _transformThemeValue).default(pathRoot)(value);
},
corePlugins: (path)=>{
if (Array.isArray(tailwindConfig.corePlugins)) {
return tailwindConfig.corePlugins.includes(path);
}
return getConfigValue([
"corePlugins",
path
], true);
},
variants: ()=>{
// Preserved for backwards compatibility but not used in v3.0+
return [];
},
addBase (base) {
for (let [identifier, rule] of withIdentifiers(base)){
let prefixedIdentifier = prefixIdentifier(identifier, {});
let offset = offsets.base++;
if (!context.candidateRuleMap.has(prefixedIdentifier)) {
context.candidateRuleMap.set(prefixedIdentifier, []);
}
context.candidateRuleMap.get(prefixedIdentifier).push([
{
sort: offset,
layer: "base"
},
rule
]);
}
},
/**
* @param {string} group
* @param {Record<string, string | string[]>} declarations
*/ addDefaults (group, declarations) {
const groups = {
[`@defaults ${group}`]: declarations
};
for (let [identifier, rule] of withIdentifiers(groups)){
let prefixedIdentifier = prefixIdentifier(identifier, {});
if (!context.candidateRuleMap.has(prefixedIdentifier)) {
context.candidateRuleMap.set(prefixedIdentifier, []);
}
context.candidateRuleMap.get(prefixedIdentifier).push([
{
sort: offsets.base++,
layer: "defaults"
},
rule
]);
}
},
addComponents (components, options) {
let defaultOptions = {
respectPrefix: true,
respectImportant: false
};
options = Object.assign({}, defaultOptions, Array.isArray(options) ? {} : options);
for (let [identifier, rule] of withIdentifiers(components)){
let prefixedIdentifier = prefixIdentifier(identifier, options);
classList.add(prefixedIdentifier);
if (!context.candidateRuleMap.has(prefixedIdentifier)) {
context.candidateRuleMap.set(prefixedIdentifier, []);
}
context.candidateRuleMap.get(prefixedIdentifier).push([
{
sort: offsets.components++,
layer: "components",
options
},
rule
]);
}
},
addUtilities (utilities, options) {
let defaultOptions = {
respectPrefix: true,
respectImportant: true
};
options = Object.assign({}, defaultOptions, Array.isArray(options) ? {} : options);
for (let [identifier, rule] of withIdentifiers(utilities)){
let prefixedIdentifier = prefixIdentifier(identifier, options);
classList.add(prefixedIdentifier);
if (!context.candidateRuleMap.has(prefixedIdentifier)) {
context.candidateRuleMap.set(prefixedIdentifier, []);
}
context.candidateRuleMap.get(prefixedIdentifier).push([
{
sort: offsets.utilities++,
layer: "utilities",
options
},
rule
]);
}
},
matchUtilities: function(utilities, options) {
let defaultOptions = {
respectPrefix: true,
respectImportant: true
};
options = {
...defaultOptions,
...options
};
let offset = offsets.utilities++;
for(let identifier in utilities){
let prefixedIdentifier = prefixIdentifier(identifier, options);
let rule = utilities[identifier];
classList.add([
prefixedIdentifier,
options
]);
function wrapped(modifier, { isOnlyPlugin }) {
let { type ="any" } = options;
type = [].concat(type);
let [value, coercedType] = (0, _pluginUtils).coerceValue(type, modifier, options, tailwindConfig);
if (value === undefined) {
return [];
}
if (!type.includes(coercedType) && !isOnlyPlugin) {
return [];
}
if (!(0, _isValidArbitraryValue).default(value)) {
return [];
}
let ruleSets = [].concat(rule(value)).filter(Boolean).map((declaration)=>({
[(0, _nameClass).default(identifier, modifier)]: declaration
})
);
return ruleSets;
}
let withOffsets = [
{
sort: offset,
layer: "utilities",
options
},
wrapped
];
if (!context.candidateRuleMap.has(prefixedIdentifier)) {
context.candidateRuleMap.set(prefixedIdentifier, []);
}
context.candidateRuleMap.get(prefixedIdentifier).push(withOffsets);
}
},
matchComponents: function(components, options) {
let defaultOptions = {
respectPrefix: true,
respectImportant: false
};
options = {
...defaultOptions,
...options
};
let offset = offsets.components++;
for(let identifier in components){
let prefixedIdentifier = prefixIdentifier(identifier, options);
let rule = components[identifier];
classList.add([
prefixedIdentifier,
options
]);
function wrapped(modifier, { isOnlyPlugin }) {
let { type ="any" } = options;
type = [].concat(type);
let [value, coercedType] = (0, _pluginUtils).coerceValue(type, modifier, options, tailwindConfig);
if (value === undefined) {
return [];
}
if (!type.includes(coercedType)) {
if (isOnlyPlugin) {
_log.default.warn([
`Unnecessary typehint \`${coercedType}\` in \`${identifier}-${modifier}\`.`,
`You can safely update it to \`${identifier}-${modifier.replace(coercedType + ":", "")}\`.`,
]);
} else {
return [];
}
}
if (!(0, _isValidArbitraryValue).default(value)) {
return [];
}
let ruleSets = [].concat(rule(value)).filter(Boolean).map((declaration)=>({
[(0, _nameClass).default(identifier, modifier)]: declaration
})
);
return ruleSets;
}
let withOffsets = [
{
sort: offset,
layer: "components",
options
},
wrapped
];
if (!context.candidateRuleMap.has(prefixedIdentifier)) {
context.candidateRuleMap.set(prefixedIdentifier, []);
}
context.candidateRuleMap.get(prefixedIdentifier).push(withOffsets);
}
}
};
}
let fileModifiedMapCache = new WeakMap();
function getFileModifiedMap(context) {
if (!fileModifiedMapCache.has(context)) {
fileModifiedMapCache.set(context, new Map());
}
return fileModifiedMapCache.get(context);
}
function trackModified(files, fileModifiedMap) {
let changed = false;
for (let file of files){
var ref;
if (!file) continue;
let parsed = _url.default.parse(file);
let pathname = parsed.hash ? parsed.href.replace(parsed.hash, "") : parsed.href;
pathname = parsed.search ? pathname.replace(parsed.search, "") : pathname;
let newModified = (ref = _fs.default.statSync(decodeURIComponent(pathname), {
throwIfNoEntry: false
})) === null || ref === void 0 ? void 0 : ref.mtimeMs;
if (!newModified) {
continue;
}
if (!fileModifiedMap.has(file) || newModified > fileModifiedMap.get(file)) {
changed = true;
}
fileModifiedMap.set(file, newModified);
}
return changed;
}
function extractVariantAtRules(node) {
node.walkAtRules((atRule)=>{
if ([
"responsive",
"variants"
].includes(atRule.name)) {
extractVariantAtRules(atRule);
atRule.before(atRule.nodes);
atRule.remove();
}
});
}
function collectLayerPlugins(root) {
let layerPlugins = [];
root.each((node)=>{
if (node.type === "atrule" && [
"responsive",
"variants"
].includes(node.name)) {
node.name = "layer";
node.params = "utilities";
}
});
// Walk @layer rules and treat them like plugins
root.walkAtRules("layer", (layerRule)=>{
extractVariantAtRules(layerRule);
if (layerRule.params === "base") {
for (let node of layerRule.nodes){
layerPlugins.push(function({ addBase }) {
addBase(node, {
respectPrefix: false
});
});
}
layerRule.remove();
} else if (layerRule.params === "components") {
for (let node of layerRule.nodes){
layerPlugins.push(function({ addComponents }) {
addComponents(node, {
respectPrefix: false
});
});
}
layerRule.remove();
} else if (layerRule.params === "utilities") {
for (let node of layerRule.nodes){
layerPlugins.push(function({ addUtilities }) {
addUtilities(node, {
respectPrefix: false
});
});
}
layerRule.remove();
}
});
return layerPlugins;
}
function resolvePlugins(context, root) {
let corePluginList = Object.entries({
..._corePlugins.variantPlugins,
..._corePlugins.corePlugins
}).map(([name, plugin])=>{
if (!context.tailwindConfig.corePlugins.includes(name)) {
return null;
}
return plugin;
}).filter(Boolean);
let userPlugins = context.tailwindConfig.plugins.map((plugin)=>{
if (plugin.__isOptionsFunction) {
plugin = plugin();
}
return typeof plugin === "function" ? plugin : plugin.handler;
});
let layerPlugins = collectLayerPlugins(root);
// TODO: This is a workaround for backwards compatibility, since custom variants
// were historically sorted before screen/stackable variants.
let beforeVariants = [
_corePlugins.variantPlugins["pseudoElementVariants"],
_corePlugins.variantPlugins["pseudoClassVariants"],
];
let afterVariants = [
_corePlugins.variantPlugins["directionVariants"],
_corePlugins.variantPlugins["reducedMotionVariants"],
_corePlugins.variantPlugins["darkVariants"],
_corePlugins.variantPlugins["printVariant"],
_corePlugins.variantPlugins["screenVariants"],
_corePlugins.variantPlugins["orientationVariants"],
];
return [
...corePluginList,
...beforeVariants,
...userPlugins,
...afterVariants,
...layerPlugins
];
}
function registerPlugins(plugins, context) {
let variantList = [];
let variantMap = new Map();
let offsets = {
defaults: 0n,
base: 0n,
components: 0n,
utilities: 0n,
user: 0n
};
let classList = new Set();
let pluginApi = buildPluginApi(context.tailwindConfig, context, {
variantList,
variantMap,
offsets,
classList
});
for (let plugin of plugins){
if (Array.isArray(plugin)) {
for (let pluginItem of plugin){
pluginItem(pluginApi);
}
} else {
plugin === null || plugin === void 0 ? void 0 : plugin(pluginApi);
}
}
let highestOffset = ((args)=>args.reduce((m, e)=>e > m ? e : m
)
)([
offsets.base,
offsets.defaults,
offsets.components,
offsets.utilities,
offsets.user,
]);
let reservedBits = BigInt(highestOffset.toString(2).length);
// A number one less than the top range of the highest offset area
// so arbitrary properties are always sorted at the end.
context.arbitraryPropertiesSort = (1n << reservedBits << 0n) - 1n;
context.layerOrder = {
defaults: 1n << reservedBits << 0n,
base: 1n << reservedBits << 1n,
components: 1n << reservedBits << 2n,
utilities: 1n << reservedBits << 3n,
user: 1n << reservedBits << 4n
};
reservedBits += 5n;
let offset = 0;
context.variantOrder = new Map(variantList.map((variant, i)=>{
let variantFunctions = variantMap.get(variant).length;
let bits = 1n << BigInt(i + offset) << reservedBits;
offset += variantFunctions - 1;
return [
variant,
bits
];
}).sort(([, a], [, z])=>(0, _bigSign).default(a - z)
));
context.minimumScreen = [
...context.variantOrder.values()
].shift();
// Build variantMap
for (let [variantName, variantFunctions1] of variantMap.entries()){
let sort = context.variantOrder.get(variantName);
context.variantMap.set(variantName, variantFunctions1.map((variantFunction, idx)=>[
sort << BigInt(idx),
variantFunction
]
));
}
var _safelist;
let safelist = ((_safelist = context.tailwindConfig.safelist) !== null && _safelist !== void 0 ? _safelist : []).filter(Boolean);
if (safelist.length > 0) {
let checks = [];
for (let value1 of safelist){
if (typeof value1 === "string") {
context.changedContent.push({
content: value1,
extension: "html"
});
continue;
}
if (value1 instanceof RegExp) {
_log.default.warn("root-regex", [
"Regular expressions in `safelist` work differently in Tailwind CSS v3.0.",
"Update your `safelist` configuration to eliminate this warning.",
"https://tailwindcss.com/docs/content-configuration#safelisting-classes",
]);
continue;
}
checks.push(value1);
}
if (checks.length > 0) {
let patternMatchingCount = new Map();
let prefixLength = context.tailwindConfig.prefix.length;
for (let util of classList){
let utils = Array.isArray(util) ? (()=>{
let [utilName, options] = util;
var ref;
let values = Object.keys((ref = options === null || options === void 0 ? void 0 : options.values) !== null && ref !== void 0 ? ref : {});
let classes = values.map((value)=>(0, _nameClass).formatClass(utilName, value)
);
if (options === null || options === void 0 ? void 0 : options.supportsNegativeValues) {
// This is the normal negated version
// e.g. `-inset-1` or `-tw-inset-1`
classes = [
...classes,
...classes.map((cls)=>"-" + cls
)
];
// This is the negated version *after* the prefix
// e.g. `tw--inset-1`
// The prefix is already attached to util name
// So we add the negative after the prefix
classes = [
...classes,
...classes.map((cls)=>cls.slice(0, prefixLength) + "-" + cls.slice(prefixLength)
),
];
}
return classes;
})() : [
util
];
for (let util1 of utils){
for (let { pattern , variants =[] } of checks){
// RegExp with the /g flag are stateful, so let's reset the last
// index pointer to reset the state.
pattern.lastIndex = 0;
if (!patternMatchingCount.has(pattern)) {
patternMatchingCount.set(pattern, 0);
}
if (!pattern.test(util1)) continue;
patternMatchingCount.set(pattern, patternMatchingCount.get(pattern) + 1);
context.changedContent.push({
content: util1,
extension: "html"
});
for (let variant of variants){
context.changedContent.push({
content: variant + context.tailwindConfig.separator + util1,
extension: "html"
});
}
}
}
}
for (let [regex, count] of patternMatchingCount.entries()){
if (count !== 0) continue;
_log.default.warn([
`The safelist pattern \`${regex}\` doesn't match any Tailwind CSS classes.`,
"Fix this pattern or remove it from your `safelist` configuration.",
"https://tailwindcss.com/docs/content-configuration#safelisting-classes",
]);
}
}
}
// A list of utilities that are used by certain Tailwind CSS utilities but
// that don't exist on their own. This will result in them "not existing" and
// sorting could be weird since you still require them in order to make the
// host utitlies work properly. (Thanks Biology)
let parasiteUtilities = new Set([
prefix(context, "group"),
prefix(context, "peer")
]);
context.getClassOrder = function getClassOrder(classes) {
let sortedClassNames = new Map();
for (let [sort, rule] of (0, _generateRules).generateRules(new Set(classes), context)){
if (sortedClassNames.has(rule.raws.tailwind.candidate)) continue;
sortedClassNames.set(rule.raws.tailwind.candidate, sort);
}
return classes.map((className)=>{
var ref;
let order = (ref = sortedClassNames.get(className)) !== null && ref !== void 0 ? ref : null;
if (order === null && parasiteUtilities.has(className)) {
// This will make sure that it is at the very beginning of the
// `components` layer which technically means 'before any
// components'.
order = context.layerOrder.components;
}
return [
className,
order
];
});
};
// Generate a list of strings for autocompletion purposes, e.g.
// ['uppercase', 'lowercase', ...]
context.getClassList = function getClassList() {
let output = [];
for (let util of classList){
if (Array.isArray(util)) {
let [utilName, options] = util;
let negativeClasses = [];
var ref;
for (let [key, value] of Object.entries((ref = options === null || options === void 0 ? void 0 : options.values) !== null && ref !== void 0 ? ref : {})){
output.push((0, _nameClass).formatClass(utilName, key));
if ((options === null || options === void 0 ? void 0 : options.supportsNegativeValues) && (0, _negateValue).default(value)) {
negativeClasses.push((0, _nameClass).formatClass(utilName, `-${key}`));
}
}
output.push(...negativeClasses);
} else {
output.push(util);
}
}
return output;
};
}
function createContext(tailwindConfig, changedContent = [], root = _postcss.default.root()) {
let context = {
disposables: [],
ruleCache: new Set(),
classCache: new Map(),
applyClassCache: new Map(),
notClassCache: new Set(),
postCssNodeCache: new Map(),
candidateRuleMap: new Map(),
tailwindConfig,
changedContent: changedContent,
variantMap: new Map(),
stylesheetCache: null
};
let resolvedPlugins = resolvePlugins(context, root);
registerPlugins(resolvedPlugins, context);
return context;
}
let contextMap = sharedState.contextMap;
let configContextMap = sharedState.configContextMap;
let contextSourcesMap = sharedState.contextSourcesMap;
function getContext(root, result, tailwindConfig, userConfigPath, tailwindConfigHash, contextDependencies) {
let sourcePath = result.opts.from;
let isConfigFile = userConfigPath !== null;
sharedState.env.DEBUG && console.log("Source path:", sourcePath);
let existingContext;
if (isConfigFile && contextMap.has(sourcePath)) {
existingContext = contextMap.get(sourcePath);
} else if (configContextMap.has(tailwindConfigHash)) {
let context = configContextMap.get(tailwindConfigHash);
contextSourcesMap.get(context).add(sourcePath);
contextMap.set(sourcePath, context);
existingContext = context;
}
let cssDidChange = (0, _cacheInvalidationJs).hasContentChanged(sourcePath, root);
// If there's already a context in the cache and we don't need to
// reset the context, return the cached context.
if (existingContext) {
let contextDependenciesChanged = trackModified([
...contextDependencies
], getFileModifiedMap(existingContext));
if (!contextDependenciesChanged && !cssDidChange) {
return [
existingContext,
false
];
}
}
// If this source is in the context map, get the old context.
// Remove this source from the context sources for the old context,
// and clean up that context if no one else is using it. This can be
// called by many processes in rapid succession, so we check for presence
// first because the first process to run this code will wipe it out first.
if (contextMap.has(sourcePath)) {
let oldContext = contextMap.get(sourcePath);
if (contextSourcesMap.has(oldContext)) {
contextSourcesMap.get(oldContext).delete(sourcePath);
if (contextSourcesMap.get(oldContext).size === 0) {
contextSourcesMap.delete(oldContext);
for (let [tailwindConfigHash, context] of configContextMap){
if (context === oldContext) {
configContextMap.delete(tailwindConfigHash);
}
}
for (let disposable of oldContext.disposables.splice(0)){
disposable(oldContext);
}
}
}
}
sharedState.env.DEBUG && console.log("Setting up new context...");
let context = createContext(tailwindConfig, [], root);
trackModified([
...contextDependencies
], getFileModifiedMap(context));
// ---
// Update all context tracking state
configContextMap.set(tailwindConfigHash, context);
contextMap.set(sourcePath, context);
if (!contextSourcesMap.has(context)) {
contextSourcesMap.set(context, new Set());
}
contextSourcesMap.get(context).add(sourcePath);
return [
context,
true
];
}
-171
lib/lib/setupTrackingContext.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = setupTrackingContext;
var _fs = _interopRequireDefault(require("fs"));
var _path = _interopRequireDefault(require("path"));
var _fastGlob = _interopRequireDefault(require("fast-glob"));
var _quickLru = _interopRequireDefault(require("quick-lru"));
var _normalizePath = _interopRequireDefault(require("normalize-path"));
var _hashConfig = _interopRequireDefault(require("../util/hashConfig"));
var _getModuleDependencies = _interopRequireDefault(require("../lib/getModuleDependencies"));
var _resolveConfig = _interopRequireDefault(require("../public/resolve-config"));
var _resolveConfigPath = _interopRequireDefault(require("../util/resolveConfigPath"));
var _sharedState = require("./sharedState");
var _setupContextUtils = require("./setupContextUtils");
var _parseDependency = _interopRequireDefault(require("../util/parseDependency"));
function setupTrackingContext(configOrPath) {
return ({ tailwindDirectives , registerDependency })=>{
return (root, result)=>{
let [tailwindConfig, userConfigPath, tailwindConfigHash, configDependencies] = getTailwindConfig(configOrPath);
let contextDependencies = new Set(configDependencies);
// If there are no @tailwind or @apply rules, we don't consider this CSS
// file or its dependencies to be dependencies of the context. Can reuse
// the context even if they change. We may want to think about `@layer`
// being part of this trigger too, but it's tough because it's impossible
// for a layer in one file to end up in the actual @tailwind rule in
// another file since independent sources are effectively isolated.
if (tailwindDirectives.size > 0) {
// Add current css file as a context dependencies.
contextDependencies.add(result.opts.from);
// Add all css @import dependencies as context dependencies.
for (let message of result.messages){
if (message.type === "dependency") {
contextDependencies.add(message.file);
}
}
}
let [context] = (0, _setupContextUtils).getContext(root, result, tailwindConfig, userConfigPath, tailwindConfigHash, contextDependencies);
let candidateFiles = getCandidateFiles(context, tailwindConfig);
// If there are no @tailwind or @apply rules, we don't consider this CSS file or it's
// dependencies to be dependencies of the context. Can reuse the context even if they change.
// We may want to think about `@layer` being part of this trigger too, but it's tough
// because it's impossible for a layer in one file to end up in the actual @tailwind rule
// in another file since independent sources are effectively isolated.
if (tailwindDirectives.size > 0) {
let fileModifiedMap = (0, _setupContextUtils).getFileModifiedMap(context);
// Add template paths as postcss dependencies.
for (let fileOrGlob of candidateFiles){
let dependency = (0, _parseDependency).default(fileOrGlob);
if (dependency) {
registerDependency(dependency);
}
}
for (let changedContent of resolvedChangedContent(context, candidateFiles, fileModifiedMap)){
context.changedContent.push(changedContent);
}
}
for (let file of configDependencies){
registerDependency({
type: "dependency",
file
});
}
return context;
};
};
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
let configPathCache = new _quickLru.default({
maxSize: 100
});
let candidateFilesCache = new WeakMap();
function getCandidateFiles(context, tailwindConfig) {
if (candidateFilesCache.has(context)) {
return candidateFilesCache.get(context);
}
let candidateFiles = tailwindConfig.content.files.filter((item)=>typeof item === "string"
).map((contentPath)=>(0, _normalizePath).default(contentPath)
);
return candidateFilesCache.set(context, candidateFiles).get(context);
}
// Get the config object based on a path
function getTailwindConfig(configOrPath) {
let userConfigPath = (0, _resolveConfigPath).default(configOrPath);
if (userConfigPath !== null) {
let [prevConfig, prevConfigHash, prevDeps, prevModified] = configPathCache.get(userConfigPath) || [];
let newDeps = (0, _getModuleDependencies).default(userConfigPath).map((dep)=>dep.file
);
let modified = false;
let newModified = new Map();
for (let file of newDeps){
let time = _fs.default.statSync(file).mtimeMs;
newModified.set(file, time);
if (!prevModified || !prevModified.has(file) || time > prevModified.get(file)) {
modified = true;
}
}
// It hasn't changed (based on timestamps)
if (!modified) {
return [
prevConfig,
userConfigPath,
prevConfigHash,
prevDeps
];
}
// It has changed (based on timestamps), or first run
for (let file1 of newDeps){
delete require.cache[file1];
}
let newConfig = (0, _resolveConfig).default(require(userConfigPath));
let newHash = (0, _hashConfig).default(newConfig);
configPathCache.set(userConfigPath, [
newConfig,
newHash,
newDeps,
newModified
]);
return [
newConfig,
userConfigPath,
newHash,
newDeps
];
}
// It's a plain object, not a path
let newConfig = (0, _resolveConfig).default(configOrPath.config === undefined ? configOrPath : configOrPath.config);
return [
newConfig,
null,
(0, _hashConfig).default(newConfig),
[]
];
}
function resolvedChangedContent(context, candidateFiles, fileModifiedMap) {
let changedContent = context.tailwindConfig.content.files.filter((item)=>typeof item.raw === "string"
).map(({ raw , extension ="html" })=>({
content: raw,
extension
})
);
for (let changedFile of resolveChangedFiles(candidateFiles, fileModifiedMap)){
let content = _fs.default.readFileSync(changedFile, "utf8");
let extension = _path.default.extname(changedFile).slice(1);
changedContent.push({
content,
extension
});
}
return changedContent;
}
function resolveChangedFiles(candidateFiles, fileModifiedMap) {
let changedFiles = new Set();
_sharedState.env.DEBUG && console.time("Finding changed files");
let files = _fastGlob.default.sync(candidateFiles);
for (let file of files){
let prevModified = fileModifiedMap.has(file) ? fileModifiedMap.get(file) : -Infinity;
let modified = _fs.default.statSync(file).mtimeMs;
if (modified > prevModified) {
changedFiles.add(file);
fileModifiedMap.set(file, modified);
}
}
_sharedState.env.DEBUG && console.timeEnd("Finding changed files");
return changedFiles;
}
-52
lib/lib/sharedState.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.resolveDebug = resolveDebug;
exports.NOT_ON_DEMAND = exports.sourceHashMap = exports.contextSourcesMap = exports.configContextMap = exports.contextMap = exports.env = void 0;
const env = {
NODE_ENV: process.env.NODE_ENV,
DEBUG: resolveDebug(process.env.DEBUG)
};
exports.env = env;
const contextMap = new Map();
exports.contextMap = contextMap;
const configContextMap = new Map();
exports.configContextMap = configContextMap;
const contextSourcesMap = new Map();
exports.contextSourcesMap = contextSourcesMap;
const sourceHashMap = new Map();
exports.sourceHashMap = sourceHashMap;
const NOT_ON_DEMAND = new String("*");
exports.NOT_ON_DEMAND = NOT_ON_DEMAND;
function resolveDebug(debug) {
if (debug === undefined) {
return false;
}
// Environment variables are strings, so convert to boolean
if (debug === "true" || debug === "1") {
return true;
}
if (debug === "false" || debug === "0") {
return false;
}
// Keep the debug convention into account:
// DEBUG=* -> This enables all debug modes
// DEBUG=projectA,projectB,projectC -> This enables debug for projectA, projectB and projectC
// DEBUG=projectA:* -> This enables all debug modes for projectA (if you have sub-types)
// DEBUG=projectA,-projectB -> This enables debug for projectA and explicitly disables it for projectB
if (debug === "*") {
return true;
}
let debuggers = debug.split(",").map((d)=>d.split(":")[0]
);
// Ignoring tailwindcss
if (debuggers.includes("-tailwindcss")) {
return false;
}
// Including tailwindcss
if (debuggers.includes("tailwindcss")) {
return true;
}
return false;
}
-27
lib/lib/substituteScreenAtRules.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = _default;
var _normalizeScreens = require("../util/normalizeScreens");
var _buildMediaQuery = _interopRequireDefault(require("../util/buildMediaQuery"));
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
function _default({ tailwindConfig: { theme } }) {
return function(css) {
css.walkAtRules("screen", (atRule)=>{
let screen = atRule.params;
let screens = (0, _normalizeScreens).normalizeScreens(theme.screens);
let screenDefinition = screens.find(({ name })=>name === screen
);
if (!screenDefinition) {
throw atRule.error(`No \`${screen}\` screen found.`);
}
atRule.name = "media";
atRule.params = (0, _buildMediaQuery).default(screenDefinition);
});
};
}
-17
lib/postcss-plugins/nesting/index.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _plugin = require("./plugin");
var _default = Object.assign(function(opts) {
return {
postcssPlugin: "tailwindcss/nesting",
Once (root, { result }) {
return (0, _plugin).nesting(opts)(root, result);
}
};
}, {
postcss: true
});
exports.default = _default;
-85
lib/postcss-plugins/nesting/plugin.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.nesting = nesting;
var _postcss = _interopRequireDefault(require("postcss"));
var _postcssNested = _interopRequireDefault(require("postcss-nested"));
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
function nesting(opts = _postcssNested.default) {
return (root, result)=>{
root.walkAtRules("screen", (rule)=>{
rule.name = "media";
rule.params = `screen(${rule.params})`;
});
root.walkAtRules("apply", (rule)=>{
rule.before(_postcss.default.decl({
prop: "__apply",
value: rule.params,
source: rule.source
}));
rule.remove();
});
let plugin = (()=>{
var ref;
if (typeof opts === "function" || typeof opts === "object" && (opts === null || opts === void 0 ? void 0 : (ref = opts.hasOwnProperty) === null || ref === void 0 ? void 0 : ref.call(opts, "postcssPlugin"))) {
return opts;
}
if (typeof opts === "string") {
return require(opts);
}
if (Object.keys(opts).length <= 0) {
return _postcssNested.default;
}
throw new Error("tailwindcss/nesting should be loaded with a nesting plugin.");
})();
(0, _postcss).default([
plugin
]).process(root, result.opts).sync();
root.walkDecls("__apply", (decl)=>{
decl.before(_postcss.default.atRule({
name: "apply",
params: decl.value,
source: decl.source
}));
decl.remove();
});
/**
* Use a private PostCSS API to remove the "clean" flag from the entire AST.
* This is done because running process() on the AST will set the "clean"
* flag on all nodes, which we don't want.
*
* This causes downstream plugins using the visitor API to be skipped.
*
* This is guarded because the PostCSS API is not public
* and may change in future versions of PostCSS.
*
* See https://github.com/postcss/postcss/issues/1712 for more details
*
* @param {import('postcss').Node} node
*/ function markDirty(node) {
if (!("markDirty" in node)) {
return;
}
// Traverse the tree down to the leaf nodes
if (node.nodes) {
node.nodes.forEach((n)=>markDirty(n)
);
}
// If it's a leaf node mark it as dirty
// We do this here because marking a node as dirty
// will walk up the tree and mark all parents as dirty
// resulting in a lot of unnecessary work if we did this
// for every single node
if (!node.nodes) {
node.markDirty();
}
}
markDirty(root);
return root;
};
}
-42
lib/postcss-plugins/nesting/README.md
# tailwindcss/nesting
This is a PostCSS plugin that wraps [postcss-nested](https://github.com/postcss/postcss-nested) or [postcss-nesting](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-nesting) and acts as a compatibility layer to make sure your nesting plugin of choice properly understands Tailwind's custom syntax like `@apply` and `@screen`.
Add it to your PostCSS configuration, somewhere before Tailwind itself:
```js
// postcss.config.js
module.exports = {
plugins: [
require('postcss-import'),
require('tailwindcss/nesting'),
require('tailwindcss'),
require('autoprefixer'),
]
}
```
By default, it uses the [postcss-nested](https://github.com/postcss/postcss-nested) plugin under the hood, which uses a Sass-like syntax and is the plugin that powers nesting support in the [Tailwind CSS plugin API](https://tailwindcss.com/docs/plugins#css-in-js-syntax).
If you'd rather use [postcss-nesting](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-nesting) (which is based on the work-in-progress [CSS Nesting](https://drafts.csswg.org/css-nesting-1/) specification), first install the plugin alongside:
```shell
npm install postcss-nesting
```
Then pass the plugin itself as an argument to `tailwindcss/nesting` in your PostCSS configuration:
```js
// postcss.config.js
module.exports = {
plugins: [
require('postcss-import'),
require('tailwindcss/nesting')(require('postcss-nesting')),
require('tailwindcss'),
require('autoprefixer'),
]
}
```
This can also be helpful if for whatever reason you need to use a very specific version of `postcss-nested` and want to override the version we bundle with `tailwindcss/nesting` itself.
-59
lib/processTailwindFeatures.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = processTailwindFeatures;
var _normalizeTailwindDirectives = _interopRequireDefault(require("./lib/normalizeTailwindDirectives"));
var _expandTailwindAtRules = _interopRequireDefault(require("./lib/expandTailwindAtRules"));
var _expandApplyAtRules = _interopRequireDefault(require("./lib/expandApplyAtRules"));
var _evaluateTailwindFunctions = _interopRequireDefault(require("./lib/evaluateTailwindFunctions"));
var _substituteScreenAtRules = _interopRequireDefault(require("./lib/substituteScreenAtRules"));
var _resolveDefaultsAtRules = _interopRequireDefault(require("./lib/resolveDefaultsAtRules"));
var _collapseAdjacentRules = _interopRequireDefault(require("./lib/collapseAdjacentRules"));
var _collapseDuplicateDeclarations = _interopRequireDefault(require("./lib/collapseDuplicateDeclarations"));
var _partitionApplyAtRules = _interopRequireDefault(require("./lib/partitionApplyAtRules"));
var _detectNesting = _interopRequireDefault(require("./lib/detectNesting"));
var _setupContextUtils = require("./lib/setupContextUtils");
var _featureFlags = require("./featureFlags");
function processTailwindFeatures(setupContext) {
return function(root, result) {
let { tailwindDirectives , applyDirectives } = (0, _normalizeTailwindDirectives).default(root);
(0, _detectNesting).default()(root, result);
// Partition apply rules that are found in the css
// itself.
(0, _partitionApplyAtRules).default()(root, result);
let context = setupContext({
tailwindDirectives,
applyDirectives,
registerDependency (dependency) {
result.messages.push({
plugin: "tailwindcss",
parent: result.opts.from,
...dependency
});
},
createContext (tailwindConfig, changedContent) {
return (0, _setupContextUtils).createContext(tailwindConfig, changedContent, root);
}
})(root, result);
if (context.tailwindConfig.separator === "-") {
throw new Error("The '-' character cannot be used as a custom separator in JIT mode due to parsing ambiguity. Please use another character like '_' instead.");
}
(0, _featureFlags).issueFlagNotices(context.tailwindConfig);
(0, _expandTailwindAtRules).default(context)(root, result);
// Partition apply rules that are generated by
// addComponents, addUtilities and so on.
(0, _partitionApplyAtRules).default()(root, result);
(0, _expandApplyAtRules).default(context)(root, result);
(0, _evaluateTailwindFunctions).default(context)(root, result);
(0, _substituteScreenAtRules).default(context)(root, result);
(0, _resolveDefaultsAtRules).default(context)(root, result);
(0, _collapseAdjacentRules).default(context)(root, result);
(0, _collapseDuplicateDeclarations).default(context)(root, result);
};
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
-329
lib/public/colors.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _log = _interopRequireDefault(require("../util/log"));
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
function warn({ version , from , to }) {
_log.default.warn(`${from}-color-renamed`, [
`As of Tailwind CSS ${version}, \`${from}\` has been renamed to \`${to}\`.`,
"Update your configuration file to silence this warning.",
]);
}
var _default = {
inherit: "inherit",
current: "currentColor",
transparent: "transparent",
black: "#000",
white: "#fff",
slate: {
50: "#f8fafc",
100: "#f1f5f9",
200: "#e2e8f0",
300: "#cbd5e1",
400: "#94a3b8",
500: "#64748b",
600: "#475569",
700: "#334155",
800: "#1e293b",
900: "#0f172a"
},
gray: {
50: "#f9fafb",
100: "#f3f4f6",
200: "#e5e7eb",
300: "#d1d5db",
400: "#9ca3af",
500: "#6b7280",
600: "#4b5563",
700: "#374151",
800: "#1f2937",
900: "#111827"
},
zinc: {
50: "#fafafa",
100: "#f4f4f5",
200: "#e4e4e7",
300: "#d4d4d8",
400: "#a1a1aa",
500: "#71717a",
600: "#52525b",
700: "#3f3f46",
800: "#27272a",
900: "#18181b"
},
neutral: {
50: "#fafafa",
100: "#f5f5f5",
200: "#e5e5e5",
300: "#d4d4d4",
400: "#a3a3a3",
500: "#737373",
600: "#525252",
700: "#404040",
800: "#262626",
900: "#171717"
},
stone: {
50: "#fafaf9",
100: "#f5f5f4",
200: "#e7e5e4",
300: "#d6d3d1",
400: "#a8a29e",
500: "#78716c",
600: "#57534e",
700: "#44403c",
800: "#292524",
900: "#1c1917"
},
red: {
50: "#fef2f2",
100: "#fee2e2",
200: "#fecaca",
300: "#fca5a5",
400: "#f87171",
500: "#ef4444",
600: "#dc2626",
700: "#b91c1c",
800: "#991b1b",
900: "#7f1d1d"
},
orange: {
50: "#fff7ed",
100: "#ffedd5",
200: "#fed7aa",
300: "#fdba74",
400: "#fb923c",
500: "#f97316",
600: "#ea580c",
700: "#c2410c",
800: "#9a3412",
900: "#7c2d12"
},
amber: {
50: "#fffbeb",
100: "#fef3c7",
200: "#fde68a",
300: "#fcd34d",
400: "#fbbf24",
500: "#f59e0b",
600: "#d97706",
700: "#b45309",
800: "#92400e",
900: "#78350f"
},
yellow: {
50: "#fefce8",
100: "#fef9c3",
200: "#fef08a",
300: "#fde047",
400: "#facc15",
500: "#eab308",
600: "#ca8a04",
700: "#a16207",
800: "#854d0e",
900: "#713f12"
},
lime: {
50: "#f7fee7",
100: "#ecfccb",
200: "#d9f99d",
300: "#bef264",
400: "#a3e635",
500: "#84cc16",
600: "#65a30d",
700: "#4d7c0f",
800: "#3f6212",
900: "#365314"
},
green: {
50: "#f0fdf4",
100: "#dcfce7",
200: "#bbf7d0",
300: "#86efac",
400: "#4ade80",
500: "#22c55e",
600: "#16a34a",
700: "#15803d",
800: "#166534",
900: "#14532d"
},
emerald: {
50: "#ecfdf5",
100: "#d1fae5",
200: "#a7f3d0",
300: "#6ee7b7",
400: "#34d399",
500: "#10b981",
600: "#059669",
700: "#047857",
800: "#065f46",
900: "#064e3b"
},
teal: {
50: "#f0fdfa",
100: "#ccfbf1",
200: "#99f6e4",
300: "#5eead4",
400: "#2dd4bf",
500: "#14b8a6",
600: "#0d9488",
700: "#0f766e",
800: "#115e59",
900: "#134e4a"
},
cyan: {
50: "#ecfeff",
100: "#cffafe",
200: "#a5f3fc",
300: "#67e8f9",
400: "#22d3ee",
500: "#06b6d4",
600: "#0891b2",
700: "#0e7490",
800: "#155e75",
900: "#164e63"
},
sky: {
50: "#f0f9ff",
100: "#e0f2fe",
200: "#bae6fd",
300: "#7dd3fc",
400: "#38bdf8",
500: "#0ea5e9",
600: "#0284c7",
700: "#0369a1",
800: "#075985",
900: "#0c4a6e"
},
blue: {
50: "#eff6ff",
100: "#dbeafe",
200: "#bfdbfe",
300: "#93c5fd",
400: "#60a5fa",
500: "#3b82f6",
600: "#2563eb",
700: "#1d4ed8",
800: "#1e40af",
900: "#1e3a8a"
},
indigo: {
50: "#eef2ff",
100: "#e0e7ff",
200: "#c7d2fe",
300: "#a5b4fc",
400: "#818cf8",
500: "#6366f1",
600: "#4f46e5",
700: "#4338ca",
800: "#3730a3",
900: "#312e81"
},
violet: {
50: "#f5f3ff",
100: "#ede9fe",
200: "#ddd6fe",
300: "#c4b5fd",
400: "#a78bfa",
500: "#8b5cf6",
600: "#7c3aed",
700: "#6d28d9",
800: "#5b21b6",
900: "#4c1d95"
},
purple: {
50: "#faf5ff",
100: "#f3e8ff",
200: "#e9d5ff",
300: "#d8b4fe",
400: "#c084fc",
500: "#a855f7",
600: "#9333ea",
700: "#7e22ce",
800: "#6b21a8",
900: "#581c87"
},
fuchsia: {
50: "#fdf4ff",
100: "#fae8ff",
200: "#f5d0fe",
300: "#f0abfc",
400: "#e879f9",
500: "#d946ef",
600: "#c026d3",
700: "#a21caf",
800: "#86198f",
900: "#701a75"
},
pink: {
50: "#fdf2f8",
100: "#fce7f3",
200: "#fbcfe8",
300: "#f9a8d4",
400: "#f472b6",
500: "#ec4899",
600: "#db2777",
700: "#be185d",
800: "#9d174d",
900: "#831843"
},
rose: {
50: "#fff1f2",
100: "#ffe4e6",
200: "#fecdd3",
300: "#fda4af",
400: "#fb7185",
500: "#f43f5e",
600: "#e11d48",
700: "#be123c",
800: "#9f1239",
900: "#881337"
},
get lightBlue () {
warn({
version: "v2.2",
from: "lightBlue",
to: "sky"
});
return this.sky;
},
get warmGray () {
warn({
version: "v3.0",
from: "warmGray",
to: "stone"
});
return this.stone;
},
get trueGray () {
warn({
version: "v3.0",
from: "trueGray",
to: "neutral"
});
return this.neutral;
},
get coolGray () {
warn({
version: "v3.0",
from: "coolGray",
to: "gray"
});
return this.gray;
},
get blueGray () {
warn({
version: "v3.0",
from: "blueGray",
to: "slate"
});
return this.slate;
}
};
exports.default = _default;
-13
lib/public/create-plugin.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _createPlugin = _interopRequireDefault(require("../util/createPlugin"));
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
var _default = _createPlugin.default;
exports.default = _default;
-14
lib/public/default-config.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _cloneDeep = require("../util/cloneDeep");
var _defaultConfigStub = _interopRequireDefault(require("../../stubs/defaultConfig.stub"));
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
var _default = (0, _cloneDeep).cloneDeep(_defaultConfigStub.default);
exports.default = _default;
-14
lib/public/default-theme.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _cloneDeep = require("../util/cloneDeep");
var _defaultConfigStub = _interopRequireDefault(require("../../stubs/defaultConfig.stub"));
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
var _default = (0, _cloneDeep).cloneDeep(_defaultConfigStub.default.theme);
exports.default = _default;
-19
lib/public/resolve-config.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = resolveConfig;
var _resolveConfig = _interopRequireDefault(require("../util/resolveConfig"));
var _getAllConfigs = _interopRequireDefault(require("../util/getAllConfigs"));
function resolveConfig(...configs) {
let [, ...defaultConfigs] = (0, _getAllConfigs).default(configs[0]);
return (0, _resolveConfig).default([
...configs,
...defaultConfigs
]);
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
-8
lib/util/bigSign.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = bigSign;
function bigSign(bigIntValue) {
return (bigIntValue > 0n) - (bigIntValue < 0n);
}
-20
lib/util/buildMediaQuery.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = buildMediaQuery;
function buildMediaQuery(screens) {
screens = Array.isArray(screens) ? screens : [
screens
];
return screens.map((screen1)=>screen1.values.map((screen)=>{
if (screen.raw !== undefined) {
return screen.raw;
}
return [
screen.min && `(min-width: ${screen.min})`,
screen.max && `(max-width: ${screen.max})`,
].filter(Boolean).join(" and ");
})
).join(", ");
}
-19
lib/util/cloneDeep.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.cloneDeep = cloneDeep;
function cloneDeep(value) {
if (Array.isArray(value)) {
return value.map((child)=>cloneDeep(child)
);
}
if (typeof value === "object" && value !== null) {
return Object.fromEntries(Object.entries(value).map(([k, v])=>[
k,
cloneDeep(v)
]
));
}
return value;
}
-25
lib/util/cloneNodes.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = cloneNodes;
function cloneNodes(nodes, source = undefined, raws = undefined) {
return nodes.map((node)=>{
let cloned = node.clone();
if (source !== undefined) {
cloned.source = source;
if ("walk" in cloned) {
cloned.walk((child)=>{
child.source = source;
});
}
}
if (raws !== undefined) {
cloned.raws.tailwind = {
...cloned.raws.tailwind,
...raws
};
}
return cloned;
});
}
-100
lib/util/color.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.parseColor = parseColor;
exports.formatColor = formatColor;
var _colorName = _interopRequireDefault(require("color-name"));
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
let HEX = /^#([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})?$/i;
let SHORT_HEX = /^#([a-f\d])([a-f\d])([a-f\d])([a-f\d])?$/i;
let VALUE = /(?:\d+|\d*\.\d+)%?/;
let SEP = /(?:\s*,\s*|\s+)/;
let ALPHA_SEP = /\s*[,/]\s*/;
let CUSTOM_PROPERTY = /var\(--(?:[^ )]*?)\)/;
let RGB = new RegExp(`^rgba?\\(\\s*(${VALUE.source}|${CUSTOM_PROPERTY.source})${SEP.source}(${VALUE.source}|${CUSTOM_PROPERTY.source})${SEP.source}(${VALUE.source}|${CUSTOM_PROPERTY.source})(?:${ALPHA_SEP.source}(${VALUE.source}|${CUSTOM_PROPERTY.source}))?\\s*\\)$`);
let HSL = new RegExp(`^hsla?\\(\\s*((?:${VALUE.source})(?:deg|rad|grad|turn)?|${CUSTOM_PROPERTY.source})${SEP.source}(${VALUE.source}|${CUSTOM_PROPERTY.source})${SEP.source}(${VALUE.source}|${CUSTOM_PROPERTY.source})(?:${ALPHA_SEP.source}(${VALUE.source}|${CUSTOM_PROPERTY.source}))?\\s*\\)$`);
function parseColor(value) {
if (typeof value !== "string") {
return null;
}
value = value.trim();
if (value === "transparent") {
return {
mode: "rgb",
color: [
"0",
"0",
"0"
],
alpha: "0"
};
}
if (value in _colorName.default) {
return {
mode: "rgb",
color: _colorName.default[value].map((v)=>v.toString()
)
};
}
let hex = value.replace(SHORT_HEX, (_, r, g, b, a)=>[
"#",
r,
r,
g,
g,
b,
b,
a ? a + a : ""
].join("")
).match(HEX);
if (hex !== null) {
return {
mode: "rgb",
color: [
parseInt(hex[1], 16),
parseInt(hex[2], 16),
parseInt(hex[3], 16)
].map((v)=>v.toString()
),
alpha: hex[4] ? (parseInt(hex[4], 16) / 255).toString() : undefined
};
}
let rgbMatch = value.match(RGB);
if (rgbMatch !== null) {
var ref, ref1;
return {
mode: "rgb",
color: [
rgbMatch[1],
rgbMatch[2],
rgbMatch[3]
].map((v)=>v.toString()
),
alpha: (ref = rgbMatch[4]) === null || ref === void 0 ? void 0 : (ref1 = ref.toString) === null || ref1 === void 0 ? void 0 : ref1.call(ref)
};
}
let hslMatch = value.match(HSL);
if (hslMatch !== null) {
var ref2, ref3;
return {
mode: "hsl",
color: [
hslMatch[1],
hslMatch[2],
hslMatch[3]
].map((v)=>v.toString()
),
alpha: (ref2 = hslMatch[4]) === null || ref2 === void 0 ? void 0 : (ref3 = ref2.toString) === null || ref3 === void 0 ? void 0 : ref3.call(ref2)
};
}
return null;
}
function formatColor({ mode , color , alpha }) {
let hasAlpha = alpha !== undefined;
return `${mode}(${color.join(" ")}${hasAlpha ? ` / ${alpha}` : ""})`;
}
-18
lib/util/configurePlugins.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = _default;
function _default(pluginConfig, plugins) {
if (pluginConfig === undefined) {
return plugins;
}
const pluginNames = Array.isArray(pluginConfig) ? pluginConfig : [
...new Set(plugins.filter((pluginName)=>{
return pluginConfig !== false && pluginConfig[pluginName] !== false;
}).concat(Object.keys(pluginConfig).filter((pluginName)=>{
return pluginConfig[pluginName] !== false;
}))),
];
return pluginNames;
}
-29
lib/util/createPlugin.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
function createPlugin(plugin, config) {
return {
handler: plugin,
config
};
}
createPlugin.withOptions = function(pluginFunction, configFunction = ()=>({})
) {
const optionsFunction = function(options) {
return {
__options: options,
handler: pluginFunction(options),
config: configFunction(options)
};
};
optionsFunction.__isOptionsFunction = true;
// Expose plugin dependencies so that `object-hash` returns a different
// value if anything here changes, to ensure a rebuild is triggered.
optionsFunction.__pluginFunction = pluginFunction;
optionsFunction.__configFunction = configFunction;
return optionsFunction;
};
var _default = createPlugin;
exports.default = _default;
-49
lib/util/createUtilityPlugin.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = createUtilityPlugin;
var _transformThemeValue = _interopRequireDefault(require("./transformThemeValue"));
function createUtilityPlugin(themeKey, utilityVariations = [
[
themeKey,
[
themeKey
]
]
], { filterDefault =false , ...options } = {}) {
let transformValue = (0, _transformThemeValue).default(themeKey);
return function({ matchUtilities , theme }) {
for (let utilityVariation of utilityVariations){
let group = Array.isArray(utilityVariation[0]) ? utilityVariation : [
utilityVariation
];
var ref;
matchUtilities(group.reduce((obj1, [classPrefix, properties])=>{
return Object.assign(obj1, {
[classPrefix]: (value)=>{
return properties.reduce((obj, name)=>{
if (Array.isArray(name)) {
return Object.assign(obj, {
[name[0]]: name[1]
});
}
return Object.assign(obj, {
[name]: transformValue(value)
});
}, {});
}
});
}, {}), {
...options,
values: filterDefault ? Object.fromEntries(Object.entries((ref = theme(themeKey)) !== null && ref !== void 0 ? ref : {}).filter(([modifier])=>modifier !== "DEFAULT"
)) : theme(themeKey)
});
}
};
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
-235
lib/util/dataTypes.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.normalize = normalize;
exports.url = url;
exports.number = number;
exports.percentage = percentage;
exports.length = length;
exports.lineWidth = lineWidth;
exports.shadow = shadow;
exports.color = color;
exports.image = image;
exports.gradient = gradient;
exports.position = position;
exports.familyName = familyName;
exports.genericName = genericName;
exports.absoluteSize = absoluteSize;
exports.relativeSize = relativeSize;
var _color = require("./color");
var _parseBoxShadowValue = require("./parseBoxShadowValue");
let cssFunctions = [
"min",
"max",
"clamp",
"calc"
];
// Ref: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Types
let COMMA = /,(?![^(]*\))/g // Comma separator that is not located between brackets. E.g.: `cubiz-bezier(a, b, c)` these don't count.
;
let UNDERSCORE = /_(?![^(]*\))/g // Underscore separator that is not located between brackets. E.g.: `rgba(255,_255,_255)_black` these don't count.
;
function normalize(value, isRoot = true) {
// Keep raw strings if it starts with `url(`
if (value.includes("url(")) {
return value.split(/(url\(.*?\))/g).filter(Boolean).map((part)=>{
if (/^url\(.*?\)$/.test(part)) {
return part;
}
return normalize(part, false);
}).join("");
}
// Convert `_` to ` `, except for escaped underscores `\_`
value = value.replace(/([^\\])_+/g, (fullMatch, characterBefore)=>characterBefore + " ".repeat(fullMatch.length - 1)
).replace(/^_/g, " ").replace(/\\_/g, "_");
// Remove leftover whitespace
if (isRoot) {
value = value.trim();
}
// Add spaces around operators inside calc() that do not follow an operator
// or '('.
return value.replace(/(-?\d*\.?\d(?!\b-.+[,)](?![^+\-/*])\D)(?:%|[a-z]+)?|\))([+\-/*])/g, "$1 $2 ");
}
function url(value) {
return value.startsWith("url(");
}
function number(value) {
return !isNaN(Number(value)) || cssFunctions.some((fn)=>new RegExp(`^${fn}\\(.+?`).test(value)
);
}
function percentage(value) {
return value.split(UNDERSCORE).every((part)=>{
return /%$/g.test(part) || cssFunctions.some((fn)=>new RegExp(`^${fn}\\(.+?%`).test(part)
);
});
}
let lengthUnits = [
"cm",
"mm",
"Q",
"in",
"pc",
"pt",
"px",
"em",
"ex",
"ch",
"rem",
"lh",
"vw",
"vh",
"vmin",
"vmax",
];
let lengthUnitsPattern = `(?:${lengthUnits.join("|")})`;
function length(value) {
return value.split(UNDERSCORE).every((part)=>{
return part === "0" || new RegExp(`${lengthUnitsPattern}$`).test(part) || cssFunctions.some((fn)=>new RegExp(`^${fn}\\(.+?${lengthUnitsPattern}`).test(part)
);
});
}
let lineWidths = new Set([
"thin",
"medium",
"thick"
]);
function lineWidth(value) {
return lineWidths.has(value);
}
function shadow(value) {
let parsedShadows = (0, _parseBoxShadowValue).parseBoxShadowValue(normalize(value));
for (let parsedShadow of parsedShadows){
if (!parsedShadow.valid) {
return false;
}
}
return true;
}
function color(value) {
let colors = 0;
let result = value.split(UNDERSCORE).every((part)=>{
part = normalize(part);
if (part.startsWith("var(")) return true;
if ((0, _color).parseColor(part) !== null) return colors++, true;
return false;
});
if (!result) return false;
return colors > 0;
}
function image(value) {
let images = 0;
let result = value.split(COMMA).every((part)=>{
part = normalize(part);
if (part.startsWith("var(")) return true;
if (url(part) || gradient(part) || [
"element(",
"image(",
"cross-fade(",
"image-set("
].some((fn)=>part.startsWith(fn)
)) {
images++;
return true;
}
return false;
});
if (!result) return false;
return images > 0;
}
let gradientTypes = new Set([
"linear-gradient",
"radial-gradient",
"repeating-linear-gradient",
"repeating-radial-gradient",
"conic-gradient",
]);
function gradient(value) {
value = normalize(value);
for (let type of gradientTypes){
if (value.startsWith(`${type}(`)) {
return true;
}
}
return false;
}
let validPositions = new Set([
"center",
"top",
"right",
"bottom",
"left"
]);
function position(value) {
let positions = 0;
let result = value.split(UNDERSCORE).every((part)=>{
part = normalize(part);
if (part.startsWith("var(")) return true;
if (validPositions.has(part) || length(part) || percentage(part)) {
positions++;
return true;
}
return false;
});
if (!result) return false;
return positions > 0;
}
function familyName(value) {
let fonts = 0;
let result = value.split(COMMA).every((part)=>{
part = normalize(part);
if (part.startsWith("var(")) return true;
// If it contains spaces, then it should be quoted
if (part.includes(" ")) {
if (!/(['"])([^"']+)\1/g.test(part)) {
return false;
}
}
// If it starts with a number, it's invalid
if (/^\d/g.test(part)) {
return false;
}
fonts++;
return true;
});
if (!result) return false;
return fonts > 0;
}
let genericNames = new Set([
"serif",
"sans-serif",
"monospace",
"cursive",
"fantasy",
"system-ui",
"ui-serif",
"ui-sans-serif",
"ui-monospace",
"ui-rounded",
"math",
"emoji",
"fangsong",
]);
function genericName(value) {
return genericNames.has(value);
}
let absoluteSizes = new Set([
"xx-small",
"x-small",
"small",
"medium",
"large",
"x-large",
"x-large",
"xxx-large",
]);
function absoluteSize(value) {
return absoluteSizes.has(value);
}
let relativeSizes = new Set([
"larger",
"smaller"
]);
function relativeSize(value) {
return relativeSizes.has(value);
}
-22
lib/util/defaults.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.defaults = defaults;
function defaults(target, ...sources) {
for (let source of sources){
for(let k in source){
var ref;
if (!(target === null || target === void 0 ? void 0 : (ref = target.hasOwnProperty) === null || ref === void 0 ? void 0 : ref.call(target, k))) {
target[k] = source[k];
}
}
for (let k1 of Object.getOwnPropertySymbols(source)){
var ref1;
if (!(target === null || target === void 0 ? void 0 : (ref1 = target.hasOwnProperty) === null || ref1 === void 0 ? void 0 : ref1.call(target, k1))) {
target[k1] = source[k1];
}
}
}
return target;
}
-19
lib/util/escapeClassName.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = escapeClassName;
var _postcssSelectorParser = _interopRequireDefault(require("postcss-selector-parser"));
var _escapeCommas = _interopRequireDefault(require("./escapeCommas"));
function escapeClassName(className) {
var ref;
let node = _postcssSelectorParser.default.className();
node.value = className;
var ref1;
return (0, _escapeCommas).default((ref1 = node === null || node === void 0 ? void 0 : (ref = node.raws) === null || ref === void 0 ? void 0 : ref.value) !== null && ref1 !== void 0 ? ref1 : node.value);
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
-8
lib/util/escapeCommas.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = escapeCommas;
function escapeCommas(className) {
return className.replace(/\\,/g, "\\2c ");
}
-17
lib/util/flattenColorPalette.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
const flattenColorPalette = (colors)=>Object.assign({}, ...Object.entries(colors !== null && colors !== void 0 ? colors : {}).flatMap(([color, values])=>typeof values == "object" ? Object.entries(flattenColorPalette(values)).map(([number, hex])=>({
[color + (number === "DEFAULT" ? "" : `-${number}`)]: hex
})
) : [
{
[`${color}`]: values
}
]
))
;
var _default = flattenColorPalette;
exports.default = _default;
-186
lib/util/formatVariantSelector.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.formatVariantSelector = formatVariantSelector;
exports.finalizeSelector = finalizeSelector;
exports.selectorFunctions = void 0;
var _postcssSelectorParser = _interopRequireDefault(require("postcss-selector-parser"));
var _unesc = _interopRequireDefault(require("postcss-selector-parser/dist/util/unesc"));
var _escapeClassName = _interopRequireDefault(require("../util/escapeClassName"));
var _prefixSelector = _interopRequireDefault(require("../util/prefixSelector"));
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
let MERGE = ":merge";
let PARENT = "&";
let selectorFunctions = new Set([
MERGE
]);
exports.selectorFunctions = selectorFunctions;
function formatVariantSelector(current, ...others) {
for (let other of others){
let incomingValue = resolveFunctionArgument(other, MERGE);
if (incomingValue !== null) {
let existingValue = resolveFunctionArgument(current, MERGE, incomingValue);
if (existingValue !== null) {
let existingTarget = `${MERGE}(${incomingValue})`;
let splitIdx = other.indexOf(existingTarget);
let addition = other.slice(splitIdx + existingTarget.length).split(" ")[0];
current = current.replace(existingTarget, existingTarget + addition);
continue;
}
}
current = other.replace(PARENT, current);
}
return current;
}
function finalizeSelector(format, { selector: selector1 , candidate , context }) {
var ref, ref1;
var ref2;
let separator = (ref2 = context === null || context === void 0 ? void 0 : (ref = context.tailwindConfig) === null || ref === void 0 ? void 0 : ref.separator) !== null && ref2 !== void 0 ? ref2 : ":";
// Split by the separator, but ignore the separator inside square brackets:
//
// E.g.: dark:lg:hover:[paint-order:markers]
// ┬ ┬ ┬ ┬
// │ │ │ ╰── We will not split here
// ╰──┴─────┴─────────────── We will split here
//
let splitter = new RegExp(`\\${separator}(?![^[]*\\])`);
let base = candidate.split(splitter).pop();
if (context === null || context === void 0 ? void 0 : (ref1 = context.tailwindConfig) === null || ref1 === void 0 ? void 0 : ref1.prefix) {
format = (0, _prefixSelector).default(context.tailwindConfig.prefix, format);
}
format = format.replace(PARENT, `.${(0, _escapeClassName).default(candidate)}`);
// Normalize escaped classes, e.g.:
//
// The idea would be to replace the escaped `base` in the selector with the
// `format`. However, in css you can escape the same selector in a few
// different ways. This would result in different strings and therefore we
// can't replace it properly.
//
// base: bg-[rgb(255,0,0)]
// base in selector: bg-\\[rgb\\(255\\,0\\,0\\)\\]
// escaped base: bg-\\[rgb\\(255\\2c 0\\2c 0\\)\\]
//
selector1 = (0, _postcssSelectorParser).default((selectors)=>{
return selectors.walkClasses((node)=>{
if (node.raws && node.value.includes(base)) {
node.raws.value = (0, _escapeClassName).default((0, _unesc).default(node.raws.value));
}
return node;
});
}).processSync(selector1);
// We can safely replace the escaped base now, since the `base` section is
// now in a normalized escaped value.
selector1 = selector1.replace(`.${(0, _escapeClassName).default(base)}`, format);
// Remove unnecessary pseudo selectors that we used as placeholders
return (0, _postcssSelectorParser).default((selectors)=>{
return selectors.map((selector2)=>{
selector2.walkPseudos((p)=>{
if (selectorFunctions.has(p.value)) {
p.replaceWith(p.nodes);
}
return p;
});
// This will make sure to move pseudo's to the correct spot (the end for
// pseudo elements) because otherwise the selector will never work
// anyway.
//
// E.g.:
// - `before:hover:text-center` would result in `.before\:hover\:text-center:hover::before`
// - `hover:before:text-center` would result in `.hover\:before\:text-center:hover::before`
//
// `::before:hover` doesn't work, which means that we can make it work for you by flipping the order.
function collectPseudoElements(selector) {
let nodes = [];
for (let node of selector.nodes){
if (isPseudoElement(node)) {
nodes.push(node);
selector.removeChild(node);
}
if (node === null || node === void 0 ? void 0 : node.nodes) {
nodes.push(...collectPseudoElements(node));
}
}
return nodes;
}
let pseudoElements = collectPseudoElements(selector2);
if (pseudoElements.length > 0) {
selector2.nodes.push(pseudoElements.sort(sortSelector));
}
return selector2;
});
}).processSync(selector1);
}
// Note: As a rule, double colons (::) should be used instead of a single colon
// (:). This distinguishes pseudo-classes from pseudo-elements. However, since
// this distinction was not present in older versions of the W3C spec, most
// browsers support both syntaxes for the original pseudo-elements.
let pseudoElementsBC = [
":before",
":after",
":first-line",
":first-letter"
];
// These pseudo-elements _can_ be combined with other pseudo selectors AND the order does matter.
let pseudoElementExceptions = [
"::file-selector-button"
];
// This will make sure to move pseudo's to the correct spot (the end for
// pseudo elements) because otherwise the selector will never work
// anyway.
//
// E.g.:
// - `before:hover:text-center` would result in `.before\:hover\:text-center:hover::before`
// - `hover:before:text-center` would result in `.hover\:before\:text-center:hover::before`
//
// `::before:hover` doesn't work, which means that we can make it work
// for you by flipping the order.
function sortSelector(a, z) {
// Both nodes are non-pseudo's so we can safely ignore them and keep
// them in the same order.
if (a.type !== "pseudo" && z.type !== "pseudo") {
return 0;
}
// If one of them is a combinator, we need to keep it in the same order
// because that means it will start a new "section" in the selector.
if (a.type === "combinator" ^ z.type === "combinator") {
return 0;
}
// One of the items is a pseudo and the other one isn't. Let's move
// the pseudo to the right.
if (a.type === "pseudo" ^ z.type === "pseudo") {
return (a.type === "pseudo") - (z.type === "pseudo");
}
// Both are pseudo's, move the pseudo elements (except for
// ::file-selector-button) to the right.
return isPseudoElement(a) - isPseudoElement(z);
}
function isPseudoElement(node) {
if (node.type !== "pseudo") return false;
if (pseudoElementExceptions.includes(node.value)) return false;
return node.value.startsWith("::") || pseudoElementsBC.includes(node.value);
}
function resolveFunctionArgument(haystack, needle, arg) {
let startIdx = haystack.indexOf(arg ? `${needle}(${arg})` : needle);
if (startIdx === -1) return null;
// Start inside the `(`
startIdx += needle.length + 1;
let target = "";
let count = 0;
for (let char of haystack.slice(startIdx)){
if (char !== "(" && char !== ")") {
target += char;
} else if (char === "(") {
target += char;
count++;
} else if (char === ")") {
if (--count < 0) break; // unbalanced
target += char;
}
}
return target;
}
-29
lib/util/getAllConfigs.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = getAllConfigs;
var _defaultConfigStubJs = _interopRequireDefault(require("../../stubs/defaultConfig.stub.js"));
var _featureFlags = require("../featureFlags");
function getAllConfigs(config) {
var ref;
const configs = ((ref = config === null || config === void 0 ? void 0 : config.presets) !== null && ref !== void 0 ? ref : [
_defaultConfigStubJs.default
]).slice().reverse().flatMap((preset)=>getAllConfigs(preset instanceof Function ? preset() : preset)
);
const features = {
};
const experimentals = Object.keys(features).filter((feature)=>(0, _featureFlags).flagEnabled(config, feature)
).map((feature)=>features[feature]
);
return [
config,
...experimentals,
...configs
];
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
-16
lib/util/hashConfig.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = hashConfig;
var _objectHash = _interopRequireDefault(require("object-hash"));
function hashConfig(config) {
return (0, _objectHash).default(config, {
ignoreUnknown: true
});
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
-8
lib/util/isKeyframeRule.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = isKeyframeRule;
function isKeyframeRule(rule) {
return rule.parent && rule.parent.type === "atrule" && /keyframes$/.test(rule.parent.name);
}
-12
lib/util/isPlainObject.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = isPlainObject;
function isPlainObject(value) {
if (Object.prototype.toString.call(value) !== "[object Object]") {
return false;
}
const prototype = Object.getPrototypeOf(value);
return prototype === null || prototype === Object.prototype;
}
-64
lib/util/isValidArbitraryValue.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = isValidArbitraryValue;
function isValidArbitraryValue(value) {
let stack = [];
let inQuotes = false;
for(let i = 0; i < value.length; i++){
let char = value[i];
if (char === ":" && !inQuotes && stack.length === 0) {
return false;
}
// Non-escaped quotes allow us to "allow" anything in between
if (quotes.has(char) && value[i - 1] !== "\\") {
inQuotes = !inQuotes;
}
if (inQuotes) continue;
if (value[i - 1] === "\\") continue; // Escaped
if (matchingBrackets.has(char)) {
stack.push(char);
} else if (inverseMatchingBrackets.has(char)) {
let inverse = inverseMatchingBrackets.get(char);
// Nothing to pop from, therefore it is unbalanced
if (stack.length <= 0) {
return false;
}
// Popped value must match the inverse value, otherwise it is unbalanced
if (stack.pop() !== inverse) {
return false;
}
}
}
// If there is still something on the stack, it is also unbalanced
if (stack.length > 0) {
return false;
}
// All good, totally balanced!
return true;
}
let matchingBrackets = new Map([
[
"{",
"}"
],
[
"[",
"]"
],
[
"(",
")"
],
]);
let inverseMatchingBrackets = new Map(Array.from(matchingBrackets.entries()).map(([k, v])=>[
v,
k
]
));
let quotes = new Set([
'"',
"'",
"`"
]);
-51
lib/util/log.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.dim = dim;
exports.default = void 0;
var _picocolors = _interopRequireDefault(require("picocolors"));
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
let alreadyShown = new Set();
function log(type, messages, key) {
if (process.env.JEST_WORKER_ID !== undefined) return;
if (key && alreadyShown.has(key)) return;
if (key) alreadyShown.add(key);
console.warn("");
messages.forEach((message)=>console.warn(type, "-", message)
);
}
function dim(input) {
return _picocolors.default.dim(input);
}
var _default = {
info (key, messages) {
log(_picocolors.default.bold(_picocolors.default.cyan("info")), ...Array.isArray(key) ? [
key
] : [
messages,
key
]);
},
warn (key, messages) {
log(_picocolors.default.bold(_picocolors.default.yellow("warn")), ...Array.isArray(key) ? [
key
] : [
messages,
key
]);
},
risk (key, messages) {
log(_picocolors.default.bold(_picocolors.default.magenta("risk")), ...Array.isArray(key) ? [
key
] : [
messages,
key
]);
}
};
exports.default = _default;
-32
lib/util/nameClass.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = nameClass;
exports.asClass = asClass;
exports.formatClass = formatClass;
var _escapeClassName = _interopRequireDefault(require("./escapeClassName"));
var _escapeCommas = _interopRequireDefault(require("./escapeCommas"));
function nameClass(classPrefix, key) {
return asClass(formatClass(classPrefix, key));
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
function asClass(name) {
return (0, _escapeCommas).default(`.${(0, _escapeClassName).default(name)}`);
}
function formatClass(classPrefix, key) {
if (key === "DEFAULT") {
return classPrefix;
}
if (key === "-" || key === "-DEFAULT") {
return `-${classPrefix}`;
}
if (key.startsWith("-")) {
return `-${classPrefix}${key}`;
}
return `${classPrefix}-${key}`;
}
-19
lib/util/negateValue.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = _default;
function _default(value) {
value = `${value}`;
if (value === "0") {
return "0";
}
// Flip sign of numbers
if (/^[+-]?(\d+|\d*\.\d+)(e[+-]?\d+)?(%|\w+)?$/.test(value)) {
return value.replace(/^[+-]?/, (sign)=>sign === "-" ? "" : "-"
);
}
if (value.includes("var(") || value.includes("calc(")) {
return `calc(${value} * -1)`;
}
}
-240
lib/util/normalizeConfig.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.normalizeConfig = normalizeConfig;
var _log = _interopRequireWildcard(require("./log"));
function _interopRequireWildcard(obj) {
if (obj && obj.__esModule) {
return obj;
} else {
var newObj = {};
if (obj != null) {
for(var key in obj){
if (Object.prototype.hasOwnProperty.call(obj, key)) {
var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {};
if (desc.get || desc.set) {
Object.defineProperty(newObj, key, desc);
} else {
newObj[key] = obj[key];
}
}
}
}
newObj.default = obj;
return newObj;
}
}
function normalizeConfig(config) {
// Quick structure validation
/**
* type FilePath = string
* type RawFile = { raw: string, extension?: string }
* type ExtractorFn = (content: string) => Array<string>
* type TransformerFn = (content: string) => string
*
* type Content =
* | Array<FilePath | RawFile>
* | {
* files: Array<FilePath | RawFile>,
* extract?: ExtractorFn | { [extension: string]: ExtractorFn }
* transform?: TransformerFn | { [extension: string]: TransformerFn }
* }
*/ let valid = (()=>{
// `config.purge` should not exist anymore
if (config.purge) {
return false;
}
// `config.content` should exist
if (!config.content) {
return false;
}
// `config.content` should be an object or an array
if (!Array.isArray(config.content) && !(typeof config.content === "object" && config.content !== null)) {
return false;
}
// When `config.content` is an array, it should consist of FilePaths or RawFiles
if (Array.isArray(config.content)) {
return config.content.every((path)=>{
// `path` can be a string
if (typeof path === "string") return true;
// `path` can be an object { raw: string, extension?: string }
// `raw` must be a string
if (typeof (path === null || path === void 0 ? void 0 : path.raw) !== "string") return false;
// `extension` (if provided) should also be a string
if ((path === null || path === void 0 ? void 0 : path.extension) && typeof (path === null || path === void 0 ? void 0 : path.extension) !== "string") {
return false;
}
return true;
});
}
// When `config.content` is an object
if (typeof config.content === "object" && config.content !== null) {
// Only `files`, `extract` and `transform` can exist in `config.content`
if (Object.keys(config.content).some((key)=>![
"files",
"extract",
"transform"
].includes(key)
)) {
return false;
}
// `config.content.files` should exist of FilePaths or RawFiles
if (Array.isArray(config.content.files)) {
if (!config.content.files.every((path)=>{
// `path` can be a string
if (typeof path === "string") return true;
// `path` can be an object { raw: string, extension?: string }
// `raw` must be a string
if (typeof (path === null || path === void 0 ? void 0 : path.raw) !== "string") return false;
// `extension` (if provided) should also be a string
if ((path === null || path === void 0 ? void 0 : path.extension) && typeof (path === null || path === void 0 ? void 0 : path.extension) !== "string") {
return false;
}
return true;
})) {
return false;
}
// `config.content.extract` is optional, and can be a Function or a Record<String, Function>
if (typeof config.content.extract === "object") {
for (let value of Object.values(config.content.extract)){
if (typeof value !== "function") {
return false;
}
}
} else if (!(config.content.extract === undefined || typeof config.content.extract === "function")) {
return false;
}
// `config.content.transform` is optional, and can be a Function or a Record<String, Function>
if (typeof config.content.transform === "object") {
for (let value of Object.values(config.content.transform)){
if (typeof value !== "function") {
return false;
}
}
} else if (!(config.content.transform === undefined || typeof config.content.transform === "function")) {
return false;
}
}
return true;
}
return false;
})();
if (!valid) {
_log.default.warn("purge-deprecation", [
"The `purge`/`content` options have changed in Tailwind CSS v3.0.",
"Update your configuration file to eliminate this warning.",
"https://tailwindcss.com/docs/upgrade-guide#configure-content-sources",
]);
}
// Normalize the `safelist`
config.safelist = (()=>{
var ref;
let { content , purge , safelist } = config;
if (Array.isArray(safelist)) return safelist;
if (Array.isArray(content === null || content === void 0 ? void 0 : content.safelist)) return content.safelist;
if (Array.isArray(purge === null || purge === void 0 ? void 0 : purge.safelist)) return purge.safelist;
if (Array.isArray(purge === null || purge === void 0 ? void 0 : (ref = purge.options) === null || ref === void 0 ? void 0 : ref.safelist)) return purge.options.safelist;
return [];
})();
// Normalize prefix option
if (typeof config.prefix === "function") {
_log.default.warn("prefix-function", [
"As of Tailwind CSS v3.0, `prefix` cannot be a function.",
"Update `prefix` in your configuration to be a string to eliminate this warning.",
"https://tailwindcss.com/docs/upgrade-guide#prefix-cannot-be-a-function",
]);
config.prefix = "";
} else {
var _prefix;
config.prefix = (_prefix = config.prefix) !== null && _prefix !== void 0 ? _prefix : "";
}
// Normalize the `content`
config.content = {
files: (()=>{
let { content , purge } = config;
if (Array.isArray(purge)) return purge;
if (Array.isArray(purge === null || purge === void 0 ? void 0 : purge.content)) return purge.content;
if (Array.isArray(content)) return content;
if (Array.isArray(content === null || content === void 0 ? void 0 : content.content)) return content.content;
if (Array.isArray(content === null || content === void 0 ? void 0 : content.files)) return content.files;
return [];
})(),
extract: (()=>{
let extract = (()=>{
var ref, ref1, ref2, ref3, ref4, ref5, ref6, ref7, ref8, ref9;
if ((ref = config.purge) === null || ref === void 0 ? void 0 : ref.extract) return config.purge.extract;
if ((ref1 = config.content) === null || ref1 === void 0 ? void 0 : ref1.extract) return config.content.extract;
if ((ref2 = config.purge) === null || ref2 === void 0 ? void 0 : (ref3 = ref2.extract) === null || ref3 === void 0 ? void 0 : ref3.DEFAULT) return config.purge.extract.DEFAULT;
if ((ref4 = config.content) === null || ref4 === void 0 ? void 0 : (ref5 = ref4.extract) === null || ref5 === void 0 ? void 0 : ref5.DEFAULT) return config.content.extract.DEFAULT;
if ((ref6 = config.purge) === null || ref6 === void 0 ? void 0 : (ref7 = ref6.options) === null || ref7 === void 0 ? void 0 : ref7.extractors) return config.purge.options.extractors;
if ((ref8 = config.content) === null || ref8 === void 0 ? void 0 : (ref9 = ref8.options) === null || ref9 === void 0 ? void 0 : ref9.extractors) return config.content.options.extractors;
return {};
})();
let extractors = {};
let defaultExtractor = (()=>{
var ref, ref10, ref11, ref12;
if ((ref = config.purge) === null || ref === void 0 ? void 0 : (ref10 = ref.options) === null || ref10 === void 0 ? void 0 : ref10.defaultExtractor) {
return config.purge.options.defaultExtractor;
}
if ((ref11 = config.content) === null || ref11 === void 0 ? void 0 : (ref12 = ref11.options) === null || ref12 === void 0 ? void 0 : ref12.defaultExtractor) {
return config.content.options.defaultExtractor;
}
return undefined;
})();
if (defaultExtractor !== undefined) {
extractors.DEFAULT = defaultExtractor;
}
// Functions
if (typeof extract === "function") {
extractors.DEFAULT = extract;
} else if (Array.isArray(extract)) {
for (let { extensions , extractor } of extract !== null && extract !== void 0 ? extract : []){
for (let extension of extensions){
extractors[extension] = extractor;
}
}
} else if (typeof extract === "object" && extract !== null) {
Object.assign(extractors, extract);
}
return extractors;
})(),
transform: (()=>{
let transform = (()=>{
var ref, ref13, ref14, ref15, ref16, ref17;
if ((ref = config.purge) === null || ref === void 0 ? void 0 : ref.transform) return config.purge.transform;
if ((ref13 = config.content) === null || ref13 === void 0 ? void 0 : ref13.transform) return config.content.transform;
if ((ref14 = config.purge) === null || ref14 === void 0 ? void 0 : (ref15 = ref14.transform) === null || ref15 === void 0 ? void 0 : ref15.DEFAULT) return config.purge.transform.DEFAULT;
if ((ref16 = config.content) === null || ref16 === void 0 ? void 0 : (ref17 = ref16.transform) === null || ref17 === void 0 ? void 0 : ref17.DEFAULT) return config.content.transform.DEFAULT;
return {};
})();
let transformers = {};
if (typeof transform === "function") {
transformers.DEFAULT = transform;
}
if (typeof transform === "object" && transform !== null) {
Object.assign(transformers, transform);
}
return transformers;
})()
};
// Validate globs to prevent bogus globs.
// E.g.: `./src/*.{html}` is invalid, the `{html}` should just be `html`
for (let file of config.content.files){
if (typeof file === "string" && /{([^,]*?)}/g.test(file)) {
_log.default.warn("invalid-glob-braces", [
`The glob pattern ${(0, _log).dim(file)} in your Tailwind CSS configuration is invalid.`,
`Update it to ${(0, _log).dim(file.replace(/{([^,]*?)}/g, "$1"))} to silence this warning.`
]);
break;
}
}
if (config.content.files.length === 0) {
_log.default.warn("content-problems", [
"The `content` option in your Tailwind CSS configuration is missing or empty.",
"Configure your content sources or your generated CSS will be missing styles.",
"https://tailwindcss.com/docs/content-configuration",
]);
}
return config;
}
-59
lib/util/normalizeScreens.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.normalizeScreens = normalizeScreens;
function normalizeScreens(screens, root = true) {
if (Array.isArray(screens)) {
return screens.map((screen)=>{
if (root && Array.isArray(screen)) {
throw new Error("The tuple syntax is not supported for `screens`.");
}
if (typeof screen === "string") {
return {
name: screen.toString(),
values: [
{
min: screen,
max: undefined
}
]
};
}
let [name, options] = screen;
name = name.toString();
if (typeof options === "string") {
return {
name,
values: [
{
min: options,
max: undefined
}
]
};
}
if (Array.isArray(options)) {
return {
name,
values: options.map((option)=>resolveValue(option)
)
};
}
return {
name,
values: [
resolveValue(options)
]
};
});
}
return normalizeScreens(Object.entries(screens !== null && screens !== void 0 ? screens : {}), false);
}
function resolveValue({ "min-width": _minWidth , min =_minWidth , max , raw } = {}) {
return {
min,
max,
raw
};
}
-89
lib/util/parseAnimationValue.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = parseAnimationValue;
function parseAnimationValue(input) {
let animations = input.split(COMMA);
return animations.map((animation)=>{
let value = animation.trim();
let result = {
value
};
let parts = value.split(SPACE);
let seen = new Set();
for (let part of parts){
if (!seen.has("DIRECTIONS") && DIRECTIONS.has(part)) {
result.direction = part;
seen.add("DIRECTIONS");
} else if (!seen.has("PLAY_STATES") && PLAY_STATES.has(part)) {
result.playState = part;
seen.add("PLAY_STATES");
} else if (!seen.has("FILL_MODES") && FILL_MODES.has(part)) {
result.fillMode = part;
seen.add("FILL_MODES");
} else if (!seen.has("ITERATION_COUNTS") && (ITERATION_COUNTS.has(part) || DIGIT.test(part))) {
result.iterationCount = part;
seen.add("ITERATION_COUNTS");
} else if (!seen.has("TIMING_FUNCTION") && TIMINGS.has(part)) {
result.timingFunction = part;
seen.add("TIMING_FUNCTION");
} else if (!seen.has("TIMING_FUNCTION") && TIMING_FNS.some((f)=>part.startsWith(`${f}(`)
)) {
result.timingFunction = part;
seen.add("TIMING_FUNCTION");
} else if (!seen.has("DURATION") && TIME.test(part)) {
result.duration = part;
seen.add("DURATION");
} else if (!seen.has("DELAY") && TIME.test(part)) {
result.delay = part;
seen.add("DELAY");
} else if (!seen.has("NAME")) {
result.name = part;
seen.add("NAME");
} else {
if (!result.unknown) result.unknown = [];
result.unknown.push(part);
}
}
return result;
});
}
const DIRECTIONS = new Set([
"normal",
"reverse",
"alternate",
"alternate-reverse"
]);
const PLAY_STATES = new Set([
"running",
"paused"
]);
const FILL_MODES = new Set([
"none",
"forwards",
"backwards",
"both"
]);
const ITERATION_COUNTS = new Set([
"infinite"
]);
const TIMINGS = new Set([
"linear",
"ease",
"ease-in",
"ease-out",
"ease-in-out",
"step-start",
"step-end",
]);
const TIMING_FNS = [
"cubic-bezier",
"steps"
];
const COMMA = /\,(?![^(]*\))/g // Comma separator that is not located between brackets. E.g.: `cubiz-bezier(a, b, c)` these don't count.
;
const SPACE = /\ +(?![^(]*\))/g // Similar to the one above, but with spaces instead.
;
const TIME = /^(-?[\d.]+m?s)$/;
const DIGIT = /^(\d+)$/;
-117
lib/util/parseBoxShadowValue.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.parseBoxShadowValue = parseBoxShadowValue;
exports.formatBoxShadowValue = formatBoxShadowValue;
let KEYWORDS = new Set([
"inset",
"inherit",
"initial",
"revert",
"unset"
]);
let SPACE = /\ +(?![^(]*\))/g // Similar to the one above, but with spaces instead.
;
let LENGTH = /^-?(\d+|\.\d+)(.*?)$/g;
let SPECIALS = /[(),]/g;
/**
* This splits a string on top-level commas.
*
* Regex doesn't support recursion (at least not the JS-flavored version).
* So we have to use a tiny state machine to keep track of paren vs comma
* placement. Before we'd only exclude commas from the inner-most nested
* set of parens rather than any commas that were not contained in parens
* at all which is the intended behavior here.
*
* Expected behavior:
* var(--a, 0 0 1px rgb(0, 0, 0)), 0 0 1px rgb(0, 0, 0)
* ─┬─ ┬ ┬ ┬
* x x x ╰──────── Split because top-level
* ╰──────────────┴──┴───────────── Ignored b/c inside >= 1 levels of parens
*
* @param {string} input
*/ function* splitByTopLevelCommas(input) {
SPECIALS.lastIndex = -1;
let depth = 0;
let lastIndex = 0;
let found = false;
// Find all parens & commas
// And only split on commas if they're top-level
for (let match of input.matchAll(SPECIALS)){
if (match[0] === "(") depth++;
if (match[0] === ")") depth--;
if (match[0] === "," && depth === 0) {
found = true;
yield input.substring(lastIndex, match.index);
lastIndex = match.index + match[0].length;
}
}
// Provide the last segment of the string if available
// Otherwise the whole string since no commas were found
// This mirrors the behavior of string.split()
if (found) {
yield input.substring(lastIndex);
} else {
yield input;
}
}
function parseBoxShadowValue(input) {
let shadows = Array.from(splitByTopLevelCommas(input));
return shadows.map((shadow)=>{
let value = shadow.trim();
let result = {
raw: value
};
let parts = value.split(SPACE);
let seen = new Set();
for (let part of parts){
// Reset index, since the regex is stateful.
LENGTH.lastIndex = 0;
// Keyword
if (!seen.has("KEYWORD") && KEYWORDS.has(part)) {
result.keyword = part;
seen.add("KEYWORD");
} else if (LENGTH.test(part)) {
if (!seen.has("X")) {
result.x = part;
seen.add("X");
} else if (!seen.has("Y")) {
result.y = part;
seen.add("Y");
} else if (!seen.has("BLUR")) {
result.blur = part;
seen.add("BLUR");
} else if (!seen.has("SPREAD")) {
result.spread = part;
seen.add("SPREAD");
}
} else {
if (!result.color) {
result.color = part;
} else {
if (!result.unknown) result.unknown = [];
result.unknown.push(part);
}
}
}
// Check if valid
result.valid = result.x !== undefined && result.y !== undefined;
return result;
});
}
function formatBoxShadowValue(shadows) {
return shadows.map((shadow)=>{
if (!shadow.valid) {
return shadow.raw;
}
return [
shadow.keyword,
shadow.x,
shadow.y,
shadow.blur,
shadow.spread,
shadow.color
].filter(Boolean).join(" ");
}).join(", ");
}
-63
lib/util/parseDependency.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = parseDependency;
var _isGlob = _interopRequireDefault(require("is-glob"));
var _globParent = _interopRequireDefault(require("glob-parent"));
var _path = _interopRequireDefault(require("path"));
function parseDependency(normalizedFileOrGlob) {
if (normalizedFileOrGlob.startsWith("!")) {
return null;
}
let message;
if ((0, _isGlob).default(normalizedFileOrGlob)) {
let { base , glob } = parseGlob(normalizedFileOrGlob);
message = {
type: "dir-dependency",
dir: _path.default.resolve(base),
glob
};
} else {
message = {
type: "dependency",
file: _path.default.resolve(normalizedFileOrGlob)
};
}
// rollup-plugin-postcss does not support dir-dependency messages
// but directories can be watched in the same way as files
if (message.type === "dir-dependency" && process.env.ROLLUP_WATCH === "true") {
message = {
type: "dependency",
file: message.dir
};
}
return message;
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
// Based on `glob-base`
// https://github.com/micromatch/glob-base/blob/master/index.js
function parseGlob(pattern) {
let glob = pattern;
let base = (0, _globParent).default(pattern);
if (base !== ".") {
glob = pattern.substr(base.length);
if (glob.charAt(0) === "/") {
glob = glob.substr(1);
}
}
if (glob.substr(0, 2) === "./") {
glob = glob.substr(2);
}
if (glob.charAt(0) === "/") {
glob = glob.substr(1);
}
return {
base,
glob
};
}
-31
lib/util/parseObjectStyles.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = parseObjectStyles;
var _postcss = _interopRequireDefault(require("postcss"));
var _postcssNested = _interopRequireDefault(require("postcss-nested"));
var _postcssJs = _interopRequireDefault(require("postcss-js"));
function parseObjectStyles(styles) {
if (!Array.isArray(styles)) {
return parseObjectStyles([
styles
]);
}
return styles.flatMap((style)=>{
return (0, _postcss).default([
(0, _postcssNested).default({
bubble: [
"screen"
]
}),
]).process(style, {
parser: _postcssJs.default
}).root.nodes;
});
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
-179
lib/util/pluginUtils.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.updateAllClasses = updateAllClasses;
exports.asValue = asValue;
exports.asColor = asColor;
exports.asLookupValue = asLookupValue;
exports.coerceValue = coerceValue;
var _postcssSelectorParser = _interopRequireDefault(require("postcss-selector-parser"));
var _escapeCommas = _interopRequireDefault(require("./escapeCommas"));
var _withAlphaVariable = require("./withAlphaVariable");
var _dataTypes = require("./dataTypes");
var _negateValue = _interopRequireDefault(require("./negateValue"));
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
function updateAllClasses(selectors1, updateClass) {
let parser = (0, _postcssSelectorParser).default((selectors)=>{
selectors.walkClasses((sel)=>{
let updatedClass = updateClass(sel.value);
sel.value = updatedClass;
if (sel.raws && sel.raws.value) {
sel.raws.value = (0, _escapeCommas).default(sel.raws.value);
}
});
});
let result = parser.processSync(selectors1);
return result;
}
function resolveArbitraryValue(modifier, validate) {
if (!isArbitraryValue(modifier)) {
return undefined;
}
let value = modifier.slice(1, -1);
if (!validate(value)) {
return undefined;
}
return (0, _dataTypes).normalize(value);
}
function asNegativeValue(modifier, lookup = {}, validate) {
let positiveValue = lookup[modifier];
if (positiveValue !== undefined) {
return (0, _negateValue).default(positiveValue);
}
if (isArbitraryValue(modifier)) {
let resolved = resolveArbitraryValue(modifier, validate);
if (resolved === undefined) {
return undefined;
}
return (0, _negateValue).default(resolved);
}
}
function asValue(modifier, options = {}, { validate =()=>true
} = {}) {
var ref;
let value = (ref = options.values) === null || ref === void 0 ? void 0 : ref[modifier];
if (value !== undefined) {
return value;
}
if (options.supportsNegativeValues && modifier.startsWith("-")) {
return asNegativeValue(modifier.slice(1), options.values, validate);
}
return resolveArbitraryValue(modifier, validate);
}
function isArbitraryValue(input) {
return input.startsWith("[") && input.endsWith("]");
}
function splitAlpha(modifier) {
let slashIdx = modifier.lastIndexOf("/");
if (slashIdx === -1 || slashIdx === modifier.length - 1) {
return [
modifier
];
}
return [
modifier.slice(0, slashIdx),
modifier.slice(slashIdx + 1)
];
}
function asColor(modifier, options = {}, { tailwindConfig ={} } = {}) {
var ref;
if (((ref = options.values) === null || ref === void 0 ? void 0 : ref[modifier]) !== undefined) {
var ref1;
return (ref1 = options.values) === null || ref1 === void 0 ? void 0 : ref1[modifier];
}
let [color, alpha] = splitAlpha(modifier);
if (alpha !== undefined) {
var ref2, ref3, ref4;
var ref5;
let normalizedColor = (ref5 = (ref2 = options.values) === null || ref2 === void 0 ? void 0 : ref2[color]) !== null && ref5 !== void 0 ? ref5 : isArbitraryValue(color) ? color.slice(1, -1) : undefined;
if (normalizedColor === undefined) {
return undefined;
}
if (isArbitraryValue(alpha)) {
return (0, _withAlphaVariable).withAlphaValue(normalizedColor, alpha.slice(1, -1));
}
if (((ref3 = tailwindConfig.theme) === null || ref3 === void 0 ? void 0 : (ref4 = ref3.opacity) === null || ref4 === void 0 ? void 0 : ref4[alpha]) === undefined) {
return undefined;
}
return (0, _withAlphaVariable).withAlphaValue(normalizedColor, tailwindConfig.theme.opacity[alpha]);
}
return asValue(modifier, options, {
validate: _dataTypes.color
});
}
function asLookupValue(modifier, options = {}) {
var ref;
return (ref = options.values) === null || ref === void 0 ? void 0 : ref[modifier];
}
function guess(validate) {
return (modifier, options)=>{
return asValue(modifier, options, {
validate
});
};
}
let typeMap = {
any: asValue,
color: asColor,
url: guess(_dataTypes.url),
image: guess(_dataTypes.image),
length: guess(_dataTypes.length),
percentage: guess(_dataTypes.percentage),
position: guess(_dataTypes.position),
lookup: asLookupValue,
"generic-name": guess(_dataTypes.genericName),
"family-name": guess(_dataTypes.familyName),
number: guess(_dataTypes.number),
"line-width": guess(_dataTypes.lineWidth),
"absolute-size": guess(_dataTypes.absoluteSize),
"relative-size": guess(_dataTypes.relativeSize),
shadow: guess(_dataTypes.shadow)
};
let supportedTypes = Object.keys(typeMap);
function splitAtFirst(input, delim) {
let idx = input.indexOf(delim);
if (idx === -1) return [
undefined,
input
];
return [
input.slice(0, idx),
input.slice(idx + 1)
];
}
function coerceValue(types, modifier, options, tailwindConfig) {
if (isArbitraryValue(modifier)) {
let arbitraryValue = modifier.slice(1, -1);
let [explicitType, value] = splitAtFirst(arbitraryValue, ":");
// It could be that this resolves to `url(https` which is not a valid
// identifier. We currently only support "simple" words with dashes or
// underscores. E.g.: family-name
if (!/^[\w-_]+$/g.test(explicitType)) {
value = arbitraryValue;
} else if (explicitType !== undefined && !supportedTypes.includes(explicitType)) {
return [];
}
if (value.length > 0 && supportedTypes.includes(explicitType)) {
return [
asValue(`[${value}]`, options),
explicitType
];
}
}
// Find first matching type
for (let type of [].concat(types)){
let result = typeMap[type](modifier, options, {
tailwindConfig
});
if (result !== undefined) return [
result,
type
];
}
return [];
}
-20
lib/util/prefixSelector.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = _default;
var _postcssSelectorParser = _interopRequireDefault(require("postcss-selector-parser"));
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
function _default(prefix, selector, prependNegative = false) {
return (0, _postcssSelectorParser).default((selectors)=>{
selectors.walkClasses((classSelector)=>{
let baseClass = classSelector.value;
let shouldPlaceNegativeBeforePrefix = prependNegative && baseClass.startsWith("-");
classSelector.value = shouldPlaceNegativeBeforePrefix ? `-${prefix}${baseClass.slice(1)}` : `${prefix}${baseClass}`;
});
}).processSync(selector);
}
-233
lib/util/resolveConfig.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = resolveConfig;
var _negateValue = _interopRequireDefault(require("./negateValue"));
var _corePluginList = _interopRequireDefault(require("../corePluginList"));
var _configurePlugins = _interopRequireDefault(require("./configurePlugins"));
var _defaultConfigStub = _interopRequireDefault(require("../../stubs/defaultConfig.stub"));
var _colors = _interopRequireDefault(require("../public/colors"));
var _defaults = require("./defaults");
var _toPath = require("./toPath");
var _normalizeConfig = require("./normalizeConfig");
var _isPlainObject = _interopRequireDefault(require("./isPlainObject"));
var _cloneDeep = require("./cloneDeep");
function resolveConfig(configs) {
let allConfigs = [
...extractPluginConfigs(configs),
{
prefix: "",
important: false,
separator: ":",
variantOrder: _defaultConfigStub.default.variantOrder
},
];
var ref, ref1;
return (0, _normalizeConfig).normalizeConfig((0, _defaults).defaults({
theme: resolveFunctionKeys(mergeExtensions(mergeThemes(allConfigs.map((t)=>{
return (ref = t === null || t === void 0 ? void 0 : t.theme) !== null && ref !== void 0 ? ref : {};
})))),
corePlugins: resolveCorePlugins(allConfigs.map((c)=>c.corePlugins
)),
plugins: resolvePluginLists(configs.map((c)=>{
return (ref1 = c === null || c === void 0 ? void 0 : c.plugins) !== null && ref1 !== void 0 ? ref1 : [];
}))
}, ...allConfigs));
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
function isFunction(input) {
return typeof input === "function";
}
function isObject(input) {
return typeof input === "object" && input !== null;
}
function mergeWith(target, ...sources) {
let customizer = sources.pop();
for (let source of sources){
for(let k in source){
let merged = customizer(target[k], source[k]);
if (merged === undefined) {
if (isObject(target[k]) && isObject(source[k])) {
target[k] = mergeWith(target[k], source[k], customizer);
} else {
target[k] = source[k];
}
} else {
target[k] = merged;
}
}
}
return target;
}
const configUtils = {
colors: _colors.default,
negative (scale) {
// TODO: Log that this function isn't really needed anymore?
return Object.keys(scale).filter((key)=>scale[key] !== "0"
).reduce((negativeScale, key)=>{
let negativeValue = (0, _negateValue).default(scale[key]);
if (negativeValue !== undefined) {
negativeScale[`-${key}`] = negativeValue;
}
return negativeScale;
}, {});
},
breakpoints (screens) {
return Object.keys(screens).filter((key)=>typeof screens[key] === "string"
).reduce((breakpoints, key)=>({
...breakpoints,
[`screen-${key}`]: screens[key]
})
, {});
}
};
function value(valueToResolve, ...args) {
return isFunction(valueToResolve) ? valueToResolve(...args) : valueToResolve;
}
function collectExtends(items) {
return items.reduce((merged, { extend })=>{
return mergeWith(merged, extend, (mergedValue, extendValue)=>{
if (mergedValue === undefined) {
return [
extendValue
];
}
if (Array.isArray(mergedValue)) {
return [
extendValue,
...mergedValue
];
}
return [
extendValue,
mergedValue
];
});
}, {});
}
function mergeThemes(themes) {
return {
...themes.reduce((merged, theme)=>(0, _defaults).defaults(merged, theme)
, {}),
// In order to resolve n config objects, we combine all of their `extend` properties
// into arrays instead of objects so they aren't overridden.
extend: collectExtends(themes)
};
}
function mergeExtensionCustomizer(merged, value1) {
// When we have an array of objects, we do want to merge it
if (Array.isArray(merged) && isObject(merged[0])) {
return merged.concat(value1);
}
// When the incoming value is an array, and the existing config is an object, prepend the existing object
if (Array.isArray(value1) && isObject(value1[0]) && isObject(merged)) {
return [
merged,
...value1
];
}
// Override arrays (for example for font-families, box-shadows, ...)
if (Array.isArray(value1)) {
return value1;
}
// Execute default behaviour
return undefined;
}
function mergeExtensions({ extend , ...theme }) {
return mergeWith(theme, extend, (themeValue, extensions)=>{
// The `extend` property is an array, so we need to check if it contains any functions
if (!isFunction(themeValue) && !extensions.some(isFunction)) {
return mergeWith({}, themeValue, ...extensions, mergeExtensionCustomizer);
}
return (resolveThemePath, utils)=>mergeWith({}, ...[
themeValue,
...extensions
].map((e)=>value(e, resolveThemePath, utils)
), mergeExtensionCustomizer)
;
});
}
function resolveFunctionKeys(object) {
const resolvePath = (key, defaultValue)=>{
const path = (0, _toPath).toPath(key);
let index = 0;
let val = object;
while(val !== undefined && val !== null && index < path.length){
val = val[path[index++]];
val = isFunction(val) ? val(resolvePath, configUtils) : val;
}
if (val === undefined) {
return defaultValue;
}
if ((0, _isPlainObject).default(val)) {
return (0, _cloneDeep).cloneDeep(val);
}
return val;
};
resolvePath.theme = resolvePath;
for(let key1 in configUtils){
resolvePath[key1] = configUtils[key1];
}
return Object.keys(object).reduce((resolved, key)=>{
return {
...resolved,
[key]: isFunction(object[key]) ? object[key](resolvePath, configUtils) : object[key]
};
}, {});
}
function extractPluginConfigs(configs) {
let allConfigs = [];
configs.forEach((config)=>{
allConfigs = [
...allConfigs,
config
];
var ref2;
const plugins = (ref2 = config === null || config === void 0 ? void 0 : config.plugins) !== null && ref2 !== void 0 ? ref2 : [];
if (plugins.length === 0) {
return;
}
plugins.forEach((plugin)=>{
if (plugin.__isOptionsFunction) {
plugin = plugin();
}
var ref;
allConfigs = [
...allConfigs,
...extractPluginConfigs([
(ref = plugin === null || plugin === void 0 ? void 0 : plugin.config) !== null && ref !== void 0 ? ref : {}
])
];
});
});
return allConfigs;
}
function resolveCorePlugins(corePluginConfigs) {
const result = [
...corePluginConfigs
].reduceRight((resolved, corePluginConfig)=>{
if (isFunction(corePluginConfig)) {
return corePluginConfig({
corePlugins: resolved
});
}
return (0, _configurePlugins).default(corePluginConfig, resolved);
}, _corePluginList.default);
return result;
}
function resolvePluginLists(pluginLists) {
const result = [
...pluginLists
].reduceRight((resolved, pluginList)=>{
return [
...resolved,
...pluginList
];
}, []);
return result;
}
-51
lib/util/resolveConfigPath.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = resolveConfigPath;
var _fs = _interopRequireDefault(require("fs"));
var _path = _interopRequireDefault(require("path"));
function resolveConfigPath(pathOrConfig) {
// require('tailwindcss')({ theme: ..., variants: ... })
if (isObject(pathOrConfig) && pathOrConfig.config === undefined && !isEmpty(pathOrConfig)) {
return null;
}
// require('tailwindcss')({ config: 'custom-config.js' })
if (isObject(pathOrConfig) && pathOrConfig.config !== undefined && isString(pathOrConfig.config)) {
return _path.default.resolve(pathOrConfig.config);
}
// require('tailwindcss')({ config: { theme: ..., variants: ... } })
if (isObject(pathOrConfig) && pathOrConfig.config !== undefined && isObject(pathOrConfig.config)) {
return null;
}
// require('tailwindcss')('custom-config.js')
if (isString(pathOrConfig)) {
return _path.default.resolve(pathOrConfig);
}
// require('tailwindcss')
for (const configFile of [
"./tailwind.config.js",
"./tailwind.config.cjs"
]){
try {
const configPath = _path.default.resolve(configFile);
_fs.default.accessSync(configPath);
return configPath;
} catch (err) {}
}
return null;
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
function isObject(value) {
return typeof value === "object" && value !== null;
}
function isEmpty(obj) {
return Object.keys(obj).length === 0;
}
function isString(value) {
return typeof value === "string" || value instanceof String;
}
-19
lib/util/responsive.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = responsive;
var _postcss = _interopRequireDefault(require("postcss"));
var _cloneNodes = _interopRequireDefault(require("./cloneNodes"));
function responsive(rules) {
return _postcss.default.atRule({
name: "responsive"
}).append((0, _cloneNodes).default(Array.isArray(rules) ? rules : [
rules
]));
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
-9
lib/util/tap.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.tap = tap;
function tap(value, mutator) {
mutator(value);
return value;
}
-8
lib/util/toColorValue.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = toColorValue;
function toColorValue(maybeFunction) {
return typeof maybeFunction === "function" ? maybeFunction({}) : maybeFunction;
}
-14
lib/util/toPath.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.toPath = toPath;
function toPath(path) {
if (Array.isArray(path)) return path;
let openBrackets = path.split("[").length - 1;
let closedBrackets = path.split("]").length - 1;
if (openBrackets !== closedBrackets) {
throw new Error(`Path is invalid. Has unbalanced brackets: ${path}`);
}
return path.split(/\.(?![^\[]*\])|[\[\]]/g).filter(Boolean);
}
-59
lib/util/transformThemeValue.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = transformThemeValue;
var _postcss = _interopRequireDefault(require("postcss"));
function transformThemeValue(themeSection) {
if ([
"fontSize",
"outline"
].includes(themeSection)) {
return (value)=>{
if (typeof value === "function") value = value({});
if (Array.isArray(value)) value = value[0];
return value;
};
}
if ([
"fontFamily",
"boxShadow",
"transitionProperty",
"transitionDuration",
"transitionDelay",
"transitionTimingFunction",
"backgroundImage",
"backgroundSize",
"backgroundColor",
"cursor",
"animation",
].includes(themeSection)) {
return (value)=>{
if (typeof value === "function") value = value({});
if (Array.isArray(value)) value = value.join(", ");
return value;
};
}
// For backwards compatibility reasons, before we switched to underscores
// instead of commas for arbitrary values.
if ([
"gridTemplateColumns",
"gridTemplateRows",
"objectPosition"
].includes(themeSection)) {
return (value)=>{
if (typeof value === "function") value = value({});
if (typeof value === "string") value = _postcss.default.list.comma(value).join(" ");
return value;
};
}
return (value)=>{
if (typeof value === "function") value = value({});
return value;
};
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
-67
lib/util/withAlphaVariable.js
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = withAlphaVariable;
exports.withAlphaValue = withAlphaValue;
var _color = require("./color");
function withAlphaVariable({ color , property , variable }) {
let properties = [].concat(property);
if (typeof color === "function") {
return {
[variable]: "1",
...Object.fromEntries(properties.map((p)=>{
return [
p,
color({
opacityVariable: variable,
opacityValue: `var(${variable})`
})
];
}))
};
}
const parsed = (0, _color).parseColor(color);
if (parsed === null) {
return Object.fromEntries(properties.map((p)=>[
p,
color
]
));
}
if (parsed.alpha !== undefined) {
// Has an alpha value, return color as-is
return Object.fromEntries(properties.map((p)=>[
p,
color
]
));
}
return {
[variable]: "1",
...Object.fromEntries(properties.map((p)=>{
return [
p,
(0, _color).formatColor({
...parsed,
alpha: `var(${variable})`
})
];
}))
};
}
function withAlphaValue(color, alphaValue, defaultValue) {
if (typeof color === "function") {
return color({
opacityValue: alphaValue
});
}
let parsed = (0, _color).parseColor(color);
if (parsed === null) {
return defaultValue;
}
return (0, _color).formatColor({
...parsed,
alpha: alphaValue
});
}
-2
nesting/index.js
let nesting = require('../lib/postcss-plugins/nesting')
module.exports = (nesting.__esModule ? nesting : { default: nesting }).default
peers/index.js

Sorry, the diff of this file is too big to display

-2
plugin.js
let createPlugin = require('./lib/public/create-plugin')
module.exports = (createPlugin.__esModule ? createPlugin : { default: createPlugin }).default
-19
prettier.config.js
module.exports = {
// These settings are duplicated in .editorconfig:
tabWidth: 2, // indent_size = 2
useTabs: false, // indent_style = space
endOfLine: 'lf', // end_of_line = lf
semi: false, // default: true
singleQuote: true, // default: false
printWidth: 100, // default: 80
trailingComma: 'es5',
bracketSpacing: true,
overrides: [
{
files: '*.js',
options: {
parser: 'flow',
},
},
],
}
-2
resolveConfig.js
let resolveConfig = require('./lib/public/resolve-config')
module.exports = (resolveConfig.__esModule ? resolveConfig : { default: resolveConfig }).default
-1
screens.css
@tailwind screens;
-10
scripts/create-plugin-list.js
import { corePlugins } from '../src/corePlugins'
import fs from 'fs'
import path from 'path'
let corePluginList = Object.keys(corePlugins)
fs.writeFileSync(
path.join(process.cwd(), 'src', 'corePluginList.js'),
`export default ${JSON.stringify(corePluginList)}`
)
-52
scripts/generate-types.js
import prettier from 'prettier'
import { corePlugins } from '../src/corePlugins'
import colors from '../src/public/colors'
import fs from 'fs'
import path from 'path'
fs.writeFileSync(
path.join(process.cwd(), 'types', 'generated', 'corePluginList.d.ts'),
`export type CorePluginList = ${Object.keys(corePlugins)
.map((p) => `'${p}'`)
.join(' | ')}`
)
let colorsWithoutDeprecatedColors = Object.fromEntries(
Object.entries(Object.getOwnPropertyDescriptors(colors))
.filter(([_, { value }]) => {
return typeof value !== 'undefined'
})
.map(([name, definition]) => [name, definition.value])
)
let deprecatedColors = Object.entries(Object.getOwnPropertyDescriptors(colors))
.filter(([_, { value }]) => {
return typeof value === 'undefined'
})
.map(([name, definition]) => {
let warn = console.warn
let messages = []
console.warn = (...args) => messages.push(args.pop())
definition.get()
console.warn = warn
let message = messages.join(' ').trim()
let newColor = message.match(/renamed to `(.*)`/)[1]
return `/** @deprecated ${message} */${name}: DefaultColors['${newColor}'],`
})
.join('\n')
fs.writeFileSync(
path.join(process.cwd(), 'types', 'generated', 'colors.d.ts'),
prettier.format(
`export interface DefaultColors { ${JSON.stringify(colorsWithoutDeprecatedColors).slice(
1,
-1
)}\n${deprecatedColors}\n}`,
{
semi: false,
singleQuote: true,
printWidth: 100,
parser: 'typescript',
}
)
)
-27
scripts/install-integrations.js
let fs = require('fs/promises')
let { spawn } = require('child_process')
let path = require('path')
let root = process.cwd()
function npmInstall(cwd) {
return new Promise((resolve) => {
let childProcess = spawn('npm', ['install'], { cwd })
childProcess.on('exit', resolve)
})
}
async function install() {
let base = path.resolve(root, 'integrations')
let ignoreFolders = ['node_modules']
let integrations = (await fs.readdir(base, { withFileTypes: true }))
.filter((integration) => integration.isDirectory())
.filter((integration) => !ignoreFolders.includes(integration.name))
.map((folder) => path.resolve(base, folder.name))
.concat([base])
.map((integration) => npmInstall(integration))
await Promise.all(integrations)
console.log('Done!')
}
install()
-68
scripts/rebuildFixtures.js
import fs from 'fs'
import postcss from 'postcss'
import tailwind from '..'
function build({ from, to, config }) {
return new Promise((resolve, reject) => {
console.log(`Processing ./${from}...`)
fs.readFile(`./${from}`, (err, css) => {
if (err) throw err
return postcss([tailwind(config)])
.process(css, {
from: undefined,
})
.then((result) => {
fs.writeFileSync(`./${to}`, result.css)
return result
})
.then(resolve)
.catch((error) => {
console.log(error)
reject()
})
})
})
}
console.info('\nRebuilding fixtures...\n')
Promise.all([
build({
from: 'tests/fixtures/tailwind-input.css',
to: 'tests/fixtures/tailwind-output.css',
config: {},
}),
build({
from: 'tests/fixtures/tailwind-input.css',
to: 'tests/fixtures/tailwind-output-important.css',
config: { important: true },
}),
build({
from: 'tests/fixtures/tailwind-input.css',
to: 'tests/fixtures/tailwind-output-no-color-opacity.css',
config: {
corePlugins: {
textOpacity: false,
backgroundOpacity: false,
borderOpacity: false,
placeholderOpacity: false,
divideOpacity: false,
},
},
}),
build({
from: 'tests/fixtures/tailwind-input.css',
to: 'tests/fixtures/tailwind-output-flagged.css',
config: {
future: 'all',
experimental: 'all',
},
}),
]).then(() => {
console.log('\nFinished rebuilding fixtures.')
console.log(
'\nPlease triple check that the fixture output matches what you expect before committing this change.'
)
})
-9
src/cli-peer-dependencies.js
export let postcss = require('postcss')
export function lazyAutoprefixer() {
return require('autoprefixer')
}
export function lazyCssnano() {
return require('cssnano')
}
-845
src/cli.js
#!/usr/bin/env node
import { postcss, lazyCssnano, lazyAutoprefixer } from '../peers/index.js'
import chokidar from 'chokidar'
import path from 'path'
import arg from 'arg'
import fs from 'fs'
import postcssrc from 'postcss-load-config'
import { lilconfig } from 'lilconfig'
import loadPlugins from 'postcss-load-config/src/plugins' // Little bit scary, looking at private/internal API
import tailwind from './processTailwindFeatures'
import resolveConfigInternal from '../resolveConfig'
import fastGlob from 'fast-glob'
import getModuleDependencies from './lib/getModuleDependencies'
import log from './util/log'
import packageJson from '../package.json'
import normalizePath from 'normalize-path'
let env = {
DEBUG: process.env.DEBUG !== undefined && process.env.DEBUG !== '0',
}
// ---
function indentRecursive(node, indent = 0) {
node.each &&
node.each((child, i) => {
if (!child.raws.before || !child.raws.before.trim() || child.raws.before.includes('\n')) {
child.raws.before = `\n${node.type !== 'rule' && i > 0 ? '\n' : ''}${' '.repeat(indent)}`
}
child.raws.after = `\n${' '.repeat(indent)}`
indentRecursive(child, indent + 1)
})
}
function formatNodes(root) {
indentRecursive(root)
if (root.first) {
root.first.raws.before = ''
}
}
async function outputFile(file, contents) {
if (fs.existsSync(file) && (await fs.promises.readFile(file, 'utf8')) === contents) {
return // Skip writing the file
}
// Write the file
await fs.promises.writeFile(file, contents, 'utf8')
}
function drainStdin() {
return new Promise((resolve, reject) => {
let result = ''
process.stdin.on('data', (chunk) => {
result += chunk
})
process.stdin.on('end', () => resolve(result))
process.stdin.on('error', (err) => reject(err))
})
}
function help({ message, usage, commands, options }) {
let indent = 2
// Render header
console.log()
console.log(`${packageJson.name} v${packageJson.version}`)
// Render message
if (message) {
console.log()
for (let msg of message.split('\n')) {
console.log(msg)
}
}
// Render usage
if (usage && usage.length > 0) {
console.log()
console.log('Usage:')
for (let example of usage) {
console.log(' '.repeat(indent), example)
}
}
// Render commands
if (commands && commands.length > 0) {
console.log()
console.log('Commands:')
for (let command of commands) {
console.log(' '.repeat(indent), command)
}
}
// Render options
if (options) {
let groupedOptions = {}
for (let [key, value] of Object.entries(options)) {
if (typeof value === 'object') {
groupedOptions[key] = { ...value, flags: [key] }
} else {
groupedOptions[value].flags.push(key)
}
}
console.log()
console.log('Options:')
for (let { flags, description, deprecated } of Object.values(groupedOptions)) {
if (deprecated) continue
if (flags.length === 1) {
console.log(
' '.repeat(indent + 4 /* 4 = "-i, ".length */),
flags.slice().reverse().join(', ').padEnd(20, ' '),
description
)
} else {
console.log(
' '.repeat(indent),
flags.slice().reverse().join(', ').padEnd(24, ' '),
description
)
}
}
}
console.log()
}
function oneOf(...options) {
return Object.assign(
(value = true) => {
for (let option of options) {
let parsed = option(value)
if (parsed === value) {
return parsed
}
}
throw new Error('...')
},
{ manualParsing: true }
)
}
let commands = {
init: {
run: init,
args: {
'--full': { type: Boolean, description: 'Initialize a full `tailwind.config.js` file' },
'--postcss': { type: Boolean, description: 'Initialize a `postcss.config.js` file' },
'--types': {
type: Boolean,
description: 'Add TypeScript types for the `tailwind.config.js` file',
},
'-f': '--full',
'-p': '--postcss',
},
},
build: {
run: build,
args: {
'--input': { type: String, description: 'Input file' },
'--output': { type: String, description: 'Output file' },
'--watch': { type: Boolean, description: 'Watch for changes and rebuild as needed' },
/*
'--poll': {
type: Boolean,
description: 'Use polling instead of filesystem events when watching',
},
*/
'--content': {
type: String,
description: 'Content paths to use for removing unused classes',
},
'--purge': {
type: String,
deprecated: true,
},
'--postcss': {
type: oneOf(String, Boolean),
description: 'Load custom PostCSS configuration',
},
'--minify': { type: Boolean, description: 'Minify the output' },
'--config': {
type: String,
description: 'Path to a custom config file',
},
'--no-autoprefixer': {
type: Boolean,
description: 'Disable autoprefixer',
},
'-c': '--config',
'-i': '--input',
'-o': '--output',
'-m': '--minify',
'-w': '--watch',
/*
'-p': '--poll',
*/
},
},
}
let sharedFlags = {
'--help': { type: Boolean, description: 'Display usage information' },
'-h': '--help',
}
if (
process.stdout.isTTY /* Detect redirecting output to a file */ &&
(process.argv[2] === undefined ||
process.argv.slice(2).every((flag) => sharedFlags[flag] !== undefined))
) {
help({
usage: [
'tailwindcss [--input input.css] [--output output.css] [--watch] [options...]',
'tailwindcss init [--full] [--postcss] [--types] [options...]',
],
commands: Object.keys(commands)
.filter((command) => command !== 'build')
.map((command) => `${command} [options]`),
options: { ...commands.build.args, ...sharedFlags },
})
process.exit(0)
}
let command = ((arg = '') => (arg.startsWith('-') ? undefined : arg))(process.argv[2]) || 'build'
if (commands[command] === undefined) {
if (fs.existsSync(path.resolve(command))) {
// TODO: Deprecate this in future versions
// Check if non-existing command, might be a file.
command = 'build'
} else {
help({
message: `Invalid command: ${command}`,
usage: ['tailwindcss <command> [options]'],
commands: Object.keys(commands)
.filter((command) => command !== 'build')
.map((command) => `${command} [options]`),
options: sharedFlags,
})
process.exit(1)
}
}
// Execute command
let { args: flags, run } = commands[command]
let args = (() => {
try {
let result = arg(
Object.fromEntries(
Object.entries({ ...flags, ...sharedFlags })
.filter(([_key, value]) => !value?.type?.manualParsing)
.map(([key, value]) => [key, typeof value === 'object' ? value.type : value])
),
{ permissive: true }
)
// Manual parsing of flags to allow for special flags like oneOf(Boolean, String)
for (let i = result['_'].length - 1; i >= 0; --i) {
let flag = result['_'][i]
if (!flag.startsWith('-')) continue
let flagName = flag
let handler = flags[flag]
// Resolve flagName & handler
while (typeof handler === 'string') {
flagName = handler
handler = flags[handler]
}
if (!handler) continue
let args = []
let offset = i + 1
// Parse args for current flag
while (result['_'][offset] && !result['_'][offset].startsWith('-')) {
args.push(result['_'][offset++])
}
// Cleanup manually parsed flags + args
result['_'].splice(i, 1 + args.length)
// Set the resolved value in the `result` object
result[flagName] = handler.type(
args.length === 0 ? undefined : args.length === 1 ? args[0] : args,
flagName
)
}
// Ensure that the `command` is always the first argument in the `args`.
// This is important so that we don't have to check if a default command
// (build) was used or not from within each plugin.
//
// E.g.: tailwindcss input.css -> _: ['build', 'input.css']
// E.g.: tailwindcss build input.css -> _: ['build', 'input.css']
if (result['_'][0] !== command) {
result['_'].unshift(command)
}
return result
} catch (err) {
if (err.code === 'ARG_UNKNOWN_OPTION') {
help({
message: err.message,
usage: ['tailwindcss <command> [options]'],
options: sharedFlags,
})
process.exit(1)
}
throw err
}
})()
if (args['--help']) {
help({
options: { ...flags, ...sharedFlags },
usage: [`tailwindcss ${command} [options]`],
})
process.exit(0)
}
run()
// ---
function init() {
let messages = []
let tailwindConfigLocation = path.resolve(args['_'][1] ?? './tailwind.config.js')
if (fs.existsSync(tailwindConfigLocation)) {
messages.push(`${path.basename(tailwindConfigLocation)} already exists.`)
} else {
let stubFile = fs.readFileSync(
args['--full']
? path.resolve(__dirname, '../stubs/defaultConfig.stub.js')
: path.resolve(__dirname, '../stubs/simpleConfig.stub.js'),
'utf8'
)
if (args['--types']) {
let typesHeading = "/** @type {import('tailwindcss/types').Config} */"
stubFile =
stubFile.replace(`module.exports = `, `${typesHeading}\nconst config = `) +
'\nmodule.exports = config'
}
// Change colors import
stubFile = stubFile.replace('../colors', 'tailwindcss/colors')
fs.writeFileSync(tailwindConfigLocation, stubFile, 'utf8')
messages.push(`Created Tailwind CSS config file: ${path.basename(tailwindConfigLocation)}`)
}
if (args['--postcss']) {
let postcssConfigLocation = path.resolve('./postcss.config.js')
if (fs.existsSync(postcssConfigLocation)) {
messages.push(`${path.basename(postcssConfigLocation)} already exists.`)
} else {
let stubFile = fs.readFileSync(
path.resolve(__dirname, '../stubs/defaultPostCssConfig.stub.js'),
'utf8'
)
fs.writeFileSync(postcssConfigLocation, stubFile, 'utf8')
messages.push(`Created PostCSS config file: ${path.basename(postcssConfigLocation)}`)
}
}
if (messages.length > 0) {
console.log()
for (let message of messages) {
console.log(message)
}
}
}
async function build() {
let input = args['--input']
let output = args['--output']
let shouldWatch = args['--watch']
let shouldPoll = false
/*
let shouldPoll = args['--poll']
*/
let shouldCoalesceWriteEvents = shouldPoll || process.platform === 'win32'
let includePostCss = args['--postcss']
// Polling interval in milliseconds
// Used only when polling or coalescing add/change events on Windows
let pollInterval = 10
// TODO: Deprecate this in future versions
if (!input && args['_'][1]) {
console.error('[deprecation] Running tailwindcss without -i, please provide an input file.')
input = args['--input'] = args['_'][1]
}
if (input && input !== '-' && !fs.existsSync((input = path.resolve(input)))) {
console.error(`Specified input file ${args['--input']} does not exist.`)
process.exit(9)
}
if (args['--config'] && !fs.existsSync((args['--config'] = path.resolve(args['--config'])))) {
console.error(`Specified config file ${args['--config']} does not exist.`)
process.exit(9)
}
let configPath = args['--config']
? args['--config']
: ((defaultPath) => (fs.existsSync(defaultPath) ? defaultPath : null))(
path.resolve('./tailwind.config.js')
)
async function loadPostCssPlugins() {
let customPostCssPath = typeof args['--postcss'] === 'string' ? args['--postcss'] : undefined
let { plugins: configPlugins } = customPostCssPath
? await (async () => {
let file = path.resolve(customPostCssPath)
// Implementation, see: https://unpkg.com/browse/postcss-load-config@3.1.0/src/index.js
let { config = {} } = await lilconfig('postcss').load(file)
if (typeof config === 'function') {
config = config()
} else {
config = Object.assign({}, config)
}
if (!config.plugins) {
config.plugins = []
}
return { plugins: loadPlugins(config, file) }
})()
: await postcssrc()
let configPluginTailwindIdx = configPlugins.findIndex((plugin) => {
if (typeof plugin === 'function' && plugin.name === 'tailwindcss') {
return true
}
if (typeof plugin === 'object' && plugin !== null && plugin.postcssPlugin === 'tailwindcss') {
return true
}
return false
})
let beforePlugins =
configPluginTailwindIdx === -1 ? [] : configPlugins.slice(0, configPluginTailwindIdx)
let afterPlugins =
configPluginTailwindIdx === -1
? configPlugins
: configPlugins.slice(configPluginTailwindIdx + 1)
return [beforePlugins, afterPlugins]
}
function resolveConfig() {
let config = configPath ? require(configPath) : {}
if (args['--purge']) {
log.warn('purge-flag-deprecated', [
'The `--purge` flag has been deprecated.',
'Please use `--content` instead.',
])
if (!args['--content']) {
args['--content'] = args['--purge']
}
}
if (args['--content']) {
let files = args['--content'].split(/(?<!{[^}]+),/)
let resolvedConfig = resolveConfigInternal(config, { content: { files } })
resolvedConfig.content.files = files
return resolvedConfig
}
return resolveConfigInternal(config)
}
function extractFileGlobs(config) {
return config.content.files
.filter((file) => {
// Strings in this case are files / globs. If it is something else,
// like an object it's probably a raw content object. But this object
// is not watchable, so let's remove it.
return typeof file === 'string'
})
.map((glob) => normalizePath(glob))
}
function extractRawContent(config) {
return config.content.files.filter((file) => {
return typeof file === 'object' && file !== null
})
}
function getChangedContent(config) {
let changedContent = []
// Resolve globs from the content config
let globs = extractFileGlobs(config)
let files = fastGlob.sync(globs)
for (let file of files) {
changedContent.push({
content: fs.readFileSync(path.resolve(file), 'utf8'),
extension: path.extname(file).slice(1),
})
}
// Resolve raw content in the tailwind config
for (let { raw: content, extension = 'html' } of extractRawContent(config)) {
changedContent.push({ content, extension })
}
return changedContent
}
async function buildOnce() {
let config = resolveConfig()
let changedContent = getChangedContent(config)
let tailwindPlugin = () => {
return {
postcssPlugin: 'tailwindcss',
Once(root, { result }) {
tailwind(({ createContext }) => {
return () => {
return createContext(config, changedContent)
}
})(root, result)
},
}
}
tailwindPlugin.postcss = true
let [beforePlugins, afterPlugins] = includePostCss ? await loadPostCssPlugins() : [[], []]
let plugins = [
...beforePlugins,
tailwindPlugin,
!args['--minify'] && formatNodes,
...afterPlugins,
!args['--no-autoprefixer'] &&
(() => {
// Try to load a local `autoprefixer` version first
try {
return require('autoprefixer')
} catch {}
return lazyAutoprefixer()
})(),
args['--minify'] &&
(() => {
let options = { preset: ['default', { cssDeclarationSorter: false }] }
// Try to load a local `cssnano` version first
try {
return require('cssnano')
} catch {}
return lazyCssnano()(options)
})(),
].filter(Boolean)
let processor = postcss(plugins)
function processCSS(css) {
let start = process.hrtime.bigint()
return Promise.resolve()
.then(() => (output ? fs.promises.mkdir(path.dirname(output), { recursive: true }) : null))
.then(() => processor.process(css, { from: input, to: output }))
.then((result) => {
if (!output) {
return process.stdout.write(result.css)
}
return Promise.all(
[
outputFile(output, result.css),
result.map && outputFile(output + '.map', result.map.toString()),
].filter(Boolean)
)
})
.then(() => {
let end = process.hrtime.bigint()
console.error()
console.error('Done in', (end - start) / BigInt(1e6) + 'ms.')
})
}
let css = await (() => {
// Piping in data, let's drain the stdin
if (input === '-') {
return drainStdin()
}
// Input file has been provided
if (input) {
return fs.readFileSync(path.resolve(input), 'utf8')
}
// No input file provided, fallback to default atrules
return '@tailwind base; @tailwind components; @tailwind utilities'
})()
return processCSS(css)
}
let context = null
async function startWatcher() {
let changedContent = []
let configDependencies = []
let contextDependencies = new Set()
let watcher = null
function refreshConfig() {
env.DEBUG && console.time('Module dependencies')
for (let file of configDependencies) {
delete require.cache[require.resolve(file)]
}
if (configPath) {
configDependencies = getModuleDependencies(configPath).map(({ file }) => file)
for (let dependency of configDependencies) {
contextDependencies.add(dependency)
}
}
env.DEBUG && console.timeEnd('Module dependencies')
return resolveConfig()
}
let [beforePlugins, afterPlugins] = includePostCss ? await loadPostCssPlugins() : [[], []]
let plugins = [
...beforePlugins,
'__TAILWIND_PLUGIN_POSITION__',
!args['--minify'] && formatNodes,
...afterPlugins,
!args['--no-autoprefixer'] &&
(() => {
// Try to load a local `autoprefixer` version first
try {
return require('autoprefixer')
} catch {}
return lazyAutoprefixer()
})(),
args['--minify'] &&
(() => {
let options = { preset: ['default', { cssDeclarationSorter: false }] }
// Try to load a local `cssnano` version first
try {
return require('cssnano')
} catch {}
return lazyCssnano()(options)
})(),
].filter(Boolean)
async function rebuild(config) {
env.DEBUG && console.time('Finished in')
let tailwindPlugin = () => {
return {
postcssPlugin: 'tailwindcss',
Once(root, { result }) {
env.DEBUG && console.time('Compiling CSS')
tailwind(({ createContext }) => {
console.error()
console.error('Rebuilding...')
return () => {
if (context !== null) {
context.changedContent = changedContent.splice(0)
return context
}
env.DEBUG && console.time('Creating context')
context = createContext(config, changedContent.splice(0))
env.DEBUG && console.timeEnd('Creating context')
return context
}
})(root, result)
env.DEBUG && console.timeEnd('Compiling CSS')
},
}
}
tailwindPlugin.postcss = true
let tailwindPluginIdx = plugins.indexOf('__TAILWIND_PLUGIN_POSITION__')
let copy = plugins.slice()
copy.splice(tailwindPluginIdx, 1, tailwindPlugin)
let processor = postcss(copy)
function processCSS(css) {
let start = process.hrtime.bigint()
return Promise.resolve()
.then(() =>
output ? fs.promises.mkdir(path.dirname(output), { recursive: true }) : null
)
.then(() => processor.process(css, { from: input, to: output }))
.then(async (result) => {
for (let message of result.messages) {
if (message.type === 'dependency') {
contextDependencies.add(message.file)
}
}
watcher.add([...contextDependencies])
if (!output) {
return process.stdout.write(result.css)
}
return Promise.all(
[
outputFile(output, result.css),
result.map && outputFile(output + '.map', result.map.toString()),
].filter(Boolean)
)
})
.then(() => {
let end = process.hrtime.bigint()
console.error('Done in', (end - start) / BigInt(1e6) + 'ms.')
})
.catch((err) => {
if (err.name === 'CssSyntaxError') {
console.error(err.toString())
} else {
console.error(err)
}
})
}
let css = await (() => {
// Piping in data, let's drain the stdin
if (input === '-') {
return drainStdin()
}
// Input file has been provided
if (input) {
return fs.readFileSync(path.resolve(input), 'utf8')
}
// No input file provided, fallback to default atrules
return '@tailwind base; @tailwind components; @tailwind utilities'
})()
let result = await processCSS(css)
env.DEBUG && console.timeEnd('Finished in')
return result
}
let config = refreshConfig(configPath)
if (input) {
contextDependencies.add(path.resolve(input))
}
watcher = chokidar.watch([...contextDependencies, ...extractFileGlobs(config)], {
usePolling: shouldPoll,
interval: shouldPoll ? pollInterval : undefined,
ignoreInitial: true,
awaitWriteFinish: shouldCoalesceWriteEvents
? {
stabilityThreshold: 50,
pollInterval: pollInterval,
}
: false,
})
let chain = Promise.resolve()
watcher.on('change', async (file) => {
if (contextDependencies.has(file)) {
env.DEBUG && console.time('Resolve config')
context = null
config = refreshConfig(configPath)
env.DEBUG && console.timeEnd('Resolve config')
env.DEBUG && console.time('Watch new files')
let globs = extractFileGlobs(config)
watcher.add(configDependencies)
watcher.add(globs)
env.DEBUG && console.timeEnd('Watch new files')
chain = chain.then(async () => {
changedContent.push(...getChangedContent(config))
await rebuild(config)
})
} else {
chain = chain.then(async () => {
changedContent.push({
content: fs.readFileSync(path.resolve(file), 'utf8'),
extension: path.extname(file).slice(1),
})
await rebuild(config)
})
}
})
watcher.on('add', async (file) => {
chain = chain.then(async () => {
changedContent.push({
content: fs.readFileSync(path.resolve(file), 'utf8'),
extension: path.extname(file).slice(1),
})
await rebuild(config)
})
})
chain = chain.then(() => {
changedContent.push(...getChangedContent(config))
return rebuild(config)
})
}
if (shouldWatch) {
/* Abort the watcher if stdin is closed to avoid zombie processes */
process.stdin.on('end', () => process.exit(0))
process.stdin.resume()
startWatcher()
} else {
buildOnce()
}
}
-17
src/constants.js
import path from 'path'
export const cli = 'tailwind'
export const defaultConfigFile = './tailwind.config.js'
export const defaultPostCssConfigFile = './postcss.config.js'
export const cjsConfigFile = './tailwind.config.cjs'
export const cjsPostCssConfigFile = './postcss.config.cjs'
export const supportedConfigFiles = [cjsConfigFile, defaultConfigFile]
export const supportedPostCssConfigFile = [cjsPostCssConfigFile, defaultPostCssConfigFile]
export const defaultConfigStubFile = path.resolve(__dirname, '../stubs/defaultConfig.stub.js')
export const simpleConfigStubFile = path.resolve(__dirname, '../stubs/simpleConfig.stub.js')
export const defaultPostCssConfigStubFile = path.resolve(
__dirname,
'../stubs/defaultPostCssConfig.stub.js'
)
-1
src/corePluginList.js
export default ["preflight","container","accessibility","pointerEvents","visibility","position","inset","isolation","zIndex","order","gridColumn","gridColumnStart","gridColumnEnd","gridRow","gridRowStart","gridRowEnd","float","clear","margin","boxSizing","display","aspectRatio","height","maxHeight","minHeight","width","minWidth","maxWidth","flex","flexShrink","flexGrow","flexBasis","tableLayout","borderCollapse","transformOrigin","translate","rotate","skew","scale","transform","animation","cursor","touchAction","userSelect","resize","scrollSnapType","scrollSnapAlign","scrollSnapStop","scrollMargin","scrollPadding","listStylePosition","listStyleType","appearance","columns","breakBefore","breakInside","breakAfter","gridAutoColumns","gridAutoFlow","gridAutoRows","gridTemplateColumns","gridTemplateRows","flexDirection","flexWrap","placeContent","placeItems","alignContent","alignItems","justifyContent","justifyItems","gap","space","divideWidth","divideStyle","divideColor","divideOpacity","placeSelf","alignSelf","justifySelf","overflow","overscrollBehavior","scrollBehavior","textOverflow","whitespace","wordBreak","borderRadius","borderWidth","borderStyle","borderColor","borderOpacity","backgroundColor","backgroundOpacity","backgroundImage","gradientColorStops","boxDecorationBreak","backgroundSize","backgroundAttachment","backgroundClip","backgroundPosition","backgroundRepeat","backgroundOrigin","fill","stroke","strokeWidth","objectFit","objectPosition","padding","textAlign","textIndent","verticalAlign","fontFamily","fontSize","fontWeight","textTransform","fontStyle","fontVariantNumeric","lineHeight","letterSpacing","textColor","textOpacity","textDecoration","textDecorationColor","textDecorationStyle","textDecorationThickness","textUnderlineOffset","fontSmoothing","placeholderColor","placeholderOpacity","caretColor","accentColor","opacity","backgroundBlendMode","mixBlendMode","boxShadow","boxShadowColor","outlineStyle","outlineWidth","outlineOffset","outlineColor","ringWidth","ringColor","ringOpacity","ringOffsetWidth","ringOffsetColor","blur","brightness","contrast","dropShadow","grayscale","hueRotate","invert","saturate","sepia","filter","backdropBlur","backdropBrightness","backdropContrast","backdropGrayscale","backdropHueRotate","backdropInvert","backdropOpacity","backdropSaturate","backdropSepia","backdropFilter","transitionProperty","transitionDelay","transitionDuration","transitionTimingFunction","willChange","content"]
src/corePlugins.js

Sorry, the diff of this file is too big to display

-25
src/css/LICENSE
MIT License
Copyright (c) Nicolas Gallagher
Copyright (c) Jonathan Neal
Copyright (c) Sindre Sorhus <sindresorhus@gmail.com> (sindresorhus.com)
Copyright (c) Adam Wathan
Copyright (c) Jonathan Reinink
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
-367
src/css/preflight.css
/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/
*,
::before,
::after {
box-sizing: border-box; /* 1 */
border-width: 0; /* 2 */
border-style: solid; /* 2 */
border-color: theme('borderColor.DEFAULT', currentColor); /* 2 */
}
::before,
::after {
--tw-content: '';
}
/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
*/
html {
line-height: 1.5; /* 1 */
-webkit-text-size-adjust: 100%; /* 2 */
-moz-tab-size: 4; /* 3 */
tab-size: 4; /* 3 */
font-family: theme('fontFamily.sans', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); /* 4 */
}
/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/
body {
margin: 0; /* 1 */
line-height: inherit; /* 2 */
}
/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/
hr {
height: 0; /* 1 */
color: inherit; /* 2 */
border-top-width: 1px; /* 3 */
}
/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/
abbr:where([title]) {
text-decoration: underline dotted;
}
/*
Remove the default font size and weight for headings.
*/
h1,
h2,
h3,
h4,
h5,
h6 {
font-size: inherit;
font-weight: inherit;
}
/*
Reset links to optimize for opt-in styling instead of opt-out.
*/
a {
color: inherit;
text-decoration: inherit;
}
/*
Add the correct font weight in Edge and Safari.
*/
b,
strong {
font-weight: bolder;
}
/*
1. Use the user's configured `mono` font family by default.
2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp,
pre {
font-family: theme('fontFamily.mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); /* 1 */
font-size: 1em; /* 2 */
}
/*
Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/
table {
text-indent: 0; /* 1 */
border-color: inherit; /* 2 */
border-collapse: collapse; /* 3 */
}
/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/
button,
input,
optgroup,
select,
textarea {
font-family: inherit; /* 1 */
font-size: 100%; /* 1 */
line-height: inherit; /* 1 */
color: inherit; /* 1 */
margin: 0; /* 2 */
padding: 0; /* 3 */
}
/*
Remove the inheritance of text transform in Edge and Firefox.
*/
button,
select {
text-transform: none;
}
/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/
button,
[type='button'],
[type='reset'],
[type='submit'] {
-webkit-appearance: button; /* 1 */
background-color: transparent; /* 2 */
background-image: none; /* 2 */
}
/*
Use the modern Firefox focus style for all focusable elements.
*/
:-moz-focusring {
outline: auto;
}
/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/
:-moz-ui-invalid {
box-shadow: none;
}
/*
Add the correct vertical alignment in Chrome and Firefox.
*/
progress {
vertical-align: baseline;
}
/*
Correct the cursor style of increment and decrement buttons in Safari.
*/
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
height: auto;
}
/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/
[type='search'] {
-webkit-appearance: textfield; /* 1 */
outline-offset: -2px; /* 2 */
}
/*
Remove the inner padding in Chrome and Safari on macOS.
*/
::-webkit-search-decoration {
-webkit-appearance: none;
}
/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button; /* 1 */
font: inherit; /* 2 */
}
/*
Add the correct display in Chrome and Safari.
*/
summary {
display: list-item;
}
/*
Removes the default spacing and border for appropriate elements.
*/
blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
margin: 0;
}
fieldset {
margin: 0;
padding: 0;
}
legend {
padding: 0;
}
ol,
ul,
menu {
list-style: none;
margin: 0;
padding: 0;
}
/*
Prevent resizing textareas horizontally by default.
*/
textarea {
resize: vertical;
}
/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/
input::placeholder,
textarea::placeholder {
opacity: 1; /* 1 */
color: theme('colors.gray.400', #9ca3af); /* 2 */
}
/*
Set the default cursor for buttons.
*/
button,
[role="button"] {
cursor: pointer;
}
/*
Make sure disabled buttons don't get the pointer cursor.
*/
:disabled {
cursor: default;
}
/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
This can trigger a poorly considered lint error in some tools but is included by design.
*/
img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
display: block; /* 1 */
vertical-align: middle; /* 2 */
}
/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/
img,
video {
max-width: 100%;
height: auto;
}
/*
Ensure the default browser behavior of the `hidden` attribute.
*/
[hidden] {
display: none;
}
-54
src/featureFlags.js
import colors from 'picocolors'
import log from './util/log'
let defaults = {
optimizeUniversalDefaults: false,
}
let featureFlags = {
future: [],
experimental: ['optimizeUniversalDefaults'],
}
export function flagEnabled(config, flag) {
if (featureFlags.future.includes(flag)) {
return config.future === 'all' || (config?.future?.[flag] ?? defaults[flag] ?? false)
}
if (featureFlags.experimental.includes(flag)) {
return (
config.experimental === 'all' || (config?.experimental?.[flag] ?? defaults[flag] ?? false)
)
}
return false
}
function experimentalFlagsEnabled(config) {
if (config.experimental === 'all') {
return featureFlags.experimental
}
return Object.keys(config?.experimental ?? {}).filter(
(flag) => featureFlags.experimental.includes(flag) && config.experimental[flag]
)
}
export function issueFlagNotices(config) {
if (process.env.JEST_WORKER_ID !== undefined) {
return
}
if (experimentalFlagsEnabled(config).length > 0) {
let changes = experimentalFlagsEnabled(config)
.map((s) => colors.yellow(s))
.join(', ')
log.warn('experimental-flags-enabled', [
`You have enabled experimental features: ${changes}`,
'Experimental features in Tailwind CSS are not covered by semver, may introduce breaking changes, and can change at any time.',
])
}
}
export default featureFlags
-44
src/index.js
import setupTrackingContext from './lib/setupTrackingContext'
import processTailwindFeatures from './processTailwindFeatures'
import { env } from './lib/sharedState'
module.exports = function tailwindcss(configOrPath) {
return {
postcssPlugin: 'tailwindcss',
plugins: [
env.DEBUG &&
function (root) {
console.log('\n')
console.time('JIT TOTAL')
return root
},
function (root, result) {
let context = setupTrackingContext(configOrPath)
/*
if (root.type === 'document') {
let roots = root.nodes.filter((node) => node.type === 'root')
for (const root of roots) {
if (root.type === 'root') {
processTailwindFeatures(context)(root, result)
}
}
return
}
*/
processTailwindFeatures(context)(root, result)
},
env.DEBUG &&
function (root) {
console.timeEnd('JIT TOTAL')
console.log('\n')
return root
},
].filter(Boolean),
}
}
module.exports.postcss = true
-52
src/lib/cacheInvalidation.js
import crypto from 'crypto'
import * as sharedState from './sharedState'
/**
* Calculate the hash of a string.
*
* This doesn't need to be cryptographically secure or
* anything like that since it's used only to detect
* when the CSS changes to invalidate the context.
*
* This is wrapped in a try/catch because it's really dependent
* on how Node itself is build and the environment and OpenSSL
* version / build that is installed on the user's machine.
*
* Based on the environment this can just outright fail.
*
* See https://github.com/nodejs/node/issues/40455
*
* @param {string} str
*/
function getHash(str) {
try {
return crypto.createHash('md5').update(str, 'utf-8').digest('binary')
} catch (err) {
return ''
}
}
/**
* Determine if the CSS tree is different from the
* previous version for the given `sourcePath`.
*
* @param {string} sourcePath
* @param {import('postcss').Node} root
*/
export function hasContentChanged(sourcePath, root) {
let css = root.toString()
// We only care about files with @tailwind directives
// Other files use an existing context
if (!css.includes('@tailwind')) {
return false
}
let existingHash = sharedState.sourceHashMap.get(sourcePath)
let rootHash = getHash(css)
let didChange = existingHash !== rootHash
sharedState.sourceHashMap.set(sourcePath, rootHash)
return didChange
}
-54
src/lib/collapseAdjacentRules.js
let comparisonMap = {
atrule: ['name', 'params'],
rule: ['selector'],
}
let types = new Set(Object.keys(comparisonMap))
export default function collapseAdjacentRules() {
function collapseRulesIn(root) {
let currentRule = null
root.each((node) => {
if (!types.has(node.type)) {
currentRule = null
return
}
if (currentRule === null) {
currentRule = node
return
}
let properties = comparisonMap[node.type]
if (node.type === 'atrule' && node.name === 'font-face') {
currentRule = node
} else if (
properties.every(
(property) =>
(node[property] ?? '').replace(/\s+/g, ' ') ===
(currentRule[property] ?? '').replace(/\s+/g, ' ')
)
) {
currentRule.append(node.nodes)
node.remove()
} else {
currentRule = node
}
})
// After we've collapsed adjacent rules & at-rules, we need to collapse
// adjacent rules & at-rules that are children of at-rules.
// We do not care about nesting rules because Tailwind CSS
// explicitly does not handle rule nesting on its own as
// the user is expected to use a nesting plugin
root.each((node) => {
if (node.type === 'atrule') {
collapseRulesIn(node)
}
})
}
return (root) => {
collapseRulesIn(root)
}
}
-93
src/lib/collapseDuplicateDeclarations.js
export default function collapseDuplicateDeclarations() {
return (root) => {
root.walkRules((node) => {
let seen = new Map()
let droppable = new Set([])
let byProperty = new Map()
node.walkDecls((decl) => {
// This could happen if we have nested selectors. In that case the
// parent will loop over all its declarations but also the declarations
// of nested rules. With this we ensure that we are shallowly checking
// declarations.
if (decl.parent !== node) {
return
}
if (seen.has(decl.prop)) {
// Exact same value as what we have seen so far
if (seen.get(decl.prop).value === decl.value) {
// Keep the last one, drop the one we've seen so far
droppable.add(seen.get(decl.prop))
// Override the existing one with the new value. This is necessary
// so that if we happen to have more than one declaration with the
// same value, that we keep removing the previous one. Otherwise we
// will only remove the *first* one.
seen.set(decl.prop, decl)
return
}
// Not the same value, so we need to check if we can merge it so
// let's collect it first.
if (!byProperty.has(decl.prop)) {
byProperty.set(decl.prop, new Set())
}
byProperty.get(decl.prop).add(seen.get(decl.prop))
byProperty.get(decl.prop).add(decl)
}
seen.set(decl.prop, decl)
})
// Drop all the duplicate declarations with the exact same value we've
// already seen so far.
for (let decl of droppable) {
decl.remove()
}
// Analyze the declarations based on its unit, drop all the declarations
// with the same unit but the last one in the list.
for (let declarations of byProperty.values()) {
let byUnit = new Map()
for (let decl of declarations) {
let unit = resolveUnit(decl.value)
if (unit === null) {
// We don't have a unit, so should never try and collapse this
// value. This is because we can't know how to do it in a correct
// way (e.g.: overrides for older browsers)
continue
}
if (!byUnit.has(unit)) {
byUnit.set(unit, new Set())
}
byUnit.get(unit).add(decl)
}
for (let declarations of byUnit.values()) {
// Get all but the last one
let removableDeclarations = Array.from(declarations).slice(0, -1)
for (let decl of removableDeclarations) {
decl.remove()
}
}
}
})
}
}
let UNITLESS_NUMBER = Symbol('unitless-number')
function resolveUnit(input) {
let result = /^-?\d*.?\d+([\w%]+)?$/g.exec(input)
if (result) {
return result[1] ?? UNITLESS_NUMBER
}
return null
}
-50
src/lib/defaultExtractor.js
const PATTERNS = [
/(?:\['([^'\s]+[^<>"'`\s:\\])')/.source, // ['text-lg' -> text-lg
/(?:\["([^"\s]+[^<>"'`\s:\\])")/.source, // ["text-lg" -> text-lg
/(?:\[`([^`\s]+[^<>"'`\s:\\])`)/.source, // [`text-lg` -> text-lg
/([^${(<>"'`\s]*\[\w*'[^"`\s]*'?\])/.source, // font-['some_font',sans-serif]
/([^${(<>"'`\s]*\[\w*"[^'`\s]*"?\])/.source, // font-["some_font",sans-serif]
/([^<>"'`\s]*\[\w*\('[^"'`\s]*'\)\])/.source, // bg-[url('...')]
/([^<>"'`\s]*\[\w*\("[^"'`\s]*"\)\])/.source, // bg-[url("...")]
/([^<>"'`\s]*\[\w*\('[^"`\s]*'\)\])/.source, // bg-[url('...'),url('...')]
/([^<>"'`\s]*\[\w*\("[^'`\s]*"\)\])/.source, // bg-[url("..."),url("...")]
/([^<>"'`\s]*\[[^<>"'`\s]*\('[^"`\s]*'\)+\])/.source, // h-[calc(100%-theme('spacing.1'))]
/([^<>"'`\s]*\[[^<>"'`\s]*\("[^'`\s]*"\)+\])/.source, // h-[calc(100%-theme("spacing.1"))]
/([^${(<>"'`\s]*\['[^"'`\s]*'\])/.source, // `content-['hello']` but not `content-['hello']']`
/([^${(<>"'`\s]*\["[^"'`\s]*"\])/.source, // `content-["hello"]` but not `content-["hello"]"]`
/([^<>"'`\s]*\[[^<>"'`\s]*:[^\]\s]*\])/.source, // `[attr:value]`
/([^<>"'`\s]*\[[^<>"'`\s]*:'[^"'`\s]*'\])/.source, // `[content:'hello']` but not `[content:"hello"]`
/([^<>"'`\s]*\[[^<>"'`\s]*:"[^"'`\s]*"\])/.source, // `[content:"hello"]` but not `[content:'hello']`
/([^<>"'`\s]*\[[^"'`\s]+\][^<>"'`\s]*)/.source, // `fill-[#bada55]`, `fill-[#bada55]/50`
/([^"'`\s]*[^<>"'`\s:\\])/.source, // `<sm:underline`, `md>:font-bold`
/([^<>"'`\s]*[^"'`\s:\\])/.source, // `px-1.5`, `uppercase` but not `uppercase:`
// Arbitrary properties
// /([^"\s]*\[[^\s]+?\][^"\s]*)/.source,
// /([^'\s]*\[[^\s]+?\][^'\s]*)/.source,
// /([^`\s]*\[[^\s]+?\][^`\s]*)/.source,
].join('|')
const BROAD_MATCH_GLOBAL_REGEXP = new RegExp(PATTERNS, 'g')
const INNER_MATCH_GLOBAL_REGEXP = /[^<>"'`\s.(){}[\]#=%$]*[^<>"'`\s.(){}[\]#=%:$]/g
/**
* @param {string} content
*/
export function defaultExtractor(content) {
let broadMatches = content.matchAll(BROAD_MATCH_GLOBAL_REGEXP)
let innerMatches = content.match(INNER_MATCH_GLOBAL_REGEXP) || []
let results = [...broadMatches, ...innerMatches].flat().filter((v) => v !== undefined)
return results
}
// Regular utilities
// {{modifier}:}*{namespace}{-{suffix}}*{/{opacityModifier}}?
// Arbitrary values
// {{modifier}:}*{namespace}-[{arbitraryValue}]{/{opacityModifier}}?
// arbitraryValue: no whitespace, balanced quotes unless within quotes, balanced brackets unless within quotes
// Arbitrary properties
// {{modifier}:}*[{validCssPropertyName}:{arbitraryValue}]
-39
src/lib/detectNesting.js
export default function (_context) {
return (root, result) => {
let found = false
root.walkAtRules('tailwind', (node) => {
if (found) return false
if (node.parent && node.parent.type !== 'root') {
found = true
node.warn(
result,
[
'Nested @tailwind rules were detected, but are not supported.',
"Consider using a prefix to scope Tailwind's classes: https://tailwindcss.com/docs/configuration#prefix",
'Alternatively, use the important selector strategy: https://tailwindcss.com/docs/configuration#selector-strategy',
].join('\n')
)
return false
}
})
root.walkRules((rule) => {
if (found) return false
rule.walkRules((nestedRule) => {
found = true
nestedRule.warn(
result,
[
'Nested CSS was detected, but CSS nesting has not been configured correctly.',
'Please enable a CSS nesting plugin *before* Tailwind in your configuration.',
'See how here: https://tailwindcss.com/docs/using-with-preprocessors#nesting',
].join('\n')
)
return false
})
})
}
}
-198
src/lib/evaluateTailwindFunctions.js
import dlv from 'dlv'
import didYouMean from 'didyoumean'
import transformThemeValue from '../util/transformThemeValue'
import parseValue from 'postcss-value-parser'
import { normalizeScreens } from '../util/normalizeScreens'
import buildMediaQuery from '../util/buildMediaQuery'
import { toPath } from '../util/toPath'
function isObject(input) {
return typeof input === 'object' && input !== null
}
function findClosestExistingPath(theme, path) {
let parts = toPath(path)
do {
parts.pop()
if (dlv(theme, parts) !== undefined) break
} while (parts.length)
return parts.length ? parts : undefined
}
function pathToString(path) {
if (typeof path === 'string') return path
return path.reduce((acc, cur, i) => {
if (cur.includes('.')) return `${acc}[${cur}]`
return i === 0 ? cur : `${acc}.${cur}`
}, '')
}
function list(items) {
return items.map((key) => `'${key}'`).join(', ')
}
function listKeys(obj) {
return list(Object.keys(obj))
}
function validatePath(config, path, defaultValue) {
const pathString = Array.isArray(path)
? pathToString(path)
: path.replace(/^['"]+/g, '').replace(/['"]+$/g, '')
const pathSegments = Array.isArray(path) ? path : toPath(pathString)
const value = dlv(config.theme, pathSegments, defaultValue)
if (value === undefined) {
let error = `'${pathString}' does not exist in your theme config.`
const parentSegments = pathSegments.slice(0, -1)
const parentValue = dlv(config.theme, parentSegments)
if (isObject(parentValue)) {
const validKeys = Object.keys(parentValue).filter(
(key) => validatePath(config, [...parentSegments, key]).isValid
)
const suggestion = didYouMean(pathSegments[pathSegments.length - 1], validKeys)
if (suggestion) {
error += ` Did you mean '${pathToString([...parentSegments, suggestion])}'?`
} else if (validKeys.length > 0) {
error += ` '${pathToString(parentSegments)}' has the following valid keys: ${list(
validKeys
)}`
}
} else {
const closestPath = findClosestExistingPath(config.theme, pathString)
if (closestPath) {
const closestValue = dlv(config.theme, closestPath)
if (isObject(closestValue)) {
error += ` '${pathToString(closestPath)}' has the following keys: ${listKeys(
closestValue
)}`
} else {
error += ` '${pathToString(closestPath)}' is not an object.`
}
} else {
error += ` Your theme has the following top-level keys: ${listKeys(config.theme)}`
}
}
return {
isValid: false,
error,
}
}
if (
!(
typeof value === 'string' ||
typeof value === 'number' ||
typeof value === 'function' ||
value instanceof String ||
value instanceof Number ||
Array.isArray(value)
)
) {
let error = `'${pathString}' was found but does not resolve to a string.`
if (isObject(value)) {
let validKeys = Object.keys(value).filter(
(key) => validatePath(config, [...pathSegments, key]).isValid
)
if (validKeys.length) {
error += ` Did you mean something like '${pathToString([...pathSegments, validKeys[0]])}'?`
}
}
return {
isValid: false,
error,
}
}
const [themeSection] = pathSegments
return {
isValid: true,
value: transformThemeValue(themeSection)(value),
}
}
function extractArgs(node, vNodes, functions) {
vNodes = vNodes.map((vNode) => resolveVNode(node, vNode, functions))
let args = ['']
for (let vNode of vNodes) {
if (vNode.type === 'div' && vNode.value === ',') {
args.push('')
} else {
args[args.length - 1] += parseValue.stringify(vNode)
}
}
return args
}
function resolveVNode(node, vNode, functions) {
if (vNode.type === 'function' && functions[vNode.value] !== undefined) {
let args = extractArgs(node, vNode.nodes, functions)
vNode.type = 'word'
vNode.value = functions[vNode.value](node, ...args)
}
return vNode
}
function resolveFunctions(node, input, functions) {
return parseValue(input)
.walk((vNode) => {
resolveVNode(node, vNode, functions)
})
.toString()
}
let nodeTypePropertyMap = {
atrule: 'params',
decl: 'value',
}
export default function ({ tailwindConfig: config }) {
let functions = {
theme: (node, path, ...defaultValue) => {
const { isValid, value, error } = validatePath(
config,
path,
defaultValue.length ? defaultValue : undefined
)
if (!isValid) {
throw node.error(error)
}
return value
},
screen: (node, screen) => {
screen = screen.replace(/^['"]+/g, '').replace(/['"]+$/g, '')
let screens = normalizeScreens(config.theme.screens)
let screenDefinition = screens.find(({ name }) => name === screen)
if (!screenDefinition) {
throw node.error(`The '${screen}' screen does not exist in your theme.`)
}
return buildMediaQuery(screenDefinition)
},
}
return (root) => {
root.walk((node) => {
let property = nodeTypePropertyMap[node.type]
if (property === undefined) {
return
}
node[property] = resolveFunctions(node, node[property], functions)
})
}
}
-480
src/lib/expandApplyAtRules.js
import postcss from 'postcss'
import parser from 'postcss-selector-parser'
import { resolveMatches } from './generateRules'
import bigSign from '../util/bigSign'
import escapeClassName from '../util/escapeClassName'
/** @typedef {Map<string, [any, import('postcss').Rule[]]>} ApplyCache */
function extractClasses(node) {
let classes = new Set()
let container = postcss.root({ nodes: [node.clone()] })
container.walkRules((rule) => {
parser((selectors) => {
selectors.walkClasses((classSelector) => {
classes.add(classSelector.value)
})
}).processSync(rule.selector)
})
return Array.from(classes)
}
function extractBaseCandidates(candidates, separator) {
let baseClasses = new Set()
for (let candidate of candidates) {
baseClasses.add(candidate.split(separator).pop())
}
return Array.from(baseClasses)
}
function prefix(context, selector) {
let prefix = context.tailwindConfig.prefix
return typeof prefix === 'function' ? prefix(selector) : prefix + selector
}
function* pathToRoot(node) {
yield node
while (node.parent) {
yield node.parent
node = node.parent
}
}
/**
* Only clone the node itself and not its children
*
* @param {*} node
* @param {*} overrides
* @returns
*/
function shallowClone(node, overrides = {}) {
let children = node.nodes
node.nodes = []
let tmp = node.clone(overrides)
node.nodes = children
return tmp
}
/**
* Clone just the nodes all the way to the top that are required to represent
* this singular rule in the tree.
*
* For example, if we have CSS like this:
* ```css
* @media (min-width: 768px) {
* @supports (display: grid) {
* .foo {
* display: grid;
* grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
* }
* }
*
* @supports (backdrop-filter: blur(1px)) {
* .bar {
* backdrop-filter: blur(1px);
* }
* }
*
* .baz {
* color: orange;
* }
* }
* ```
*
* And we're cloning `.bar` it'll return a cloned version of what's required for just that single node:
*
* ```css
* @media (min-width: 768px) {
* @supports (backdrop-filter: blur(1px)) {
* .bar {
* backdrop-filter: blur(1px);
* }
* }
* }
* ```
*
* @param {import('postcss').Node} node
*/
function nestedClone(node) {
for (let parent of pathToRoot(node)) {
if (node === parent) {
continue
}
if (parent.type === 'root') {
break
}
node = shallowClone(parent, {
nodes: [node],
})
}
return node
}
/**
* @param {import('postcss').Root} root
*/
function buildLocalApplyCache(root, context) {
/** @type {ApplyCache} */
let cache = new Map()
let highestOffset = context.layerOrder.user >> 4n
root.walkRules((rule, idx) => {
// Ignore rules generated by Tailwind
for (let node of pathToRoot(rule)) {
if (node.raws.tailwind?.layer !== undefined) {
return
}
}
// Clone what's required to represent this singular rule in the tree
let container = nestedClone(rule)
for (let className of extractClasses(rule)) {
let list = cache.get(className) || []
cache.set(className, list)
list.push([
{
layer: 'user',
sort: BigInt(idx) + highestOffset,
important: false,
},
container,
])
}
})
return cache
}
/**
* @returns {ApplyCache}
*/
function buildApplyCache(applyCandidates, context) {
for (let candidate of applyCandidates) {
if (context.notClassCache.has(candidate) || context.applyClassCache.has(candidate)) {
continue
}
if (context.classCache.has(candidate)) {
context.applyClassCache.set(
candidate,
context.classCache.get(candidate).map(([meta, rule]) => [meta, rule.clone()])
)
continue
}
let matches = Array.from(resolveMatches(candidate, context))
if (matches.length === 0) {
context.notClassCache.add(candidate)
continue
}
context.applyClassCache.set(candidate, matches)
}
return context.applyClassCache
}
/**
* Build a cache only when it's first used
*
* @param {() => ApplyCache} buildCacheFn
* @returns {ApplyCache}
*/
function lazyCache(buildCacheFn) {
let cache = null
return {
get: (name) => {
cache = cache || buildCacheFn()
return cache.get(name)
},
has: (name) => {
cache = cache || buildCacheFn()
return cache.has(name)
},
}
}
/**
* Take a series of multiple caches and merge
* them so they act like one large cache
*
* @param {ApplyCache[]} caches
* @returns {ApplyCache}
*/
function combineCaches(caches) {
return {
get: (name) => caches.flatMap((cache) => cache.get(name) || []),
has: (name) => caches.some((cache) => cache.has(name)),
}
}
function extractApplyCandidates(params) {
let candidates = params.split(/[\s\t\n]+/g)
if (candidates[candidates.length - 1] === '!important') {
return [candidates.slice(0, -1), true]
}
return [candidates, false]
}
function processApply(root, context, localCache) {
let applyCandidates = new Set()
// Collect all @apply rules and candidates
let applies = []
root.walkAtRules('apply', (rule) => {
let [candidates] = extractApplyCandidates(rule.params)
for (let util of candidates) {
applyCandidates.add(util)
}
applies.push(rule)
})
// Start the @apply process if we have rules with @apply in them
if (applies.length > 0) {
// Fill up some caches!
let applyClassCache = combineCaches([localCache, buildApplyCache(applyCandidates, context)])
/**
* When we have an apply like this:
*
* .abc {
* @apply hover:font-bold;
* }
*
* What we essentially will do is resolve to this:
*
* .abc {
* @apply .hover\:font-bold:hover {
* font-weight: 500;
* }
* }
*
* Notice that the to-be-applied class is `.hover\:font-bold:hover` and that the utility candidate was `hover:font-bold`.
* What happens in this function is that we prepend a `.` and escape the candidate.
* This will result in `.hover\:font-bold`
* Which means that we can replace `.hover\:font-bold` with `.abc` in `.hover\:font-bold:hover` resulting in `.abc:hover`
*/
// TODO: Should we use postcss-selector-parser for this instead?
function replaceSelector(selector, utilitySelectors, candidate) {
let needle = `.${escapeClassName(candidate)}`
let utilitySelectorsList = utilitySelectors.split(/\s*\,(?![^(]*\))\s*/g)
return selector
.split(/\s*\,(?![^(]*\))\s*/g)
.map((s) => {
let replaced = []
for (let utilitySelector of utilitySelectorsList) {
let replacedSelector = utilitySelector.replace(needle, s)
if (replacedSelector === utilitySelector) {
continue
}
replaced.push(replacedSelector)
}
return replaced.join(', ')
})
.join(', ')
}
let perParentApplies = new Map()
// Collect all apply candidates and their rules
for (let apply of applies) {
let candidates = perParentApplies.get(apply.parent) || []
perParentApplies.set(apply.parent, [candidates, apply.source])
let [applyCandidates, important] = extractApplyCandidates(apply.params)
if (apply.parent.type === 'atrule') {
if (apply.parent.name === 'screen') {
const screenType = apply.parent.params
throw apply.error(
`@apply is not supported within nested at-rules like @screen. We suggest you write this as @apply ${applyCandidates
.map((c) => `${screenType}:${c}`)
.join(' ')} instead.`
)
}
throw apply.error(
`@apply is not supported within nested at-rules like @${apply.parent.name}. You can fix this by un-nesting @${apply.parent.name}.`
)
}
for (let applyCandidate of applyCandidates) {
if ([prefix(context, 'group'), prefix(context, 'peer')].includes(applyCandidate)) {
// TODO: Link to specific documentation page with error code.
throw apply.error(`@apply should not be used with the '${applyCandidate}' utility`)
}
if (!applyClassCache.has(applyCandidate)) {
throw apply.error(
`The \`${applyCandidate}\` class does not exist. If \`${applyCandidate}\` is a custom class, make sure it is defined within a \`@layer\` directive.`
)
}
let rules = applyClassCache.get(applyCandidate)
candidates.push([applyCandidate, important, rules])
}
}
for (const [parent, [candidates, atApplySource]] of perParentApplies) {
let siblings = []
for (let [applyCandidate, important, rules] of candidates) {
for (let [meta, node] of rules) {
let parentClasses = extractClasses(parent)
let nodeClasses = extractClasses(node)
// Add base utility classes from the @apply node to the list of
// classes to check whether it intersects and therefore results in a
// circular dependency or not.
//
// E.g.:
// .foo {
// @apply hover:a; // This applies "a" but with a modifier
// }
//
// We only have to do that with base classes of the `node`, not of the `parent`
// E.g.:
// .hover\:foo {
// @apply bar;
// }
// .bar {
// @apply foo;
// }
//
// This should not result in a circular dependency because we are
// just applying `.foo` and the rule above is `.hover\:foo` which is
// unrelated. However, if we were to apply `hover:foo` then we _did_
// have to include this one.
nodeClasses = nodeClasses.concat(
extractBaseCandidates(nodeClasses, context.tailwindConfig.separator)
)
let intersects = parentClasses.some((selector) => nodeClasses.includes(selector))
if (intersects) {
throw node.error(
`You cannot \`@apply\` the \`${applyCandidate}\` utility here because it creates a circular dependency.`
)
}
let root = postcss.root({ nodes: [node.clone()] })
// Make sure every node in the entire tree points back at the @apply rule that generated it
root.walk((node) => {
node.source = atApplySource
})
let canRewriteSelector =
node.type !== 'atrule' || (node.type === 'atrule' && node.name !== 'keyframes')
if (canRewriteSelector) {
root.walkRules((rule) => {
// Let's imagine you have the following structure:
//
// .foo {
// @apply bar;
// }
//
// @supports (a: b) {
// .bar {
// color: blue
// }
//
// .something-unrelated {}
// }
//
// In this case we want to apply `.bar` but it happens to be in
// an atrule node. We clone that node instead of the nested one
// because we still want that @supports rule to be there once we
// applied everything.
//
// However it happens to be that the `.something-unrelated` is
// also in that same shared @supports atrule. This is not good,
// and this should not be there. The good part is that this is
// a clone already and it can be safely removed. The question is
// how do we know we can remove it. Basically what we can do is
// match it against the applyCandidate that you want to apply. If
// it doesn't match the we can safely delete it.
//
// If we didn't do this, then the `replaceSelector` function
// would have replaced this with something that didn't exist and
// therefore it removed the selector altogether. In this specific
// case it would result in `{}` instead of `.something-unrelated {}`
if (!extractClasses(rule).some((candidate) => candidate === applyCandidate)) {
rule.remove()
return
}
rule.selector = replaceSelector(parent.selector, rule.selector, applyCandidate)
rule.walkDecls((d) => {
d.important = meta.important || important
})
})
}
// Insert it
siblings.push([
// Ensure that when we are sorting, that we take the layer order into account
{ ...meta, sort: meta.sort | context.layerOrder[meta.layer] },
root.nodes[0],
])
}
}
// Inject the rules, sorted, correctly
let nodes = siblings.sort(([a], [z]) => bigSign(a.sort - z.sort)).map((s) => s[1])
// `parent` refers to the node at `.abc` in: .abc { @apply mt-2 }
parent.after(nodes)
}
for (let apply of applies) {
// If there are left-over declarations, just remove the @apply
if (apply.parent.nodes.length > 1) {
apply.remove()
} else {
// The node is empty, drop the full node
apply.parent.remove()
}
}
// Do it again, in case we have other `@apply` rules
processApply(root, context, localCache)
}
}
export default function expandApplyAtRules(context) {
return (root) => {
// Build a cache of the user's CSS so we can use it to resolve classes used by @apply
let localCache = lazyCache(() => buildLocalApplyCache(root, context))
processApply(root, context, localCache)
}
}
-292
src/lib/expandTailwindAtRules.js
import LRU from 'quick-lru'
import * as sharedState from './sharedState'
import { generateRules } from './generateRules'
import bigSign from '../util/bigSign'
import log from '../util/log'
import cloneNodes from '../util/cloneNodes'
import { defaultExtractor } from './defaultExtractor'
let env = sharedState.env
const builtInExtractors = {
DEFAULT: defaultExtractor,
}
const builtInTransformers = {
DEFAULT: (content) => content,
svelte: (content) => content.replace(/(?:^|\s)class:/g, ' '),
}
function getExtractor(tailwindConfig, fileExtension) {
let extractors = tailwindConfig.content.extract
return (
extractors[fileExtension] ||
extractors.DEFAULT ||
builtInExtractors[fileExtension] ||
builtInExtractors.DEFAULT
)
}
function getTransformer(tailwindConfig, fileExtension) {
let transformers = tailwindConfig.content.transform
return (
transformers[fileExtension] ||
transformers.DEFAULT ||
builtInTransformers[fileExtension] ||
builtInTransformers.DEFAULT
)
}
let extractorCache = new WeakMap()
// Scans template contents for possible classes. This is a hot path on initial build but
// not too important for subsequent builds. The faster the better though — if we can speed
// up these regexes by 50% that could cut initial build time by like 20%.
function getClassCandidates(content, extractor, candidates, seen) {
if (!extractorCache.has(extractor)) {
extractorCache.set(extractor, new LRU({ maxSize: 25000 }))
}
for (let line of content.split('\n')) {
line = line.trim()
if (seen.has(line)) {
continue
}
seen.add(line)
if (extractorCache.get(extractor).has(line)) {
for (let match of extractorCache.get(extractor).get(line)) {
candidates.add(match)
}
} else {
let extractorMatches = extractor(line).filter((s) => s !== '!*')
let lineMatchesSet = new Set(extractorMatches)
for (let match of lineMatchesSet) {
candidates.add(match)
}
extractorCache.get(extractor).set(line, lineMatchesSet)
}
}
}
function buildStylesheet(rules, context) {
let sortedRules = rules.sort(([a], [z]) => bigSign(a - z))
let returnValue = {
base: new Set(),
defaults: new Set(),
components: new Set(),
utilities: new Set(),
variants: new Set(),
// All the CSS that is not Tailwind related can be put in this bucket. This
// will make it easier to later use this information when we want to
// `@apply` for example. The main reason we do this here is because we
// still need to make sure the order is correct. Last but not least, we
// will make sure to always re-inject this section into the css, even if
// certain rules were not used. This means that it will look like a no-op
// from the user's perspective, but we gathered all the useful information
// we need.
user: new Set(),
}
for (let [sort, rule] of sortedRules) {
if (sort >= context.minimumScreen) {
returnValue.variants.add(rule)
continue
}
if (sort & context.layerOrder.base) {
returnValue.base.add(rule)
continue
}
if (sort & context.layerOrder.defaults) {
returnValue.defaults.add(rule)
continue
}
if (sort & context.layerOrder.components) {
returnValue.components.add(rule)
continue
}
if (sort & context.layerOrder.utilities) {
returnValue.utilities.add(rule)
continue
}
if (sort & context.layerOrder.user) {
returnValue.user.add(rule)
continue
}
}
return returnValue
}
export default function expandTailwindAtRules(context) {
return (root) => {
let layerNodes = {
base: null,
components: null,
utilities: null,
variants: null,
}
root.walkAtRules((rule) => {
// Make sure this file contains Tailwind directives. If not, we can save
// a lot of work and bail early. Also we don't have to register our touch
// file as a dependency since the output of this CSS does not depend on
// the source of any templates. Think Vue <style> blocks for example.
if (rule.name === 'tailwind') {
if (Object.keys(layerNodes).includes(rule.params)) {
layerNodes[rule.params] = rule
}
}
})
if (Object.values(layerNodes).every((n) => n === null)) {
return root
}
// ---
// Find potential rules in changed files
let candidates = new Set([sharedState.NOT_ON_DEMAND])
let seen = new Set()
env.DEBUG && console.time('Reading changed files')
for (let { content, extension } of context.changedContent) {
let transformer = getTransformer(context.tailwindConfig, extension)
let extractor = getExtractor(context.tailwindConfig, extension)
getClassCandidates(transformer(content), extractor, candidates, seen)
}
env.DEBUG && console.timeEnd('Reading changed files')
// ---
// Generate the actual CSS
let classCacheCount = context.classCache.size
env.DEBUG && console.time('Generate rules')
let rules = generateRules(candidates, context)
env.DEBUG && console.timeEnd('Generate rules')
// We only ever add to the classCache, so if it didn't grow, there is nothing new.
env.DEBUG && console.time('Build stylesheet')
if (context.stylesheetCache === null || context.classCache.size !== classCacheCount) {
for (let rule of rules) {
context.ruleCache.add(rule)
}
context.stylesheetCache = buildStylesheet([...context.ruleCache], context)
}
env.DEBUG && console.timeEnd('Build stylesheet')
let {
defaults: defaultNodes,
base: baseNodes,
components: componentNodes,
utilities: utilityNodes,
variants: screenNodes,
} = context.stylesheetCache
// ---
// Replace any Tailwind directives with generated CSS
if (layerNodes.base) {
layerNodes.base.before(
cloneNodes([...baseNodes, ...defaultNodes], layerNodes.base.source, {
layer: 'base',
})
)
layerNodes.base.remove()
}
if (layerNodes.components) {
layerNodes.components.before(
cloneNodes([...componentNodes], layerNodes.components.source, {
layer: 'components',
})
)
layerNodes.components.remove()
}
if (layerNodes.utilities) {
layerNodes.utilities.before(
cloneNodes([...utilityNodes], layerNodes.utilities.source, {
layer: 'utilities',
})
)
layerNodes.utilities.remove()
}
// We do post-filtering to not alter the emitted order of the variants
const variantNodes = Array.from(screenNodes).filter((node) => {
const parentLayer = node.raws.tailwind?.parentLayer
if (parentLayer === 'components') {
return layerNodes.components !== null
}
if (parentLayer === 'utilities') {
return layerNodes.utilities !== null
}
return true
})
if (layerNodes.variants) {
layerNodes.variants.before(
cloneNodes(variantNodes, layerNodes.variants.source, {
layer: 'variants',
})
)
layerNodes.variants.remove()
} else if (variantNodes.length > 0) {
root.append(
cloneNodes(variantNodes, root.source, {
layer: 'variants',
})
)
}
// If we've got a utility layer and no utilities are generated there's likely something wrong
const hasUtilityVariants = variantNodes.some(
(node) => node.raws.tailwind?.parentLayer === 'utilities'
)
if (layerNodes.utilities && utilityNodes.size === 0 && !hasUtilityVariants) {
log.warn('content-problems', [
'No utility classes were detected in your source files. If this is unexpected, double-check the `content` option in your Tailwind CSS configuration.',
'https://tailwindcss.com/docs/content-configuration',
])
}
// ---
if (env.DEBUG) {
console.log('Potential classes: ', candidates.size)
console.log('Active contexts: ', sharedState.contextSourcesMap.size)
}
// Clear the cache for the changed files
context.changedContent = []
// Cleanup any leftover @layer atrules
root.walkAtRules('layer', (rule) => {
if (Object.keys(layerNodes).includes(rule.params)) {
rule.remove()
}
})
}
}
-642
src/lib/generateRules.js
import postcss from 'postcss'
import selectorParser from 'postcss-selector-parser'
import parseObjectStyles from '../util/parseObjectStyles'
import isPlainObject from '../util/isPlainObject'
import prefixSelector from '../util/prefixSelector'
import { updateAllClasses } from '../util/pluginUtils'
import log from '../util/log'
import * as sharedState from './sharedState'
import { formatVariantSelector, finalizeSelector } from '../util/formatVariantSelector'
import { asClass } from '../util/nameClass'
import { normalize } from '../util/dataTypes'
import isValidArbitraryValue from '../util/isValidArbitraryValue'
let classNameParser = selectorParser((selectors) => {
return selectors.first.filter(({ type }) => type === 'class').pop().value
})
function getClassNameFromSelector(selector) {
return classNameParser.transformSync(selector)
}
// Generate match permutations for a class candidate, like:
// ['ring-offset-blue', '100']
// ['ring-offset', 'blue-100']
// ['ring', 'offset-blue-100']
// Example with dynamic classes:
// ['grid-cols', '[[linename],1fr,auto]']
// ['grid', 'cols-[[linename],1fr,auto]']
function* candidatePermutations(candidate) {
let lastIndex = Infinity
while (lastIndex >= 0) {
let dashIdx
if (lastIndex === Infinity && candidate.endsWith(']')) {
let bracketIdx = candidate.indexOf('[')
// If character before `[` isn't a dash or a slash, this isn't a dynamic class
// eg. string[]
dashIdx = ['-', '/'].includes(candidate[bracketIdx - 1]) ? bracketIdx - 1 : -1
} else {
dashIdx = candidate.lastIndexOf('-', lastIndex)
}
if (dashIdx < 0) {
break
}
let prefix = candidate.slice(0, dashIdx)
let modifier = candidate.slice(dashIdx + 1)
yield [prefix, modifier]
lastIndex = dashIdx - 1
}
}
function applyPrefix(matches, context) {
if (matches.length === 0 || context.tailwindConfig.prefix === '') {
return matches
}
for (let match of matches) {
let [meta] = match
if (meta.options.respectPrefix) {
let container = postcss.root({ nodes: [match[1].clone()] })
let classCandidate = match[1].raws.tailwind.classCandidate
container.walkRules((r) => {
// If this is a negative utility with a dash *before* the prefix we
// have to ensure that the generated selector matches the candidate
// Not doing this will cause `-tw-top-1` to generate the class `.tw--top-1`
// The disconnect between candidate <-> class can cause @apply to hard crash.
let shouldPrependNegative = classCandidate.startsWith('-')
r.selector = prefixSelector(
context.tailwindConfig.prefix,
r.selector,
shouldPrependNegative
)
})
match[1] = container.nodes[0]
}
}
return matches
}
function applyImportant(matches, classCandidate) {
if (matches.length === 0) {
return matches
}
let result = []
for (let [meta, rule] of matches) {
let container = postcss.root({ nodes: [rule.clone()] })
container.walkRules((r) => {
r.selector = updateAllClasses(r.selector, (className) => {
if (className === classCandidate) {
return `!${className}`
}
return className
})
r.walkDecls((d) => (d.important = true))
})
result.push([{ ...meta, important: true }, container.nodes[0]])
}
return result
}
// Takes a list of rule tuples and applies a variant like `hover`, sm`,
// whatever to it. We used to do some extra caching here to avoid generating
// a variant of the same rule more than once, but this was never hit because
// we cache at the entire selector level further up the tree.
//
// Technically you can get a cache hit if you have `hover:focus:text-center`
// and `focus:hover:text-center` in the same project, but it doesn't feel
// worth the complexity for that case.
function applyVariant(variant, matches, context) {
if (matches.length === 0) {
return matches
}
if (context.variantMap.has(variant)) {
let variantFunctionTuples = context.variantMap.get(variant)
let result = []
for (let [meta, rule] of matches) {
// Don't generate variants for user css
if (meta.layer === 'user') {
continue
}
let container = postcss.root({ nodes: [rule.clone()] })
for (let [variantSort, variantFunction] of variantFunctionTuples) {
let clone = container.clone()
let collectedFormats = []
let originals = new Map()
function prepareBackup() {
if (originals.size > 0) return // Already prepared, chicken out
clone.walkRules((rule) => originals.set(rule, rule.selector))
}
function modifySelectors(modifierFunction) {
prepareBackup()
clone.each((rule) => {
if (rule.type !== 'rule') {
return
}
rule.selectors = rule.selectors.map((selector) => {
return modifierFunction({
get className() {
return getClassNameFromSelector(selector)
},
selector,
})
})
})
return clone
}
let ruleWithVariant = variantFunction({
// Public API
get container() {
prepareBackup()
return clone
},
separator: context.tailwindConfig.separator,
modifySelectors,
// Private API for now
wrap(wrapper) {
let nodes = clone.nodes
clone.removeAll()
wrapper.append(nodes)
clone.append(wrapper)
},
format(selectorFormat) {
collectedFormats.push(selectorFormat)
},
})
if (typeof ruleWithVariant === 'string') {
collectedFormats.push(ruleWithVariant)
}
if (ruleWithVariant === null) {
continue
}
// We filled the `originals`, therefore we assume that somebody touched
// `container` or `modifySelectors`. Let's see if they did, so that we
// can restore the selectors, and collect the format strings.
if (originals.size > 0) {
clone.walkRules((rule) => {
if (!originals.has(rule)) return
let before = originals.get(rule)
if (before === rule.selector) return // No mutation happened
let modified = rule.selector
// Rebuild the base selector, this is what plugin authors would do
// as well. E.g.: `${variant}${separator}${className}`.
// However, plugin authors probably also prepend or append certain
// classes, pseudos, ids, ...
let rebuiltBase = selectorParser((selectors) => {
selectors.walkClasses((classNode) => {
classNode.value = `${variant}${context.tailwindConfig.separator}${classNode.value}`
})
}).processSync(before)
// Now that we know the original selector, the new selector, and
// the rebuild part in between, we can replace the part that plugin
// authors need to rebuild with `&`, and eventually store it in the
// collectedFormats. Similar to what `format('...')` would do.
//
// E.g.:
// variant: foo
// selector: .markdown > p
// modified (by plugin): .foo .foo\\:markdown > p
// rebuiltBase (internal): .foo\\:markdown > p
// format: .foo &
collectedFormats.push(modified.replace(rebuiltBase, '&'))
rule.selector = before
})
}
// This tracks the originating layer for the variant
// For example:
// .sm:underline {} is a variant of something in the utilities layer
// .sm:container {} is a variant of the container component
clone.nodes[0].raws.tailwind = { ...clone.nodes[0].raws.tailwind, parentLayer: meta.layer }
let withOffset = [
{
...meta,
sort: variantSort | meta.sort,
collectedFormats: (meta.collectedFormats ?? []).concat(collectedFormats),
},
clone.nodes[0],
]
result.push(withOffset)
}
}
return result
}
return []
}
function parseRules(rule, cache, options = {}) {
// PostCSS node
if (!isPlainObject(rule) && !Array.isArray(rule)) {
return [[rule], options]
}
// Tuple
if (Array.isArray(rule)) {
return parseRules(rule[0], cache, rule[1])
}
// Simple object
if (!cache.has(rule)) {
cache.set(rule, parseObjectStyles(rule))
}
return [cache.get(rule), options]
}
const IS_VALID_PROPERTY_NAME = /^[a-z_-]/
function isValidPropName(name) {
return IS_VALID_PROPERTY_NAME.test(name)
}
/**
* @param {string} declaration
* @returns {boolean}
*/
function looksLikeUri(declaration) {
// Quick bailout for obvious non-urls
// This doesn't support schemes that don't use a leading // but that's unlikely to be a problem
if (!declaration.includes('://')) {
return false
}
try {
const url = new URL(declaration)
return url.scheme !== '' && url.host !== ''
} catch (err) {
// Definitely not a valid url
return false
}
}
function isParsableNode(node) {
let isParsable = true
node.walkDecls((decl) => {
if (!isParsableCssValue(decl.name, decl.value)) {
isParsable = false
return false
}
})
return isParsable
}
function isParsableCssValue(property, value) {
// We don't want to to treat [https://example.com] as a custom property
// Even though, according to the CSS grammar, it's a totally valid CSS declaration
// So we short-circuit here by checking if the custom property looks like a url
if (looksLikeUri(`${property}:${value}`)) {
return false
}
try {
postcss.parse(`a{${property}:${value}}`).toResult()
return true
} catch (err) {
return false
}
}
function extractArbitraryProperty(classCandidate, context) {
let [, property, value] = classCandidate.match(/^\[([a-zA-Z0-9-_]+):(\S+)\]$/) ?? []
if (value === undefined) {
return null
}
if (!isValidPropName(property)) {
return null
}
if (!isValidArbitraryValue(value)) {
return null
}
let normalized = normalize(value)
if (!isParsableCssValue(property, normalized)) {
return null
}
return [
[
{ sort: context.arbitraryPropertiesSort, layer: 'utilities' },
() => ({
[asClass(classCandidate)]: {
[property]: normalized,
},
}),
],
]
}
function* resolveMatchedPlugins(classCandidate, context) {
if (context.candidateRuleMap.has(classCandidate)) {
yield [context.candidateRuleMap.get(classCandidate), 'DEFAULT']
}
yield* (function* (arbitraryPropertyRule) {
if (arbitraryPropertyRule !== null) {
yield [arbitraryPropertyRule, 'DEFAULT']
}
})(extractArbitraryProperty(classCandidate, context))
let candidatePrefix = classCandidate
let negative = false
const twConfigPrefix = context.tailwindConfig.prefix
const twConfigPrefixLen = twConfigPrefix.length
if (candidatePrefix[twConfigPrefixLen] === '-') {
negative = true
candidatePrefix = twConfigPrefix + candidatePrefix.slice(twConfigPrefixLen + 1)
}
if (negative && context.candidateRuleMap.has(candidatePrefix)) {
yield [context.candidateRuleMap.get(candidatePrefix), '-DEFAULT']
}
for (let [prefix, modifier] of candidatePermutations(candidatePrefix)) {
if (context.candidateRuleMap.has(prefix)) {
yield [context.candidateRuleMap.get(prefix), negative ? `-${modifier}` : modifier]
}
}
}
function splitWithSeparator(input, separator) {
if (input === sharedState.NOT_ON_DEMAND) {
return [sharedState.NOT_ON_DEMAND]
}
return input.split(new RegExp(`\\${separator}(?![^[]*\\])`, 'g'))
}
function* recordCandidates(matches, classCandidate) {
for (const match of matches) {
match[1].raws.tailwind = { ...match[1].raws.tailwind, classCandidate }
yield match
}
}
function* resolveMatches(candidate, context) {
let separator = context.tailwindConfig.separator
let [classCandidate, ...variants] = splitWithSeparator(candidate, separator).reverse()
let important = false
if (classCandidate.startsWith('!')) {
important = true
classCandidate = classCandidate.slice(1)
}
// TODO: Reintroduce this in ways that doesn't break on false positives
// function sortAgainst(toSort, against) {
// return toSort.slice().sort((a, z) => {
// return bigSign(against.get(a)[0] - against.get(z)[0])
// })
// }
// let sorted = sortAgainst(variants, context.variantMap)
// if (sorted.toString() !== variants.toString()) {
// let corrected = sorted.reverse().concat(classCandidate).join(':')
// throw new Error(`Class ${candidate} should be written as ${corrected}`)
// }
for (let matchedPlugins of resolveMatchedPlugins(classCandidate, context)) {
let matches = []
let typesByMatches = new Map()
let [plugins, modifier] = matchedPlugins
let isOnlyPlugin = plugins.length === 1
for (let [sort, plugin] of plugins) {
let matchesPerPlugin = []
if (typeof plugin === 'function') {
for (let ruleSet of [].concat(plugin(modifier, { isOnlyPlugin }))) {
let [rules, options] = parseRules(ruleSet, context.postCssNodeCache)
for (let rule of rules) {
matchesPerPlugin.push([{ ...sort, options: { ...sort.options, ...options } }, rule])
}
}
}
// Only process static plugins on exact matches
else if (modifier === 'DEFAULT' || modifier === '-DEFAULT') {
let ruleSet = plugin
let [rules, options] = parseRules(ruleSet, context.postCssNodeCache)
for (let rule of rules) {
matchesPerPlugin.push([{ ...sort, options: { ...sort.options, ...options } }, rule])
}
}
if (matchesPerPlugin.length > 0) {
typesByMatches.set(matchesPerPlugin, sort.options?.type)
matches.push(matchesPerPlugin)
}
}
if (isArbitraryValue(modifier)) {
// When generated arbitrary values are ambiguous, we can't know
// which to pick so don't generate any utilities for them
if (matches.length > 1) {
let typesPerPlugin = matches.map((match) => new Set([...(typesByMatches.get(match) ?? [])]))
// Remove duplicates, so that we can detect proper unique types for each plugin.
for (let pluginTypes of typesPerPlugin) {
for (let type of pluginTypes) {
let removeFromOwnGroup = false
for (let otherGroup of typesPerPlugin) {
if (pluginTypes === otherGroup) continue
if (otherGroup.has(type)) {
otherGroup.delete(type)
removeFromOwnGroup = true
}
}
if (removeFromOwnGroup) pluginTypes.delete(type)
}
}
let messages = []
for (let [idx, group] of typesPerPlugin.entries()) {
for (let type of group) {
let rules = matches[idx]
.map(([, rule]) => rule)
.flat()
.map((rule) =>
rule
.toString()
.split('\n')
.slice(1, -1) // Remove selector and closing '}'
.map((line) => line.trim())
.map((x) => ` ${x}`) // Re-indent
.join('\n')
)
.join('\n\n')
messages.push(
` Use \`${candidate.replace('[', `[${type}:`)}\` for \`${rules.trim()}\``
)
break
}
}
log.warn([
`The class \`${candidate}\` is ambiguous and matches multiple utilities.`,
...messages,
`If this is content and not a class, replace it with \`${candidate
.replace('[', '&lsqb;')
.replace(']', '&rsqb;')}\` to silence this warning.`,
])
continue
}
matches = matches.map((list) => list.filter((match) => isParsableNode(match[1])))
}
matches = matches.flat()
matches = Array.from(recordCandidates(matches, classCandidate))
matches = applyPrefix(matches, context)
if (important) {
matches = applyImportant(matches, classCandidate)
}
for (let variant of variants) {
matches = applyVariant(variant, matches, context)
}
for (let match of matches) {
match[1].raws.tailwind = { ...match[1].raws.tailwind, candidate }
// Apply final format selector
if (match[0].collectedFormats) {
let finalFormat = formatVariantSelector('&', ...match[0].collectedFormats)
let container = postcss.root({ nodes: [match[1].clone()] })
container.walkRules((rule) => {
if (inKeyframes(rule)) return
rule.selector = finalizeSelector(finalFormat, {
selector: rule.selector,
candidate,
context,
})
})
match[1] = container.nodes[0]
}
yield match
}
}
}
function inKeyframes(rule) {
return rule.parent && rule.parent.type === 'atrule' && rule.parent.name === 'keyframes'
}
function generateRules(candidates, context) {
let allRules = []
for (let candidate of candidates) {
if (context.notClassCache.has(candidate)) {
continue
}
if (context.classCache.has(candidate)) {
allRules.push(context.classCache.get(candidate))
continue
}
let matches = Array.from(resolveMatches(candidate, context))
if (matches.length === 0) {
context.notClassCache.add(candidate)
continue
}
context.classCache.set(candidate, matches)
allRules.push(matches)
}
// Strategy based on `tailwindConfig.important`
let strategy = ((important) => {
if (important === true) {
return (rule) => {
rule.walkDecls((d) => {
if (d.parent.type === 'rule' && !inKeyframes(d.parent)) {
d.important = true
}
})
}
}
if (typeof important === 'string') {
return (rule) => {
rule.selectors = rule.selectors.map((selector) => {
return `${important} ${selector}`
})
}
}
})(context.tailwindConfig.important)
return allRules.flat(1).map(([{ sort, layer, options }, rule]) => {
if (options.respectImportant) {
if (strategy) {
let container = postcss.root({ nodes: [rule.clone()] })
container.walkRules((r) => {
if (inKeyframes(r)) {
return
}
strategy(r)
})
rule = container.nodes[0]
}
}
return [sort | context.layerOrder[layer], rule]
})
}
function isArbitraryValue(input) {
return input.startsWith('[') && input.endsWith(']')
}
export { resolveMatches, generateRules }
-39
src/lib/getModuleDependencies.js
import fs from 'fs'
import path from 'path'
import resolve from 'resolve'
import detective from 'detective'
function createModule(file) {
const source = fs.readFileSync(file, 'utf-8')
const requires = detective(source)
return { file, requires }
}
export default function getModuleDependencies(entryFile) {
const rootModule = createModule(entryFile)
const modules = [rootModule]
// Iterate over the modules, even when new
// ones are being added
for (const mdl of modules) {
mdl.requires
.filter((dep) => {
// Only track local modules, not node_modules
return dep.startsWith('./') || dep.startsWith('../')
})
.forEach((dep) => {
try {
const basedir = path.dirname(mdl.file)
const depPath = resolve.sync(dep, { basedir })
const depModule = createModule(depPath)
modules.push(depModule)
} catch (_err) {
// eslint-disable-next-line no-empty
}
})
}
return modules
}
-84
src/lib/normalizeTailwindDirectives.js
import log from '../util/log'
export default function normalizeTailwindDirectives(root) {
let tailwindDirectives = new Set()
let layerDirectives = new Set()
let applyDirectives = new Set()
root.walkAtRules((atRule) => {
if (atRule.name === 'apply') {
applyDirectives.add(atRule)
}
if (atRule.name === 'import') {
if (atRule.params === '"tailwindcss/base"' || atRule.params === "'tailwindcss/base'") {
atRule.name = 'tailwind'
atRule.params = 'base'
} else if (
atRule.params === '"tailwindcss/components"' ||
atRule.params === "'tailwindcss/components'"
) {
atRule.name = 'tailwind'
atRule.params = 'components'
} else if (
atRule.params === '"tailwindcss/utilities"' ||
atRule.params === "'tailwindcss/utilities'"
) {
atRule.name = 'tailwind'
atRule.params = 'utilities'
} else if (
atRule.params === '"tailwindcss/screens"' ||
atRule.params === "'tailwindcss/screens'" ||
atRule.params === '"tailwindcss/variants"' ||
atRule.params === "'tailwindcss/variants'"
) {
atRule.name = 'tailwind'
atRule.params = 'variants'
}
}
if (atRule.name === 'tailwind') {
if (atRule.params === 'screens') {
atRule.params = 'variants'
}
tailwindDirectives.add(atRule.params)
}
if (['layer', 'responsive', 'variants'].includes(atRule.name)) {
if (['responsive', 'variants'].includes(atRule.name)) {
log.warn(`${atRule.name}-at-rule-deprecated`, [
`The \`@${atRule.name}\` directive has been deprecated in Tailwind CSS v3.0.`,
`Use \`@layer utilities\` or \`@layer components\` instead.`,
'https://tailwindcss.com/docs/upgrade-guide#replace-variants-with-layer',
])
}
layerDirectives.add(atRule)
}
})
if (
!tailwindDirectives.has('base') ||
!tailwindDirectives.has('components') ||
!tailwindDirectives.has('utilities')
) {
for (let rule of layerDirectives) {
if (rule.name === 'layer' && ['base', 'components', 'utilities'].includes(rule.params)) {
if (!tailwindDirectives.has(rule.params)) {
throw rule.error(
`\`@layer ${rule.params}\` is used but no matching \`@tailwind ${rule.params}\` directive is present.`
)
}
} else if (rule.name === 'responsive') {
if (!tailwindDirectives.has('utilities')) {
throw rule.error('`@responsive` is used but `@tailwind utilities` is missing.')
}
} else if (rule.name === 'variants') {
if (!tailwindDirectives.has('utilities')) {
throw rule.error('`@variants` is used but `@tailwind utilities` is missing.')
}
}
}
}
return { tailwindDirectives, applyDirectives }
}
-52
src/lib/partitionApplyAtRules.js
function partitionRules(root) {
if (!root.walkAtRules) return
let applyParents = new Set()
root.walkAtRules('apply', (rule) => {
applyParents.add(rule.parent)
})
if (applyParents.size === 0) {
return
}
for (let rule of applyParents) {
let nodeGroups = []
let lastGroup = []
for (let node of rule.nodes) {
if (node.type === 'atrule' && node.name === 'apply') {
if (lastGroup.length > 0) {
nodeGroups.push(lastGroup)
lastGroup = []
}
nodeGroups.push([node])
} else {
lastGroup.push(node)
}
}
if (lastGroup.length > 0) {
nodeGroups.push(lastGroup)
}
if (nodeGroups.length === 1) {
continue
}
for (let group of [...nodeGroups].reverse()) {
let clone = rule.clone({ nodes: [] })
clone.append(group)
rule.after(clone)
}
rule.remove()
}
}
export default function expandApplyAtRules() {
return (root) => {
partitionRules(root)
}
}
-146
src/lib/resolveDefaultsAtRules.js
import postcss from 'postcss'
import selectorParser from 'postcss-selector-parser'
import { flagEnabled } from '../featureFlags'
let getNode = {
id(node) {
return selectorParser.attribute({
attribute: 'id',
operator: '=',
value: node.value,
quoteMark: '"',
})
},
}
function minimumImpactSelector(nodes) {
let rest = nodes
.filter((node) => {
// Keep non-pseudo nodes
if (node.type !== 'pseudo') return true
// Keep pseudo nodes that have subnodes
// E.g.: `:not()` contains subnodes inside the parentheses
if (node.nodes.length > 0) return true
// Keep pseudo `elements`
// This implicitly means that we ignore pseudo `classes`
return (
node.value.startsWith('::') ||
[':before', ':after', ':first-line', ':first-letter'].includes(node.value)
)
})
.reverse()
let searchFor = new Set(['tag', 'class', 'id', 'attribute'])
let splitPointIdx = rest.findIndex((n) => searchFor.has(n.type))
if (splitPointIdx === -1) return rest.reverse().join('').trim()
let node = rest[splitPointIdx]
let bestNode = getNode[node.type] ? getNode[node.type](node) : node
rest = rest.slice(0, splitPointIdx)
let combinatorIdx = rest.findIndex((n) => n.type === 'combinator' && n.value === '>')
if (combinatorIdx !== -1) {
rest.splice(0, combinatorIdx)
rest.unshift(selectorParser.universal())
}
return [bestNode, ...rest.reverse()].join('').trim()
}
export let elementSelectorParser = selectorParser((selectors) => {
return selectors.map((s) => {
let nodes = s.split((n) => n.type === 'combinator' && n.value === ' ').pop()
return minimumImpactSelector(nodes)
})
})
let cache = new Map()
function extractElementSelector(selector) {
if (!cache.has(selector)) {
cache.set(selector, elementSelectorParser.transformSync(selector))
}
return cache.get(selector)
}
export default function resolveDefaultsAtRules({ tailwindConfig }) {
return (root) => {
let variableNodeMap = new Map()
/** @type {Set<import('postcss').AtRule>} */
let universals = new Set()
root.walkAtRules('defaults', (rule) => {
if (rule.nodes && rule.nodes.length > 0) {
universals.add(rule)
return
}
let variable = rule.params
if (!variableNodeMap.has(variable)) {
variableNodeMap.set(variable, new Set())
}
variableNodeMap.get(variable).add(rule.parent)
rule.remove()
})
for (let universal of universals) {
/** @type {Map<string, Set<string>>} */
let selectorGroups = new Map()
let rules = variableNodeMap.get(universal.params) ?? []
for (let rule of rules) {
for (let selector of extractElementSelector(rule.selector)) {
// If selector contains a vendor prefix after a pseudo element or class,
// we consider them separately because merging the declarations into
// a single rule will cause browsers that do not understand the
// vendor prefix to throw out the whole rule
let selectorGroupName =
selector.includes(':-') || selector.includes('::-') ? selector : '__DEFAULT__'
let selectors = selectorGroups.get(selectorGroupName) ?? new Set()
selectorGroups.set(selectorGroupName, selectors)
selectors.add(selector)
}
}
if (flagEnabled(tailwindConfig, 'optimizeUniversalDefaults')) {
if (selectorGroups.size === 0) {
universal.remove()
continue
}
for (let [, selectors] of selectorGroups) {
let universalRule = postcss.rule({
source: universal.source,
})
universalRule.selectors = [...selectors]
universalRule.append(universal.nodes.map((node) => node.clone()))
universal.before(universalRule)
}
} else {
let universalRule = postcss.rule({
source: universal.source,
})
universalRule.selectors = ['*', '::before', '::after']
universalRule.append(universal.nodes)
universal.before(universalRule)
}
universal.remove()
}
}
}
-899
src/lib/setupContextUtils.js
import fs from 'fs'
import url from 'url'
import postcss from 'postcss'
import dlv from 'dlv'
import selectorParser from 'postcss-selector-parser'
import transformThemeValue from '../util/transformThemeValue'
import parseObjectStyles from '../util/parseObjectStyles'
import prefixSelector from '../util/prefixSelector'
import isPlainObject from '../util/isPlainObject'
import escapeClassName from '../util/escapeClassName'
import nameClass, { formatClass } from '../util/nameClass'
import { coerceValue } from '../util/pluginUtils'
import bigSign from '../util/bigSign'
import { variantPlugins, corePlugins } from '../corePlugins'
import * as sharedState from './sharedState'
import { env } from './sharedState'
import { toPath } from '../util/toPath'
import log from '../util/log'
import negateValue from '../util/negateValue'
import isValidArbitraryValue from '../util/isValidArbitraryValue'
import { generateRules } from './generateRules'
import { hasContentChanged } from './cacheInvalidation.js'
function prefix(context, selector) {
let prefix = context.tailwindConfig.prefix
return typeof prefix === 'function' ? prefix(selector) : prefix + selector
}
function parseVariantFormatString(input) {
if (input.includes('{')) {
if (!isBalanced(input)) throw new Error(`Your { and } are unbalanced.`)
return input
.split(/{(.*)}/gim)
.flatMap((line) => parseVariantFormatString(line))
.filter(Boolean)
}
return [input.trim()]
}
function isBalanced(input) {
let count = 0
for (let char of input) {
if (char === '{') {
count++
} else if (char === '}') {
if (--count < 0) {
return false // unbalanced
}
}
}
return count === 0
}
function insertInto(list, value, { before = [] } = {}) {
before = [].concat(before)
if (before.length <= 0) {
list.push(value)
return
}
let idx = list.length - 1
for (let other of before) {
let iidx = list.indexOf(other)
if (iidx === -1) continue
idx = Math.min(idx, iidx)
}
list.splice(idx, 0, value)
}
function parseStyles(styles) {
if (!Array.isArray(styles)) {
return parseStyles([styles])
}
return styles.flatMap((style) => {
let isNode = !Array.isArray(style) && !isPlainObject(style)
return isNode ? style : parseObjectStyles(style)
})
}
function getClasses(selector, mutate) {
let parser = selectorParser((selectors) => {
let allClasses = []
if (mutate) {
mutate(selectors)
}
selectors.walkClasses((classNode) => {
allClasses.push(classNode.value)
})
return allClasses
})
return parser.transformSync(selector)
}
function extractCandidates(node, state = { containsNonOnDemandable: false }, depth = 0) {
let classes = []
// Handle normal rules
if (node.type === 'rule') {
// Ignore everything inside a :not(...). This allows you to write code like
// `div:not(.foo)`. If `.foo` is never found in your code, then we used to
// not generated it. But now we will ignore everything inside a `:not`, so
// that it still gets generated.
function ignoreNot(selectors) {
selectors.walkPseudos((pseudo) => {
if (pseudo.value === ':not') {
pseudo.remove()
}
})
}
for (let selector of node.selectors) {
let classCandidates = getClasses(selector, ignoreNot)
// At least one of the selectors contains non-"on-demandable" candidates.
if (classCandidates.length === 0) {
state.containsNonOnDemandable = true
}
for (let classCandidate of classCandidates) {
classes.push(classCandidate)
}
}
}
// Handle at-rules (which contains nested rules)
else if (node.type === 'atrule') {
node.walkRules((rule) => {
for (let classCandidate of rule.selectors.flatMap((selector) => getClasses(selector))) {
classes.push(classCandidate)
}
})
}
if (depth === 0) {
return [state.containsNonOnDemandable || classes.length === 0, classes]
}
return classes
}
function withIdentifiers(styles) {
return parseStyles(styles).flatMap((node) => {
let nodeMap = new Map()
let [containsNonOnDemandableSelectors, candidates] = extractCandidates(node)
// If this isn't "on-demandable", assign it a universal candidate to always include it.
if (containsNonOnDemandableSelectors) {
candidates.unshift(sharedState.NOT_ON_DEMAND)
}
// However, it could be that it also contains "on-demandable" candidates.
// E.g.: `span, .foo {}`, in that case it should still be possible to use
// `@apply foo` for example.
return candidates.map((c) => {
if (!nodeMap.has(node)) {
nodeMap.set(node, node)
}
return [c, nodeMap.get(node)]
})
})
}
function buildPluginApi(tailwindConfig, context, { variantList, variantMap, offsets, classList }) {
function getConfigValue(path, defaultValue) {
return path ? dlv(tailwindConfig, path, defaultValue) : tailwindConfig
}
function applyConfiguredPrefix(selector) {
return prefixSelector(tailwindConfig.prefix, selector)
}
function prefixIdentifier(identifier, options) {
if (identifier === sharedState.NOT_ON_DEMAND) {
return sharedState.NOT_ON_DEMAND
}
if (!options.respectPrefix) {
return identifier
}
return context.tailwindConfig.prefix + identifier
}
return {
addVariant(variantName, variantFunctions, options = {}) {
variantFunctions = [].concat(variantFunctions).map((variantFunction) => {
if (typeof variantFunction !== 'string') {
// Safelist public API functions
return ({ modifySelectors, container, separator }) => {
return variantFunction({ modifySelectors, container, separator })
}
}
variantFunction = variantFunction
.replace(/\n+/g, '')
.replace(/\s{1,}/g, ' ')
.trim()
let fns = parseVariantFormatString(variantFunction)
.map((str) => {
if (!str.startsWith('@')) {
return ({ format }) => format(str)
}
let [, name, params] = /@(.*?) (.*)/g.exec(str)
return ({ wrap }) => wrap(postcss.atRule({ name, params }))
})
.reverse()
return (api) => {
for (let fn of fns) {
fn(api)
}
}
})
insertInto(variantList, variantName, options)
variantMap.set(variantName, variantFunctions)
},
postcss,
prefix: applyConfiguredPrefix,
e: escapeClassName,
config: getConfigValue,
theme(path, defaultValue) {
const [pathRoot, ...subPaths] = toPath(path)
const value = getConfigValue(['theme', pathRoot, ...subPaths], defaultValue)
return transformThemeValue(pathRoot)(value)
},
corePlugins: (path) => {
if (Array.isArray(tailwindConfig.corePlugins)) {
return tailwindConfig.corePlugins.includes(path)
}
return getConfigValue(['corePlugins', path], true)
},
variants: () => {
// Preserved for backwards compatibility but not used in v3.0+
return []
},
addBase(base) {
for (let [identifier, rule] of withIdentifiers(base)) {
let prefixedIdentifier = prefixIdentifier(identifier, {})
let offset = offsets.base++
if (!context.candidateRuleMap.has(prefixedIdentifier)) {
context.candidateRuleMap.set(prefixedIdentifier, [])
}
context.candidateRuleMap
.get(prefixedIdentifier)
.push([{ sort: offset, layer: 'base' }, rule])
}
},
/**
* @param {string} group
* @param {Record<string, string | string[]>} declarations
*/
addDefaults(group, declarations) {
const groups = {
[`@defaults ${group}`]: declarations,
}
for (let [identifier, rule] of withIdentifiers(groups)) {
let prefixedIdentifier = prefixIdentifier(identifier, {})
if (!context.candidateRuleMap.has(prefixedIdentifier)) {
context.candidateRuleMap.set(prefixedIdentifier, [])
}
context.candidateRuleMap
.get(prefixedIdentifier)
.push([{ sort: offsets.base++, layer: 'defaults' }, rule])
}
},
addComponents(components, options) {
let defaultOptions = {
respectPrefix: true,
respectImportant: false,
}
options = Object.assign({}, defaultOptions, Array.isArray(options) ? {} : options)
for (let [identifier, rule] of withIdentifiers(components)) {
let prefixedIdentifier = prefixIdentifier(identifier, options)
classList.add(prefixedIdentifier)
if (!context.candidateRuleMap.has(prefixedIdentifier)) {
context.candidateRuleMap.set(prefixedIdentifier, [])
}
context.candidateRuleMap
.get(prefixedIdentifier)
.push([{ sort: offsets.components++, layer: 'components', options }, rule])
}
},
addUtilities(utilities, options) {
let defaultOptions = {
respectPrefix: true,
respectImportant: true,
}
options = Object.assign({}, defaultOptions, Array.isArray(options) ? {} : options)
for (let [identifier, rule] of withIdentifiers(utilities)) {
let prefixedIdentifier = prefixIdentifier(identifier, options)
classList.add(prefixedIdentifier)
if (!context.candidateRuleMap.has(prefixedIdentifier)) {
context.candidateRuleMap.set(prefixedIdentifier, [])
}
context.candidateRuleMap
.get(prefixedIdentifier)
.push([{ sort: offsets.utilities++, layer: 'utilities', options }, rule])
}
},
matchUtilities: function (utilities, options) {
let defaultOptions = {
respectPrefix: true,
respectImportant: true,
}
options = { ...defaultOptions, ...options }
let offset = offsets.utilities++
for (let identifier in utilities) {
let prefixedIdentifier = prefixIdentifier(identifier, options)
let rule = utilities[identifier]
classList.add([prefixedIdentifier, options])
function wrapped(modifier, { isOnlyPlugin }) {
let { type = 'any' } = options
type = [].concat(type)
let [value, coercedType] = coerceValue(type, modifier, options, tailwindConfig)
if (value === undefined) {
return []
}
if (!type.includes(coercedType) && !isOnlyPlugin) {
return []
}
if (!isValidArbitraryValue(value)) {
return []
}
let ruleSets = []
.concat(rule(value))
.filter(Boolean)
.map((declaration) => ({
[nameClass(identifier, modifier)]: declaration,
}))
return ruleSets
}
let withOffsets = [{ sort: offset, layer: 'utilities', options }, wrapped]
if (!context.candidateRuleMap.has(prefixedIdentifier)) {
context.candidateRuleMap.set(prefixedIdentifier, [])
}
context.candidateRuleMap.get(prefixedIdentifier).push(withOffsets)
}
},
matchComponents: function (components, options) {
let defaultOptions = {
respectPrefix: true,
respectImportant: false,
}
options = { ...defaultOptions, ...options }
let offset = offsets.components++
for (let identifier in components) {
let prefixedIdentifier = prefixIdentifier(identifier, options)
let rule = components[identifier]
classList.add([prefixedIdentifier, options])
function wrapped(modifier, { isOnlyPlugin }) {
let { type = 'any' } = options
type = [].concat(type)
let [value, coercedType] = coerceValue(type, modifier, options, tailwindConfig)
if (value === undefined) {
return []
}
if (!type.includes(coercedType)) {
if (isOnlyPlugin) {
log.warn([
`Unnecessary typehint \`${coercedType}\` in \`${identifier}-${modifier}\`.`,
`You can safely update it to \`${identifier}-${modifier.replace(
coercedType + ':',
''
)}\`.`,
])
} else {
return []
}
}
if (!isValidArbitraryValue(value)) {
return []
}
let ruleSets = []
.concat(rule(value))
.filter(Boolean)
.map((declaration) => ({
[nameClass(identifier, modifier)]: declaration,
}))
return ruleSets
}
let withOffsets = [{ sort: offset, layer: 'components', options }, wrapped]
if (!context.candidateRuleMap.has(prefixedIdentifier)) {
context.candidateRuleMap.set(prefixedIdentifier, [])
}
context.candidateRuleMap.get(prefixedIdentifier).push(withOffsets)
}
},
}
}
let fileModifiedMapCache = new WeakMap()
export function getFileModifiedMap(context) {
if (!fileModifiedMapCache.has(context)) {
fileModifiedMapCache.set(context, new Map())
}
return fileModifiedMapCache.get(context)
}
function trackModified(files, fileModifiedMap) {
let changed = false
for (let file of files) {
if (!file) continue
let parsed = url.parse(file)
let pathname = parsed.hash ? parsed.href.replace(parsed.hash, '') : parsed.href
pathname = parsed.search ? pathname.replace(parsed.search, '') : pathname
let newModified = fs.statSync(decodeURIComponent(pathname), { throwIfNoEntry: false })?.mtimeMs
if (!newModified) {
// It could happen that a file is passed in that doesn't exist. E.g.:
// postcss-cli will provide you a fake path when reading from stdin. This
// path then looks like /path-to-your-project/stdin In that case we just
// want to ignore it and don't track changes at all.
continue
}
if (!fileModifiedMap.has(file) || newModified > fileModifiedMap.get(file)) {
changed = true
}
fileModifiedMap.set(file, newModified)
}
return changed
}
function extractVariantAtRules(node) {
node.walkAtRules((atRule) => {
if (['responsive', 'variants'].includes(atRule.name)) {
extractVariantAtRules(atRule)
atRule.before(atRule.nodes)
atRule.remove()
}
})
}
function collectLayerPlugins(root) {
let layerPlugins = []
root.each((node) => {
if (node.type === 'atrule' && ['responsive', 'variants'].includes(node.name)) {
node.name = 'layer'
node.params = 'utilities'
}
})
// Walk @layer rules and treat them like plugins
root.walkAtRules('layer', (layerRule) => {
extractVariantAtRules(layerRule)
if (layerRule.params === 'base') {
for (let node of layerRule.nodes) {
layerPlugins.push(function ({ addBase }) {
addBase(node, { respectPrefix: false })
})
}
layerRule.remove()
} else if (layerRule.params === 'components') {
for (let node of layerRule.nodes) {
layerPlugins.push(function ({ addComponents }) {
addComponents(node, { respectPrefix: false })
})
}
layerRule.remove()
} else if (layerRule.params === 'utilities') {
for (let node of layerRule.nodes) {
layerPlugins.push(function ({ addUtilities }) {
addUtilities(node, { respectPrefix: false })
})
}
layerRule.remove()
}
})
return layerPlugins
}
function resolvePlugins(context, root) {
let corePluginList = Object.entries({ ...variantPlugins, ...corePlugins })
.map(([name, plugin]) => {
if (!context.tailwindConfig.corePlugins.includes(name)) {
return null
}
return plugin
})
.filter(Boolean)
let userPlugins = context.tailwindConfig.plugins.map((plugin) => {
if (plugin.__isOptionsFunction) {
plugin = plugin()
}
return typeof plugin === 'function' ? plugin : plugin.handler
})
let layerPlugins = collectLayerPlugins(root)
// TODO: This is a workaround for backwards compatibility, since custom variants
// were historically sorted before screen/stackable variants.
let beforeVariants = [
variantPlugins['pseudoElementVariants'],
variantPlugins['pseudoClassVariants'],
]
let afterVariants = [
variantPlugins['directionVariants'],
variantPlugins['reducedMotionVariants'],
variantPlugins['darkVariants'],
variantPlugins['printVariant'],
variantPlugins['screenVariants'],
variantPlugins['orientationVariants'],
]
return [...corePluginList, ...beforeVariants, ...userPlugins, ...afterVariants, ...layerPlugins]
}
function registerPlugins(plugins, context) {
let variantList = []
let variantMap = new Map()
let offsets = {
defaults: 0n,
base: 0n,
components: 0n,
utilities: 0n,
user: 0n,
}
let classList = new Set()
let pluginApi = buildPluginApi(context.tailwindConfig, context, {
variantList,
variantMap,
offsets,
classList,
})
for (let plugin of plugins) {
if (Array.isArray(plugin)) {
for (let pluginItem of plugin) {
pluginItem(pluginApi)
}
} else {
plugin?.(pluginApi)
}
}
let highestOffset = ((args) => args.reduce((m, e) => (e > m ? e : m)))([
offsets.base,
offsets.defaults,
offsets.components,
offsets.utilities,
offsets.user,
])
let reservedBits = BigInt(highestOffset.toString(2).length)
// A number one less than the top range of the highest offset area
// so arbitrary properties are always sorted at the end.
context.arbitraryPropertiesSort = ((1n << reservedBits) << 0n) - 1n
context.layerOrder = {
defaults: (1n << reservedBits) << 0n,
base: (1n << reservedBits) << 1n,
components: (1n << reservedBits) << 2n,
utilities: (1n << reservedBits) << 3n,
user: (1n << reservedBits) << 4n,
}
reservedBits += 5n
let offset = 0
context.variantOrder = new Map(
variantList
.map((variant, i) => {
let variantFunctions = variantMap.get(variant).length
let bits = (1n << BigInt(i + offset)) << reservedBits
offset += variantFunctions - 1
return [variant, bits]
})
.sort(([, a], [, z]) => bigSign(a - z))
)
context.minimumScreen = [...context.variantOrder.values()].shift()
// Build variantMap
for (let [variantName, variantFunctions] of variantMap.entries()) {
let sort = context.variantOrder.get(variantName)
context.variantMap.set(
variantName,
variantFunctions.map((variantFunction, idx) => [sort << BigInt(idx), variantFunction])
)
}
let safelist = (context.tailwindConfig.safelist ?? []).filter(Boolean)
if (safelist.length > 0) {
let checks = []
for (let value of safelist) {
if (typeof value === 'string') {
context.changedContent.push({ content: value, extension: 'html' })
continue
}
if (value instanceof RegExp) {
log.warn('root-regex', [
'Regular expressions in `safelist` work differently in Tailwind CSS v3.0.',
'Update your `safelist` configuration to eliminate this warning.',
'https://tailwindcss.com/docs/content-configuration#safelisting-classes',
])
continue
}
checks.push(value)
}
if (checks.length > 0) {
let patternMatchingCount = new Map()
let prefixLength = context.tailwindConfig.prefix.length
for (let util of classList) {
let utils = Array.isArray(util)
? (() => {
let [utilName, options] = util
let values = Object.keys(options?.values ?? {})
let classes = values.map((value) => formatClass(utilName, value))
if (options?.supportsNegativeValues) {
// This is the normal negated version
// e.g. `-inset-1` or `-tw-inset-1`
classes = [...classes, ...classes.map((cls) => '-' + cls)]
// This is the negated version *after* the prefix
// e.g. `tw--inset-1`
// The prefix is already attached to util name
// So we add the negative after the prefix
classes = [
...classes,
...classes.map(
(cls) => cls.slice(0, prefixLength) + '-' + cls.slice(prefixLength)
),
]
}
return classes
})()
: [util]
for (let util of utils) {
for (let { pattern, variants = [] } of checks) {
// RegExp with the /g flag are stateful, so let's reset the last
// index pointer to reset the state.
pattern.lastIndex = 0
if (!patternMatchingCount.has(pattern)) {
patternMatchingCount.set(pattern, 0)
}
if (!pattern.test(util)) continue
patternMatchingCount.set(pattern, patternMatchingCount.get(pattern) + 1)
context.changedContent.push({ content: util, extension: 'html' })
for (let variant of variants) {
context.changedContent.push({
content: variant + context.tailwindConfig.separator + util,
extension: 'html',
})
}
}
}
}
for (let [regex, count] of patternMatchingCount.entries()) {
if (count !== 0) continue
log.warn([
`The safelist pattern \`${regex}\` doesn't match any Tailwind CSS classes.`,
'Fix this pattern or remove it from your `safelist` configuration.',
'https://tailwindcss.com/docs/content-configuration#safelisting-classes',
])
}
}
}
// A list of utilities that are used by certain Tailwind CSS utilities but
// that don't exist on their own. This will result in them "not existing" and
// sorting could be weird since you still require them in order to make the
// host utitlies work properly. (Thanks Biology)
let parasiteUtilities = new Set([prefix(context, 'group'), prefix(context, 'peer')])
context.getClassOrder = function getClassOrder(classes) {
let sortedClassNames = new Map()
for (let [sort, rule] of generateRules(new Set(classes), context)) {
if (sortedClassNames.has(rule.raws.tailwind.candidate)) continue
sortedClassNames.set(rule.raws.tailwind.candidate, sort)
}
return classes.map((className) => {
let order = sortedClassNames.get(className) ?? null
if (order === null && parasiteUtilities.has(className)) {
// This will make sure that it is at the very beginning of the
// `components` layer which technically means 'before any
// components'.
order = context.layerOrder.components
}
return [className, order]
})
}
// Generate a list of strings for autocompletion purposes, e.g.
// ['uppercase', 'lowercase', ...]
context.getClassList = function getClassList() {
let output = []
for (let util of classList) {
if (Array.isArray(util)) {
let [utilName, options] = util
let negativeClasses = []
for (let [key, value] of Object.entries(options?.values ?? {})) {
output.push(formatClass(utilName, key))
if (options?.supportsNegativeValues && negateValue(value)) {
negativeClasses.push(formatClass(utilName, `-${key}`))
}
}
output.push(...negativeClasses)
} else {
output.push(util)
}
}
return output
}
}
export function createContext(tailwindConfig, changedContent = [], root = postcss.root()) {
let context = {
disposables: [],
ruleCache: new Set(),
classCache: new Map(),
applyClassCache: new Map(),
notClassCache: new Set(),
postCssNodeCache: new Map(),
candidateRuleMap: new Map(),
tailwindConfig,
changedContent: changedContent,
variantMap: new Map(),
stylesheetCache: null,
}
let resolvedPlugins = resolvePlugins(context, root)
registerPlugins(resolvedPlugins, context)
return context
}
let contextMap = sharedState.contextMap
let configContextMap = sharedState.configContextMap
let contextSourcesMap = sharedState.contextSourcesMap
export function getContext(
root,
result,
tailwindConfig,
userConfigPath,
tailwindConfigHash,
contextDependencies
) {
let sourcePath = result.opts.from
let isConfigFile = userConfigPath !== null
env.DEBUG && console.log('Source path:', sourcePath)
let existingContext
if (isConfigFile && contextMap.has(sourcePath)) {
existingContext = contextMap.get(sourcePath)
} else if (configContextMap.has(tailwindConfigHash)) {
let context = configContextMap.get(tailwindConfigHash)
contextSourcesMap.get(context).add(sourcePath)
contextMap.set(sourcePath, context)
existingContext = context
}
let cssDidChange = hasContentChanged(sourcePath, root)
// If there's already a context in the cache and we don't need to
// reset the context, return the cached context.
if (existingContext) {
let contextDependenciesChanged = trackModified(
[...contextDependencies],
getFileModifiedMap(existingContext)
)
if (!contextDependenciesChanged && !cssDidChange) {
return [existingContext, false]
}
}
// If this source is in the context map, get the old context.
// Remove this source from the context sources for the old context,
// and clean up that context if no one else is using it. This can be
// called by many processes in rapid succession, so we check for presence
// first because the first process to run this code will wipe it out first.
if (contextMap.has(sourcePath)) {
let oldContext = contextMap.get(sourcePath)
if (contextSourcesMap.has(oldContext)) {
contextSourcesMap.get(oldContext).delete(sourcePath)
if (contextSourcesMap.get(oldContext).size === 0) {
contextSourcesMap.delete(oldContext)
for (let [tailwindConfigHash, context] of configContextMap) {
if (context === oldContext) {
configContextMap.delete(tailwindConfigHash)
}
}
for (let disposable of oldContext.disposables.splice(0)) {
disposable(oldContext)
}
}
}
}
env.DEBUG && console.log('Setting up new context...')
let context = createContext(tailwindConfig, [], root)
trackModified([...contextDependencies], getFileModifiedMap(context))
// ---
// Update all context tracking state
configContextMap.set(tailwindConfigHash, context)
contextMap.set(sourcePath, context)
if (!contextSourcesMap.has(context)) {
contextSourcesMap.set(context, new Set())
}
contextSourcesMap.get(context).add(sourcePath)
return [context, true]
}
-183
src/lib/setupTrackingContext.js
import fs from 'fs'
import path from 'path'
import fastGlob from 'fast-glob'
import LRU from 'quick-lru'
import normalizePath from 'normalize-path'
import hash from '../util/hashConfig'
import getModuleDependencies from '../lib/getModuleDependencies'
import resolveConfig from '../public/resolve-config'
import resolveConfigPath from '../util/resolveConfigPath'
import { env } from './sharedState'
import { getContext, getFileModifiedMap } from './setupContextUtils'
import parseDependency from '../util/parseDependency'
let configPathCache = new LRU({ maxSize: 100 })
let candidateFilesCache = new WeakMap()
function getCandidateFiles(context, tailwindConfig) {
if (candidateFilesCache.has(context)) {
return candidateFilesCache.get(context)
}
let candidateFiles = tailwindConfig.content.files
.filter((item) => typeof item === 'string')
.map((contentPath) => normalizePath(contentPath))
return candidateFilesCache.set(context, candidateFiles).get(context)
}
// Get the config object based on a path
function getTailwindConfig(configOrPath) {
let userConfigPath = resolveConfigPath(configOrPath)
if (userConfigPath !== null) {
let [prevConfig, prevConfigHash, prevDeps, prevModified] =
configPathCache.get(userConfigPath) || []
let newDeps = getModuleDependencies(userConfigPath).map((dep) => dep.file)
let modified = false
let newModified = new Map()
for (let file of newDeps) {
let time = fs.statSync(file).mtimeMs
newModified.set(file, time)
if (!prevModified || !prevModified.has(file) || time > prevModified.get(file)) {
modified = true
}
}
// It hasn't changed (based on timestamps)
if (!modified) {
return [prevConfig, userConfigPath, prevConfigHash, prevDeps]
}
// It has changed (based on timestamps), or first run
for (let file of newDeps) {
delete require.cache[file]
}
let newConfig = resolveConfig(require(userConfigPath))
let newHash = hash(newConfig)
configPathCache.set(userConfigPath, [newConfig, newHash, newDeps, newModified])
return [newConfig, userConfigPath, newHash, newDeps]
}
// It's a plain object, not a path
let newConfig = resolveConfig(
configOrPath.config === undefined ? configOrPath : configOrPath.config
)
return [newConfig, null, hash(newConfig), []]
}
function resolvedChangedContent(context, candidateFiles, fileModifiedMap) {
let changedContent = context.tailwindConfig.content.files
.filter((item) => typeof item.raw === 'string')
.map(({ raw, extension = 'html' }) => ({ content: raw, extension }))
for (let changedFile of resolveChangedFiles(candidateFiles, fileModifiedMap)) {
let content = fs.readFileSync(changedFile, 'utf8')
let extension = path.extname(changedFile).slice(1)
changedContent.push({ content, extension })
}
return changedContent
}
function resolveChangedFiles(candidateFiles, fileModifiedMap) {
let changedFiles = new Set()
env.DEBUG && console.time('Finding changed files')
let files = fastGlob.sync(candidateFiles)
for (let file of files) {
let prevModified = fileModifiedMap.has(file) ? fileModifiedMap.get(file) : -Infinity
let modified = fs.statSync(file).mtimeMs
if (modified > prevModified) {
changedFiles.add(file)
fileModifiedMap.set(file, modified)
}
}
env.DEBUG && console.timeEnd('Finding changed files')
return changedFiles
}
// DISABLE_TOUCH = TRUE
// Retrieve an existing context from cache if possible (since contexts are unique per
// source path), or set up a new one (including setting up watchers and registering
// plugins) then return it
export default function setupTrackingContext(configOrPath) {
return ({ tailwindDirectives, registerDependency }) => {
return (root, result) => {
let [tailwindConfig, userConfigPath, tailwindConfigHash, configDependencies] =
getTailwindConfig(configOrPath)
let contextDependencies = new Set(configDependencies)
// If there are no @tailwind or @apply rules, we don't consider this CSS
// file or its dependencies to be dependencies of the context. Can reuse
// the context even if they change. We may want to think about `@layer`
// being part of this trigger too, but it's tough because it's impossible
// for a layer in one file to end up in the actual @tailwind rule in
// another file since independent sources are effectively isolated.
if (tailwindDirectives.size > 0) {
// Add current css file as a context dependencies.
contextDependencies.add(result.opts.from)
// Add all css @import dependencies as context dependencies.
for (let message of result.messages) {
if (message.type === 'dependency') {
contextDependencies.add(message.file)
}
}
}
let [context] = getContext(
root,
result,
tailwindConfig,
userConfigPath,
tailwindConfigHash,
contextDependencies
)
let candidateFiles = getCandidateFiles(context, tailwindConfig)
// If there are no @tailwind or @apply rules, we don't consider this CSS file or it's
// dependencies to be dependencies of the context. Can reuse the context even if they change.
// We may want to think about `@layer` being part of this trigger too, but it's tough
// because it's impossible for a layer in one file to end up in the actual @tailwind rule
// in another file since independent sources are effectively isolated.
if (tailwindDirectives.size > 0) {
let fileModifiedMap = getFileModifiedMap(context)
// Add template paths as postcss dependencies.
for (let fileOrGlob of candidateFiles) {
let dependency = parseDependency(fileOrGlob)
if (dependency) {
registerDependency(dependency)
}
}
for (let changedContent of resolvedChangedContent(
context,
candidateFiles,
fileModifiedMap
)) {
context.changedContent.push(changedContent)
}
}
for (let file of configDependencies) {
registerDependency({ type: 'dependency', file })
}
return context
}
}
}
-48
src/lib/sharedState.js
export const env = {
NODE_ENV: process.env.NODE_ENV,
DEBUG: resolveDebug(process.env.DEBUG),
}
export const contextMap = new Map()
export const configContextMap = new Map()
export const contextSourcesMap = new Map()
export const sourceHashMap = new Map()
export const NOT_ON_DEMAND = new String('*')
export function resolveDebug(debug) {
if (debug === undefined) {
return false
}
// Environment variables are strings, so convert to boolean
if (debug === 'true' || debug === '1') {
return true
}
if (debug === 'false' || debug === '0') {
return false
}
// Keep the debug convention into account:
// DEBUG=* -> This enables all debug modes
// DEBUG=projectA,projectB,projectC -> This enables debug for projectA, projectB and projectC
// DEBUG=projectA:* -> This enables all debug modes for projectA (if you have sub-types)
// DEBUG=projectA,-projectB -> This enables debug for projectA and explicitly disables it for projectB
if (debug === '*') {
return true
}
let debuggers = debug.split(',').map((d) => d.split(':')[0])
// Ignoring tailwindcss
if (debuggers.includes('-tailwindcss')) {
return false
}
// Including tailwindcss
if (debuggers.includes('tailwindcss')) {
return true
}
return false
}
-19
src/lib/substituteScreenAtRules.js
import { normalizeScreens } from '../util/normalizeScreens'
import buildMediaQuery from '../util/buildMediaQuery'
export default function ({ tailwindConfig: { theme } }) {
return function (css) {
css.walkAtRules('screen', (atRule) => {
let screen = atRule.params
let screens = normalizeScreens(theme.screens)
let screenDefinition = screens.find(({ name }) => name === screen)
if (!screenDefinition) {
throw atRule.error(`No \`${screen}\` screen found.`)
}
atRule.name = 'media'
atRule.params = buildMediaQuery(screenDefinition)
})
}
}
-13
src/postcss-plugins/nesting/index.js
import { nesting } from './plugin'
export default Object.assign(
function (opts) {
return {
postcssPlugin: 'tailwindcss/nesting',
Once(root, { result }) {
return nesting(opts)(root, result)
},
}
},
{ postcss: true }
)
-80
src/postcss-plugins/nesting/plugin.js
import postcss from 'postcss'
import postcssNested from 'postcss-nested'
export function nesting(opts = postcssNested) {
return (root, result) => {
root.walkAtRules('screen', (rule) => {
rule.name = 'media'
rule.params = `screen(${rule.params})`
})
root.walkAtRules('apply', (rule) => {
rule.before(postcss.decl({ prop: '__apply', value: rule.params, source: rule.source }))
rule.remove()
})
let plugin = (() => {
if (
typeof opts === 'function' ||
(typeof opts === 'object' && opts?.hasOwnProperty?.('postcssPlugin'))
) {
return opts
}
if (typeof opts === 'string') {
return require(opts)
}
if (Object.keys(opts).length <= 0) {
return postcssNested
}
throw new Error('tailwindcss/nesting should be loaded with a nesting plugin.')
})()
postcss([plugin]).process(root, result.opts).sync()
root.walkDecls('__apply', (decl) => {
decl.before(postcss.atRule({ name: 'apply', params: decl.value, source: decl.source }))
decl.remove()
})
/**
* Use a private PostCSS API to remove the "clean" flag from the entire AST.
* This is done because running process() on the AST will set the "clean"
* flag on all nodes, which we don't want.
*
* This causes downstream plugins using the visitor API to be skipped.
*
* This is guarded because the PostCSS API is not public
* and may change in future versions of PostCSS.
*
* See https://github.com/postcss/postcss/issues/1712 for more details
*
* @param {import('postcss').Node} node
*/
function markDirty(node) {
if (!('markDirty' in node)) {
return
}
// Traverse the tree down to the leaf nodes
if (node.nodes) {
node.nodes.forEach((n) => markDirty(n))
}
// If it's a leaf node mark it as dirty
// We do this here because marking a node as dirty
// will walk up the tree and mark all parents as dirty
// resulting in a lot of unnecessary work if we did this
// for every single node
if (!node.nodes) {
node.markDirty()
}
}
markDirty(root)
return root
}
}
-42
src/postcss-plugins/nesting/README.md
# tailwindcss/nesting
This is a PostCSS plugin that wraps [postcss-nested](https://github.com/postcss/postcss-nested) or [postcss-nesting](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-nesting) and acts as a compatibility layer to make sure your nesting plugin of choice properly understands Tailwind's custom syntax like `@apply` and `@screen`.
Add it to your PostCSS configuration, somewhere before Tailwind itself:
```js
// postcss.config.js
module.exports = {
plugins: [
require('postcss-import'),
require('tailwindcss/nesting'),
require('tailwindcss'),
require('autoprefixer'),
]
}
```
By default, it uses the [postcss-nested](https://github.com/postcss/postcss-nested) plugin under the hood, which uses a Sass-like syntax and is the plugin that powers nesting support in the [Tailwind CSS plugin API](https://tailwindcss.com/docs/plugins#css-in-js-syntax).
If you'd rather use [postcss-nesting](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-nesting) (which is based on the work-in-progress [CSS Nesting](https://drafts.csswg.org/css-nesting-1/) specification), first install the plugin alongside:
```shell
npm install postcss-nesting
```
Then pass the plugin itself as an argument to `tailwindcss/nesting` in your PostCSS configuration:
```js
// postcss.config.js
module.exports = {
plugins: [
require('postcss-import'),
require('tailwindcss/nesting')(require('postcss-nesting')),
require('tailwindcss'),
require('autoprefixer'),
]
}
```
This can also be helpful if for whatever reason you need to use a very specific version of `postcss-nested` and want to override the version we bundle with `tailwindcss/nesting` itself.
-58
src/processTailwindFeatures.js
import normalizeTailwindDirectives from './lib/normalizeTailwindDirectives'
import expandTailwindAtRules from './lib/expandTailwindAtRules'
import expandApplyAtRules from './lib/expandApplyAtRules'
import evaluateTailwindFunctions from './lib/evaluateTailwindFunctions'
import substituteScreenAtRules from './lib/substituteScreenAtRules'
import resolveDefaultsAtRules from './lib/resolveDefaultsAtRules'
import collapseAdjacentRules from './lib/collapseAdjacentRules'
import collapseDuplicateDeclarations from './lib/collapseDuplicateDeclarations'
import partitionApplyAtRules from './lib/partitionApplyAtRules'
import detectNesting from './lib/detectNesting'
import { createContext } from './lib/setupContextUtils'
import { issueFlagNotices } from './featureFlags'
export default function processTailwindFeatures(setupContext) {
return function (root, result) {
let { tailwindDirectives, applyDirectives } = normalizeTailwindDirectives(root)
detectNesting()(root, result)
// Partition apply rules that are found in the css
// itself.
partitionApplyAtRules()(root, result)
let context = setupContext({
tailwindDirectives,
applyDirectives,
registerDependency(dependency) {
result.messages.push({
plugin: 'tailwindcss',
parent: result.opts.from,
...dependency,
})
},
createContext(tailwindConfig, changedContent) {
return createContext(tailwindConfig, changedContent, root)
},
})(root, result)
if (context.tailwindConfig.separator === '-') {
throw new Error(
"The '-' character cannot be used as a custom separator in JIT mode due to parsing ambiguity. Please use another character like '_' instead."
)
}
issueFlagNotices(context.tailwindConfig)
expandTailwindAtRules(context)(root, result)
// Partition apply rules that are generated by
// addComponents, addUtilities and so on.
partitionApplyAtRules()(root, result)
expandApplyAtRules(context)(root, result)
evaluateTailwindFunctions(context)(root, result)
substituteScreenAtRules(context)(root, result)
resolveDefaultsAtRules(context)(root, result)
collapseAdjacentRules(context)(root, result)
collapseDuplicateDeclarations(context)(root, result)
}
}
-300
src/public/colors.js
import log from '../util/log'
function warn({ version, from, to }) {
log.warn(`${from}-color-renamed`, [
`As of Tailwind CSS ${version}, \`${from}\` has been renamed to \`${to}\`.`,
'Update your configuration file to silence this warning.',
])
}
export default {
inherit: 'inherit',
current: 'currentColor',
transparent: 'transparent',
black: '#000',
white: '#fff',
slate: {
50: '#f8fafc',
100: '#f1f5f9',
200: '#e2e8f0',
300: '#cbd5e1',
400: '#94a3b8',
500: '#64748b',
600: '#475569',
700: '#334155',
800: '#1e293b',
900: '#0f172a',
},
gray: {
50: '#f9fafb',
100: '#f3f4f6',
200: '#e5e7eb',
300: '#d1d5db',
400: '#9ca3af',
500: '#6b7280',
600: '#4b5563',
700: '#374151',
800: '#1f2937',
900: '#111827',
},
zinc: {
50: '#fafafa',
100: '#f4f4f5',
200: '#e4e4e7',
300: '#d4d4d8',
400: '#a1a1aa',
500: '#71717a',
600: '#52525b',
700: '#3f3f46',
800: '#27272a',
900: '#18181b',
},
neutral: {
50: '#fafafa',
100: '#f5f5f5',
200: '#e5e5e5',
300: '#d4d4d4',
400: '#a3a3a3',
500: '#737373',
600: '#525252',
700: '#404040',
800: '#262626',
900: '#171717',
},
stone: {
50: '#fafaf9',
100: '#f5f5f4',
200: '#e7e5e4',
300: '#d6d3d1',
400: '#a8a29e',
500: '#78716c',
600: '#57534e',
700: '#44403c',
800: '#292524',
900: '#1c1917',
},
red: {
50: '#fef2f2',
100: '#fee2e2',
200: '#fecaca',
300: '#fca5a5',
400: '#f87171',
500: '#ef4444',
600: '#dc2626',
700: '#b91c1c',
800: '#991b1b',
900: '#7f1d1d',
},
orange: {
50: '#fff7ed',
100: '#ffedd5',
200: '#fed7aa',
300: '#fdba74',
400: '#fb923c',
500: '#f97316',
600: '#ea580c',
700: '#c2410c',
800: '#9a3412',
900: '#7c2d12',
},
amber: {
50: '#fffbeb',
100: '#fef3c7',
200: '#fde68a',
300: '#fcd34d',
400: '#fbbf24',
500: '#f59e0b',
600: '#d97706',
700: '#b45309',
800: '#92400e',
900: '#78350f',
},
yellow: {
50: '#fefce8',
100: '#fef9c3',
200: '#fef08a',
300: '#fde047',
400: '#facc15',
500: '#eab308',
600: '#ca8a04',
700: '#a16207',
800: '#854d0e',
900: '#713f12',
},
lime: {
50: '#f7fee7',
100: '#ecfccb',
200: '#d9f99d',
300: '#bef264',
400: '#a3e635',
500: '#84cc16',
600: '#65a30d',
700: '#4d7c0f',
800: '#3f6212',
900: '#365314',
},
green: {
50: '#f0fdf4',
100: '#dcfce7',
200: '#bbf7d0',
300: '#86efac',
400: '#4ade80',
500: '#22c55e',
600: '#16a34a',
700: '#15803d',
800: '#166534',
900: '#14532d',
},
emerald: {
50: '#ecfdf5',
100: '#d1fae5',
200: '#a7f3d0',
300: '#6ee7b7',
400: '#34d399',
500: '#10b981',
600: '#059669',
700: '#047857',
800: '#065f46',
900: '#064e3b',
},
teal: {
50: '#f0fdfa',
100: '#ccfbf1',
200: '#99f6e4',
300: '#5eead4',
400: '#2dd4bf',
500: '#14b8a6',
600: '#0d9488',
700: '#0f766e',
800: '#115e59',
900: '#134e4a',
},
cyan: {
50: '#ecfeff',
100: '#cffafe',
200: '#a5f3fc',
300: '#67e8f9',
400: '#22d3ee',
500: '#06b6d4',
600: '#0891b2',
700: '#0e7490',
800: '#155e75',
900: '#164e63',
},
sky: {
50: '#f0f9ff',
100: '#e0f2fe',
200: '#bae6fd',
300: '#7dd3fc',
400: '#38bdf8',
500: '#0ea5e9',
600: '#0284c7',
700: '#0369a1',
800: '#075985',
900: '#0c4a6e',
},
blue: {
50: '#eff6ff',
100: '#dbeafe',
200: '#bfdbfe',
300: '#93c5fd',
400: '#60a5fa',
500: '#3b82f6',
600: '#2563eb',
700: '#1d4ed8',
800: '#1e40af',
900: '#1e3a8a',
},
indigo: {
50: '#eef2ff',
100: '#e0e7ff',
200: '#c7d2fe',
300: '#a5b4fc',
400: '#818cf8',
500: '#6366f1',
600: '#4f46e5',
700: '#4338ca',
800: '#3730a3',
900: '#312e81',
},
violet: {
50: '#f5f3ff',
100: '#ede9fe',
200: '#ddd6fe',
300: '#c4b5fd',
400: '#a78bfa',
500: '#8b5cf6',
600: '#7c3aed',
700: '#6d28d9',
800: '#5b21b6',
900: '#4c1d95',
},
purple: {
50: '#faf5ff',
100: '#f3e8ff',
200: '#e9d5ff',
300: '#d8b4fe',
400: '#c084fc',
500: '#a855f7',
600: '#9333ea',
700: '#7e22ce',
800: '#6b21a8',
900: '#581c87',
},
fuchsia: {
50: '#fdf4ff',
100: '#fae8ff',
200: '#f5d0fe',
300: '#f0abfc',
400: '#e879f9',
500: '#d946ef',
600: '#c026d3',
700: '#a21caf',
800: '#86198f',
900: '#701a75',
},
pink: {
50: '#fdf2f8',
100: '#fce7f3',
200: '#fbcfe8',
300: '#f9a8d4',
400: '#f472b6',
500: '#ec4899',
600: '#db2777',
700: '#be185d',
800: '#9d174d',
900: '#831843',
},
rose: {
50: '#fff1f2',
100: '#ffe4e6',
200: '#fecdd3',
300: '#fda4af',
400: '#fb7185',
500: '#f43f5e',
600: '#e11d48',
700: '#be123c',
800: '#9f1239',
900: '#881337',
},
get lightBlue() {
warn({ version: 'v2.2', from: 'lightBlue', to: 'sky' })
return this.sky
},
get warmGray() {
warn({ version: 'v3.0', from: 'warmGray', to: 'stone' })
return this.stone
},
get trueGray() {
warn({ version: 'v3.0', from: 'trueGray', to: 'neutral' })
return this.neutral
},
get coolGray() {
warn({ version: 'v3.0', from: 'coolGray', to: 'gray' })
return this.gray
},
get blueGray() {
warn({ version: 'v3.0', from: 'blueGray', to: 'slate' })
return this.slate
},
}
-2
src/public/create-plugin.js
import createPlugin from '../util/createPlugin'
export default createPlugin
-4
src/public/default-config.js
import { cloneDeep } from '../util/cloneDeep'
import defaultConfig from '../../stubs/defaultConfig.stub'
export default cloneDeep(defaultConfig)
-4
src/public/default-theme.js
import { cloneDeep } from '../util/cloneDeep'
import defaultConfig from '../../stubs/defaultConfig.stub'
export default cloneDeep(defaultConfig.theme)
-7
src/public/resolve-config.js
import resolveConfigObjects from '../util/resolveConfig'
import getAllConfigs from '../util/getAllConfigs'
export default function resolveConfig(...configs) {
let [, ...defaultConfigs] = getAllConfigs(configs[0])
return resolveConfigObjects([...configs, ...defaultConfigs])
}
-3
src/util/bigSign.js
export default function bigSign(bigIntValue) {
return (bigIntValue > 0n) - (bigIntValue < 0n)
}
-20
src/util/buildMediaQuery.js
export default function buildMediaQuery(screens) {
screens = Array.isArray(screens) ? screens : [screens]
return screens
.map((screen) =>
screen.values.map((screen) => {
if (screen.raw !== undefined) {
return screen.raw
}
return [
screen.min && `(min-width: ${screen.min})`,
screen.max && `(max-width: ${screen.max})`,
]
.filter(Boolean)
.join(' and ')
})
)
.join(', ')
}
-11
src/util/cloneDeep.js
export function cloneDeep(value) {
if (Array.isArray(value)) {
return value.map((child) => cloneDeep(child))
}
if (typeof value === 'object' && value !== null) {
return Object.fromEntries(Object.entries(value).map(([k, v]) => [k, cloneDeep(v)]))
}
return value
}
-24
src/util/cloneNodes.js
export default function cloneNodes(nodes, source = undefined, raws = undefined) {
return nodes.map((node) => {
let cloned = node.clone()
if (source !== undefined) {
cloned.source = source
if ('walk' in cloned) {
cloned.walk((child) => {
child.source = source
})
}
}
if (raws !== undefined) {
cloned.raws.tailwind = {
...cloned.raws.tailwind,
...raws,
}
}
return cloned
})
}
-71
src/util/color.js
import namedColors from 'color-name'
let HEX = /^#([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})?$/i
let SHORT_HEX = /^#([a-f\d])([a-f\d])([a-f\d])([a-f\d])?$/i
let VALUE = /(?:\d+|\d*\.\d+)%?/
let SEP = /(?:\s*,\s*|\s+)/
let ALPHA_SEP = /\s*[,/]\s*/
let CUSTOM_PROPERTY = /var\(--(?:[^ )]*?)\)/
let RGB = new RegExp(
`^rgba?\\(\\s*(${VALUE.source}|${CUSTOM_PROPERTY.source})${SEP.source}(${VALUE.source}|${CUSTOM_PROPERTY.source})${SEP.source}(${VALUE.source}|${CUSTOM_PROPERTY.source})(?:${ALPHA_SEP.source}(${VALUE.source}|${CUSTOM_PROPERTY.source}))?\\s*\\)$`
)
let HSL = new RegExp(
`^hsla?\\(\\s*((?:${VALUE.source})(?:deg|rad|grad|turn)?|${CUSTOM_PROPERTY.source})${SEP.source}(${VALUE.source}|${CUSTOM_PROPERTY.source})${SEP.source}(${VALUE.source}|${CUSTOM_PROPERTY.source})(?:${ALPHA_SEP.source}(${VALUE.source}|${CUSTOM_PROPERTY.source}))?\\s*\\)$`
)
export function parseColor(value) {
if (typeof value !== 'string') {
return null
}
value = value.trim()
if (value === 'transparent') {
return { mode: 'rgb', color: ['0', '0', '0'], alpha: '0' }
}
if (value in namedColors) {
return { mode: 'rgb', color: namedColors[value].map((v) => v.toString()) }
}
let hex = value
.replace(SHORT_HEX, (_, r, g, b, a) => ['#', r, r, g, g, b, b, a ? a + a : ''].join(''))
.match(HEX)
if (hex !== null) {
return {
mode: 'rgb',
color: [parseInt(hex[1], 16), parseInt(hex[2], 16), parseInt(hex[3], 16)].map((v) =>
v.toString()
),
alpha: hex[4] ? (parseInt(hex[4], 16) / 255).toString() : undefined,
}
}
let rgbMatch = value.match(RGB)
if (rgbMatch !== null) {
return {
mode: 'rgb',
color: [rgbMatch[1], rgbMatch[2], rgbMatch[3]].map((v) => v.toString()),
alpha: rgbMatch[4]?.toString?.(),
}
}
let hslMatch = value.match(HSL)
if (hslMatch !== null) {
return {
mode: 'hsl',
color: [hslMatch[1], hslMatch[2], hslMatch[3]].map((v) => v.toString()),
alpha: hslMatch[4]?.toString?.(),
}
}
return null
}
export function formatColor({ mode, color, alpha }) {
let hasAlpha = alpha !== undefined
return `${mode}(${color.join(' ')}${hasAlpha ? ` / ${alpha}` : ''})`
}
-23
src/util/configurePlugins.js
export default function (pluginConfig, plugins) {
if (pluginConfig === undefined) {
return plugins
}
const pluginNames = Array.isArray(pluginConfig)
? pluginConfig
: [
...new Set(
plugins
.filter((pluginName) => {
return pluginConfig !== false && pluginConfig[pluginName] !== false
})
.concat(
Object.keys(pluginConfig).filter((pluginName) => {
return pluginConfig[pluginName] !== false
})
)
),
]
return pluginNames
}
-27
src/util/createPlugin.js
function createPlugin(plugin, config) {
return {
handler: plugin,
config,
}
}
createPlugin.withOptions = function (pluginFunction, configFunction = () => ({})) {
const optionsFunction = function (options) {
return {
__options: options,
handler: pluginFunction(options),
config: configFunction(options),
}
}
optionsFunction.__isOptionsFunction = true
// Expose plugin dependencies so that `object-hash` returns a different
// value if anything here changes, to ensure a rebuild is triggered.
optionsFunction.__pluginFunction = pluginFunction
optionsFunction.__configFunction = configFunction
return optionsFunction
}
export default createPlugin
-37
src/util/createUtilityPlugin.js
import transformThemeValue from './transformThemeValue'
export default function createUtilityPlugin(
themeKey,
utilityVariations = [[themeKey, [themeKey]]],
{ filterDefault = false, ...options } = {}
) {
let transformValue = transformThemeValue(themeKey)
return function ({ matchUtilities, theme }) {
for (let utilityVariation of utilityVariations) {
let group = Array.isArray(utilityVariation[0]) ? utilityVariation : [utilityVariation]
matchUtilities(
group.reduce((obj, [classPrefix, properties]) => {
return Object.assign(obj, {
[classPrefix]: (value) => {
return properties.reduce((obj, name) => {
if (Array.isArray(name)) {
return Object.assign(obj, { [name[0]]: name[1] })
}
return Object.assign(obj, { [name]: transformValue(value) })
}, {})
},
})
}, {}),
{
...options,
values: filterDefault
? Object.fromEntries(
Object.entries(theme(themeKey) ?? {}).filter(([modifier]) => modifier !== 'DEFAULT')
)
: theme(themeKey),
}
)
}
}
}
-250
src/util/dataTypes.js
import { parseColor } from './color'
import { parseBoxShadowValue } from './parseBoxShadowValue'
let cssFunctions = ['min', 'max', 'clamp', 'calc']
// Ref: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Types
let COMMA = /,(?![^(]*\))/g // Comma separator that is not located between brackets. E.g.: `cubiz-bezier(a, b, c)` these don't count.
let UNDERSCORE = /_(?![^(]*\))/g // Underscore separator that is not located between brackets. E.g.: `rgba(255,_255,_255)_black` these don't count.
// This is not a data type, but rather a function that can normalize the
// correct values.
export function normalize(value, isRoot = true) {
// Keep raw strings if it starts with `url(`
if (value.includes('url(')) {
return value
.split(/(url\(.*?\))/g)
.filter(Boolean)
.map((part) => {
if (/^url\(.*?\)$/.test(part)) {
return part
}
return normalize(part, false)
})
.join('')
}
// Convert `_` to ` `, except for escaped underscores `\_`
value = value
.replace(
/([^\\])_+/g,
(fullMatch, characterBefore) => characterBefore + ' '.repeat(fullMatch.length - 1)
)
.replace(/^_/g, ' ')
.replace(/\\_/g, '_')
// Remove leftover whitespace
if (isRoot) {
value = value.trim()
}
// Add spaces around operators inside calc() that do not follow an operator
// or '('.
return value.replace(
/(-?\d*\.?\d(?!\b-.+[,)](?![^+\-/*])\D)(?:%|[a-z]+)?|\))([+\-/*])/g,
'$1 $2 '
)
}
export function url(value) {
return value.startsWith('url(')
}
export function number(value) {
return !isNaN(Number(value)) || cssFunctions.some((fn) => new RegExp(`^${fn}\\(.+?`).test(value))
}
export function percentage(value) {
return value.split(UNDERSCORE).every((part) => {
return /%$/g.test(part) || cssFunctions.some((fn) => new RegExp(`^${fn}\\(.+?%`).test(part))
})
}
let lengthUnits = [
'cm',
'mm',
'Q',
'in',
'pc',
'pt',
'px',
'em',
'ex',
'ch',
'rem',
'lh',
'vw',
'vh',
'vmin',
'vmax',
]
let lengthUnitsPattern = `(?:${lengthUnits.join('|')})`
export function length(value) {
return value.split(UNDERSCORE).every((part) => {
return (
part === '0' ||
new RegExp(`${lengthUnitsPattern}$`).test(part) ||
cssFunctions.some((fn) => new RegExp(`^${fn}\\(.+?${lengthUnitsPattern}`).test(part))
)
})
}
let lineWidths = new Set(['thin', 'medium', 'thick'])
export function lineWidth(value) {
return lineWidths.has(value)
}
export function shadow(value) {
let parsedShadows = parseBoxShadowValue(normalize(value))
for (let parsedShadow of parsedShadows) {
if (!parsedShadow.valid) {
return false
}
}
return true
}
export function color(value) {
let colors = 0
let result = value.split(UNDERSCORE).every((part) => {
part = normalize(part)
if (part.startsWith('var(')) return true
if (parseColor(part) !== null) return colors++, true
return false
})
if (!result) return false
return colors > 0
}
export function image(value) {
let images = 0
let result = value.split(COMMA).every((part) => {
part = normalize(part)
if (part.startsWith('var(')) return true
if (
url(part) ||
gradient(part) ||
['element(', 'image(', 'cross-fade(', 'image-set('].some((fn) => part.startsWith(fn))
) {
images++
return true
}
return false
})
if (!result) return false
return images > 0
}
let gradientTypes = new Set([
'linear-gradient',
'radial-gradient',
'repeating-linear-gradient',
'repeating-radial-gradient',
'conic-gradient',
])
export function gradient(value) {
value = normalize(value)
for (let type of gradientTypes) {
if (value.startsWith(`${type}(`)) {
return true
}
}
return false
}
let validPositions = new Set(['center', 'top', 'right', 'bottom', 'left'])
export function position(value) {
let positions = 0
let result = value.split(UNDERSCORE).every((part) => {
part = normalize(part)
if (part.startsWith('var(')) return true
if (validPositions.has(part) || length(part) || percentage(part)) {
positions++
return true
}
return false
})
if (!result) return false
return positions > 0
}
export function familyName(value) {
let fonts = 0
let result = value.split(COMMA).every((part) => {
part = normalize(part)
if (part.startsWith('var(')) return true
// If it contains spaces, then it should be quoted
if (part.includes(' ')) {
if (!/(['"])([^"']+)\1/g.test(part)) {
return false
}
}
// If it starts with a number, it's invalid
if (/^\d/g.test(part)) {
return false
}
fonts++
return true
})
if (!result) return false
return fonts > 0
}
let genericNames = new Set([
'serif',
'sans-serif',
'monospace',
'cursive',
'fantasy',
'system-ui',
'ui-serif',
'ui-sans-serif',
'ui-monospace',
'ui-rounded',
'math',
'emoji',
'fangsong',
])
export function genericName(value) {
return genericNames.has(value)
}
let absoluteSizes = new Set([
'xx-small',
'x-small',
'small',
'medium',
'large',
'x-large',
'x-large',
'xxx-large',
])
export function absoluteSize(value) {
return absoluteSizes.has(value)
}
let relativeSizes = new Set(['larger', 'smaller'])
export function relativeSize(value) {
return relativeSizes.has(value)
}
-17
src/util/defaults.js
export function defaults(target, ...sources) {
for (let source of sources) {
for (let k in source) {
if (!target?.hasOwnProperty?.(k)) {
target[k] = source[k]
}
}
for (let k of Object.getOwnPropertySymbols(source)) {
if (!target?.hasOwnProperty?.(k)) {
target[k] = source[k]
}
}
}
return target
}
-8
src/util/escapeClassName.js
import parser from 'postcss-selector-parser'
import escapeCommas from './escapeCommas'
export default function escapeClassName(className) {
let node = parser.className()
node.value = className
return escapeCommas(node?.raws?.value ?? node.value)
}
-3
src/util/escapeCommas.js
export default function escapeCommas(className) {
return className.replace(/\\,/g, '\\2c ')
}
-13
src/util/flattenColorPalette.js
const flattenColorPalette = (colors) =>
Object.assign(
{},
...Object.entries(colors ?? {}).flatMap(([color, values]) =>
typeof values == 'object'
? Object.entries(flattenColorPalette(values)).map(([number, hex]) => ({
[color + (number === 'DEFAULT' ? '' : `-${number}`)]: hex,
}))
: [{ [`${color}`]: values }]
)
)
export default flattenColorPalette
-196
src/util/formatVariantSelector.js
import selectorParser from 'postcss-selector-parser'
import unescape from 'postcss-selector-parser/dist/util/unesc'
import escapeClassName from '../util/escapeClassName'
import prefixSelector from '../util/prefixSelector'
let MERGE = ':merge'
let PARENT = '&'
export let selectorFunctions = new Set([MERGE])
export function formatVariantSelector(current, ...others) {
for (let other of others) {
let incomingValue = resolveFunctionArgument(other, MERGE)
if (incomingValue !== null) {
let existingValue = resolveFunctionArgument(current, MERGE, incomingValue)
if (existingValue !== null) {
let existingTarget = `${MERGE}(${incomingValue})`
let splitIdx = other.indexOf(existingTarget)
let addition = other.slice(splitIdx + existingTarget.length).split(' ')[0]
current = current.replace(existingTarget, existingTarget + addition)
continue
}
}
current = other.replace(PARENT, current)
}
return current
}
export function finalizeSelector(format, { selector, candidate, context }) {
let separator = context?.tailwindConfig?.separator ?? ':'
// Split by the separator, but ignore the separator inside square brackets:
//
// E.g.: dark:lg:hover:[paint-order:markers]
// ┬ ┬ ┬ ┬
// │ │ │ ╰── We will not split here
// ╰──┴─────┴─────────────── We will split here
//
let splitter = new RegExp(`\\${separator}(?![^[]*\\])`)
let base = candidate.split(splitter).pop()
if (context?.tailwindConfig?.prefix) {
format = prefixSelector(context.tailwindConfig.prefix, format)
}
format = format.replace(PARENT, `.${escapeClassName(candidate)}`)
// Normalize escaped classes, e.g.:
//
// The idea would be to replace the escaped `base` in the selector with the
// `format`. However, in css you can escape the same selector in a few
// different ways. This would result in different strings and therefore we
// can't replace it properly.
//
// base: bg-[rgb(255,0,0)]
// base in selector: bg-\\[rgb\\(255\\,0\\,0\\)\\]
// escaped base: bg-\\[rgb\\(255\\2c 0\\2c 0\\)\\]
//
selector = selectorParser((selectors) => {
return selectors.walkClasses((node) => {
if (node.raws && node.value.includes(base)) {
node.raws.value = escapeClassName(unescape(node.raws.value))
}
return node
})
}).processSync(selector)
// We can safely replace the escaped base now, since the `base` section is
// now in a normalized escaped value.
selector = selector.replace(`.${escapeClassName(base)}`, format)
// Remove unnecessary pseudo selectors that we used as placeholders
return selectorParser((selectors) => {
return selectors.map((selector) => {
selector.walkPseudos((p) => {
if (selectorFunctions.has(p.value)) {
p.replaceWith(p.nodes)
}
return p
})
// This will make sure to move pseudo's to the correct spot (the end for
// pseudo elements) because otherwise the selector will never work
// anyway.
//
// E.g.:
// - `before:hover:text-center` would result in `.before\:hover\:text-center:hover::before`
// - `hover:before:text-center` would result in `.hover\:before\:text-center:hover::before`
//
// `::before:hover` doesn't work, which means that we can make it work for you by flipping the order.
function collectPseudoElements(selector) {
let nodes = []
for (let node of selector.nodes) {
if (isPseudoElement(node)) {
nodes.push(node)
selector.removeChild(node)
}
if (node?.nodes) {
nodes.push(...collectPseudoElements(node))
}
}
return nodes
}
let pseudoElements = collectPseudoElements(selector)
if (pseudoElements.length > 0) {
selector.nodes.push(pseudoElements.sort(sortSelector))
}
return selector
})
}).processSync(selector)
}
// Note: As a rule, double colons (::) should be used instead of a single colon
// (:). This distinguishes pseudo-classes from pseudo-elements. However, since
// this distinction was not present in older versions of the W3C spec, most
// browsers support both syntaxes for the original pseudo-elements.
let pseudoElementsBC = [':before', ':after', ':first-line', ':first-letter']
// These pseudo-elements _can_ be combined with other pseudo selectors AND the order does matter.
let pseudoElementExceptions = ['::file-selector-button']
// This will make sure to move pseudo's to the correct spot (the end for
// pseudo elements) because otherwise the selector will never work
// anyway.
//
// E.g.:
// - `before:hover:text-center` would result in `.before\:hover\:text-center:hover::before`
// - `hover:before:text-center` would result in `.hover\:before\:text-center:hover::before`
//
// `::before:hover` doesn't work, which means that we can make it work
// for you by flipping the order.
function sortSelector(a, z) {
// Both nodes are non-pseudo's so we can safely ignore them and keep
// them in the same order.
if (a.type !== 'pseudo' && z.type !== 'pseudo') {
return 0
}
// If one of them is a combinator, we need to keep it in the same order
// because that means it will start a new "section" in the selector.
if ((a.type === 'combinator') ^ (z.type === 'combinator')) {
return 0
}
// One of the items is a pseudo and the other one isn't. Let's move
// the pseudo to the right.
if ((a.type === 'pseudo') ^ (z.type === 'pseudo')) {
return (a.type === 'pseudo') - (z.type === 'pseudo')
}
// Both are pseudo's, move the pseudo elements (except for
// ::file-selector-button) to the right.
return isPseudoElement(a) - isPseudoElement(z)
}
function isPseudoElement(node) {
if (node.type !== 'pseudo') return false
if (pseudoElementExceptions.includes(node.value)) return false
return node.value.startsWith('::') || pseudoElementsBC.includes(node.value)
}
function resolveFunctionArgument(haystack, needle, arg) {
let startIdx = haystack.indexOf(arg ? `${needle}(${arg})` : needle)
if (startIdx === -1) return null
// Start inside the `(`
startIdx += needle.length + 1
let target = ''
let count = 0
for (let char of haystack.slice(startIdx)) {
if (char !== '(' && char !== ')') {
target += char
} else if (char === '(') {
target += char
count++
} else if (char === ')') {
if (--count < 0) break // unbalanced
target += char
}
}
return target
}
-19
src/util/getAllConfigs.js
import defaultConfig from '../../stubs/defaultConfig.stub.js'
import { flagEnabled } from '../featureFlags'
export default function getAllConfigs(config) {
const configs = (config?.presets ?? [defaultConfig])
.slice()
.reverse()
.flatMap((preset) => getAllConfigs(preset instanceof Function ? preset() : preset))
const features = {
// Add experimental configs here...
}
const experimentals = Object.keys(features)
.filter((feature) => flagEnabled(config, feature))
.map((feature) => features[feature])
return [config, ...experimentals, ...configs]
}
-5
src/util/hashConfig.js
import hash from 'object-hash'
export default function hashConfig(config) {
return hash(config, { ignoreUnknown: true })
}
-3
src/util/isKeyframeRule.js
export default function isKeyframeRule(rule) {
return rule.parent && rule.parent.type === 'atrule' && /keyframes$/.test(rule.parent.name)
}
-8
src/util/isPlainObject.js
export default function isPlainObject(value) {
if (Object.prototype.toString.call(value) !== '[object Object]') {
return false
}
const prototype = Object.getPrototypeOf(value)
return prototype === null || prototype === Object.prototype
}
-61
src/util/isValidArbitraryValue.js
let matchingBrackets = new Map([
['{', '}'],
['[', ']'],
['(', ')'],
])
let inverseMatchingBrackets = new Map(
Array.from(matchingBrackets.entries()).map(([k, v]) => [v, k])
)
let quotes = new Set(['"', "'", '`'])
// Arbitrary values must contain balanced brackets (), [] and {}. Escaped
// values don't count, and brackets inside quotes also don't count.
//
// E.g.: w-[this-is]w-[weird-and-invalid]
// E.g.: w-[this-is\\]w-\\[weird-but-valid]
// E.g.: content-['this-is-also-valid]-weirdly-enough']
export default function isValidArbitraryValue(value) {
let stack = []
let inQuotes = false
for (let i = 0; i < value.length; i++) {
let char = value[i]
if (char === ':' && !inQuotes && stack.length === 0) {
return false
}
// Non-escaped quotes allow us to "allow" anything in between
if (quotes.has(char) && value[i - 1] !== '\\') {
inQuotes = !inQuotes
}
if (inQuotes) continue
if (value[i - 1] === '\\') continue // Escaped
if (matchingBrackets.has(char)) {
stack.push(char)
} else if (inverseMatchingBrackets.has(char)) {
let inverse = inverseMatchingBrackets.get(char)
// Nothing to pop from, therefore it is unbalanced
if (stack.length <= 0) {
return false
}
// Popped value must match the inverse value, otherwise it is unbalanced
if (stack.pop() !== inverse) {
return false
}
}
}
// If there is still something on the stack, it is also unbalanced
if (stack.length > 0) {
return false
}
// All good, totally balanced!
return true
}
-29
src/util/log.js
import colors from 'picocolors'
let alreadyShown = new Set()
function log(type, messages, key) {
if (process.env.JEST_WORKER_ID !== undefined) return
if (key && alreadyShown.has(key)) return
if (key) alreadyShown.add(key)
console.warn('')
messages.forEach((message) => console.warn(type, '-', message))
}
export function dim(input) {
return colors.dim(input)
}
export default {
info(key, messages) {
log(colors.bold(colors.cyan('info')), ...(Array.isArray(key) ? [key] : [messages, key]))
},
warn(key, messages) {
log(colors.bold(colors.yellow('warn')), ...(Array.isArray(key) ? [key] : [messages, key]))
},
risk(key, messages) {
log(colors.bold(colors.magenta('risk')), ...(Array.isArray(key) ? [key] : [messages, key]))
},
}
-26
src/util/nameClass.js
import escapeClassName from './escapeClassName'
import escapeCommas from './escapeCommas'
export function asClass(name) {
return escapeCommas(`.${escapeClassName(name)}`)
}
export default function nameClass(classPrefix, key) {
return asClass(formatClass(classPrefix, key))
}
export function formatClass(classPrefix, key) {
if (key === 'DEFAULT') {
return classPrefix
}
if (key === '-' || key === '-DEFAULT') {
return `-${classPrefix}`
}
if (key.startsWith('-')) {
return `-${classPrefix}${key}`
}
return `${classPrefix}-${key}`
}
-16
src/util/negateValue.js
export default function (value) {
value = `${value}`
if (value === '0') {
return '0'
}
// Flip sign of numbers
if (/^[+-]?(\d+|\d*\.\d+)(e[+-]?\d+)?(%|\w+)?$/.test(value)) {
return value.replace(/^[+-]?/, (sign) => (sign === '-' ? '' : '-'))
}
if (value.includes('var(') || value.includes('calc(')) {
return `calc(${value} * -1)`
}
}
-270
src/util/normalizeConfig.js
import log, { dim } from './log'
export function normalizeConfig(config) {
// Quick structure validation
/**
* type FilePath = string
* type RawFile = { raw: string, extension?: string }
* type ExtractorFn = (content: string) => Array<string>
* type TransformerFn = (content: string) => string
*
* type Content =
* | Array<FilePath | RawFile>
* | {
* files: Array<FilePath | RawFile>,
* extract?: ExtractorFn | { [extension: string]: ExtractorFn }
* transform?: TransformerFn | { [extension: string]: TransformerFn }
* }
*/
let valid = (() => {
// `config.purge` should not exist anymore
if (config.purge) {
return false
}
// `config.content` should exist
if (!config.content) {
return false
}
// `config.content` should be an object or an array
if (
!Array.isArray(config.content) &&
!(typeof config.content === 'object' && config.content !== null)
) {
return false
}
// When `config.content` is an array, it should consist of FilePaths or RawFiles
if (Array.isArray(config.content)) {
return config.content.every((path) => {
// `path` can be a string
if (typeof path === 'string') return true
// `path` can be an object { raw: string, extension?: string }
// `raw` must be a string
if (typeof path?.raw !== 'string') return false
// `extension` (if provided) should also be a string
if (path?.extension && typeof path?.extension !== 'string') {
return false
}
return true
})
}
// When `config.content` is an object
if (typeof config.content === 'object' && config.content !== null) {
// Only `files`, `extract` and `transform` can exist in `config.content`
if (
Object.keys(config.content).some((key) => !['files', 'extract', 'transform'].includes(key))
) {
return false
}
// `config.content.files` should exist of FilePaths or RawFiles
if (Array.isArray(config.content.files)) {
if (
!config.content.files.every((path) => {
// `path` can be a string
if (typeof path === 'string') return true
// `path` can be an object { raw: string, extension?: string }
// `raw` must be a string
if (typeof path?.raw !== 'string') return false
// `extension` (if provided) should also be a string
if (path?.extension && typeof path?.extension !== 'string') {
return false
}
return true
})
) {
return false
}
// `config.content.extract` is optional, and can be a Function or a Record<String, Function>
if (typeof config.content.extract === 'object') {
for (let value of Object.values(config.content.extract)) {
if (typeof value !== 'function') {
return false
}
}
} else if (
!(config.content.extract === undefined || typeof config.content.extract === 'function')
) {
return false
}
// `config.content.transform` is optional, and can be a Function or a Record<String, Function>
if (typeof config.content.transform === 'object') {
for (let value of Object.values(config.content.transform)) {
if (typeof value !== 'function') {
return false
}
}
} else if (
!(
config.content.transform === undefined || typeof config.content.transform === 'function'
)
) {
return false
}
}
return true
}
return false
})()
if (!valid) {
log.warn('purge-deprecation', [
'The `purge`/`content` options have changed in Tailwind CSS v3.0.',
'Update your configuration file to eliminate this warning.',
'https://tailwindcss.com/docs/upgrade-guide#configure-content-sources',
])
}
// Normalize the `safelist`
config.safelist = (() => {
let { content, purge, safelist } = config
if (Array.isArray(safelist)) return safelist
if (Array.isArray(content?.safelist)) return content.safelist
if (Array.isArray(purge?.safelist)) return purge.safelist
if (Array.isArray(purge?.options?.safelist)) return purge.options.safelist
return []
})()
// Normalize prefix option
if (typeof config.prefix === 'function') {
log.warn('prefix-function', [
'As of Tailwind CSS v3.0, `prefix` cannot be a function.',
'Update `prefix` in your configuration to be a string to eliminate this warning.',
'https://tailwindcss.com/docs/upgrade-guide#prefix-cannot-be-a-function',
])
config.prefix = ''
} else {
config.prefix = config.prefix ?? ''
}
// Normalize the `content`
config.content = {
files: (() => {
let { content, purge } = config
if (Array.isArray(purge)) return purge
if (Array.isArray(purge?.content)) return purge.content
if (Array.isArray(content)) return content
if (Array.isArray(content?.content)) return content.content
if (Array.isArray(content?.files)) return content.files
return []
})(),
extract: (() => {
let extract = (() => {
if (config.purge?.extract) return config.purge.extract
if (config.content?.extract) return config.content.extract
if (config.purge?.extract?.DEFAULT) return config.purge.extract.DEFAULT
if (config.content?.extract?.DEFAULT) return config.content.extract.DEFAULT
if (config.purge?.options?.extractors) return config.purge.options.extractors
if (config.content?.options?.extractors) return config.content.options.extractors
return {}
})()
let extractors = {}
let defaultExtractor = (() => {
if (config.purge?.options?.defaultExtractor) {
return config.purge.options.defaultExtractor
}
if (config.content?.options?.defaultExtractor) {
return config.content.options.defaultExtractor
}
return undefined
})()
if (defaultExtractor !== undefined) {
extractors.DEFAULT = defaultExtractor
}
// Functions
if (typeof extract === 'function') {
extractors.DEFAULT = extract
}
// Arrays
else if (Array.isArray(extract)) {
for (let { extensions, extractor } of extract ?? []) {
for (let extension of extensions) {
extractors[extension] = extractor
}
}
}
// Objects
else if (typeof extract === 'object' && extract !== null) {
Object.assign(extractors, extract)
}
return extractors
})(),
transform: (() => {
let transform = (() => {
if (config.purge?.transform) return config.purge.transform
if (config.content?.transform) return config.content.transform
if (config.purge?.transform?.DEFAULT) return config.purge.transform.DEFAULT
if (config.content?.transform?.DEFAULT) return config.content.transform.DEFAULT
return {}
})()
let transformers = {}
if (typeof transform === 'function') {
transformers.DEFAULT = transform
}
if (typeof transform === 'object' && transform !== null) {
Object.assign(transformers, transform)
}
return transformers
})(),
}
// Validate globs to prevent bogus globs.
// E.g.: `./src/*.{html}` is invalid, the `{html}` should just be `html`
for (let file of config.content.files) {
if (typeof file === 'string' && /{([^,]*?)}/g.test(file)) {
log.warn('invalid-glob-braces', [
`The glob pattern ${dim(file)} in your Tailwind CSS configuration is invalid.`,
`Update it to ${dim(file.replace(/{([^,]*?)}/g, '$1'))} to silence this warning.`,
// TODO: Add https://tw.wtf/invalid-glob-braces
])
break
}
}
if (config.content.files.length === 0) {
log.warn('content-problems', [
'The `content` option in your Tailwind CSS configuration is missing or empty.',
'Configure your content sources or your generated CSS will be missing styles.',
'https://tailwindcss.com/docs/content-configuration',
])
}
return config
}
-45
src/util/normalizeScreens.js
/**
* A function that normalizes the various forms that the screens object can be
* provided in.
*
* Input(s):
* - ['100px', '200px'] // Raw strings
* - { sm: '100px', md: '200px' } // Object with string values
* - { sm: { min: '100px' }, md: { max: '100px' } } // Object with object values
* - { sm: [{ min: '100px' }, { max: '200px' }] } // Object with object array (multiple values)
*
* Output(s):
* - [{ name: 'sm', values: [{ min: '100px', max: '200px' }] }] // List of objects, that contains multiple values
*/
export function normalizeScreens(screens, root = true) {
if (Array.isArray(screens)) {
return screens.map((screen) => {
if (root && Array.isArray(screen)) {
throw new Error('The tuple syntax is not supported for `screens`.')
}
if (typeof screen === 'string') {
return { name: screen.toString(), values: [{ min: screen, max: undefined }] }
}
let [name, options] = screen
name = name.toString()
if (typeof options === 'string') {
return { name, values: [{ min: options, max: undefined }] }
}
if (Array.isArray(options)) {
return { name, values: options.map((option) => resolveValue(option)) }
}
return { name, values: [resolveValue(options)] }
})
}
return normalizeScreens(Object.entries(screens ?? {}), false)
}
function resolveValue({ 'min-width': _minWidth, min = _minWidth, max, raw } = {}) {
return { min, max, raw }
}
-68
src/util/parseAnimationValue.js
const DIRECTIONS = new Set(['normal', 'reverse', 'alternate', 'alternate-reverse'])
const PLAY_STATES = new Set(['running', 'paused'])
const FILL_MODES = new Set(['none', 'forwards', 'backwards', 'both'])
const ITERATION_COUNTS = new Set(['infinite'])
const TIMINGS = new Set([
'linear',
'ease',
'ease-in',
'ease-out',
'ease-in-out',
'step-start',
'step-end',
])
const TIMING_FNS = ['cubic-bezier', 'steps']
const COMMA = /\,(?![^(]*\))/g // Comma separator that is not located between brackets. E.g.: `cubiz-bezier(a, b, c)` these don't count.
const SPACE = /\ +(?![^(]*\))/g // Similar to the one above, but with spaces instead.
const TIME = /^(-?[\d.]+m?s)$/
const DIGIT = /^(\d+)$/
export default function parseAnimationValue(input) {
let animations = input.split(COMMA)
return animations.map((animation) => {
let value = animation.trim()
let result = { value }
let parts = value.split(SPACE)
let seen = new Set()
for (let part of parts) {
if (!seen.has('DIRECTIONS') && DIRECTIONS.has(part)) {
result.direction = part
seen.add('DIRECTIONS')
} else if (!seen.has('PLAY_STATES') && PLAY_STATES.has(part)) {
result.playState = part
seen.add('PLAY_STATES')
} else if (!seen.has('FILL_MODES') && FILL_MODES.has(part)) {
result.fillMode = part
seen.add('FILL_MODES')
} else if (
!seen.has('ITERATION_COUNTS') &&
(ITERATION_COUNTS.has(part) || DIGIT.test(part))
) {
result.iterationCount = part
seen.add('ITERATION_COUNTS')
} else if (!seen.has('TIMING_FUNCTION') && TIMINGS.has(part)) {
result.timingFunction = part
seen.add('TIMING_FUNCTION')
} else if (!seen.has('TIMING_FUNCTION') && TIMING_FNS.some((f) => part.startsWith(`${f}(`))) {
result.timingFunction = part
seen.add('TIMING_FUNCTION')
} else if (!seen.has('DURATION') && TIME.test(part)) {
result.duration = part
seen.add('DURATION')
} else if (!seen.has('DELAY') && TIME.test(part)) {
result.delay = part
seen.add('DELAY')
} else if (!seen.has('NAME')) {
result.name = part
seen.add('NAME')
} else {
if (!result.unknown) result.unknown = []
result.unknown.push(part)
}
}
return result
})
}
-119
src/util/parseBoxShadowValue.js
let KEYWORDS = new Set(['inset', 'inherit', 'initial', 'revert', 'unset'])
let SPACE = /\ +(?![^(]*\))/g // Similar to the one above, but with spaces instead.
let LENGTH = /^-?(\d+|\.\d+)(.*?)$/g
let SPECIALS = /[(),]/g
/**
* This splits a string on top-level commas.
*
* Regex doesn't support recursion (at least not the JS-flavored version).
* So we have to use a tiny state machine to keep track of paren vs comma
* placement. Before we'd only exclude commas from the inner-most nested
* set of parens rather than any commas that were not contained in parens
* at all which is the intended behavior here.
*
* Expected behavior:
* var(--a, 0 0 1px rgb(0, 0, 0)), 0 0 1px rgb(0, 0, 0)
* ─┬─ ┬ ┬ ┬
* x x x ╰──────── Split because top-level
* ╰──────────────┴──┴───────────── Ignored b/c inside >= 1 levels of parens
*
* @param {string} input
*/
function* splitByTopLevelCommas(input) {
SPECIALS.lastIndex = -1
let depth = 0
let lastIndex = 0
let found = false
// Find all parens & commas
// And only split on commas if they're top-level
for (let match of input.matchAll(SPECIALS)) {
if (match[0] === '(') depth++
if (match[0] === ')') depth--
if (match[0] === ',' && depth === 0) {
found = true
yield input.substring(lastIndex, match.index)
lastIndex = match.index + match[0].length
}
}
// Provide the last segment of the string if available
// Otherwise the whole string since no commas were found
// This mirrors the behavior of string.split()
if (found) {
yield input.substring(lastIndex)
} else {
yield input
}
}
export function parseBoxShadowValue(input) {
let shadows = Array.from(splitByTopLevelCommas(input))
return shadows.map((shadow) => {
let value = shadow.trim()
let result = { raw: value }
let parts = value.split(SPACE)
let seen = new Set()
for (let part of parts) {
// Reset index, since the regex is stateful.
LENGTH.lastIndex = 0
// Keyword
if (!seen.has('KEYWORD') && KEYWORDS.has(part)) {
result.keyword = part
seen.add('KEYWORD')
}
// Length value
else if (LENGTH.test(part)) {
if (!seen.has('X')) {
result.x = part
seen.add('X')
} else if (!seen.has('Y')) {
result.y = part
seen.add('Y')
} else if (!seen.has('BLUR')) {
result.blur = part
seen.add('BLUR')
} else if (!seen.has('SPREAD')) {
result.spread = part
seen.add('SPREAD')
}
}
// Color or unknown
else {
if (!result.color) {
result.color = part
} else {
if (!result.unknown) result.unknown = []
result.unknown.push(part)
}
}
}
// Check if valid
result.valid = result.x !== undefined && result.y !== undefined
return result
})
}
export function formatBoxShadowValue(shadows) {
return shadows
.map((shadow) => {
if (!shadow.valid) {
return shadow.raw
}
return [shadow.keyword, shadow.x, shadow.y, shadow.blur, shadow.spread, shadow.color]
.filter(Boolean)
.join(' ')
})
.join(', ')
}
-49
src/util/parseDependency.js
import isGlob from 'is-glob'
import globParent from 'glob-parent'
import path from 'path'
// Based on `glob-base`
// https://github.com/micromatch/glob-base/blob/master/index.js
function parseGlob(pattern) {
let glob = pattern
let base = globParent(pattern)
if (base !== '.') {
glob = pattern.substr(base.length)
if (glob.charAt(0) === '/') {
glob = glob.substr(1)
}
}
if (glob.substr(0, 2) === './') {
glob = glob.substr(2)
}
if (glob.charAt(0) === '/') {
glob = glob.substr(1)
}
return { base, glob }
}
export default function parseDependency(normalizedFileOrGlob) {
if (normalizedFileOrGlob.startsWith('!')) {
return null
}
let message
if (isGlob(normalizedFileOrGlob)) {
let { base, glob } = parseGlob(normalizedFileOrGlob)
message = { type: 'dir-dependency', dir: path.resolve(base), glob }
} else {
message = { type: 'dependency', file: path.resolve(normalizedFileOrGlob) }
}
// rollup-plugin-postcss does not support dir-dependency messages
// but directories can be watched in the same way as files
if (message.type === 'dir-dependency' && process.env.ROLLUP_WATCH === 'true') {
message = { type: 'dependency', file: message.dir }
}
return message
}
-19
src/util/parseObjectStyles.js
import postcss from 'postcss'
import postcssNested from 'postcss-nested'
import postcssJs from 'postcss-js'
export default function parseObjectStyles(styles) {
if (!Array.isArray(styles)) {
return parseObjectStyles([styles])
}
return styles.flatMap((style) => {
return postcss([
postcssNested({
bubble: ['screen'],
}),
]).process(style, {
parser: postcssJs,
}).root.nodes
})
}
-192
src/util/pluginUtils.js
import selectorParser from 'postcss-selector-parser'
import escapeCommas from './escapeCommas'
import { withAlphaValue } from './withAlphaVariable'
import {
normalize,
length,
number,
percentage,
url,
color as validateColor,
genericName,
familyName,
image,
absoluteSize,
relativeSize,
position,
lineWidth,
shadow,
} from './dataTypes'
import negateValue from './negateValue'
export function updateAllClasses(selectors, updateClass) {
let parser = selectorParser((selectors) => {
selectors.walkClasses((sel) => {
let updatedClass = updateClass(sel.value)
sel.value = updatedClass
if (sel.raws && sel.raws.value) {
sel.raws.value = escapeCommas(sel.raws.value)
}
})
})
let result = parser.processSync(selectors)
return result
}
function resolveArbitraryValue(modifier, validate) {
if (!isArbitraryValue(modifier)) {
return undefined
}
let value = modifier.slice(1, -1)
if (!validate(value)) {
return undefined
}
return normalize(value)
}
function asNegativeValue(modifier, lookup = {}, validate) {
let positiveValue = lookup[modifier]
if (positiveValue !== undefined) {
return negateValue(positiveValue)
}
if (isArbitraryValue(modifier)) {
let resolved = resolveArbitraryValue(modifier, validate)
if (resolved === undefined) {
return undefined
}
return negateValue(resolved)
}
}
export function asValue(modifier, options = {}, { validate = () => true } = {}) {
let value = options.values?.[modifier]
if (value !== undefined) {
return value
}
if (options.supportsNegativeValues && modifier.startsWith('-')) {
return asNegativeValue(modifier.slice(1), options.values, validate)
}
return resolveArbitraryValue(modifier, validate)
}
function isArbitraryValue(input) {
return input.startsWith('[') && input.endsWith(']')
}
function splitAlpha(modifier) {
let slashIdx = modifier.lastIndexOf('/')
if (slashIdx === -1 || slashIdx === modifier.length - 1) {
return [modifier]
}
return [modifier.slice(0, slashIdx), modifier.slice(slashIdx + 1)]
}
export function asColor(modifier, options = {}, { tailwindConfig = {} } = {}) {
if (options.values?.[modifier] !== undefined) {
return options.values?.[modifier]
}
let [color, alpha] = splitAlpha(modifier)
if (alpha !== undefined) {
let normalizedColor =
options.values?.[color] ?? (isArbitraryValue(color) ? color.slice(1, -1) : undefined)
if (normalizedColor === undefined) {
return undefined
}
if (isArbitraryValue(alpha)) {
return withAlphaValue(normalizedColor, alpha.slice(1, -1))
}
if (tailwindConfig.theme?.opacity?.[alpha] === undefined) {
return undefined
}
return withAlphaValue(normalizedColor, tailwindConfig.theme.opacity[alpha])
}
return asValue(modifier, options, { validate: validateColor })
}
export function asLookupValue(modifier, options = {}) {
return options.values?.[modifier]
}
function guess(validate) {
return (modifier, options) => {
return asValue(modifier, options, { validate })
}
}
let typeMap = {
any: asValue,
color: asColor,
url: guess(url),
image: guess(image),
length: guess(length),
percentage: guess(percentage),
position: guess(position),
lookup: asLookupValue,
'generic-name': guess(genericName),
'family-name': guess(familyName),
number: guess(number),
'line-width': guess(lineWidth),
'absolute-size': guess(absoluteSize),
'relative-size': guess(relativeSize),
shadow: guess(shadow),
}
let supportedTypes = Object.keys(typeMap)
function splitAtFirst(input, delim) {
let idx = input.indexOf(delim)
if (idx === -1) return [undefined, input]
return [input.slice(0, idx), input.slice(idx + 1)]
}
export function coerceValue(types, modifier, options, tailwindConfig) {
if (isArbitraryValue(modifier)) {
let arbitraryValue = modifier.slice(1, -1)
let [explicitType, value] = splitAtFirst(arbitraryValue, ':')
// It could be that this resolves to `url(https` which is not a valid
// identifier. We currently only support "simple" words with dashes or
// underscores. E.g.: family-name
if (!/^[\w-_]+$/g.test(explicitType)) {
value = arbitraryValue
}
//
else if (explicitType !== undefined && !supportedTypes.includes(explicitType)) {
return []
}
if (value.length > 0 && supportedTypes.includes(explicitType)) {
return [asValue(`[${value}]`, options), explicitType]
}
}
// Find first matching type
for (let type of [].concat(types)) {
let result = typeMap[type](modifier, options, { tailwindConfig })
if (result !== undefined) return [result, type]
}
return []
}
-14
src/util/prefixSelector.js
import parser from 'postcss-selector-parser'
export default function (prefix, selector, prependNegative = false) {
return parser((selectors) => {
selectors.walkClasses((classSelector) => {
let baseClass = classSelector.value
let shouldPlaceNegativeBeforePrefix = prependNegative && baseClass.startsWith('-')
classSelector.value = shouldPlaceNegativeBeforePrefix
? `-${prefix}${baseClass.slice(1)}`
: `${prefix}${baseClass}`
})
}).processSync(selector)
}
-271
src/util/resolveConfig.js
import negateValue from './negateValue'
import corePluginList from '../corePluginList'
import configurePlugins from './configurePlugins'
import defaultConfig from '../../stubs/defaultConfig.stub'
import colors from '../public/colors'
import { defaults } from './defaults'
import { toPath } from './toPath'
import { normalizeConfig } from './normalizeConfig'
import isPlainObject from './isPlainObject'
import { cloneDeep } from './cloneDeep'
function isFunction(input) {
return typeof input === 'function'
}
function isObject(input) {
return typeof input === 'object' && input !== null
}
function mergeWith(target, ...sources) {
let customizer = sources.pop()
for (let source of sources) {
for (let k in source) {
let merged = customizer(target[k], source[k])
if (merged === undefined) {
if (isObject(target[k]) && isObject(source[k])) {
target[k] = mergeWith(target[k], source[k], customizer)
} else {
target[k] = source[k]
}
} else {
target[k] = merged
}
}
}
return target
}
const configUtils = {
colors,
negative(scale) {
// TODO: Log that this function isn't really needed anymore?
return Object.keys(scale)
.filter((key) => scale[key] !== '0')
.reduce((negativeScale, key) => {
let negativeValue = negateValue(scale[key])
if (negativeValue !== undefined) {
negativeScale[`-${key}`] = negativeValue
}
return negativeScale
}, {})
},
breakpoints(screens) {
return Object.keys(screens)
.filter((key) => typeof screens[key] === 'string')
.reduce(
(breakpoints, key) => ({
...breakpoints,
[`screen-${key}`]: screens[key],
}),
{}
)
},
/*
rgb(property) {
if (!property.startsWith('--')) {
throw new Error(
'The rgb() helper requires a custom property name to be passed as the first argument.'
)
}
return ({ opacityValue }) => {
if (opacityValue === undefined || opacityValue === 1) {
return `rgb(var(${property}) / 1.0)`
}
return `rgb(var(${property}) / ${opacityValue})`
}
},
hsl(property) {
if (!property.startsWith('--')) {
throw new Error(
'The hsl() helper requires a custom property name to be passed as the first argument.'
)
}
return ({ opacityValue }) => {
if (opacityValue === undefined || opacityValue === 1) {
return `hsl(var(${property}) / 1)`
}
return `hsl(var(${property}) / ${opacityValue})`
}
},
*/
}
function value(valueToResolve, ...args) {
return isFunction(valueToResolve) ? valueToResolve(...args) : valueToResolve
}
function collectExtends(items) {
return items.reduce((merged, { extend }) => {
return mergeWith(merged, extend, (mergedValue, extendValue) => {
if (mergedValue === undefined) {
return [extendValue]
}
if (Array.isArray(mergedValue)) {
return [extendValue, ...mergedValue]
}
return [extendValue, mergedValue]
})
}, {})
}
function mergeThemes(themes) {
return {
...themes.reduce((merged, theme) => defaults(merged, theme), {}),
// In order to resolve n config objects, we combine all of their `extend` properties
// into arrays instead of objects so they aren't overridden.
extend: collectExtends(themes),
}
}
function mergeExtensionCustomizer(merged, value) {
// When we have an array of objects, we do want to merge it
if (Array.isArray(merged) && isObject(merged[0])) {
return merged.concat(value)
}
// When the incoming value is an array, and the existing config is an object, prepend the existing object
if (Array.isArray(value) && isObject(value[0]) && isObject(merged)) {
return [merged, ...value]
}
// Override arrays (for example for font-families, box-shadows, ...)
if (Array.isArray(value)) {
return value
}
// Execute default behaviour
return undefined
}
function mergeExtensions({ extend, ...theme }) {
return mergeWith(theme, extend, (themeValue, extensions) => {
// The `extend` property is an array, so we need to check if it contains any functions
if (!isFunction(themeValue) && !extensions.some(isFunction)) {
return mergeWith({}, themeValue, ...extensions, mergeExtensionCustomizer)
}
return (resolveThemePath, utils) =>
mergeWith(
{},
...[themeValue, ...extensions].map((e) => value(e, resolveThemePath, utils)),
mergeExtensionCustomizer
)
})
}
function resolveFunctionKeys(object) {
const resolvePath = (key, defaultValue) => {
const path = toPath(key)
let index = 0
let val = object
while (val !== undefined && val !== null && index < path.length) {
val = val[path[index++]]
val = isFunction(val) ? val(resolvePath, configUtils) : val
}
if (val === undefined) {
return defaultValue
}
if (isPlainObject(val)) {
return cloneDeep(val)
}
return val
}
resolvePath.theme = resolvePath
for (let key in configUtils) {
resolvePath[key] = configUtils[key]
}
return Object.keys(object).reduce((resolved, key) => {
return {
...resolved,
[key]: isFunction(object[key]) ? object[key](resolvePath, configUtils) : object[key],
}
}, {})
}
function extractPluginConfigs(configs) {
let allConfigs = []
configs.forEach((config) => {
allConfigs = [...allConfigs, config]
const plugins = config?.plugins ?? []
if (plugins.length === 0) {
return
}
plugins.forEach((plugin) => {
if (plugin.__isOptionsFunction) {
plugin = plugin()
}
allConfigs = [...allConfigs, ...extractPluginConfigs([plugin?.config ?? {}])]
})
})
return allConfigs
}
function resolveCorePlugins(corePluginConfigs) {
const result = [...corePluginConfigs].reduceRight((resolved, corePluginConfig) => {
if (isFunction(corePluginConfig)) {
return corePluginConfig({ corePlugins: resolved })
}
return configurePlugins(corePluginConfig, resolved)
}, corePluginList)
return result
}
function resolvePluginLists(pluginLists) {
const result = [...pluginLists].reduceRight((resolved, pluginList) => {
return [...resolved, ...pluginList]
}, [])
return result
}
export default function resolveConfig(configs) {
let allConfigs = [
...extractPluginConfigs(configs),
{
prefix: '',
important: false,
separator: ':',
variantOrder: defaultConfig.variantOrder,
},
]
return normalizeConfig(
defaults(
{
theme: resolveFunctionKeys(
mergeExtensions(mergeThemes(allConfigs.map((t) => t?.theme ?? {})))
),
corePlugins: resolveCorePlugins(allConfigs.map((c) => c.corePlugins)),
plugins: resolvePluginLists(configs.map((c) => c?.plugins ?? [])),
},
...allConfigs
)
)
}
-55
src/util/resolveConfigPath.js
import fs from 'fs'
import path from 'path'
function isObject(value) {
return typeof value === 'object' && value !== null
}
function isEmpty(obj) {
return Object.keys(obj).length === 0
}
function isString(value) {
return typeof value === 'string' || value instanceof String
}
export default function resolveConfigPath(pathOrConfig) {
// require('tailwindcss')({ theme: ..., variants: ... })
if (isObject(pathOrConfig) && pathOrConfig.config === undefined && !isEmpty(pathOrConfig)) {
return null
}
// require('tailwindcss')({ config: 'custom-config.js' })
if (
isObject(pathOrConfig) &&
pathOrConfig.config !== undefined &&
isString(pathOrConfig.config)
) {
return path.resolve(pathOrConfig.config)
}
// require('tailwindcss')({ config: { theme: ..., variants: ... } })
if (
isObject(pathOrConfig) &&
pathOrConfig.config !== undefined &&
isObject(pathOrConfig.config)
) {
return null
}
// require('tailwindcss')('custom-config.js')
if (isString(pathOrConfig)) {
return path.resolve(pathOrConfig)
}
// require('tailwindcss')
for (const configFile of ['./tailwind.config.js', './tailwind.config.cjs']) {
try {
const configPath = path.resolve(configFile)
fs.accessSync(configPath)
return configPath
} catch (err) {}
}
return null
}
-10
src/util/responsive.js
import postcss from 'postcss'
import cloneNodes from './cloneNodes'
export default function responsive(rules) {
return postcss
.atRule({
name: 'responsive',
})
.append(cloneNodes(Array.isArray(rules) ? rules : [rules]))
}
-4
src/util/tap.js
export function tap(value, mutator) {
mutator(value)
return value
}
-3
src/util/toColorValue.js
export default function toColorValue(maybeFunction) {
return typeof maybeFunction === 'function' ? maybeFunction({}) : maybeFunction
}
-26
src/util/toPath.js
/**
* Parse a path string into an array of path segments.
*
* Square bracket notation `a[b]` may be used to "escape" dots that would otherwise be interpreted as path separators.
*
* Example:
* a -> ['a]
* a.b.c -> ['a', 'b', 'c']
* a[b].c -> ['a', 'b', 'c']
* a[b.c].e.f -> ['a', 'b.c', 'e', 'f']
* a[b][c][d] -> ['a', 'b', 'c', 'd']
*
* @param {string|string[]} path
**/
export function toPath(path) {
if (Array.isArray(path)) return path
let openBrackets = path.split('[').length - 1
let closedBrackets = path.split(']').length - 1
if (openBrackets !== closedBrackets) {
throw new Error(`Path is invalid. Has unbalanced brackets: ${path}`)
}
return path.split(/\.(?![^\[]*\])|[\[\]]/g).filter(Boolean)
}
-52
src/util/transformThemeValue.js
import postcss from 'postcss'
export default function transformThemeValue(themeSection) {
if (['fontSize', 'outline'].includes(themeSection)) {
return (value) => {
if (typeof value === 'function') value = value({})
if (Array.isArray(value)) value = value[0]
return value
}
}
if (
[
'fontFamily',
'boxShadow',
'transitionProperty',
'transitionDuration',
'transitionDelay',
'transitionTimingFunction',
'backgroundImage',
'backgroundSize',
'backgroundColor',
'cursor',
'animation',
].includes(themeSection)
) {
return (value) => {
if (typeof value === 'function') value = value({})
if (Array.isArray(value)) value = value.join(', ')
return value
}
}
// For backwards compatibility reasons, before we switched to underscores
// instead of commas for arbitrary values.
if (['gridTemplateColumns', 'gridTemplateRows', 'objectPosition'].includes(themeSection)) {
return (value) => {
if (typeof value === 'function') value = value({})
if (typeof value === 'string') value = postcss.list.comma(value).join(' ')
return value
}
}
return (value) => {
if (typeof value === 'function') value = value({})
return value
}
}
-49
src/util/withAlphaVariable.js
import { parseColor, formatColor } from './color'
export function withAlphaValue(color, alphaValue, defaultValue) {
if (typeof color === 'function') {
return color({ opacityValue: alphaValue })
}
let parsed = parseColor(color)
if (parsed === null) {
return defaultValue
}
return formatColor({ ...parsed, alpha: alphaValue })
}
export default function withAlphaVariable({ color, property, variable }) {
let properties = [].concat(property)
if (typeof color === 'function') {
return {
[variable]: '1',
...Object.fromEntries(
properties.map((p) => {
return [p, color({ opacityVariable: variable, opacityValue: `var(${variable})` })]
})
),
}
}
const parsed = parseColor(color)
if (parsed === null) {
return Object.fromEntries(properties.map((p) => [p, color]))
}
if (parsed.alpha !== undefined) {
// Has an alpha value, return color as-is
return Object.fromEntries(properties.map((p) => [p, color]))
}
return {
[variable]: '1',
...Object.fromEntries(
properties.map((p) => {
return [p, formatColor({ ...parsed, alpha: `var(${variable})` })]
})
),
}
}
-955
stubs/defaultConfig.stub.js
module.exports = {
content: [],
presets: [],
darkMode: 'media', // or 'class'
theme: {
screens: {
sm: '640px',
md: '768px',
lg: '1024px',
xl: '1280px',
'2xl': '1536px',
},
colors: ({ colors }) => ({
inherit: colors.inherit,
current: colors.current,
transparent: colors.transparent,
black: colors.black,
white: colors.white,
slate: colors.slate,
gray: colors.gray,
zinc: colors.zinc,
neutral: colors.neutral,
stone: colors.stone,
red: colors.red,
orange: colors.orange,
amber: colors.amber,
yellow: colors.yellow,
lime: colors.lime,
green: colors.green,
emerald: colors.emerald,
teal: colors.teal,
cyan: colors.cyan,
sky: colors.sky,
blue: colors.blue,
indigo: colors.indigo,
violet: colors.violet,
purple: colors.purple,
fuchsia: colors.fuchsia,
pink: colors.pink,
rose: colors.rose,
}),
columns: {
auto: 'auto',
1: '1',
2: '2',
3: '3',
4: '4',
5: '5',
6: '6',
7: '7',
8: '8',
9: '9',
10: '10',
11: '11',
12: '12',
'3xs': '16rem',
'2xs': '18rem',
xs: '20rem',
sm: '24rem',
md: '28rem',
lg: '32rem',
xl: '36rem',
'2xl': '42rem',
'3xl': '48rem',
'4xl': '56rem',
'5xl': '64rem',
'6xl': '72rem',
'7xl': '80rem',
},
spacing: {
px: '1px',
0: '0px',
0.5: '0.125rem',
1: '0.25rem',
1.5: '0.375rem',
2: '0.5rem',
2.5: '0.625rem',
3: '0.75rem',
3.5: '0.875rem',
4: '1rem',
5: '1.25rem',
6: '1.5rem',
7: '1.75rem',
8: '2rem',
9: '2.25rem',
10: '2.5rem',
11: '2.75rem',
12: '3rem',
14: '3.5rem',
16: '4rem',
20: '5rem',
24: '6rem',
28: '7rem',
32: '8rem',
36: '9rem',
40: '10rem',
44: '11rem',
48: '12rem',
52: '13rem',
56: '14rem',
60: '15rem',
64: '16rem',
72: '18rem',
80: '20rem',
96: '24rem',
},
animation: {
none: 'none',
spin: 'spin 1s linear infinite',
ping: 'ping 1s cubic-bezier(0, 0, 0.2, 1) infinite',
pulse: 'pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite',
bounce: 'bounce 1s infinite',
},
aspectRatio: {
auto: 'auto',
square: '1 / 1',
video: '16 / 9',
},
backdropBlur: ({ theme }) => theme('blur'),
backdropBrightness: ({ theme }) => theme('brightness'),
backdropContrast: ({ theme }) => theme('contrast'),
backdropGrayscale: ({ theme }) => theme('grayscale'),
backdropHueRotate: ({ theme }) => theme('hueRotate'),
backdropInvert: ({ theme }) => theme('invert'),
backdropOpacity: ({ theme }) => theme('opacity'),
backdropSaturate: ({ theme }) => theme('saturate'),
backdropSepia: ({ theme }) => theme('sepia'),
backgroundColor: ({ theme }) => theme('colors'),
backgroundImage: {
none: 'none',
'gradient-to-t': 'linear-gradient(to top, var(--tw-gradient-stops))',
'gradient-to-tr': 'linear-gradient(to top right, var(--tw-gradient-stops))',
'gradient-to-r': 'linear-gradient(to right, var(--tw-gradient-stops))',
'gradient-to-br': 'linear-gradient(to bottom right, var(--tw-gradient-stops))',
'gradient-to-b': 'linear-gradient(to bottom, var(--tw-gradient-stops))',
'gradient-to-bl': 'linear-gradient(to bottom left, var(--tw-gradient-stops))',
'gradient-to-l': 'linear-gradient(to left, var(--tw-gradient-stops))',
'gradient-to-tl': 'linear-gradient(to top left, var(--tw-gradient-stops))',
},
backgroundOpacity: ({ theme }) => theme('opacity'),
backgroundPosition: {
bottom: 'bottom',
center: 'center',
left: 'left',
'left-bottom': 'left bottom',
'left-top': 'left top',
right: 'right',
'right-bottom': 'right bottom',
'right-top': 'right top',
top: 'top',
},
backgroundSize: {
auto: 'auto',
cover: 'cover',
contain: 'contain',
},
blur: {
0: '0',
none: '0',
sm: '4px',
DEFAULT: '8px',
md: '12px',
lg: '16px',
xl: '24px',
'2xl': '40px',
'3xl': '64px',
},
brightness: {
0: '0',
50: '.5',
75: '.75',
90: '.9',
95: '.95',
100: '1',
105: '1.05',
110: '1.1',
125: '1.25',
150: '1.5',
200: '2',
},
borderColor: ({ theme }) => ({
...theme('colors'),
DEFAULT: theme('colors.gray.200', 'currentColor'),
}),
borderOpacity: ({ theme }) => theme('opacity'),
borderRadius: {
none: '0px',
sm: '0.125rem',
DEFAULT: '0.25rem',
md: '0.375rem',
lg: '0.5rem',
xl: '0.75rem',
'2xl': '1rem',
'3xl': '1.5rem',
full: '9999px',
},
/*
borderSpacing: ({ theme }) => ({
...theme('spacing'),
}),
*/
borderWidth: {
DEFAULT: '1px',
0: '0px',
2: '2px',
4: '4px',
8: '8px',
},
boxShadow: {
sm: '0 1px 2px 0 rgb(0 0 0 / 0.05)',
DEFAULT: '0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)',
md: '0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)',
lg: '0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)',
xl: '0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)',
'2xl': '0 25px 50px -12px rgb(0 0 0 / 0.25)',
inner: 'inset 0 2px 4px 0 rgb(0 0 0 / 0.05)',
none: 'none',
},
boxShadowColor: ({ theme }) => theme('colors'),
caretColor: ({ theme }) => theme('colors'),
accentColor: ({ theme }) => ({
...theme('colors'),
auto: 'auto',
}),
contrast: {
0: '0',
50: '.5',
75: '.75',
100: '1',
125: '1.25',
150: '1.5',
200: '2',
},
container: {},
content: {
none: 'none',
},
cursor: {
auto: 'auto',
default: 'default',
pointer: 'pointer',
wait: 'wait',
text: 'text',
move: 'move',
help: 'help',
'not-allowed': 'not-allowed',
none: 'none',
'context-menu': 'context-menu',
progress: 'progress',
cell: 'cell',
crosshair: 'crosshair',
'vertical-text': 'vertical-text',
alias: 'alias',
copy: 'copy',
'no-drop': 'no-drop',
grab: 'grab',
grabbing: 'grabbing',
'all-scroll': 'all-scroll',
'col-resize': 'col-resize',
'row-resize': 'row-resize',
'n-resize': 'n-resize',
'e-resize': 'e-resize',
's-resize': 's-resize',
'w-resize': 'w-resize',
'ne-resize': 'ne-resize',
'nw-resize': 'nw-resize',
'se-resize': 'se-resize',
'sw-resize': 'sw-resize',
'ew-resize': 'ew-resize',
'ns-resize': 'ns-resize',
'nesw-resize': 'nesw-resize',
'nwse-resize': 'nwse-resize',
'zoom-in': 'zoom-in',
'zoom-out': 'zoom-out',
},
divideColor: ({ theme }) => theme('borderColor'),
divideOpacity: ({ theme }) => theme('borderOpacity'),
divideWidth: ({ theme }) => theme('borderWidth'),
dropShadow: {
sm: '0 1px 1px rgb(0 0 0 / 0.05)',
DEFAULT: ['0 1px 2px rgb(0 0 0 / 0.1)', '0 1px 1px rgb(0 0 0 / 0.06)'],
md: ['0 4px 3px rgb(0 0 0 / 0.07)', '0 2px 2px rgb(0 0 0 / 0.06)'],
lg: ['0 10px 8px rgb(0 0 0 / 0.04)', '0 4px 3px rgb(0 0 0 / 0.1)'],
xl: ['0 20px 13px rgb(0 0 0 / 0.03)', '0 8px 5px rgb(0 0 0 / 0.08)'],
'2xl': '0 25px 25px rgb(0 0 0 / 0.15)',
none: '0 0 #0000',
},
fill: ({ theme }) => theme('colors'),
grayscale: {
0: '0',
DEFAULT: '100%',
},
hueRotate: {
0: '0deg',
15: '15deg',
30: '30deg',
60: '60deg',
90: '90deg',
180: '180deg',
},
invert: {
0: '0',
DEFAULT: '100%',
},
flex: {
1: '1 1 0%',
auto: '1 1 auto',
initial: '0 1 auto',
none: 'none',
},
flexBasis: ({ theme }) => ({
auto: 'auto',
...theme('spacing'),
'1/2': '50%',
'1/3': '33.333333%',
'2/3': '66.666667%',
'1/4': '25%',
'2/4': '50%',
'3/4': '75%',
'1/5': '20%',
'2/5': '40%',
'3/5': '60%',
'4/5': '80%',
'1/6': '16.666667%',
'2/6': '33.333333%',
'3/6': '50%',
'4/6': '66.666667%',
'5/6': '83.333333%',
'1/12': '8.333333%',
'2/12': '16.666667%',
'3/12': '25%',
'4/12': '33.333333%',
'5/12': '41.666667%',
'6/12': '50%',
'7/12': '58.333333%',
'8/12': '66.666667%',
'9/12': '75%',
'10/12': '83.333333%',
'11/12': '91.666667%',
full: '100%',
}),
flexGrow: {
0: '0',
DEFAULT: '1',
},
flexShrink: {
0: '0',
DEFAULT: '1',
},
fontFamily: {
sans: [
'ui-sans-serif',
'system-ui',
'-apple-system',
'BlinkMacSystemFont',
'"Segoe UI"',
'Roboto',
'"Helvetica Neue"',
'Arial',
'"Noto Sans"',
'sans-serif',
'"Apple Color Emoji"',
'"Segoe UI Emoji"',
'"Segoe UI Symbol"',
'"Noto Color Emoji"',
],
serif: ['ui-serif', 'Georgia', 'Cambria', '"Times New Roman"', 'Times', 'serif'],
mono: [
'ui-monospace',
'SFMono-Regular',
'Menlo',
'Monaco',
'Consolas',
'"Liberation Mono"',
'"Courier New"',
'monospace',
],
},
fontSize: {
xs: ['0.75rem', { lineHeight: '1rem' }],
sm: ['0.875rem', { lineHeight: '1.25rem' }],
base: ['1rem', { lineHeight: '1.5rem' }],
lg: ['1.125rem', { lineHeight: '1.75rem' }],
xl: ['1.25rem', { lineHeight: '1.75rem' }],
'2xl': ['1.5rem', { lineHeight: '2rem' }],
'3xl': ['1.875rem', { lineHeight: '2.25rem' }],
'4xl': ['2.25rem', { lineHeight: '2.5rem' }],
'5xl': ['3rem', { lineHeight: '1' }],
'6xl': ['3.75rem', { lineHeight: '1' }],
'7xl': ['4.5rem', { lineHeight: '1' }],
'8xl': ['6rem', { lineHeight: '1' }],
'9xl': ['8rem', { lineHeight: '1' }],
},
fontWeight: {
thin: '100',
extralight: '200',
light: '300',
normal: '400',
medium: '500',
semibold: '600',
bold: '700',
extrabold: '800',
black: '900',
},
gap: ({ theme }) => theme('spacing'),
gradientColorStops: ({ theme }) => theme('colors'),
gridAutoColumns: {
auto: 'auto',
min: 'min-content',
max: 'max-content',
fr: 'minmax(0, 1fr)',
},
gridAutoRows: {
auto: 'auto',
min: 'min-content',
max: 'max-content',
fr: 'minmax(0, 1fr)',
},
gridColumn: {
auto: 'auto',
'span-1': 'span 1 / span 1',
'span-2': 'span 2 / span 2',
'span-3': 'span 3 / span 3',
'span-4': 'span 4 / span 4',
'span-5': 'span 5 / span 5',
'span-6': 'span 6 / span 6',
'span-7': 'span 7 / span 7',
'span-8': 'span 8 / span 8',
'span-9': 'span 9 / span 9',
'span-10': 'span 10 / span 10',
'span-11': 'span 11 / span 11',
'span-12': 'span 12 / span 12',
'span-full': '1 / -1',
},
gridColumnEnd: {
auto: 'auto',
1: '1',
2: '2',
3: '3',
4: '4',
5: '5',
6: '6',
7: '7',
8: '8',
9: '9',
10: '10',
11: '11',
12: '12',
13: '13',
},
gridColumnStart: {
auto: 'auto',
1: '1',
2: '2',
3: '3',
4: '4',
5: '5',
6: '6',
7: '7',
8: '8',
9: '9',
10: '10',
11: '11',
12: '12',
13: '13',
},
gridRow: {
auto: 'auto',
'span-1': 'span 1 / span 1',
'span-2': 'span 2 / span 2',
'span-3': 'span 3 / span 3',
'span-4': 'span 4 / span 4',
'span-5': 'span 5 / span 5',
'span-6': 'span 6 / span 6',
'span-full': '1 / -1',
},
gridRowStart: {
auto: 'auto',
1: '1',
2: '2',
3: '3',
4: '4',
5: '5',
6: '6',
7: '7',
},
gridRowEnd: {
auto: 'auto',
1: '1',
2: '2',
3: '3',
4: '4',
5: '5',
6: '6',
7: '7',
},
gridTemplateColumns: {
none: 'none',
1: 'repeat(1, minmax(0, 1fr))',
2: 'repeat(2, minmax(0, 1fr))',
3: 'repeat(3, minmax(0, 1fr))',
4: 'repeat(4, minmax(0, 1fr))',
5: 'repeat(5, minmax(0, 1fr))',
6: 'repeat(6, minmax(0, 1fr))',
7: 'repeat(7, minmax(0, 1fr))',
8: 'repeat(8, minmax(0, 1fr))',
9: 'repeat(9, minmax(0, 1fr))',
10: 'repeat(10, minmax(0, 1fr))',
11: 'repeat(11, minmax(0, 1fr))',
12: 'repeat(12, minmax(0, 1fr))',
},
gridTemplateRows: {
none: 'none',
1: 'repeat(1, minmax(0, 1fr))',
2: 'repeat(2, minmax(0, 1fr))',
3: 'repeat(3, minmax(0, 1fr))',
4: 'repeat(4, minmax(0, 1fr))',
5: 'repeat(5, minmax(0, 1fr))',
6: 'repeat(6, minmax(0, 1fr))',
},
height: ({ theme }) => ({
auto: 'auto',
...theme('spacing'),
'1/2': '50%',
'1/3': '33.333333%',
'2/3': '66.666667%',
'1/4': '25%',
'2/4': '50%',
'3/4': '75%',
'1/5': '20%',
'2/5': '40%',
'3/5': '60%',
'4/5': '80%',
'1/6': '16.666667%',
'2/6': '33.333333%',
'3/6': '50%',
'4/6': '66.666667%',
'5/6': '83.333333%',
full: '100%',
screen: '100vh',
min: 'min-content',
max: 'max-content',
fit: 'fit-content',
}),
inset: ({ theme }) => ({
auto: 'auto',
...theme('spacing'),
'1/2': '50%',
'1/3': '33.333333%',
'2/3': '66.666667%',
'1/4': '25%',
'2/4': '50%',
'3/4': '75%',
full: '100%',
}),
keyframes: {
spin: {
to: {
transform: 'rotate(360deg)',
},
},
ping: {
'75%, 100%': {
transform: 'scale(2)',
opacity: '0',
},
},
pulse: {
'50%': {
opacity: '.5',
},
},
bounce: {
'0%, 100%': {
transform: 'translateY(-25%)',
animationTimingFunction: 'cubic-bezier(0.8,0,1,1)',
},
'50%': {
transform: 'none',
animationTimingFunction: 'cubic-bezier(0,0,0.2,1)',
},
},
},
letterSpacing: {
tighter: '-0.05em',
tight: '-0.025em',
normal: '0em',
wide: '0.025em',
wider: '0.05em',
widest: '0.1em',
},
lineHeight: {
none: '1',
tight: '1.25',
snug: '1.375',
normal: '1.5',
relaxed: '1.625',
loose: '2',
3: '.75rem',
4: '1rem',
5: '1.25rem',
6: '1.5rem',
7: '1.75rem',
8: '2rem',
9: '2.25rem',
10: '2.5rem',
},
listStyleType: {
none: 'none',
disc: 'disc',
decimal: 'decimal',
},
margin: ({ theme }) => ({
auto: 'auto',
...theme('spacing'),
}),
maxHeight: ({ theme }) => ({
...theme('spacing'),
full: '100%',
screen: '100vh',
min: 'min-content',
max: 'max-content',
fit: 'fit-content',
}),
maxWidth: ({ theme, breakpoints }) => ({
none: 'none',
0: '0rem',
xs: '20rem',
sm: '24rem',
md: '28rem',
lg: '32rem',
xl: '36rem',
'2xl': '42rem',
'3xl': '48rem',
'4xl': '56rem',
'5xl': '64rem',
'6xl': '72rem',
'7xl': '80rem',
full: '100%',
min: 'min-content',
max: 'max-content',
fit: 'fit-content',
prose: '65ch',
...breakpoints(theme('screens')),
}),
minHeight: {
0: '0px',
full: '100%',
screen: '100vh',
min: 'min-content',
max: 'max-content',
fit: 'fit-content',
},
minWidth: {
0: '0px',
full: '100%',
min: 'min-content',
max: 'max-content',
fit: 'fit-content',
},
objectPosition: {
bottom: 'bottom',
center: 'center',
left: 'left',
'left-bottom': 'left bottom',
'left-top': 'left top',
right: 'right',
'right-bottom': 'right bottom',
'right-top': 'right top',
top: 'top',
},
opacity: {
0: '0',
5: '0.05',
10: '0.1',
20: '0.2',
25: '0.25',
30: '0.3',
40: '0.4',
50: '0.5',
60: '0.6',
70: '0.7',
75: '0.75',
80: '0.8',
90: '0.9',
95: '0.95',
100: '1',
},
order: {
first: '-9999',
last: '9999',
none: '0',
1: '1',
2: '2',
3: '3',
4: '4',
5: '5',
6: '6',
7: '7',
8: '8',
9: '9',
10: '10',
11: '11',
12: '12',
},
padding: ({ theme }) => theme('spacing'),
placeholderColor: ({ theme }) => theme('colors'),
placeholderOpacity: ({ theme }) => theme('opacity'),
outlineColor: ({ theme }) => theme('colors'),
outlineOffset: {
0: '0px',
1: '1px',
2: '2px',
4: '4px',
8: '8px',
},
outlineWidth: {
0: '0px',
1: '1px',
2: '2px',
4: '4px',
8: '8px',
},
ringColor: ({ theme }) => ({
DEFAULT: theme('colors.blue.500', '#3b82f6'),
...theme('colors'),
}),
ringOffsetColor: ({ theme }) => theme('colors'),
ringOffsetWidth: {
0: '0px',
1: '1px',
2: '2px',
4: '4px',
8: '8px',
},
ringOpacity: ({ theme }) => ({
DEFAULT: '0.5',
...theme('opacity'),
}),
ringWidth: {
DEFAULT: '3px',
0: '0px',
1: '1px',
2: '2px',
4: '4px',
8: '8px',
},
rotate: {
0: '0deg',
1: '1deg',
2: '2deg',
3: '3deg',
6: '6deg',
12: '12deg',
45: '45deg',
90: '90deg',
180: '180deg',
},
saturate: {
0: '0',
50: '.5',
100: '1',
150: '1.5',
200: '2',
},
scale: {
0: '0',
50: '.5',
75: '.75',
90: '.9',
95: '.95',
100: '1',
105: '1.05',
110: '1.1',
125: '1.25',
150: '1.5',
},
scrollMargin: ({ theme }) => ({
...theme('spacing'),
}),
scrollPadding: ({ theme }) => theme('spacing'),
sepia: {
0: '0',
DEFAULT: '100%',
},
skew: {
0: '0deg',
1: '1deg',
2: '2deg',
3: '3deg',
6: '6deg',
12: '12deg',
},
space: ({ theme }) => ({
...theme('spacing'),
}),
stroke: ({ theme }) => theme('colors'),
strokeWidth: {
0: '0',
1: '1',
2: '2',
},
textColor: ({ theme }) => theme('colors'),
textDecorationColor: ({ theme }) => theme('colors'),
textDecorationThickness: {
auto: 'auto',
'from-font': 'from-font',
0: '0px',
1: '1px',
2: '2px',
4: '4px',
8: '8px',
},
textUnderlineOffset: {
auto: 'auto',
0: '0px',
1: '1px',
2: '2px',
4: '4px',
8: '8px',
},
textIndent: ({ theme }) => ({
...theme('spacing'),
}),
textOpacity: ({ theme }) => theme('opacity'),
transformOrigin: {
center: 'center',
top: 'top',
'top-right': 'top right',
right: 'right',
'bottom-right': 'bottom right',
bottom: 'bottom',
'bottom-left': 'bottom left',
left: 'left',
'top-left': 'top left',
},
transitionDelay: {
75: '75ms',
100: '100ms',
150: '150ms',
200: '200ms',
300: '300ms',
500: '500ms',
700: '700ms',
1000: '1000ms',
},
transitionDuration: {
DEFAULT: '150ms',
75: '75ms',
100: '100ms',
150: '150ms',
200: '200ms',
300: '300ms',
500: '500ms',
700: '700ms',
1000: '1000ms',
},
transitionProperty: {
none: 'none',
all: 'all',
DEFAULT:
'color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter',
colors: 'color, background-color, border-color, text-decoration-color, fill, stroke',
opacity: 'opacity',
shadow: 'box-shadow',
transform: 'transform',
},
transitionTimingFunction: {
DEFAULT: 'cubic-bezier(0.4, 0, 0.2, 1)',
linear: 'linear',
in: 'cubic-bezier(0.4, 0, 1, 1)',
out: 'cubic-bezier(0, 0, 0.2, 1)',
'in-out': 'cubic-bezier(0.4, 0, 0.2, 1)',
},
translate: ({ theme }) => ({
...theme('spacing'),
'1/2': '50%',
'1/3': '33.333333%',
'2/3': '66.666667%',
'1/4': '25%',
'2/4': '50%',
'3/4': '75%',
full: '100%',
}),
width: ({ theme }) => ({
auto: 'auto',
...theme('spacing'),
'1/2': '50%',
'1/3': '33.333333%',
'2/3': '66.666667%',
'1/4': '25%',
'2/4': '50%',
'3/4': '75%',
'1/5': '20%',
'2/5': '40%',
'3/5': '60%',
'4/5': '80%',
'1/6': '16.666667%',
'2/6': '33.333333%',
'3/6': '50%',
'4/6': '66.666667%',
'5/6': '83.333333%',
'1/12': '8.333333%',
'2/12': '16.666667%',
'3/12': '25%',
'4/12': '33.333333%',
'5/12': '41.666667%',
'6/12': '50%',
'7/12': '58.333333%',
'8/12': '66.666667%',
'9/12': '75%',
'10/12': '83.333333%',
'11/12': '91.666667%',
full: '100%',
screen: '100vw',
min: 'min-content',
max: 'max-content',
fit: 'fit-content',
}),
willChange: {
auto: 'auto',
scroll: 'scroll-position',
contents: 'contents',
transform: 'transform',
},
zIndex: {
auto: 'auto',
0: '0',
10: '10',
20: '20',
30: '30',
40: '40',
50: '50',
},
},
variantOrder: [
'first',
'last',
'odd',
'even',
'visited',
'checked',
'empty',
'read-only',
'group-hover',
'group-focus',
'focus-within',
'hover',
'focus',
'focus-visible',
'active',
'disabled',
],
plugins: [],
}
-6
stubs/defaultPostCssConfig.stub.js
module.exports = {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
}
-7
stubs/simpleConfig.stub.js
module.exports = {
content: [],
theme: {
extend: {},
},
plugins: [],
}
-5
tailwind.css
@tailwind base;
@tailwind components;
@tailwind utilities;
-1
variants.css
@tailwind variants;