/**
 * `ArrowButton` is a customizable button component that displays an arrow.
 * The button can have various shapes, directions, and colors, and it rotates on hover.
 * The button's appearance and behavior can be controlled using props or the theme provider.
 *
 * @param {object} props - The properties to customize the `ArrowButton` component.
 * @param {'topleft' | 'topright' | 'bottomleft' | 'bottomright' | 'left' | 'right' | 'top' | 'bottom'} [props.initialDirection='topright'] - The initial direction of the arrow.
 * @param {'topleft' | 'topright' | 'bottomleft' | 'bottomright' | 'left' | 'right' | 'top' | 'bottom'} [props.finalDirection='right'] - The final direction of the arrow after rotation.
 * @param {string} [props.backgroundColor] - Background color of the button (overrides theme.backgroundColor).
 * @param {string} [props.arrowFillColor] - The fill color of the arrow (overrides theme.textColor).
 * @param {string} [props.arrowStrokeColor] - The stroke (border) color of the arrow (overrides theme.borderColor).
 * @param {string} [props.borderColor] - Border color of the button (overrides theme.borderColor).
 * @param {string} [props.shadowColor] - Shadow color of the button (overrides theme.shadowColor).
 * @param {number} [props.size] - The size of the button. Both width and height are set to this value (overrides theme.spacingfactor).
 * @param {number} [props.cornerRadius] - Custom border radius for the button. Overrides theme.cornerRadius if provided.
 * @param {string} [props.borderWidth] - Border width for the button (overrides theme.borderWidth).
 * @param {string} [props.borderStyle] - Border style for the button (overrides theme.borderStyle).
 * @param {string} [props.transitionDuration] - Transition duration for the button (overrides theme.transitionDuration).
 * @param {string} [props.shadowOffsetX] - Horizontal shadow offset (overrides theme.shadowOffsetX).
 * @param {string} [props.shadowOffsetY] - Vertical shadow offset (overrides theme.shadowOffsetY).
 * @param {string} [props.shadowBlur] - Shadow blur radius (overrides theme.shadowBlur).
 * @param {string} [props.shadowSpread] - Shadow spread radius (overrides theme.shadowSpread).
 * @param {boolean} [props.shadowInset] - Whether the shadow is inset (overrides theme.shadowInset).
 * @param {Function} [props.onClick] - A function that will be called when the button is clicked.
 *
 * @returns {JSX.Element} A styled button element with an arrow inside.
 */
export interface ArrowButtonProps {
    initialDirection?: "topleft" | "topright" | "bottomleft" | "bottomright" | "left" | "right" | "top" | "bottom";
    finalDirection?: "topleft" | "topright" | "bottomleft" | "bottomright" | "left" | "right" | "top" | "bottom";
    backgroundColor?: string;
    arrowFillColor?: string;
    arrowStrokeColor?: string;
    borderColor?: string;
    shadowColor?: string;
    size?: number;
    borderWidth?: string;
    borderStyle?: string;
    transitionDuration?: string;
    shadowOffsetX?: string;
    shadowOffsetY?: string;
    shadowBlur?: string;
    shadowSpread?: string;
    shadowInset?: boolean;
    onClick?: () => void;
    cornerRadius?: number;
}
declare const ArrowButton: ({ initialDirection, finalDirection, backgroundColor, shadowColor, borderColor, size, onClick, arrowFillColor, arrowStrokeColor, cornerRadius, borderWidth, borderStyle, transitionDuration, shadowOffsetX, shadowOffsetY, shadowBlur, shadowSpread, shadowInset, }: ArrowButtonProps) => import("react/jsx-runtime").JSX.Element;
export default ArrowButton;
