@progress/kendo-react-animation 6.1.1 → 7.0.0-develop.2

package/dist/es/Zoom.js

@@ -1,90 +0,0 @@
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import * as React from 'react';
-import * as PropTypes from 'prop-types';
-import { Animation } from './Animation';
-var EXITING_ANIMATION_STYLE = { position: 'absolute', top: '0', left: '0' };
-// tslint:enable:max-line-length
-var Zoom = /** @class */ (function (_super) {
-    __extends(Zoom, _super);
-    function Zoom() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    /**
-     * @hidden
-     */
-    Zoom.prototype.render = function () {
-        var _a = this.props, children = _a.children, direction = _a.direction, other = __rest(_a, ["children", "direction"]);
-        return (React.createElement(Animation, __assign({}, other, { transitionName: "zoom-".concat(direction), animationExitingStyle: this.props.stackChildren
-                ? EXITING_ANIMATION_STYLE
-                : undefined }), children));
-    };
-    /**
-     * @hidden
-     */
-    Zoom.propTypes = {
-        children: PropTypes.oneOfType([
-            PropTypes.arrayOf(PropTypes.node),
-            PropTypes.node
-        ]),
-        childFactory: PropTypes.any,
-        className: PropTypes.string,
-        direction: PropTypes.oneOf([
-            'in',
-            'out'
-        ]),
-        component: PropTypes.string,
-        id: PropTypes.string,
-        style: PropTypes.any,
-        stackChildren: PropTypes.bool
-    };
-    /**
-     * @hidden
-     */
-    Zoom.defaultProps = {
-        appear: false,
-        enter: true,
-        exit: true,
-        transitionEnterDuration: 300,
-        transitionExitDuration: 300,
-        direction: 'out',
-        stackChildren: false
-    };
-    return Zoom;
-}(React.Component));
-export { Zoom };

package/dist/es/hooks/useAnimation.d.ts

@@ -1,12 +0,0 @@
-import * as React from 'react';
-/** @hidden */
-export declare type AnimationConfig = {
-    initial?: React.CSSProperties;
-    duration?: number;
-    appear?: boolean;
-    onStart?: any;
-    onUpdate?: any;
-    onEnd?: any;
-};
-/** @hidden */
-export declare const useAnimation: (config: AnimationConfig, deps: any[]) => void;

package/dist/es/hooks/useAnimation.js

@@ -1,48 +0,0 @@
-import * as React from 'react';
-/** @hidden */
-export var useAnimation = function (config, deps) {
-    var offset = React.useRef(0);
-    var mount = React.useRef(false);
-    var animationFrame = React.useRef();
-    var animate = function (transition) {
-        var duration = transition.duration;
-        var start;
-        var progress;
-        var skip = offset.current && 1 - offset.current;
-        if (transition.onStart) {
-            transition.onStart();
-        }
-        var frame = function (timestamp) {
-            if (!start) {
-                start = timestamp;
-            }
-            progress = timestamp - start + 1;
-            var rate = progress / duration + skip;
-            if (rate <= 1) {
-                if (transition.onUpdate) {
-                    transition.onUpdate(rate);
-                }
-                animationFrame.current = window.requestAnimationFrame(frame);
-                offset.current = rate;
-            }
-            else {
-                if (transition.onEnd) {
-                    transition.onEnd(1);
-                }
-                offset.current = 0;
-            }
-        };
-        animationFrame.current = window.requestAnimationFrame(frame);
-    };
-    React.useEffect(function () {
-        animate(config);
-        return function () {
-            if (animationFrame.current) {
-                window.cancelAnimationFrame(animationFrame.current);
-            }
-        };
-    }, deps);
-    React.useEffect(function () {
-        mount.current = true;
-    }, []);
-};

package/dist/es/main.d.ts

@@ -1,10 +0,0 @@
-import { Animation, AnimationProps } from './Animation';
-import { AnimationChild, AnimationChildProps } from './AnimationChild';
-import { Fade, FadeProps } from './Fade';
-import { Expand, ExpandDirection, ExpandProps } from './Expand';
-import { Push, PushDirection, PushProps } from './Push';
-import { Slide, SlideDirection, SlideProps } from './Slide';
-import { Zoom, ZoomDirection, ZoomProps } from './Zoom';
-import { Reveal, RevealDirection, RevealProps } from './Reveal';
-import { useAnimation } from './hooks/useAnimation';
-export { Animation, AnimationProps, AnimationChild, AnimationChildProps, Fade, FadeProps, Expand, ExpandProps, ExpandDirection, Push, PushProps, PushDirection, Slide, SlideProps, SlideDirection, Zoom, ZoomProps, ZoomDirection, Reveal, RevealProps, RevealDirection, useAnimation };

package/dist/es/main.js

@@ -1,10 +0,0 @@
-import { Animation } from './Animation';
-import { AnimationChild } from './AnimationChild';
-import { Fade } from './Fade';
-import { Expand } from './Expand';
-import { Push } from './Push';
-import { Slide } from './Slide';
-import { Zoom } from './Zoom';
-import { Reveal } from './Reveal';
-import { useAnimation } from './hooks/useAnimation';
-export { Animation, AnimationChild, Fade, Expand, Push, Slide, Zoom, Reveal, useAnimation };

package/dist/es/package-metadata.d.ts

@@ -1,5 +0,0 @@
-import { PackageMetadata } from '@progress/kendo-licensing';
-/**
- * @hidden
- */
-export declare const packageMetadata: PackageMetadata;

package/dist/es/package-metadata.js

@@ -1,11 +0,0 @@
-/**
- * @hidden
- */
-export var packageMetadata = {
-    name: '@progress/kendo-react-animation',
-    productName: 'KendoReact',
-    productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
-    publishDate: 1700063333,
-    version: '',
-    licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning'
-};

package/dist/es/util.d.ts

@@ -1,11 +0,0 @@
-/**
- * @hidden
- */
-declare const stylesMap: {
-    outerHeight: (element: any) => any;
-    outerWidth: (element: any) => any;
-    styles: {
-        [name: string]: string;
-    };
-};
-export default stylesMap;

package/dist/es/util.js

@@ -1,138 +0,0 @@
-/**
- * @hidden
- */
-var outerHeight = function (element) {
-    if (!element || !element.ownerDocument.defaultView) {
-        return 0;
-    }
-    var wnd = element.ownerDocument.defaultView;
-    var computedStyles = wnd.getComputedStyle(element);
-    var marginTop = parseFloat(computedStyles.marginTop);
-    var marginBottom = parseFloat(computedStyles.marginBottom);
-    return element.offsetHeight + marginTop + marginBottom;
-};
-/**
- * @hidden
- */
-var outerWidth = function (element) {
-    if (!element || !element.ownerDocument.defaultView) {
-        return 0;
-    }
-    var wnd = element.ownerDocument.defaultView;
-    var computedStyles = wnd.getComputedStyle(element);
-    var marginLeft = parseFloat(computedStyles.marginLeft);
-    var marginRight = parseFloat(computedStyles.marginRight);
-    return element.offsetWidth + marginLeft + marginRight;
-};
-/**
- * @hidden
- */
-var styles = {
-    'animation-container': 'k-animation-container',
-    'animation-container-relative': 'k-animation-container-relative',
-    'animation-container-fixed': 'k-animation-container-fixed',
-    'push-right-enter': 'k-push-right-enter',
-    'push-right-appear': 'k-push-right-appear',
-    'push-right-enter-active': 'k-push-right-enter-active',
-    'push-right-appear-active': 'k-push-right-appear-active',
-    'push-right-exit': 'k-push-right-exit',
-    'push-right-exit-active': 'k-push-right-exit-active',
-    'push-left-enter': 'k-push-left-enter',
-    'push-left-appear': 'k-push-left-appear',
-    'push-left-enter-active': 'k-push-left-enter-active',
-    'push-left-appear-active': 'k-push-left-appear-active',
-    'push-left-exit': 'k-push-left-exit',
-    'push-left-exit-active': 'k-push-left-exit-active',
-    'push-down-enter': 'k-push-down-enter',
-    'push-down-appear': 'k-push-down-appear',
-    'push-down-enter-active': 'k-push-down-enter-active',
-    'push-down-appear-active': 'k-push-down-appear-active',
-    'push-down-exit': 'k-push-down-exit',
-    'push-down-exit-active': 'k-push-down-exit-active',
-    'push-up-enter': 'k-push-up-enter',
-    'push-up-appear': 'k-push-up-appear',
-    'push-up-enter-active': 'k-push-up-enter-active',
-    'push-up-appear-active': 'k-push-up-appear-active',
-    'push-up-exit': 'k-push-up-exit',
-    'push-up-exit-active': 'k-push-up-exit-active',
-    'expand': 'k-expand',
-    'expand-vertical-enter': 'k-expand-vertical-enter',
-    'expand-vertical-appear': 'k-expand-vertical-appear',
-    'expand-vertical-enter-active': 'k-expand-vertical-enter-active',
-    'expand-vertical-appear-active': 'k-expand-vertical-appear-active',
-    'expand-vertical-exit': 'k-expand-vertical-exit',
-    'expand-vertical-exit-active': 'k-expand-vertical-exit-active',
-    'expand-horizontal-enter': 'k-expand-horizontal-enter',
-    'expand-horizontal-appear': 'k-expand-horizontal-appear',
-    'expand-horizontal-enter-active': 'k-expand-horizontal-enter-active',
-    'expand-horizontal-appear-active': 'k-expand-horizontal-appear-active',
-    'expand-horizontal-exit': 'k-expand-horizontal-exit',
-    'expand-horizontal-exit-active': 'k-expand-horizontal-exit-active',
-    'child-animation-container': 'k-child-animation-container',
-    'fade-enter': 'k-fade-enter',
-    'fade-appear': 'k-fade-appear',
-    'fade-enter-active': 'k-fade-enter-active',
-    'fade-appear-active': 'k-fade-appear-active',
-    'fade-exit': 'k-fade-exit',
-    'fade-exit-active': 'k-fade-exit-active',
-    'zoom-in-enter': 'k-zoom-in-enter',
-    'zoom-in-appear': 'k-zoom-in-appear',
-    'zoom-in-enter-active': 'k-zoom-in-enter-active',
-    'zoom-in-appear-active': 'k-zoom-in-appear-active',
-    'zoom-in-exit': 'k-zoom-in-exit',
-    'zoom-in-exit-active': 'k-zoom-in-exit-active',
-    'zoom-out-enter': 'k-zoom-out-enter',
-    'zoom-out-appear': 'k-zoom-out-appear',
-    'zoom-out-enter-active': 'k-zoom-out-enter-active',
-    'zoom-out-appear-active': 'k-zoom-out-appear-active',
-    'zoom-out-exit': 'k-zoom-out-exit',
-    'zoom-out-exit-active': 'k-zoom-out-exit-active',
-    'slide-in-appear': 'k-slide-in-appear',
-    'centered': 'k-centered',
-    'slide-in-appear-active': 'k-slide-in-appear-active',
-    'slide-down-enter': 'k-slide-down-enter',
-    'slide-down-appear': 'k-slide-down-appear',
-    'slide-down-enter-active': 'k-slide-down-enter-active',
-    'slide-down-appear-active': 'k-slide-down-appear-active',
-    'slide-down-exit': 'k-slide-down-exit',
-    'slide-down-exit-active': 'k-slide-down-exit-active',
-    'slide-up-enter': 'k-slide-up-enter',
-    'slide-up-appear': 'k-slide-up-appear',
-    'slide-up-enter-active': 'k-slide-up-enter-active',
-    'slide-up-appear-active': 'k-slide-up-appear-active',
-    'slide-up-exit': 'k-slide-up-exit',
-    'slide-up-exit-active': 'k-slide-up-exit-active',
-    'slide-right-enter': 'k-slide-right-enter',
-    'slide-right-appear': 'k-slide-right-appear',
-    'slide-right-enter-active': 'k-slide-right-enter-active',
-    'slide-right-appear-active': 'k-slide-right-appear-active',
-    'slide-right-exit': 'k-slide-right-exit',
-    'slide-right-exit-active': 'k-slide-right-exit-active',
-    'slide-left-enter': 'k-slide-left-enter',
-    'slide-left-appear': 'k-slide-left-appear',
-    'slide-left-enter-active': 'k-slide-left-enter-active',
-    'slide-left-appear-active': 'k-slide-left-appear-active',
-    'slide-left-exit': 'k-slide-left-exit',
-    'slide-left-exit-active': 'k-slide-left-exit-active',
-    'reveal-vertical-enter': 'k-reveal-vertical-enter',
-    'reveal-vertical-appear': 'k-reveal-vertical-appear',
-    'reveal-vertical-enter-active': 'k-reveal-vertical-enter-active',
-    'reveal-vertical-appear-active': 'k-reveal-vertical-appear-active',
-    'reveal-vertical-exit': 'k-reveal-vertical-exit',
-    'reveal-vertical-exit-active': 'k-reveal-vertical-exit-active',
-    'reveal-horizontal-enter': 'k-reveal-horizontal-enter',
-    'reveal-horizontal-appear': 'k-reveal-horizontal-appear',
-    'reveal-horizontal-enter-active': 'k-reveal-horizontal-enter-active',
-    'reveal-horizontal-appear-active': 'k-reveal-horizontal-appear-active',
-    'reveal-horizontal-exit': 'k-reveal-horizontal-exit',
-    'reveal-horizontal-exit-active': 'k-reveal-horizontal-exit-active'
-};
-/**
- * @hidden
- */
-var stylesMap = {
-    outerHeight: outerHeight,
-    outerWidth: outerWidth,
-    styles: styles
-};
-export default stylesMap;

package/dist/npm/Animation.d.ts

@@ -1,82 +0,0 @@
-import * as React from 'react';
-import * as PropTypes from 'prop-types';
-import { AnimationInterface } from './AnimationInterface';
-/**
- * Represents the props of the [KendoReact Animation component]({% slug overview_animation %}).
- */
-export interface AnimationProps extends AnimationInterface {
-    /**
-     * When the element reaches its exit state, it is no longer available in the DOM ([see example]({% slug exitingchildcomponents_animation %})).
-     */
-    childFactory?: any;
-    /**
-     * Specifies the name of the CSS class which is set to the Animation.
-     */
-    className?: string;
-    /**
-     * Specifies the node type of the parent Animation. Defaults to `div`.
-     */
-    component?: string;
-    /**
-     * Specifies the id of the Animation.
-     */
-    id?: string;
-    /**
-     * Specifies the style of the parent Animation.
-     */
-    style?: any;
-    /**
-     * Specifies whether the Animation children will stack on top of each other without interfering ([see example]({% slug stacked_animation %})).
-     */
-    stackChildren?: boolean;
-    /**
-     * Specifies the `classNames` which will be applied during the transition ([see example]({% slug customizing_animation %})).
-     */
-    transitionName: string;
-    /**
-     * Specifies the style which will be applied when the Animation reaches its entering state.
-     */
-    animationEnteringStyle?: any;
-    /**
-     * Specifies the style which will be applied when the Animation reaches its entered state.
-     */
-    animationEnteredStyle?: any;
-    /**
-     * Specifies the style which will be applied when the Animation reaches its exiting state.
-     */
-    animationExitingStyle?: any;
-    /**
-     * Specifies the style which will be applied when the Animation reaches its exited state.
-     */
-    animationExitedStyle?: any;
-}
-export declare class Animation extends React.Component<AnimationProps, {}> {
-    /**
-     * @hidden
-     */
-    static propTypes: {
-        children: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
-        childFactory: PropTypes.Requireable<any>;
-        className: PropTypes.Requireable<string>;
-        component: PropTypes.Requireable<string>;
-        id: PropTypes.Requireable<string>;
-        style: PropTypes.Requireable<any>;
-        transitionName: PropTypes.Validator<string>;
-        appear: PropTypes.Validator<boolean>;
-        enter: PropTypes.Validator<boolean>;
-        exit: PropTypes.Validator<boolean>;
-        transitionEnterDuration: PropTypes.Validator<number>;
-        transitionExitDuration: PropTypes.Validator<number>;
-    };
-    /**
-     * @hidden
-     */
-    static defaultProps: {
-        component: string;
-    };
-    constructor(props: AnimationProps);
-    /**
-     * @hidden
-     */
-    render(): JSX.Element;
-}

package/dist/npm/Animation.js

@@ -1,101 +0,0 @@
-"use strict";
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Animation = void 0;
-var React = require("react");
-var PropTypes = require("prop-types");
-var kendo_react_common_1 = require("@progress/kendo-react-common");
-var AnimationChild_1 = require("./AnimationChild");
-var react_transition_group_1 = require("react-transition-group");
-var kendo_react_common_2 = require("@progress/kendo-react-common");
-var package_metadata_1 = require("./package-metadata");
-var util_1 = require("./util");
-var styles = util_1.default.styles;
-// tslint:enable:max-line-length
-var Animation = /** @class */ (function (_super) {
-    __extends(Animation, _super);
-    function Animation(props) {
-        var _this = _super.call(this, props) || this;
-        (0, kendo_react_common_2.validatePackage)(package_metadata_1.packageMetadata);
-        return _this;
-    }
-    /**
-     * @hidden
-     */
-    Animation.prototype.render = function () {
-        var _a = this.props, id = _a.id, style = _a.style, children = _a.children, component = _a.component, className = _a.className, childFactory = _a.childFactory, stackChildren = _a.stackChildren, componentChildStyle = _a.componentChildStyle, componentChildClassName = _a.componentChildClassName, other = __rest(_a, ["id", "style", "children", "component", "className", "childFactory", "stackChildren", "componentChildStyle", "componentChildClassName"]);
-        var transitionProps = {
-            id: id,
-            style: style,
-            component: component,
-            childFactory: childFactory,
-            className: (0, kendo_react_common_1.classNames)(styles['animation-container'], styles['animation-container-relative'], className)
-        };
-        var content = React.Children.map(children || null, function (child) { return (React.createElement(AnimationChild_1.AnimationChild, __assign({}, other, { style: componentChildStyle, className: componentChildClassName }), child)); });
-        return (React.createElement(react_transition_group_1.TransitionGroup, __assign({}, transitionProps), content));
-    };
-    /**
-     * @hidden
-     */
-    Animation.propTypes = {
-        children: PropTypes.oneOfType([
-            PropTypes.arrayOf(PropTypes.node),
-            PropTypes.node
-        ]),
-        childFactory: PropTypes.any,
-        className: PropTypes.string,
-        component: PropTypes.string,
-        id: PropTypes.string,
-        style: PropTypes.any,
-        transitionName: PropTypes.string.isRequired,
-        appear: PropTypes.bool.isRequired,
-        enter: PropTypes.bool.isRequired,
-        exit: PropTypes.bool.isRequired,
-        transitionEnterDuration: PropTypes.number.isRequired,
-        transitionExitDuration: PropTypes.number.isRequired
-    };
-    /**
-     * @hidden
-     */
-    Animation.defaultProps = {
-        component: 'div'
-    };
-    return Animation;
-}(React.Component));
-exports.Animation = Animation;