UNPKG

@nutui/nutui-react

Version:

京东风格的轻量级移动端 React 组件库,支持一套代码生成 H5 和小程序

36 lines (35 loc) 1.32 kB
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 };