import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, unref, normalizeStyle } from "vue";
import "../../adapter-vue.mjs";
import { isPC, isApp } from "../../utils/env.mjs";
const _hoisted_1 = ["src"];
const _hoisted_2 = ["src"];
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "Icon",
  props: {
    file: { default: "" },
    size: {},
    width: { default: "20px" },
    height: { default: "20px" },
    hotAreaSize: {}
  },
  emits: ["onClick"],
  setup(__props, { emit: __emit }) {
    const emits = __emit;
    const props = __props;
    const iconHotAreaSize = computed(() => {
      if (!props.hotAreaSize) {
        return void 0;
      }
      if (isNaN(Number(props.hotAreaSize))) {
        return String(props.hotAreaSize);
      }
      return `${props.hotAreaSize}px`;
    });
    const iconWidth = computed(() => {
      return props.size ? props.size : props.width;
    });
    const iconHeight = computed(() => {
      return props.size ? props.size : props.height;
    });
    const handleImgClick = (e) => {
      emits("onClick", e);
    };
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", {
        class: normalizeClass(["common-icon-container", !unref(isPC) && "common-icon-container-mobile"]),
        style: normalizeStyle({
          padding: unref(iconHotAreaSize)
        }),
        onClick: handleImgClick
      }, [
        unref(isApp) ? (openBlock(), createElementBlock("image", {
          key: 0,
          class: "common-icon",
          src: props.file,
          style: normalizeStyle({ width: unref(iconWidth), height: unref(iconHeight) })
        }, null, 12, _hoisted_1)) : (openBlock(), createElementBlock("img", {
          key: 1,
          class: "common-icon",
          src: props.file,
          style: normalizeStyle({ width: unref(iconWidth), height: unref(iconHeight) })
        }, null, 12, _hoisted_2))
      ], 6);
    };
  }
});
export {
  _sfc_main as default
};
