@nutui/nutui-react
Version:
京东风格的轻量级移动端 React 组件库,支持一套代码生成 H5 和小程序
36 lines (35 loc) • 1.32 kB
JavaScript
import { _ as __rest } from "./tslib.es6.js";
import React__default, { useState } from "react";
import classNames from "classnames";
import { C as ComponentDefaults } from "./typings.js";
const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { type: "shake", action: "initial", loop: false, onClick: (event) => {
} });
const classPrefix = `nut-animate`;
const Animate = (props) => {
const _a = Object.assign(Object.assign({}, defaultProps), props), { className, type, action, loop, onClick, children } = _a, rest = __rest(_a, ["className", "type", "action", "loop", "onClick", "children"]);
const [clicked, setClicked] = useState(false);
const classes = classNames({
"nut-ani-container": true,
[`${classPrefix}-${type}`]: action === "initial" || clicked ? type : false,
loop
});
const cls = classNames(classes, className);
const handleClick = (event) => {
setClicked(true);
if (!loop) {
setTimeout(() => {
setClicked(false);
}, 1e3);
}
onClick && onClick(event);
};
return React__default.createElement(
"div",
{ className: "nut-animate" },
React__default.createElement("div", Object.assign({ className: cls, onClick: handleClick }, rest), children)
);
};
Animate.displayName = "NutAnimate";
export {
Animate as default
};