@deephaven/components 1.7.2-beta.1 → 1.7.2-beta.4

package/dist/transitions/FadeTransition.js

@@ -1,4 +1,4 @@
-var _excluded = ["className", "timeout"];
+var _excluded = ["classNames", "timeout", "children", "onEnter"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -6,24 +6,52 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+import { useCallback, useRef } from 'react';
 import { CSSTransition } from 'react-transition-group';
 import classNames from 'classnames';
 import ThemeExport from "../ThemeExport.js";
 import { jsx as _jsx } from "react/jsx-runtime";
+var DISPLAY_CONTENTS = {
+  display: 'contents'
+};
 /**
  * Fade between two components. Defaults to 150ms transition.
  */
 function FadeTransition(_ref) {
   var {
-      className,
-      timeout = ThemeExport.transitionMs
+      classNames: classNamesProp,
+      timeout = ThemeExport.transitionMs,
+      children,
+      onEnter
     } = _ref,
     props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/_jsx(CSSTransition, _objectSpread({
+  var nodeRef = useRef(null);
+  var handleOnEnter = useCallback(isAppearing => {
+    var elem = nodeRef.current;
+    if (!elem) {
+      return;
+    }
+    onEnter === null || onEnter === void 0 || onEnter(elem, isAppearing);
+  }, [onEnter]);
+
+  // Mimics findDOMNode for CSSTransition
+  // The ref should be set before CSSTransition does anything with it
+  var setRef = useCallback(node => {
+    nodeRef.current = node === null || node === void 0 ? void 0 : node.firstElementChild;
+  }, []);
+  return /*#__PURE__*/_jsx(CSSTransition, _objectSpread(_objectSpread({
+    nodeRef: nodeRef,
     timeout: timeout,
-    classNames: classNames('fade', className)
+    classNames: classNames('fade', classNamesProp),
+    onEnter: handleOnEnter
     // eslint-disable-next-line react/jsx-props-no-spreading
-  }, props));
+  }, props), {}, {
+    children: /*#__PURE__*/_jsx("div", {
+      ref: setRef,
+      style: DISPLAY_CONTENTS,
+      children: children
+    })
+  }));
 }
 export default FadeTransition;
 //# sourceMappingURL=FadeTransition.js.map

package/dist/transitions/FadeTransition.js.map

@@ -1 +1 @@
-{"version":3,"file":"FadeTransition.js","names":["CSSTransition","classNames","ThemeExport","jsx","_jsx","FadeTransition","_ref","className","timeout","transitionMs","props","_objectWithoutProperties","_excluded","_objectSpread"],"sources":["../../src/transitions/FadeTransition.tsx"],"sourcesContent":["import { CSSTransition } from 'react-transition-group';\nimport type { CSSTransitionProps } from 'react-transition-group/CSSTransition';\nimport type { EndHandler } from 'react-transition-group/Transition';\nimport classNames from 'classnames';\nimport ThemeExport from '../ThemeExport';\n\ntype FadeTransitionProps<Ref extends undefined | HTMLElement = undefined> =\n  // We default the timeout, so user doesn't need to provide it\n  // However, CSSTransitionProps get confused if you don't provide a timeout, it requires an endHandler\n  // We're just making the endHandler optional here, as the timeout has a default\n  Omit<CSSTransitionProps<Ref>, 'addEndHandler'> & {\n    addEndHandler?: EndHandler<Ref> | undefined;\n  };\n\n/**\n * Fade between two components. Defaults to 150ms transition.\n */\nfunction FadeTransition<Ref extends undefined | HTMLElement = undefined>({\n  className,\n  timeout = ThemeExport.transitionMs,\n  ...props\n}: FadeTransitionProps<Ref>): JSX.Element {\n  return (\n    <CSSTransition\n      timeout={timeout}\n      classNames={classNames('fade', className)}\n      // eslint-disable-next-line react/jsx-props-no-spreading\n      {...props}\n    />\n  );\n}\n\nexport default FadeTransition;\n"],"mappings":";;;;;;;;AAAA,SAASA,aAAa,QAAQ,wBAAwB;AAGtD,OAAOC,UAAU,MAAM,YAAY;AAAC,OAC7BC,WAAW;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAUlB;AACA;AACA;AACA,SAASC,cAAcA,CAAAC,IAAA,EAImB;EAAA,IAJ+B;MACvEC,SAAS;MACTC,OAAO,GAAGN,WAAW,CAACO;IAEE,CAAC,GAAAH,IAAA;IADtBI,KAAK,GAAAC,wBAAA,CAAAL,IAAA,EAAAM,SAAA;EAER,oBACER,IAAA,CAACJ,aAAa,EAAAa,aAAA;IACZL,OAAO,EAAEA,OAAQ;IACjBP,UAAU,EAAEA,UAAU,CAAC,MAAM,EAAEM,SAAS;IACxC;EAAA,GACIG,KAAK,CACV,CAAC;AAEN;AAEA,eAAeL,cAAc"}
+{"version":3,"file":"FadeTransition.js","names":["useCallback","useRef","CSSTransition","classNames","ThemeExport","jsx","_jsx","DISPLAY_CONTENTS","display","FadeTransition","_ref","classNamesProp","timeout","transitionMs","children","onEnter","props","_objectWithoutProperties","_excluded","nodeRef","handleOnEnter","isAppearing","elem","current","setRef","node","firstElementChild","_objectSpread","ref","style"],"sources":["../../src/transitions/FadeTransition.tsx"],"sourcesContent":["import { useCallback, useRef } from 'react';\nimport { CSSTransition } from 'react-transition-group';\nimport type { CSSTransitionProps } from 'react-transition-group/CSSTransition';\nimport type {\n  EndHandler,\n  EnterHandler,\n} from 'react-transition-group/Transition';\nimport classNames from 'classnames';\nimport type { RemoveIndexSignature } from '@deephaven/utils';\nimport ThemeExport from '../ThemeExport';\n\nconst DISPLAY_CONTENTS = { display: 'contents' };\n\ntype FadeTransitionProps =\n  // We default the timeout, so user doesn't need to provide it\n  // However, CSSTransitionProps get confused if you don't provide a timeout, it requires an endHandler\n  // We're just making the endHandler optional here, as the timeout has a default\n  Omit<\n    RemoveIndexSignature<CSSTransitionProps<HTMLElement>>,\n    'addEndHandler' | 'children' | 'onEnter'\n  > & {\n    addEndHandler?: EndHandler<HTMLElement> | undefined;\n    onEnter?: EnterHandler<undefined>;\n    children?: React.ReactNode;\n  };\n\n/**\n * Fade between two components. Defaults to 150ms transition.\n */\nfunction FadeTransition({\n  classNames: classNamesProp,\n  timeout = ThemeExport.transitionMs,\n  children,\n  onEnter,\n  ...props\n}: FadeTransitionProps): JSX.Element {\n  const nodeRef = useRef<HTMLElement | null>(null);\n  const handleOnEnter = useCallback(\n    (isAppearing: boolean) => {\n      const elem = nodeRef.current;\n      if (!elem) {\n        return;\n      }\n      onEnter?.(elem, isAppearing);\n    },\n    [onEnter]\n  );\n\n  // Mimics findDOMNode for CSSTransition\n  // The ref should be set before CSSTransition does anything with it\n  const setRef = useCallback((node: HTMLElement | null) => {\n    nodeRef.current = node?.firstElementChild as HTMLElement;\n  }, []);\n\n  return (\n    <CSSTransition\n      nodeRef={nodeRef}\n      timeout={timeout}\n      classNames={classNames('fade', classNamesProp)}\n      onEnter={handleOnEnter}\n      // eslint-disable-next-line react/jsx-props-no-spreading\n      {...props}\n    >\n      <div ref={setRef} style={DISPLAY_CONTENTS}>\n        {children}\n      </div>\n    </CSSTransition>\n  );\n}\n\nexport default FadeTransition;\n"],"mappings":";;;;;;;;AAAA,SAASA,WAAW,EAAEC,MAAM,QAAQ,OAAO;AAC3C,SAASC,aAAa,QAAQ,wBAAwB;AAMtD,OAAOC,UAAU,MAAM,YAAY;AAAC,OAE7BC,WAAW;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAElB,IAAMC,gBAAgB,GAAG;EAAEC,OAAO,EAAE;AAAW,CAAC;AAehD;AACA;AACA;AACA,SAASC,cAAcA,CAAAC,IAAA,EAMc;EAAA,IANb;MACtBP,UAAU,EAAEQ,cAAc;MAC1BC,OAAO,GAAGR,WAAW,CAACS,YAAY;MAClCC,QAAQ;MACRC;IAEmB,CAAC,GAAAL,IAAA;IADjBM,KAAK,GAAAC,wBAAA,CAAAP,IAAA,EAAAQ,SAAA;EAER,IAAMC,OAAO,GAAGlB,MAAM,CAAqB,IAAI,CAAC;EAChD,IAAMmB,aAAa,GAAGpB,WAAW,CAC9BqB,WAAoB,IAAK;IACxB,IAAMC,IAAI,GAAGH,OAAO,CAACI,OAAO;IAC5B,IAAI,CAACD,IAAI,EAAE;MACT;IACF;IACAP,OAAO,aAAPA,OAAO,eAAPA,OAAO,CAAGO,IAAI,EAAED,WAAW,CAAC;EAC9B,CAAC,EACD,CAACN,OAAO,CACV,CAAC;;EAED;EACA;EACA,IAAMS,MAAM,GAAGxB,WAAW,CAAEyB,IAAwB,IAAK;IACvDN,OAAO,CAACI,OAAO,GAAGE,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEC,iBAAgC;EAC1D,CAAC,EAAE,EAAE,CAAC;EAEN,oBACEpB,IAAA,CAACJ,aAAa,EAAAyB,aAAA,CAAAA,aAAA;IACZR,OAAO,EAAEA,OAAQ;IACjBP,OAAO,EAAEA,OAAQ;IACjBT,UAAU,EAAEA,UAAU,CAAC,MAAM,EAAEQ,cAAc,CAAE;IAC/CI,OAAO,EAAEK;IACT;EAAA,GACIJ,KAAK;IAAAF,QAAA,eAETR,IAAA;MAAKsB,GAAG,EAAEJ,MAAO;MAACK,KAAK,EAAEtB,gBAAiB;MAAAO,QAAA,EACvCA;IAAQ,CACN;EAAC,EACO,CAAC;AAEpB;AAEA,eAAeL,cAAc","ignoreList":[]}

package/dist/transitions/SlideTransition.d.ts

@@ -1,9 +1,10 @@
 import type { CSSTransitionProps } from 'react-transition-group/CSSTransition';
 import type { EndHandler } from 'react-transition-group/Transition';
+import type { RemoveIndexSignature } from '@deephaven/utils';
 type SlideDirection = 'left' | 'right';
-type SlideTransitionProps<Ref extends undefined | HTMLElement = undefined> = Omit<CSSTransitionProps<Ref>, 'addEndHandler'> & {
-    addEndHandler?: EndHandler<Ref> | undefined;
-} & {
+type SlideTransitionProps = Omit<RemoveIndexSignature<CSSTransitionProps<HTMLElement>>, 'addEndHandler'> & {
+    addEndHandler?: EndHandler<HTMLElement> | undefined;
+    children?: React.ReactNode;
     /**
      * The direction of the slide transition. Defaults to left.
      */
@@ -15,7 +16,7 @@ type SlideTransitionProps<Ref extends undefined | HTMLElement = undefined> = Omi
  * Defaults to sliding left, unless `direction='right'` is provided.
  * Timeout defaults to 200ms.
  */
-declare function SlideTransition({ direction, className, 
+declare function SlideTransition({ direction, classNames: classNamesProp, children, 
 /** Defaults to mid */
 timeout, ...props }: SlideTransitionProps): JSX.Element;
 export default SlideTransition;

package/dist/transitions/SlideTransition.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SlideTransition.d.ts","sourceRoot":"","sources":["../../src/transitions/SlideTransition.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAC/E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAKpE,KAAK,cAAc,GAAG,MAAM,GAAG,OAAO,CAAC;AAEvC,KAAK,oBAAoB,CAAC,GAAG,SAAS,SAAS,GAAG,WAAW,GAAG,SAAS,IAIvE,IAAI,CAAC,kBAAkB,CAAC,GAAG,CAAC,EAAE,eAAe,CAAC,GAAG;IAC/C,aAAa,CAAC,EAAE,UAAU,CAAC,GAAG,CAAC,GAAG,SAAS,CAAC;CAC7C,GAAG;IACF;;OAEG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAE3B,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEJ;;;;GAIG;AACH,iBAAS,eAAe,CAAC,EACvB,SAAkB,EAClB,SAAS;AAET,sBAAsB;AACtB,OAAqC,EACrC,GAAG,KAAK,EACT,EAAE,oBAAoB,GAAG,GAAG,CAAC,OAAO,CASpC;AAED,eAAe,eAAe,CAAC"}
+{"version":3,"file":"SlideTransition.d.ts","sourceRoot":"","sources":["../../src/transitions/SlideTransition.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAC/E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAEpE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAK7D,KAAK,cAAc,GAAG,MAAM,GAAG,OAAO,CAAC;AAEvC,KAAK,oBAAoB,GAIvB,IAAI,CACF,oBAAoB,CAAC,kBAAkB,CAAC,WAAW,CAAC,CAAC,EACrD,eAAe,CAChB,GAAG;IACF,aAAa,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,GAAG,SAAS,CAAC;IACpD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAE3B,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEJ;;;;GAIG;AACH,iBAAS,eAAe,CAAC,EACvB,SAAkB,EAClB,UAAU,EAAE,cAAc,EAC1B,QAAQ;AAER,sBAAsB;AACtB,OAAqC,EACrC,GAAG,KAAK,EACT,EAAE,oBAAoB,GAAG,GAAG,CAAC,OAAO,CAsBpC;AAED,eAAe,eAAe,CAAC"}

package/dist/transitions/SlideTransition.js

@@ -1,4 +1,4 @@
-var _excluded = ["direction", "className", "timeout"];
+var _excluded = ["direction", "classNames", "children", "timeout"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -7,11 +7,14 @@ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e =
 function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
 // SlideTransition class uses CSSTransition with slide-left and slide-right classNames, depending on the prop direction. The transition is 250ms long.
-//
+import { useCallback, useRef } from 'react';
 import { CSSTransition } from 'react-transition-group';
 import classNames from 'classnames';
 import ThemeExport from "../ThemeExport.js";
 import { jsx as _jsx } from "react/jsx-runtime";
+var DISPLAY_CONTENTS = {
+  display: 'contents'
+};
 /**
  * Slides one component overtop of another component.
  * Defaults to sliding left, unless `direction='right'` is provided.
@@ -20,16 +23,31 @@ import { jsx as _jsx } from "react/jsx-runtime";
 function SlideTransition(_ref) {
   var {
       direction = 'left',
-      className,
+      classNames: classNamesProp,
+      children,
       /** Defaults to mid */
       timeout = ThemeExport.transitionMidMs
     } = _ref,
     props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/_jsx(CSSTransition, _objectSpread({
+  var nodeRef = useRef(null);
+
+  // Mimics findDOMNode for CSSTransition
+  // The ref should be set before CSSTransition does anything with it
+  var setRef = useCallback(node => {
+    nodeRef.current = node === null || node === void 0 ? void 0 : node.firstElementChild;
+  }, []);
+  return /*#__PURE__*/_jsx(CSSTransition, _objectSpread(_objectSpread({
+    nodeRef: nodeRef,
     timeout: timeout,
-    classNames: classNames("slide-".concat(direction), className)
+    classNames: classNames("slide-".concat(direction), classNamesProp)
     // eslint-disable-next-line react/jsx-props-no-spreading
-  }, props));
+  }, props), {}, {
+    children: /*#__PURE__*/_jsx("div", {
+      ref: setRef,
+      style: DISPLAY_CONTENTS,
+      children: children
+    })
+  }));
 }
 export default SlideTransition;
 //# sourceMappingURL=SlideTransition.js.map

package/dist/transitions/SlideTransition.js.map

@@ -1 +1 @@
-{"version":3,"file":"SlideTransition.js","names":["CSSTransition","classNames","ThemeExport","jsx","_jsx","SlideTransition","_ref","direction","className","timeout","transitionMidMs","props","_objectWithoutProperties","_excluded","_objectSpread","concat"],"sources":["../../src/transitions/SlideTransition.tsx"],"sourcesContent":["// SlideTransition class uses CSSTransition with slide-left and slide-right classNames, depending on the prop direction. The transition is 250ms long.\n//\nimport { CSSTransition } from 'react-transition-group';\nimport type { CSSTransitionProps } from 'react-transition-group/CSSTransition';\nimport type { EndHandler } from 'react-transition-group/Transition';\n\nimport classNames from 'classnames';\nimport ThemeExport from '../ThemeExport';\n\ntype SlideDirection = 'left' | 'right';\n\ntype SlideTransitionProps<Ref extends undefined | HTMLElement = undefined> =\n  // We default the timeout, so user doesn't need to provide it\n  // However, CSSTransitionProps get confused if you don't provide a timeout, it requires an endHandler\n  // We're just making the endHandler optional here, as the timeout has a default\n  Omit<CSSTransitionProps<Ref>, 'addEndHandler'> & {\n    addEndHandler?: EndHandler<Ref> | undefined;\n  } & {\n    /**\n     * The direction of the slide transition. Defaults to left.\n     */\n    direction?: SlideDirection;\n\n    timeout?: number;\n  };\n\n/**\n * Slides one component overtop of another component.\n * Defaults to sliding left, unless `direction='right'` is provided.\n * Timeout defaults to 200ms.\n */\nfunction SlideTransition({\n  direction = 'left',\n  className,\n\n  /** Defaults to mid */\n  timeout = ThemeExport.transitionMidMs,\n  ...props\n}: SlideTransitionProps): JSX.Element {\n  return (\n    <CSSTransition\n      timeout={timeout}\n      classNames={classNames(`slide-${direction}`, className)}\n      // eslint-disable-next-line react/jsx-props-no-spreading\n      {...props}\n    />\n  );\n}\n\nexport default SlideTransition;\n"],"mappings":";;;;;;;;AAAA;AACA;AACA,SAASA,aAAa,QAAQ,wBAAwB;AAItD,OAAOC,UAAU,MAAM,YAAY;AAAC,OAC7BC,WAAW;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAmBlB;AACA;AACA;AACA;AACA;AACA,SAASC,eAAeA,CAAAC,IAAA,EAOc;EAAA,IAPb;MACvBC,SAAS,GAAG,MAAM;MAClBC,SAAS;MAET;MACAC,OAAO,GAAGP,WAAW,CAACQ;IAEF,CAAC,GAAAJ,IAAA;IADlBK,KAAK,GAAAC,wBAAA,CAAAN,IAAA,EAAAO,SAAA;EAER,oBACET,IAAA,CAACJ,aAAa,EAAAc,aAAA;IACZL,OAAO,EAAEA,OAAQ;IACjBR,UAAU,EAAEA,UAAU,UAAAc,MAAA,CAAUR,SAAS,GAAIC,SAAS;IACtD;EAAA,GACIG,KAAK,CACV,CAAC;AAEN;AAEA,eAAeN,eAAe"}
+{"version":3,"file":"SlideTransition.js","names":["useCallback","useRef","CSSTransition","classNames","ThemeExport","jsx","_jsx","DISPLAY_CONTENTS","display","SlideTransition","_ref","direction","classNamesProp","children","timeout","transitionMidMs","props","_objectWithoutProperties","_excluded","nodeRef","setRef","node","current","firstElementChild","_objectSpread","concat","ref","style"],"sources":["../../src/transitions/SlideTransition.tsx"],"sourcesContent":["// SlideTransition class uses CSSTransition with slide-left and slide-right classNames, depending on the prop direction. The transition is 250ms long.\nimport { useCallback, useRef } from 'react';\nimport { CSSTransition } from 'react-transition-group';\nimport type { CSSTransitionProps } from 'react-transition-group/CSSTransition';\nimport type { EndHandler } from 'react-transition-group/Transition';\nimport classNames from 'classnames';\nimport type { RemoveIndexSignature } from '@deephaven/utils';\nimport ThemeExport from '../ThemeExport';\n\nconst DISPLAY_CONTENTS = { display: 'contents' };\n\ntype SlideDirection = 'left' | 'right';\n\ntype SlideTransitionProps =\n  // We default the timeout, so user doesn't need to provide it\n  // However, CSSTransitionProps get confused if you don't provide a timeout, it requires an endHandler\n  // We're just making the endHandler optional here, as the timeout has a default\n  Omit<\n    RemoveIndexSignature<CSSTransitionProps<HTMLElement>>,\n    'addEndHandler'\n  > & {\n    addEndHandler?: EndHandler<HTMLElement> | undefined;\n    children?: React.ReactNode;\n    /**\n     * The direction of the slide transition. Defaults to left.\n     */\n    direction?: SlideDirection;\n\n    timeout?: number;\n  };\n\n/**\n * Slides one component overtop of another component.\n * Defaults to sliding left, unless `direction='right'` is provided.\n * Timeout defaults to 200ms.\n */\nfunction SlideTransition({\n  direction = 'left',\n  classNames: classNamesProp,\n  children,\n\n  /** Defaults to mid */\n  timeout = ThemeExport.transitionMidMs,\n  ...props\n}: SlideTransitionProps): JSX.Element {\n  const nodeRef = useRef<HTMLElement | null>(null);\n\n  // Mimics findDOMNode for CSSTransition\n  // The ref should be set before CSSTransition does anything with it\n  const setRef = useCallback((node: HTMLElement | null) => {\n    nodeRef.current = node?.firstElementChild as HTMLElement;\n  }, []);\n\n  return (\n    <CSSTransition\n      nodeRef={nodeRef}\n      timeout={timeout}\n      classNames={classNames(`slide-${direction}`, classNamesProp)}\n      // eslint-disable-next-line react/jsx-props-no-spreading\n      {...props}\n    >\n      <div ref={setRef} style={DISPLAY_CONTENTS}>\n        {children}\n      </div>\n    </CSSTransition>\n  );\n}\n\nexport default SlideTransition;\n"],"mappings":";;;;;;;;AAAA;AACA,SAASA,WAAW,EAAEC,MAAM,QAAQ,OAAO;AAC3C,SAASC,aAAa,QAAQ,wBAAwB;AAGtD,OAAOC,UAAU,MAAM,YAAY;AAAC,OAE7BC,WAAW;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAElB,IAAMC,gBAAgB,GAAG;EAAEC,OAAO,EAAE;AAAW,CAAC;AAsBhD;AACA;AACA;AACA;AACA;AACA,SAASC,eAAeA,CAAAC,IAAA,EAQc;EAAA,IARb;MACvBC,SAAS,GAAG,MAAM;MAClBR,UAAU,EAAES,cAAc;MAC1BC,QAAQ;MAER;MACAC,OAAO,GAAGV,WAAW,CAACW;IAEF,CAAC,GAAAL,IAAA;IADlBM,KAAK,GAAAC,wBAAA,CAAAP,IAAA,EAAAQ,SAAA;EAER,IAAMC,OAAO,GAAGlB,MAAM,CAAqB,IAAI,CAAC;;EAEhD;EACA;EACA,IAAMmB,MAAM,GAAGpB,WAAW,CAAEqB,IAAwB,IAAK;IACvDF,OAAO,CAACG,OAAO,GAAGD,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE,iBAAgC;EAC1D,CAAC,EAAE,EAAE,CAAC;EAEN,oBACEjB,IAAA,CAACJ,aAAa,EAAAsB,aAAA,CAAAA,aAAA;IACZL,OAAO,EAAEA,OAAQ;IACjBL,OAAO,EAAEA,OAAQ;IACjBX,UAAU,EAAEA,UAAU,UAAAsB,MAAA,CAAUd,SAAS,GAAIC,cAAc;IAC3D;EAAA,GACII,KAAK;IAAAH,QAAA,eAETP,IAAA;MAAKoB,GAAG,EAAEN,MAAO;MAACO,KAAK,EAAEpB,gBAAiB;MAAAM,QAAA,EACvCA;IAAQ,CACN;EAAC,EACO,CAAC;AAEpB;AAEA,eAAeJ,eAAe","ignoreList":[]}

package/dist/transitions/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["default","FadeTransition","SlideTransition"],"sources":["../../src/transitions/index.ts"],"sourcesContent":["export { default as FadeTransition } from './FadeTransition';\nexport { default as SlideTransition } from './SlideTransition';\n"],"mappings":"SAASA,OAAO,IAAIC,cAAc;AAAA,SACzBD,OAAO,IAAIE,eAAe"}
+{"version":3,"file":"index.js","names":["default","FadeTransition","SlideTransition"],"sources":["../../src/transitions/index.ts"],"sourcesContent":["export { default as FadeTransition } from './FadeTransition';\nexport { default as SlideTransition } from './SlideTransition';\n"],"mappings":"SAASA,OAAO,IAAIC,cAAc;AAAA,SACzBD,OAAO,IAAIE,eAAe","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deephaven/components",
-  "version": "1.7.2-beta.1+a19bc114",
+  "version": "1.7.2-beta.4+eaa583ef",
   "description": "Deephaven React component library",
   "author": "Deephaven Data Labs LLC",
   "license": "Apache-2.0",
@@ -25,10 +25,10 @@
   },
   "dependencies": {
     "@adobe/react-spectrum": "3.38.0",
-    "@deephaven/icons": "^1.7.2-beta.1+a19bc114",
-    "@deephaven/log": "^1.7.2-beta.1+a19bc114",
-    "@deephaven/react-hooks": "^1.7.2-beta.1+a19bc114",
-    "@deephaven/utils": "^1.7.2-beta.1+a19bc114",
+    "@deephaven/icons": "^1.7.2-beta.4+eaa583ef",
+    "@deephaven/log": "^1.7.2-beta.4+eaa583ef",
+    "@deephaven/react-hooks": "^1.7.2-beta.4+eaa583ef",
+    "@deephaven/utils": "^1.7.2-beta.4+eaa583ef",
     "@fortawesome/fontawesome-svg-core": "^6.2.1",
     "@fortawesome/react-fontawesome": "^0.2.0",
     "@internationalized/date": "^3.5.5",
@@ -48,12 +48,11 @@
     "memoizee": "^0.4.15",
     "nanoid": "^5.0.7",
     "popper.js": "^1.16.1",
-    "prop-types": "^15.7.2",
-    "react-beautiful-dnd": "^13.1.0",
+    "react-beautiful-dnd": "^13.1.1",
     "react-reverse-portal": "^2.3.0",
     "react-transition-group": "^4.4.2",
-    "react-virtualized-auto-sizer": "1.0.6",
-    "react-window": "^1.8.6"
+    "react-virtualized-auto-sizer": "1.0.7",
+    "react-window": "^1.8.7"
   },
   "peerDependencies": {
     "react": ">=16.8.0",
@@ -61,9 +60,9 @@
     "react-is": ">=16.8.0"
   },
   "devDependencies": {
-    "@deephaven/mocks": "^1.7.2-beta.1+a19bc114",
-    "@deephaven/test-utils": "^1.7.2-beta.1+a19bc114",
-    "react-redux": "^7.2.4"
+    "@deephaven/mocks": "^1.7.2-beta.4+eaa583ef",
+    "@deephaven/test-utils": "^1.7.2-beta.4+eaa583ef",
+    "react-redux": "^7.2.7"
   },
   "files": [
     "dist",
@@ -77,5 +76,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "a19bc11446da4328bc5c216064ec810b24ee0312"
+  "gitHead": "eaa583efb0b0d0a44ef5ddc72a7835fb2174d8f2"
 }