From fac1acaee9185c41057f05249c1e2265261c7e1a Mon Sep 17 00:00:00 2001 From: Utkarsh Singhal Date: Sun, 5 Apr 2026 10:26:22 +0000 Subject: [PATCH 1/2] fix(code-example): handle quote variants and dedupe injected props --- src/components/code/CodeExample.jsx | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/src/components/code/CodeExample.jsx b/src/components/code/CodeExample.jsx index 343ac9bc..53582e12 100644 --- a/src/components/code/CodeExample.jsx +++ b/src/components/code/CodeExample.jsx @@ -36,13 +36,23 @@ function injectPropsIntoCode(usageCode, props, defaultProps, componentName, demo const newPropLine = typeof propValue === 'boolean' && propValue === true ? propName : `${propName}=${formattedValue}`; - const simplePropRegex = new RegExp(`(^[ \\t]*)(${propName})(?:=(?:"[^"]*"|\\{[^{}\\n]*\\}))?[ \\t]*$`, 'gm'); + const simplePropRegex = new RegExp( + `(^[ \\t]*)(${propName})(?:=(?:"[^"\\n]*"|'[^'\\n]*'|\\{[^{}\\n]*\\}|[^\\s/>]+))?[ \\t]*$`, + 'gm' + ); const hasSimpleMatch = simplePropRegex.test(result); simplePropRegex.lastIndex = 0; if (hasSimpleMatch) { - result = result.replace(simplePropRegex, `$1${newPropLine}`); + let seen = false; + result = result + .replace(simplePropRegex, (_, indent) => { + if (seen) return ''; + seen = true; + return `${indent}${newPropLine}`; + }) + .replace(/\n{3,}/g, '\n\n'); continue; } From 28395709741707d92788dc80170c0c209f248357 Mon Sep 17 00:00:00 2001 From: Utkarsh Singhal Date: Sun, 5 Apr 2026 10:36:28 +0000 Subject: [PATCH 2/2] fix(code-example): update regex to handle line endings in prop injection --- src/components/code/CodeExample.jsx | 14 ++++++-------- 1 file changed, 6 insertions(+), 8 deletions(-) diff --git a/src/components/code/CodeExample.jsx b/src/components/code/CodeExample.jsx index 53582e12..ee53e312 100644 --- a/src/components/code/CodeExample.jsx +++ b/src/components/code/CodeExample.jsx @@ -37,7 +37,7 @@ function injectPropsIntoCode(usageCode, props, defaultProps, componentName, demo typeof propValue === 'boolean' && propValue === true ? propName : `${propName}=${formattedValue}`; const simplePropRegex = new RegExp( - `(^[ \\t]*)(${propName})(?:=(?:"[^"\\n]*"|'[^'\\n]*'|\\{[^{}\\n]*\\}|[^\\s/>]+))?[ \\t]*$`, + `(^[ \\t]*)(${propName})(?:=(?:"[^"\\n]*"|'[^'\\n]*'|\\{[^{}\\n]*\\}|[^\\s/>]+))?[ \\t]*(\\r?\\n|$)`, 'gm' ); @@ -46,13 +46,11 @@ function injectPropsIntoCode(usageCode, props, defaultProps, componentName, demo if (hasSimpleMatch) { let seen = false; - result = result - .replace(simplePropRegex, (_, indent) => { - if (seen) return ''; - seen = true; - return `${indent}${newPropLine}`; - }) - .replace(/\n{3,}/g, '\n\n'); + result = result.replace(simplePropRegex, (_, indent, __, lineEnding) => { + if (seen) return ''; + seen = true; + return `${indent}${newPropLine}${lineEnding}`; + }); continue; }