import { Styles, ViewStyle } from '@cleartrip/ct-design-types';
import { ReactElement, SVGProps } from 'react';

import { positions, overlayBorderRadius } from './constants';
export interface ITooltipProps {
  /**
   * The content to be displayed inside the tooltip.
   */
  children: ReactElement;

  /**
   * The container for the label of the tooltip.
   */
  labelContainer: React.ReactNode;

  /**
   * Optional width of the tooltip.
   */
  tooltipWidth?: ViewStyle['width'];

  /**
   * Optional border radius for the tooltip, defined by overlayBorderRadiusType.
   */
  tooltipBorderRadius?: `${overlayBorderRadius}`;

  /**
   * Optional position of the tooltip, defined by positionType.
   */
  position?: `${positions}`;

  /**
   * Configuration for styling the tooltip components.
   */
  styleConfig?: {
    /**
     * Styles for the root of the tooltip.
     */
    root?: Styles[];

    /**
     * Styles for the label container of the tooltip.
     */
    labelContainerStyles?: Styles[];

    /**
     *
     */

    arrowStyles?: Styles[];

    /**
     * Styles for any icons within the tooltip.
     */
    iconStyles?: Styles[];

    /**
     * Styles for the overlay of the tooltip.
     */
    overlayStyles?: Styles[];
  };

  /**
   * Indicates whether the tooltip is open or closed.
   */
  open?: boolean;
  /**
   * Indicates whether the tooltip should animate on open/close.
   */
  animate?: boolean;

  /**
   * Enables hovering over the tooltip container to keep it open.
   */
  enableTooltipContainerHovering?: boolean;

  /**
   * Ref object for the anchor element.
   */
  anchorRef?: React.RefObject<unknown>;

  /**
   * Ref object for the tooltip container.
   */
  svgPathProps?: SVGProps<SVGSVGElement>;
}

export interface IDimensionsProps {
  width: number;
  height: number;
  x: number;
  y: number;
  leftEdge?: number;
  rightEdge?: number;
}
export interface IMeasurements {
  labelContainer: IDimensionsProps;
  overlayContainer: IDimensionsProps;
  anchorRef: IDimensionsProps;
}

export interface TooltipStyles {
  top?: number;
  left?: number;
  borderRadius?: number;
}

export interface TooltipArrowStyles {
  rotate?: string;
  top?: number;
  left?: number;
}