{"version":3,"file":"ClassicLazy-7mFHxG6O.mjs","names":[],"sources":["../src/components/misc/ClassicLazy.vue","../src/components/misc/ClassicLazy.vue"],"sourcesContent":["<template>\n  <div ref=\"targetEl\" :style=\"`min-height:${minHeight}px;`\">\n    <slot v-if=\"shouldRender\" />\n    <slot v-else name=\"preview\" />\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { useIntersectionObserver } from \"@vueuse/core\";\nimport { ref, nextTick, watch, onMounted } from \"vue\";\n\n//Props\nconst props = defineProps({\n  renderOnIdle: Boolean,\n  unrender: Boolean,\n  minHeight: {type: Number,default: 0},\n  initRenderDelay: {type: Number, default: 0},\n  unrenderDelay: {type: Number,default: 10000},\n});\n\n//Emits\nconst emit = defineEmits([\"isRender\"]);\n\n//Data\nconst waitBeforeInit = ref(true);\nconst shouldRender = ref(false);\nconst targetEl = ref();\nlet unrenderTimer: ReturnType<typeof setTimeout> | undefined;\nlet renderTimer: ReturnType<typeof setTimeout> | undefined;\n\n//Composables\nconst { pause, resume } = useIntersectionObserver(\n  targetEl,\n  ([{ isIntersecting }]) => {\n    if (waitBeforeInit.value) {\n      return;\n    }\n    if (isIntersecting) {\n      // perhaps the user re-scrolled to a component that was set to unrender. In that case stop the unrendering timer\n      clearTimeout(unrenderTimer);\n\n      // if we're dealing underndering lets add a waiting period of 200ms before rendering. If a component enters the viewport and also leaves it within 200ms it will not render at all. This saves work and improves performance when user scrolls very fast\n      renderTimer = setTimeout(\n        () => {\n          shouldRender.value = true;\n          emit(\"isRender\", true);\n        },\n        props.unrender ? 200 : 0,\n      );\n\n      if (!props.unrender) {\n        pause();\n      }\n    } else if (props.unrender) {\n      // if the component was set to render, cancel that\n      clearTimeout(renderTimer);\n      unrenderTimer = setTimeout(() => {\n        shouldRender.value = false;\n        emit(\"isRender\", false);\n      }, props.unrenderDelay);\n    }\n  },\n  {\n    rootMargin: \"600px\",\n  },\n);\n\n//Logic\nonMounted(() => {\n  if (props.initRenderDelay <= 0) {\n    // If there's no render delay, do not delay initialization\n    waitBeforeInit.value = false;\n  } else {\n    // Otherwise delay initialization\n    setTimeout(() => {\n      waitBeforeInit.value = false;\n    }, props.initRenderDelay);\n  }\n\n  if (props.renderOnIdle) {\n    onIdle(() => {\n      shouldRender.value = true;\n      emit(\"isRender\", true);\n      if (!props.unrender) {\n        pause();\n      }\n    });\n  }\n});\n\n//Watch\nwatch(\n  () => props.unrender,\n  (newValue) => {\n    if (newValue) {\n      clearTimeout(renderTimer);\n      unrenderTimer = setTimeout(() => {\n        shouldRender.value = false;\n        emit(\"isRender\", false);\n        resume();\n      }, props.unrenderDelay);\n    }\n  },\n);\n\n//Methods\nfunction onIdle(cb = () => {}) {\n  if (\"requestIdleCallback\" in window) {\n    window.requestIdleCallback(cb);\n  } else {\n    setTimeout(() => {\n      nextTick(cb);\n    }, 300);\n  }\n}\n</script>\n","<template>\n  <div ref=\"targetEl\" :style=\"`min-height:${minHeight}px;`\">\n    <slot v-if=\"shouldRender\" />\n    <slot v-else name=\"preview\" />\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { useIntersectionObserver } from \"@vueuse/core\";\nimport { ref, nextTick, watch, onMounted } from \"vue\";\n\n//Props\nconst props = defineProps({\n  renderOnIdle: Boolean,\n  unrender: Boolean,\n  minHeight: {type: Number,default: 0},\n  initRenderDelay: {type: Number, default: 0},\n  unrenderDelay: {type: Number,default: 10000},\n});\n\n//Emits\nconst emit = defineEmits([\"isRender\"]);\n\n//Data\nconst waitBeforeInit = ref(true);\nconst shouldRender = ref(false);\nconst targetEl = ref();\nlet unrenderTimer: ReturnType<typeof setTimeout> | undefined;\nlet renderTimer: ReturnType<typeof setTimeout> | undefined;\n\n//Composables\nconst { pause, resume } = useIntersectionObserver(\n  targetEl,\n  ([{ isIntersecting }]) => {\n    if (waitBeforeInit.value) {\n      return;\n    }\n    if (isIntersecting) {\n      // perhaps the user re-scrolled to a component that was set to unrender. In that case stop the unrendering timer\n      clearTimeout(unrenderTimer);\n\n      // if we're dealing underndering lets add a waiting period of 200ms before rendering. If a component enters the viewport and also leaves it within 200ms it will not render at all. This saves work and improves performance when user scrolls very fast\n      renderTimer = setTimeout(\n        () => {\n          shouldRender.value = true;\n          emit(\"isRender\", true);\n        },\n        props.unrender ? 200 : 0,\n      );\n\n      if (!props.unrender) {\n        pause();\n      }\n    } else if (props.unrender) {\n      // if the component was set to render, cancel that\n      clearTimeout(renderTimer);\n      unrenderTimer = setTimeout(() => {\n        shouldRender.value = false;\n        emit(\"isRender\", false);\n      }, props.unrenderDelay);\n    }\n  },\n  {\n    rootMargin: \"600px\",\n  },\n);\n\n//Logic\nonMounted(() => {\n  if (props.initRenderDelay <= 0) {\n    // If there's no render delay, do not delay initialization\n    waitBeforeInit.value = false;\n  } else {\n    // Otherwise delay initialization\n    setTimeout(() => {\n      waitBeforeInit.value = false;\n    }, props.initRenderDelay);\n  }\n\n  if (props.renderOnIdle) {\n    onIdle(() => {\n      shouldRender.value = true;\n      emit(\"isRender\", true);\n      if (!props.unrender) {\n        pause();\n      }\n    });\n  }\n});\n\n//Watch\nwatch(\n  () => props.unrender,\n  (newValue) => {\n    if (newValue) {\n      clearTimeout(renderTimer);\n      unrenderTimer = setTimeout(() => {\n        shouldRender.value = false;\n        emit(\"isRender\", false);\n        resume();\n      }, props.unrenderDelay);\n    }\n  },\n);\n\n//Methods\nfunction onIdle(cb = () => {}) {\n  if (\"requestIdleCallback\" in window) {\n    window.requestIdleCallback(cb);\n  } else {\n    setTimeout(() => {\n      nextTick(cb);\n    }, 300);\n  }\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;EAYA,MAAM,QAAQ;EASd,MAAM,OAAO;EAGb,MAAM,iBAAiB,IAAI,IAAI;EAC/B,MAAM,eAAe,IAAI,KAAK;EAC9B,MAAM,WAAW,IAAI;EACrB,IAAI;EACJ,IAAI;EAGJ,MAAM,EAAE,OAAO,WAAW,wBACxB,WACC,CAAC,EAAE,sBAAsB;GACxB,IAAI,eAAe,OACjB;GAEF,IAAI,gBAAgB;IAElB,aAAa,aAAa;IAG1B,cAAc,iBACN;KACJ,aAAa,QAAQ;KACrB,KAAK,YAAY,IAAI;IACvB,GACA,MAAM,WAAW,MAAM,CACzB;IAEA,IAAI,CAAC,MAAM,UACT,MAAM;GAEV,OAAO,IAAI,MAAM,UAAU;IAEzB,aAAa,WAAW;IACxB,gBAAgB,iBAAiB;KAC/B,aAAa,QAAQ;KACrB,KAAK,YAAY,KAAK;IACxB,GAAG,MAAM,aAAa;GACxB;EACF,GACA,EACE,YAAY,QACd,CACF;EAGA,gBAAgB;GACd,IAAI,MAAM,mBAAmB,GAE3B,eAAe,QAAQ;QAGvB,iBAAiB;IACf,eAAe,QAAQ;GACzB,GAAG,MAAM,eAAe;GAG1B,IAAI,MAAM,cACR,aAAa;IACX,aAAa,QAAQ;IACrB,KAAK,YAAY,IAAI;IACrB,IAAI,CAAC,MAAM,UACT,MAAM;GAEV,CAAC;EAEL,CAAC;EAGD,YACQ,MAAM,WACX,aAAa;GACZ,IAAI,UAAU;IACZ,aAAa,WAAW;IACxB,gBAAgB,iBAAiB;KAC/B,aAAa,QAAQ;KACrB,KAAK,YAAY,KAAK;KACtB,OAAO;IACT,GAAG,MAAM,aAAa;GACxB;EACF,CACF;EAGA,SAAS,OAAO,WAAW,CAAC,GAAG;GAC7B,IAAI,yBAAyB,QAC3B,OAAO,oBAAoB,EAAE;QAE7B,iBAAiB;IACf,SAAS,EAAE;GACb,GAAG,GAAG;EAEV;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBCjHE,mBAGM,OAAA;EAHD,KAAI;EAAY,OAAK,eAAA,cAAgB,OAAA,UAAS,IAAA;KACrC,OAAA,eAAZ,WAA4B,KAAA,QAAA,WAAA,EAAA,KAAA,EAAA,CAAA,IAC5B,WAA8B,KAAA,QAAA,WAAA,EAAA,KAAA,EAAA,CAAA,CAAA,GAAA,CAAA"}