diff --git a/packages/shaku-code-annotate-shiki/src/defaultCode.ts b/packages/shaku-code-annotate-shiki/src/defaultCode.ts
index 2a5137b..e1837e7 100644
--- a/packages/shaku-code-annotate-shiki/src/defaultCode.ts
+++ b/packages/shaku-code-annotate-shiki/src/defaultCode.ts
@@ -465,6 +465,47 @@ public class CommentExample {
   javascript: `// @highlight
 import { useState } from 'react';
 
+//     (     ) (2     ) (   3 )
+export default function Counter() {
+  // @highlight
+  const [count, setCount] = useState(0);
+              //~~~~~~~~
+  
+  // @diff + start
+  // This
+  // is
+  // Comment
+  // @diff + end
+  function handleClick() {
+    setCount(count + 1);
+  //-------------------
+  //     ^
+  //[Underline and callout!]
+  }
+
+  // @class clickable
+  // @data jser=dev
+  const blog = "https://jser.dev"
+
+  // @diff - 
+  console.log('jser.dev')
+
+  // @cut v
+  // comment to cut
+  // @cut  ^
+  
+  return (
+    <button onClick={handleClick}>
+    {/*       ^           */}
+    {/* [Supports JSX] */}
+    {/* [Awesome,right?] */}
+      You pressed me {count} times
+    </button>
+  );
+}`,
+  js: `// @highlight
+import { useState } from 'react';
+
 //     (     ) (2     ) (   3 )
 export default function Counter() {
   // @highlight