// This file was generated by build-components.mjs
// ANY EDITS WILL BE OVERWRITTEN!

import {
  Thumbnail as PreactThumbnail,
  type ThumbnailProps,
} from '@uppy/components'
import { h as preactH, render as preactRender } from 'preact'
import { shallowEqualObjects } from 'shallow-equal'
import { defineComponent, h, onMounted, ref, watch } from 'vue'
import { useUppyContext } from '../useUppyContext.js'

export default defineComponent<Omit<ThumbnailProps, 'ctx'>>({
  name: 'Thumbnail',
  setup(props, { attrs }) {
    const containerRef = ref<HTMLElement | null>(null)
    const ctx = useUppyContext()

    function renderThumbnail() {
      if (containerRef.value) {
        preactRender(
          preactH(PreactThumbnail, {
            ...(attrs as ThumbnailProps),
            ctx,
          } satisfies ThumbnailProps),
          containerRef.value,
        )
      }
    }

    onMounted(() => {
      renderThumbnail()
    })

    watch(ctx, () => {
      renderThumbnail()
    })

    watch(
      () => props,
      (current, old) => {
        if (!shallowEqualObjects(current, old)) {
          renderThumbnail()
        }
      },
    )

    return () => h('div', { ref: containerRef })
  },
})
