import { HybridFieldClass } from '../../components/descope-hybrid-field/HybridFieldClass';
import { refs } from './inputWrapper';

const vars = HybridFieldClass.cssVarList;

const hybridField = {
  [vars.hostDirection]: refs.direction,
  [vars.labelFontWeight]: refs.labelFontWeight,
  [vars.inputValueFontWeight]: refs.inputValueFontWeight,
  [vars.inputPlaceholderFontWeight]: refs.inputPlaceholderFontWeight,
  [vars.helperTextFontWeight]: refs.helperTextFontWeight,
  [vars.errorMessageFontWeight]: refs.errorMessageFontWeight,

  // error message icon
  [vars.errorMessageIcon]: refs.errorMessageIcon,
  [vars.errorMessageIconSize]: refs.errorMessageIconSize,
  [vars.errorMessageIconPadding]: refs.errorMessageIconPadding,
  [vars.errorMessageIconRepeat]: refs.errorMessageIconRepeat,
  [vars.errorMessageIconPosition]: refs.errorMessageIconPosition,
  [vars.errorMessageFontSize]: refs.errorMessageFontSize,

  _fullWidth: {
    [vars.hostWidth]: '100%',
  },
};

export default hybridField;
export { vars };
