@yamada-ui/react/dist/types/hooks/use-clickable/index.d.ts

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

import { StyledProps } from "../../core/components/index.types.js";
import "../../core/index.js";
import * as react16 from "react";
import { HTMLAttributes, KeyboardEvent, MouseEvent, Ref } from "react";

//#region src/hooks/use-clickable/index.d.ts
type Props<Y extends HTMLElement = HTMLElement> = Omit<HTMLAttributes<Y>, "ref" | "size" | keyof StyledProps>;
type UseClickableProps<Y extends HTMLElement = HTMLElement, M extends Props<Y> = Props<Y>> = M & {
  /**
   * The ref for the element.
   */
  ref?: Ref<Y>;
  /**
   * Whether or not trigger click on pressing `Enter`.
   *
   * @default true
   */
  clickOnEnter?: boolean;
  /**
   * Whether or not trigger click on pressing `Space`.
   *
   * @default true
   */
  clickOnSpace?: boolean;
  /**
   * If `true`, the element will be disabled. It will set the `disabled` HTML attribute.
   *
   * @default false
   */
  disabled?: boolean;
  /**
   * Disable the touch device behavior.
   *
   * @default true
   */
  disableTouchBehavior?: boolean;
  /**
   * If `true` and isDisabled, the element will have only `aria-disabled` set to `true`.
   *
   * @default false
   */
  focusable?: boolean;
  /**
   * Whether or not to focus the element when it is clicked.
   * If `true`, the element will receive focus upon click.
   *
   * @default true
   */
  focusOnClick?: boolean;
};
declare const useClickable: <Y extends HTMLElement = HTMLElement, M extends Props<Y> = Props<Y>>({
  ref,
  clickOnEnter,
  clickOnSpace,
  disabled,
  disableTouchBehavior,
  focusable,
  focusOnClick,
  tabIndex: tabIndexProp,
  onClick: onClickProp,
  onKeyDown: onKeyDownProp,
  onKeyUp: onKeyUpProp,
  onMouseDown: onMouseDownProp,
  onMouseLeave: onMouseLeaveProp,
  onMouseOver: onMouseOverProp,
  onMouseUp: onMouseUpProp,
  ...props
}?: UseClickableProps<Y, M>) => (Omit<UseClickableProps<Y, M>, "disabled" | "ref" | "tabIndex" | "onKeyDown" | "onKeyUp" | "onClick" | "onMouseDown" | "onMouseLeave" | "onMouseOver" | "onMouseUp" | "clickOnEnter" | "clickOnSpace" | "disableTouchBehavior" | "focusable" | "focusOnClick"> & {
  ref: (node: any) => void;
  type: "button";
  "aria-disabled": boolean | undefined;
  disabled: boolean | undefined;
  onClick: (ev: MouseEvent<Y>) => void;
  onKeyDown: react16.KeyboardEventHandler<Y> | undefined;
  onKeyUp: react16.KeyboardEventHandler<Y> | undefined;
  onMouseDown: react16.MouseEventHandler<Y> | undefined;
  onMouseLeave: react16.MouseEventHandler<Y> | undefined;
  onMouseOver: react16.MouseEventHandler<Y> | undefined;
  onMouseUp: react16.MouseEventHandler<Y> | undefined;
}) | (Omit<UseClickableProps<Y, M>, "disabled" | "ref" | "tabIndex" | "onKeyDown" | "onKeyUp" | "onClick" | "onMouseDown" | "onMouseLeave" | "onMouseOver" | "onMouseUp" | "clickOnEnter" | "clickOnSpace" | "disableTouchBehavior" | "focusable" | "focusOnClick"> & {
  ref: (node: any) => void;
  "aria-disabled": "true" | undefined;
  "data-active": string | undefined;
  role: string;
  tabIndex: number | undefined;
  onClick: (ev: MouseEvent<Y>) => void;
  onKeyDown: (ev: KeyboardEvent<Y>) => void;
  onKeyUp: (ev: KeyboardEvent<Y>) => void;
  onMouseDown: (ev: MouseEvent<Y>) => void;
  onMouseLeave: (ev: MouseEvent<Y>) => void;
  onMouseOver: (ev: MouseEvent<Y>) => void;
  onMouseUp: (ev: MouseEvent<Y>) => void;
});
type UseClickableReturn = ReturnType<typeof useClickable>;
//#endregion
export { UseClickableProps, UseClickableReturn, useClickable };
//# sourceMappingURL=index.d.ts.map