refactor(log): trim

src/log/src/Log.tsx

@@ -35,14 +35,8 @@ export const logInjectionKey: InjectionKey<LogInjection> = Symbol('log')
 
 const logProps = {
   ...(useTheme.props as ThemeProps<LogTheme>),
-  loading: {
-    type: Boolean,
-    default: false
-  },
-  trim: {
-    type: Boolean,
-    default: false
-  },
+  loading: Boolean,
+  trim: Boolean,
   log: String,
   fontSize: {
     type: Number,
@@ -69,10 +63,7 @@ const logProps = {
     type: Number,
     default: 0
   },
-  hljs: {
-    type: Object,
-    default: undefined
-  },
+  hljs: Object,
   onReachTop: Function as PropType<() => void>,
   onReachBottom: Function as PropType<() => void>,
   onRequireMore: Function as PropType<(from: 'top' | 'bottom') => void>

src/log/src/LogLine.tsx

@@ -22,14 +22,14 @@ export default defineComponent({
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
       inject(logInjectionKey)!
     const selfRef = ref<HTMLElement | null>(null)
-    const mergedLineTrimRef = computed(() => {
-      return trimRef.value ? (props.line || '').trim() : props.line
+    const maybeTrimmedLinesRef = computed(() => {
+      return trimRef.value ? props.line.trim() : props.line
     })
     function setInnerHTML (): void {
       if (selfRef.value) {
         selfRef.value.innerHTML = generateCodeHTML(
           languageRef.value,
-          mergedLineTrimRef.value
+          maybeTrimmedLinesRef.value
         )
       }
     }
@@ -58,11 +58,11 @@ export default defineComponent({
     return {
       highlight: highlightRef,
       selfRef,
-      mergedLineTrim: mergedLineTrimRef
+      maybeTrimmedLines: maybeTrimmedLinesRef
     }
   },
   render () {
-    const { highlight, mergedLineTrim } = this
-    return <pre ref="selfRef">{highlight ? null : mergedLineTrim}</pre>
+    const { highlight, maybeTrimmedLines } = this
+    return <pre ref="selfRef">{highlight ? null : maybeTrimmedLines}</pre>
   }
 })