@dnb/eufemia 10.18.0 → 10.20.0

package/es/components/global-status/style/dnb-global-status.scss

@@ -6,38 +6,26 @@
 @import '../../../style/core/utilities.scss';
 
 .dnb-global-status {
-  --global-status-easing: var(--easing-default);
-
   &.dnb-section {
     display: block;
   }
 
   &__shell {
     width: 100%;
-    opacity: 1;
-
-    will-change: height;
-    transition:
-      height 800ms var(--global-status-easing),
-      opacity 600ms var(--global-status-easing);
-  }
 
-  &--hidden &__shell {
-    height: 0;
-    opacity: 0;
-  }
+    &.dnb-height-animation--hidden {
+      // Ensure Section is not overflowing with its after/before pseudo elements
+      overflow-y: clip;
+    }
 
-  &--no-animation &__shell,
-  html[data-visual-test] &__shell {
-    transition-duration: 1ms !important;
-  }
+    .dnb-hr,
+    .dnb-spacing & .dnb-hr:not([class*='dnb-space__bottom']) {
+      margin: 0 0 0 1rem;
 
-  &,
-  &--no-animation#{&}--visible {
-    display: flex;
-  }
-  &--no-animation#{&}--hidden {
-    display: none;
+      &::after {
+        top: calc(var(--thickness) * -1);
+      }
+    }
   }
 
   &__title {

package/es/components/global-status/style/themes/dnb-global-status-theme-ui.css

@@ -5,9 +5,6 @@
 /*
  * Utilities
  */
-.dnb-global-status:not(.dnb-global-status--no-animation).dnb-global-status--fade-in.dnb-global-status.dnb-section::after {
-  box-shadow: 99vw 0 0 0 currentcolor, 198vw 0 0 0 currentcolor, 297vw 0 0 0 currentcolor, 396vw 0 0 0 currentcolor, 0 0.0625rem 0 0 var(--color-black-80), 100vw 0.0625rem 0 0 var(--color-black-80);
-}
 .dnb-global-status__icon {
   font-size: 1rem;
 }

package/es/components/global-status/style/themes/dnb-global-status-theme-ui.min.css

@@ -1 +1 @@
-.dnb-global-status:not(.dnb-global-status--no-animation).dnb-global-status--fade-in.dnb-global-status.dnb-section:after{box-shadow:99vw 0 0 0 currentcolor,198vw 0 0 0 currentcolor,297vw 0 0 0 currentcolor,396vw 0 0 0 currentcolor,0 .0625rem 0 0 var(--color-black-80),100vw .0625rem 0 0 var(--color-black-80)}.dnb-global-status__icon{font-size:1rem}.dnb-global-status__message.dnb-section--white ::selection{background-color:var(--color-mint-green)}.dnb-global-status__content .dnb-hr{color:var(--color-fire-red)}.dnb-global-status--info .dnb-global-status__content .dnb-hr{color:var(--color-sea-green)}.dnb-global-status--warning .dnb-global-status__content .dnb-hr{color:var(--color-accent-yellow)}.dnb-global-status--success .dnb-global-status__content .dnb-hr{color:var(--color-ocean-green)}
+.dnb-global-status__icon{font-size:1rem}.dnb-global-status__message.dnb-section--white ::selection{background-color:var(--color-mint-green)}.dnb-global-status__content .dnb-hr{color:var(--color-fire-red)}.dnb-global-status--info .dnb-global-status__content .dnb-hr{color:var(--color-sea-green)}.dnb-global-status--warning .dnb-global-status__content .dnb-hr{color:var(--color-accent-yellow)}.dnb-global-status--success .dnb-global-status__content .dnb-hr{color:var(--color-ocean-green)}

package/es/components/global-status/style/themes/dnb-global-status-theme-ui.scss

@@ -6,16 +6,6 @@
 @import '../../../../style/core/utilities.scss';
 
 .dnb-global-status {
-  &:not(#{&}--no-animation)#{&}--fade-in#{&}.dnb-section::after {
-    box-shadow:
-      99vw 0 0 0 currentcolor,
-      198vw 0 0 0 currentcolor,
-      297vw 0 0 0 currentcolor,
-      396vw 0 0 0 currentcolor,
-      0 0.0625rem 0 0 var(--color-black-80),
-      100vw 0.0625rem 0 0 var(--color-black-80);
-  }
-
   &__icon {
     font-size: 1rem;
   }

package/es/components/height-animation/HeightAnimation.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
-import type { SpacingProps } from '../../shared/types';
 import { useHeightAnimationOptions } from './useHeightAnimation';
-import type { DynamicElement } from '../../shared/types';
+import type { DynamicElement, SpacingProps } from '../../shared/types';
 export type HeightAnimationProps = {
     /**
      * Whether the nested children content should be kept in the DOM or not.
@@ -14,10 +13,15 @@ export type HeightAnimationProps = {
      */
     showOverflow?: boolean;
     /**
-     * Set to `true` ensure the nested children content will be kept in the DOM.
+     * Defines the duration of the animation in milliseconds.
      * Default: 400
      */
     duration?: number;
+    /**
+     * Defines the delay of the animation in milliseconds.
+     * Default: 0
+     */
+    delay?: number;
     /**
      * Define a custom HTML Element.
      * Default: div
@@ -30,4 +34,8 @@ export type HeightAnimationProps = {
     innerRef?: React.RefObject<HTMLElement>;
 } & useHeightAnimationOptions;
 export type HeightAnimationAllProps = HeightAnimationProps & SpacingProps & Omit<React.HTMLProps<HTMLElement>, 'ref'>;
-export default function HeightAnimation({ open, animate, keepInDOM, showOverflow, element, duration, className, innerRef, children, onInit, onOpen, onAnimationEnd, ...rest }: HeightAnimationAllProps): import("react/jsx-runtime").JSX.Element;
+declare function HeightAnimation({ open, animate, keepInDOM, showOverflow, element, duration, delay, className, innerRef, children, onInit, onOpen, onAnimationStart, onAnimationEnd, ...rest }: HeightAnimationAllProps): import("react/jsx-runtime").JSX.Element;
+declare namespace HeightAnimation {
+    var _supportsSpacingProps: string;
+}
+export default HeightAnimation;

package/es/components/height-animation/HeightAnimation.js

@@ -1,11 +1,16 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-const _excluded = ["open", "animate", "keepInDOM", "showOverflow", "element", "duration", "className", "innerRef", "children", "onInit", "onOpen", "onAnimationEnd"];
-import React from 'react';
+const _excluded = ["open", "animate", "keepInDOM", "showOverflow", "element", "duration", "delay", "className", "innerRef", "children", "onInit", "onOpen", "onAnimationStart", "onAnimationEnd"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import React, { useRef } from 'react';
 import classnames from 'classnames';
 import { useHeightAnimation } from './useHeightAnimation';
 import Space from '../space/Space';
-export default function HeightAnimation(_ref) {
+function HeightAnimation(_ref) {
   let {
       open = true,
       animate = true,
@@ -13,42 +18,50 @@ export default function HeightAnimation(_ref) {
       showOverflow = false,
       element,
       duration,
+      delay,
       className,
       innerRef,
       children,
       onInit = null,
       onOpen = null,
+      onAnimationStart = null,
       onAnimationEnd = null
     } = _ref,
     rest = _objectWithoutProperties(_ref, _excluded);
-  const ref = React.useRef();
-  const props = rest;
+  const elementRef = useRef();
+  const targetRef = innerRef || elementRef;
   const {
     isInDOM,
     isVisible,
     isVisibleParallax,
-    isAnimating
-  } = useHeightAnimation(innerRef || ref, {
+    isAnimating,
+    firstPaintStyle
+  } = useHeightAnimation(targetRef, {
     open,
     animate,
     children,
     onInit,
     onOpen,
+    onAnimationStart,
     onAnimationEnd
   });
-  if (!isInDOM && !keepInDOM) {
+  if (!keepInDOM && !isInDOM && !isAnimating) {
     return null;
   }
-  const style = {};
   if (duration) {
-    style['--duration'] = `${duration}ms`;
+    firstPaintStyle['--duration'] = `${duration}ms`;
+  }
+  if (delay) {
+    firstPaintStyle['--delay'] = `${delay}ms`;
   }
   return React.createElement(Space, _extends({
-    innerRef: innerRef || ref,
+    innerRef: targetRef,
     element: element || 'div',
-    className: classnames('dnb-height-animation', className, isVisible ? 'dnb-height-animation--is-visible' : !isAnimating && !open && 'dnb-height-animation--hidden', isInDOM && 'dnb-height-animation--is-in-dom', isVisibleParallax && 'dnb-height-animation--parallax', isAnimating && 'dnb-height-animation--animating', showOverflow && 'dnb-height-animation--show-overflow'),
-    style: style,
+    className: classnames('dnb-height-animation', className, isVisible ? 'dnb-height-animation--is-visible' : !isAnimating && !open && 'dnb-height-animation--hidden', isInDOM && 'dnb-height-animation--is-in-dom', animate && isVisibleParallax && 'dnb-height-animation--parallax', isAnimating && 'dnb-height-animation--animating', showOverflow && 'dnb-height-animation--show-overflow'),
+    style: _objectSpread(_objectSpread({}, firstPaintStyle), rest === null || rest === void 0 ? void 0 : rest.style),
     "aria-hidden": keepInDOM ? !open : undefined
-  }, props), children);
+  }, rest), children);
 }
+HeightAnimation._supportsSpacingProps = 'children';
+export default HeightAnimation;
 //# sourceMappingURL=HeightAnimation.js.map

package/es/components/height-animation/HeightAnimation.js.map

@@ -1 +1 @@
-{"version":3,"file":"HeightAnimation.js","names":["React","classnames","useHeightAnimation","Space","HeightAnimation","_ref","open","animate","keepInDOM","showOverflow","element","duration","className","innerRef","children","onInit","onOpen","onAnimationEnd","rest","_objectWithoutProperties","_excluded","ref","useRef","props","isInDOM","isVisible","isVisibleParallax","isAnimating","style","createElement","_extends","undefined"],"sources":["../../../../src/components/height-animation/HeightAnimation.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport type { SpacingProps } from '../../shared/types'\nimport {\n  useHeightAnimation,\n  useHeightAnimationOptions,\n} from './useHeightAnimation'\nimport Space, { SpaceProps } from '../space/Space'\n\nimport type { DynamicElement } from '../../shared/types'\n\nexport type HeightAnimationProps = {\n  /**\n   * Whether the nested children content should be kept in the DOM or not.\n   * Default: false\n   */\n  keepInDOM?: boolean\n\n  /**\n   * Set to `true` to omit the usage of \"overflow: hidden;\"\n   * Default: false\n   */\n  showOverflow?: boolean\n\n  /**\n   * Set to `true` ensure the nested children content will be kept in the DOM.\n   * Default: 400\n   */\n  duration?: number\n\n  /**\n   * Define a custom HTML Element.\n   * Default: div\n   */\n  element?: DynamicElement\n\n  /**\n   * Send along a custom React Ref.\n   * Default: null\n   */\n  innerRef?: React.RefObject<HTMLElement>\n} & useHeightAnimationOptions\n\nexport type HeightAnimationAllProps = HeightAnimationProps &\n  SpacingProps &\n  Omit<React.HTMLProps<HTMLElement>, 'ref'>\n\nexport default function HeightAnimation({\n  open = true,\n  animate = true,\n  keepInDOM = false,\n  showOverflow = false,\n  element,\n  duration,\n  className,\n  innerRef,\n  children,\n  onInit = null,\n  onOpen = null,\n  onAnimationEnd = null,\n  ...rest\n}: HeightAnimationAllProps) {\n  const ref = React.useRef<HTMLElement>()\n  const props = rest as SpaceProps\n\n  const { isInDOM, isVisible, isVisibleParallax, isAnimating } =\n    useHeightAnimation(innerRef || ref, {\n      open,\n      animate,\n      children,\n      onInit,\n      onOpen,\n      onAnimationEnd,\n    })\n\n  if (!isInDOM && !keepInDOM) {\n    return null\n  }\n\n  const style: React.CSSProperties = {}\n  if (duration) {\n    style['--duration'] = `${duration}ms`\n  }\n\n  return (\n    <Space\n      innerRef={innerRef || ref}\n      element={element || 'div'}\n      className={classnames(\n        'dnb-height-animation',\n        isInDOM && 'dnb-height-animation--is-in-dom',\n        isVisible && 'dnb-height-animation--is-visible',\n        isVisibleParallax && 'dnb-height-animation--parallax',\n        isAnimating && 'dnb-height-animation--animating',\n        !isVisible &&\n          !isAnimating &&\n          !open &&\n          'dnb-height-animation--hidden',\n        showOverflow && 'dnb-height-animation--show-overflow',\n        className\n      )}\n      style={style}\n      aria-hidden={keepInDOM ? !open : undefined}\n      {...props}\n    >\n      {children}\n    </Space>\n  )\n}\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AAEnC,SACEC,kBAAkB,QAEb,sBAAsB;AAC7B,OAAOC,KAAK,MAAsB,gBAAgB;AAwClD,eAAe,SAASC,eAAeA,CAAAC,IAAA,EAcX;EAAA,IAdY;MACtCC,IAAI,GAAG,IAAI;MACXC,OAAO,GAAG,IAAI;MACdC,SAAS,GAAG,KAAK;MACjBC,YAAY,GAAG,KAAK;MACpBC,OAAO;MACPC,QAAQ;MACRC,SAAS;MACTC,QAAQ;MACRC,QAAQ;MACRC,MAAM,GAAG,IAAI;MACbC,MAAM,GAAG,IAAI;MACbC,cAAc,GAAG;IAEM,CAAC,GAAAZ,IAAA;IADrBa,IAAI,GAAAC,wBAAA,CAAAd,IAAA,EAAAe,SAAA;EAEP,MAAMC,GAAG,GAAGrB,KAAK,CAACsB,MAAM,CAAc,CAAC;EACvC,MAAMC,KAAK,GAAGL,IAAkB;EAEhC,MAAM;IAAEM,OAAO;IAAEC,SAAS;IAAEC,iBAAiB;IAAEC;EAAY,CAAC,GAC1DzB,kBAAkB,CAACW,QAAQ,IAAIQ,GAAG,EAAE;IAClCf,IAAI;IACJC,OAAO;IACPO,QAAQ;IACRC,MAAM;IACNC,MAAM;IACNC;EACF,CAAC,CAAC;EAEJ,IAAI,CAACO,OAAO,IAAI,CAAChB,SAAS,EAAE;IAC1B,OAAO,IAAI;EACb;EAEA,MAAMoB,KAA0B,GAAG,CAAC,CAAC;EACrC,IAAIjB,QAAQ,EAAE;IACZiB,KAAK,CAAC,YAAY,CAAC,GAAI,GAAEjB,QAAS,IAAG;EACvC;EAEA,OACEX,KAAA,CAAA6B,aAAA,CAAC1B,KAAK,EAAA2B,QAAA;IACJjB,QAAQ,EAAEA,QAAQ,IAAIQ,GAAI;IAC1BX,OAAO,EAAEA,OAAO,IAAI,KAAM;IAC1BE,SAAS,EAAEX,UAAU,CACnB,sBAAsB,EAUtBW,SAAS,EARTa,SAAS,GAAI,kCAAkC,GAI7C,CAACE,WAAW,IACZ,CAACrB,IAAI,IACL,8BAA8B,EAPhCkB,OAAO,IAAI,iCAAiC,EAE5CE,iBAAiB,IAAI,gCAAgC,EACrDC,WAAW,IAAI,iCAAiC,EAKhDlB,YAAY,IAAI,qCAElB,CAAE;IACFmB,KAAK,EAAEA,KAAM;IACb,eAAapB,SAAS,GAAG,CAACF,IAAI,GAAGyB;EAAU,GACvCR,KAAK,GAERT,QACI,CAAC;AAEZ"}
+{"version":3,"file":"HeightAnimation.js","names":["React","useRef","classnames","useHeightAnimation","Space","HeightAnimation","_ref","open","animate","keepInDOM","showOverflow","element","duration","delay","className","innerRef","children","onInit","onOpen","onAnimationStart","onAnimationEnd","rest","_objectWithoutProperties","_excluded","elementRef","targetRef","isInDOM","isVisible","isVisibleParallax","isAnimating","firstPaintStyle","createElement","_extends","style","_objectSpread","undefined","_supportsSpacingProps"],"sources":["../../../../src/components/height-animation/HeightAnimation.tsx"],"sourcesContent":["import React, { useRef } from 'react'\nimport classnames from 'classnames'\nimport {\n  useHeightAnimation,\n  useHeightAnimationOptions,\n} from './useHeightAnimation'\nimport Space from '../space/Space'\n\nimport type { DynamicElement, SpacingProps } from '../../shared/types'\n\nexport type HeightAnimationProps = {\n  /**\n   * Whether the nested children content should be kept in the DOM or not.\n   * Default: false\n   */\n  keepInDOM?: boolean\n\n  /**\n   * Set to `true` to omit the usage of \"overflow: hidden;\"\n   * Default: false\n   */\n  showOverflow?: boolean\n\n  /**\n   * Defines the duration of the animation in milliseconds.\n   * Default: 400\n   */\n  duration?: number\n\n  /**\n   * Defines the delay of the animation in milliseconds.\n   * Default: 0\n   */\n  delay?: number\n\n  /**\n   * Define a custom HTML Element.\n   * Default: div\n   */\n  element?: DynamicElement\n\n  /**\n   * Send along a custom React Ref.\n   * Default: null\n   */\n  innerRef?: React.RefObject<HTMLElement>\n} & useHeightAnimationOptions\n\nexport type HeightAnimationAllProps = HeightAnimationProps &\n  SpacingProps &\n  Omit<React.HTMLProps<HTMLElement>, 'ref'>\n\nfunction HeightAnimation({\n  open = true,\n  animate = true,\n  keepInDOM = false,\n  showOverflow = false,\n  element,\n  duration,\n  delay,\n  className,\n  innerRef,\n  children,\n  onInit = null,\n  onOpen = null,\n  onAnimationStart = null,\n  onAnimationEnd = null,\n  ...rest\n}: HeightAnimationAllProps) {\n  const elementRef = useRef<HTMLElement>()\n  const targetRef = innerRef || elementRef\n\n  const {\n    isInDOM,\n    isVisible,\n    isVisibleParallax,\n    isAnimating,\n    firstPaintStyle,\n  } = useHeightAnimation(targetRef, {\n    open,\n    animate,\n    children,\n    onInit,\n    onOpen,\n    onAnimationStart,\n    onAnimationEnd,\n  })\n\n  if (!keepInDOM && !isInDOM && !isAnimating) {\n    return null\n  }\n\n  if (duration) {\n    firstPaintStyle['--duration'] = `${duration}ms`\n  }\n  if (delay) {\n    firstPaintStyle['--delay'] = `${delay}ms`\n  }\n\n  return (\n    <Space\n      innerRef={targetRef}\n      element={element || 'div'}\n      className={classnames(\n        'dnb-height-animation',\n        isInDOM && 'dnb-height-animation--is-in-dom',\n        isVisible && 'dnb-height-animation--is-visible',\n        animate && isVisibleParallax && 'dnb-height-animation--parallax',\n        isAnimating && 'dnb-height-animation--animating',\n        !isVisible &&\n          !isAnimating &&\n          !open &&\n          'dnb-height-animation--hidden',\n        showOverflow && 'dnb-height-animation--show-overflow',\n        className\n      )}\n      style={{ ...firstPaintStyle, ...rest?.style }}\n      aria-hidden={keepInDOM ? !open : undefined}\n      {...rest}\n    >\n      {children}\n    </Space>\n  )\n}\n\nHeightAnimation._supportsSpacingProps = 'children'\n\nexport default HeightAnimation\n"],"mappings":";;;;;;;;AAAA,OAAOA,KAAK,IAAIC,MAAM,QAAQ,OAAO;AACrC,OAAOC,UAAU,MAAM,YAAY;AACnC,SACEC,kBAAkB,QAEb,sBAAsB;AAC7B,OAAOC,KAAK,MAAM,gBAAgB;AA8ClC,SAASC,eAAeA,CAAAC,IAAA,EAgBI;EAAA,IAhBH;MACvBC,IAAI,GAAG,IAAI;MACXC,OAAO,GAAG,IAAI;MACdC,SAAS,GAAG,KAAK;MACjBC,YAAY,GAAG,KAAK;MACpBC,OAAO;MACPC,QAAQ;MACRC,KAAK;MACLC,SAAS;MACTC,QAAQ;MACRC,QAAQ;MACRC,MAAM,GAAG,IAAI;MACbC,MAAM,GAAG,IAAI;MACbC,gBAAgB,GAAG,IAAI;MACvBC,cAAc,GAAG;IAEM,CAAC,GAAAd,IAAA;IADrBe,IAAI,GAAAC,wBAAA,CAAAhB,IAAA,EAAAiB,SAAA;EAEP,MAAMC,UAAU,GAAGvB,MAAM,CAAc,CAAC;EACxC,MAAMwB,SAAS,GAAGV,QAAQ,IAAIS,UAAU;EAExC,MAAM;IACJE,OAAO;IACPC,SAAS;IACTC,iBAAiB;IACjBC,WAAW;IACXC;EACF,CAAC,GAAG3B,kBAAkB,CAACsB,SAAS,EAAE;IAChClB,IAAI;IACJC,OAAO;IACPQ,QAAQ;IACRC,MAAM;IACNC,MAAM;IACNC,gBAAgB;IAChBC;EACF,CAAC,CAAC;EAEF,IAAI,CAACX,SAAS,IAAI,CAACiB,OAAO,IAAI,CAACG,WAAW,EAAE;IAC1C,OAAO,IAAI;EACb;EAEA,IAAIjB,QAAQ,EAAE;IACZkB,eAAe,CAAC,YAAY,CAAC,GAAI,GAAElB,QAAS,IAAG;EACjD;EACA,IAAIC,KAAK,EAAE;IACTiB,eAAe,CAAC,SAAS,CAAC,GAAI,GAAEjB,KAAM,IAAG;EAC3C;EAEA,OACEb,KAAA,CAAA+B,aAAA,CAAC3B,KAAK,EAAA4B,QAAA;IACJjB,QAAQ,EAAEU,SAAU;IACpBd,OAAO,EAAEA,OAAO,IAAI,KAAM;IAC1BG,SAAS,EAAEZ,UAAU,CACnB,sBAAsB,EAUtBY,SAAS,EARTa,SAAS,GAAI,kCAAkC,GAI7C,CAACE,WAAW,IACZ,CAACtB,IAAI,IACL,8BAA8B,EAPhCmB,OAAO,IAAI,iCAAiC,EAE5ClB,OAAO,IAAIoB,iBAAiB,IAAI,gCAAgC,EAChEC,WAAW,IAAI,iCAAiC,EAKhDnB,YAAY,IAAI,qCAElB,CAAE;IACFuB,KAAK,EAAAC,aAAA,CAAAA,aAAA,KAAOJ,eAAe,GAAKT,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEY,KAAK,CAAG;IAC9C,eAAaxB,SAAS,GAAG,CAACF,IAAI,GAAG4B;EAAU,GACvCd,IAAI,GAEPL,QACI,CAAC;AAEZ;AAEAX,eAAe,CAAC+B,qBAAqB,GAAG,UAAU;AAElD,eAAe/B,eAAe"}

package/es/components/height-animation/HeightAnimationInstance.d.ts

@@ -16,8 +16,8 @@ export type HeightAnimationContainer = HTMLElement;
 export type HeightAnimationFromHeight = number;
 export type HeightAnimationToHeight = number;
 export default class HeightAnimation {
+    private state;
     isInBrowser: boolean;
-    state: HeightAnimationStates;
     onStartStack: HeightAnimationOnStartStack;
     onEndStack: HeightAnimationOnEndStack;
     events: HeightAnimationEvents;
@@ -26,33 +26,50 @@ export default class HeightAnimation {
     reqId1: number;
     reqId2: number;
     resizeTimeout: NodeJS.Timeout;
+    timeouts: NodeJS.Timeout[];
+    firstTime?: number;
+    startTime?: number;
+    duration?: number;
     isAnimating: boolean;
     __currentHeight: number;
-    onResize: () => void;
     constructor(opts?: HeightAnimationOptions);
-    _callOnStart(): void;
-    _callOnEnd(): void;
-    reset(): void;
-    _restore(): void;
-    _addEndEvents(listener: HeightAnimationEventListener): void;
-    _removeEndEvents(): void;
-    _emitTransitionEnd(): void;
+    callAnimationStart(): void;
+    callAnimationEnd(): void;
+    addEndEvent(listener: HeightAnimationEventListener): void;
+    removeEndEvents(): void;
     setElement(elem: HeightAnimationElement): void;
+    setState(state: HeightAnimationStates): void;
+    setOptions(opts: HeightAnimationOptions): void;
+    getOptions(): HeightAnimationOptions;
     remove(): void;
+    setAsOpen(): void;
+    setAsClosed(): void;
     getHeight(): number;
-    getWidth(): string;
+    firstPaintStyle(): {
+        position: string;
+        visibility: string;
+        opacity: string;
+        height: string;
+    };
     getUnknownHeight(): number;
     onStart(fn: HeightAnimationOnStartCallback): void;
     onEnd(fn: HeightAnimationOnEndCallback): void;
-    start(fromHeight: HeightAnimationFromHeight, toHeight: HeightAnimationToHeight, { animate }?: HeightAnimationOptions): void;
+    start(fromHeight: HeightAnimationFromHeight, toHeight: HeightAnimationToHeight): void;
     stop(): void;
+    open(): void;
+    close(): void;
+    adjustTo(fromHeight?: HeightAnimationFromHeight, toHeight?: HeightAnimationToHeight): void;
+    readjust(): void;
     /**
-     * Deprecated
-     * "adjustFrom" is only used by GlobalStatus.js
-     * it should be replaced with "useHeightAnimation"
+     * Determines whether the animation can finish.
+     * Check for certain states and if the time passed is too short.
+     * With a so short first state change, we do not call animation end.
      */
-    adjustFrom(height?: HeightAnimationFromHeight): number;
-    adjustTo(fromHeight?: HeightAnimationFromHeight, toHeight?: HeightAnimationToHeight, { animate }?: HeightAnimationOptions): void;
-    open({ animate }?: HeightAnimationOptions): void;
-    close({ animate }?: HeightAnimationOptions): void;
+    canFinish(): boolean;
+    /**
+     * Determines whether the animation should be bypassed.
+     * Check for certain states and if the time passed is too short to be correct.
+     * With a very short first state change, we skip animation.
+     */
+    shouldBypassAnimation(): boolean;
 }