@elliemae/ds-resizeable-container 2.0.0-next.9 → 2.0.0-rc.12

package/cjs/Resizable.js

@@ -5,7 +5,16 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _jsx2 = require('@babel/runtime/helpers/jsx');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
 require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.every.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.every.js');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
 var React = require('react');
 var reactDesc = require('react-desc');
 var styled = require('styled-components');
@@ -106,11 +115,14 @@ const ResizableItem = /*#__PURE__*/styled__default["default"](ResizableItemCompo
 })(["position:relative;"]);
 const ResizableBar = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-forwbw-2"
-})(["position:absolute;cursor:", ";", ""], ({
-  container,
-  nextContainer,
-  v
-}) => cursorResolver(nextContainer, container, v), props => {
+})(["position:absolute;cursor:", ";", ""], _ref2 => {
+  let {
+    container,
+    nextContainer,
+    v
+  } = _ref2;
+  return cursorResolver(nextContainer, container, v);
+}, props => {
   if (props.v) {
     return "\n        bottom: calc(".concat(dsSystem.mapGap(props.gutter), " * -0.5);\n        left: 0;\n        width: 100%;\n        height: 10px;\n        margin-bottom: -5px;\n        display: flex;\n        flex-direction: column;\n        justify-content:space-around;\n        align-items: center;\n        &:after{\n          width: 100%;\n          height: 1px;\n          display: block;\n          background: ").concat(props.theme.colors.neutral['300'], ";\n          content: '';\n        }\n        &:hover{\n          &:after{\n            background: ").concat(props.theme.colors.brand['600'], ";\n          } \n        }\n      ");
   }
@@ -122,15 +134,15 @@ const getWidths = list => list.map(l => l.clientWidth);
 
 const getHeights = list => list.map(l => l.clientHeight);
 
-function ResizableContainer(_ref2) {
+function ResizableContainer(_ref3) {
   let {
     children,
     cols,
     rows,
     vertical,
     horizontal
-  } = _ref2,
-      rest = _objectWithoutProperties__default["default"](_ref2, _excluded2);
+  } = _ref3,
+      rest = _objectWithoutProperties__default["default"](_ref3, _excluded2);
 
   const refs = React.useRef([]);
   const [containers, setContainers] = React.useState(cols);
@@ -147,7 +159,9 @@ function ResizableContainer(_ref2) {
     refs.current.push(node);
   };
 
-  const resizePanels = (diff = 1, v = false) => {
+  const resizePanels = function () {
+    let diff = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
+    let v = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
     const index = parseInt(start.index, 10);
 
     if (!v) {
@@ -177,7 +191,9 @@ function ResizableContainer(_ref2) {
     }
   };
 
-  const startResize = (event, index, v = false, type) => {
+  const startResize = function (event, index) {
+    let v = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+    let type = arguments.length > 3 ? arguments[3] : undefined;
     setDragging(type);
     setStartPoint({
       x: event.clientX,
@@ -218,7 +234,8 @@ function ResizableContainer(_ref2) {
     }
   };
 
-  const handleKeyDown = (e, index, v = false) => {
+  const handleKeyDown = function (e, index) {
+    let v = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
     const keyCodes = {
       37: DIRECTION.L,
       Left: DIRECTION.L,

package/esm/Resizable.js

@@ -1,7 +1,16 @@
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
 import _jsx2 from '@babel/runtime/helpers/esm/jsx';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
 import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import 'core-js/modules/esnext.async-iterator.map.js';
+import 'core-js/modules/esnext.iterator.map.js';
 import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/esnext.async-iterator.every.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.every.js';
 import React, { useRef, useState, useEffect } from 'react';
 import { describe } from 'react-desc';
 import styled from 'styled-components';
@@ -94,11 +103,14 @@ const ResizableItem = /*#__PURE__*/styled(ResizableItemComponent).withConfig({
 })(["position:relative;"]);
 const ResizableBar = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-forwbw-2"
-})(["position:absolute;cursor:", ";", ""], ({
-  container,
-  nextContainer,
-  v
-}) => cursorResolver(nextContainer, container, v), props => {
+})(["position:absolute;cursor:", ";", ""], _ref2 => {
+  let {
+    container,
+    nextContainer,
+    v
+  } = _ref2;
+  return cursorResolver(nextContainer, container, v);
+}, props => {
   if (props.v) {
     return "\n        bottom: calc(".concat(mapGap(props.gutter), " * -0.5);\n        left: 0;\n        width: 100%;\n        height: 10px;\n        margin-bottom: -5px;\n        display: flex;\n        flex-direction: column;\n        justify-content:space-around;\n        align-items: center;\n        &:after{\n          width: 100%;\n          height: 1px;\n          display: block;\n          background: ").concat(props.theme.colors.neutral['300'], ";\n          content: '';\n        }\n        &:hover{\n          &:after{\n            background: ").concat(props.theme.colors.brand['600'], ";\n          } \n        }\n      ");
   }
@@ -110,15 +122,15 @@ const getWidths = list => list.map(l => l.clientWidth);
 
 const getHeights = list => list.map(l => l.clientHeight);
 
-function ResizableContainer(_ref2) {
+function ResizableContainer(_ref3) {
   let {
     children,
     cols,
     rows,
     vertical,
     horizontal
-  } = _ref2,
-      rest = _objectWithoutProperties(_ref2, _excluded2);
+  } = _ref3,
+      rest = _objectWithoutProperties(_ref3, _excluded2);
 
   const refs = useRef([]);
   const [containers, setContainers] = useState(cols);
@@ -135,7 +147,9 @@ function ResizableContainer(_ref2) {
     refs.current.push(node);
   };
 
-  const resizePanels = (diff = 1, v = false) => {
+  const resizePanels = function () {
+    let diff = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
+    let v = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
     const index = parseInt(start.index, 10);
 
     if (!v) {
@@ -165,7 +179,9 @@ function ResizableContainer(_ref2) {
     }
   };
 
-  const startResize = (event, index, v = false, type) => {
+  const startResize = function (event, index) {
+    let v = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+    let type = arguments.length > 3 ? arguments[3] : undefined;
     setDragging(type);
     setStartPoint({
       x: event.clientX,
@@ -206,7 +222,8 @@ function ResizableContainer(_ref2) {
     }
   };
 
-  const handleKeyDown = (e, index, v = false) => {
+  const handleKeyDown = function (e, index) {
+    let v = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
     const keyCodes = {
       37: DIRECTION.L,
       Left: DIRECTION.L,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-resizeable-container",
-  "version": "2.0.0-next.9",
+  "version": "2.0.0-rc.12",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Resizeable Container",
   "module": "./esm/index.js",
@@ -44,17 +44,20 @@
     "build": "node ../../scripts/build/build.js"
   },
   "dependencies": {
-    "@elliemae/ds-grid": "2.0.0-next.9",
-    "@elliemae/ds-system": "2.0.0-next.9",
+    "@elliemae/ds-grid": "2.0.0-rc.12",
+    "@elliemae/ds-system": "2.0.0-rc.12",
     "react-desc": "~4.1.3"
   },
   "devDependencies": {
-    "styled-components": "~5.3.1"
+    "@testing-library/jest-dom": "~5.15.0",
+    "@testing-library/react": "~12.1.2",
+    "@testing-library/user-event": "~13.5.0",
+    "styled-components": "~5.3.3"
   },
   "peerDependencies": {
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "styled-components": "^5.3.1"
+    "styled-components": "^5.3.3"
   },
   "publishConfig": {
     "access": "public",

package/types/Resizable.d.ts

@@ -1,3 +1,4 @@
+/// <reference path="../../../../shared/typings/react-desc.d.ts" />
 /// <reference types="react" />
 declare function ResizableContainer({ children, cols, rows, vertical, horizontal, ...rest }: {
     [x: string]: any;
@@ -9,17 +10,53 @@ declare function ResizableContainer({ children, cols, rows, vertical, horizontal
 }): JSX.Element;
 declare namespace ResizableContainer {
     var propTypes: {
-        children: any;
-        vertical: any;
-        horizontal: any;
-        rows: any;
-        cols: any;
+        children: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
+        vertical: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
+        horizontal: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
+        rows: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
+        cols: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
     };
     var defaultProps: {
         vertical: boolean;
         horizontal: boolean;
     };
 }
-declare const DSResizableContainerWithSchema: any;
+declare const DSResizableContainerWithSchema: {
+    (props?: {
+        [x: string]: any;
+        children: any;
+        cols: any;
+        rows: any;
+        vertical: any;
+        horizontal: any;
+    } | undefined): JSX.Element;
+    propTypes: unknown;
+    toTypescript: () => import("react-desc").TypescriptSchema;
+};
 export { ResizableContainer, DSResizableContainerWithSchema };
 export default ResizableContainer;

package/types/props.d.ts

@@ -1,12 +1,38 @@
+/// <reference path="../../../../shared/typings/react-desc.d.ts" />
 export declare const props: {
     /** grid item content */
-    children: any;
+    children: {
+        defaultValue<T = unknown>(arg: T): {
+            deprecated: import("react-desc").PropTypesDescValidator;
+        };
+        isRequired: import("react-desc").PropTypesDescValidator;
+    };
     /**  vertical resizing */
-    vertical: any;
+    vertical: {
+        defaultValue<T = unknown>(arg: T): {
+            deprecated: import("react-desc").PropTypesDescValidator;
+        };
+        isRequired: import("react-desc").PropTypesDescValidator;
+    };
     /** horizontal resizing */
-    horizontal: any;
+    horizontal: {
+        defaultValue<T = unknown>(arg: T): {
+            deprecated: import("react-desc").PropTypesDescValidator;
+        };
+        isRequired: import("react-desc").PropTypesDescValidator;
+    };
     /** Row layout cells */
-    rows: any;
+    rows: {
+        defaultValue<T = unknown>(arg: T): {
+            deprecated: import("react-desc").PropTypesDescValidator;
+        };
+        isRequired: import("react-desc").PropTypesDescValidator;
+    };
     /** Column layout cells */
-    cols: any;
+    cols: {
+        defaultValue<T = unknown>(arg: T): {
+            deprecated: import("react-desc").PropTypesDescValidator;
+        };
+        isRequired: import("react-desc").PropTypesDescValidator;
+    };
 };