{"version":3,"file":"MathEquation.vue.mjs","sources":["../../src/vue/MathEquation.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"containerComponent\"\n    :class=\"containerClass\"\n    :style=\"containerStyle\"\n    v-html=\"htmlContent\"\n  />\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed, watch } from \"vue\";\nimport { renderMath } from \"../core/renderMaths\";\n\nexport default defineComponent({\n  name: \"MathEquation\",\n  emits: [\"error\"],\n  props: {\n    equation: {\n      type: String,\n      required: true,\n    },\n    displayMode: {\n      type: Boolean,\n      default: false,\n    },\n    className: {\n      type: String,\n      default: \"\",\n    },\n    style: {\n      type: Object,\n      default: () => ({}),\n    },\n    katexOptions: {\n      type: Object,\n      default: () => ({}),\n    },\n    as: {\n      type: String,\n      default: null,\n      validator: (value: string) => [\"div\", \"span\", \"p\"].includes(value),\n    },\n  },\n  setup(props, { emit }) {\n    const containerComponent = computed(() => {\n      if (props.as) return props.as;\n      return props.displayMode ? \"div\" : \"span\";\n    });\n\n    const containerClass = computed(() => {\n      return {\n        \"mathsnap-equation\": true,\n        \"mathsnap-display\": props.displayMode,\n        \"mathsnap-inline\": !props.displayMode,\n        [props.className]: Boolean(props.className),\n      };\n    });\n\n    const containerStyle = computed(() => {\n      return {\n        maxWidth: \"100%\",\n        overflowX: \"auto\",\n        display: props.displayMode ? \"block\" : \"inline-block\",\n        ...props.style,\n      };\n    });\n\n    const renderResult = computed(() =>\n      renderMath({\n        equation: props.equation,\n        displayMode: props.displayMode,\n        katexOptions: props.katexOptions,\n      })\n    );\n\n    watch(\n      () => renderResult.value.error.message,\n      (message, previousMessage) => {\n        if (renderResult.value.error.hasError && message !== previousMessage) {\n          emit(\"error\", new Error(message));\n        }\n      }\n    );\n\n    return {\n      htmlContent: computed(() => renderResult.value.html),\n      hasError: computed(() => renderResult.value.error.hasError),\n      errorMessage: computed(() => renderResult.value.error.message),\n      containerComponent,\n      containerClass,\n      containerStyle,\n    };\n  },\n});\n</script>\n\n<style>\n.mathsnap-display {\n  margin: 1em 0;\n}\n</style>\n"],"names":["_sfc_render","_ctx","containerClass","$data","$options","_openBlock","containerStyle","htmlContent","_normalizeStyle"],"mappings":";;;;AAGU,SAAAA,EAHVC,GAGYC,GAAAA,GAAAA,GAAcC,GAAAC,GAAA;AAChB,SAAAC,EAAA,KAAEC,EAAcL,EAAA,kBAAA,GAAA;AAAA,IACtB,SAAQM,EAAW,cAAA;AAAA,IAAA,OAAAC,EAAAP,EAAA,cAAA;AAAA;;;;"}