{
  "version": 3,
  "sources": ["../../../src/components/layout/animation.js"],
  "sourcesContent": ["import { Controller, easings } from '@react-spring/web';\nimport { useLayoutEffect, useMemo, useRef } from '@wordpress/element';\n\nfunction getAbsolutePosition( element ) {\n\treturn {\n\t\ttop: element.offsetTop,\n\t\tleft: element.offsetLeft,\n\t};\n}\n\nconst ANIMATION_DURATION = 400;\n\n/**\n * Hook used to compute the styles required to move a div into a new position.\n *\n * The way this animation works is the following:\n *  - It first renders the element as if there was no animation.\n *  - It takes a snapshot of the position of the block to use it\n *    as a destination point for the animation.\n *  - It restores the element to the previous position using a CSS transform\n *  - It uses the \"resetAnimation\" flag to reset the animation\n *    from the beginning in order to animate to the new destination point.\n *\n * @param {Object} $1                          Options\n * @param {*}      $1.triggerAnimationOnChange Variable used to trigger the animation if it changes.\n */\nfunction useMovingAnimation( { triggerAnimationOnChange } ) {\n\tconst ref = useRef();\n\n\t// Whenever the trigger changes, we need to take a snapshot of the current\n\t// position of the block to use it as a destination point for the animation.\n\tconst { previous, prevRect } = useMemo(\n\t\t() => ( {\n\t\t\tprevious: ref.current && getAbsolutePosition( ref.current ),\n\t\t\tprevRect: ref.current && ref.current.getBoundingClientRect(),\n\t\t} ),\n\t\t[ triggerAnimationOnChange ]\n\t);\n\n\tuseLayoutEffect( () => {\n\t\tif ( ! previous || ! ref.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// We disable the animation if the user has a preference for reduced\n\t\t// motion.\n\t\tconst disableAnimation = window.matchMedia(\n\t\t\t'(prefers-reduced-motion: reduce)'\n\t\t).matches;\n\n\t\tif ( disableAnimation ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst controller = new Controller( {\n\t\t\tx: 0,\n\t\t\ty: 0,\n\t\t\twidth: prevRect.width,\n\t\t\theight: prevRect.height,\n\t\t\tconfig: {\n\t\t\t\tduration: ANIMATION_DURATION,\n\t\t\t\teasing: easings.easeInOutQuint,\n\t\t\t},\n\t\t\tonChange( { value } ) {\n\t\t\t\tif ( ! ref.current ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tlet { x, y, width, height } = value;\n\t\t\t\tx = Math.round( x );\n\t\t\t\ty = Math.round( y );\n\t\t\t\twidth = Math.round( width );\n\t\t\t\theight = Math.round( height );\n\t\t\t\tconst finishedMoving = x === 0 && y === 0;\n\t\t\t\tref.current.style.transformOrigin = 'center center';\n\t\t\t\tref.current.style.transform = finishedMoving\n\t\t\t\t\t? null // Set to `null` to explicitly remove the transform.\n\t\t\t\t\t: `translate3d(${ x }px,${ y }px,0)`;\n\t\t\t\tref.current.style.width = finishedMoving\n\t\t\t\t\t? null\n\t\t\t\t\t: `${ width }px`;\n\t\t\t\tref.current.style.height = finishedMoving\n\t\t\t\t\t? null\n\t\t\t\t\t: `${ height }px`;\n\t\t\t},\n\t\t} );\n\n\t\tref.current.style.transform = undefined;\n\t\tconst destination = ref.current.getBoundingClientRect();\n\n\t\tconst x = Math.round( prevRect.left - destination.left );\n\t\tconst y = Math.round( prevRect.top - destination.top );\n\t\tconst width = destination.width;\n\t\tconst height = destination.height;\n\n\t\tcontroller.start( {\n\t\t\tx: 0,\n\t\t\ty: 0,\n\t\t\twidth,\n\t\t\theight,\n\t\t\tfrom: { x, y, width: prevRect.width, height: prevRect.height },\n\t\t} );\n\n\t\treturn () => {\n\t\t\tcontroller.stop();\n\t\t\tcontroller.set( {\n\t\t\t\tx: 0,\n\t\t\t\ty: 0,\n\t\t\t\twidth: prevRect.width,\n\t\t\t\theight: prevRect.height,\n\t\t\t} );\n\t\t};\n\t}, [ previous, prevRect ] );\n\n\treturn ref;\n}\n\nexport default useMovingAnimation;\n"],
  "mappings": ";AAAA,SAAS,YAAY,eAAe;AACpC,SAAS,iBAAiB,SAAS,cAAc;AAEjD,SAAS,oBAAqB,SAAU;AACvC,SAAO;AAAA,IACN,KAAK,QAAQ;AAAA,IACb,MAAM,QAAQ;AAAA,EACf;AACD;AAEA,IAAM,qBAAqB;AAgB3B,SAAS,mBAAoB,EAAE,yBAAyB,GAAI;AAC3D,QAAM,MAAM,OAAO;AAInB,QAAM,EAAE,UAAU,SAAS,IAAI;AAAA,IAC9B,OAAQ;AAAA,MACP,UAAU,IAAI,WAAW,oBAAqB,IAAI,OAAQ;AAAA,MAC1D,UAAU,IAAI,WAAW,IAAI,QAAQ,sBAAsB;AAAA,IAC5D;AAAA,IACA,CAAE,wBAAyB;AAAA,EAC5B;AAEA,kBAAiB,MAAM;AACtB,QAAK,CAAE,YAAY,CAAE,IAAI,SAAU;AAClC;AAAA,IACD;AAIA,UAAM,mBAAmB,OAAO;AAAA,MAC/B;AAAA,IACD,EAAE;AAEF,QAAK,kBAAmB;AACvB;AAAA,IACD;AAEA,UAAM,aAAa,IAAI,WAAY;AAAA,MAClC,GAAG;AAAA,MACH,GAAG;AAAA,MACH,OAAO,SAAS;AAAA,MAChB,QAAQ,SAAS;AAAA,MACjB,QAAQ;AAAA,QACP,UAAU;AAAA,QACV,QAAQ,QAAQ;AAAA,MACjB;AAAA,MACA,SAAU,EAAE,MAAM,GAAI;AACrB,YAAK,CAAE,IAAI,SAAU;AACpB;AAAA,QACD;AACA,YAAI,EAAE,GAAAA,IAAG,GAAAC,IAAG,OAAAC,QAAO,QAAAC,QAAO,IAAI;AAC9B,QAAAH,KAAI,KAAK,MAAOA,EAAE;AAClB,QAAAC,KAAI,KAAK,MAAOA,EAAE;AAClB,QAAAC,SAAQ,KAAK,MAAOA,MAAM;AAC1B,QAAAC,UAAS,KAAK,MAAOA,OAAO;AAC5B,cAAM,iBAAiBH,OAAM,KAAKC,OAAM;AACxC,YAAI,QAAQ,MAAM,kBAAkB;AACpC,YAAI,QAAQ,MAAM,YAAY,iBAC3B,OACA,eAAgBD,EAAE,MAAOC,EAAE;AAC9B,YAAI,QAAQ,MAAM,QAAQ,iBACvB,OACA,GAAIC,MAAM;AACb,YAAI,QAAQ,MAAM,SAAS,iBACxB,OACA,GAAIC,OAAO;AAAA,MACf;AAAA,IACD,CAAE;AAEF,QAAI,QAAQ,MAAM,YAAY;AAC9B,UAAM,cAAc,IAAI,QAAQ,sBAAsB;AAEtD,UAAM,IAAI,KAAK,MAAO,SAAS,OAAO,YAAY,IAAK;AACvD,UAAM,IAAI,KAAK,MAAO,SAAS,MAAM,YAAY,GAAI;AACrD,UAAM,QAAQ,YAAY;AAC1B,UAAM,SAAS,YAAY;AAE3B,eAAW,MAAO;AAAA,MACjB,GAAG;AAAA,MACH,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA,MAAM,EAAE,GAAG,GAAG,OAAO,SAAS,OAAO,QAAQ,SAAS,OAAO;AAAA,IAC9D,CAAE;AAEF,WAAO,MAAM;AACZ,iBAAW,KAAK;AAChB,iBAAW,IAAK;AAAA,QACf,GAAG;AAAA,QACH,GAAG;AAAA,QACH,OAAO,SAAS;AAAA,QAChB,QAAQ,SAAS;AAAA,MAClB,CAAE;AAAA,IACH;AAAA,EACD,GAAG,CAAE,UAAU,QAAS,CAAE;AAE1B,SAAO;AACR;AAEA,IAAO,oBAAQ;",
  "names": ["x", "y", "width", "height"]
}