{"version":3,"file":"rockSuspense.js","sources":["../../../Framework/Controls/rockSuspense.ts"],"sourcesContent":["// <copyright>\r\n// Copyright by the Spark Development Network\r\n//\r\n// Licensed under the Rock Community License (the \"License\");\r\n// you may not use this file except in compliance with the License.\r\n// You may obtain a copy of the License at\r\n//\r\n// http://www.rockrms.com/license\r\n//\r\n// Unless required by applicable law or agreed to in writing, software\r\n// distributed under the License is distributed on an \"AS IS\" BASIS,\r\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r\n// See the License for the specific language governing permissions and\r\n// limitations under the License.\r\n// </copyright>\r\n//\r\n\r\nimport { defineComponent, PropType, computed, ref, onMounted } from \"vue\";\r\nimport { BasicSuspenseProvider, provideSuspense, useSuspense } from \"@Obsidian/Utility/suspense\";\r\n\r\n/**\r\n * Prevents the content from displaying until all asynchronous events have completed.\r\n *\r\n * Emits a \"timeout\" event if the timeout is reached which caused the content to\r\n * display.\r\n *\r\n * Emits a \"loaded\" event if the content successfully loaded and was displayed.\r\n *\r\n * Emits a \"ready\" event any time the content is displayed, whether from timeout or loaded.\r\n */\r\nexport default defineComponent({\r\n    name: \"RockSuspense\",\r\n\r\n    props: {\r\n        delay: {\r\n            type: Number as PropType<number>,\r\n            default: 500\r\n        },\r\n\r\n        timeout: {\r\n            type: Number as PropType<number>,\r\n            default: 5000\r\n        }\r\n    },\r\n\r\n    emits: {\r\n        loaded: () => true,\r\n        ready: () => true,\r\n        timeout: () => true\r\n    },\r\n\r\n    setup(props, { emit }) {\r\n        const isContentLoaded = ref(false);\r\n        const hasDelayElapsed = ref(false);\r\n        const hasTimeoutElapsed = ref(false);\r\n\r\n        const parentSuspense = useSuspense();\r\n        const suspense = new BasicSuspenseProvider(parentSuspense);\r\n        provideSuspense(suspense);\r\n\r\n        const isContentVisible = computed((): boolean => isContentLoaded.value || hasTimeoutElapsed.value);\r\n        const isLoadingVisible = computed((): boolean => !isContentVisible.value && hasDelayElapsed.value);\r\n\r\n        // Start timer that triggers when the delay has elapsed so we can show\r\n        // the loading content after a brief delay.\r\n        setTimeout(() => hasDelayElapsed.value = true, props.delay);\r\n\r\n        // Start timer that triggers when the timeout has elapsed so we can show\r\n        // the content even if it hasn't fully loaded yet.\r\n        setTimeout(() => {\r\n            hasTimeoutElapsed.value = true;\r\n            emit(\"timeout\");\r\n            emit(\"ready\");\r\n        }, props.timeout);\r\n\r\n        // Wait until we are mounted. This indicates that all child components\r\n        // have been initialized and would have submitted their pending operations\r\n        // to the provider already.\r\n        onMounted(() => {\r\n            if (!suspense.hasPendingOperations()) {\r\n                isContentLoaded.value = true;\r\n                emit(\"loaded\");\r\n                emit(\"ready\");\r\n            }\r\n            else {\r\n                suspense.addFinishedHandler(() => {\r\n                    isContentLoaded.value = true;\r\n                    emit(\"loaded\");\r\n                    emit(\"ready\");\r\n                });\r\n            }\r\n        });\r\n\r\n        return {\r\n            isContentVisible,\r\n            isLoadingVisible\r\n        };\r\n    },\r\n\r\n    template: `\r\n<div v-show=\"isContentVisible\">\r\n    <slot />\r\n</div>\r\n\r\n<template v-if=\"isLoadingVisible\">\r\n    <slot name=\"loading\" />\r\n</template>\r\n`\r\n});\r\n"],"names":["defineComponent","name","props","delay","type","Number","default","timeout","emits","loaded","ready","setup","_ref","emit","isContentLoaded","ref","hasDelayElapsed","hasTimeoutElapsed","parentSuspense","useSuspense","suspense","BasicSuspenseProvider","provideSuspense","isContentVisible","computed","value","isLoadingVisible","setTimeout","onMounted","hasPendingOperations","addFinishedHandler","template"],"mappings":";;;;;;;;;;;;;;;;AA8BA,kDAAeA,eAAe,CAAC;YAC3BC,EAAAA,IAAI,EAAE,cAAc;YAEpBC,EAAAA,KAAK,EAAE;YACHC,IAAAA,KAAK,EAAE;YACHC,MAAAA,IAAI,EAAEC,MAA0B;YAChCC,MAAAA,OAAO,EAAE,GAAA;iBACZ;YAEDC,IAAAA,OAAO,EAAE;YACLH,MAAAA,IAAI,EAAEC,MAA0B;YAChCC,MAAAA,OAAO,EAAE,IAAA;YACb,KAAA;eACH;YAEDE,EAAAA,KAAK,EAAE;gBACHC,MAAM,EAAEA,MAAM,IAAI;gBAClBC,KAAK,EAAEA,MAAM,IAAI;gBACjBH,OAAO,EAAEA,MAAM,IAAA;eAClB;YAEDI,EAAAA,KAAKA,CAACT,KAAK,EAAAU,IAAA,EAAY;YAAA,IAAA,IAARC,IAAI,GAAAD,IAAA,CAAJC,IAAI,CAAA;YACf,IAAA,IAAMC,eAAe,GAAGC,GAAG,CAAC,KAAK,CAAC,CAAA;YAClC,IAAA,IAAMC,eAAe,GAAGD,GAAG,CAAC,KAAK,CAAC,CAAA;YAClC,IAAA,IAAME,iBAAiB,GAAGF,GAAG,CAAC,KAAK,CAAC,CAAA;gBAEpC,IAAMG,cAAc,GAAGC,WAAW,EAAE,CAAA;YACpC,IAAA,IAAMC,QAAQ,GAAG,IAAIC,qBAAqB,CAACH,cAAc,CAAC,CAAA;gBAC1DI,eAAe,CAACF,QAAQ,CAAC,CAAA;YAEzB,IAAA,IAAMG,gBAAgB,GAAGC,QAAQ,CAAC,MAAeV,eAAe,CAACW,KAAK,IAAIR,iBAAiB,CAACQ,KAAK,CAAC,CAAA;YAClG,IAAA,IAAMC,gBAAgB,GAAGF,QAAQ,CAAC,MAAe,CAACD,gBAAgB,CAACE,KAAK,IAAIT,eAAe,CAACS,KAAK,CAAC,CAAA;gBAIlGE,UAAU,CAAC,MAAMX,eAAe,CAACS,KAAK,GAAG,IAAI,EAAEvB,KAAK,CAACC,KAAK,CAAC,CAAA;YAI3DwB,IAAAA,UAAU,CAAC,MAAM;kBACbV,iBAAiB,CAACQ,KAAK,GAAG,IAAI,CAAA;kBAC9BZ,IAAI,CAAC,SAAS,CAAC,CAAA;kBACfA,IAAI,CAAC,OAAO,CAAC,CAAA;YACjB,KAAC,EAAEX,KAAK,CAACK,OAAO,CAAC,CAAA;YAKjBqB,IAAAA,SAAS,CAAC,MAAM;YACZ,MAAA,IAAI,CAACR,QAAQ,CAACS,oBAAoB,EAAE,EAAE;oBAClCf,eAAe,CAACW,KAAK,GAAG,IAAI,CAAA;oBAC5BZ,IAAI,CAAC,QAAQ,CAAC,CAAA;oBACdA,IAAI,CAAC,OAAO,CAAC,CAAA;YACjB,OAAC,MACI;oBACDO,QAAQ,CAACU,kBAAkB,CAAC,MAAM;sBAC9BhB,eAAe,CAACW,KAAK,GAAG,IAAI,CAAA;sBAC5BZ,IAAI,CAAC,QAAQ,CAAC,CAAA;sBACdA,IAAI,CAAC,OAAO,CAAC,CAAA;YACjB,SAAC,CAAC,CAAA;YACN,OAAA;YACJ,KAAC,CAAC,CAAA;gBAEF,OAAO;kBACHU,gBAAgB;YAChBG,MAAAA,gBAAAA;iBACH,CAAA;eACJ;cAEDK,QAAQ,EAAA,iJAAA;YASZ,CAAC,EAAC;;;;;;;;"}