File size: 2,228 Bytes
5941ac2
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
/* eslint-disable react/no-array-index-key */
import * as React from 'react';
import { clsx } from 'clsx';

import { ConfigContext } from '../config-provider';
import BackTop from './BackTop';
import FloatButton, { floatButtonPrefixCls } from './FloatButton';
import type { FloatButtonProps } from './FloatButton';
import FloatButtonGroup from './FloatButtonGroup';
import type { FloatButtonGroupProps } from './FloatButtonGroup';

export interface PureFloatButtonProps extends Omit<FloatButtonProps, 'target'> {
  backTop?: boolean;
}

type ClassNamesType = PureFloatButtonProps['classNames'] | FloatButtonGroupProps['classNames'];
type StylesType = PureFloatButtonProps['styles'] | FloatButtonGroupProps['styles'];

export interface PurePanelProps
  extends Omit<PureFloatButtonProps, 'classNames' | 'styles'>,
    Omit<FloatButtonGroupProps, 'children' | 'classNames' | 'styles'> {
  /** Convert to FloatGroup when configured */
  items?: PureFloatButtonProps[];
  classNames?: ClassNamesType;
  styles?: StylesType;
}

const PureFloatButton: React.FC<PureFloatButtonProps> = ({ backTop, ...props }) =>
  backTop ? <BackTop {...props} visibilityHeight={0} /> : <FloatButton {...props} />;

/** @private Internal Component. Do not use in your production. */
const PurePanel: React.FC<PurePanelProps> = ({
  className,
  items,
  classNames: cls,
  styles,
  prefixCls: customizePrefixCls,
  ...restProps
}) => {
  const { getPrefixCls } = React.useContext(ConfigContext);
  const prefixCls = getPrefixCls(floatButtonPrefixCls, customizePrefixCls);
  const pureCls = `${prefixCls}-pure`;

  if (items) {
    return (
      <FloatButtonGroup
        className={clsx(className, pureCls)}
        classNames={cls as FloatButtonGroupProps['classNames']}
        styles={styles as FloatButtonGroupProps['styles']}
        {...restProps}
      >
        {items.map((item, index) => (
          <PureFloatButton key={index} {...item} />
        ))}
      </FloatButtonGroup>
    );
  }

  return (
    <PureFloatButton
      className={clsx(className, pureCls)}
      classNames={cls as FloatButtonProps['classNames']}
      styles={styles as FloatButtonProps['styles']}
      {...restProps}
    />
  );
};

export default PurePanel;