This commit is contained in:
2026-05-25 17:08:18 +08:00
parent df501f6151
commit f1259b71b5
9178 changed files with 1626125 additions and 0 deletions
+16
View File
@@ -0,0 +1,16 @@
import React from 'react';
export interface BackTopProps {
visibilityHeight?: number;
onClick?: React.MouseEventHandler<HTMLElement>;
target?: () => HTMLElement | Window | Document;
prefixCls?: string;
className?: string;
rootClassName?: string;
style?: React.CSSProperties;
duration?: number;
}
/**
* @deprecated Please use `FloatButton.BackTop` instead.
*/
declare const BackTop: React.FC<React.PropsWithChildren<BackTopProps>>;
export default BackTop;
+103
View File
@@ -0,0 +1,103 @@
"use strict";
"use client";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _VerticalAlignTopOutlined = _interopRequireDefault(require("@ant-design/icons/VerticalAlignTopOutlined"));
var _motion = _interopRequireDefault(require("@rc-component/motion"));
var _omit = _interopRequireDefault(require("@rc-component/util/lib/omit"));
var _clsx = require("clsx");
var _getScroll = _interopRequireDefault(require("../_util/getScroll"));
var _reactNode = require("../_util/reactNode");
var _scrollTo = _interopRequireDefault(require("../_util/scrollTo"));
var _throttleByAnimationFrame = _interopRequireDefault(require("../_util/throttleByAnimationFrame"));
var _warning = require("../_util/warning");
var _configProvider = require("../config-provider");
var _useCSSVarCls = _interopRequireDefault(require("../config-provider/hooks/useCSSVarCls"));
var _style = _interopRequireDefault(require("./style"));
/**
* @deprecated Please use `FloatButton.BackTop` instead.
*/
const BackTop = props => {
const {
prefixCls: customizePrefixCls,
className,
rootClassName,
visibilityHeight = 400,
target,
onClick,
duration = 450,
children
} = props;
const [visible, setVisible] = _react.default.useState(visibilityHeight === 0);
const ref = _react.default.useRef(null);
const getDefaultTarget = () => ref.current?.ownerDocument || window;
const handleScroll = (0, _throttleByAnimationFrame.default)(e => {
const scrollTop = (0, _getScroll.default)(e.target);
setVisible(scrollTop >= visibilityHeight);
});
if (process.env.NODE_ENV !== 'production') {
const warning = (0, _warning.devUseWarning)('BackTop');
warning.deprecated(false, 'BackTop', 'FloatButton.BackTop');
}
_react.default.useEffect(() => {
const getTarget = target || getDefaultTarget;
const container = getTarget();
handleScroll({
target: container
});
container?.addEventListener('scroll', handleScroll);
return () => {
handleScroll.cancel();
container?.removeEventListener('scroll', handleScroll);
};
}, [target]);
const scrollToTop = e => {
(0, _scrollTo.default)(0, {
getContainer: target || getDefaultTarget,
duration
});
onClick?.(e);
};
const {
getPrefixCls,
direction
} = _react.default.useContext(_configProvider.ConfigContext);
const prefixCls = getPrefixCls('back-top', customizePrefixCls);
const rootPrefixCls = getPrefixCls();
const rootCls = (0, _useCSSVarCls.default)(prefixCls);
const [hashId, cssVarCls] = (0, _style.default)(prefixCls, rootCls);
const classString = (0, _clsx.clsx)(hashId, cssVarCls, prefixCls, {
[`${prefixCls}-rtl`]: direction === 'rtl'
}, className, rootClassName);
// fix https://fb.me/react-unknown-prop
const divProps = (0, _omit.default)(props, ['prefixCls', 'className', 'rootClassName', 'children', 'visibilityHeight', 'target']);
const defaultElement = /*#__PURE__*/_react.default.createElement("div", {
className: `${prefixCls}-content`
}, /*#__PURE__*/_react.default.createElement("div", {
className: `${prefixCls}-icon`
}, /*#__PURE__*/_react.default.createElement(_VerticalAlignTopOutlined.default, null)));
return /*#__PURE__*/_react.default.createElement("div", {
...divProps,
className: classString,
onClick: scrollToTop,
ref: ref
}, /*#__PURE__*/_react.default.createElement(_motion.default, {
visible: visible,
motionName: `${rootPrefixCls}-fade`
}, ({
className: motionClassName
}) => (0, _reactNode.cloneElement)(children || defaultElement, ({
className: cloneCls
}) => ({
className: (0, _clsx.clsx)(motionClassName, cloneCls)
}))));
};
if (process.env.NODE_ENV !== 'production') {
BackTop.displayName = 'Deprecated.BackTop';
}
var _default = exports.default = BackTop;
+12
View File
@@ -0,0 +1,12 @@
import type { GetDefaultToken } from '../../theme/internal';
/** Component only token. Which will handle additional calculation of alias token */
export interface ComponentToken {
/**
* @desc 弹出层的 z-index
* @descEN z-index of popup
*/
zIndexPopup: number;
}
export declare const prepareComponentToken: GetDefaultToken<'BackTop'>;
declare const _default: (prefixCls: string, rootCls?: string) => readonly [string, string];
export default _default;
+100
View File
@@ -0,0 +1,100 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.prepareComponentToken = exports.default = void 0;
var _cssinjs = require("@ant-design/cssinjs");
var _style = require("../../style");
var _internal = require("../../theme/internal");
// ============================== Shared ==============================
const genSharedBackTopStyle = token => {
const {
componentCls,
backTopFontSize,
backTopSize,
zIndexPopup
} = token;
return {
[componentCls]: {
...(0, _style.resetComponent)(token),
position: 'fixed',
insetInlineEnd: token.backTopInlineEnd,
insetBlockEnd: token.backTopBlockEnd,
zIndex: zIndexPopup,
width: 40,
height: 40,
cursor: 'pointer',
'&:empty': {
display: 'none'
},
[`${componentCls}-content`]: {
width: backTopSize,
height: backTopSize,
overflow: 'hidden',
color: token.backTopColor,
textAlign: 'center',
backgroundColor: token.backTopBackground,
borderRadius: backTopSize,
transition: `all ${token.motionDurationMid}`,
'&:hover': {
backgroundColor: token.backTopHoverBackground,
transition: `all ${token.motionDurationMid}`
}
},
// change to .backtop .backtop-icon
[`${componentCls}-icon`]: {
fontSize: backTopFontSize,
lineHeight: (0, _cssinjs.unit)(backTopSize)
}
}
};
};
const genMediaBackTopStyle = token => {
const {
componentCls,
screenMD,
screenXS,
backTopInlineEndMD,
backTopInlineEndXS
} = token;
return {
[`@media (max-width: ${(0, _cssinjs.unit)(screenMD)})`]: {
[componentCls]: {
insetInlineEnd: backTopInlineEndMD
}
},
[`@media (max-width: ${(0, _cssinjs.unit)(screenXS)})`]: {
[componentCls]: {
insetInlineEnd: backTopInlineEndXS
}
}
};
};
const prepareComponentToken = token => ({
zIndexPopup: token.zIndexBase + 10
});
// ============================== Export ==============================
exports.prepareComponentToken = prepareComponentToken;
var _default = exports.default = (0, _internal.genStyleHooks)('BackTop', token => {
const {
fontSizeHeading3,
colorTextDescription,
colorTextLightSolid,
colorText,
controlHeightLG,
calc
} = token;
const backTopToken = (0, _internal.mergeToken)(token, {
backTopBackground: colorTextDescription,
backTopColor: colorTextLightSolid,
backTopHoverBackground: colorText,
backTopFontSize: fontSizeHeading3,
backTopSize: controlHeightLG,
backTopBlockEnd: calc(controlHeightLG).mul(1.25).equal(),
backTopInlineEnd: calc(controlHeightLG).mul(2.5).equal(),
backTopInlineEndMD: calc(controlHeightLG).mul(1.5).equal(),
backTopInlineEndXS: calc(controlHeightLG).mul(0.5).equal()
});
return [genSharedBackTopStyle(backTopToken), genMediaBackTopStyle(backTopToken)];
}, prepareComponentToken);