{"version":3,"file":"rockButton.obs.js","sources":["../../../Framework/Controls/rockButton.obs"],"sourcesContent":["<!-- Copyright by the Spark Development Network; Licensed under the Rock Community License -->\r\n<template>\r\n    <button :class=\"cssClass\" :disabled=\"isButtonDisabled\" @click=\"onButtonClick\" :type=\"type\">\r\n        <template v-if=\"isButtonLoading\">\r\n            {{ loadingText }}\r\n        </template>\r\n        <slot v-else />\r\n    </button>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\n    import { computed, PropType, ref } from \"vue\";\r\n    import { isPromise } from \"@Obsidian/Utility/promiseUtils\";\r\n    import { LiteralUnion } from \"@Obsidian/Types/Utility/support\";\r\n    import { BtnType } from \"@Obsidian/Enums/Controls/btnType\";\r\n    import { BtnSize } from \"@Obsidian/Enums/Controls/btnSize\";\r\n\r\n    const props = defineProps({\r\n        isLoading: {\r\n            type: Boolean as PropType<boolean>,\r\n            default: false\r\n        },\r\n        loadingText: {\r\n            type: String as PropType<string>,\r\n            default: \"Loading...\"\r\n        },\r\n        type: {\r\n            type: String as PropType<\"button\" | \"submit\" | \"reset\">,\r\n            default: \"button\"\r\n        },\r\n        disabled: {\r\n            type: Boolean as PropType<boolean>,\r\n            default: false\r\n        },\r\n        btnType: {\r\n            type: String as PropType<LiteralUnion<BtnType>>,\r\n            default: BtnType.Default\r\n        },\r\n        btnSize: {\r\n            type: String as PropType<BtnSize>,\r\n            default: BtnSize.Default\r\n        },\r\n        autoLoading: {\r\n            type: Boolean as PropType<boolean>,\r\n            default: false\r\n        },\r\n\r\n        /**\r\n         * Automatically disables the button when it is in a loading state or\r\n         * the click handler is processing. This can prevent duplicate clicks.\r\n         */\r\n        autoDisable: {\r\n            type: Boolean as PropType<boolean>,\r\n            default: false\r\n        },\r\n\r\n        onClick: {\r\n            type: Function as PropType<((event: MouseEvent) => void | PromiseLike<void>)>,\r\n            required: false\r\n        },\r\n\r\n        /** Change button proportions to make it a square. Used for buttons with only an icon. */\r\n        isSquare: {\r\n            type: Boolean as PropType<boolean>,\r\n            default: false\r\n        }\r\n    });\r\n\r\n    const isProcessing = ref(false);\r\n\r\n    const isButtonDisabled = computed((): boolean => {\r\n        return props.disabled || (props.autoDisable && isProcessing.value) || props.isLoading;\r\n    });\r\n\r\n    const isButtonLoading = computed((): boolean => {\r\n        return props.isLoading || (props.autoLoading && isProcessing.value);\r\n    });\r\n\r\n    const typeClass = computed((): string => {\r\n        return `btn-${props.btnType}`;\r\n    });\r\n\r\n    const sizeClass = computed((): string => {\r\n        if (!props.btnSize) {\r\n            return \"\";\r\n        }\r\n\r\n        return `btn-${props.btnSize}`;\r\n    });\r\n\r\n    const cssClass = computed((): string => {\r\n        return `btn ${typeClass.value} ${sizeClass.value} ${props.isSquare ? \"btn-square\" : \"\"}`;\r\n    });\r\n\r\n    const onButtonClick = async (event: MouseEvent): Promise<void> => {\r\n        if (isButtonDisabled.value || isButtonLoading.value) {\r\n            return;\r\n        }\r\n\r\n        isProcessing.value = true;\r\n\r\n        try {\r\n            const clickHandler = props.onClick;\r\n\r\n            if (clickHandler) {\r\n                const result = clickHandler(event);\r\n\r\n                if (isPromise(result)) {\r\n                    await result;\r\n                }\r\n            }\r\n        }\r\n        finally {\r\n            isProcessing.value = false;\r\n        }\r\n    };\r\n</script>\r\n"],"names":["isProcessing","ref","isButtonDisabled","computed","props","disabled","autoDisable","value","isLoading","isButtonLoading","autoLoading","typeClass","concat","btnType","sizeClass","btnSize","cssClass","isSquare","onButtonClick","_ref","_asyncToGenerator","event","clickHandler","onClick","result","isPromise","_x","apply","arguments"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAoEI,IAAA,IAAMA,YAAY,GAAGC,GAAG,CAAC,KAAK,CAAC,CAAA;MAE/B,IAAA,IAAMC,gBAAgB,GAAGC,QAAQ,CAAC,MAAe;MAC7C,MAAA,OAAOC,KAAK,CAACC,QAAQ,IAAKD,KAAK,CAACE,WAAW,IAAIN,YAAY,CAACO,KAAM,IAAIH,KAAK,CAACI,SAAS,CAAA;MACzF,KAAC,CAAC,CAAA;MAEF,IAAA,IAAMC,eAAe,GAAGN,QAAQ,CAAC,MAAe;YAC5C,OAAOC,KAAK,CAACI,SAAS,IAAKJ,KAAK,CAACM,WAAW,IAAIV,YAAY,CAACO,KAAM,CAAA;MACvE,KAAC,CAAC,CAAA;MAEF,IAAA,IAAMI,SAAS,GAAGR,QAAQ,CAAC,MAAc;MACrC,MAAA,OAAA,MAAA,CAAAS,MAAA,CAAcR,KAAK,CAACS,OAAO,CAAA,CAAA;MAC/B,KAAC,CAAC,CAAA;MAEF,IAAA,IAAMC,SAAS,GAAGX,QAAQ,CAAC,MAAc;MACrC,MAAA,IAAI,CAACC,KAAK,CAACW,OAAO,EAAE;MAChB,QAAA,OAAO,EAAE,CAAA;MACb,OAAA;MAEA,MAAA,OAAA,MAAA,CAAAH,MAAA,CAAcR,KAAK,CAACW,OAAO,CAAA,CAAA;MAC/B,KAAC,CAAC,CAAA;MAEF,IAAA,IAAMC,QAAQ,GAAGb,QAAQ,CAAC,MAAc;YACpC,OAAAS,MAAAA,CAAAA,MAAA,CAAcD,SAAS,CAACJ,KAAK,EAAAK,GAAAA,CAAAA,CAAAA,MAAA,CAAIE,SAAS,CAACP,KAAK,EAAAK,GAAAA,CAAAA,CAAAA,MAAA,CAAIR,KAAK,CAACa,QAAQ,GAAG,YAAY,GAAG,EAAE,CAAA,CAAA;MAC1F,KAAC,CAAC,CAAA;MAEF,IAAA,IAAMC,aAAa,GAAA,YAAA;MAAA,MAAA,IAAAC,IAAA,GAAAC,iBAAA,CAAG,WAAOC,KAAiB,EAAoB;MAC9D,QAAA,IAAInB,gBAAgB,CAACK,KAAK,IAAIE,eAAe,CAACF,KAAK,EAAE;MACjD,UAAA,OAAA;MACJ,SAAA;cAEAP,YAAY,CAACO,KAAK,GAAG,IAAI,CAAA;cAEzB,IAAI;MACA,UAAA,IAAMe,YAAY,GAAGlB,KAAK,CAACmB,OAAO,CAAA;MAElC,UAAA,IAAID,YAAY,EAAE;MACd,YAAA,IAAME,MAAM,GAAGF,YAAY,CAACD,KAAK,CAAC,CAAA;MAElC,YAAA,IAAII,SAAS,CAACD,MAAM,CAAC,EAAE;MACnB,cAAA,MAAMA,MAAM,CAAA;MAChB,aAAA;MACJ,WAAA;MACJ,SAAC,SACO;gBACJxB,YAAY,CAACO,KAAK,GAAG,KAAK,CAAA;MAC9B,SAAA;aACH,CAAA,CAAA;YAAA,OArBKW,SAAAA,aAAaA,CAAAQ,EAAA,EAAA;MAAA,QAAA,OAAAP,IAAA,CAAAQ,KAAA,CAAA,IAAA,EAAAC,SAAA,CAAA,CAAA;MAAA,OAAA,CAAA;WAqBlB,EAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;"}