{"version":3,"file":"progressTracker.obs.js","sources":["../../../Framework/Controls/progressTracker.obs"],"sourcesContent":["<!-- Copyright by the Spark Development Network; Licensed under the Rock Community License -->\n<template>\n    <nav class=\"progress-tracker d-none d-md-flex\" style=\"margin: 20px auto; max-width: 1200px; width:100%\">\n        <div :id=\"progressTrackerContainerElementId\" class=\"progress-tracker-container\">\n            <ul :id=\"progressTrackerElementId\" class=\"progress-steps\">\n                <template v-for=\"(item, index) in items\" :key=\"item.key\">\n                    <li v-if=\"isCollapsed(index)\" class=\"progress-step progress-tracker-more\">\n                        <div class=\"progress-step-link\">\n                            <i class=\"fas fa-ellipsis-v\"></i>\n                        </div>\n                        <div class=\"progress-tracker-arrow\">\n                            <svg viewBox=\"0 0 22 80\" fill=\"none\" preserveAspectRatio=\"none\">\n                                <path d=\"M0 -2L20 40L0 82\" vector-effect=\"non-scaling-stroke\" stroke=\"currentcolor\" stroke-linejoin=\"round\" />\n                            </svg>\n                        </div>\n                    </li>\n                    <ProgressTrackerSegment\n                                            v-else\n                                            :item=\"item\"\n                                            :isPast=\"index < currentIndex\"\n                                            :isPresent=\"index === currentIndex\"\n                                            :isFuture=\"index > currentIndex\"\n                                            :isLast=\"index === lastIndex\" />\n                </template>\n            </ul>\n        </div>\n        <slot name=\"aside\" />\n    </nav>\n</template>\n\n<script setup lang=\"ts\">\n    import ProgressTrackerSegment from \"./progressTrackerSegment.obs\";\n    import { computed, nextTick, PropType, ref, watch } from \"vue\";\n    import { newGuid } from \"@Obsidian/Utility/guid\";\n    import { ProgressTrackerItem } from \"@Obsidian/Types/Controls/progressTracker\";\n\n\n    const props = defineProps({\n        currentIndex: {\n            type: Number as PropType<number>,\n            required: true\n        },\n        items: {\n            type: Array as PropType<ProgressTrackerItem[]>,\n            required: true\n        }\n    });\n\n    const guid = newGuid();\n    /** The element id of the progress tracker (child) */\n    const progressTrackerElementId = `progress-tracker-${guid}`;\n    /** The element id of the progress tracker container (parent) */\n    const progressTrackerContainerElementId = `progress-tracker-container-${guid}`;\n    const collapsedIndexes = ref<number[]>([]);\n\n    /** Is the given index collapsed? */\n    function isCollapsed(index: number): boolean {\n        return collapsedIndexes.value.indexOf(index) !== -1;\n    }\n\n    /** A list of indexes that should not be collapsed. These are not guaranteed to be valid or unique\n     *  indexes, but rather a collection to check existance before collapsing a particular index. */\n    const doNotCollapseIndexes = computed((): number[] => {\n        return [0, props.currentIndex - 1, props.currentIndex, props.currentIndex + 1, lastIndex.value];\n\n    });\n\n    /** The last index of the items (prop) */\n    const lastIndex = computed((): number => {\n        return props.items.length - 1;\n    });\n\n    /** Expand all items and then collapse some to fit if needed */\n    function expandAndCollapseItemsBecauseOfWidth(): void {\n        collapsedIndexes.value = [];\n        nextTick(() => collapseItemsBecauseOfWidth());\n    }\n\n    /** Collapse some items if needed to make fit */\n    function collapseItemsBecauseOfWidth(): void {\n        // Using the DOM query getElementById because Vue refs were not conveying the changing width\n        const progressTracker = document.getElementById(progressTrackerElementId);\n        const progressTrackerContainer = document.getElementById(progressTrackerContainerElementId);\n\n        const containerWidth = progressTrackerContainer?.clientWidth;\n        const childWidth = progressTracker?.scrollWidth;\n\n        if (!containerWidth || !childWidth || childWidth <= containerWidth) {\n            return;\n        }\n\n        // Collapse the furthest away index that can be collapsed\n        const midPoint = lastIndex.value / 2;\n\n        if (props.currentIndex > midPoint) {\n            for (let i = 0; i <= lastIndex.value; i++) {\n                if (doNotCollapseIndexes.value.indexOf(i) !== -1) {\n                    continue;\n                }\n\n                if (isCollapsed(i)) {\n                    continue;\n                }\n\n                // After collapsing the first index that can be, then wait for the DOM to update (nexttick) and\n                // collapse more if needed\n                collapsedIndexes.value.push(i);\n                nextTick(() => collapseItemsBecauseOfWidth());\n                return;\n            }\n        }\n        else {\n            for (let i = lastIndex.value; i >= 0; i--) {\n                if (doNotCollapseIndexes.value.indexOf(i) !== -1) {\n                    continue;\n                }\n\n                if (isCollapsed(i)) {\n                    continue;\n                }\n\n                // After collapsing the first index that can be, then wait for the DOM to update (nexttick) and\n                // collapse more if needed\n                collapsedIndexes.value.push(i);\n                nextTick(() => collapseItemsBecauseOfWidth());\n                return;\n            }\n        }\n    }\n\n    watch(() => props.currentIndex, () => {\n        expandAndCollapseItemsBecauseOfWidth();\n    }, { immediate: true });\n</script>\n"],"names":["guid","newGuid","progressTrackerElementId","concat","progressTrackerContainerElementId","collapsedIndexes","ref","isCollapsed","index","value","indexOf","doNotCollapseIndexes","computed","props","currentIndex","lastIndex","items","length","expandAndCollapseItemsBecauseOfWidth","nextTick","collapseItemsBecauseOfWidth","progressTracker","document","getElementById","progressTrackerContainer","containerWidth","clientWidth","childWidth","scrollWidth","midPoint","i","push","watch","immediate"],"mappings":"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"}