@vtbag/utensil-drawer/lib/bundled/declarative-names.js

Pull out just what you need to craft seamless transitions. The Utensil Drawer holds reusable functions to help you build websites with view transitions. It is a bit sparse right now, but like the one in your kitchen, it is bound to fill up over time.

"use strict";(()=>{function l(t,e,s=!1){let n;try{n=document.querySelectorAll(t)}catch(a){console.error(a.message.replace(/.*:/,"[vtbag] Error selecting elements for view transition names:"));return}g([...n],e,s)}function g(t,e,s=!1){e[e.length-1]==="~"&&(e=e.slice(0,-1)+"-",m(t)),e=CSS.escape(e),t.forEach((n,a,o)=>{let i=`${e}${o.length>1&&e!==""&&e!=="none"&&e!=="auto"?a:""}`;s&&(n.style.viewTransitionName=i)||(n.style.viewTransitionName||=i)})}function m(t){for(let e=t.length-1;e>0;--e){let s=Math.floor(Math.random()*(e+1));[t[e],t[s]]=[t[s],t[e]]}return t}function u(){addEventListener("DOMContentLoaded",r("old")),addEventListener("pagereveal",r("new")),addEventListener("pageswap",r("old"))}function r(t){return()=>{document.querySelectorAll("script").forEach(e=>{((e.getAttribute("data-vtbag-decl")??"")+";"+(e.getAttribute(`data-vtbag-decl-${t}`)??"")).split(/\s*;\s*/).forEach((n,a)=>{if(n=n.trim(),n.length>0){let o=n.split("=");if(o.length>1){let i=o.slice(0,-1).join("="),d=o[o.length-1],c=i.endsWith("~");c&&(i=i.slice(0,-1)),l(i.trim(),d.trim(),!c)}else l(n.trim(),`vtbag-decl-${a}-`,!1)}})})}}u();})();