/**
 * 输入框辅助样式
 * 用于处理React Native Web在浏览器中的默认focus outline样式
 */

/**
 * 移除浏览器默认focus outline的样式
 * 这个样式可以覆盖浏览器原生的黑框/蓝框
 */
export const noFocusOutline = {
  // 移除浏览器默认的outline（针对Web）
  outlineWidth: 0,
  outline: 'none' as const,
  outlineColor: 'transparent',
  // 兼容React Native Web
  ':focus': {
    outlineWidth: 0,
    outline: 'none',
  },
  // Webkit浏览器兼容
  '::placeholder': {
    outlineWidth: 0,
  },
};

/**
 * 为TextInput添加无outline样式
 */
export const inputNoFocusOutline = {
  ...noFocusOutline,
  // 确保placeholder也没有outline
  placeholderTextColor: undefined, // 会在使用时覆盖
};
