antd/es/notification/style/placement.js

An enterprise-class UI design language and React components implementation

import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import { Keyframes } from '@ant-design/cssinjs';

var genNotificationPlacementStyle = function genNotificationPlacementStyle(token) {
  var _ref;

  var componentCls = token.componentCls,
      width = token.width,
      notificationMarginEdge = token.notificationMarginEdge;
  var notificationTopFadeIn = new Keyframes('antNotificationTopFadeIn', {
    '0%': {
      marginTop: '-100%',
      opacity: 0
    },
    '100%': {
      marginTop: 0,
      opacity: 1
    }
  });
  var notificationBottomFadeIn = new Keyframes('antNotificationBottomFadeIn', {
    '0%': {
      marginBottom: '-100%',
      opacity: 0
    },
    '100%': {
      marginBottom: 0,
      opacity: 1
    }
  });
  var notificationLeftFadeIn = new Keyframes('antNotificationLeftFadeIn', {
    '0%': {
      right: {
        _skip_check_: true,
        value: width
      },
      opacity: 0
    },
    '100%': {
      right: {
        _skip_check_: true,
        value: 0
      },
      opacity: 1
    }
  });
  return _ref = {}, _defineProperty(_ref, "&".concat(componentCls, "-top, &").concat(componentCls, "-bottom"), {
    marginInline: 0
  }), _defineProperty(_ref, "&".concat(componentCls, "-top"), _defineProperty({}, "".concat(componentCls, "-fade-enter").concat(componentCls, "-fade-enter-active, ").concat(componentCls, "-fade-appear").concat(componentCls, "-fade-appear-active"), {
    animationName: notificationTopFadeIn
  })), _defineProperty(_ref, "&".concat(componentCls, "-bottom"), _defineProperty({}, "".concat(componentCls, "-fade-enter").concat(componentCls, "-fade-enter-active, ").concat(componentCls, "-fade-appear").concat(componentCls, "-fade-appear-active"), {
    animationName: notificationBottomFadeIn
  })), _defineProperty(_ref, "&".concat(componentCls, "-topLeft, &").concat(componentCls, "-bottomLeft"), _defineProperty({
    marginInlineEnd: 0,
    marginInlineStart: notificationMarginEdge
  }, "".concat(componentCls, "-fade-enter").concat(componentCls, "-fade-enter-active, ").concat(componentCls, "-fade-appear").concat(componentCls, "-fade-appear-active"), {
    animationName: notificationLeftFadeIn
  })), _ref;
};

export default genNotificationPlacementStyle;