import { Affix as OldAffix, AffixProps, ConfigProvider } from 'antd';
import React, { useContext } from 'react';
import './index.less';
import classNames from 'classnames';

// update: support custom prefixCls

interface AffixExtraProps {}

const Affix = (props: AffixProps & AffixExtraProps) => {
  // 为了与 antd 的生态保持兼容性，我们要求必须要使用 `.@{ant-prefix}` 变量来生成类名
  const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);
  const prefixCls = getPrefixCls('btri-affix');

  return (
    <div className={classNames(`${prefixCls}-box`)}>
      <OldAffix {...props}>{props.children}</OldAffix>
    </div>
  );
};

export { Affix };