style.js 1.1 KB

123456789101112131415161718192021222324252627282930313233343536
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. exports.default = void 0;
  6. var _internal = require("../../theme/internal");
  7. const genWaveStyle = token => {
  8. const {
  9. componentCls,
  10. colorPrimary
  11. } = token;
  12. return {
  13. [componentCls]: {
  14. position: 'absolute',
  15. background: 'transparent',
  16. pointerEvents: 'none',
  17. boxSizing: 'border-box',
  18. color: `var(--wave-color, ${colorPrimary})`,
  19. boxShadow: `0 0 0 0 currentcolor`,
  20. opacity: 0.2,
  21. // =================== Motion ===================
  22. '&.wave-motion-appear': {
  23. transition: [`box-shadow 0.4s ${token.motionEaseOutCirc}`, `opacity 2s ${token.motionEaseOutCirc}`].join(','),
  24. '&-active': {
  25. boxShadow: `0 0 0 6px currentcolor`,
  26. opacity: 0
  27. },
  28. '&.wave-quick': {
  29. transition: [`box-shadow ${token.motionDurationSlow} ${token.motionEaseInOut}`, `opacity ${token.motionDurationSlow} ${token.motionEaseInOut}`].join(',')
  30. }
  31. }
  32. }
  33. };
  34. };
  35. var _default = exports.default = (0, _internal.genComponentStyleHook)('Wave', genWaveStyle);