---
import StorySlotChildren from './StorySlotChildren.astro'

type SlotChild = {
  Component: (props: Record<string, unknown>) => unknown
  props?: Record<string, unknown>
  slot?: string
  slotIsHtml?: boolean
  children?: SlotChild[]
}

interface Props {
  Component: (props: Record<string, unknown>) => unknown
  slot?: string
  slotIsHtml?: boolean
  children?: SlotChild[]
  tooltipSlot?: string
  tooltipSlotIsHtml?: boolean
  before?: string
  beforeIsHtml?: boolean
  after?: string
  afterIsHtml?: boolean
  [key: string]: unknown
}

const {
  Component,
  slot = '',
  slotIsHtml = false,
  children = [],
  tooltipSlot,
  tooltipSlotIsHtml = false,
  before,
  beforeIsHtml = false,
  after,
  afterIsHtml = false,
  ...rest
} = Astro.props

---

{before &&
  (beforeIsHtml ? <Fragment set:html={before} /> : before)}
<Component {...rest}>
  {children.length > 0
    ? <StorySlotChildren items={children} />
    : slotIsHtml ? (
        <Fragment set:html={slot} />
      ) : (
        slot
      )}
  {tooltipSlot !== undefined && (
    <span slot="tooltip">
      {tooltipSlotIsHtml ? (
        <Fragment set:html={tooltipSlot ?? ''} />
      ) : (
        tooltipSlot
      )}
    </span>
  )}
</Component>
{after &&
  (afterIsHtml ? <Fragment set:html={after} /> : after)}
