import { mergeProps } from 'zag-ripple';
import { trackSplit, track, untrack } from 'ripple';
import { splitPresenceProps } from './split-presence-props.ripple';
import { usePresence } from './use-presence.ripple';
import { ark } from '../factory';
import type { HTMLProps, MaybeTracked, PolymorphicProps } from '../../types';

export interface PresenceBaseProps extends PolymorphicProps<'div'> {}
export interface PresenceProps extends HTMLProps<'div'>, PresenceBaseProps {}

export component Presence(props: MaybeTracked<PresenceProps>) {
  const [presenceProps, localProps] = splitPresenceProps(props);

  const presence = usePresence(presenceProps);

  let mergedProps = track(() => mergeProps(@presence.getPresenceProps(), @localProps));

  if (!@presence.unmounted) {
    <ark.div
      data-scope="presence"
      data-part="root"
      {...@mergedProps}
      {ref (el: HTMLElement) => {
        @presence.setNode(el);
      }}
    >
      <props.children />
    </ark.div>
  }
}