<script setup lang="ts">
import { resolveImageSource } from '../utils/resolve-image'

withDefaults(defineProps<{
  image?: string
  imageFit?: string
  imagePosition?: string
}>(), {
  imageFit: 'contain',
  imagePosition: 'center',
})
</script>

<template>
  <div class="slidev-layout easy-layout-image-split easy-image-right">
    <div class="easy-image-content"><slot /></div>
    <div class="easy-image-pane">
      <slot name="image">
        <img v-if="image" :src="resolveImageSource(image)" alt="" :style="{ objectFit: imageFit, objectPosition: imagePosition }">
      </slot>
    </div>
  </div>
</template>
