testomatio-editor-blocks 0.3.0 → 0.4.1

package/package/editor/blocks/stepHorizontalView.d.ts

@@ -0,0 +1,14 @@
+import type { ReactNode } from "react";
+type StepHorizontalViewProps = {
+    blockId: string;
+    stepNumber: number;
+    stepValue: string;
+    expectedResult: string;
+    onStepChange: (next: string) => void;
+    onExpectedChange: (next: string) => void;
+    onInsertNextStep: () => void;
+    onFieldFocus: () => void;
+    viewToggle?: ReactNode;
+};
+export declare function StepHorizontalView({ blockId, stepNumber, stepValue, expectedResult, onStepChange, onExpectedChange, onInsertNextStep, onFieldFocus, viewToggle, }: StepHorizontalViewProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/package/editor/blocks/stepHorizontalView.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { StepField } from "./stepField";
+const STEP_PLACEHOLDER = "Enter step name";
+const EXPECTED_RESULT_PLACEHOLDER = "Enter expected result";
+export function StepHorizontalView({ blockId, stepNumber, stepValue, expectedResult, onStepChange, onExpectedChange, onInsertNextStep, onFieldFocus, viewToggle, }) {
+    return (_jsxs("div", { className: "bn-teststep bn-teststep--horizontal", "data-block-id": blockId, children: [_jsxs("div", { className: "bn-teststep__timeline", children: [_jsx("span", { className: "bn-teststep__number", children: stepNumber }), _jsx("div", { className: "bn-teststep__line" })] }), _jsxs("div", { className: "bn-teststep__content", children: [_jsxs("div", { className: "bn-teststep__horizontal-fields", children: [_jsxs("div", { className: "bn-teststep__horizontal-col", children: [_jsx("div", { className: "bn-teststep__header", children: _jsx("span", { className: "bn-teststep__title", children: "Step" }) }), _jsx(StepField, { label: "Step", showLabel: false, value: stepValue, onChange: onStepChange, placeholder: STEP_PLACEHOLDER, enableAutocomplete: true, fieldName: "title", suggestionFilter: (suggestion) => suggestion.isSnippet !== true, onFieldFocus: onFieldFocus, multiline: true, enableImageUpload: true, showFormattingButtons: true, showImageButton: true })] }), _jsxs("div", { className: "bn-teststep__horizontal-col", children: [_jsxs("div", { className: "bn-teststep__header", children: [_jsx("span", { className: "bn-teststep__title", children: "Expected result" }), viewToggle] }), _jsx(StepField, { label: "Expected result", showLabel: false, value: expectedResult, onChange: onExpectedChange, placeholder: EXPECTED_RESULT_PLACEHOLDER, multiline: true, enableAutocomplete: true, enableImageUpload: true, showFormattingButtons: true, showImageButton: true, onFieldFocus: onFieldFocus })] })] }), _jsx("div", { className: "bn-step-actions", children: _jsxs("button", { type: "button", className: "bn-step-action-btn", onClick: onInsertNextStep, children: [_jsx("svg", { className: "bn-step-action-btn__icon", width: "16", height: "16", viewBox: "0 0 13.334 13.334", fill: "none", "aria-hidden": "true", children: _jsx("path", { d: "M6.667 0a6.667 6.667 0 1 1 0 13.334A6.667 6.667 0 0 1 6.667 0Zm0 1.334a5.333 5.333 0 1 0 0 10.666 5.333 5.333 0 0 0 0-10.666ZM7.334 3.334V6H10v1.334H7.334V10H6V7.334H3.334V6H6V3.334h1.334Z", fill: "currentColor" }) }), "Add new step"] }) })] })] }));
+}

package/package/editor/blocks/useAutoResize.d.ts

@@ -0,0 +1,8 @@
+type Options = {
+    textarea: HTMLTextAreaElement | null;
+    multiline?: boolean;
+    minRows?: number;
+    maxRows?: number;
+};
+export declare function useAutoResize({ textarea, multiline, minRows, maxRows }: Options): void;
+export {};

package/package/editor/blocks/useAutoResize.js

@@ -0,0 +1,31 @@
+import { useEffect, useRef } from "react";
+export function useAutoResize({ textarea, multiline = false, minRows = 2, maxRows = 12 }) {
+    const frameRef = useRef(0);
+    useEffect(() => {
+        if (!textarea || !multiline) {
+            return;
+        }
+        const resize = () => {
+            textarea.style.height = "auto";
+            const lineHeight = parseFloat(getComputedStyle(textarea).lineHeight || "16");
+            const minHeight = lineHeight * minRows;
+            const maxHeight = lineHeight * maxRows;
+            textarea.style.height = `${Math.min(Math.max(textarea.scrollHeight, minHeight), maxHeight)}px`;
+        };
+        const observer = new MutationObserver(resize);
+        observer.observe(textarea, { childList: true, characterData: true, subtree: true });
+        const handleInput = () => {
+            var _a;
+            cancelAnimationFrame((_a = frameRef.current) !== null && _a !== void 0 ? _a : 0);
+            frameRef.current = requestAnimationFrame(resize);
+        };
+        textarea.addEventListener("input", handleInput);
+        resize();
+        return () => {
+            var _a;
+            observer.disconnect();
+            textarea.removeEventListener("input", handleInput);
+            cancelAnimationFrame((_a = frameRef.current) !== null && _a !== void 0 ? _a : 0);
+        };
+    }, [textarea, multiline, minRows, maxRows]);
+}

package/package/editor/customMarkdownConverter.d.ts

@@ -4,5 +4,6 @@ type Schema = typeof customSchema;
 export type CustomEditorBlock = Block<Schema["blockSchema"], Schema["inlineContentSchema"], Schema["styleSchema"]>;
 export type CustomPartialBlock = PartialBlock<Schema["blockSchema"], Schema["inlineContentSchema"], Schema["styleSchema"]>;
 export declare function blocksToMarkdown(blocks: CustomEditorBlock[]): string;
+export declare function fixMalformedImageBlocks(blocks: CustomPartialBlock[]): CustomPartialBlock[];
 export declare function markdownToBlocks(markdown: string): CustomPartialBlock[];
 export {};

package/package/editor/customMarkdownConverter.js

@@ -23,7 +23,7 @@ const headingPrefixes = {
 const SPECIAL_CHAR_REGEX = /([*_`~\[\]()<>\\])/g;
 const HTML_SPAN_REGEX = /<\/?span[^>]*>/g;
 const HTML_UNDERLINE_REGEX = /<\/?u>/g;
-const EXPECTED_LABEL_REGEX = /^(?:[*_`]*\s*)?(expected(?:\s+result)?)\s*(?:[*_`]*\s*)?(?:\s*[:\-–—]?\s*)/i;
+const EXPECTED_LABEL_REGEX = /^(?:[*_`]*\s*)?(expected(?:\s+result)?)\s*(?:[*_`]*\s*)?\s*[:\-–—]\s*/i;
 // Matches any non-empty line that falls between the step title and the expected result line.
 const STEP_DATA_LINE_REGEX = /^(?!\s*(?:[*_`]*\s*)?(?:expected(?:\s+result)?)\b).+/i;
 const NUMBERED_STEP_REGEX = /^\d+[.)]\s+/;
@@ -124,18 +124,53 @@ function inlineToMarkdown(content) {
     if (!content || !Array.isArray(content)) {
         return "";
     }
-    return content
-        .map((item) => {
+    const result = [];
+    let i = 0;
+    while (i < content.length) {
+        const item = content[i];
         if (isStyledTextInlineContent(item)) {
-            return applyTextStyles(escapeMarkdown(item.text), item.styles);
+            // Check if this is a "!" followed by a link (image syntax)
+            if (item.text === "!" && i + 1 < content.length && isLinkInlineContent(content[i + 1])) {
+                const link = content[i + 1];
+                const inner = inlineToMarkdown(link.content);
+                const safeHref = escapeMarkdown(link.href);
+                result.push(`![${inner}](${safeHref})`);
+                i += 2;
+                continue;
+            }
+            result.push(applyTextStyles(escapeMarkdown(item.text), item.styles));
+            i += 1;
+            continue;
         }
         if (isLinkInlineContent(item)) {
             const inner = inlineToMarkdown(item.content);
             const safeHref = escapeMarkdown(item.href);
-            return `[${inner}](${safeHref})`;
+            result.push(`[${inner}](${safeHref})`);
+            i += 1;
+            continue;
         }
         if (Array.isArray(item.content)) {
-            return inlineToMarkdown(item.content);
+            result.push(inlineToMarkdown(item.content));
+            i += 1;
+            continue;
+        }
+        i += 1;
+    }
+    return result.join("");
+}
+function inlineContentToPlainText(content) {
+    if (!Array.isArray(content)) {
+        return "";
+    }
+    return content
+        .map((node) => {
+        if (node && typeof node === "object") {
+            if (typeof node.text === "string") {
+                return node.text;
+            }
+            if (Array.isArray(node.content)) {
+                return inlineContentToPlainText(node.content);
+            }
         }
         return "";
     })
@@ -479,10 +514,13 @@ function parseInlineMarkdown(text) {
                 pushPlain();
                 const label = cleaned.slice(i + 1, endLabel);
                 const href = cleaned.slice(startLink + 1, endLink);
+                const parsedLabel = parseInlineMarkdown(label);
+                // Ensure link content is never undefined - if empty, add empty text
+                const linkContent = parsedLabel.length > 0 ? parsedLabel : [{ type: "text", text: "", styles: {} }];
                 result.push({
                     type: "link",
                     href: unescapeMarkdown(href),
-                    content: parseInlineMarkdown(label),
+                    content: linkContent,
                 });
                 i = endLink + 1;
                 continue;
@@ -534,7 +572,7 @@ function countIndent(line) {
     const match = line.match(/^ */);
     return match ? match[0].length : 0;
 }
-function parseList(lines, startIndex, listType, indentLevel) {
+function parseList(lines, startIndex, listType, indentLevel, allowEmptySteps = false) {
     var _a, _b, _c, _d;
     const items = [];
     let index = startIndex;
@@ -546,14 +584,13 @@ function parseList(lines, startIndex, listType, indentLevel) {
             continue;
         }
         let indent = countIndent(rawLine);
-        const baseIndent = indentLevel * 2;
-        if (indent > baseIndent && indent <= baseIndent + 1) {
-            indent = baseIndent;
-        }
         if (indent < indentLevel * 2) {
             break;
         }
-        if (indent > indentLevel * 2) {
+        // Check if this line should be parsed as nested content
+        // Only go deeper if indent is at least 2 more than the next level's expected indent
+        const nextLevelExpectedIndent = (indentLevel + 1) * 2;
+        if (indent >= nextLevelExpectedIndent) {
             const lastItem = items.at(-1);
             if (!lastItem) {
                 break;
@@ -562,7 +599,12 @@ function parseList(lines, startIndex, listType, indentLevel) {
             if (!nestedType) {
                 break;
             }
-            const nested = parseList(lines, index, nestedType, indentLevel + 1);
+            const nested = parseList(lines, index, nestedType, indentLevel + 1, allowEmptySteps);
+            // If nested parsing made no progress, skip this line to avoid infinite loop
+            if (nested.nextIndex === index) {
+                index += 1;
+                continue;
+            }
             lastItem.children = [...((_a = lastItem.children) !== null && _a !== void 0 ? _a : []), ...nested.items];
             index = nested.nextIndex;
             continue;
@@ -571,6 +613,23 @@ function parseList(lines, startIndex, listType, indentLevel) {
         if (detectedType !== listType) {
             break;
         }
+        // Only try to parse as testStep for top-level items (indentLevel === 0)
+        // when we're under a Steps heading AND the list type is bullet
+        // Numbered lists under Steps heading are only parsed as test steps if they look like test steps
+        if (indentLevel === 0 && allowEmptySteps) {
+            // For bullet lists, always try to parse as test steps
+            // For numbered lists, only try if they have step-like characteristics
+            const looksLikeTestStep = listType === "bullet" ||
+                (listType === "numbered" && (isLikelyStep(lines, index)));
+            if (looksLikeTestStep) {
+                const nextStep = parseTestStep(lines, index, allowEmptySteps);
+                if (nextStep) {
+                    items.push(nextStep.block);
+                    index = nextStep.nextIndex;
+                    continue;
+                }
+            }
+        }
         if (listType === "check") {
             const checkMatch = trimmed.match(/^[-*+]\s+\[([xX\s])\]\s+(.*)$/);
             const checked = ((_b = checkMatch === null || checkMatch === void 0 ? void 0 : checkMatch[1]) !== null && _b !== void 0 ? _b : "").toLowerCase() === "x";
@@ -607,13 +666,46 @@ function parseList(lines, startIndex, listType, indentLevel) {
     }
     return { items, nextIndex: index };
 }
-function parseTestStep(lines, index, snippetId) {
+function isLikelyStep(lines, index) {
+    // Look ahead to see if there's indented content or expected result
+    if (index + 1 >= lines.length)
+        return false;
+    const nextLine = lines[index + 1];
+    const hasIndent = /^\s{2,}/.test(nextLine);
+    // Check if the next line contains expected result markers
+    const nextTrimmed = nextLine.trim();
+    const hasExpectedResult = EXPECTED_LABEL_REGEX.test(nextTrimmed);
+    // Only consider it a test step if:
+    // 1. It has an expected result, OR
+    // 2. The next line is indented but doesn't start with a numbered or bullet list
+    if (hasExpectedResult)
+        return true;
+    if (hasIndent && !/^\d+[.)]/.test(nextTrimmed) && !/^[-*+]/.test(nextTrimmed))
+        return true;
+    return false;
+}
+function parseTestStep(lines, index, allowEmpty = false, snippetId) {
     const current = lines[index];
     const trimmed = current.trim();
-    if (!trimmed.startsWith("* ") && !trimmed.startsWith("- ")) {
+    const isBullet = trimmed.startsWith("* ") || trimmed.startsWith("- ");
+    const isNumbered = /^\d+[.)]\s+/.test(trimmed);
+    if (!isBullet && !isNumbered) {
+        return null;
+    }
+    // For numbered lists, only parse as test steps if called from parseList with allowEmpty=true
+    // The first call to parseTestStep from markdownToBlocks uses allowEmpty=stepsHeadingLevel !== null
+    // which should be false unless we're under a Steps heading
+    if (isNumbered && !allowEmpty) {
         return null;
     }
-    let rawTitle = unescapeMarkdown(trimmed.slice(2)).trim();
+    let rawTitle;
+    if (isBullet) {
+        rawTitle = unescapeMarkdown(trimmed.slice(2)).trim();
+    }
+    else {
+        // For numbered lists, remove the number and delimiter
+        rawTitle = unescapeMarkdown(trimmed.replace(/^\d+[.)]\s+/, "")).trim();
+    }
     let blockType = "testStep";
     const snippetMatch = rawTitle.match(/^snippet\s*[:\-–—]?\s*(.*)$/i);
     if (snippetMatch) {
@@ -640,8 +732,13 @@ function parseTestStep(lines, index, snippetId) {
         const hasIndent = /^\s{2,}/.test(line);
         const rawTrimmed = line.trim();
         if (!rawTrimmed) {
-            if (stepDataLines.length > 0) {
-                stepDataLines.push("");
+            if (stepDataLines.length > 0 || inExpectedResult) {
+                if (inExpectedResult) {
+                    expectedResult += "\n";
+                }
+                else {
+                    stepDataLines.push("");
+                }
             }
             next += 1;
             continue;
@@ -658,20 +755,66 @@ function parseTestStep(lines, index, snippetId) {
             rawTrimmed.startsWith("|")) {
             break;
         }
-        if (rawTrimmed.match(EXPECTED_LABEL_REGEX)) {
+        // Check for expected result labels with different formatting
+        const expectedMatch = rawTrimmed.match(EXPECTED_LABEL_REGEX);
+        const expectedStarMatch = rawTrimmed.match(/^\*expected\s*\*:\s*(.*)$/i) ||
+            rawTrimmed.match(/^\*expected\*:\s*(.*)$/i);
+        if (expectedMatch || expectedStarMatch) {
+            inExpectedResult = true;
+            const label = expectedMatch ? expectedMatch[0] : (expectedStarMatch ? expectedStarMatch[0] : '');
+            let content = rawTrimmed.slice(label.length).trim();
+            // Add the content (if any) from this line
+            if (content) {
+                const expectedContent = unescapeMarkdown(content);
+                if (expectedResult.length > 0) {
+                    expectedResult += "\n" + expectedContent;
+                }
+                else {
+                    expectedResult = expectedContent;
+                }
+            }
+            next += 1;
+            continue;
+        }
+        // Check for lines that start with * and contain Expected (but don't match the above patterns)
+        if (rawTrimmed.match(/^\*[^*]*expected/i)) {
             inExpectedResult = true;
-            const withoutLabel = stripExpectedPrefix(rawTrimmed);
-            expectedResult = unescapeMarkdown(withoutLabel);
+            // Remove the leading * and trim
+            let content = rawTrimmed.slice(1).trim();
+            // Remove any "Expected:" prefix
+            content = content.replace(/^expected\s*:?\s*/i, '').trim();
+            const expectedContent = unescapeMarkdown(content);
+            if (expectedResult.length > 0) {
+                expectedResult += "\n" + expectedContent;
+            }
+            else {
+                expectedResult = expectedContent;
+            }
             next += 1;
             continue;
         }
         if (rawTrimmed.startsWith("```")) {
-            stepDataLines.push(unescapeMarkdown(rawTrimmed));
+            if (inExpectedResult) {
+                if (expectedResult.length > 0) {
+                    expectedResult += "\n" + unescapeMarkdown(rawTrimmed);
+                }
+                else {
+                    expectedResult = unescapeMarkdown(rawTrimmed);
+                }
+            }
+            else {
+                stepDataLines.push(unescapeMarkdown(rawTrimmed));
+            }
             next += 1;
             while (next < lines.length) {
                 const fenceLine = lines[next];
                 const fenceTrimmed = fenceLine.trim();
-                stepDataLines.push(unescapeMarkdown(fenceTrimmed));
+                if (inExpectedResult) {
+                    expectedResult += "\n" + unescapeMarkdown(fenceTrimmed);
+                }
+                else {
+                    stepDataLines.push(unescapeMarkdown(fenceTrimmed));
+                }
                 next += 1;
                 if (fenceTrimmed.startsWith("```")) {
                     break;
@@ -680,8 +823,16 @@ function parseTestStep(lines, index, snippetId) {
             continue;
         }
         if (inExpectedResult) {
-            const withoutLabel = stripExpectedPrefix(rawTrimmed);
-            expectedResult += "\n" + unescapeMarkdown(withoutLabel);
+            // After finding the first expected result, indented lines are part of it
+            if (hasIndent) {
+                const expectedContent = unescapeMarkdown(rawTrimmed);
+                if (expectedResult.length > 0) {
+                    expectedResult += "\n" + expectedContent;
+                }
+                else {
+                    expectedResult = expectedContent;
+                }
+            }
             next += 1;
             continue;
         }
@@ -691,13 +842,23 @@ function parseTestStep(lines, index, snippetId) {
             next += 1;
             continue;
         }
+        // If we have indent and the line doesn't match other patterns, treat it as step data
+        if (hasIndent) {
+            const content = unescapeMarkdown(rawTrimmed);
+            stepDataLines.push(content);
+            next += 1;
+            continue;
+        }
         break;
     }
     const stepData = stepDataLines
         .map((line) => line.trimEnd())
         .join("\n")
         .trim();
-    if (!isLikelyStep && !expectedResult && stepDataLines.length === 0) {
+    if (!isLikelyStep &&
+        !expectedResult &&
+        stepDataLines.length === 0 &&
+        !(allowEmpty && titleWithPlaceholders.length > 0)) {
         return null;
     }
     const stepDataWithImages = [stepData, titleImages.join("\n")]
@@ -899,11 +1060,67 @@ function parseSnippetWrapper(lines, index) {
         nextIndex: next,
     };
 }
+// Post-process blocks to fix malformed image blocks
+export function fixMalformedImageBlocks(blocks) {
+    var _a, _b, _c, _d;
+    const result = [];
+    let i = 0;
+    while (i < blocks.length) {
+        const current = blocks[i];
+        const next = blocks[i + 1];
+        // Skip empty paragraphs
+        if (current.type === "paragraph" &&
+            (!current.content || !Array.isArray(current.content) || current.content.length === 0)) {
+            i += 1;
+            continue;
+        }
+        // Check if current is a paragraph with just "!" - this is definitely a malformed image
+        if (current.type === "paragraph" &&
+            current.content &&
+            Array.isArray(current.content) &&
+            current.content.length === 1 &&
+            ((_a = current.content[0]) === null || _a === void 0 ? void 0 : _a.type) === "text" &&
+            ((_b = current.content[0]) === null || _b === void 0 ? void 0 : _b.text) === "!") {
+            // This is a malformed image block, skip it entirely
+            // The full image was likely parsed as ![](...) but got corrupted
+            i += 1;
+            continue;
+        }
+        // Check if current is a paragraph with just "!" and next is an empty paragraph
+        if (current.type === "paragraph" &&
+            (next === null || next === void 0 ? void 0 : next.type) === "paragraph" &&
+            current.content &&
+            Array.isArray(current.content) &&
+            current.content.length === 1 &&
+            ((_c = current.content[0]) === null || _c === void 0 ? void 0 : _c.type) === "text" &&
+            ((_d = current.content[0]) === null || _d === void 0 ? void 0 : _d.text) === "!" &&
+            (!next.content || !Array.isArray(next.content) || next.content.length === 0)) {
+            // This looks like a malformed image, skip both blocks
+            i += 2;
+            continue;
+        }
+        // Check if current has "!" but no link
+        if (current.type === "paragraph" &&
+            current.content &&
+            Array.isArray(current.content) &&
+            current.content.some((item) => item.type === "text" && item.text === "!") &&
+            !current.content.some((item) => item.type === "link")) {
+            // Skip malformed image block
+            i += 1;
+            continue;
+        }
+        result.push(current);
+        i += 1;
+    }
+    return result;
+}
 export function markdownToBlocks(markdown) {
+    var _a, _b;
     const normalized = markdown.replace(/\r\n/g, "\n");
     const lines = normalized.split("\n");
     const blocks = [];
     let index = 0;
+    let stepsHeadingLevel = null;
     while (index < lines.length) {
         const line = lines[index];
         if (!line.trim()) {
@@ -916,7 +1133,7 @@ export function markdownToBlocks(markdown) {
             index = snippetWrapper.nextIndex;
             continue;
         }
-        const stepLikeBlock = parseTestStep(lines, index);
+        const stepLikeBlock = parseTestStep(lines, index, stepsHeadingLevel !== null);
         if (stepLikeBlock) {
             blocks.push(stepLikeBlock.block);
             index = stepLikeBlock.nextIndex;
@@ -930,7 +1147,19 @@ export function markdownToBlocks(markdown) {
         }
         const heading = parseHeading(lines, index);
         if (heading) {
-            blocks.push(heading.block);
+            const headingBlock = heading.block;
+            const headingLevel = (_b = (_a = headingBlock.props) === null || _a === void 0 ? void 0 : _a.level) !== null && _b !== void 0 ? _b : 3;
+            const headingText = inlineContentToPlainText(headingBlock.content);
+            const normalizedHeading = headingText.trim().toLowerCase();
+            if (normalizedHeading.replace(/[:\-–—]$/, "") === "steps") {
+                stepsHeadingLevel = headingLevel;
+            }
+            else if (stepsHeadingLevel !== null &&
+                headingLevel <= stepsHeadingLevel &&
+                normalizedHeading.length > 0) {
+                stepsHeadingLevel = null;
+            }
+            blocks.push(headingBlock);
             index = heading.nextIndex;
             continue;
         }
@@ -948,7 +1177,7 @@ export function markdownToBlocks(markdown) {
         }
         const listType = detectListType(line.trim());
         if (listType) {
-            const { items, nextIndex } = parseList(lines, index, listType, 0);
+            const { items, nextIndex } = parseList(lines, index, listType, 0, stepsHeadingLevel !== null);
             blocks.push(...items);
             index = nextIndex;
             continue;
@@ -957,7 +1186,7 @@ export function markdownToBlocks(markdown) {
         blocks.push(paragraph.block);
         index = paragraph.nextIndex;
     }
-    return blocks;
+    return fixMalformedImageBlocks(blocks);
 }
 function splitTableRow(line) {
     let value = line.trim();