https://www.visier.com/a97967020f2b69c8ef37a93cd33ebd7ae6cabfab-1f7211a2aa79880a56dc.js

1"use strict";(self.webpackChunkvisier_blog=self.webpackChunkvisier_blog||[]).push([[56],{71800:function(e,t,n){n.d(t,{K:function(){return r}});var o=n(85238);function r(e,t,n){var r;if("string"==typeof e){let i=document;t&&((0,o.V)(Boolean(t.current),"Scope provided, but no element detected."),i=t.current),n?(null!==(r=n[e])&&void 0!==r||(n[e]=i.querySelectorAll(e)),e=n[e]):e=i.querySelectorAll(e)}else e instanceof Element&&(e=[e]);return Array.from(e||[])}},63295:function(e,t,n){n.d(t,{d:function(){return c}});var o=n(96540),r=n(24785),i=n(35446),s=n(28601);function c(e){const t=(0,s.M)((()=>(0,r.OQ)(e))),{isStatic:n}=(0,o.useContext)(i.Q);if(n){const[,n]=(0,o.useState)(e);(0,o.useEffect)((()=>t.on("change",n)),[])}return t}},11762:function(e,t,n){n.d(t,{L:function(){return $}});var o=n(24785),r=n(28601),i=n(96540),s=n(85238),c=n(71800);const l=new WeakMap;let f;function a({target:e,contentRect:t,borderBoxSize:n}){var o;null===(o=l.get(e))||void 0===o||o.forEach((o=>{o({target:e,contentSize:t,get size(){return function(e,t){if(t){const{inlineSize:e,blockSize:n}=t[0];return{width:e,height:n}}return e instanceof SVGElement&&"getBBox"in e?e.getBBox():{width:e.offsetWidth,height:e.offsetHeight}}(e,n)}})}))}function u(e){e.forEach(a)}function g(e,t){f||"undefined"!=typeof ResizeObserver&&(f=new ResizeObserver(u));const n=(0,c.K)(e);return n.forEach((e=>{let n=l.get(e);n||(n=new Set,l.set(e,n)),n.add(t),null==f||f.observe(e)})),()=>{n.forEach((e=>{const n=l.get(e);null==n||n.delete(t),(null==n?void 0:n.size)||null==f||f.unobserve(e)}))}}const d=new Set;let h;function p(e){return d.add(e),h||(h=()=>{const e={width:window.innerWidth,height:window.innerHeight},t={target:window,size:e,contentSize:e};d.forEach((e=>e(t)))},window.addEventListener("resize",h)),()=>{d.delete(e),!d.size&&h&&(h=void 0)}}var v=n(27170),y=n(57177);const m=50,w=()=>({time:0,x:{current:0,offset:[],progress:0,scrollLength:0,targetOffset:0,targetLength:0,containerLength:0,velocity:0},y:{current:0,offset:[],progress:0,scrollLength:0,targetOffset:0,targetLength:0,containerLength:0,velocity:0}}),E={x:{length:"Width",position:"Left"},y:{length:"Height",position:"Top"}};function x(e,t,n,o){const r=n[t],{length:i,position:s}=E[t],c=r.current,l=n.time;r.current=e[`scroll${s}`],r.scrollLength=e[`scroll${i}`]-e[`client${i}`],r.offset.length=0,r.offset[0]=0,r.offset[1]=r.scrollLength,r.progress=(0,v.q)(0,r.scrollLength,r.current);const f=o-l;r.velocity=f>m?0:(0,y.f)(r.current-c,f)}const L={Enter:[[0,1],[1,1]],Exit:[[0,0],[1,0]],Any:[[1,0],[0,1]],All:[[0,0],[1,1]]},W={start:0,center:.5,end:1};function b(e,t,n=0){let o=0;if(e in W&&(e=W[e]),"string"==typeof e){const t=parseFloat(e);e.endsWith("px")?o=t:e.endsWith("%")?e=t/100:e.endsWith("vw")?o=t/100*document.documentElement.clientWidth:e.endsWith("vh")?o=t/100*document.documentElement.clientHeight:e=t}return"number"==typeof e&&(o=t*e),n+o}const S=[0,0];function O(e,t,n,o){let r=Array.isArray(e)?e:S,i=0,s=0;return"number"==typeof e?r=[e,e]:"string"==typeof e&&(r=(e=e.trim()).includes(" ")?e.split(" "):[e,W[e]?e:"0"]),i=b(r[0],n,o),s=b(r[1],t),i-s}var z=n(28844),B=n(33490);const H={x:0,y:0};function k(e,t,n){const{offset:o=L.All}=n,{target:r=e,axis:i="y"}=n,s="y"===i?"height":"width",c=r!==e?function(e,t){const n={x:0,y:0};let o=e;for(;o&&o!==t;)if(o instanceof HTMLElement)n.x+=o.offsetLeft,n.y+=o.offsetTop,o=o.offsetParent;else if("svg"===o.tagName){const e=o.getBoundingClientRect();o=o.parentElement;const t=o.getBoundingClientRect();n.x+=e.left-t.left,n.y+=e.top-t.top}else{if(!(o instanceof SVGGraphicsElement))break;{const{x:e,y:t}=o.getBBox();n.x+=e,n.y+=t;let r=null,i=o.parentNode;for(;!r;)"svg"===i.tagName&&(r=i),i=o.parentNode;o=r}}return n}(r,e):H,l=r===e?{width:e.scrollWidth,height:e.scrollHeight}:function(e){return"getBBox"in e&&"svg"!==e.tagName?e.getBBox():{width:e.clientWidth,height:e.clientHeight}}(r),f={width:e.clientWidth,height:e.clientHeight};t[i].offset.length=0;let a=!t[i].interpolate;const u=o.length;for(let g=0;g<u;g++){const e=O(o[g],f[s],l[s],c[i]);a||e===t[i].interpolatorOffsets[g]||(a=!0),t[i].offset[g]=e}a&&(t[i].interpolate=(0,z.G)(t[i].offset,(0,B.Z)(o)),t[i].interpolatorOff

1sets=[...t[i].offset]),t[i].progress=t[i].interpolate(t[i].current)}function G(e,t,n,o={}){return{measure:()=>function(e,t=e,n){if(n.x.targetOffset=0,n.y.targetOffset=0,t!==e){let o=t;for(;o&&o!==e;)n.x.targetOffset+=o.offsetLeft,n.y.targetOffset+=o.offsetTop,o=o.offsetParent}n.x.targetLength=t===e?t.scrollWidth:t.clientWidth,n.y.targetLength=t===e?t.scrollHeight:t.clientHeight,n.x.containerLength=e.clientWidth,n.y.containerLength=e.clientHeight}(e,o.target,n),update:t=>{!function(e,t,n){x(e,"x",t,n),x(e,"y",t,n),t.time=n}(e,n,t),(o.offset||o.target)&&k(e,n,o)},notify:()=>t(n)}}var A=n(10104);const M=new WeakMap,N=new WeakMap,P=new WeakMap,Q=e=>e===document.documentElement?window:e;function C(e,{container:t=document.documentElement,...n}={}){let o=P.get(t);o||(o=new Set,P.set(t,o));const r=w(),i=G(t,e,r,n);if(o.add(i),!M.has(t)){const e=()=>{for(const e of o)e.measure()},n=()=>{for(const e of o)e.update(A.uv.timestamp)},r=()=>{for(const e of o)e.notify()},i=()=>{A.Gt.read(e,!1,!0),A.Gt.read(n,!1,!0),A.Gt.update(r,!1,!0)};M.set(t,i);const l=Q(t);window.addEventListener("resize",i,{passive:!0}),t!==document.documentElement&&N.set(t,(c=i,"function"==typeof(s=t)?p(s):g(s,c))),l.addEventListener("scroll",i,{passive:!0})}var s,c;const l=M.get(t);return A.Gt.read(l,!1,!0),()=>{var e;(0,A.WG)(l);const n=P.get(t);if(!n)return;if(n.delete(i),n.size)return;const o=M.get(t);M.delete(t),o&&(Q(t).removeEventListener("scroll",o),null===(e=N.get(t))||void 0===e||e(),window.removeEventListener("resize",o))}}var R=n(25128);function T(e,t){(0,s.$)(Boolean(!t||t.current),`You have defined a ${e} options but the provided ref is not yet hydrated, probably because it's defined higher up the tree. Try calling useScroll() in the same component as the ref, or setting its \`layoutEffect: false\` option.`)}const Y=()=>({scrollX:(0,o.OQ)(0),scrollY:(0,o.OQ)(0),scrollXProgress:(0,o.OQ)(0),scrollYProgress:(0,o.OQ)(0)});function $({container:e,target:t,layoutEffect:n=!0,...o}={}){const s=(0,r.M)(Y);return(n?R.E:i.useEffect)((()=>(T("target",t),T("container",e),C((({x:e,y:t})=>{s.scrollX.set(e.current),s.scrollXProgress.set(e.progress),s.scrollY.set(t.current),s.scrollYProgress.set(t.progress)}),{...o,container:(null==e?void 0:e.current)||void 0,target:(null==t?void 0:t.current)||void 0}))),[e,t,JSON.stringify(o.offset)]),s}}}]);