import { Placement } from "../../../types/variables.mjs";
import { TooltipTriggerProps } from "../../overlays/tooltip/tooltip.mjs";
import { FC, HTMLProps, ReactNode } from "react";

//#region src/components/buttons/icon-button/icon-button.d.ts
type IconButtonTriggerProps = Partial<TooltipTriggerProps>;
type Props = {
  size?: 'sm' | 'md' | 'lg';
  color?: 'transparent' | 'base' | 'primary' | 'secondary';
  label: string;
  tooltipPlacement?: Placement;
  tooltipDisabled?: boolean;
  /**
   * クリック時の処理。`onAction` は非同期処理を `useTransition` で包み、保留中は
   * `aria-busy` を立てる糖衣。素のクリックイベントが必要なら `onClick` を使う。
   * 両者は併用可能で `onClick` → `onAction` の順に実行される（`onClick` が
   * `preventDefault` した場合は `onAction` をスキップ）。
   */
  onAction?: () => void | Promise<void>;
  renderItem?: (props: {
    className: string;
    children: ReactNode;
    'aria-label': string;
    triggerProps: IconButtonTriggerProps;
  }) => ReactNode;
} & Omit<HTMLProps<HTMLButtonElement>, 'size' | 'type' | 'className' | 'style'>;
declare const IconButton: FC<Props>;
//#endregion
export { IconButton, IconButtonTriggerProps };