@progress/kendo-react-animation 7.2.4-develop.3 → 7.3.0-develop.1

package/index.mjs

@@ -1,671 +1,28 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2024 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the package root for more information
-*-------------------------------------------------------------------------------------------*/
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
 "use client";
-import * as a from "react";
-import e from "prop-types";
-import { classNames as C, noop as v, validatePackage as V } from "@progress/kendo-react-common";
-import { CSSTransition as _, TransitionGroup as B } from "react-transition-group";
-const G = (o) => {
-  if (!o || !o.ownerDocument.defaultView)
-    return 0;
-  const t = o.ownerDocument.defaultView.getComputedStyle(o), n = parseFloat(t.marginTop), s = parseFloat(t.marginBottom);
-  return o.offsetHeight + n + s;
-}, K = (o) => {
-  if (!o || !o.ownerDocument.defaultView)
-    return 0;
-  const t = o.ownerDocument.defaultView.getComputedStyle(o), n = parseFloat(t.marginLeft), s = parseFloat(t.marginRight);
-  return o.offsetWidth + n + s;
-}, X = {
-  "animation-container": "k-animation-container",
-  "animation-container-shown": "k-animation-container-shown",
-  "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"
-}, Y = {
-  outerHeight: G,
-  outerWidth: K,
-  styles: X
-}, g = Y, k = g.styles;
-class E extends a.Component {
-  constructor() {
-    super(...arguments), this.elementRef = a.createRef();
-  }
-  /**
-   * The element that is being animated.
-   */
-  get element() {
-    return this.elementRef.current;
-  }
-  /**
-   * @hidden
-   */
-  render() {
-    const {
-      children: i,
-      style: t,
-      appear: n,
-      enter: s,
-      exit: c,
-      transitionName: r,
-      transitionEnterDuration: l,
-      transitionExitDuration: d,
-      className: h,
-      onEnter: u,
-      onEntering: p,
-      onEntered: f,
-      onExit: m,
-      onExiting: y,
-      onExited: w,
-      onAfterExited: z,
-      mountOnEnter: b,
-      unmountOnExit: F,
-      animationEnteringStyle: A,
-      animationEnteredStyle: P,
-      animationExitingStyle: W,
-      animationExitedStyle: H,
-      ...I
-    } = this.props, q = C(
-      h,
-      k["child-animation-container"]
-    ), L = {
-      transitionDelay: "0ms",
-      ...t
-    }, M = {
-      entering: { transitionDuration: `${l}ms`, ...A },
-      entered: { ...P },
-      exiting: { transitionDuration: `${d}ms`, ...W },
-      exited: { ...H }
-    }, U = {
-      in: this.props.in,
-      appear: n,
-      enter: s,
-      exit: c,
-      mountOnEnter: b,
-      unmountOnExit: F,
-      timeout: {
-        enter: l,
-        exit: d
-      },
-      onEnter: () => {
-        u && u.call(void 0, { animatedElement: this.element, target: this });
-      },
-      onEntering: () => {
-        p && p.call(void 0, { animatedElement: this.element, target: this });
-      },
-      onEntered: () => {
-        f && f.call(void 0, { animatedElement: this.element, target: this });
-      },
-      onExit: () => {
-        m && m.call(void 0, { animatedElement: this.element, target: this });
-      },
-      onExiting: () => {
-        y && y.call(void 0, { animatedElement: this.element, target: this });
-      },
-      onExited: () => {
-        z && z.call(void 0, { animatedElement: this.element, target: this }), w && w.call(void 0, { animatedElement: this.element, target: this });
-      },
-      classNames: {
-        appear: k[`${r}-appear`] || `${r}-appear`,
-        appearActive: k[`${r}-appear-active`] || `${r}-appear-active`,
-        enter: k[`${r}-enter`] || `${r}-enter`,
-        enterActive: k[`${r}-enter-active`] || `${r}-enter-active`,
-        exit: k[`${r}-exit`] || `${r}-exit`,
-        exitActive: k[`${r}-exit-active`] || `${r}-exit-active`
-      }
-    };
-    return /* @__PURE__ */ a.createElement(_, { ...U, ...I, nodeRef: this.elementRef }, (j) => /* @__PURE__ */ a.createElement(
-      "div",
-      {
-        style: {
-          ...L,
-          ...M[j]
-        },
-        className: q,
-        ref: this.elementRef
-      },
-      i
-    ));
-  }
-}
-E.propTypes = {
-  in: e.bool,
-  children: e.oneOfType([
-    e.arrayOf(e.node),
-    e.node
-  ]),
-  transitionName: e.string.isRequired,
-  className: e.string,
-  appear: e.bool,
-  enter: e.bool,
-  exit: e.bool,
-  transitionEnterDuration: e.number.isRequired,
-  transitionExitDuration: e.number.isRequired,
-  mountOnEnter: e.bool,
-  unmountOnExit: e.bool,
-  animationEnteringStyle: e.object,
-  animationEnteredStyle: e.object,
-  animationExitingStyle: e.object,
-  animationExitedStyle: e.object
-};
-E.defaultProps = {
-  mountOnEnter: !0,
-  unmountOnExit: !1,
-  onEnter: v,
-  onEntering: v,
-  onEntered: v,
-  onExit: v,
-  onExiting: v,
-  onExited: v,
-  onAfterExited: v,
-  animationEnteringStyle: {},
-  animationEnteredStyle: {},
-  animationExitingStyle: {},
-  animationExitedStyle: {}
-};
-const Z = {
-  name: "@progress/kendo-react-animation",
-  productName: "KendoReact",
-  productCodes: ["KENDOUIREACT", "KENDOUICOMPLETE"],
-  publishDate: 1709631738,
-  version: "",
-  licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/"
-}, N = g.styles;
-class x extends a.Component {
-  constructor(i) {
-    super(i), V(Z);
-  }
-  /**
-   * @hidden
-   */
-  render() {
-    const {
-      id: i,
-      style: t,
-      children: n,
-      component: s,
-      className: c,
-      childFactory: r,
-      stackChildren: l,
-      componentChildStyle: d,
-      componentChildClassName: h,
-      ...u
-    } = this.props, p = {
-      id: i,
-      style: t,
-      component: s,
-      childFactory: r,
-      className: C(
-        N["animation-container"],
-        N["animation-container-relative"],
-        c
-      )
-    }, f = a.Children.map(n || null, (m) => /* @__PURE__ */ a.createElement(
-      E,
-      {
-        ...u,
-        style: d,
-        className: h
-      },
-      m
-    ));
-    return /* @__PURE__ */ a.createElement(B, { ...p }, f);
-  }
-}
-x.propTypes = {
-  children: e.oneOfType([
-    e.arrayOf(e.node),
-    e.node
-  ]),
-  childFactory: e.any,
-  className: e.string,
-  component: e.string,
-  id: e.string,
-  style: e.any,
-  transitionName: e.string.isRequired,
-  appear: e.bool.isRequired,
-  enter: e.bool.isRequired,
-  exit: e.bool.isRequired,
-  transitionEnterDuration: e.number.isRequired,
-  transitionExitDuration: e.number.isRequired
-};
-x.defaultProps = {
-  component: "div"
-};
-class D extends a.Component {
-  /**
-   * @hidden
-   */
-  render() {
-    const {
-      children: i,
-      ...t
-    } = this.props, n = {
-      transitionName: "fade"
-    };
-    return /* @__PURE__ */ a.createElement(x, { ...n, ...t }, i);
-  }
-}
-D.propTypes = {
-  children: e.oneOfType([
-    e.arrayOf(e.node),
-    e.node
-  ]),
-  childFactory: e.any,
-  className: e.string,
-  component: e.string,
-  id: e.string,
-  style: e.any
-};
-D.defaultProps = {
-  appear: !1,
-  enter: !0,
-  exit: !1,
-  transitionEnterDuration: 500,
-  transitionExitDuration: 500
-};
-class O extends a.Component {
-  /**
-   * @hidden
-   */
-  render() {
-    const {
-      direction: i,
-      children: t,
-      ...n
-    } = this.props, s = {
-      transitionName: `expand-${i}`
-    };
-    return /* @__PURE__ */ a.createElement(x, { ...s, ...n }, t);
-  }
-}
-O.propTypes = {
-  children: e.oneOfType([
-    e.arrayOf(e.node),
-    e.node
-  ]),
-  childFactory: e.any,
-  className: e.string,
-  direction: e.oneOf([
-    "horizontal",
-    "vertical"
-  ]),
-  component: e.string,
-  id: e.string,
-  style: e.any
-};
-O.defaultProps = {
-  appear: !1,
-  enter: !0,
-  exit: !0,
-  transitionEnterDuration: 300,
-  transitionExitDuration: 300,
-  direction: "vertical"
-};
-const J = { position: "absolute", top: "0", left: "0" };
-class S extends a.Component {
-  /**
-   * @hidden
-   */
-  render() {
-    const {
-      children: i,
-      direction: t,
-      ...n
-    } = this.props;
-    return /* @__PURE__ */ a.createElement(
-      x,
-      {
-        ...n,
-        transitionName: `push-${t}`,
-        animationExitingStyle: this.props.stackChildren ? J : void 0
-      },
-      i
-    );
-  }
-}
-S.propTypes = {
-  children: e.oneOfType([
-    e.arrayOf(e.node),
-    e.node
-  ]),
-  childFactory: e.any,
-  className: e.string,
-  direction: e.oneOf([
-    "up",
-    "down",
-    "left",
-    "right"
-  ]),
-  component: e.string,
-  id: e.string,
-  style: e.any,
-  stackChildren: e.bool
-};
-S.defaultProps = {
-  appear: !1,
-  enter: !0,
-  exit: !0,
-  transitionEnterDuration: 300,
-  transitionExitDuration: 300,
-  direction: "right",
-  stackChildren: !1
-};
-class T extends a.Component {
-  /**
-   * @hidden
-   */
-  render() {
-    const {
-      direction: i,
-      children: t,
-      ...n
-    } = this.props, s = {
-      transitionName: `slide-${i}`
-    };
-    return /* @__PURE__ */ a.createElement(x, { ...s, ...n }, t);
-  }
-}
-T.propTypes = {
-  children: e.oneOfType([
-    e.arrayOf(e.node),
-    e.node
-  ]),
-  childFactory: e.any,
-  className: e.string,
-  direction: e.oneOf([
-    "up",
-    "down",
-    "left",
-    "right"
-  ]),
-  component: e.string,
-  id: e.string,
-  style: e.any
-};
-T.defaultProps = {
-  appear: !1,
-  enter: !0,
-  exit: !0,
-  transitionEnterDuration: 300,
-  transitionExitDuration: 300,
-  direction: "down"
-};
-const Q = { position: "absolute", top: "0", left: "0" };
-class R extends a.Component {
-  /**
-   * @hidden
-   */
-  render() {
-    const {
-      children: i,
-      direction: t,
-      ...n
-    } = this.props;
-    return /* @__PURE__ */ a.createElement(
-      x,
-      {
-        ...n,
-        transitionName: `zoom-${t}`,
-        animationExitingStyle: this.props.stackChildren ? Q : void 0
-      },
-      i
-    );
-  }
-}
-R.propTypes = {
-  children: e.oneOfType([
-    e.arrayOf(e.node),
-    e.node
-  ]),
-  childFactory: e.any,
-  className: e.string,
-  direction: e.oneOf([
-    "in",
-    "out"
-  ]),
-  component: e.string,
-  id: e.string,
-  style: e.any,
-  stackChildren: e.bool
-};
-R.defaultProps = {
-  appear: !1,
-  enter: !0,
-  exit: !0,
-  transitionEnterDuration: 300,
-  transitionExitDuration: 300,
-  direction: "out",
-  stackChildren: !1
-};
-class $ extends a.Component {
-  constructor() {
-    super(...arguments), this.state = {
-      maxHeight: void 0,
-      maxWidth: void 0
-    }, this.componentWillEnter = (i) => {
-      const { onEnter: t, onBeforeEnter: n } = this.props;
-      n && n.call(void 0, i), this.updateContainerDimensions(i.animatedElement, () => {
-        t && t.call(void 0, i);
-      });
-    }, this.componentIsEntering = (i) => {
-      const { onEntering: t } = this.props;
-      this.updateContainerDimensions(i.animatedElement, () => {
-        t && t.call(void 0, i);
-      });
-    }, this.componentWillExit = (i) => {
-      const { onExit: t } = this.props;
-      this.updateContainerDimensions(i.animatedElement, () => {
-        t && t.call(void 0, i);
-      });
-    }, this.updateContainerDimensions = (i, t = v) => {
-      const n = i.firstChild;
-      if (n) {
-        const s = g.outerHeight(n), c = g.outerWidth(n);
-        this.setState(
-          {
-            maxHeight: s,
-            maxWidth: c
-          },
-          t
-        );
-      }
-    };
-  }
-  /**
-   * @hidden
-   */
-  render() {
-    const {
-      direction: i,
-      children: t,
-      childFactory: n,
-      ...s
-    } = this.props, {
-      maxHeight: c,
-      maxWidth: r
-    } = this.state;
-    let l;
-    i === "vertical" ? l = { maxHeight: c ? `${c}px` : "" } : l = { maxWidth: r ? `${r}px` : "" };
-    const d = {
-      maxHeight: l.maxHeight,
-      maxWidth: l.maxWidth
-    }, h = (u) => {
-      let p = n ? n(u) : u;
-      return p.props.in ? p : a.cloneElement(p, {
-        ...p.props,
-        style: {
-          ...p.props.style,
-          maxHeight: l.maxHeight,
-          maxWidth: l.maxWidth
-        }
-      });
-    };
-    return /* @__PURE__ */ a.createElement(
-      x,
-      {
-        ...s,
-        childFactory: h,
-        onEnter: this.componentWillEnter,
-        onEntering: this.componentIsEntering,
-        onExit: this.componentWillExit,
-        animationEnteringStyle: d,
-        transitionName: `reveal-${i}`
-      },
-      t
-    );
-  }
-}
-$.propTypes = {
-  children: e.oneOfType([
-    e.arrayOf(e.node),
-    e.node
-  ]),
-  childFactory: e.any,
-  className: e.string,
-  direction: e.oneOf([
-    "horizontal",
-    "vertical"
-  ]),
-  component: e.string,
-  id: e.string,
-  style: e.any
-};
-$.defaultProps = {
-  appear: !1,
-  enter: !0,
-  exit: !0,
-  transitionEnterDuration: 300,
-  transitionExitDuration: 300,
-  direction: "vertical"
-};
-const ne = (o, i) => {
-  const t = a.useRef(0), n = a.useRef(!1), s = a.useRef(), c = (r) => {
-    const l = r.duration;
-    let d, h, u = t.current && 1 - t.current;
-    r.onStart && r.onStart();
-    const p = (f) => {
-      d || (d = f), h = f - d + 1;
-      const m = h / l + u;
-      m <= 1 ? (r.onUpdate && r.onUpdate(m), s.current = window.requestAnimationFrame(p), t.current = m) : (r.onEnd && r.onEnd(1), t.current = 0);
-    };
-    s.current = window.requestAnimationFrame(p);
-  };
-  a.useEffect(
-    () => (c(o), () => {
-      s.current && window.cancelAnimationFrame(s.current);
-    }),
-    i
-  ), a.useEffect(
-    () => {
-      n.current = !0;
-    },
-    []
-  );
-};
+import { Animation as e } from "./Animation.mjs";
+import { AnimationChild as t } from "./AnimationChild.mjs";
+import { Fade as x } from "./Fade.mjs";
+import { Expand as i } from "./Expand.mjs";
+import { Push as a } from "./Push.mjs";
+import { Slide as l } from "./Slide.mjs";
+import { Zoom as u } from "./Zoom.mjs";
+import { Reveal as h } from "./Reveal.mjs";
+import { useAnimation as v } from "./hooks/useAnimation.mjs";
 export {
-  x as Animation,
-  E as AnimationChild,
-  O as Expand,
-  D as Fade,
-  S as Push,
-  $ as Reveal,
-  T as Slide,
-  R as Zoom,
-  ne as useAnimation
+  e as Animation,
+  t as AnimationChild,
+  i as Expand,
+  x as Fade,
+  a as Push,
+  h as Reveal,
+  l as Slide,
+  u as Zoom,
+  v as useAnimation
 };

package/package-metadata.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={name:"@progress/kendo-react-animation",productName:"KendoReact",productCodes:["KENDOUIREACT","KENDOUICOMPLETE"],publishDate:0,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"};exports.packageMetadata=e;