fix: typeit shortcode and stype

assets/css/_page/_single.scss

@@ -305,16 +305,6 @@
       }
     }
 
-    .typeit {
-      .code {
-        padding: .375rem;
-        font-size: .875rem;
-        font-family: $code-font-family;
-        font-weight: bold;
-        word-break: break-all;
-      }
-    }
-
     .version {
       height: 1.25em;
       vertical-align: text-bottom;
@@ -325,6 +315,28 @@
   @import "../_partial/_single/comment";
 }
 
+.typeit {
+  .highlight {
+    padding: .375rem;
+    font-size: .875rem;
+    font-family: $code-font-family;
+    font-weight: bold;
+    word-break: break-all;
+    white-space: pre-wrap;
+  }
+
+  --ti-cursor-font-family: $global-font-family;
+  --ti-cursor-font-size: $global-font-size;
+  --ti-cursor-font-weight: $global-font-weight;
+  --ti-cursor-line-height: $global-line-height;
+  --ti-cursor-color: $global-font-secondary-color;
+  --ti-cursor-margin-left: 0;
+
+  [theme=dark] & {
+    --ti-cursor-color: $global-font-secondary-color-dark;
+  }
+}
+
 .lg-toolbar .lg-icon::after {
   color: #999;
 }

assets/lib/VERSION

@@ -15,7 +15,7 @@ lg-thumbnail.js@1.2.0 https://github.com/sachinchoolur/lg-thumbnail.js
 lg-zoom.js@1.2.0 https://github.com/sachinchoolur/lg-zoom.js
 clipboard.js@2.0.11 https://github.com/zenorocha/clipboard.js
 sharer.js@0.4.0 https://github.com/ellisonleao/sharer.js
-typeit@7.0.4 https://github.com/alexmacarthur/typeit
+typeit@8.5.4 https://github.com/alexmacarthur/typeit
 katex@0.15.3 https://katex.org/
 mermaid@9.0.1 https://github.com/mermaid-js/mermaid
 echarts@5.3.2 https://echarts.apache.org/

layouts/shortcodes/typeit.html

@@ -1,18 +1,21 @@
 {{- $content := trim .Inner "\n" -}}
-{{- $classList := .Get "class" | slice -}}
+{{- $classList := slice -}}
+{{- with .Get "class" -}}
+    {{- $classList = $classList | append . -}}
+{{- end -}}
 {{- $tag := .Get "tag" | default "div" -}}
 
-{{- with .Get "code" -}}
+{{- if .Get "code" -}}
     {{- /* highlight code content without line number */ -}}
-    {{- $content = highlight $content . "linenos=false" -}}
+    {{- $content = highlight $content (.Get "code") "lineNos=false, noClasses=false" -}}
     {{- /* delete outer label */ -}}
-    {{- $content = replaceRE `<div class="highlight"><pre class="chroma"><code[^<>]*>(?s)(.*)</code></pre></div>` "$1" $content -}}
+    {{- $content = replaceRE `.*<code[^<>]*>(?s)(.*)</code>.*` "$1" $content -}}
-    {{- /* parsing markdown links */ -}}
+    {{- if .Get "code-link" -}}
-    {{- $content = replaceRE `(<span[^<>]*>)([^<>]*)\[([^<>]+)\]\(([^<>]+)\)([^<>]*)(</span>)` "$1$2$6<a href=$4>$3</a>$1$5$6" $content -}}
+        {{- /* parsing code links */ -}}
-    {{- /* replace " " to "&nbsp;" and replace "\n" to "<br />" */ -}}
+        {{- $content = replaceRE `(<span[^<>]*>)([^<>]*)\[([^<>]+)\]\(([^<>]+)\)([^<>]*)(</span>)` "$1$2$6<a href=\"$4\">$3</a>$1$5$6" $content -}}
-    {{- $content = replaceRE ` ` "&nbsp;" $content | replaceRE `(<\w+)&nbsp;` "$1 " | replaceRE `\n` "<br />" -}}
+    {{- end -}}
-    {{- /* fix "<br />" location error which is a bug of Typeit HTML parser */ -}}
+    {{- /* split multiline string */ -}}
-    {{- $content = replaceRE `<br /></span>` "</span><br />" $content -}}
+    {{- $content = split $content "\n" -}}
     {{- $classList = $classList | append "highlight" -}}
 {{- else -}}
     {{- $content = $content | .Page.RenderString -}}
@@ -26,6 +29,11 @@
 {{- $group = $group | default slice | append $id -}}
 {{- dict $key $group | merge $typeitMap | .Page.Scratch.SetInMap "this" "typeitMap" -}}
 
+{{- $attrs := printf `id="%v"` $id -}}
+{{- with $classList -}}
+    {{- $attrs = delimit $classList " " | printf `%v class="%v"` $attrs -}}
+{{- end -}}
+
 <div class="typeit">
-    {{- printf `<%v id="%v" class="%v"></%v>` $tag $id (delimit $classList " ") $tag | safeHTML -}}
+    {{- printf `<%v %v></%v>` $tag $attrs $tag | safeHTML -}}
 </div>