"use strict";
var __webpack_require__ = {};
(()=>{
    __webpack_require__.n = (module)=>{
        var getter = module && module.__esModule ? ()=>module['default'] : ()=>module;
        __webpack_require__.d(getter, {
            a: getter
        });
        return getter;
    };
})();
(()=>{
    __webpack_require__.d = (exports1, definition)=>{
        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
            enumerable: true,
            get: definition[key]
        });
    };
})();
(()=>{
    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
})();
(()=>{
    __webpack_require__.r = (exports1)=>{
        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
            value: 'Module'
        });
        Object.defineProperty(exports1, '__esModule', {
            value: true
        });
    };
})();
var __webpack_exports__ = {};
__webpack_require__.r(__webpack_exports__);
__webpack_require__.d(__webpack_exports__, {
    StickyNoteNode: ()=>StickyNoteNode
});
const jsx_runtime_namespaceObject = require("react/jsx-runtime");
const react_namespaceObject = require("@emotion/react");
const external_index_cjs_namespaceObject = require("../../index.cjs");
const react_cjs_namespaceObject = require("../../xyflow/react.cjs");
const external_motion_react_namespaceObject = require("motion/react");
const external_react_namespaceObject = require("react");
const index_cjs_namespaceObject = require("../../../i18n/index.cjs");
const external_react_markdown_namespaceObject = require("react-markdown");
var external_react_markdown_default = /*#__PURE__*/ __webpack_require__.n(external_react_markdown_namespaceObject);
const external_remark_breaks_namespaceObject = require("remark-breaks");
var external_remark_breaks_default = /*#__PURE__*/ __webpack_require__.n(external_remark_breaks_namespaceObject);
const external_remark_gfm_namespaceObject = require("remark-gfm");
var external_remark_gfm_default = /*#__PURE__*/ __webpack_require__.n(external_remark_gfm_namespaceObject);
const external_constants_cjs_namespaceObject = require("../../constants.cjs");
const external_Toolbar_index_cjs_namespaceObject = require("../Toolbar/index.cjs");
const external_FormattingToolbar_cjs_namespaceObject = require("./FormattingToolbar.cjs");
const external_markdown_formatting_index_cjs_namespaceObject = require("./markdown-formatting/index.cjs");
const external_StickyNoteNode_styles_cjs_namespaceObject = require("./StickyNoteNode.styles.cjs");
const external_StickyNoteNode_types_cjs_namespaceObject = require("./StickyNoteNode.types.cjs");
const external_StickyNoteNode_utils_cjs_namespaceObject = require("./StickyNoteNode.utils.cjs");
const external_useMarkdownShortcuts_cjs_namespaceObject = require("./useMarkdownShortcuts.cjs");
const external_useScrollCapture_cjs_namespaceObject = require("./useScrollCapture.cjs");
const minWidth = 8 * external_constants_cjs_namespaceObject.GRID_SPACING;
const minHeight = 8 * external_constants_cjs_namespaceObject.GRID_SPACING;
const StickyNoteNodeComponent = ({ id, data, selected, dragging, placeholder = 'Add text', renderPlaceholderOnSelect = false, readOnly = false, onContentChange, onColorChange, onResize })=>{
    const { updateNodeData, deleteElements } = (0, react_cjs_namespaceObject.useReactFlow)();
    const [isEditing, setIsEditing] = (0, external_react_namespaceObject.useState)(!readOnly && (data.autoFocus ?? false));
    const [isResizing, setIsResizing] = (0, external_react_namespaceObject.useState)(false);
    const [isColorPickerOpen, setIsColorPickerOpen] = (0, external_react_namespaceObject.useState)(false);
    const [localContent, setLocalContent] = (0, external_react_namespaceObject.useState)(data.content || '');
    const textAreaRef = (0, external_react_namespaceObject.useRef)(null);
    const { ref: markdownRef, scrollCaptureProps } = (0, external_useScrollCapture_cjs_namespaceObject.useScrollCapture)();
    const colorButtonRef = (0, external_react_namespaceObject.useRef)(null);
    const [activeFormats, setActiveFormats] = (0, external_react_namespaceObject.useState)({
        bold: false,
        italic: false,
        strikethrough: false,
        bulletList: false,
        numberedList: false
    });
    const colorKey = data.color || 'yellow';
    const color = external_StickyNoteNode_types_cjs_namespaceObject.STICKY_NOTE_COLORS[colorKey] ?? external_StickyNoteNode_types_cjs_namespaceObject.STICKY_NOTE_COLORS.yellow;
    const colorWithAlpha = (0, external_StickyNoteNode_types_cjs_namespaceObject.withAlpha)(color);
    (0, external_react_namespaceObject.useEffect)(()=>{
        setLocalContent(data.content || '');
    }, [
        data.content
    ]);
    (0, external_react_namespaceObject.useEffect)(()=>{
        if (isEditing && textAreaRef.current) {
            textAreaRef.current.focus();
            textAreaRef.current.select();
        }
        if (!readOnly && data.autoFocus) updateNodeData(id, {
            autoFocus: false
        });
    }, [
        isEditing,
        data.autoFocus,
        id,
        updateNodeData,
        readOnly
    ]);
    (0, external_react_namespaceObject.useEffect)(()=>{
        if (!selected || isResizing) setIsColorPickerOpen(false);
    }, [
        selected,
        isResizing
    ]);
    (0, external_react_namespaceObject.useEffect)(()=>{
        if (readOnly) {
            setIsEditing(false);
            setLocalContent(data.content || '');
        }
    }, [
        readOnly,
        data.content
    ]);
    const handleDoubleClick = (0, external_react_namespaceObject.useCallback)(()=>{
        if (readOnly || isEditing) return;
        setIsEditing(true);
        setTimeout(()=>{
            if (textAreaRef.current) {
                textAreaRef.current.focus();
                textAreaRef.current.select();
            }
        }, 0);
    }, [
        isEditing,
        readOnly
    ]);
    const handleBlur = (0, external_react_namespaceObject.useCallback)(()=>{
        setIsEditing(false);
        if (readOnly) return;
        if (localContent !== data.content) {
            onContentChange?.(localContent);
            updateNodeData(id, {
                content: localContent
            });
        }
    }, [
        id,
        localContent,
        data.content,
        updateNodeData,
        onContentChange,
        readOnly
    ]);
    const handleChange = (0, external_react_namespaceObject.useCallback)((e)=>{
        setLocalContent(e.target.value);
    }, []);
    const handleFormat = (0, external_react_namespaceObject.useCallback)((result)=>{
        setLocalContent(result.value);
        setActiveFormats((0, external_markdown_formatting_index_cjs_namespaceObject.detectActiveFormats)(result));
        requestAnimationFrame(()=>{
            if (textAreaRef.current) {
                textAreaRef.current.selectionStart = result.selectionStart;
                textAreaRef.current.selectionEnd = result.selectionEnd;
            }
        });
    }, []);
    const updateActiveFormats = (0, external_react_namespaceObject.useCallback)(()=>{
        if (!textAreaRef.current) return;
        const next = (0, external_markdown_formatting_index_cjs_namespaceObject.detectActiveFormats)({
            value: textAreaRef.current.value,
            selectionStart: textAreaRef.current.selectionStart,
            selectionEnd: textAreaRef.current.selectionEnd
        });
        setActiveFormats((prev)=>(0, external_markdown_formatting_index_cjs_namespaceObject.activeFormatsEqual)(prev, next) ? prev : next);
    }, []);
    const shortcutKeyDown = (0, external_useMarkdownShortcuts_cjs_namespaceObject.useMarkdownShortcuts)(textAreaRef, handleFormat);
    const handleKeyDown = (0, external_react_namespaceObject.useCallback)((e)=>{
        if ('Escape' === e.key) {
            setIsEditing(false);
            setLocalContent(data.content || '');
            textAreaRef.current?.blur();
            return;
        }
        if ('Enter' === e.key && !e.shiftKey && !e.metaKey && !e.ctrlKey) {
            const textarea = textAreaRef.current;
            if (textarea) {
                const result = (0, external_markdown_formatting_index_cjs_namespaceObject.continueListOnEnter)({
                    value: textarea.value,
                    selectionStart: textarea.selectionStart,
                    selectionEnd: textarea.selectionEnd
                });
                if (result) {
                    e.preventDefault();
                    handleFormat(result);
                }
            }
            return;
        }
        shortcutKeyDown(e);
    }, [
        data.content,
        shortcutKeyDown,
        handleFormat
    ]);
    const handleResizeStart = (0, external_react_namespaceObject.useCallback)(()=>{
        setIsResizing(true);
    }, []);
    const handleResizeEnd = (0, external_react_namespaceObject.useCallback)((_event, params)=>{
        setIsResizing(false);
        onResize?.(params.width, params.height);
    }, [
        onResize
    ]);
    const handleColorChange = (0, external_react_namespaceObject.useCallback)((newColor)=>{
        onColorChange?.(newColor);
        updateNodeData(id, {
            color: newColor
        });
        setIsColorPickerOpen(false);
    }, [
        id,
        updateNodeData,
        onColorChange
    ]);
    const handleToggleColorPicker = (0, external_react_namespaceObject.useCallback)(()=>{
        setIsColorPickerOpen((prev)=>!prev);
    }, []);
    const handleEditClick = (0, external_react_namespaceObject.useCallback)(()=>{
        if (readOnly) return;
        setIsEditing(true);
        setTimeout(()=>{
            if (textAreaRef.current) {
                textAreaRef.current.focus();
                textAreaRef.current.select();
            }
        }, 0);
    }, [
        readOnly
    ]);
    const handleDelete = (0, external_react_namespaceObject.useCallback)(()=>{
        deleteElements({
            nodes: [
                {
                    id
                }
            ]
        });
    }, [
        id,
        deleteElements
    ]);
    const markdownComponents = (0, external_react_namespaceObject.useMemo)(()=>({
            a: ({ href, children, ...props })=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("a", {
                    ...props,
                    href: href,
                    target: "_blank",
                    rel: "noopener noreferrer",
                    onClick: (e)=>{
                        e.stopPropagation();
                    },
                    onDoubleClick: (e)=>{
                        e.stopPropagation();
                    },
                    children: children
                })
        }), []);
    const toolbarConfig = (0, external_react_namespaceObject.useMemo)(()=>{
        const actions = [
            {
                id: 'delete',
                icon: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_index_cjs_namespaceObject.CanvasIcon, {
                    icon: "trash",
                    size: 14
                }),
                label: 'Delete',
                onAction: handleDelete
            },
            {
                id: 'edit',
                icon: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_index_cjs_namespaceObject.CanvasIcon, {
                    icon: "pencil",
                    size: 14
                }),
                label: 'Edit',
                onAction: handleEditClick
            },
            {
                id: 'separator'
            },
            {
                id: 'color',
                icon: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
                    ref: colorButtonRef,
                    style: {
                        width: '16px',
                        height: '16px',
                        borderRadius: '50%',
                        backgroundColor: color,
                        border: '1px solid transparent'
                    }
                }),
                label: 'Color',
                onAction: handleToggleColorPicker
            }
        ];
        return {
            actions,
            overflowActions: [],
            overflowLabel: '',
            position: 'top',
            align: 'center'
        };
    }, [
        handleEditClick,
        handleToggleColorPicker,
        color,
        handleDelete
    ]);
    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
        children: [
            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_namespaceObject.Global, {
                styles: external_StickyNoteNode_styles_cjs_namespaceObject.stickyNoteGlobalStyles
            }),
            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_StickyNoteNode_styles_cjs_namespaceObject.StickyNoteWrapper, {
                children: [
                    !readOnly && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
                        children: [
                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.NodeResizeControl, {
                                style: {
                                    background: 'transparent',
                                    border: 'none',
                                    zIndex: external_StickyNoteNode_styles_cjs_namespaceObject.RESIZE_CONTROL_Z_INDEX
                                },
                                position: "top-left",
                                minWidth: minWidth,
                                minHeight: minHeight,
                                onResizeStart: handleResizeStart,
                                onResizeEnd: handleResizeEnd,
                                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StickyNoteNode_styles_cjs_namespaceObject.ResizeHandle, {
                                    selected: selected,
                                    cursor: "nwse-resize"
                                })
                            }),
                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.NodeResizeControl, {
                                style: {
                                    background: 'transparent',
                                    border: 'none',
                                    zIndex: external_StickyNoteNode_styles_cjs_namespaceObject.RESIZE_CONTROL_Z_INDEX
                                },
                                position: "top-right",
                                minWidth: minWidth,
                                minHeight: minHeight,
                                onResizeStart: handleResizeStart,
                                onResizeEnd: handleResizeEnd,
                                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StickyNoteNode_styles_cjs_namespaceObject.ResizeHandle, {
                                    selected: selected,
                                    cursor: "nesw-resize"
                                })
                            }),
                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.NodeResizeControl, {
                                style: {
                                    background: 'transparent',
                                    border: 'none',
                                    zIndex: external_StickyNoteNode_styles_cjs_namespaceObject.RESIZE_CONTROL_Z_INDEX
                                },
                                position: "bottom-left",
                                minWidth: minWidth,
                                minHeight: minHeight,
                                onResizeStart: handleResizeStart,
                                onResizeEnd: handleResizeEnd,
                                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StickyNoteNode_styles_cjs_namespaceObject.ResizeHandle, {
                                    selected: selected,
                                    cursor: "nesw-resize"
                                })
                            }),
                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.NodeResizeControl, {
                                style: {
                                    background: 'transparent',
                                    border: 'none',
                                    zIndex: external_StickyNoteNode_styles_cjs_namespaceObject.RESIZE_CONTROL_Z_INDEX
                                },
                                position: "bottom-right",
                                minWidth: minWidth,
                                minHeight: minHeight,
                                onResizeStart: handleResizeStart,
                                onResizeEnd: handleResizeEnd,
                                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StickyNoteNode_styles_cjs_namespaceObject.ResizeHandle, {
                                    selected: selected,
                                    cursor: "nwse-resize"
                                })
                            })
                        ]
                    }),
                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_StickyNoteNode_styles_cjs_namespaceObject.StickyNoteContainer, {
                        backgroundColor: colorWithAlpha,
                        borderColor: color,
                        isEditing: isEditing,
                        selected: selected,
                        isReadOnly: readOnly,
                        onDoubleClick: handleDoubleClick,
                        children: [
                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StickyNoteNode_styles_cjs_namespaceObject.TopCornerIndicators, {
                                visible: selected && !readOnly
                            }),
                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StickyNoteNode_styles_cjs_namespaceObject.BottomCornerIndicators, {
                                visible: selected && !readOnly
                            }),
                            isEditing ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.ApI18nProvider, {
                                component: "canvas",
                                children: [
                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_FormattingToolbar_cjs_namespaceObject.FormattingToolbar, {
                                        textAreaRef: textAreaRef,
                                        borderColor: color,
                                        activeFormats: activeFormats,
                                        onFormat: handleFormat
                                    }),
                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StickyNoteNode_styles_cjs_namespaceObject.StickyNoteTextArea, {
                                        ref: textAreaRef,
                                        value: localContent,
                                        onChange: handleChange,
                                        onBlur: handleBlur,
                                        onKeyDown: handleKeyDown,
                                        onSelect: updateActiveFormats,
                                        onKeyUp: updateActiveFormats,
                                        placeholder: placeholder,
                                        isEditing: isEditing,
                                        className: "nodrag nowheel"
                                    })
                                ]
                            }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StickyNoteNode_styles_cjs_namespaceObject.StickyNoteMarkdown, {
                                ref: markdownRef,
                                ...scrollCaptureProps,
                                children: localContent ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_react_markdown_default(), {
                                    remarkPlugins: [
                                        external_remark_gfm_default(),
                                        external_remark_breaks_default()
                                    ],
                                    components: markdownComponents,
                                    children: (0, external_StickyNoteNode_utils_cjs_namespaceObject.preserveNewlines)(localContent)
                                }) : renderPlaceholderOnSelect && selected && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_react_markdown_default(), {
                                    remarkPlugins: [
                                        external_remark_gfm_default(),
                                        external_remark_breaks_default()
                                    ],
                                    components: markdownComponents,
                                    children: placeholder
                                })
                            })
                        ]
                    }),
                    !readOnly && selected && !dragging && !isResizing && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_Toolbar_index_cjs_namespaceObject.NodeToolbar, {
                        nodeId: id,
                        config: toolbarConfig,
                        expanded: true
                    }),
                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_motion_react_namespaceObject.AnimatePresence, {
                        children: !readOnly && selected && !dragging && !isResizing && isColorPickerOpen && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
                            style: {
                                position: 'absolute',
                                top: -40,
                                left: '50%',
                                transform: 'translateX(40px)',
                                zIndex: 1000
                            },
                            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StickyNoteNode_styles_cjs_namespaceObject.ColorPickerPanel, {
                                initial: {
                                    opacity: 0,
                                    y: 10
                                },
                                animate: {
                                    opacity: 1,
                                    y: 0
                                },
                                exit: {
                                    opacity: 0,
                                    y: 10
                                },
                                transition: {
                                    duration: 0.15,
                                    ease: 'easeOut'
                                },
                                children: Object.keys(external_StickyNoteNode_types_cjs_namespaceObject.STICKY_NOTE_COLORS).map((stickyColorKey)=>{
                                    const colorName = stickyColorKey;
                                    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StickyNoteNode_styles_cjs_namespaceObject.ColorOption, {
                                        color: external_StickyNoteNode_types_cjs_namespaceObject.STICKY_NOTE_COLORS[colorName],
                                        isSelected: colorKey === colorName,
                                        onClick: ()=>handleColorChange(colorName),
                                        title: colorName.charAt(0).toUpperCase() + colorName.slice(1)
                                    }, stickyColorKey);
                                })
                            })
                        })
                    })
                ]
            })
        ]
    });
};
const StickyNoteNode = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(StickyNoteNodeComponent);
exports.StickyNoteNode = __webpack_exports__.StickyNoteNode;
for(var __rspack_i in __webpack_exports__)if (-1 === [
    "StickyNoteNode"
].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
Object.defineProperty(exports, '__esModule', {
    value: true
});
