@elliemae/ds-resizeable-container 3.16.0 → 3.16.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/Resizable.js +6 -2
- package/dist/cjs/Resizable.js.map +2 -2
- package/dist/cjs/defaultProps.js +4 -0
- package/dist/cjs/defaultProps.js.map +1 -1
- package/dist/cjs/index.js +6 -2
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/package.json +7 -0
- package/dist/cjs/props.js +9 -0
- package/dist/cjs/props.js.map +1 -1
- package/dist/esm/Resizable.js +2 -2
- package/dist/esm/Resizable.js.map +2 -2
- package/dist/esm/index.js +2 -2
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/package.json +7 -0
- package/dist/esm/props.js +5 -0
- package/dist/esm/props.js.map +1 -1
- package/dist/types/Resizable.d.ts +6 -6
- package/dist/types/index.d.ts +2 -2
- package/package.json +7 -7
package/dist/cjs/Resizable.js
CHANGED
|
@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
20
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
21
25
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
26
|
mod
|
|
23
27
|
));
|
|
@@ -35,8 +39,8 @@ var import_react = __toESM(require("react"));
|
|
|
35
39
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
36
40
|
var import_ds_system = require("@elliemae/ds-system");
|
|
37
41
|
var import_ds_grid = require("@elliemae/ds-grid");
|
|
38
|
-
var import_props = require("./props");
|
|
39
|
-
var import_defaultProps = require("./defaultProps");
|
|
42
|
+
var import_props = require("./props.js");
|
|
43
|
+
var import_defaultProps = require("./defaultProps.js");
|
|
40
44
|
const safeDifference = 15;
|
|
41
45
|
const minDifference = 8;
|
|
42
46
|
const EVENT_TYPE = { MOUSE: "mouse", KEY: "arrows" };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Resizable.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable complexity */\n/* eslint-disable max-lines */\n/* eslint-disable max-statements */\nimport React, { useRef, useState, useEffect } from 'react';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { styled, mapGap } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { props as rprops } from './props';\nimport { defaultProps } from './defaultProps';\n\nconst safeDifference = 15;\nconst minDifference = 8;\nconst EVENT_TYPE = { MOUSE: 'mouse', KEY: 'arrows' };\nconst DIRECTION = {\n L: 'left',\n R: 'right',\n U: 'up',\n D: 'down',\n};\n\nfunction calcPosition(arrow, position) {\n let offset;\n switch (arrow) {\n case DIRECTION.U:\n offset = position - 3;\n break;\n case DIRECTION.D:\n offset = position + 3;\n break;\n case DIRECTION.L:\n offset = position - 3;\n break;\n case DIRECTION.R:\n offset = position + 3;\n break;\n default:\n offset = position;\n }\n return offset;\n}\n\nfunction cursorResolver(nextPx, px, isVertical) {\n const orientation = {\n vertical: 'row-resize',\n horizontal: 'col-resize',\n left: 'w-resize',\n right: 'e-resize',\n up: 'n-resize',\n down: 's-resize',\n };\n\n if (isVertical && nextPx && nextPx <= safeDifference + 1) return orientation.up;\n if (isVertical && px > safeDifference + 1) return orientation.vertical;\n if (isVertical && px <= safeDifference + 1) return orientation.down;\n\n if (!isVertical && nextPx && nextPx <= safeDifference + 1) return orientation.left;\n if (!isVertical && px <= safeDifference + 1) return orientation.right;\n if (!isVertical && px > safeDifference + 1) return orientation.horizontal;\n\n return isVertical ? orientation.vertical : orientation.horizontal;\n}\n\nconst ResizableItemComponent = ({ innerRef, ...p }) => <Grid ref={innerRef} {...p} />;\n\nconst ResizableGrid = styled(Grid)``;\nconst ResizableItem = styled(ResizableItemComponent)`\n position: relative;\n`;\nconst ResizableBar = styled.div`\n position: absolute;\n cursor: ${({ container, nextContainer, v }) => cursorResolver(nextContainer, container, v)};\n\n ${(props) => {\n if (props.v) {\n return `\n bottom: calc(${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: ${props.theme.colors.neutral['300']};\n content: '';\n }\n &:hover{\n &:after{\n background: ${props.theme.colors.brand['600']};\n } \n }\n `;\n }\n return `\n top: 0;\n right: calc(${mapGap(props.gutter)} * -0.5);\n height: 100%;\n width: 10px;\n margin-right: -5px;\n display: flex;\n flex-direction: row;\n justify-content:space-around;\n align-items: center;\n &:after{\n height: 100%;\n width: 1px;\n display: block;\n background: ${props.theme.colors.neutral['300']};\n content: '';\n }\n &:hover{\n &:after{\n background: ${props.theme.colors.brand['600']};\n } \n }\n `;\n }}\n`;\nconst getWidths = (list) => list.map((l) => l.clientWidth);\nconst getHeights = (list) => list.map((l) => l.clientHeight);\n\nconst ResizableContainer = ({ children, cols, rows, vertical, horizontal, ...rest }) => {\n const refs = useRef([]);\n const [containers, setContainers] = useState(cols);\n const [blocks, setBlocks] = useState(rows);\n const [isDragging, setDragging] = useState(false);\n const [start, setStartPoint] = useState(0);\n const [resetPoint, setResetPoint] = useState();\n\n useEffect(() => {\n if (horizontal) setContainers(getWidths(refs.current));\n if (vertical) setBlocks(getHeights(refs.current));\n }, [refs.current, horizontal, vertical]);\n const addRef = (node) => {\n refs.current.push(node);\n };\n const resizePanels = (diff = 1, v = false) => {\n const index = parseInt(start.index, 10);\n if (!v) {\n const newContainers = [...containers];\n if (newContainers[index + 1] && newContainers[index + 1] > minDifference) {\n newContainers[index + 1] = newContainers[index + 1] - diff;\n newContainers[index] = diff + newContainers[index];\n } else if (newContainers[index - 1] && newContainers[index - 1] > minDifference) {\n newContainers[index - 1] = newContainers[index - 1] - diff;\n newContainers[index] = diff + newContainers[index];\n }\n if (newContainers.every((c) => c > safeDifference)) setContainers(newContainers);\n } else {\n const newBlocks = [...blocks];\n if (newBlocks[index + 1] && newBlocks[index + 1] > minDifference) {\n newBlocks[index + 1] = newBlocks[index + 1] - diff;\n newBlocks[index] = diff + newBlocks[index];\n } else if (newBlocks[index - 1] && newBlocks[index - 1] > minDifference) {\n newBlocks[index - 1] = newBlocks[index - 1] - diff;\n newBlocks[index] = diff + newBlocks[index];\n }\n if (newBlocks.every((c) => c > safeDifference)) setBlocks(newBlocks);\n }\n };\n const startResize = (event, index, v = false, type) => {\n setDragging(type);\n setStartPoint({\n x: event.clientX,\n y: event.clientY,\n index,\n v,\n });\n setResetPoint({ containers, blocks });\n };\n const moveResize = (event, type) => {\n if (isDragging && isDragging === type && !start.v) {\n const diff = event.clientX - start.x;\n if (diff === 0) return;\n setStartPoint({ x: event.clientX, index: start.index });\n resizePanels(diff);\n } else if (isDragging && isDragging === type && start.v) {\n const diff = event.clientY - start.y;\n if (diff === 0) return;\n setStartPoint({ ...start, y: event.clientY, index: start.index });\n resizePanels(diff, true);\n }\n };\n const endResize = (type) => {\n if (isDragging === type) {\n setDragging(false);\n setStartPoint();\n }\n };\n const handleKeyDown = (e, index, v = false) => {\n const keyCodes = {\n 37: DIRECTION.L,\n Left: DIRECTION.L,\n ArrowLeft: DIRECTION.L,\n 38: DIRECTION.U,\n Up: DIRECTION.U,\n ArrowUp: DIRECTION.U,\n 39: DIRECTION.R,\n Right: DIRECTION.R,\n ArrowRight: DIRECTION.R,\n 40: DIRECTION.D,\n Down: DIRECTION.D,\n ArrowDown: DIRECTION.D,\n };\n\n if (keyCodes[e.key || e.keyCode]) {\n e.preventDefault();\n const { top: y, left: x } = e.target.getBoundingClientRect();\n if (!start) {\n startResize({ clientX: x, clientY: y }, index, v, EVENT_TYPE.KEY);\n } else {\n const clientX =\n keyCodes[e.keyCode] === DIRECTION.L || keyCodes[e.keyCode] === DIRECTION.R\n ? calcPosition(keyCodes[e.keyCode], x)\n : x;\n const clientY =\n keyCodes[e.keyCode] === DIRECTION.U || keyCodes[e.keyCode] === DIRECTION.D\n ? calcPosition(keyCodes[e.keyCode], y)\n : y;\n\n moveResize({ clientX, clientY }, EVENT_TYPE.KEY);\n }\n }\n };\n\n const onLeave = (type) => {\n if (isDragging === type) {\n setDragging(false);\n\n if (resetPoint && resetPoint.blocks) setBlocks(resetPoint.blocks);\n if (resetPoint && resetPoint.containers) setContainers(resetPoint.containers);\n }\n };\n const count = React.Children.count(children);\n\n return (\n <ResizableGrid\n {...rest}\n cols={containers}\n onKeyUp={() => endResize(EVENT_TYPE.KEY)}\n onMouseLeave={() => onLeave(EVENT_TYPE.MOUSE)}\n onMouseMove={(e) => moveResize(e, EVENT_TYPE.MOUSE)}\n onMouseUp={() => endResize(EVENT_TYPE.MOUSE)}\n rows={blocks}\n >\n {React.Children.map(children, (child, index) => (\n <ResizableItem data-index={index} innerRef={addRef}>\n {child}\n {count - 1 !== index && horizontal && (\n <ResizableBar\n container={containers[index]}\n data-index={index}\n gutter={rest.gutter}\n nextContainer={containers[index + 1]}\n onKeyDown={(e) => handleKeyDown(e, index, false)}\n onMouseDown={(e) => startResize(e, index, false, EVENT_TYPE.MOUSE)}\n tabIndex={0}\n />\n )}\n {count - 1 !== index && vertical && (\n <ResizableBar\n container={blocks[index]}\n data-index={index}\n gutter={rest.gutter}\n nextContainer={blocks[index + 1]}\n onKeyDown={(e) => handleKeyDown(e, index, true)}\n onMouseDown={(e) => startResize(e, index, true, EVENT_TYPE.MOUSE)}\n tabIndex={0}\n v\n />\n )}\n </ResizableItem>\n ))}\n </ResizableGrid>\n );\n};\n\nResizableContainer.propTypes = rprops;\nResizableContainer.defaultProps = defaultProps;\nResizableContainer.displayName = 'ResizableContainer';\nconst DSResizableContainerWithSchema = describe(ResizableContainer);\nDSResizableContainerWithSchema.propTypes = rprops;\n\nexport { ResizableContainer, DSResizableContainerWithSchema };\nexport default ResizableContainer;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["/* eslint-disable complexity */\n/* eslint-disable max-lines */\n/* eslint-disable max-statements */\nimport React, { useRef, useState, useEffect } from 'react';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { styled, mapGap } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { props as rprops } from './props.js';\nimport { defaultProps } from './defaultProps.js';\n\nconst safeDifference = 15;\nconst minDifference = 8;\nconst EVENT_TYPE = { MOUSE: 'mouse', KEY: 'arrows' };\nconst DIRECTION = {\n L: 'left',\n R: 'right',\n U: 'up',\n D: 'down',\n};\n\nfunction calcPosition(arrow, position) {\n let offset;\n switch (arrow) {\n case DIRECTION.U:\n offset = position - 3;\n break;\n case DIRECTION.D:\n offset = position + 3;\n break;\n case DIRECTION.L:\n offset = position - 3;\n break;\n case DIRECTION.R:\n offset = position + 3;\n break;\n default:\n offset = position;\n }\n return offset;\n}\n\nfunction cursorResolver(nextPx, px, isVertical) {\n const orientation = {\n vertical: 'row-resize',\n horizontal: 'col-resize',\n left: 'w-resize',\n right: 'e-resize',\n up: 'n-resize',\n down: 's-resize',\n };\n\n if (isVertical && nextPx && nextPx <= safeDifference + 1) return orientation.up;\n if (isVertical && px > safeDifference + 1) return orientation.vertical;\n if (isVertical && px <= safeDifference + 1) return orientation.down;\n\n if (!isVertical && nextPx && nextPx <= safeDifference + 1) return orientation.left;\n if (!isVertical && px <= safeDifference + 1) return orientation.right;\n if (!isVertical && px > safeDifference + 1) return orientation.horizontal;\n\n return isVertical ? orientation.vertical : orientation.horizontal;\n}\n\nconst ResizableItemComponent = ({ innerRef, ...p }) => <Grid ref={innerRef} {...p} />;\n\nconst ResizableGrid = styled(Grid)``;\nconst ResizableItem = styled(ResizableItemComponent)`\n position: relative;\n`;\nconst ResizableBar = styled.div`\n position: absolute;\n cursor: ${({ container, nextContainer, v }) => cursorResolver(nextContainer, container, v)};\n\n ${(props) => {\n if (props.v) {\n return `\n bottom: calc(${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: ${props.theme.colors.neutral['300']};\n content: '';\n }\n &:hover{\n &:after{\n background: ${props.theme.colors.brand['600']};\n } \n }\n `;\n }\n return `\n top: 0;\n right: calc(${mapGap(props.gutter)} * -0.5);\n height: 100%;\n width: 10px;\n margin-right: -5px;\n display: flex;\n flex-direction: row;\n justify-content:space-around;\n align-items: center;\n &:after{\n height: 100%;\n width: 1px;\n display: block;\n background: ${props.theme.colors.neutral['300']};\n content: '';\n }\n &:hover{\n &:after{\n background: ${props.theme.colors.brand['600']};\n } \n }\n `;\n }}\n`;\nconst getWidths = (list) => list.map((l) => l.clientWidth);\nconst getHeights = (list) => list.map((l) => l.clientHeight);\n\nconst ResizableContainer = ({ children, cols, rows, vertical, horizontal, ...rest }) => {\n const refs = useRef([]);\n const [containers, setContainers] = useState(cols);\n const [blocks, setBlocks] = useState(rows);\n const [isDragging, setDragging] = useState(false);\n const [start, setStartPoint] = useState(0);\n const [resetPoint, setResetPoint] = useState();\n\n useEffect(() => {\n if (horizontal) setContainers(getWidths(refs.current));\n if (vertical) setBlocks(getHeights(refs.current));\n }, [refs.current, horizontal, vertical]);\n const addRef = (node) => {\n refs.current.push(node);\n };\n const resizePanels = (diff = 1, v = false) => {\n const index = parseInt(start.index, 10);\n if (!v) {\n const newContainers = [...containers];\n if (newContainers[index + 1] && newContainers[index + 1] > minDifference) {\n newContainers[index + 1] = newContainers[index + 1] - diff;\n newContainers[index] = diff + newContainers[index];\n } else if (newContainers[index - 1] && newContainers[index - 1] > minDifference) {\n newContainers[index - 1] = newContainers[index - 1] - diff;\n newContainers[index] = diff + newContainers[index];\n }\n if (newContainers.every((c) => c > safeDifference)) setContainers(newContainers);\n } else {\n const newBlocks = [...blocks];\n if (newBlocks[index + 1] && newBlocks[index + 1] > minDifference) {\n newBlocks[index + 1] = newBlocks[index + 1] - diff;\n newBlocks[index] = diff + newBlocks[index];\n } else if (newBlocks[index - 1] && newBlocks[index - 1] > minDifference) {\n newBlocks[index - 1] = newBlocks[index - 1] - diff;\n newBlocks[index] = diff + newBlocks[index];\n }\n if (newBlocks.every((c) => c > safeDifference)) setBlocks(newBlocks);\n }\n };\n const startResize = (event, index, v = false, type) => {\n setDragging(type);\n setStartPoint({\n x: event.clientX,\n y: event.clientY,\n index,\n v,\n });\n setResetPoint({ containers, blocks });\n };\n const moveResize = (event, type) => {\n if (isDragging && isDragging === type && !start.v) {\n const diff = event.clientX - start.x;\n if (diff === 0) return;\n setStartPoint({ x: event.clientX, index: start.index });\n resizePanels(diff);\n } else if (isDragging && isDragging === type && start.v) {\n const diff = event.clientY - start.y;\n if (diff === 0) return;\n setStartPoint({ ...start, y: event.clientY, index: start.index });\n resizePanels(diff, true);\n }\n };\n const endResize = (type) => {\n if (isDragging === type) {\n setDragging(false);\n setStartPoint();\n }\n };\n const handleKeyDown = (e, index, v = false) => {\n const keyCodes = {\n 37: DIRECTION.L,\n Left: DIRECTION.L,\n ArrowLeft: DIRECTION.L,\n 38: DIRECTION.U,\n Up: DIRECTION.U,\n ArrowUp: DIRECTION.U,\n 39: DIRECTION.R,\n Right: DIRECTION.R,\n ArrowRight: DIRECTION.R,\n 40: DIRECTION.D,\n Down: DIRECTION.D,\n ArrowDown: DIRECTION.D,\n };\n\n if (keyCodes[e.key || e.keyCode]) {\n e.preventDefault();\n const { top: y, left: x } = e.target.getBoundingClientRect();\n if (!start) {\n startResize({ clientX: x, clientY: y }, index, v, EVENT_TYPE.KEY);\n } else {\n const clientX =\n keyCodes[e.keyCode] === DIRECTION.L || keyCodes[e.keyCode] === DIRECTION.R\n ? calcPosition(keyCodes[e.keyCode], x)\n : x;\n const clientY =\n keyCodes[e.keyCode] === DIRECTION.U || keyCodes[e.keyCode] === DIRECTION.D\n ? calcPosition(keyCodes[e.keyCode], y)\n : y;\n\n moveResize({ clientX, clientY }, EVENT_TYPE.KEY);\n }\n }\n };\n\n const onLeave = (type) => {\n if (isDragging === type) {\n setDragging(false);\n\n if (resetPoint && resetPoint.blocks) setBlocks(resetPoint.blocks);\n if (resetPoint && resetPoint.containers) setContainers(resetPoint.containers);\n }\n };\n const count = React.Children.count(children);\n\n return (\n <ResizableGrid\n {...rest}\n cols={containers}\n onKeyUp={() => endResize(EVENT_TYPE.KEY)}\n onMouseLeave={() => onLeave(EVENT_TYPE.MOUSE)}\n onMouseMove={(e) => moveResize(e, EVENT_TYPE.MOUSE)}\n onMouseUp={() => endResize(EVENT_TYPE.MOUSE)}\n rows={blocks}\n >\n {React.Children.map(children, (child, index) => (\n <ResizableItem data-index={index} innerRef={addRef}>\n {child}\n {count - 1 !== index && horizontal && (\n <ResizableBar\n container={containers[index]}\n data-index={index}\n gutter={rest.gutter}\n nextContainer={containers[index + 1]}\n onKeyDown={(e) => handleKeyDown(e, index, false)}\n onMouseDown={(e) => startResize(e, index, false, EVENT_TYPE.MOUSE)}\n tabIndex={0}\n />\n )}\n {count - 1 !== index && vertical && (\n <ResizableBar\n container={blocks[index]}\n data-index={index}\n gutter={rest.gutter}\n nextContainer={blocks[index + 1]}\n onKeyDown={(e) => handleKeyDown(e, index, true)}\n onMouseDown={(e) => startResize(e, index, true, EVENT_TYPE.MOUSE)}\n tabIndex={0}\n v\n />\n )}\n </ResizableItem>\n ))}\n </ResizableGrid>\n );\n};\n\nResizableContainer.propTypes = rprops;\nResizableContainer.defaultProps = defaultProps;\nResizableContainer.displayName = 'ResizableContainer';\nconst DSResizableContainerWithSchema = describe(ResizableContainer);\nDSResizableContainerWithSchema.propTypes = rprops;\n\nexport { ResizableContainer, DSResizableContainerWithSchema };\nexport default ResizableContainer;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React", "rprops"]
|
|
7
7
|
}
|
package/dist/cjs/defaultProps.js
CHANGED
|
@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
20
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
21
25
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
26
|
mod
|
|
23
27
|
));
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/defaultProps.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["export const defaultProps = {\n vertical: false,\n horizontal: false,\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,eAAe;AAAA,EAC1B,UAAU;AAAA,EACV,YAAY;AACd;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/index.js
CHANGED
|
@@ -19,6 +19,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
19
19
|
};
|
|
20
20
|
var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
|
|
21
21
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
22
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
23
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
24
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
25
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
22
26
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
23
27
|
mod
|
|
24
28
|
));
|
|
@@ -29,6 +33,6 @@ __export(src_exports, {
|
|
|
29
33
|
});
|
|
30
34
|
module.exports = __toCommonJS(src_exports);
|
|
31
35
|
var React = __toESM(require("react"));
|
|
32
|
-
__reExport(src_exports, require("./Resizable"), module.exports);
|
|
33
|
-
var import_Resizable = __toESM(require("./Resizable"));
|
|
36
|
+
__reExport(src_exports, require("./Resizable.js"), module.exports);
|
|
37
|
+
var import_Resizable = __toESM(require("./Resizable.js"));
|
|
34
38
|
//# sourceMappingURL=index.js.map
|
package/dist/cjs/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/index.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["export * from './Resizable';\nexport { default } from './Resizable';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["export * from './Resizable.js';\nexport { default } from './Resizable.js';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,wBAAc,2BAAd;AACA,uBAAwB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/props.js
CHANGED
|
@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
20
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
21
25
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
26
|
mod
|
|
23
27
|
));
|
|
@@ -30,10 +34,15 @@ module.exports = __toCommonJS(props_exports);
|
|
|
30
34
|
var React = __toESM(require("react"));
|
|
31
35
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
32
36
|
const props = {
|
|
37
|
+
/** grid item content */
|
|
33
38
|
children: import_ds_props_helpers.PropTypes.node.description("Grid item content"),
|
|
39
|
+
/** vertical resizing */
|
|
34
40
|
vertical: import_ds_props_helpers.PropTypes.bool.description("vertical resizing"),
|
|
41
|
+
/** horizontal resizing */
|
|
35
42
|
horizontal: import_ds_props_helpers.PropTypes.bool.description("horizontal resizing"),
|
|
43
|
+
/** Row layout cells */
|
|
36
44
|
rows: import_ds_props_helpers.PropTypes.arrayOf(import_ds_props_helpers.PropTypes.oneOfType([import_ds_props_helpers.PropTypes.number, import_ds_props_helpers.PropTypes.string])).description("Row layout cells"),
|
|
45
|
+
/** Column layout cells */
|
|
37
46
|
cols: import_ds_props_helpers.PropTypes.arrayOf(import_ds_props_helpers.PropTypes.oneOfType([import_ds_props_helpers.PropTypes.number, import_ds_props_helpers.PropTypes.string])).description("Column layout cells")
|
|
38
47
|
};
|
|
39
48
|
//# sourceMappingURL=props.js.map
|
package/dist/cjs/props.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/props.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import { PropTypes } from '@elliemae/ds-props-helpers';\n\nexport const props = {\n /** grid item content */\n children: PropTypes.node.description('Grid item content'),\n /** vertical resizing */\n vertical: PropTypes.bool.description('vertical resizing'),\n /** horizontal resizing */\n horizontal: PropTypes.bool.description('horizontal resizing'),\n /** Row layout cells */\n rows: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])).description('Row layout cells'),\n /** Column layout cells */\n cols: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])).description('Column layout cells'),\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAA0B;AAEnB,MAAM,QAAQ;AAAA;AAAA,EAEnB,UAAU,kCAAU,KAAK,YAAY,mBAAmB;AAAA;AAAA,EAExD,UAAU,kCAAU,KAAK,YAAY,mBAAmB;AAAA;AAAA,EAExD,YAAY,kCAAU,KAAK,YAAY,qBAAqB;AAAA;AAAA,EAE5D,MAAM,kCAAU,QAAQ,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,MAAM,CAAC,CAAC,EAAE,YAAY,kBAAkB;AAAA;AAAA,EAEjH,MAAM,kCAAU,QAAQ,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,MAAM,CAAC,CAAC,EAAE,YAAY,qBAAqB;AACtH;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/Resizable.js
CHANGED
|
@@ -4,8 +4,8 @@ import React2, { useRef, useState, useEffect } from "react";
|
|
|
4
4
|
import { describe } from "@elliemae/ds-props-helpers";
|
|
5
5
|
import { styled, mapGap } from "@elliemae/ds-system";
|
|
6
6
|
import { Grid } from "@elliemae/ds-grid";
|
|
7
|
-
import { props as rprops } from "./props";
|
|
8
|
-
import { defaultProps } from "./defaultProps";
|
|
7
|
+
import { props as rprops } from "./props.js";
|
|
8
|
+
import { defaultProps } from "./defaultProps.js";
|
|
9
9
|
const safeDifference = 15;
|
|
10
10
|
const minDifference = 8;
|
|
11
11
|
const EVENT_TYPE = { MOUSE: "mouse", KEY: "arrows" };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/Resizable.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\n/* eslint-disable max-lines */\n/* eslint-disable max-statements */\nimport React, { useRef, useState, useEffect } from 'react';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { styled, mapGap } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { props as rprops } from './props';\nimport { defaultProps } from './defaultProps';\n\nconst safeDifference = 15;\nconst minDifference = 8;\nconst EVENT_TYPE = { MOUSE: 'mouse', KEY: 'arrows' };\nconst DIRECTION = {\n L: 'left',\n R: 'right',\n U: 'up',\n D: 'down',\n};\n\nfunction calcPosition(arrow, position) {\n let offset;\n switch (arrow) {\n case DIRECTION.U:\n offset = position - 3;\n break;\n case DIRECTION.D:\n offset = position + 3;\n break;\n case DIRECTION.L:\n offset = position - 3;\n break;\n case DIRECTION.R:\n offset = position + 3;\n break;\n default:\n offset = position;\n }\n return offset;\n}\n\nfunction cursorResolver(nextPx, px, isVertical) {\n const orientation = {\n vertical: 'row-resize',\n horizontal: 'col-resize',\n left: 'w-resize',\n right: 'e-resize',\n up: 'n-resize',\n down: 's-resize',\n };\n\n if (isVertical && nextPx && nextPx <= safeDifference + 1) return orientation.up;\n if (isVertical && px > safeDifference + 1) return orientation.vertical;\n if (isVertical && px <= safeDifference + 1) return orientation.down;\n\n if (!isVertical && nextPx && nextPx <= safeDifference + 1) return orientation.left;\n if (!isVertical && px <= safeDifference + 1) return orientation.right;\n if (!isVertical && px > safeDifference + 1) return orientation.horizontal;\n\n return isVertical ? orientation.vertical : orientation.horizontal;\n}\n\nconst ResizableItemComponent = ({ innerRef, ...p }) => <Grid ref={innerRef} {...p} />;\n\nconst ResizableGrid = styled(Grid)``;\nconst ResizableItem = styled(ResizableItemComponent)`\n position: relative;\n`;\nconst ResizableBar = styled.div`\n position: absolute;\n cursor: ${({ container, nextContainer, v }) => cursorResolver(nextContainer, container, v)};\n\n ${(props) => {\n if (props.v) {\n return `\n bottom: calc(${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: ${props.theme.colors.neutral['300']};\n content: '';\n }\n &:hover{\n &:after{\n background: ${props.theme.colors.brand['600']};\n } \n }\n `;\n }\n return `\n top: 0;\n right: calc(${mapGap(props.gutter)} * -0.5);\n height: 100%;\n width: 10px;\n margin-right: -5px;\n display: flex;\n flex-direction: row;\n justify-content:space-around;\n align-items: center;\n &:after{\n height: 100%;\n width: 1px;\n display: block;\n background: ${props.theme.colors.neutral['300']};\n content: '';\n }\n &:hover{\n &:after{\n background: ${props.theme.colors.brand['600']};\n } \n }\n `;\n }}\n`;\nconst getWidths = (list) => list.map((l) => l.clientWidth);\nconst getHeights = (list) => list.map((l) => l.clientHeight);\n\nconst ResizableContainer = ({ children, cols, rows, vertical, horizontal, ...rest }) => {\n const refs = useRef([]);\n const [containers, setContainers] = useState(cols);\n const [blocks, setBlocks] = useState(rows);\n const [isDragging, setDragging] = useState(false);\n const [start, setStartPoint] = useState(0);\n const [resetPoint, setResetPoint] = useState();\n\n useEffect(() => {\n if (horizontal) setContainers(getWidths(refs.current));\n if (vertical) setBlocks(getHeights(refs.current));\n }, [refs.current, horizontal, vertical]);\n const addRef = (node) => {\n refs.current.push(node);\n };\n const resizePanels = (diff = 1, v = false) => {\n const index = parseInt(start.index, 10);\n if (!v) {\n const newContainers = [...containers];\n if (newContainers[index + 1] && newContainers[index + 1] > minDifference) {\n newContainers[index + 1] = newContainers[index + 1] - diff;\n newContainers[index] = diff + newContainers[index];\n } else if (newContainers[index - 1] && newContainers[index - 1] > minDifference) {\n newContainers[index - 1] = newContainers[index - 1] - diff;\n newContainers[index] = diff + newContainers[index];\n }\n if (newContainers.every((c) => c > safeDifference)) setContainers(newContainers);\n } else {\n const newBlocks = [...blocks];\n if (newBlocks[index + 1] && newBlocks[index + 1] > minDifference) {\n newBlocks[index + 1] = newBlocks[index + 1] - diff;\n newBlocks[index] = diff + newBlocks[index];\n } else if (newBlocks[index - 1] && newBlocks[index - 1] > minDifference) {\n newBlocks[index - 1] = newBlocks[index - 1] - diff;\n newBlocks[index] = diff + newBlocks[index];\n }\n if (newBlocks.every((c) => c > safeDifference)) setBlocks(newBlocks);\n }\n };\n const startResize = (event, index, v = false, type) => {\n setDragging(type);\n setStartPoint({\n x: event.clientX,\n y: event.clientY,\n index,\n v,\n });\n setResetPoint({ containers, blocks });\n };\n const moveResize = (event, type) => {\n if (isDragging && isDragging === type && !start.v) {\n const diff = event.clientX - start.x;\n if (diff === 0) return;\n setStartPoint({ x: event.clientX, index: start.index });\n resizePanels(diff);\n } else if (isDragging && isDragging === type && start.v) {\n const diff = event.clientY - start.y;\n if (diff === 0) return;\n setStartPoint({ ...start, y: event.clientY, index: start.index });\n resizePanels(diff, true);\n }\n };\n const endResize = (type) => {\n if (isDragging === type) {\n setDragging(false);\n setStartPoint();\n }\n };\n const handleKeyDown = (e, index, v = false) => {\n const keyCodes = {\n 37: DIRECTION.L,\n Left: DIRECTION.L,\n ArrowLeft: DIRECTION.L,\n 38: DIRECTION.U,\n Up: DIRECTION.U,\n ArrowUp: DIRECTION.U,\n 39: DIRECTION.R,\n Right: DIRECTION.R,\n ArrowRight: DIRECTION.R,\n 40: DIRECTION.D,\n Down: DIRECTION.D,\n ArrowDown: DIRECTION.D,\n };\n\n if (keyCodes[e.key || e.keyCode]) {\n e.preventDefault();\n const { top: y, left: x } = e.target.getBoundingClientRect();\n if (!start) {\n startResize({ clientX: x, clientY: y }, index, v, EVENT_TYPE.KEY);\n } else {\n const clientX =\n keyCodes[e.keyCode] === DIRECTION.L || keyCodes[e.keyCode] === DIRECTION.R\n ? calcPosition(keyCodes[e.keyCode], x)\n : x;\n const clientY =\n keyCodes[e.keyCode] === DIRECTION.U || keyCodes[e.keyCode] === DIRECTION.D\n ? calcPosition(keyCodes[e.keyCode], y)\n : y;\n\n moveResize({ clientX, clientY }, EVENT_TYPE.KEY);\n }\n }\n };\n\n const onLeave = (type) => {\n if (isDragging === type) {\n setDragging(false);\n\n if (resetPoint && resetPoint.blocks) setBlocks(resetPoint.blocks);\n if (resetPoint && resetPoint.containers) setContainers(resetPoint.containers);\n }\n };\n const count = React.Children.count(children);\n\n return (\n <ResizableGrid\n {...rest}\n cols={containers}\n onKeyUp={() => endResize(EVENT_TYPE.KEY)}\n onMouseLeave={() => onLeave(EVENT_TYPE.MOUSE)}\n onMouseMove={(e) => moveResize(e, EVENT_TYPE.MOUSE)}\n onMouseUp={() => endResize(EVENT_TYPE.MOUSE)}\n rows={blocks}\n >\n {React.Children.map(children, (child, index) => (\n <ResizableItem data-index={index} innerRef={addRef}>\n {child}\n {count - 1 !== index && horizontal && (\n <ResizableBar\n container={containers[index]}\n data-index={index}\n gutter={rest.gutter}\n nextContainer={containers[index + 1]}\n onKeyDown={(e) => handleKeyDown(e, index, false)}\n onMouseDown={(e) => startResize(e, index, false, EVENT_TYPE.MOUSE)}\n tabIndex={0}\n />\n )}\n {count - 1 !== index && vertical && (\n <ResizableBar\n container={blocks[index]}\n data-index={index}\n gutter={rest.gutter}\n nextContainer={blocks[index + 1]}\n onKeyDown={(e) => handleKeyDown(e, index, true)}\n onMouseDown={(e) => startResize(e, index, true, EVENT_TYPE.MOUSE)}\n tabIndex={0}\n v\n />\n )}\n </ResizableItem>\n ))}\n </ResizableGrid>\n );\n};\n\nResizableContainer.propTypes = rprops;\nResizableContainer.defaultProps = defaultProps;\nResizableContainer.displayName = 'ResizableContainer';\nconst DSResizableContainerWithSchema = describe(ResizableContainer);\nDSResizableContainerWithSchema.propTypes = rprops;\n\nexport { ResizableContainer, DSResizableContainerWithSchema };\nexport default ResizableContainer;\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;AC8DgC,cA6L/C,YA7L+C;AA3DvD,OAAOA,UAAS,QAAQ,UAAU,iBAAiB;AACnD,SAAS,gBAAgB;AACzB,SAAS,QAAQ,cAAc;AAC/B,SAAS,YAAY;AACrB,SAAS,SAAS,cAAc;AAChC,SAAS,oBAAoB;AAE7B,MAAM,iBAAiB;AACvB,MAAM,gBAAgB;AACtB,MAAM,aAAa,EAAE,OAAO,SAAS,KAAK,SAAS;AACnD,MAAM,YAAY;AAAA,EAChB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEA,SAAS,aAAa,OAAO,UAAU;AACrC,MAAI;AACJ,UAAQ,OAAO;AAAA,IACb,KAAK,UAAU;AACb,eAAS,WAAW;AACpB;AAAA,IACF,KAAK,UAAU;AACb,eAAS,WAAW;AACpB;AAAA,IACF,KAAK,UAAU;AACb,eAAS,WAAW;AACpB;AAAA,IACF,KAAK,UAAU;AACb,eAAS,WAAW;AACpB;AAAA,IACF;AACE,eAAS;AAAA,EACb;AACA,SAAO;AACT;AAEA,SAAS,eAAe,QAAQ,IAAI,YAAY;AAC9C,QAAM,cAAc;AAAA,IAClB,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,MAAM;AAAA,IACN,OAAO;AAAA,IACP,IAAI;AAAA,IACJ,MAAM;AAAA,EACR;AAEA,MAAI,cAAc,UAAU,UAAU,iBAAiB;AAAG,WAAO,YAAY;AAC7E,MAAI,cAAc,KAAK,iBAAiB;AAAG,WAAO,YAAY;AAC9D,MAAI,cAAc,MAAM,iBAAiB;AAAG,WAAO,YAAY;AAE/D,MAAI,CAAC,cAAc,UAAU,UAAU,iBAAiB;AAAG,WAAO,YAAY;AAC9E,MAAI,CAAC,cAAc,MAAM,iBAAiB;AAAG,WAAO,YAAY;AAChE,MAAI,CAAC,cAAc,KAAK,iBAAiB;AAAG,WAAO,YAAY;AAE/D,SAAO,aAAa,YAAY,WAAW,YAAY;AACzD;AAEA,MAAM,yBAAyB,CAAC,EAAE,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\n/* eslint-disable max-lines */\n/* eslint-disable max-statements */\nimport React, { useRef, useState, useEffect } from 'react';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { styled, mapGap } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { props as rprops } from './props.js';\nimport { defaultProps } from './defaultProps.js';\n\nconst safeDifference = 15;\nconst minDifference = 8;\nconst EVENT_TYPE = { MOUSE: 'mouse', KEY: 'arrows' };\nconst DIRECTION = {\n L: 'left',\n R: 'right',\n U: 'up',\n D: 'down',\n};\n\nfunction calcPosition(arrow, position) {\n let offset;\n switch (arrow) {\n case DIRECTION.U:\n offset = position - 3;\n break;\n case DIRECTION.D:\n offset = position + 3;\n break;\n case DIRECTION.L:\n offset = position - 3;\n break;\n case DIRECTION.R:\n offset = position + 3;\n break;\n default:\n offset = position;\n }\n return offset;\n}\n\nfunction cursorResolver(nextPx, px, isVertical) {\n const orientation = {\n vertical: 'row-resize',\n horizontal: 'col-resize',\n left: 'w-resize',\n right: 'e-resize',\n up: 'n-resize',\n down: 's-resize',\n };\n\n if (isVertical && nextPx && nextPx <= safeDifference + 1) return orientation.up;\n if (isVertical && px > safeDifference + 1) return orientation.vertical;\n if (isVertical && px <= safeDifference + 1) return orientation.down;\n\n if (!isVertical && nextPx && nextPx <= safeDifference + 1) return orientation.left;\n if (!isVertical && px <= safeDifference + 1) return orientation.right;\n if (!isVertical && px > safeDifference + 1) return orientation.horizontal;\n\n return isVertical ? orientation.vertical : orientation.horizontal;\n}\n\nconst ResizableItemComponent = ({ innerRef, ...p }) => <Grid ref={innerRef} {...p} />;\n\nconst ResizableGrid = styled(Grid)``;\nconst ResizableItem = styled(ResizableItemComponent)`\n position: relative;\n`;\nconst ResizableBar = styled.div`\n position: absolute;\n cursor: ${({ container, nextContainer, v }) => cursorResolver(nextContainer, container, v)};\n\n ${(props) => {\n if (props.v) {\n return `\n bottom: calc(${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: ${props.theme.colors.neutral['300']};\n content: '';\n }\n &:hover{\n &:after{\n background: ${props.theme.colors.brand['600']};\n } \n }\n `;\n }\n return `\n top: 0;\n right: calc(${mapGap(props.gutter)} * -0.5);\n height: 100%;\n width: 10px;\n margin-right: -5px;\n display: flex;\n flex-direction: row;\n justify-content:space-around;\n align-items: center;\n &:after{\n height: 100%;\n width: 1px;\n display: block;\n background: ${props.theme.colors.neutral['300']};\n content: '';\n }\n &:hover{\n &:after{\n background: ${props.theme.colors.brand['600']};\n } \n }\n `;\n }}\n`;\nconst getWidths = (list) => list.map((l) => l.clientWidth);\nconst getHeights = (list) => list.map((l) => l.clientHeight);\n\nconst ResizableContainer = ({ children, cols, rows, vertical, horizontal, ...rest }) => {\n const refs = useRef([]);\n const [containers, setContainers] = useState(cols);\n const [blocks, setBlocks] = useState(rows);\n const [isDragging, setDragging] = useState(false);\n const [start, setStartPoint] = useState(0);\n const [resetPoint, setResetPoint] = useState();\n\n useEffect(() => {\n if (horizontal) setContainers(getWidths(refs.current));\n if (vertical) setBlocks(getHeights(refs.current));\n }, [refs.current, horizontal, vertical]);\n const addRef = (node) => {\n refs.current.push(node);\n };\n const resizePanels = (diff = 1, v = false) => {\n const index = parseInt(start.index, 10);\n if (!v) {\n const newContainers = [...containers];\n if (newContainers[index + 1] && newContainers[index + 1] > minDifference) {\n newContainers[index + 1] = newContainers[index + 1] - diff;\n newContainers[index] = diff + newContainers[index];\n } else if (newContainers[index - 1] && newContainers[index - 1] > minDifference) {\n newContainers[index - 1] = newContainers[index - 1] - diff;\n newContainers[index] = diff + newContainers[index];\n }\n if (newContainers.every((c) => c > safeDifference)) setContainers(newContainers);\n } else {\n const newBlocks = [...blocks];\n if (newBlocks[index + 1] && newBlocks[index + 1] > minDifference) {\n newBlocks[index + 1] = newBlocks[index + 1] - diff;\n newBlocks[index] = diff + newBlocks[index];\n } else if (newBlocks[index - 1] && newBlocks[index - 1] > minDifference) {\n newBlocks[index - 1] = newBlocks[index - 1] - diff;\n newBlocks[index] = diff + newBlocks[index];\n }\n if (newBlocks.every((c) => c > safeDifference)) setBlocks(newBlocks);\n }\n };\n const startResize = (event, index, v = false, type) => {\n setDragging(type);\n setStartPoint({\n x: event.clientX,\n y: event.clientY,\n index,\n v,\n });\n setResetPoint({ containers, blocks });\n };\n const moveResize = (event, type) => {\n if (isDragging && isDragging === type && !start.v) {\n const diff = event.clientX - start.x;\n if (diff === 0) return;\n setStartPoint({ x: event.clientX, index: start.index });\n resizePanels(diff);\n } else if (isDragging && isDragging === type && start.v) {\n const diff = event.clientY - start.y;\n if (diff === 0) return;\n setStartPoint({ ...start, y: event.clientY, index: start.index });\n resizePanels(diff, true);\n }\n };\n const endResize = (type) => {\n if (isDragging === type) {\n setDragging(false);\n setStartPoint();\n }\n };\n const handleKeyDown = (e, index, v = false) => {\n const keyCodes = {\n 37: DIRECTION.L,\n Left: DIRECTION.L,\n ArrowLeft: DIRECTION.L,\n 38: DIRECTION.U,\n Up: DIRECTION.U,\n ArrowUp: DIRECTION.U,\n 39: DIRECTION.R,\n Right: DIRECTION.R,\n ArrowRight: DIRECTION.R,\n 40: DIRECTION.D,\n Down: DIRECTION.D,\n ArrowDown: DIRECTION.D,\n };\n\n if (keyCodes[e.key || e.keyCode]) {\n e.preventDefault();\n const { top: y, left: x } = e.target.getBoundingClientRect();\n if (!start) {\n startResize({ clientX: x, clientY: y }, index, v, EVENT_TYPE.KEY);\n } else {\n const clientX =\n keyCodes[e.keyCode] === DIRECTION.L || keyCodes[e.keyCode] === DIRECTION.R\n ? calcPosition(keyCodes[e.keyCode], x)\n : x;\n const clientY =\n keyCodes[e.keyCode] === DIRECTION.U || keyCodes[e.keyCode] === DIRECTION.D\n ? calcPosition(keyCodes[e.keyCode], y)\n : y;\n\n moveResize({ clientX, clientY }, EVENT_TYPE.KEY);\n }\n }\n };\n\n const onLeave = (type) => {\n if (isDragging === type) {\n setDragging(false);\n\n if (resetPoint && resetPoint.blocks) setBlocks(resetPoint.blocks);\n if (resetPoint && resetPoint.containers) setContainers(resetPoint.containers);\n }\n };\n const count = React.Children.count(children);\n\n return (\n <ResizableGrid\n {...rest}\n cols={containers}\n onKeyUp={() => endResize(EVENT_TYPE.KEY)}\n onMouseLeave={() => onLeave(EVENT_TYPE.MOUSE)}\n onMouseMove={(e) => moveResize(e, EVENT_TYPE.MOUSE)}\n onMouseUp={() => endResize(EVENT_TYPE.MOUSE)}\n rows={blocks}\n >\n {React.Children.map(children, (child, index) => (\n <ResizableItem data-index={index} innerRef={addRef}>\n {child}\n {count - 1 !== index && horizontal && (\n <ResizableBar\n container={containers[index]}\n data-index={index}\n gutter={rest.gutter}\n nextContainer={containers[index + 1]}\n onKeyDown={(e) => handleKeyDown(e, index, false)}\n onMouseDown={(e) => startResize(e, index, false, EVENT_TYPE.MOUSE)}\n tabIndex={0}\n />\n )}\n {count - 1 !== index && vertical && (\n <ResizableBar\n container={blocks[index]}\n data-index={index}\n gutter={rest.gutter}\n nextContainer={blocks[index + 1]}\n onKeyDown={(e) => handleKeyDown(e, index, true)}\n onMouseDown={(e) => startResize(e, index, true, EVENT_TYPE.MOUSE)}\n tabIndex={0}\n v\n />\n )}\n </ResizableItem>\n ))}\n </ResizableGrid>\n );\n};\n\nResizableContainer.propTypes = rprops;\nResizableContainer.defaultProps = defaultProps;\nResizableContainer.displayName = 'ResizableContainer';\nconst DSResizableContainerWithSchema = describe(ResizableContainer);\nDSResizableContainerWithSchema.propTypes = rprops;\n\nexport { ResizableContainer, DSResizableContainerWithSchema };\nexport default ResizableContainer;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
package/dist/esm/index.js
CHANGED
package/dist/esm/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './Resizable';\nexport { default } from './Resizable';\n"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './Resizable.js';\nexport { default } from './Resizable.js';\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;AACd,SAAS,WAAAA,gBAAe;",
|
|
6
6
|
"names": ["default"]
|
|
7
7
|
}
|
package/dist/esm/props.js
CHANGED
|
@@ -1,10 +1,15 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { PropTypes } from "@elliemae/ds-props-helpers";
|
|
3
3
|
const props = {
|
|
4
|
+
/** grid item content */
|
|
4
5
|
children: PropTypes.node.description("Grid item content"),
|
|
6
|
+
/** vertical resizing */
|
|
5
7
|
vertical: PropTypes.bool.description("vertical resizing"),
|
|
8
|
+
/** horizontal resizing */
|
|
6
9
|
horizontal: PropTypes.bool.description("horizontal resizing"),
|
|
10
|
+
/** Row layout cells */
|
|
7
11
|
rows: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])).description("Row layout cells"),
|
|
12
|
+
/** Column layout cells */
|
|
8
13
|
cols: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])).description("Column layout cells")
|
|
9
14
|
};
|
|
10
15
|
export {
|
package/dist/esm/props.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/props.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { PropTypes } from '@elliemae/ds-props-helpers';\n\nexport const props = {\n /** grid item content */\n children: PropTypes.node.description('Grid item content'),\n /** vertical resizing */\n vertical: PropTypes.bool.description('vertical resizing'),\n /** horizontal resizing */\n horizontal: PropTypes.bool.description('horizontal resizing'),\n /** Row layout cells */\n rows: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])).description('Row layout cells'),\n /** Column layout cells */\n cols: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])).description('Column layout cells'),\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,iBAAiB;AAEnB,MAAM,QAAQ;AAAA,EAEnB,UAAU,UAAU,KAAK,YAAY,mBAAmB;AAAA,EAExD,UAAU,UAAU,KAAK,YAAY,mBAAmB;AAAA,EAExD,YAAY,UAAU,KAAK,YAAY,qBAAqB;AAAA,EAE5D,MAAM,UAAU,QAAQ,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,MAAM,CAAC,CAAC,EAAE,YAAY,kBAAkB;AAAA,EAEjH,MAAM,UAAU,QAAQ,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,MAAM,CAAC,CAAC,EAAE,YAAY,qBAAqB;AACtH;",
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,iBAAiB;AAEnB,MAAM,QAAQ;AAAA;AAAA,EAEnB,UAAU,UAAU,KAAK,YAAY,mBAAmB;AAAA;AAAA,EAExD,UAAU,UAAU,KAAK,YAAY,mBAAmB;AAAA;AAAA,EAExD,YAAY,UAAU,KAAK,YAAY,qBAAqB;AAAA;AAAA,EAE5D,MAAM,UAAU,QAAQ,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,MAAM,CAAC,CAAC,EAAE,YAAY,kBAAkB;AAAA;AAAA,EAEjH,MAAM,UAAU,QAAQ,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,MAAM,CAAC,CAAC,EAAE,YAAY,qBAAqB;AACtH;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -8,11 +8,11 @@ declare const ResizableContainer: {
|
|
|
8
8
|
horizontal: any;
|
|
9
9
|
}): JSX.Element;
|
|
10
10
|
propTypes: {
|
|
11
|
-
children: import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
12
|
-
vertical: import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
13
|
-
horizontal: import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
14
|
-
rows: import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
15
|
-
cols: import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
11
|
+
children: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
12
|
+
vertical: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
13
|
+
horizontal: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
14
|
+
rows: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
15
|
+
cols: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
16
16
|
};
|
|
17
17
|
defaultProps: {
|
|
18
18
|
vertical: boolean;
|
|
@@ -20,7 +20,7 @@ declare const ResizableContainer: {
|
|
|
20
20
|
};
|
|
21
21
|
displayName: string;
|
|
22
22
|
};
|
|
23
|
-
declare const DSResizableContainerWithSchema: import("@elliemae/ds-props-helpers/dist/types/propTypes/types").DocumentedReactComponent<{
|
|
23
|
+
declare const DSResizableContainerWithSchema: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").DocumentedReactComponent<{
|
|
24
24
|
[x: string]: any;
|
|
25
25
|
children: any;
|
|
26
26
|
cols: any;
|
package/dist/types/index.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export * from './Resizable';
|
|
2
|
-
export { default } from './Resizable';
|
|
1
|
+
export * from './Resizable.js';
|
|
2
|
+
export { default } from './Resizable.js';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-resizeable-container",
|
|
3
|
-
"version": "3.16.
|
|
3
|
+
"version": "3.16.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Resizeable Container",
|
|
6
6
|
"files": [
|
|
@@ -47,16 +47,16 @@
|
|
|
47
47
|
"indent": 4
|
|
48
48
|
},
|
|
49
49
|
"dependencies": {
|
|
50
|
-
"@elliemae/ds-grid": "3.16.
|
|
51
|
-
"@elliemae/ds-props-helpers": "3.16.
|
|
52
|
-
"@elliemae/ds-system": "3.16.
|
|
53
|
-
"@elliemae/ds-utilities": "3.16.
|
|
50
|
+
"@elliemae/ds-grid": "3.16.1",
|
|
51
|
+
"@elliemae/ds-props-helpers": "3.16.1",
|
|
52
|
+
"@elliemae/ds-system": "3.16.1",
|
|
53
|
+
"@elliemae/ds-utilities": "3.16.1"
|
|
54
54
|
},
|
|
55
55
|
"devDependencies": {
|
|
56
|
-
"@testing-library/jest-dom": "~5.16.
|
|
56
|
+
"@testing-library/jest-dom": "~5.16.5",
|
|
57
57
|
"@testing-library/react": "~12.1.3",
|
|
58
58
|
"@testing-library/user-event": "~13.5.0",
|
|
59
|
-
"styled-components": "~5.3.
|
|
59
|
+
"styled-components": "~5.3.9"
|
|
60
60
|
},
|
|
61
61
|
"peerDependencies": {
|
|
62
62
|
"react": "^17.0.2",
|