publ-echo-test 0.0.332 → 0.0.334

package/dist/lib/GridLayoutEditor/ResponsiveGridLayout.d.ts

@@ -0,0 +1,4 @@
+import { ResponsiveGridLayoutProps } from './types';
+import { PropsWithChildren } from '../types';
+export declare const ResponsiveGridLayout: ({ children, ...props }: PropsWithChildren<ResponsiveGridLayoutProps>) => React.ReactElement;
+export default ResponsiveGridLayout;

package/dist/lib/GridLayoutEditor/ResponsiveGridLayout.js

@@ -0,0 +1,117 @@
+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 } from "react/jsx-runtime";
+import { useLayoutEffect, useRef, useState } from 'react';
+import { cloneLayout, noop, synchronizeLayoutWithChildren, } from './utils/renderHelpers';
+import { findOrGenerateResponsiveLayout, getBreakpointFromWidth, getColsFromBreakpoint, } from './utils/responsiveUtils';
+import isEqual from '../../external-lib/lodash.isEqual';
+import ReactGridLayout from './ReactGridLayout';
+/**
+ * Get a value of margin or containerPadding.
+ *
+ * @param  {Array | Object} param Margin | containerPadding, e.g. [10, 10] | {lg: [10, 10], ...}.
+ * @param  {String} breakpoint   Breakpoint: lg, md, sm, xs and etc.
+ * @return {Array}
+ */
+function getIndentationValue(param, breakpoint) {
+    return Array.isArray(param) ? param : param[breakpoint];
+}
+export var ResponsiveGridLayout = function (_a) {
+    var children = _a.children, props = __rest(_a, ["children"]);
+    var breakpoint = props.breakpoint, compactType = props.compactType, _b = props.breakpoints, breakpoints = _b === void 0 ? { lg: 1200, md: 996, sm: 768, xs: 480, xxs: 0 } : _b, _c = props.cols, cols = _c === void 0 ? { lg: 12, md: 10, sm: 6, xs: 4, xxs: 2 } : _c, _d = props.containerPadding, containerPadding = _d === void 0 ? {} : _d, _e = props.layouts, layouts = _e === void 0 ? {} : _e, _f = props.width, width = _f === void 0 ? 0 : _f, _g = props.margin, margin = _g === void 0 ? [10, 10] : _g, _h = props.onBreakpointChange, onBreakpointChange = _h === void 0 ? noop : _h, _j = props.onLayoutChange, onLayoutChange = _j === void 0 ? noop : _j, _k = props.onWidthChange, onWidthChange = _k === void 0 ? noop : _k, zoom = props.zoom, restProps = __rest(props, ["breakpoint", "compactType", "breakpoints", "cols", "containerPadding", "layouts", "width", "margin", "onBreakpointChange", "onLayoutChange", "onWidthChange", "zoom"]);
+    var _l = useState({ width: width, breakpoints: breakpoints, cols: cols }), prevProps = _l[0], setPrevProps = _l[1];
+    var generateInitialState = function () {
+        var breakpoint = getBreakpointFromWidth(breakpoints, width);
+        var colNo = getColsFromBreakpoint(breakpoint, cols);
+        var compactType = props.compactType;
+        var initialLayout = findOrGenerateResponsiveLayout(layouts, breakpoints, breakpoint, breakpoint, colNo, compactType || 'vertical', false);
+        return {
+            layout: initialLayout,
+            layouts: layouts,
+            breakpoint: breakpoint,
+            cols: colNo,
+        };
+    };
+    var _m = useState(function () {
+        return generateInitialState();
+    }), state = _m[0], setState = _m[1];
+    var emittedBreakpointChangeOnce = useRef(breakpoint != null);
+    useLayoutEffect(function () {
+        if (!state || !isEqual(state.layouts, layouts)) {
+            setState(generateInitialState());
+        }
+    }, [layouts]);
+    useLayoutEffect(function () {
+        onWidthChangeHandler();
+    }, [width, breakpoint, JSON.stringify(breakpoints), cols]);
+    var onLayoutChangeHandler = function (layout) {
+        var _a;
+        var newLayouts = __assign(__assign({}, layouts), (_a = {}, _a[state.breakpoint] = layout, _a));
+        setState({
+            breakpoint: state.breakpoint,
+            cols: state.cols,
+            layout: layout,
+            layouts: newLayouts,
+        });
+        onLayoutChange({
+            layout: layout,
+            layouts: newLayouts,
+        });
+    };
+    var onWidthChangeHandler = function () {
+        var newBreakpoint = breakpoint || getBreakpointFromWidth(breakpoints, width);
+        var lastBreakpoint = state.breakpoint;
+        var newCols = getColsFromBreakpoint(newBreakpoint, cols);
+        var newLayouts = __assign({}, layouts);
+        if (!emittedBreakpointChangeOnce.current ||
+            lastBreakpoint !== newBreakpoint ||
+            !isEqual(prevProps.breakpoints, breakpoints) ||
+            !isEqual(prevProps.cols, cols)) {
+            emittedBreakpointChangeOnce.current = true;
+            if (!(lastBreakpoint in newLayouts)) {
+                newLayouts[lastBreakpoint] = cloneLayout(state.layout);
+            }
+            var newBreakpointIsBiggerOrEqual = lastBreakpoint === newBreakpoint ||
+                breakpoints[newBreakpoint] > breakpoints[lastBreakpoint];
+            var isNewLayout = layouts[newBreakpoint] == null;
+            var overlap = !!props.allowOverlap && (!isNewLayout || newBreakpointIsBiggerOrEqual); //  allow resize overlap only if we are going into a larger screen
+            var layout = findOrGenerateResponsiveLayout(newLayouts, breakpoints, newBreakpoint, lastBreakpoint, newCols, compactType || 'vertical', overlap);
+            layout = synchronizeLayoutWithChildren(layout, children, newCols, compactType || 'vertical', overlap);
+            newLayouts[newBreakpoint] = layout;
+            setState({
+                breakpoint: newBreakpoint,
+                layout: layout,
+                layouts: newLayouts,
+                cols: newCols,
+            });
+            onLayoutChange({ layout: layout, layouts: newLayouts });
+            onBreakpointChange(newBreakpoint, newCols);
+        }
+        setPrevProps({ breakpoints: breakpoints, cols: cols, width: width });
+        var modifiedMargin = getIndentationValue(margin, newBreakpoint);
+        var containerPaddingModified = getIndentationValue(containerPadding, newBreakpoint);
+        onWidthChange(width, modifiedMargin, newCols, containerPaddingModified);
+    };
+    return (_jsx(ReactGridLayout, __assign({}, restProps, { children: children, width: width, margin: getIndentationValue(margin, state.breakpoint), containerPadding: getIndentationValue(containerPadding, state.breakpoint), onLayoutChange: onLayoutChangeHandler, layout: state.layout, cols: state.cols, transformScale: zoom !== null && zoom !== void 0 ? zoom : 1 })));
+};
+export default ResponsiveGridLayout;

package/dist/lib/GridLayoutEditor/group.d.ts

@@ -0,0 +1,58 @@
+export declare const zIndexMap: {
+    ISDRAGGING: number;
+    BULK: number;
+    EDITABLE_GROUP: number;
+    CB_IN_EDITING_GROUP: number;
+    EDITING_GROUP: number;
+    GROUP: number;
+    CB: number;
+    ROOT: number;
+};
+export declare function getBlockSpecificType(block: Block): "ROOT" | "BULK" | "COMPONENT_BLOCK" | "GROUP_BLOCK";
+export type SectionPedigree = RootBlock;
+export type Block = ComponentBlock | GroupBlock | RootBlock;
+export type ZOrder = {
+    [platform in "mobile" | "desktop"]: {
+        [componentBlockId: string]: number;
+    };
+};
+export type ComponentBlock = {
+    blockId: string;
+    type: "COMPONENT_BLOCK";
+    zOrderDesktopInternal: number | null;
+    zOrderMobileInternal: number | null;
+    componentBlockId: number;
+};
+export type GroupBlock = {
+    blockId: string;
+    type: "GROUP_BLOCK";
+    zOrderDesktopInternal: number | null;
+    zOrderMobileInternal: number | null;
+    children: (ComponentBlock | GroupBlock)[];
+};
+export type RootBlock = {
+    blockId: "ROOT";
+    type: "GROUP_BLOCK";
+    zOrderDesktopInternal: number | null;
+    zOrderMobileInternal: number | null;
+    children: (ComponentBlock | GroupBlock)[];
+};
+export type BulkBlockInternal = {
+    blockId: "BULK";
+    type: "GROUP_BLOCK";
+    zOrderDesktopInternal: number;
+    zOrderMobileInternal: number;
+    children: (ComponentBlock | GroupBlock)[];
+};
+export declare const findBlockByBlockId: (block: Block, blockId: string) => Block | null;
+export declare const findDirectChildrenCbIds: (block: Block, targetId: string) => number[];
+export declare const findAllChildrenCbIds: (block: Block, targetId: string) => number[];
+export declare const findAllChildrenBlockIds: (block: Block, targetId: string) => string[];
+export declare const findDirectChildrenBlockIds: (block: Block, targetId: string) => string[];
+export declare const findGroupBlocks: (block: Block, targetId: string) => GroupBlock[];
+export declare const addBulkToTarget: (block: Block, targetId: string, bulkBlockIds: string[]) => Block;
+export declare function getBlockWorkDirPath(blockStructure: Block, targetBlockId: string): string;
+export declare function formatBlockIdToCbId(blockId: string): number | null;
+export declare function formatCbIdToBlockId(cbId: number): string;
+export declare function findParentGroupBlock(current: Block, targetBlockId: string): GroupBlock | null;
+export declare function findOneComponentBlock(current: Block, targetBlockId: string): number | null;

package/dist/lib/GridLayoutEditor/group.js

@@ -0,0 +1,341 @@
+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));
+};
+export var zIndexMap = {
+    ISDRAGGING: 999999,
+    BULK: 30000,
+    EDITABLE_GROUP: 20000,
+    CB_IN_EDITING_GROUP: 10000,
+    EDITING_GROUP: 9000,
+    GROUP: 5000,
+    CB: 0,
+    ROOT: 20000, //?
+};
+export function getBlockSpecificType(block) {
+    if (block.blockId === "ROOT") {
+        return "ROOT";
+    }
+    if (block.blockId === "BULK") {
+        return "BULK";
+    }
+    return block.type;
+}
+var deepClone = function (blocks) { return JSON.parse(JSON.stringify(blocks)); };
+var collectChildrenCbIds = function (block, depth) {
+    var ids = [];
+    if ("children" in block && block.children) {
+        for (var _i = 0, _a = block.children; _i < _a.length; _i++) {
+            var child = _a[_i];
+            if (child.type === "COMPONENT_BLOCK") {
+                ids.push(child.componentBlockId);
+            }
+            if (depth === "deep" && child.type === "GROUP_BLOCK") {
+                ids = ids.concat(collectChildrenCbIds(child, depth));
+            }
+        }
+    }
+    return ids;
+};
+var collectChildrenBlockIds = function (block, depth) {
+    var ids = [];
+    if ("children" in block && block.children) {
+        for (var _i = 0, _a = block.children; _i < _a.length; _i++) {
+            var child = _a[_i];
+            ids.push(child.blockId);
+            if (depth === "deep") {
+                ids = ids.concat(collectChildrenBlockIds(child, depth));
+            }
+        }
+    }
+    return ids;
+};
+export var findBlockByBlockId = function (block, blockId) {
+    if (block.type !== "GROUP_BLOCK" || block.children.length === 0) {
+        return null;
+    }
+    if (block.blockId === "ROOT" && blockId === "ROOT") {
+        return block;
+    }
+    for (var _i = 0, _a = block.children; _i < _a.length; _i++) {
+        var child = _a[_i];
+        if (child.blockId === blockId) {
+            return child;
+        }
+        if (child.type === "GROUP_BLOCK" && child.children) {
+            var found = findBlockByBlockId(child, blockId);
+            if (found) {
+                return found;
+            }
+        }
+    }
+    return null;
+};
+export var findDirectChildrenCbIds = function (block, targetId) {
+    var targetBlock = findBlockByBlockId(block, targetId);
+    if (!targetBlock || targetBlock.type !== "GROUP_BLOCK") {
+        return [];
+    }
+    return collectChildrenCbIds(targetBlock, "current");
+};
+export var findAllChildrenCbIds = function (block, targetId) {
+    var targetBlock = findBlockByBlockId(block, targetId);
+    if (!targetBlock || targetBlock.type !== "GROUP_BLOCK") {
+        return [];
+    }
+    return collectChildrenCbIds(targetBlock, "deep");
+};
+export var findAllChildrenBlockIds = function (block, targetId) {
+    var targetBlock = findBlockByBlockId(block, targetId);
+    if (!targetBlock || targetBlock.type !== "GROUP_BLOCK") {
+        return [];
+    }
+    return collectChildrenBlockIds(targetBlock, "deep");
+};
+export var findDirectChildrenBlockIds = function (block, targetId) {
+    var targetBlock = findBlockByBlockId(block, targetId);
+    if (!targetBlock || targetBlock.type !== "GROUP_BLOCK") {
+        return [];
+    }
+    return collectChildrenBlockIds(targetBlock, "current");
+};
+// NOTE: 타겟과 하위 모두.
+export var findGroupBlocks = function (block, targetId) {
+    var targetBlock = findBlockByBlockId(block, targetId);
+    if (!targetBlock) {
+        return [];
+    }
+    if (targetBlock.type !== "GROUP_BLOCK") {
+        return [];
+    }
+    var groupBlocks = targetBlock.children.filter(function (child) { return child.type === "GROUP_BLOCK"; });
+    var bulkInTarget = targetBlock.children.find(function (block) { return block.blockId === "BULK"; });
+    if (bulkInTarget && bulkInTarget.type === "GROUP_BLOCK") {
+        var groupInBulk = bulkInTarget.children.filter(function (child) { return child.type === "GROUP_BLOCK"; });
+        if (targetBlock.blockId === "ROOT") {
+            return groupBlocks.concat(groupInBulk);
+        }
+        if (groupInBulk && groupInBulk.length > 0) {
+            return [targetBlock].concat(groupBlocks).concat(groupInBulk);
+        }
+    }
+    if (targetBlock.blockId === "ROOT") {
+        return groupBlocks;
+    }
+    return [targetBlock].concat(groupBlocks);
+};
+// export const findAllComponentBlockIds = (blockStructure: Block[]): number[] => {
+//   const collectComponentBlockIds = (blocks: Block[]): number[] => {
+//     let ids: number[] = [];
+//     for (const block of blocks) {
+//       if (block.type === 'COMPONENT_BLOCK') {
+//         ids.push(block.componentBlockId);
+//       }
+//       if ('children' in block && block.children) {
+//         ids = ids.concat(collectComponentBlockIds(block.children));
+//       }
+//     }
+//     return ids;
+//   };
+//   return collectComponentBlockIds(blockStructure);
+// };
+// export const findParentGroupByGroupId = (blockStructure: Block[], targetId: string): string | null => {
+//   const findParentGroup = (
+//     blocks: Block[],
+//     id: string,
+//     parent: GroupBlock | null = null
+//   ): string | null => {
+//     for (const block of blocks) {
+//       if (block.blockId === id && block.type === 'GROUP_BLOCK') {
+//         return parent ? parent.blockId : null;
+//       }
+//       if ('children' in block && block.children) {
+//         const result = findParentGroup(block.children, id, block.type === 'GROUP_BLOCK' ? block : parent);
+//         if (result) {
+//           return result;
+//         }
+//       }
+//     }
+//     return null;
+//   };
+//   return findParentGroup(blockStructure, targetId);
+// };
+// export const addBlockToRoot = (block: RootBlock, newBlock: Block): Block[] => {
+//   return block.map(block => {
+//     if (block.blockId === 'ROOT' && block.type === 'GROUP_BLOCK') {
+//       return {
+//         ...block,
+//         children: block.children ? [...block.children, newBlock] : [newBlock]
+//       };
+//     }
+//     return block;
+//   });
+// };
+export var addBulkToTarget = function (block, targetId, bulkBlockIds) {
+    var blockCopy = deepClone(block);
+    var targetBlock = findBlockByBlockId(blockCopy, targetId);
+    if (!targetBlock ||
+        targetBlock.type !== "GROUP_BLOCK" ||
+        !targetBlock.children) {
+        return block;
+    }
+    var bulkBlocks = targetBlock.children.filter(function (child) {
+        if (child.type === "COMPONENT_BLOCK" &&
+            bulkBlockIds.includes(child.blockId.toString())) {
+            return true;
+        }
+        if (child.type === "GROUP_BLOCK" && bulkBlockIds.includes(child.blockId)) {
+            return true;
+        }
+        return false;
+    });
+    if (bulkBlocks.length !== bulkBlockIds.length) {
+        return block;
+    }
+    if (bulkBlocks.length === 0) {
+        return block;
+    }
+    // Remove bulk blocks from target's children
+    targetBlock.children = targetBlock.children.filter(function (child) { return !bulkBlockIds.includes(child.blockId); });
+    var zOrdersDesktop = bulkBlocks
+        .map(function (block) { return block.zOrderDesktopInternal; })
+        .filter(function (each) { return each !== null; });
+    var zOrdersMobile = bulkBlocks
+        .map(function (block) { return block.zOrderMobileInternal; })
+        .filter(function (each) { return each !== null; });
+    var zOrderDesktopInternal = Math.max.apply(Math, zOrdersDesktop);
+    var zOrderMobileInternal = Math.max.apply(Math, zOrdersMobile);
+    // Create the new bulkBlock
+    var bulkBlock = {
+        blockId: "BULK",
+        type: "GROUP_BLOCK",
+        zOrderDesktopInternal: zOrderDesktopInternal,
+        zOrderMobileInternal: zOrderMobileInternal,
+        children: bulkBlocks,
+    };
+    // Add the bulkBlock to the target's children
+    targetBlock.children.push(bulkBlock);
+    return blockCopy;
+};
+function findPathHelper(current, targetBlockId) {
+    if (current.blockId === targetBlockId) {
+        return [current.blockId];
+    }
+    if ("children" in current && Array.isArray(current.children)) {
+        for (var _i = 0, _a = current.children; _i < _a.length; _i++) {
+            var child = _a[_i];
+            var result = findPathHelper(child, targetBlockId);
+            if (result !== null) {
+                return __spreadArray([current.blockId], result, true);
+            }
+        }
+    }
+    return null;
+}
+export function getBlockWorkDirPath(blockStructure, targetBlockId) {
+    var path = findPathHelper(blockStructure, targetBlockId);
+    return path ? "/" + path.join("/") : "";
+}
+export function formatBlockIdToCbId(blockId) {
+    var match = blockId.match(/^CB_(\d+)$/);
+    return match ? parseInt(match[1], 10) : null;
+}
+export function formatCbIdToBlockId(cbId) {
+    return "CB_".concat(cbId);
+}
+// export const findAccessibleChildrenBlocks = (
+//   block: Block,
+//   targetGroupId: string,
+//   blockIds: string[]
+// ): string[] => {
+//   const targetBlock = findBlockByBlockId(block, targetGroupId);
+//   if (!targetBlock || !('children' in targetBlock) || !targetBlock.children) {
+//     return [];
+//   }
+//   const result = new Set<string>();
+//   const traverse = (block: Block, rootId: string): boolean => {
+//     if ('children' in block && block.children) {
+//       for (const child of block.children) {
+//         if (blockIds.includes(child.blockId)) {
+//           result.add(rootId);
+//           return true; // Stop traversal for this branch
+//         }
+//         if (traverse(child, rootId)) {
+//           result.add(rootId);
+//           return true; // Stop traversal for this branch
+//         }
+//       }
+//     }
+//     return false;
+//   };
+//   for (const child of targetBlock.children) {
+//     if (blockIds.includes(child.blockId)) {
+//       result.add(child.blockId);
+//     } else {
+//       traverse(child, child.blockId);
+//     }
+//   }
+//   return Array.from(result);
+// };
+export function findParentGroupBlock(current, targetBlockId) {
+    // 현재 블록이 그룹(또는 루트) 블록이고, 자식이 있다면 탐색합니다.
+    if ("children" in current && Array.isArray(current.children)) {
+        for (var _i = 0, _a = current.children; _i < _a.length; _i++) {
+            var child = _a[_i];
+            // 자식 중에 targetBlockId를 가진 블록이 있다면,
+            if (child.blockId === targetBlockId) {
+                // 현재 블록이 ROOT라면 부모가 ROOT이므로 null 반환
+                if (current.blockId === "ROOT") {
+                    return null;
+                }
+                // 그렇지 않다면 현재 블록이 부모 그룹 블록이므로 반환
+                if (current.type === "GROUP_BLOCK") {
+                    return current;
+                }
+            }
+            // 만약 자식이 그룹 블록이라면 재귀적으로 탐색
+            if (child.type === "GROUP_BLOCK") {
+                var found = findParentGroupBlock(child, targetBlockId);
+                if (found !== null) {
+                    return found;
+                }
+            }
+        }
+    }
+    // 찾지 못하면 null 반환
+    return null;
+}
+export function findOneComponentBlock(current, targetBlockId) {
+    var targetBlock = findBlockByBlockId(current, targetBlockId);
+    if (!targetBlock) {
+        console.error("Target block not found");
+        return null;
+    }
+    if (targetBlock.type !== "GROUP_BLOCK") {
+        console.error("Target block is not a group block");
+        return null;
+    }
+    // 직속 하위에서 먼저 찾기
+    for (var _i = 0, _a = targetBlock.children; _i < _a.length; _i++) {
+        var child = _a[_i];
+        if (child.type === "COMPONENT_BLOCK") {
+            return child.componentBlockId;
+        }
+    }
+    // 직속 하위에 없다면 재귀적으로 찾기
+    for (var _b = 0, _c = targetBlock.children; _b < _c.length; _b++) {
+        var child = _c[_b];
+        if (child.type === "GROUP_BLOCK") {
+            var found = findOneComponentBlock(child, child.blockId);
+            if (found !== null) {
+                return found;
+            }
+        }
+    }
+    return null;
+}

package/dist/lib/GridLayoutEditor/index.d.ts

@@ -0,0 +1,3 @@
+export { ResponsiveGridLayout as ResponsiveGridEditor } from "./ResponsiveGridLayout";
+export { default as GridEditor } from "./ReactGridLayout";
+export type { Breakpoint, Breakpoints, DefaultBreakpoints, OnLayoutChangeCallback, ResponsiveLayout, Layout, LayoutItem, } from "./types";

package/dist/lib/GridLayoutEditor/index.js

@@ -0,0 +1,2 @@
+export { ResponsiveGridLayout as ResponsiveGridEditor } from "./ResponsiveGridLayout";
+export { default as GridEditor } from "./ReactGridLayout";