Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@cleartrip/ct-design-animate

Package Overview
Dependencies
Maintainers
0
Versions
41
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@cleartrip/ct-design-animate - npm Package Compare versions

Comparing version 1.7.0-SNAPSHORT-mevc.0 to 1.7.0-SNAPSHOT-emotion-exp.0

2

dist/ct-design-animate.browser.cjs.js

@@ -1,2 +0,2 @@

"use strict";var n=require("tslib"),t=require("react/jsx-runtime"),a=require("styled-components");function r(n){return n&&n.__esModule?n:{default:n}}var i=r(a);exports.AnimationVariant=void 0,(exports.AnimationVariant||(exports.AnimationVariant={})).SHAKE="SHAKE";var e,s,o,m=a.keyframes(e||(e=n.__makeTemplateObject(["\n 10%,\n 90% {\n transform: translate3d(-1px, 0, 0);\n }\n\n 20%,\n 80% {\n transform: translate3d(2px, 0, 0);\n }\n\n 30%,\n 50%,\n 70% {\n transform: translate3d(-4px, 0, 0);\n }\n\n 40%,\n 60% {\n transform: translate3d(4px, 0, 0);\n }\n"],["\n 10%,\n 90% {\n transform: translate3d(-1px, 0, 0);\n }\n\n 20%,\n 80% {\n transform: translate3d(2px, 0, 0);\n }\n\n 30%,\n 50%,\n 70% {\n transform: translate3d(-4px, 0, 0);\n }\n\n 40%,\n 60% {\n transform: translate3d(4px, 0, 0);\n }\n"]))),l=i.default.div((function(t){var r=t.variant,i=t.show,e=void 0!==i&&i,l=t.css,d=void 0===l?{}:l,c=e?function(t){if(t===exports.AnimationVariant.SHAKE)return a.css(s||(s=n.__makeTemplateObject(["\n animation: "," 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n perspective: 1000px;\n "],["\n animation: "," 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n perspective: 1000px;\n "])),m)}(r):"";return a.css(o||(o=n.__makeTemplateObject(["\n animation-duration: 1s;\n animation-fill-mode: both;\n ","\n ",";\n "],["\n animation-duration: 1s;\n animation-fill-mode: both;\n ","\n ",";\n "])),c,d)})),d=function(a){var r=a.children,i=a.animate,e=a.styleConfig,s=(null!=e?e:{}).root,o=void 0===s?{}:s;return t.jsx(l,n.__assign({css:null==o?void 0:o.css,variant:exports.AnimationVariant.SHAKE,show:i},{children:r}))};exports.Animate=function(a){var r=a.variant,i=n.__rest(a,["variant"]);return r===exports.AnimationVariant.SHAKE?t.jsx(d,n.__assign({},i)):t.jsx(t.Fragment,{children:i.children})};
"use strict";var n=require("tslib"),t=require("react/jsx-runtime"),a=require("@emotion/styled"),r=require("@emotion/react");function i(n){return n&&n.__esModule?n:{default:n}}var e=i(a);exports.AnimationVariant=void 0,(exports.AnimationVariant||(exports.AnimationVariant={})).SHAKE="SHAKE";var s,o,m,l=r.keyframes(s||(s=n.__makeTemplateObject(["\n 10%,\n 90% {\n transform: translate3d(-1px, 0, 0);\n }\n\n 20%,\n 80% {\n transform: translate3d(2px, 0, 0);\n }\n\n 30%,\n 50%,\n 70% {\n transform: translate3d(-4px, 0, 0);\n }\n\n 40%,\n 60% {\n transform: translate3d(4px, 0, 0);\n }\n"],["\n 10%,\n 90% {\n transform: translate3d(-1px, 0, 0);\n }\n\n 20%,\n 80% {\n transform: translate3d(2px, 0, 0);\n }\n\n 30%,\n 50%,\n 70% {\n transform: translate3d(-4px, 0, 0);\n }\n\n 40%,\n 60% {\n transform: translate3d(4px, 0, 0);\n }\n"]))),d=e.default.div((function(t){var a=t.variant,i=t.show,e=void 0!==i&&i,s=t.css,d=void 0===s?{}:s,c=e?function(t){if(t===exports.AnimationVariant.SHAKE)return r.css(o||(o=n.__makeTemplateObject(["\n animation: "," 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n perspective: 1000px;\n "],["\n animation: "," 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n perspective: 1000px;\n "])),l)}(a):"";return r.css(m||(m=n.__makeTemplateObject(["\n animation-duration: 1s;\n animation-fill-mode: both;\n ","\n ",";\n "],["\n animation-duration: 1s;\n animation-fill-mode: both;\n ","\n ",";\n "])),c,d)})),c=function(a){var r=a.children,i=a.animate,e=a.styleConfig,s=(null!=e?e:{}).root,o=void 0===s?{}:s;return t.jsx(d,n.__assign({css:null==o?void 0:o.css,variant:exports.AnimationVariant.SHAKE,show:i},{children:r}))};exports.Animate=function(a){var r=a.variant,i=n.__rest(a,["variant"]);return r===exports.AnimationVariant.SHAKE?t.jsx(c,n.__assign({},i)):t.jsx(t.Fragment,{children:i.children})};
//# sourceMappingURL=ct-design-animate.browser.cjs.js.map

@@ -1,2 +0,2 @@

import{__makeTemplateObject as n,__assign as t,__rest as r}from"tslib";import{jsx as a,Fragment as i}from"react/jsx-runtime";import o,{keyframes as e,css as s}from"styled-components";var d;!function(n){n.SHAKE="SHAKE"}(d||(d={}));var l,m,c,f=e(l||(l=n(["\n 10%,\n 90% {\n transform: translate3d(-1px, 0, 0);\n }\n\n 20%,\n 80% {\n transform: translate3d(2px, 0, 0);\n }\n\n 30%,\n 50%,\n 70% {\n transform: translate3d(-4px, 0, 0);\n }\n\n 40%,\n 60% {\n transform: translate3d(4px, 0, 0);\n }\n"],["\n 10%,\n 90% {\n transform: translate3d(-1px, 0, 0);\n }\n\n 20%,\n 80% {\n transform: translate3d(2px, 0, 0);\n }\n\n 30%,\n 50%,\n 70% {\n transform: translate3d(-4px, 0, 0);\n }\n\n 40%,\n 60% {\n transform: translate3d(4px, 0, 0);\n }\n"]))),p=o.div((function(t){var r=t.variant,a=t.show,i=void 0!==a&&a,o=t.css,e=void 0===o?{}:o,l=i?function(t){if(t===d.SHAKE)return s(m||(m=n(["\n animation: "," 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n perspective: 1000px;\n "],["\n animation: "," 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n perspective: 1000px;\n "])),f)}(r):"";return s(c||(c=n(["\n animation-duration: 1s;\n animation-fill-mode: both;\n ","\n ",";\n "],["\n animation-duration: 1s;\n animation-fill-mode: both;\n ","\n ",";\n "])),l,e)})),v=function(n){var r=n.children,i=n.animate,o=n.styleConfig,e=(null!=o?o:{}).root,s=void 0===e?{}:e;return a(p,t({css:null==s?void 0:s.css,variant:d.SHAKE,show:i},{children:r}))},u=function(n){var o=n.variant,e=r(n,["variant"]);return o===d.SHAKE?a(v,t({},e)):a(i,{children:e.children})};export{u as Animate,d as AnimationVariant};
import{__makeTemplateObject as n,__assign as t,__rest as r}from"tslib";import{jsx as a,Fragment as i}from"react/jsx-runtime";import o from"@emotion/styled";import{keyframes as e,css as s}from"@emotion/react";var m;!function(n){n.SHAKE="SHAKE"}(m||(m={}));var d,l,f,c=e(d||(d=n(["\n 10%,\n 90% {\n transform: translate3d(-1px, 0, 0);\n }\n\n 20%,\n 80% {\n transform: translate3d(2px, 0, 0);\n }\n\n 30%,\n 50%,\n 70% {\n transform: translate3d(-4px, 0, 0);\n }\n\n 40%,\n 60% {\n transform: translate3d(4px, 0, 0);\n }\n"],["\n 10%,\n 90% {\n transform: translate3d(-1px, 0, 0);\n }\n\n 20%,\n 80% {\n transform: translate3d(2px, 0, 0);\n }\n\n 30%,\n 50%,\n 70% {\n transform: translate3d(-4px, 0, 0);\n }\n\n 40%,\n 60% {\n transform: translate3d(4px, 0, 0);\n }\n"]))),p=o.div((function(t){var r=t.variant,a=t.show,i=void 0!==a&&a,o=t.css,e=void 0===o?{}:o,d=i?function(t){if(t===m.SHAKE)return s(l||(l=n(["\n animation: "," 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n perspective: 1000px;\n "],["\n animation: "," 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n perspective: 1000px;\n "])),c)}(r):"";return s(f||(f=n(["\n animation-duration: 1s;\n animation-fill-mode: both;\n ","\n ",";\n "],["\n animation-duration: 1s;\n animation-fill-mode: both;\n ","\n ",";\n "])),d,e)})),v=function(n){var r=n.children,i=n.animate,o=n.styleConfig,e=(null!=o?o:{}).root,s=void 0===e?{}:e;return a(p,t({css:null==s?void 0:s.css,variant:m.SHAKE,show:i},{children:r}))},u=function(n){var o=n.variant,e=r(n,["variant"]);return o===m.SHAKE?a(v,t({},e)):a(i,{children:e.children})};export{u as Animate,m as AnimationVariant};
//# sourceMappingURL=ct-design-animate.browser.esm.js.map

@@ -5,3 +5,4 @@ 'use strict';

var jsxRuntime = require('react/jsx-runtime');
var styled = require('styled-components');
var styled = require('@emotion/styled');
var react = require('@emotion/react');

@@ -17,7 +18,7 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

var shakeKeyFrame = styled.keyframes(templateObject_1 || (templateObject_1 = tslib.__makeTemplateObject(["\n 10%,\n 90% {\n transform: translate3d(-1px, 0, 0);\n }\n\n 20%,\n 80% {\n transform: translate3d(2px, 0, 0);\n }\n\n 30%,\n 50%,\n 70% {\n transform: translate3d(-4px, 0, 0);\n }\n\n 40%,\n 60% {\n transform: translate3d(4px, 0, 0);\n }\n"], ["\n 10%,\n 90% {\n transform: translate3d(-1px, 0, 0);\n }\n\n 20%,\n 80% {\n transform: translate3d(2px, 0, 0);\n }\n\n 30%,\n 50%,\n 70% {\n transform: translate3d(-4px, 0, 0);\n }\n\n 40%,\n 60% {\n transform: translate3d(4px, 0, 0);\n }\n"])));
var shakeKeyFrame = react.keyframes(templateObject_1 || (templateObject_1 = tslib.__makeTemplateObject(["\n 10%,\n 90% {\n transform: translate3d(-1px, 0, 0);\n }\n\n 20%,\n 80% {\n transform: translate3d(2px, 0, 0);\n }\n\n 30%,\n 50%,\n 70% {\n transform: translate3d(-4px, 0, 0);\n }\n\n 40%,\n 60% {\n transform: translate3d(4px, 0, 0);\n }\n"], ["\n 10%,\n 90% {\n transform: translate3d(-1px, 0, 0);\n }\n\n 20%,\n 80% {\n transform: translate3d(2px, 0, 0);\n }\n\n 30%,\n 50%,\n 70% {\n transform: translate3d(-4px, 0, 0);\n }\n\n 40%,\n 60% {\n transform: translate3d(4px, 0, 0);\n }\n"])));
var getAnimationPropsFromVariant = function (variant) {
switch (variant) {
case exports.AnimationVariant.SHAKE: {
return styled.css(templateObject_2 || (templateObject_2 = tslib.__makeTemplateObject(["\n animation: ", " 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n perspective: 1000px;\n "], ["\n animation: ", " 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n perspective: 1000px;\n "])), shakeKeyFrame);
return react.css(templateObject_2 || (templateObject_2 = tslib.__makeTemplateObject(["\n animation: ", " 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n perspective: 1000px;\n "], ["\n animation: ", " 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n perspective: 1000px;\n "])), shakeKeyFrame);
}

@@ -29,3 +30,3 @@ }

var Animation = show ? getAnimationPropsFromVariant(variant) : '';
return styled.css(templateObject_3 || (templateObject_3 = tslib.__makeTemplateObject(["\n animation-duration: 1s;\n animation-fill-mode: both;\n ", "\n ", ";\n "], ["\n animation-duration: 1s;\n animation-fill-mode: both;\n ", "\n ", ";\n "])), Animation, styleCss);
return react.css(templateObject_3 || (templateObject_3 = tslib.__makeTemplateObject(["\n animation-duration: 1s;\n animation-fill-mode: both;\n ", "\n ", ";\n "], ["\n animation-duration: 1s;\n animation-fill-mode: both;\n ", "\n ", ";\n "])), Animation, styleCss);
});

@@ -32,0 +33,0 @@ var templateObject_1, templateObject_2, templateObject_3;

import { __makeTemplateObject, __assign, __rest } from 'tslib';
import { jsx, Fragment } from 'react/jsx-runtime';
import styled, { keyframes, css } from 'styled-components';
import styled from '@emotion/styled';
import { keyframes, css } from '@emotion/react';

@@ -5,0 +6,0 @@ var AnimationVariant;

(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react/jsx-runtime'), require('styled-components')) :
typeof define === 'function' && define.amd ? define(['exports', 'react/jsx-runtime', 'styled-components'], factory) :
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.CTDesignSystemAnimate = {}, global.jsxRuntime, global.styled));
})(this, (function (exports, jsxRuntime, styled) { 'use strict';
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react/jsx-runtime'), require('@emotion/styled'), require('@emotion/react')) :
typeof define === 'function' && define.amd ? define(['exports', 'react/jsx-runtime', '@emotion/styled', '@emotion/react'], factory) :
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.CTDesignSystemAnimate = {}, global.jsxRuntime, global.styled, global.react));
})(this, (function (exports, jsxRuntime, styled, react) { 'use strict';

@@ -65,7 +65,7 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

var shakeKeyFrame = styled.keyframes(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n 10%,\n 90% {\n transform: translate3d(-1px, 0, 0);\n }\n\n 20%,\n 80% {\n transform: translate3d(2px, 0, 0);\n }\n\n 30%,\n 50%,\n 70% {\n transform: translate3d(-4px, 0, 0);\n }\n\n 40%,\n 60% {\n transform: translate3d(4px, 0, 0);\n }\n"], ["\n 10%,\n 90% {\n transform: translate3d(-1px, 0, 0);\n }\n\n 20%,\n 80% {\n transform: translate3d(2px, 0, 0);\n }\n\n 30%,\n 50%,\n 70% {\n transform: translate3d(-4px, 0, 0);\n }\n\n 40%,\n 60% {\n transform: translate3d(4px, 0, 0);\n }\n"])));
var shakeKeyFrame = react.keyframes(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n 10%,\n 90% {\n transform: translate3d(-1px, 0, 0);\n }\n\n 20%,\n 80% {\n transform: translate3d(2px, 0, 0);\n }\n\n 30%,\n 50%,\n 70% {\n transform: translate3d(-4px, 0, 0);\n }\n\n 40%,\n 60% {\n transform: translate3d(4px, 0, 0);\n }\n"], ["\n 10%,\n 90% {\n transform: translate3d(-1px, 0, 0);\n }\n\n 20%,\n 80% {\n transform: translate3d(2px, 0, 0);\n }\n\n 30%,\n 50%,\n 70% {\n transform: translate3d(-4px, 0, 0);\n }\n\n 40%,\n 60% {\n transform: translate3d(4px, 0, 0);\n }\n"])));
var getAnimationPropsFromVariant = function (variant) {
switch (variant) {
case exports.AnimationVariant.SHAKE: {
return styled.css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n animation: ", " 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n perspective: 1000px;\n "], ["\n animation: ", " 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n perspective: 1000px;\n "])), shakeKeyFrame);
return react.css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n animation: ", " 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n perspective: 1000px;\n "], ["\n animation: ", " 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n perspective: 1000px;\n "])), shakeKeyFrame);
}

@@ -77,3 +77,3 @@ }

var Animation = show ? getAnimationPropsFromVariant(variant) : '';
return styled.css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n animation-duration: 1s;\n animation-fill-mode: both;\n ", "\n ", ";\n "], ["\n animation-duration: 1s;\n animation-fill-mode: both;\n ", "\n ", ";\n "])), Animation, styleCss);
return react.css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n animation-duration: 1s;\n animation-fill-mode: both;\n ", "\n ", ";\n "], ["\n animation-duration: 1s;\n animation-fill-mode: both;\n ", "\n ", ";\n "])), Animation, styleCss);
});

@@ -80,0 +80,0 @@ var templateObject_1, templateObject_2, templateObject_3;

@@ -1,4 +0,9 @@

import { CSSProperties } from 'styled-components';
import { CSSProperties } from 'react';
import { AnimationVariant } from './type';
export declare const StyledAnimation: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Omit<CSSProperties, "theme"> & {
export declare const StyledAnimation: import("@emotion/styled").StyledComponent<{
theme?: import("@emotion/react").Theme | undefined;
as?: import("react").ElementType<any> | undefined;
} & Omit<CSSProperties, "theme"> & {
theme: import("packages/core/theme/dist").Theme;
} & {
css?: CSSProperties | undefined;

@@ -8,3 +13,3 @@ } & {

show?: boolean | undefined;
}, never>;
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
//# sourceMappingURL=style.d.ts.map
{
"name": "@cleartrip/ct-design-animate",
"version": "1.7.0-SNAPSHORT-mevc.0",
"version": "1.7.0-SNAPSHOT-emotion-exp.0",
"description": "HOC component that will render animation to children",

@@ -17,11 +17,14 @@ "types": "dist/index.d.ts",

],
"dependencies": {},
"dependencies": {
"@emotion/react": "^11.13.3",
"@emotion/styled": "^11.13.0"
},
"devDependencies": {
"@cleartrip/ct-design-theme": "3.14.0-SNAPSHORT-mevc.0",
"@cleartrip/ct-design-types": "3.14.0-SNAPSHORT-mevc.0"
"@emotion/babel-plugin": "^11.12.0",
"@cleartrip/ct-design-theme": "3.14.0-SNAPSHOT-emotion-exp.0",
"@cleartrip/ct-design-types": "3.14.0-SNAPSHOT-emotion-exp.0"
},
"peerDependencies": {
"react": ">=16.8.0",
"react-dom": ">=16.8.0",
"styled-components": "^5.3.6"
"react-dom": ">=16.8.0"
},

@@ -28,0 +31,0 @@ "publishConfig": {

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc