@mornya/react-image-libs/dist/SwapImage.js

The project of React.js Image library.

var n=this&&this.__read||function(e,a){var r="function"==typeof Symbol&&e[Symbol.iterator];if(!r)return e;var t,u,i=r.call(e),n=[];try{for(;(void 0===a||0<a--)&&!(t=i.next()).done;)n.push(t.value)}catch(e){u={error:e}}finally{try{t&&!t.done&&(r=i.return)&&r.call(i)}finally{if(u)throw u.error}}return n},e=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}},s=(Object.defineProperty(exports,"__esModule",{value:!0}),exports.SwapImage=void 0,require("react/jsx-runtime")),o=require("react"),l=e(require("classnames")),m=require("./LazyBackground"),c=require("./hooks");exports.SwapImage=function(e){var a=n((0,o.useState)(!1),2),r=a[0],t=a[1],a=(0,o.useMemo)(function(){return!e.subImagePath},[e.subImagePath]),u=(0,c.usePrev)(e.mainImagePath),i=(0,o.useCallback)(function(){return setTimeout(function(){return t(!0)},100)},[]);return(0,o.useEffect)(function(){e.mainImagePath!==u&&t(!1)},[e.mainImagePath,u]),e.mainImagePath?(0,s.jsxs)("div",{className:(0,l.default)("swap-image",{only:a}),children:[(0,s.jsx)(m.LazyBackground,{url:e.mainImagePath,title:e.title,loading:e.loading,error:e.error,className:(0,l.default)("img-area",{trigger:!r},e.className),style:e.style,onLoaded:r?void 0:i},e.mainImagePath),e.subImagePath&&r&&(0,s.jsx)(m.LazyBackground,{url:e.subImagePath,title:e.title,error:e.error,className:(0,l.default)("img-area",e.className),style:e.style},e.subImagePath)]}):null};