How to use the @axa-fr/react-toolkit-core.withProps function in @axa-fr/react-toolkit-core

};

const omitProperties = PropsManager.omit(['classModifier']);

const ActionCore: React.FC = ({ icon, ...otherProps }) => (
  <a>
    <i>
  </i></a><i>
);

ActionCore.defaultProps = defaultProps;

const enhance = compose(
  withClassDefault(defaultClassName),
  withClassModifier,
  withProps(({ onClick, href, role }: ActionCoreProps) =&gt; ({
    href: onClick ? '#' : href || undefined,
    role: onClick ? 'button' : role || undefined,
  }))
);

const Enhanced = enhance(ActionCore);
Enhanced.displayName = 'ActionCore';
export default Enhanced;
</i>

const defaultClassModifier = 'error';

type AlertProps = Pick> & {
  icon?: string;
};

const setWithProps = ({ icon, ...otherProps }: AlertProps): AlertCoreProps => {
  const firstModifier = otherProps.classModifier.split(' ')[0];
  return {
    ...otherProps,
    iconClassName: `glyphicon glyphicon-${icon || icons[firstModifier]}`,
  };
};

const Enhanced = compose(withProps(setWithProps))(AlertCore);

Enhanced.displayName = 'Alert';
Enhanced.defaultProps = {
  classModifier: defaultClassModifier,
};

export default Enhanced;

export type TitleProps = TitleComponentProps &
  TitleHandlerProps &
  WithClassModifierOptions;

const setWithProps = (props: TitleComponentProps) => ({
  ...props,
  classModifier: (props.classModifier || '').concat(
    (props.enable === false ? ' disabled' : '').concat(
      props.active ? ' active' : ''
    )
  ),
});

const enchance = compose(
  withProps(setWithProps),
  withClickId({ event: [onChangeEvent] }),
  withClassDefault(DEFAULT_CLASSNAME),
  withClassModifier
)(Title);

enchance.displayName = 'Title';

export default enchance;

}

export enum TypeIcons {
  error = 'glyphicon glyphicon-exclamation-sign',
  danger = 'glyphicon glyphicon-alert',
  info = 'glyphicon glyphicon-info-sign',
  success = 'glyphicon glyphicon-ok',
}

export const setWithProps = ({ type, classModifier, iconClassName, ...otherProps }: AlertWithTypeProps): AlertCoreProps => ({
  ...otherProps,
  classModifier: classnames(classModifier, type),
  iconClassName: iconClassName || TypeIcons[type as keyof typeof TypeIcons],
});

const enhance =  compose(withProps(setWithProps))(AlertCore);

enhance.defaultProps = {
  type: 'error',
};
enhance.displayName = 'AlertWithType';

export default enhance;

const onCancelEvent = 'onCancel';

export interface HeaderProps
  extends WithClickIdProps {
  title: string;
}

const setWithProps = (props: HeaderProps) => ({
  ...props,
  children: props.title,
});

const enchance = compose(
  withClickId({ event: [onCancelEvent] }),
  withProps(setWithProps),
)(HeaderCore);

enchance.displayName = 'Header';

export default enchance;

withProps,
  compose,
} from '@axa-fr/react-toolkit-core';

export interface FooterProps extends FooterCoreProps {
  copyright?: React.ReactNode;
}

export const setWithProps = ({
                        copyright,
                        ...otherProps
                      }: FooterProps): FooterCoreProps => ({
  ...otherProps,
  children: copyright,
});
const enhanced = compose(withProps(setWithProps))(FooterCore);

enhanced.displayName = 'Footer';

export default enhanced;