// withHooks
// noPage
import { applyStyle } from 'esoftplay';

import { LibIcon, LibIconStyle } from 'esoftplay/cache/lib/icon/import';
import { LibTextstyle } from 'esoftplay/cache/lib/textstyle/import';

import React from 'react';
import { TouchableOpacity, View } from 'react-native';


export interface MarketInfoArgs {

}
export interface MarketInfoProps {
  text: string
  mode: "info" | "success" | "danger" | "warning"
  onPress?: () => void,
  onClose?: () => void,
  disabled: boolean
  style?: any
  contentStyle?: any
  iconRight?: string
}
export default function m(props: MarketInfoProps): any {
  const icon: LibIconStyle[] = ["information-outline", "check-circle-outline", "close-circle-outline", "alert-circle-outline"]
  const mode = ["info", "success", "danger", "warning"]
  const color = ["blue", "lightgreen", "red", "orange"]
  const bgColor = ["#cce5ff", "#d4edda", "#f8d7da", "#fff3cd"]
  const iconR = props?.iconRight || 'close'

  return (
    <TouchableOpacity disabled={props.disabled} onPress={props.onPress} style={{ ...props?.style }} >
      <View style={applyStyle({ paddingVertical: 8, paddingHorizontal: 10, flexDirection: 'row', alignItems: 'center', backgroundColor: bgColor[mode.indexOf(props.mode)],...props?.contentStyle })} >
        <LibIcon name={icon[mode.indexOf(props.mode)]} color={color[mode.indexOf(props.mode)]} size={17} />
        <LibTextstyle textStyle="caption2" numberOfLines={3} ellipsizeMode='tail' text={props.text} style={applyStyle({ marginHorizontal: 10, flex: 1 })} />
        {
          props?.onClose ?
            <TouchableOpacity onPress={props?.onClose}>
              <LibIcon name={iconR} size={17} />
            </TouchableOpacity>
            :
            props?.iconRight ?
              <LibIcon name={iconR} size={17} />
              : null
        }
      </View>
    </TouchableOpacity>
  )
}