/**
 * `<Dialog.Trigger>` — opens the dialog on click.
 */

import { dynamic } from "@solidjs/web";
import { createEffect, createMemo, omit, onCleanup, untrack } from "solid-js";
import { useBaseUiId } from "../../internals/base-ui-id.jsx";
import { composeRefs, userRef } from "../../internals/compose-refs.jsx";
import { useClick } from "../../internals/floating-ui/hooks/use-click.jsx";
import { useInteractions } from "../../internals/floating-ui/hooks/use-interactions.jsx";
import { mergeRootProps } from "../../internals/merge-root-props.jsx";
import { resolveClassStyle } from "../../internals/resolve-class-style.jsx";
import { useButton } from "../../internals/use-button/use-button.jsx";
import { useDialogRootContext } from "../dialog-root-context.jsx";
/**
 * A button that opens the dialog. Renders a `<button>` by default.
 */
export function DialogTrigger(props) {
  const root = useDialogRootContext();
  const disabled = () => Boolean(props.disabled);
  const nativeButton = () => props.nativeButton ?? true;
  const generatedId = useBaseUiId();
  const resolvedId = () => props.id ?? generatedId;
  const click = useClick(root.floatingRootContext, {
    enabled: true
  });
  const localInteractions = useInteractions([click]);
  const {
    props: buttonProps,
    ref: buttonRef
  } = useButton({
    disabled,
    focusableWhenDisabled: () => false,
    native: nativeButton
  });
  const store = () => props.handle?.store ?? root.store;
  const isActive = createMemo(() => {
    const id = resolvedId();
    const active = root.activeTriggerId();
    return active === id || active === null;
  });
  const state = createMemo(() => ({
    disabled: disabled(),
    open: root.open() && isActive()
  }));
  let registeredId = null;
  let registeredElement = null;
  const setRef = el => untrack(() => {
    const id = resolvedId();
    const s = store();
    if (registeredId !== null && registeredElement !== null) {
      const current = s.context.triggerElements.getById(registeredId);
      if (current === registeredElement) {
        s.context.triggerElements.delete(registeredId);
      }
      registeredId = null;
      registeredElement = null;
    }
    if (el) {
      s.context.triggerElements.add(id, el);
      registeredId = id;
      registeredElement = el;
    }
    if (isActive()) {
      root.setTriggerElement(el);
    }
  });
  onCleanup(() => {
    if (registeredId !== null && registeredElement !== null) {
      const s = store();
      const current = s.context.triggerElements.getById(registeredId);
      if (current === registeredElement) {
        s.context.triggerElements.delete(registeredId);
      }
    }
  });
  const onClickCapture = event => {
    root.setActiveTriggerId(resolvedId());
    if ("payload" in props) {
      root.setPayload(props.payload);
    }
    void event;
  };
  createEffect(() => ({
    active: isActive(),
    payload: props.payload
  }), ({
    active,
    payload
  }) => {
    if (active && "payload" in props) {
      root.setPayload(payload);
    }
  });
  const stateAttrs = {
    get "data-popup-open"() {
      return state().open ? "" : undefined;
    },
    get "data-pressed"() {
      return state().open ? "" : undefined;
    },
    onClick: onClickCapture,
    get id() {
      return resolvedId();
    }
  };
  const userClassStyle = resolveClassStyle(props, () => state());
  const userProps = omit(props, "as", "class", "style", "attrs", "disabled", "nativeButton", "handle", "payload");
  let merged = mergeRootProps(root.interactions.getReferenceProps(), localInteractions.getReferenceProps());
  merged = mergeRootProps(merged, buttonProps);
  merged = mergeRootProps(merged, stateAttrs);
  merged = mergeRootProps(merged, userClassStyle);
  merged = mergeRootProps(merged, userProps);
  const Tag = dynamic(() => props.as ?? "button");
  return <Tag {...merged} ref={composeRefs(buttonRef, setRef, userRef(props))} />;
}
//# sourceMappingURL=dialog-trigger.jsx.map