Dialog

createDialogButton

export function createDialogButton(
  document: Document,
  label: string,
  action: () => void,
  variant: DialogButtonVariant = 'default',
): HTMLButtonElement;

---

DialogPlugin

class DialogPlugin {
  open(options: DialogOpenOptions): DialogHandle;

  close(root?: HTMLElement): void;
}

---

attachDialogDrag

Makes a dialog movable from a dedicated header without owning its rendering.

export function attachDialogDrag({
  target,
  handle,
  margin = 8,
  ignoreSelector = DEFAULT_IGNORE_SELECTOR,
}: DialogDragOptions): () => void;

---

DialogDragOptions

interface DialogDragOptions {
  readonly target: HTMLElement;
  readonly handle: HTMLElement;
  readonly margin?: number;
  readonly ignoreSelector?: string
}

---

useDialogDrag

Connects Preact-rendered dialog refs to the framework-neutral drag owner.

export function useDialogDrag<
  Target extends HTMLElement,
  Handle extends HTMLElement,
>({
  targetRef,
  handleRef,
  enabled = true,
}: UseDialogDragOptions<Target, Handle>): void;

---

UseDialogDragOptions

interface UseDialogDragOptions {
  readonly targetRef: RefObject<Target>;
  readonly handleRef: RefObject<Handle>;
  readonly enabled?: boolean
}

---

DialogOpenOptions

interface DialogOpenOptions {
  readonly title: string;
  readonly closeLabel: string;
  readonly draggable?: boolean;
  readonly popupOwner?: object;
  readonly overlayClass?: string;
  readonly surfaceClass?: string
}

---

DialogHandle

interface DialogHandle {
  readonly root: HTMLElement;
  readonly surface: HTMLElement;
  readonly header: HTMLElement;
  readonly body: HTMLElement;
  readonly footer: HTMLElement;
  readonly actions: HTMLElement;
  close(): void
}

---

DialogButtonVariant

export type DialogButtonVariant =
  | 'default'
  | 'primary'
  | 'secondary'
  | 'danger'
  | 'danger-outline'
  | 'ghost';

---

createDialogElements

export function createDialogElements(
  document: Document,
  options: DialogOpenOptions,
  close: () => void,
): DialogElements;

---

trapDialogFocus

export function trapDialogFocus(
  root: HTMLElement,
  event: KeyboardEvent,
): void;

---

DialogElements

interface DialogElements {
  readonly root: HTMLElement;
  readonly surface: HTMLElement;
  readonly header: HTMLElement;
  readonly body: HTMLElement;
  readonly footer: HTMLElement;
  readonly actions: HTMLElement
}