publ-echo-test 0.0.54 → 0.0.56
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.
@@ -198,7 +198,7 @@ var GridItem = function (_a) {
|
|
198
198
|
];
|
199
199
|
return (_jsx(Resizable, { draggableOpts: {
|
200
200
|
disabled: !isResizable,
|
201
|
-
}, className: isResizable ? undefined : "react-resizable-hide", width: position.width, height: position.height, top: position.top, left: position.left, resizeHandles: props.resizeHandles, onResizeStop: onResizeStop, onResizeStart: onResizeStart, onResize: onResize, minConstraints: minConstraints, maxConstraints: maxConstraints, transformScale: transformScale, handle: resizeHandle, isResizing: isResizing, autoResize: autoResize, children: child }));
|
201
|
+
}, className: isResizable ? undefined : "react-resizable-hide", width: position.width, height: position.height, top: position.top, left: position.left, resizeHandles: props.resizeHandles, onResizeStop: onResizeStop, onResizeStart: onResizeStart, onResize: onResize, minConstraints: minConstraints, maxConstraints: maxConstraints, transformScale: transformScale, handle: resizeHandle, isResizing: isResizing, autoResize: autoResize, colWidth: colWidth, margin: props.margin, children: child }));
|
202
202
|
};
|
203
203
|
/**
|
204
204
|
* onDragStart event handler
|
@@ -2,5 +2,5 @@ import React from "react";
|
|
2
2
|
import { PropsWithChildren } from "../Draggable/types";
|
3
3
|
import { ResizableProps } from "./types";
|
4
4
|
type Props = ResizableProps;
|
5
|
-
declare const Resizable: ({ children, axis, handleSize, lockAspectRatio, minConstraints, maxConstraints, resizeHandles, transformScale, isResizing, autoResize, ...props }: PropsWithChildren<Props>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
|
5
|
+
declare const Resizable: ({ children, axis, handleSize, lockAspectRatio, minConstraints, maxConstraints, resizeHandles, transformScale, isResizing, autoResize, colWidth, margin, ...props }: PropsWithChildren<Props>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
|
6
6
|
export default Resizable;
|
@@ -32,10 +32,10 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
32
32
|
import { createElement as _createElement } from "react";
|
33
33
|
import { jsx as _jsx } from "react/jsx-runtime";
|
34
34
|
import React, { useEffect, useRef } from "react";
|
35
|
-
import DraggableCore from "
|
35
|
+
import { DraggableCore } from "react-draggable";
|
36
36
|
import { cloneElement } from "./utils/cloneElement";
|
37
37
|
var Resizable = function (_a) {
|
38
|
-
var children = _a.children, _b = _a.axis, axis = _b === void 0 ? "both" : _b, _c = _a.handleSize, handleSize = _c === void 0 ? [20, 20] : _c, _d = _a.lockAspectRatio, lockAspectRatio = _d === void 0 ? false : _d, _e = _a.minConstraints, minConstraints = _e === void 0 ? [20, 20] : _e, _f = _a.maxConstraints, maxConstraints = _f === void 0 ? [Infinity, Infinity] : _f, _g = _a.resizeHandles, resizeHandles = _g === void 0 ? ["se"] : _g, _h = _a.transformScale, transformScale = _h === void 0 ? 1 : _h, isResizing = _a.isResizing, autoResize = _a.autoResize, props = __rest(_a, ["children", "axis", "handleSize", "lockAspectRatio", "minConstraints", "maxConstraints", "resizeHandles", "transformScale", "isResizing", "autoResize"]);
|
38
|
+
var children = _a.children, _b = _a.axis, axis = _b === void 0 ? "both" : _b, _c = _a.handleSize, handleSize = _c === void 0 ? [20, 20] : _c, _d = _a.lockAspectRatio, lockAspectRatio = _d === void 0 ? false : _d, _e = _a.minConstraints, minConstraints = _e === void 0 ? [20, 20] : _e, _f = _a.maxConstraints, maxConstraints = _f === void 0 ? [Infinity, Infinity] : _f, _g = _a.resizeHandles, resizeHandles = _g === void 0 ? ["se"] : _g, _h = _a.transformScale, transformScale = _h === void 0 ? 1 : _h, isResizing = _a.isResizing, autoResize = _a.autoResize, colWidth = _a.colWidth, margin = _a.margin, props = __rest(_a, ["children", "axis", "handleSize", "lockAspectRatio", "minConstraints", "maxConstraints", "resizeHandles", "transformScale", "isResizing", "autoResize", "colWidth", "margin"]);
|
39
39
|
var handleRefs = useRef({
|
40
40
|
s: useRef(null),
|
41
41
|
n: useRef(null),
|
@@ -90,8 +90,12 @@ var Resizable = function (_a) {
|
|
90
90
|
minHeight.current = target.clientHeight;
|
91
91
|
}
|
92
92
|
var minWidthStyle = target.computedStyleMap().get('min-width');
|
93
|
-
if (typeof minWidthStyle.value === 'number') {
|
94
|
-
|
93
|
+
if (typeof minWidthStyle.value === 'number' && margin && colWidth) {
|
94
|
+
var minWidthBase = minWidthStyle.value;
|
95
|
+
var minColWidth = (minWidthBase + margin[0]) / (colWidth + margin[0]);
|
96
|
+
var minW = Math.ceil(minColWidth);
|
97
|
+
var minWidthPx = (minW * colWidth) + ((minW - 1) * margin[0]);
|
98
|
+
minWidth.current = Math.round(minWidthPx);
|
95
99
|
}
|
96
100
|
}, [isResizing, autoResize, children, elementRef]);
|
97
101
|
var resetData = function () {
|
@@ -137,6 +141,8 @@ var Resizable = function (_a) {
|
|
137
141
|
height = Math.min(maxConstraints[1], height);
|
138
142
|
}
|
139
143
|
slack.current = [slackW + (oldW - width), slackH + (oldH - height)];
|
144
|
+
console.log(slack.current);
|
145
|
+
console.log(oldW, width);
|
140
146
|
return [width, height];
|
141
147
|
};
|
142
148
|
var checkTopLeft = function (deltaX, deltaY, top, left, width, height, handleAxis) {
|
@@ -233,6 +239,7 @@ var Resizable = function (_a) {
|
|
233
239
|
if (axisH === "w") {
|
234
240
|
left = left - deltaX;
|
235
241
|
}
|
242
|
+
// console.log(width);
|
236
243
|
_b = checkConstraints(width, height), width = _b[0], height = _b[1];
|
237
244
|
if (autoResize && minHeight.current === height) {
|
238
245
|
handleAxis = removeNorthHandle(handleAxis);
|
@@ -63,5 +63,7 @@ export type ResizableProps = {
|
|
63
63
|
height: number;
|
64
64
|
isResizing?: boolean;
|
65
65
|
autoResize?: boolean;
|
66
|
+
colWidth?: number;
|
67
|
+
margin?: [number, number];
|
66
68
|
};
|
67
69
|
export type ResizeHandleType = ReactElement<any> | ((resizeHandleAxis: ResizeHandleAxis, ref: Ref<HTMLElement>) => ReactElement<any>);
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "publ-echo-test",
|
3
|
-
"version": "0.0.
|
3
|
+
"version": "0.0.56",
|
4
4
|
"private": false,
|
5
5
|
"main": "dist/lib/index.js",
|
6
6
|
"types": "dist/lib/index.d.js",
|
@@ -52,5 +52,8 @@
|
|
52
52
|
"styled-components": "^5.3.10",
|
53
53
|
"typescript": "^5.1.6",
|
54
54
|
"web-vitals": "^2.1.4"
|
55
|
+
},
|
56
|
+
"dependencies": {
|
57
|
+
"react-draggable": "^4.4.6"
|
55
58
|
}
|
56
59
|
}
|