import { StyleProviderFunction } from '@rax-ui/styles';

const StyleProvider: StyleProviderFunction = (theme) => {
  const { Core = {} } = theme;
  return {
    "table": {
      flexDirection: 'row',
      justifyContent: 'center',
      backgroundColor: Core['color-white'],
    },

    "table--fixed": {
      backgroundColor: Core['color-white'],
      position: 'absolute',
      left: 20,
      overflow: 'hidden',
    },

    "table__border": {
      borderColor: Core['color-line1-1'],
      borderTopWidth: Core['line-2'],
      borderLeftWidth: Core['line-2'],
    },

    "table__nodata": {
      height: 200,
      flex: 1,
      justifyContent: 'center',
      alignItems: 'center',
    },

    "table__nodata__text": {
      color: Core['color-text1-2'],
      fontSize: Core['s-4'],
      textAlign: 'center'
    },

    "table__header": {
      flexDirection: 'row',
      flexWrap: 'nowrap',
      backgroundColor: Core['color-fill1-1']
    },

    "table__header__title": {
      wordBreak: 'break-all',
      fontSize: Core['s-3'],
      color: Core['color-text1-4'],
      textAlign: 'left',
      fontWeight: 'bold',
    },

    "table__header__cell--padding": {
      paddingLeft: 20,
      paddingRight: 20,
    },

    "table__header__desc": {
      width: 64,
      minHeight: 80,
      alignItems: 'center',
      justifyContent: 'center',
    },

    "table__header__desc__icon": {
      fontSize: Core['s-4'],
      color: Core['color-help-2'],
    },

    "table__header__sort": {
      width: 30,
      minHeight: 80,
      alignItems: 'center',
      justifyContent: 'center',
    },

    "table__header__sort__icon": {
      opacity: 1,
      fontSize: Core['s-3'],
      lineHeight: 28,
      color: Core['color-text1-1'],
    },

    "table__header__sort__icon--asce": {
      marginBottom: 0,
    },

    "table__header__sort__icon--desc": {
      marginTop: 2,
    },

    "table__header__sort__icon--selected": {
      color: Core['color-brand1-6'],
    },

    "table__row": {
      flexDirection: 'row',
      flexWrap: 'nowrap',
      justifyContent: 'space-between',
      overflow: 'hidden',
    },

    "table__row__border": {
      borderColor: Core['color-line1-1'],
      borderBottomWidth: Core['line-2'],
    },

    "table__column__border": {
      borderColor: Core['color-line1-1'],
      borderRightWidth: Core['line-2'],
    },

    "table__row__cell": {
      flexDirection: 'row',
      flexWrap: 'nowrap',
      width: '100%',
      alignItems: 'center',
      flexGrow: 1,
      opacity: 1,
      borderBottomWidth: 0,
      justifyContent: 'space-between',
    },

    "table__header__min--height": {
      minHeight: 80,
    },

    "table__header--group": {
      flexDirection: 'column',
      flexWrap: 'wrap',
      alignItems: 'stretch',
      justifyContent: 'space-around',
    },

    "table__row__cell__padding": {
      paddingLeft: 20,
      paddingRight: 20,
      paddingTop: 24,
      paddingBottom: 24,
    },

    "table__row__cell__title": {
      wordBreak: 'break-all',
      fontSize: Core['s-3'],
      color: Core['color-text1-4'],
      textOverflow: 'ellipsis',
      textAlign: 'left',
    }
  };
}

export default StyleProvider;