<template>
  <a-popover placement="topRight" :overlay-class-name="$style.popover">
    <a-icon type="question-circle" title="" :class="$style.icon" />
    <template v-slot:content>
      <sd-form-item-help no-divider :html="html" />
    </template>
  </a-popover>
</template>

<script>
import components from './_import-components/sd-form-item-help-popover-import'

export default {
  name: 'SdFormItemHelpPopover',
  components,
  props: {
    html: {
      type: String,
      default: undefined,
    },
  },
  data() {
    return {}
  },
  methods: {},
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
@use "@/common/components/sd-web-print.scss" as print;
.popover {
  max-width: 400px;
}

.icon {
  color: $primary-color;
}
@include print.wrapper {
  .icon {
    display: none;
  }
}
</style>
