react-desktop/src/TextArea/macOs/focusRingAnimation.js

React UI Components for macOS High Sierra and Windows 10

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

exports.default = function (borderRadius) {
  return (0, _radium.keyframes)({
    '0%': {
      opacity: '0',
      borderWidth: '34px',
      top: '-34px',
      left: '-34px'
    },
    '32%': {
      opacity: '0',
      borderRadius: '10px',
      borderWidth: '30px',
      top: '-30px',
      left: '-30px'
    },
    '50%': {
      opacity: '.2',
      borderWidth: '15px',
      top: '-15px',
      left: '-15px'
    },
    '80%': {
      opacity: '.4',
      borderWidth: '9px',
      top: '-9px',
      left: '-9px'
    },
    '90%': {
      opacity: '.9',
      borderWidth: '6px',
      top: '-6px',
      left: '-6px'
    },
    '100%': _extends({
      opacity: '1'
    }, borderRadius ? {
      top: '-2px',
      left: '-2px',
      borderRadius: parseInt(borderRadius) + 2 + 'px',
      borderWidth: '2px',
      boxShadow: '0 0 1px 0px rgba(125, 195, 242, .7)'
    } : {
      top: '-3px',
      left: '-3px',
      borderRadius: '4px',
      borderWidth: '3px'
    })
  }, 'text-input-focus');
};

var _radium = require('radium');