import type { StyleProp, ViewStyle } from 'react-native';
import type { IconName } from '../Icon/icon-types';
import { Intent, Size } from '@idealyst/theme';
import { BaseProps } from '../utils/viewStyleProps';
import { SelectionAccessibilityProps } from '../utils/accessibility';

export type ChipSize = Size;
export type ChipType = 'filled' | 'outlined' | 'soft';
export type ChipIntent = Intent;

/**
 * Compact element for tags, filters, or selections.
 * Supports deletable and selectable modes with icon customization.
 */
export interface ChipProps extends BaseProps, SelectionAccessibilityProps {
  /** The text content of the chip */
  label: string;

  /** Visual style variant */
  type?: ChipType;

  /** Color intent/semantic meaning */
  intent?: ChipIntent;

  /** Size of the chip */
  size?: ChipSize;

  /** Icon to display before the label. Can be an icon name (string) or a custom React element */
  icon?: IconName | React.ReactNode;

  /** Whether the chip can be deleted */
  deletable?: boolean;

  /** Callback when delete button is pressed */
  onDelete?: () => void;

  /** Icon to display in the delete button. Defaults to 'close' */
  deleteIcon?: IconName | React.ReactNode;

  /** Whether the chip is selectable */
  selectable?: boolean;

  /** Whether the chip is selected (when selectable) */
  selected?: boolean;

  /** Callback when chip is pressed */
  onPress?: () => void;

  /**
   * @deprecated Use `onPress` instead. This is a cross-platform component - use React Native conventions.
   *
   * Using `onClick` will trigger a console warning in development.
   * This prop exists only for migration convenience and will be removed in a future version.
   *
   * @example
   * // ❌ Don't use onClick
   * <Chip label="Tag" onClick={() => {}} />
   *
   * // ✅ Use onPress instead
   * <Chip label="Tag" onPress={() => {}} />
   */
  onClick?: () => void;

  /** Whether the chip is disabled */
  disabled?: boolean;

  /** Custom style */
  style?: StyleProp<ViewStyle>;

  /** Test ID for testing */
  testID?: string;
}