vite-uni-dev-tool 1.1.0 → 1.2.0

package/dist/v3/DevTool/components/SourceCode/Line.vue

@@ -1,127 +1,127 @@
-<template>
-  <view
-    :class="['source-code-line', active ? 'source-code-line-active' : '']"
-    :id="id">
-    <view class="source-code-line-num" v-if="showNum">{{ num }}</view>
-    <view :class="['source-code-line-content', line.class]">
-      <view
-        v-for="(item, index) in line.words"
-        :key="index"
-        :class="['source-code-line-word', item.class]">
-        {{ item.word }}
-      </view>
-    </view>
-  </view>
-</template>
-<script lang="ts" setup>
-import type { LineInfo } from './parseCode';
-
-const _props = withDefaults(
-  defineProps<{
-    line: LineInfo;
-
-    id: string;
-    active?: boolean;
-    num?: number;
-    showNum?: boolean;
-  }>(),
-  {
-    showNum: true,
-  },
-);
-</script>
-<style lang="scss" scoped>
-.source-code-line {
-  display: flex;
-  align-items: center;
-  height: 20px;
-  font-family: Consolas, Monaco, 'Courier New', monospace;
-  position: relative;
-}
-
-.source-code-line-active {
-  color: #fff;
-
-  /* background-color: var(--dev-tool-main-color); */
-  background-color: rgb(146 84 222 / 50%);
-}
-
-.source-code-line-num {
-  position: sticky;
-  left: 0;
-  z-index: 1;
-  background-color: var(--dev-tool-bg3-color);
-  flex-shrink: 0;
-  width: 30px;
-  padding: 0 6px;
-  margin-right: 15px;
-  text-align: right;
-  height: 20px;
-  border-right: 1px solid var(--dev-tool-border-color);
-}
-
-.source-code-line-content {
-  display: flex;
-  white-space: pre;
-  height: 20px;
-  user-select: text; /* 方便后续选取或直接开启 contenteditable 编辑 */
-}
-
-.source-code-line-word {
-  white-space: pre;
-  box-sizing: border-box;
-}
-
-.source-code-pre-space {
-  border-left: 1px dashed var(--dev-tool-border-color);
-
-  /* The color can be made softer if default border is too prominent */
-  border-left-color: rgb(146 84 222 / 15%); /* matching theme slightly */
-  margin-left: -1px; /* collapse border so spaces stay aligned perfectly */
-  padding-left: 1px;
-}
-
-.source-code-pre-note {
-  color: var(--dev-tool-note-color);
-}
-
-.source-code-pre-keyword {
-  color: var(--dev-tool-keyword-color);
-}
-
-.source-code-pre-bracket {
-  color: var(--dev-tool-bracket-color);
-}
-
-.source-code-pre-quotation {
-  color: var(--dev-tool-quotation-color);
-}
-
-.source-code-pre-string {
-  color: var(--dev-tool-string-color);
-}
-
-.source-code-pre-function {
-  color: var(--dev-tool-function-color);
-}
-
-.source-code-pre-attribute {
-  color: var(--dev-tool-attribute-color);
-}
-
-.source-code-pre-operator {
-  color: var(--dev-tool-operator-color);
-}
-
-.source-code-pre-number {
-  color: var(--dev-tool-number-color);
-}
-
-.source-code-pre-builtin {
-  color: var(--dev-tool-builtin-color, var(--dev-tool-keyword-color));
-}
-
-.source-code-pre-symbol {
-  color: var(--dev-tool-symbol-color, var(--dev-tool-text-color));
-}
-</style>
+<template>
+  <view
+    :class="['source-code-line', active ? 'source-code-line-active' : '']"
+    :id="id">
+    <view class="source-code-line-num" v-if="showNum">{{ num }}</view>
+    <view :class="['source-code-line-content', line.class]">
+      <view
+        v-for="(item, index) in line.words"
+        :key="index"
+        :class="['source-code-line-word', item.class]">
+        {{ item.word }}
+      </view>
+    </view>
+  </view>
+</template>
+<script lang="ts" setup>
+import type { LineInfo } from './parseCode';
+
+const _props = withDefaults(
+  defineProps<{
+    line: LineInfo;
+
+    id: string;
+    active?: boolean;
+    num?: number;
+    showNum?: boolean;
+  }>(),
+  {
+    showNum: true,
+  },
+);
+</script>
+<style lang="scss" scoped>
+.source-code-line {
+  display: flex;
+  align-items: center;
+  height: 20px;
+  font-family: Consolas, Monaco, 'Courier New', monospace;
+  position: relative;
+}
+
+.source-code-line-active {
+  color: #fff;
+
+  /* background-color: var(--dev-tool-main-color); */
+  background-color: rgb(146 84 222 / 50%);
+}
+
+.source-code-line-num {
+  position: sticky;
+  left: 0;
+  z-index: 1;
+  background-color: var(--dev-tool-bg3-color);
+  flex-shrink: 0;
+  width: 30px;
+  padding: 0 6px;
+  margin-right: 15px;
+  text-align: right;
+  height: 20px;
+  border-right: 1px solid var(--dev-tool-border-color);
+}
+
+.source-code-line-content {
+  display: flex;
+  white-space: pre;
+  height: 20px;
+  user-select: text; /* 方便后续选取或直接开启 contenteditable 编辑 */
+}
+
+.source-code-line-word {
+  white-space: pre;
+  box-sizing: border-box;
+}
+
+.source-code-pre-space {
+  border-left: 1px dashed var(--dev-tool-border-color);
+
+  /* The color can be made softer if default border is too prominent */
+  border-left-color: rgb(146 84 222 / 15%); /* matching theme slightly */
+  margin-left: -1px; /* collapse border so spaces stay aligned perfectly */
+  padding-left: 1px;
+}
+
+.source-code-pre-note {
+  color: var(--dev-tool-note-color);
+}
+
+.source-code-pre-keyword {
+  color: var(--dev-tool-keyword-color);
+}
+
+.source-code-pre-bracket {
+  color: var(--dev-tool-bracket-color);
+}
+
+.source-code-pre-quotation {
+  color: var(--dev-tool-quotation-color);
+}
+
+.source-code-pre-string {
+  color: var(--dev-tool-string-color);
+}
+
+.source-code-pre-function {
+  color: var(--dev-tool-function-color);
+}
+
+.source-code-pre-attribute {
+  color: var(--dev-tool-attribute-color);
+}
+
+.source-code-pre-operator {
+  color: var(--dev-tool-operator-color);
+}
+
+.source-code-pre-number {
+  color: var(--dev-tool-number-color);
+}
+
+.source-code-pre-builtin {
+  color: var(--dev-tool-builtin-color, var(--dev-tool-keyword-color));
+}
+
+.source-code-pre-symbol {
+  color: var(--dev-tool-symbol-color, var(--dev-tool-text-color));
+}
+</style>