@deephaven/components 1.7.2-beta.3 → 1.7.2-beta.5

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","ignoreList":[]}
+{"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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deephaven/components",
-  "version": "1.7.2-beta.3+b369a51e",
+  "version": "1.7.2-beta.5+28d63776",
   "description": "Deephaven React component library",
   "author": "Deephaven Data Labs LLC",
   "license": "Apache-2.0",
@@ -25,12 +25,13 @@
   },
   "dependencies": {
     "@adobe/react-spectrum": "3.38.0",
-    "@deephaven/icons": "^1.7.2-beta.3+b369a51e",
-    "@deephaven/log": "^1.7.2-beta.3+b369a51e",
-    "@deephaven/react-hooks": "^1.7.2-beta.3+b369a51e",
-    "@deephaven/utils": "^1.7.2-beta.3+b369a51e",
+    "@deephaven/icons": "^1.7.2-beta.5+28d63776",
+    "@deephaven/log": "^1.7.2-beta.5+28d63776",
+    "@deephaven/react-hooks": "^1.7.2-beta.5+28d63776",
+    "@deephaven/utils": "^1.7.2-beta.5+28d63776",
     "@fortawesome/fontawesome-svg-core": "^6.2.1",
     "@fortawesome/react-fontawesome": "^0.2.0",
+    "@hello-pangea/dnd": "^18.0.1",
     "@internationalized/date": "^3.5.5",
     "@react-spectrum/theme-default": "^3.5.1",
     "@react-spectrum/toast": "^3.0.0-beta.16",
@@ -48,7 +49,6 @@
     "memoizee": "^0.4.15",
     "nanoid": "^5.0.7",
     "popper.js": "^1.16.1",
-    "react-beautiful-dnd": "^13.1.1",
     "react-reverse-portal": "^2.3.0",
     "react-transition-group": "^4.4.2",
     "react-virtualized-auto-sizer": "1.0.7",
@@ -60,8 +60,8 @@
     "react-is": ">=16.8.0"
   },
   "devDependencies": {
-    "@deephaven/mocks": "^1.7.2-beta.3+b369a51e",
-    "@deephaven/test-utils": "^1.7.2-beta.3+b369a51e",
+    "@deephaven/mocks": "^1.7.2-beta.5+28d63776",
+    "@deephaven/test-utils": "^1.7.2-beta.5+28d63776",
     "react-redux": "^7.2.7"
   },
   "files": [
@@ -76,5 +76,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "b369a51ee94d212641a14c6ce1f19fcc85168339"
+  "gitHead": "28d637768ffe289c1f16e1fdbc3af037aa9790ba"
 }