UNPKG

meshgrad

Version:

A tiny utility for generating CSS Mesh Gradients

3 lines (2 loc) 1.79 kB
var b=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var M=Object.getOwnPropertyNames;var $=Object.prototype.hasOwnProperty;var k=(r,n)=>{for(var t in n)b(r,t,{get:n[t],enumerable:!0})},l=(r,n,t,e)=>{if(n&&typeof n=="object"||typeof n=="function")for(let a of M(n))!$.call(r,a)&&a!==t&&b(r,a,{get:()=>n[a],enumerable:!(e=p(n,a))||e.enumerable});return r};var v=r=>l(b({},"__esModule",{value:!0}),r);var A={};k(A,{generateJSXMeshGradient:()=>y,generateMeshGradient:()=>j});module.exports=v(A);var I=()=>Math.round(Math.random()*360),g=r=>Math.round(Math.random()*(r*100)%100),f=(r,n,t)=>Math.round(n/t*(r*100)%100),d=r=>{if(r){r=r.replace(/#/g,""),r.length===3&&(r=r.split("").map(function(c){return c+c}).join(""));var n=/^([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})[\da-z]{0,0}$/i.exec(r);if(n){var t=parseInt(n[1],16),e=parseInt(n[2],16),a=parseInt(n[3],16);t/=255,e/=255,a/=255;var o=Math.max(t,e,a),s=Math.min(t,e,a),u=(o+s)/2;if(o==s)u=0;else{var m=o-s;switch(o){case t:u=(e-a)/m+(e<a?6:0);break;case e:u=(a-t)/m+2;break;case a:u=(t-e)/m+4;break}u/=6}return u=Math.round(360*u),u}}},G=(r,n)=>Array.from({length:r},(t,e)=>e===0?`hsl(${n}, 100%, 74%)`:e<r/1.4?`hsl(${n-30*(1-2*(e%2))*(e>2?e/2:e)}, 100%, ${64-e*(1-2*(e%2))*1.75}%)`:`hsl(${n-150*(1-2*(e%2))}, 100%, ${66-e*(1-2*(e%2))*1.25}%)`),S=(r,n,t)=>Array.from({length:r},(e,a)=>`radial-gradient(at ${t?f(a,t,r):g(a)}% ${t?f(a*10,t,r):g(a*10)}%, ${n[a]} 0px, transparent 55%) `),i=(r,n,t)=>{let e=G(r,n||I()),a=S(r,e,t||void 0);return[e[0],a.join(",")]},j=(r,n,t)=>{let[e,a]=i(r,d(n)?d(n):void 0,t||void 0);return`background-color: ${e}; background-image:${a}`},y=(r,n,t)=>{let[e,a]=i(r,d(n)?d(n):void 0,t||void 0);return{backgroundColor:e,backgroundImage:a}};0&&(module.exports={generateJSXMeshGradient,generateMeshGradient});