https://huegrid.app/_next/static/chunks/b6e54021d45315ca.js?dpl=dpl_9xcVgRgoaoGesozZeCVbMcqm8sBe

1(globalThis.TURBOPACK||(globalThis.TURBOPACK=[])).push(["object"==typeof document?document.currentScript:void 0,690896,e=>{"use strict";let t=null;function r(){if(t)return t;let e=0,r=navigator.hardwareConcurrency??4;r>=8?e+=2:r>=4&&(e+=1);let n=navigator.deviceMemory;return null!=n?n>=8?e+=2:n>=4&&(e+=1):e+=1,(window.devicePixelRatio??1)>1&&(e+=1),/Android|iPhone|iPad|iPod/i.test(navigator.userAgent)&&(e-=1),t=e<=1?"low":e<=3?"medium":"high"}function n(e){let t=e??r();return"low"===t?1:"medium"===t?1.5:2}function l(e){let t=e??r();return"low"===t?200:"medium"===t?600:1e3}e.s(["getMaxDpr",()=>n,"getThumbnailCacheLimit",()=>l])},745880,e=>{"use strict";var t=e.i(843476),r=e.i(271645),n=e.i(618566),l=e.i(561393),s=e.i(689373),a=e.i(308615),i=e.i(477220),o=e.i(110281),c=e.i(690466),u=e.i(198638),d=e.i(535555),m=e.i(810358),f=e.i(73651),h=e.i(338703),p=e.i(261500),g=e.i(227304),x=e.i(313333);let b=(0,r.memo)(function({mode:e,presets:r,thumbnailCache:n,thumbnailVersion:l,loadingDone:s,allLikedIds:a,bookmarkedIds:i,scrollRoot:o,cardObserveRef:c,onHover:u,onClick:d,onSave:m,onBookmark:f,onViewAll:h}){return(0,t.jsxs)("div",{className:"explore-mode-section mb-8",children:[(0,t.jsxs)("div",{className:"explore-section-header flex items-baseline justify-between mb-3",children:[(0,t.jsxs)("div",{className:"flex items-baseline gap-3 min-w-0",children:[(0,t.jsx)("h3",{className:"text-[15px] font-semibold text-[var(--sg-text)] tracking-tight",children:e.label}),e.isNew&&(0,t.jsx)("span",{className:"shrink-0 px-1.5 py-[1px] rounded text-[9px] font-bold uppercase tracking-wider bg-[var(--sg-accent)] text-white",children:"New"}),(0,t.jsx)("span",{className:"hidden sm:block text-[12px] text-[var(--sg-glass-text-subtle)] truncate",children:e.description})]}),(0,t.jsxs)("button",{onClick:()=>h(e.key),className:"shrink-0 ml-4 text-[12px] font-medium text-[var(--sg-glass-text-hover)] hover:text-[var(--sg-text)] transition-colors duration-150 flex items-center gap-1",children:["View All",(0,t.jsxs)("svg",{width:"14",height:"14",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[(0,t.jsx)("path",{d:"M5 12h14"}),(0,t.jsx)("path",{d:"m12 5 7 7-7 7"})]})]})]}),(0,t.jsx)("div",{className:"explore-section-grid",children:r.map((e,r)=>(0,t.jsx)("div",{ref:c,"data-preset-id":e.id,children:(0,t.jsx)(x.ExploreGradientCard,{preset:e,thumbnail:n.get(e.id)??null,instant:s,size:"md",index:r,isSaved:a.has(e.id),isBookmarked:i.has(e.id),scrollRoot:o,onHover:u,onClick:d,onSave:m,onBookmark:f})},e.id))})]})});var v=e.i(469705),w=e.i(690896);let k=[{label:"All",value:"all"},{label:"2D",value:"2D"},{label:"Patterns",value:"Patterns"},{label:"3D",value:"3D"},{label:"Audio",value:"Audio"},{label:"Liquid",value:"Liquid"}],y=new Map;function C(){let e=(0,w.getThumbnailCacheLimit)();for(;y.size>e;){let e=y.entries().next();if(e.done)break;let[t,r]=e.value;URL.revokeObjectURL(r),y.delete(t)}}let S=[10,31,32,14];function j({anchorEl:e,onSelect:n,onClose:l}){let[s,a]=(0,r.useState)({top:0,left:0});return(0,r.useEffect)(()=>{let t=e.getBoundingClientRect(),r=t.right+230>window.innerWidth;a({top:t.top+t.height/2,left:r?t.left-230:t.right+8})},[e]),(0,t.jsx)("div",{className:"fixed z-[200]",style:{top:s.top,left:s.left,transform:"translateY(-50%)"},children:(0,t.jsx)(g.CollectionPicker,{onSelect:n,onClose:l})})}function R(){let e=(0,n.useRouter)(),[g,x]=(0,r.useState)("all");(0,r.useEffect)(()=>{try{let e=sessionStorage.getItem("sg_browse_category");e&&x(e)}catch{}(0,d.scheduleStaleEntryCleanup)()},[]);let R=(0,r.useCallback)(e=>{x(e);try{sessionStorage.setItem("sg_browse_category",e)}catch{}},[]),[N,T]=(0,r.useState)(""),[_,A]=(0,r.useState)(null),[E,M]=(0,r.useState)(null),[P,I]=(0,r.useState)("default"),L=(0,r.useMemo)(()=>{let e=new Set(Object.values(u.MODE_METADATA).filter(e=>e.comingSoon).map(e=>e.key));return u.MODE_CATEGORIES.map(({category:t,modes:r})=>({category:t,modes:r.filter(t=>!e.has(t.key)).map(e=>{var t,r;let n;return{mode:e,presets:(t=l.PRESETS,r=e.key,(n=t.filter(e=>(e.state.mode??"simple")===r)).length<=4?n:S.map(e=>n[Math.min(e,n.length-1)]))}}).filter(({presets:e})=>e.length>0)})).filter(({modes:e})=>e.length>0)},[]),O=(0,r.useMemo)(()=>L.flatMap(({modes:e})=>e.flatMap(({presets:e})=>e)),[L]),z=a.PRESET_COLOR_MAP,D=(0,r.useMemo)(()=>{let e="all"===g?L:L.filter(({category:e})=>e===g);if(N.trim()||_||null!==E){let t=N.trim().toLowerCase();e=e.map(({category:e,modes:r})=>({category:e,modes:r.map(({mode:e,presets:r})=>({mode:e,presets:r.filter(e=>{if(t&&!e.name.toLowerCase().includes(t))return!1;let r=z.get(e.id);return(!_||r?.bucket===_)&&(null===E||!!r&&!!(0,s.matchesSpectrum)(r.hue,E))})})).filter(({presets:e})=>e.length>0)})).filter(({modes:e})=>e.length>0)}return e},[L,g,N,_,E,z]),B=(0,r.useRef)(y),[F,q]=(0,r.useState)(0),[U,H]=(0,r.useState)(!1),{savedIds:V,cloudGradients:$,orphanedLikedGradients:K,toggleSave:G,saveToCollection:W}=(0,m.useCloudCollection)(),{collections:J,ensureDefaultCollection:Q}=(0,f.useCollections)(),{isSignedIn:Y}=(0,h.useAuth)(),X=(0,p.useAuthModal)(),Z=(0,r.useMemo)(()=>{let e=new Set(V);for(let t of K)t.preset_id&&e.add(t.preset_id);return e},[V,K]),ee=(0,r.useMemo)(()=>{let e=new Set;for(let t of $)t.preset_id&&t.collection_id&&e.add(t.preset_id);return e},[$]),[et,er]=(0,r.useState)(null),en=(0,r.useRef)(G);en.current=G;let el=(0,r.useCallback)(e=>en.current(e),[]),es=(0,r.useRef)(W);es.current=W;let ea=(0,r.useRef)(Y);ea.current=Y;let ei=(0,r.useRef)(J);ei.current=J;let eo=(0,r.useRef)(Q);eo.current=Q;let ec=(0,r.useRef)(X);ec.current=X;let eu=(0,r.useRef)(null),ed=(0,r.useRef)(null),em=(0,r.useRef)(null),ef=(0,r.useRef)(0),eh=(0,r.useRef)(0),ep=(0,r.useRef)(null),eg=(0,r.useRef)(void 0),ex=(0,r.useRef)(!1),eb=(0,r.useRef)(!1),ev="sg_explore_scroll",ew=(0,r.useCallback)(()=>{eb.current||(eg.current&&clearTimeout(eg.current),eg.current=setTimeout(()=>{if(ep.current&&!eb.current)try{sessionStorage.setItem(ev,String(ep.current.scrollTop))}catch{}},100))},[]);(0,r.useEffect)(()=>{let e=sessionStorage.getItem(ev);if(!e||ex.current)return;let t=Number(e);if(!t)return;let r=0,n=0,l=()=>{if(ex.current)return;let e=ep.current;e&&e.scrollHeight>t?(e.scrollTo(0,t),ex.current=!0):n<60&&(n++,r=requestAnimationFrame(l))};return r=requestAnimationFrame(l),()=>cancelAnimationFrame(r)},[]),(0,r.useEffect)(()=>

1{let e=new i.ThumbnailRenderer(240,180);return eu.current=e,()=>{eu.current=null,e.destroy()}},[]);let ek=(0,r.useRef)(new Set),ey=(0,r.useRef)([]),eC=(0,r.useRef)(!1),eS=(0,r.useRef)(null),ej=(0,r.useRef)(!1),eR=(0,r.useRef)(!1);(0,r.useEffect)(()=>{ej.current=!1,eR.current=!1;let e=O.map(e=>e.id),t=new Set;for(let r of e)y.has(r)||t.add(r);if(0===t.size){H(!0),q(e=>e+1),eR.current=!0;return}return q(e=>e+1),async function(){try{let e=await (0,d.getCachedThumbnails)(Array.from(t));if(ej.current)return;for(let[r,n]of e)if(n&&!y.has(r)){let e=URL.createObjectURL(n);y.set(r,e),t.delete(r)}C(),q(e=>e+1)}catch{}ej.current||(ek.current=t,eR.current=!0,0===t.size?H(!0):eT())}(),()=>{ej.current=!0}},[O]);let eN=(0,r.useRef)(new Set),eT=(0,r.useCallback)(()=>{let e=eS.current;if(e)for(let t of eN.current)e.unobserve(t),e.observe(t)},[]),e_=(0,r.useCallback)(async()=>{if(eC.current||0===ey.current.length)return;eC.current=!0;let e=(0,w.getMaxDpr)(),t=new i.ThumbnailRenderer(Math.round(260*e),Math.round(290*e)),r=[];for(;ey.current.length>0&&!ej.current;){for(let e of ey.current.splice(0,8)){if(ej.current)break;if(!y.has(e.id))try{let{url:n,blob:l}=await t.renderPresetThumbnail(e);y.set(e.id,n),ek.current.delete(e.id),r.push({id:e.id,blob:l})}catch{ek.current.delete(e.id)}}C(),q(e=>e+1),ey.current.length>0&&await new Promise(e=>{"requestIdleCallback"in window?requestIdleCallback(()=>e(),{timeout:200}):setTimeout(e,32)})}t.destroyKeepUrls(),eC.current=!1,0!==ek.current.size||ej.current||H(!0),r.length>0&&(0,d.cacheThumbnails)(r).catch(()=>{})},[]);(0,r.useEffect)(()=>{let e=new IntersectionObserver(e=>{if(!eR.current)return;let t=!1;for(let r of e)if(r.isIntersecting){let e=r.target.dataset.presetId;if(e&&ek.current.has(e)){let r=O.find(t=>t.id===e);r&&!ey.current.some(t=>t.id===e)&&(ey.current.push(r),t=!0)}}t&&e_()}

1,{root:ep.current,rootMargin:"100% 0px"});return eS.current=e,()=>{e.disconnect(),eS.current=null}},[O,e_]);let eA=(0,r.useCallback)(e=>{e&&(eN.current.add(e),eS.current&&eS.current.observe(e))},[]),eE=(0,r.useCallback)((e,t)=>{if(ed.current=e,e&&t&&eu.current){let r=eu.current;em.current||(em.current=r.canvas,em.current.style.cssText="position:absolute;inset:0;width:100%;height:100%;pointer-events:none;border-radius:12px;z-index:10;display:none;");let n=em.current;t.appendChild(n);let s=t.getBoundingClientRect();r.resize(Math.round(2*s.width),Math.round(2*s.height)),n.style.display="block";let a=(0,l.applyPreset)(e);eh.current=performance.now();let i=()=>{if(!ed.current||ed.current.id!==e.id){n.style.display="none";return}let t=(performance.now()-eh.current)/1e3;r.renderState(a,t),ef.current=requestAnimationFrame(i)};cancelAnimationFrame(ef.current),ef.current=requestAnimationFrame(i)}else cancelAnimationFrame(ef.current),em.current&&(em.current.style.display="none")},[]),eM=(0,r.useCallback)(t=>{if(eb.current=!0,eg.current&&clearTimeout(eg.current),ep.current)try{sessionStorage.setItem(ev,String(ep.current.scrollTop))}catch{}let r=(0,l.applyPreset)(t);sessionStorage.setItem("sg_preset_state",JSON.stringify(r)),sessionStorage.setItem("sg_nav_source","explore"),e.push((0,o.createPath)(`preset=${t.id}`)),(0,v.trackEvent)("preset_clicked",{preset_id:t.id,mode:r.mode})},[e]),eP=(0,r.useCallback)(async(e,t)=>{if(!ea.current)return void ec.current.open("sign-in");let r=ei.current;if(0===r.length){let t=await eo.current();t&&es.current(e,t.id)}else 1===r.length?es.current(e,r[0].id):er({presetId:e,anchorEl:t})},[]),eI=(0,r.useCallback)(t=>{if(eb.current=!0,eg.current&&clearTimeout(eg.current),ep.current)try{sessionStorage.setItem(ev,String(ep.current.scrollTop))}catch{}e.push((0,o.browseModePath)(t)),(0,v.trackEvent)("browse_view_all",{mode:t})},[e]);return(0,r.useEffect)(()=>()=>cancelAnimationFrame(ef.current),[]),(0,t.jsxs)("div",{className:"h-full w-full flex flex-col",children:[(0,t.jsx)("div",{className:"explore-filters shrink-0 px-4 md:px-6 pt-5 pb-4 z-30 relative overflow-visible",children:(0,t.jsx)(c.ExploreFilterBar,{activeType:"all",onTypeChange:()=>{},categoryTabs:k,activeCategory:g,onCategoryChange:R,activeColor:_,onColorChange:A,spectrumHue:E,onSpectrumChange:M,searchQuery:N,onSearchChange:T,sortMode:P,onSortChange:I,onShuffle:()=>{}})}),(0,t.jsx)("div",{ref:ep,onScroll:ew,className:"flex-1 overflow-y-auto overflow-x-hidden explore-scroll px-4 md:px-6 pt-2 pb-20",children:(0,t.jsxs)("div",{className:"mx-auto max-w-[1800px]",children:[D.map(({category:e,modes:r})=>(0,t.jsxs)("div",{className:"mb-10",children:[(0,t.jsxs)("div",{className:"explore-super-category flex items-center gap-3 mb-6",children:[(0,t.jsx)("span",{className:"text-[11px] font-bold uppercase tracking-[0.15em] text-[var(--sg-glass-text-subtle)]",children:e}),(0,t.jsx)("div",{className:"flex-1 h-px bg-[var(--sg-glass-divider)]"})]}),r.map(({mode:e,presets:r})=>(0,t.jsx)(b,{mode:e,presets:r,thumbnailCache:B.current,thumbnailVersion:F,loadingDone:U,allLikedIds:Z,bookmarkedIds:ee,scrollRoot:ep,cardObserveRef:eA,onHover:eE,onClick:eM,onSave:el,onBookmark:eP,onViewAll:eI},e.key))]},e)),0===D.length&&(0,t.jsxs)("div",{className:"flex flex-col items-center justify-center py-20 text-center",children:[(0,t.jsx)("span",{className:"text-[14px] text-[var(--sg-glass-text)] font-medium",children:N.trim()?`No gradients matching "${N.trim()}"`:"No gradients in this category"}),(0,t.jsx)("button",{onClick:()=>{T(""),x("all")},className:"mt-3 text-[12px] font-medium text-[var(--sg-accent)] hover:text-[var(--sg-accent-light)] transition-colors",children:"Clear filters"})]}),(0,t.jsx)("div",{className:"flex justify-center pt-2 pb-4",children:(0,t.jsx)("a",{href:(0,o.licensePath)(),className:"text-[12px] font-medium text-[var(--sg-text-muted)] hover:text-[var(--sg-text)] transition-colors duration-200",children:"License Agreement"})})]})}),!U&&(0,t.jsxs)("div",{className:"absolute bottom-20 left-1/2 -translate-x-1/2 z-50 flex items-center gap-2 rounded-full bg-[var(--sg-glass-bg)] backdrop-blur-xl border border-[var(--sg-glass-border)] px-4 py-2",children:[(0,t.jsx)("div",{className:"h-1.5 w-1.5 rounded-full bg-[var(--sg-loading-dot)] animate-pulse"}),(0,t.jsx)("span",{className:"text-[11px] text-[var(--sg-glass-text)] font-medium",children:"Loading gradients..."})]}),et&&(0,t.jsx)(j,{anchorEl:et.anchorEl,onSelect:(e,t)=>

1{W(et.presetId,e),er(null),(0,v.trackEvent)("bookmarked_to_collection",{preset_id:et.presetId,collection_name:t})},onClose:()=>er(null)})]})}function N(){let e=(0,n.useRouter)();return(0,r.useEffect)(()=>{if(window.location.hash.length>1){let t=window.location.hash;e.replace(`${(0,o.createPath)()}${t}`)}},[e]),(0,t.jsx)(R,{})}e.s(["default",()=>N],745880)}]);