{"version":3,"file":"dropDownMenu.obs.js","sources":["../../../Framework/Controls/dropDownMenu.obs","../../../node_modules/style-inject/dist/style-inject.es.js"],"sourcesContent":["<!-- Copyright by the Spark Development Network; Licensed under the Rock Community License -->\r\n<template>\r\n    <div ref=\"dropdownElement\" class=\"dropdown\" :class=\"additionalDropDownClasses\">\r\n        <button class=\"btn btn-link btn-overflow\" type=\"button\" @click.prevent=\"onDropDownClick\">\r\n            <slot>\r\n                <i class=\"fa fa-ellipsis-v\"></i>\r\n            </slot>\r\n        </button>\r\n\r\n        <ul class=\"dropdown-menu\" :class=\"additionalDropDownMenuClasses\">\r\n            <li v-for=\"action in items\" :class=\"getActionItemClasses(action)\">\r\n                <button type=\"button\" :class=\"getActionButtonClasses(action)\" @click.prevent.stop=\"onActionClick(action, $event)\">\r\n                    <i v-if=\"action.iconCssClass\" :class=\"action.iconCssClass\"></i>\r\n                    <i v-else-if=\"hasAnyIcons\"></i>\r\n                    {{ action.title }}\r\n                </button>\r\n            </li>\r\n        </ul>\r\n    </div>\r\n</template>\r\n\r\n<style scoped>\r\nli > button > i {\r\n    display: inline-block;\r\n    width: 1.25em;\r\n    text-align: center;\r\n}\r\n\r\nli.disabled > button {\r\n    opacity: 0.5;\r\n    cursor: not-allowed;\r\n}\r\n</style>\r\n\r\n<script setup lang=\"ts\">\r\n    import { isPromise } from \"@Obsidian/Utility/promiseUtils\";\r\n    import { computed, PropType, ref, watch } from \"vue\";\r\n    import { MenuAction } from \"@Obsidian/Types/Controls/dropDownMenu\";\r\n\r\n    const props = defineProps({\r\n        /**\r\n         * The items that will be listed in the dropdown menu.\r\n         */\r\n        items: {\r\n            type: Array as PropType<MenuAction[]>,\r\n            required: true\r\n        },\r\n\r\n        /**\r\n         * Whether to align the dropdown to the left edge or the right\r\n         * edge of the anchor.\r\n         */\r\n        align: {\r\n            type: String as PropType<\"left\" | \"right\">,\r\n            default: \"left\"\r\n        }\r\n    });\r\n\r\n    // #region Values\r\n\r\n    const isDropDownOpen = ref(false);\r\n    const dropdownElement = ref<HTMLElement>();\r\n\r\n    // #endregion\r\n\r\n    // #region Computed Values\r\n\r\n    const hasAnyIcons = computed((): boolean => {\r\n        return props.items.some(i => !!i.iconCssClass);\r\n    });\r\n\r\n    /** Additional classes to be applied to the drop down container. */\r\n    const additionalDropDownClasses = computed((): string => {\r\n        return isDropDownOpen.value ? \"open\" : \"\";\r\n    });\r\n\r\n    /** Additional classes to be applied to the drop down menu. */\r\n    const additionalDropDownMenuClasses = computed((): string => {\r\n        return `dropdown-menu-${props.align}`;\r\n    });\r\n\r\n    // #endregion\r\n\r\n    // #region Functions\r\n\r\n    /** Gets the classes to be applied to the specified action. */\r\n    function getActionButtonClasses(action: MenuAction): string {\r\n        let classes = \"btn-link\";\r\n\r\n        if (action.type === \"danger\") {\r\n            classes += \" dropdown-item-danger\";\r\n        }\r\n\r\n        if (action.actionCssClass) {\r\n            classes += ` ${action.actionCssClass}`;\r\n        }\r\n\r\n        return classes;\r\n    }\r\n\r\n    /** Gets the classes to be applied to the action item. */\r\n    function getActionItemClasses(action: MenuAction): string {\r\n        return action.disabled ? \"disabled\" : \"\";\r\n    }\r\n\r\n    // #endregion\r\n\r\n    // #region Event Handlers\r\n\r\n    /**\r\n     * Event handler for when the drop down anchor element has been clicked.\r\n     */\r\n    function onDropDownClick(): void {\r\n        isDropDownOpen.value = true;\r\n    }\r\n\r\n    /**\r\n     * Event handler for when an action is clicked.\r\n     */\r\n    async function onActionClick(action: MenuAction, event: Event): Promise<void> {\r\n        if (action.disabled) {\r\n            return;\r\n        }\r\n\r\n        if (action.handler) {\r\n            const result = action.handler(event);\r\n\r\n            if (isPromise(result)) {\r\n                await result;\r\n            }\r\n        }\r\n\r\n        isDropDownOpen.value = false;\r\n    }\r\n\r\n    /**\r\n     * Event handler for when the mouse is pressed down somewhere in the\r\n     * document.\r\n     *\r\n     * @param event The current event.\r\n     */\r\n    function onDocumentMouseDown(event: MouseEvent): void {\r\n        if (event.target instanceof HTMLElement && dropdownElement.value?.contains(event.target) !== true) {\r\n            isDropDownOpen.value = false;\r\n        }\r\n    }\r\n\r\n    // #endregion\r\n\r\n    // Watch for the drop down being opened or closed and add/remove the\r\n    // event handler for detecting clicks outside the dropdown.\r\n    watch(isDropDownOpen, () => {\r\n        if (isDropDownOpen.value) {\r\n            document.addEventListener(\"mousedown\", onDocumentMouseDown);\r\n        }\r\n        else {\r\n            document.removeEventListener(\"mousedown\", onDocumentMouseDown);\r\n        }\r\n    });\r\n</script>\r\n","function styleInject(css, ref) {\n  if ( ref === void 0 ) ref = {};\n  var insertAt = ref.insertAt;\n\n  if (!css || typeof document === 'undefined') { return; }\n\n  var head = document.head || document.getElementsByTagName('head')[0];\n  var style = document.createElement('style');\n  style.type = 'text/css';\n\n  if (insertAt === 'top') {\n    if (head.firstChild) {\n      head.insertBefore(style, head.firstChild);\n    } else {\n      head.appendChild(style);\n    }\n  } else {\n    head.appendChild(style);\n  }\n\n  if (style.styleSheet) {\n    style.styleSheet.cssText = css;\n  } else {\n    style.appendChild(document.createTextNode(css));\n  }\n}\n\nexport default styleInject;\n"],"names":["isDropDownOpen","ref","dropdownElement","hasAnyIcons","computed","props","items","some","i","iconCssClass","additionalDropDownClasses","value","additionalDropDownMenuClasses","concat","align","getActionButtonClasses","action","classes","type","actionCssClass","getActionItemClasses","disabled","onDropDownClick","onActionClick","_x","_x2","_onActionClick","apply","arguments","_asyncToGenerator","event","handler","result","isPromise","onDocumentMouseDown","_dropdownElement$valu","target","HTMLElement","contains","watch","document","addEventListener","removeEventListener","styleInject","css","insertAt","head","getElementsByTagName","style","createElement","firstChild","insertBefore","appendChild","styleSheet","cssText","createTextNode"],"mappings":"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"}