publ-echo 0.0.4 → 0.0.6

package/dist/lib/PreviewGLE/ReactGridLayoutPreview.js

@@ -0,0 +1,35 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import ReactGridLayout from "../GridLayoutEditor/ReactGridLayout";
+import styled from "styled-components";
+// const Responsive = WidthProvider(ReactGridLayout);
+// NOTE - 예시용으로 확인할 수 있게 props을 받았지만 추후에 배포될 때 제거 필요
+function ReactGridLayoutPreview(_a) {
+    var layout = _a.layout, props = _a.props;
+    var defaultProps = {
+        isDraggable: false,
+        isResizable: false,
+    };
+    // const [layout, setLayout] = useState<Layout>(lay);
+    function onLayoutChange(newLayout) {
+        // setLayout(newLayout);
+    }
+    return (_jsx(ReactGridLayout, __assign({ layout: layout, onLayoutChange: onLayoutChange }, defaultProps, props, { children: layout.map(function (each) { return (_jsx(S_SampleBox, { children: each.i }, each.i)); }) })));
+}
+var S_SampleBox = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 100px;\n  height: 100px;\n  background-color: #fbff00;\n  border: #3c1eff 1px solid;\n"], ["\n  width: 100px;\n  height: 100px;\n  background-color: #fbff00;\n  border: #3c1eff 1px solid;\n"])));
+export default ReactGridLayoutPreview;
+var templateObject_1;

package/dist/lib/PreviewGLE/ResponsiveGridLayoutPreview.d.ts

@@ -0,0 +1,9 @@
+import { Layout } from "../GridLayoutEditor/types";
+type Props = {
+    layouts: {
+        [key: string]: Layout;
+    };
+    props: any;
+};
+declare function ResponsiveGridLayoutPreview({ layouts, props }: Props): import("react/jsx-runtime").JSX.Element;
+export default ResponsiveGridLayoutPreview;

package/dist/lib/PreviewGLE/ResponsiveGridLayoutPreview.js

@@ -0,0 +1,38 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import styled from "styled-components";
+import ResponsiveGridLayout from "../GridLayoutEditor/ResponsiveGridLayout";
+import { WidthProvider } from "../components";
+import _ from "lodash";
+var Responsive = WidthProvider(ResponsiveGridLayout);
+// NOTE - 예시용으로 확인할 수 있게 props을 받았지만 추후에 배포될 때 제거 필요
+function ResponsiveGridLayoutPreview(_a) {
+    var layouts = _a.layouts, props = _a.props;
+    var defaultProps = {
+        isDraggable: false,
+        isResizable: false,
+    };
+    function generateDOM() {
+        return _.map(layouts.lg, function (l, i) {
+            return (_jsx(S_SampleBox, { className: l.static ? "static" : "", children: l.static ? (_jsxs("span", { className: "text", title: "This item is static and cannot be removed or resized.", children: ["Static - ", i] })) : (_jsx("span", { className: "text", children: i })) }, i));
+        });
+    }
+    return (_jsx(Responsive, __assign({ layouts: layouts }, defaultProps, props, { children: generateDOM() })));
+}
+var S_SampleBox = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 100px;\n  height: 100px;\n  background-color: #fbff00;\n  border: #3c1eff 1px solid;\n"], ["\n  width: 100px;\n  height: 100px;\n  background-color: #fbff00;\n  border: #3c1eff 1px solid;\n"])));
+export default ResponsiveGridLayoutPreview;
+var templateObject_1;

package/dist/lib/PreviewGLE/index.js

@@ -0,0 +1,2 @@
+export { default as ReactGridLayoutPreview } from "./ReactGridLayoutPreview";
+export { default as ResponsiveGridLayoutPreview } from "./ResponsiveGridLayoutPreview";

package/dist/lib/Resizable/Resizable.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { PropsWithChildren } from "../Draggable/types";
+import { ResizableProps } from "./types";
+import "./styles/styles.css";
+type Props = ResizableProps;
+declare const Resizable: ({ children, axis, handleSize, lockAspectRatio, minConstraints, maxConstraints, resizeHandles, transformScale, ...props }: PropsWithChildren<Props>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+export default Resizable;

package/dist/lib/Resizable/Resizable.js

@@ -0,0 +1,216 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { createElement as _createElement } from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
+import React, { useRef } from "react";
+import DraggableCore from "../Draggable/DraggableCore";
+import { cloneElement } from "./utils/cloneElement";
+import "./styles/styles.css";
+var Resizable = function (_a) {
+    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, props = __rest(_a, ["children", "axis", "handleSize", "lockAspectRatio", "minConstraints", "maxConstraints", "resizeHandles", "transformScale"]);
+    var handleRefs = useRef({
+        s: useRef(null),
+        n: useRef(null),
+        e: useRef(null),
+        w: useRef(null),
+        se: useRef(null),
+        sw: useRef(null),
+        ne: useRef(null),
+        nw: useRef(null),
+    });
+    var startPosition = useRef(null);
+    var startSize = useRef(null);
+    var lastHandleRect = null;
+    var slack = null;
+    var className = props.className, draggableOpts = props.draggableOpts, width = props.width, height = props.height, handle = props.handle, onResize = props.onResize, onResizeStop = props.onResizeStop, onResizeStart = props.onResizeStart, restProps = __rest(props, ["className", "draggableOpts", "width", "height", "handle", "onResize", "onResizeStop", "onResizeStart"]);
+    var resetData = function () {
+        lastHandleRect = slack = null;
+    };
+    // NOTE - 최소 또는 최대 제약 조건 width와 height 계산, 비율 고정 계산
+    var checkConstraints = function (width, height) {
+        if (!minConstraints && !maxConstraints && !lockAspectRatio) {
+            return [width, height];
+        }
+        if (lockAspectRatio) {
+            var ratio = props.width / props.height;
+            var deltaWidth = width - props.width;
+            var deltaHeight = height - props.height;
+            if (Math.abs(deltaWidth) > Math.abs(deltaHeight * ratio)) {
+                height = width / ratio;
+            }
+            else {
+                width = height * ratio;
+            }
+        }
+        var _a = [width, height], oldW = _a[0], oldH = _a[1];
+        var _b = slack || [0, 0], slackW = _b[0], slackH = _b[1];
+        width += slackW;
+        height += slackH;
+        if (minConstraints) {
+            width = Math.max(minConstraints[0], width);
+            height = Math.max(minConstraints[1], height);
+        }
+        if (maxConstraints) {
+            width = Math.min(maxConstraints[0], width);
+            height = Math.min(maxConstraints[1], height);
+        }
+        slack = [slackW + (oldW - width), slackH + (oldH - height)];
+        return [width, height];
+    };
+    var checkTopLeft = function (deltaX, deltaY, top, left, width, height, handleAxis) {
+        var newTop = top;
+        var newLeft = left;
+        if (!startPosition.current || !startSize.current)
+            return [newTop, newLeft];
+        var currentSumOfLeftAndWidth = left + width;
+        var startSumOfLeftAndWidth = startPosition.current.left + startSize.current.width;
+        var currentSumOfTopAndHeight = top + height;
+        var startSumOfTopAndHeight = startPosition.current.top + startSize.current.height;
+        var resizableLeft = startPosition.current.left + (startSize.current.width - width);
+        var resizableTop = startPosition.current.top + (startSize.current.height - height);
+        if (deltaX < 0) {
+            if (handleAxis === "nw" || handleAxis === "w" || handleAxis === "sw") {
+                if (currentSumOfLeftAndWidth > startSumOfLeftAndWidth) {
+                    newLeft = Math.min(left, resizableLeft);
+                }
+            }
+        }
+        if (deltaY < 0) {
+            if (handleAxis === "nw" || handleAxis === "n" || handleAxis === "ne") {
+                if (currentSumOfTopAndHeight > startSumOfTopAndHeight) {
+                    newTop = Math.min(top, resizableTop);
+                }
+            }
+        }
+        if (deltaX > 0) {
+            if (handleAxis === "nw" || handleAxis === "w" || handleAxis === "sw") {
+                if (width >= minConstraints[0]) {
+                    newLeft = Math.max(left, resizableLeft);
+                }
+            }
+        }
+        if (deltaY > 0) {
+            if (handleAxis === "nw" || handleAxis === "n" || handleAxis === "ne") {
+                if (height >= minConstraints[1]) {
+                    newTop = Math.max(top, resizableTop);
+                }
+            }
+        }
+        return [newTop, newLeft];
+    };
+    var resizeHandler = function (handlerName, handleAxis) {
+        return function (e, _a) {
+            var _b, _c;
+            var _d, _e, _f, _g, _h, _j;
+            var node = _a.node, deltaX = _a.deltaX, deltaY = _a.deltaY;
+            if (handlerName === "onResizeStart") {
+                var position = { top: (_d = props.top) !== null && _d !== void 0 ? _d : 0, left: (_e = props.left) !== null && _e !== void 0 ? _e : 0 };
+                startPosition.current = position;
+                startSize.current = {
+                    width: (_f = props.width) !== null && _f !== void 0 ? _f : 0,
+                    height: (_g = props.height) !== null && _g !== void 0 ? _g : 0,
+                };
+                resetData();
+            }
+            var canDragX = (axis === "both" || axis === "x") &&
+                handleAxis !== "n" &&
+                handleAxis !== "s";
+            var canDragY = (axis === "both" || axis === "y") &&
+                handleAxis !== "e" &&
+                handleAxis !== "w";
+            if (!canDragX && !canDragY)
+                return;
+            var axisV = handleAxis[0];
+            var axisH = handleAxis[handleAxis.length - 1];
+            var handleRect = node.getBoundingClientRect();
+            // if (lastHandleRect !== null) {
+            //   if (axisH === "w") {
+            //     const deltaLeftSinceLast = handleRect.left - lastHandleRect.left;
+            //     deltaX += deltaLeftSinceLast;
+            //   }
+            //   if (axisV === "n") {
+            //     const deltaTopSinceLast = handleRect.top - lastHandleRect.top;
+            //     deltaY += deltaTopSinceLast;
+            //   }
+            // }
+            lastHandleRect = handleRect;
+            if (axisH === "w") {
+                deltaX = -deltaX;
+            }
+            if (axisV === "n") {
+                deltaY = -deltaY;
+            }
+            var width = props.width + (canDragX ? deltaX / transformScale : 0);
+            var height = props.height + (canDragY ? deltaY / transformScale : 0);
+            var left = (_h = props === null || props === void 0 ? void 0 : props.left) !== null && _h !== void 0 ? _h : 0;
+            var top = (_j = props === null || props === void 0 ? void 0 : props.top) !== null && _j !== void 0 ? _j : 0;
+            if (axisV === "n") {
+                top = top - deltaY;
+            }
+            if (axisH === "w") {
+                left = left - deltaX;
+            }
+            _b = checkConstraints(width, height), width = _b[0], height = _b[1];
+            _c = checkTopLeft(deltaX, deltaY, top, left, width, height, handleAxis), top = _c[0], left = _c[1];
+            var isDimensionsChanged = width !== props.width || height !== props.height;
+            var cb = typeof props[handlerName] === "function" ? props[handlerName] : null;
+            var isCbSkipped = handlerName === "onResize" && !isDimensionsChanged;
+            if (cb && !isCbSkipped) {
+                cb(e, { node: node, size: { width: width, height: height, top: top, left: left }, handle: handleAxis });
+            }
+            if (handlerName === "onResizeStop") {
+                startPosition.current = null;
+                startSize.current = null;
+                resetData();
+            }
+        };
+    };
+    var renderResizeHandle = function (handleAxis, ref) {
+        if (!handle) {
+            return (_jsx("span", { className: "react-resizable-handle react-resizable-handle-".concat(handleAxis), ref: ref }));
+        }
+        if (typeof handle === "function") {
+            return handle(handleAxis, ref);
+        }
+        var isDOMElement = typeof handle.type === "string";
+        var props = __assign({ ref: ref }, (isDOMElement ? {} : { handleAxis: handleAxis }));
+        return React.cloneElement(handle, props);
+    };
+    return cloneElement(children, __assign(__assign({}, restProps), { className: "".concat(className ? "".concat(className, " ") : "", "react-resizable"), children: __spreadArray([
+            // ...children.props.children,
+            React.Children.map(children.props.children, function (child) { return child; })
+        ], resizeHandles.map(function (handleAxis) {
+            var ref = (handleRefs === null || handleRefs === void 0 ? void 0 : handleRefs.current) && handleRefs.current[handleAxis];
+            return (_createElement(DraggableCore, __assign({}, draggableOpts, { nodeRef: ref, key: "resizableHandle-".concat(handleAxis), onStop: resizeHandler("onResizeStop", handleAxis), onStart: resizeHandler("onResizeStart", handleAxis), onDrag: resizeHandler("onResize", handleAxis) }), renderResizeHandle(handleAxis, ref)));
+        }), true) }));
+};
+export default Resizable;

package/dist/lib/Resizable/ResizableBox.d.ts

@@ -0,0 +1,7 @@
+import { ResizableProps } from "./types";
+import { PropsWithChildren } from "../Draggable/types";
+type ResizableBoxProps = ResizableProps & {
+    style?: Object;
+};
+declare const ResizableBox: ({ children, ...props }: PropsWithChildren<ResizableBoxProps>) => import("react/jsx-runtime").JSX.Element;
+export default ResizableBox;

package/dist/lib/Resizable/ResizableBox.js

@@ -0,0 +1,57 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from "react";
+import Resizable from "./Resizable";
+var ResizableBox = function (_a) {
+    var children = _a.children, props = __rest(_a, ["children"]);
+    var handle = props.handle, handleSize = props.handleSize, onResize = props.onResize, onResizeStart = props.onResizeStart, onResizeStop = props.onResizeStop, draggableOpts = props.draggableOpts, minConstraints = props.minConstraints, maxConstraints = props.maxConstraints, lockAspectRatio = props.lockAspectRatio, axis = props.axis, width = props.width, height = props.height, resizeHandles = props.resizeHandles, style = props.style, transformScale = props.transformScale, restProps = __rest(props, ["handle", "handleSize", "onResize", "onResizeStart", "onResizeStop", "draggableOpts", "minConstraints", "maxConstraints", "lockAspectRatio", "axis", "width", "height", "resizeHandles", "style", "transformScale"]);
+    var _b = useState({
+        width: width,
+        height: height,
+        propsWidth: width,
+        propsHeight: height,
+    }), resizableBoxState = _b[0], setResizableBoxState = _b[1];
+    var handleResize = function (e, data) {
+        var size = data.size;
+        if (props.onResize) {
+            setResizableBoxState(function (prevState) { return (__assign(__assign({}, prevState), { width: size.width, height: size.height })); });
+            props.onResize(e, data);
+        }
+        else {
+            setResizableBoxState(function (prevState) { return (__assign(__assign({}, prevState), { width: size.width, height: size.height })); });
+        }
+    };
+    // NOTE - class형 컴포넌트에서 사용되는 getDerivedStateFromProps에 대응하기 위한 조건문입니다.
+    if (width !== resizableBoxState.propsWidth ||
+        height !== resizableBoxState.propsHeight) {
+        setResizableBoxState({
+            width: width,
+            height: height,
+            propsWidth: width,
+            propsHeight: height,
+        });
+    }
+    return (_jsx(_Fragment, { children: _jsx(Resizable, { axis: axis, draggableOpts: draggableOpts, handle: handle, handleSize: handleSize, height: resizableBoxState.height, lockAspectRatio: lockAspectRatio, maxConstraints: maxConstraints, minConstraints: minConstraints, onResizeStart: onResizeStart, onResize: handleResize, onResizeStop: onResizeStop, resizeHandles: resizeHandles, transformScale: transformScale, width: resizableBoxState.width, children: _jsx("div", __assign({}, restProps, { style: __assign(__assign({}, style), { width: resizableBoxState.width + "px", height: resizableBoxState.height + "px" }) })) }) }));
+};
+export default ResizableBox;

package/dist/lib/Resizable/index.js

@@ -0,0 +1 @@
+export { default as Resizable } from "./Resizable";

package/dist/lib/Resizable/types.d.ts

@@ -0,0 +1,63 @@
+import { CSSProperties, ReactElement, Ref, SyntheticEvent } from "react";
+import { DraggableCoreDefaultProps } from "../Draggable/types";
+export type ReactRef<T> = {
+    current: T | null;
+};
+export type Axis = "both" | "x" | "y" | "none";
+export type ResizeHandleAxis = "s" | "w" | "e" | "n" | "sw" | "nw" | "se" | "ne";
+export type ResizableBoxState = {
+    width: number;
+    height: number;
+    propsWidth: number;
+    propsHeight: number;
+};
+export type DragCallbackData = {
+    node: HTMLElement;
+    x: number;
+    y: number;
+    deltaX: number;
+    deltaY: number;
+    lastX: number;
+    lastY: number;
+};
+export type ResizeCallbackData = {
+    node: HTMLElement;
+    size: {
+        width: number;
+        height: number;
+        top: number;
+        left: number;
+    };
+    handle: ResizeHandleAxis;
+};
+export type ResizableDefaultProps = {
+    axis: Axis;
+    handleSize: [number, number];
+    lockAspectRatio: boolean;
+    minConstraints: [number, number];
+    maxConstraints: [number, number];
+    resizeHandles: ResizeHandleAxis[];
+    transformScale: number;
+};
+export type ResizableProps = {
+    top?: number;
+    left?: number;
+    children?: ReactElement<any>;
+    axis?: Axis;
+    className?: string;
+    draggableOpts?: Partial<DraggableCoreDefaultProps>;
+    handle?: ResizeHandleType;
+    onResizeStop?: (e: SyntheticEvent<any>, data: ResizeCallbackData) => any;
+    onResizeStart?: (e: SyntheticEvent<any>, data: ResizeCallbackData) => any;
+    onResize?: (e: SyntheticEvent<any>, data: ResizeCallbackData) => any;
+    handleSize?: [number, number];
+    lockAspectRatio?: boolean;
+    minConstraints?: [number, number];
+    maxConstraints?: [number, number];
+    resizeHandles?: ResizeHandleAxis[];
+    transformScale?: number;
+    style?: CSSProperties;
+    width: number;
+    height: number;
+};
+export type ResizeHandleType = ReactElement<any> | ((resizeHandleAxis: ResizeHandleAxis, ref: Ref<HTMLElement>) => ReactElement<any>);

package/dist/lib/Resizable/types.js

@@ -0,0 +1 @@
+export {};

package/dist/lib/Resizable/utils/cloneElement.d.ts

@@ -0,0 +1,2 @@
+import { PropsWithChildren, ReactElement } from "react";
+export declare function cloneElement(element: ReactElement<any>, props: PropsWithChildren<any>): ReactElement<any>;

package/dist/lib/Resizable/utils/cloneElement.js

@@ -0,0 +1,21 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import React from "react";
+export function cloneElement(element, props) {
+    if (props.style && element.props.style) {
+        props.style = __assign(__assign({}, element.props.style), props.style);
+    }
+    if (props.className && element.props.className) {
+        props.className = "".concat(element.props.className, " ").concat(props.className);
+    }
+    return React.cloneElement(element, props);
+}

package/dist/lib/components/WidthProvider.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+type ComposedProps<Config> = {
+    measureBeforeMount?: boolean;
+    className?: string;
+    style?: Object;
+    width?: number;
+} & Config;
+declare const WidthProvider: <Config>(ComposedComponent: React.ComponentType<Config>) => (props: ComposedProps<Config>) => import("react/jsx-runtime").JSX.Element;
+export default WidthProvider;

package/dist/lib/components/WidthProvider.js

@@ -0,0 +1,55 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+/* eslint-disable react-hooks/rules-of-hooks */
+import classNames from "classnames";
+import { useRef, useState, useEffect } from "react";
+var layoutClassName = "react-grid-layout";
+/*
+ * A simple HOC that provides facility for listening to container resizes.
+ */
+var WidthProvider = function (ComposedComponent) {
+    return function (props) {
+        var _a;
+        var elementRef = useRef(null);
+        var mounted = useRef(false);
+        var _b = useState({
+            width: (_a = props.width) !== null && _a !== void 0 ? _a : 1280,
+        }), state = _b[0], setState = _b[1];
+        var _c = props.measureBeforeMount, measureBeforeMount = _c === void 0 ? false : _c;
+        useEffect(function () {
+            if (mounted.current) {
+                return;
+            }
+            mounted.current = true;
+            window.addEventListener("resize", onWindowResize);
+            onWindowResize();
+            return function () {
+                mounted.current = false;
+                window.removeEventListener("resize", onWindowResize);
+            };
+        }, []);
+        var onWindowResize = function () {
+            if (!mounted.current)
+                return;
+            var node = elementRef.current;
+            if (node instanceof HTMLElement && node.offsetWidth) {
+                setState({ width: node.offsetWidth });
+            }
+        };
+        if (measureBeforeMount && !mounted.current) {
+            return (_jsx("div", { className: classNames(props.className, layoutClassName), style: props.style, ref: elementRef }));
+        }
+        return _jsx(ComposedComponent, __assign({}, props, { innerRef: elementRef }, state));
+    };
+};
+export default WidthProvider;

package/dist/lib/components/index.js

@@ -0,0 +1 @@
+export { default as WidthProvider } from "./WidthProvider";

package/dist/lib/components/types.d.ts

@@ -0,0 +1,13 @@
+import { RefObject } from "react";
+export type WidthProviderProps = {
+    measureBeforeMount: boolean;
+    className?: string;
+    style?: Object;
+};
+export type WidthProviderState = {
+    width: number;
+};
+export type WidthProviderRef = {
+    innerRef?: RefObject<HTMLDivElement>;
+};
+export type ComposedProps = WidthProviderProps & WidthProviderState & WidthProviderRef;

package/dist/lib/components/types.js

@@ -0,0 +1 @@
+export {};

package/dist/lib/index.js

@@ -0,0 +1,5 @@
+export * from "./GridLayoutEditor";
+export { GridItem } from "./GridItem";
+export * from "./Resizable";
+export * from "./Draggable";
+export { WidthProvider } from "./components";

package/dist/reportWebVitals.d.ts

@@ -0,0 +1,3 @@
+import { ReportHandler } from 'web-vitals';
+declare const reportWebVitals: (onPerfEntry?: ReportHandler) => void;
+export default reportWebVitals;

package/dist/reportWebVitals.js

@@ -0,0 +1,13 @@
+var reportWebVitals = function (onPerfEntry) {
+    if (onPerfEntry && onPerfEntry instanceof Function) {
+        import('web-vitals').then(function (_a) {
+            var getCLS = _a.getCLS, getFID = _a.getFID, getFCP = _a.getFCP, getLCP = _a.getLCP, getTTFB = _a.getTTFB;
+            getCLS(onPerfEntry);
+            getFID(onPerfEntry);
+            getFCP(onPerfEntry);
+            getLCP(onPerfEntry);
+            getTTFB(onPerfEntry);
+        });
+    }
+};
+export default reportWebVitals;

package/dist/setupTests.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/utils/types.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+export type PropsWithChildren<P> = P & {
+    children: React.ReactElement | React.ReactElement[];
+};

package/dist/utils/types.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "publ-echo",
-  "version": "0.0.4",
+  "version": "0.0.6",
   "private": false,
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
-  "scripts": {
-    "build": "tsc"
-  },
+  "files": [
+    "/dist"
+  ],
   "dependencies": {
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^13.4.0",
@@ -24,7 +24,7 @@
   },
   "scripts": {
     "start": "react-scripts start",
-    "build": "react-scripts build",
+    "build": "rm -rf ./dist && tsc -noEmit false",
     "test": "react-scripts test",
     "eject": "react-scripts eject"
   },

package/bin/cli.js

@@ -1,8 +0,0 @@
-#!/usr/bin/env node
-
-const { program } = require("commander");
-
-// action
-program.action((cmd) => console.log("✓ Running!!"));
-
-program.parse(process.argv);