@hejiayue/x-markdown-test 0.0.1-beta.129 → 0.0.1-beta.131

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,125 +0,0 @@
1
- import { defineComponent, computed, createElementBlock, openBlock, normalizeStyle, createElementVNode, toDisplayString, normalizeClass, createTextVNode, Fragment, renderList, unref } from "vue";
2
- import { useHighlight } from "./x-markdown.es7.js";
3
- const _hoisted_1 = { class: "x-md-syntax-code-block" };
4
- const _hoisted_2 = { class: "x-md-code-content" };
5
- const _hoisted_3 = { key: 0 };
6
- const _sfc_main = /* @__PURE__ */ defineComponent({
7
- ...{
8
- name: "SyntaxCodeBlock"
9
- },
10
- __name: "SyntaxCodeBlock",
11
- props: {
12
- code: {},
13
- language: {},
14
- lightTheme: { default: "vitesse-light" },
15
- darkTheme: { default: "vitesse-dark" },
16
- isDark: { type: Boolean, default: false },
17
- colorReplacements: {},
18
- codeMaxHeight: {},
19
- enableAnimate: { type: Boolean, default: false }
20
- },
21
- setup(__props, { expose: __expose }) {
22
- const props = __props;
23
- const code = computed(() => props.code.trim());
24
- const language = computed(() => props.language || "text");
25
- const actualTheme = computed(() => props.isDark ? props.darkTheme : props.lightTheme);
26
- const { lines, preStyle } = useHighlight(code, {
27
- language,
28
- theme: actualTheme,
29
- colorReplacements: props.colorReplacements
30
- });
31
- const applyColorReplacement = (color, replacements) => {
32
- if (!replacements) return color;
33
- return replacements[color.toLowerCase()] || color;
34
- };
35
- const normalizeStyleKeys = (style) => {
36
- const normalized = {};
37
- Object.entries(style).forEach(([key, value]) => {
38
- const camelKey = key.replace(/-([a-z])/g, (_, char) => char.toUpperCase());
39
- normalized[camelKey] = value;
40
- });
41
- return normalized;
42
- };
43
- const getTokenStyle = (token) => {
44
- if (!token) {
45
- return {};
46
- }
47
- if (token.htmlStyle) {
48
- const baseStyle = normalizeStyleKeys(token.htmlStyle);
49
- if (!props.colorReplacements) return baseStyle;
50
- const style2 = { ...baseStyle };
51
- if (style2.color && typeof style2.color === "string") {
52
- style2.color = applyColorReplacement(style2.color, props.colorReplacements);
53
- }
54
- if (style2.backgroundColor && typeof style2.backgroundColor === "string") {
55
- style2.backgroundColor = applyColorReplacement(style2.backgroundColor, props.colorReplacements);
56
- }
57
- return style2;
58
- }
59
- const style = {};
60
- if (token.color) {
61
- style.color = props.colorReplacements ? applyColorReplacement(token.color, props.colorReplacements) : token.color;
62
- }
63
- if (token.fontStyle === "italic") {
64
- style.fontStyle = "italic";
65
- }
66
- if (token.fontWeight) {
67
- style.fontWeight = token.fontWeight;
68
- }
69
- return style;
70
- };
71
- const showFallback = computed(() => !lines.value?.length);
72
- const codeContainerStyle = computed(() => ({
73
- ...preStyle.value,
74
- maxHeight: props.codeMaxHeight
75
- }));
76
- __expose({
77
- lines,
78
- code,
79
- language,
80
- actualTheme
81
- });
82
- return (_ctx, _cache) => {
83
- return openBlock(), createElementBlock("div", _hoisted_1, [
84
- showFallback.value ? (openBlock(), createElementBlock("pre", {
85
- key: 0,
86
- style: normalizeStyle(codeContainerStyle.value)
87
- }, [
88
- createElementVNode("code", null, toDisplayString(code.value), 1)
89
- ], 4)) : (openBlock(), createElementBlock("pre", {
90
- key: 1,
91
- class: normalizeClass(["shiki", actualTheme.value]),
92
- style: normalizeStyle(codeContainerStyle.value),
93
- tabindex: "0"
94
- }, [
95
- _cache[4] || (_cache[4] = createTextVNode(" ", -1)),
96
- createElementVNode("code", _hoisted_2, [
97
- _cache[2] || (_cache[2] = createTextVNode("\n ", -1)),
98
- (openBlock(true), createElementBlock(Fragment, null, renderList(unref(lines), (line, i) => {
99
- return openBlock(), createElementBlock("span", {
100
- key: i,
101
- class: "x-md-code-line"
102
- }, [
103
- _cache[0] || (_cache[0] = createTextVNode("\n ", -1)),
104
- !line.length ? (openBlock(), createElementBlock("span", _hoisted_3, " ")) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(line, (token, j) => {
105
- return openBlock(), createElementBlock("span", {
106
- key: j,
107
- style: normalizeStyle(getTokenStyle(token)),
108
- class: normalizeClass({ "x-md-animated-word": props.enableAnimate })
109
- }, toDisplayString(token.content), 7);
110
- }), 128)),
111
- _cache[1] || (_cache[1] = createTextVNode("\n ", -1))
112
- ]);
113
- }), 128)),
114
- _cache[3] || (_cache[3] = createTextVNode("\n ", -1))
115
- ]),
116
- _cache[5] || (_cache[5] = createTextVNode("\n ", -1))
117
- ], 6))
118
- ]);
119
- };
120
- }
121
- });
122
- export {
123
- _sfc_main as default
124
- };
125
- //# sourceMappingURL=x-markdown.es32.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"x-markdown.es32.js","sources":["../src/components/CodeBlock/SyntaxCodeBlock.vue"],"sourcesContent":["<template>\r\n <div class=\"x-md-syntax-code-block\">\r\n <pre v-if=\"showFallback\" :style=\"codeContainerStyle\"><code>{{ code }}</code></pre>\r\n <pre v-else :class=\"['shiki', actualTheme]\" :style=\"codeContainerStyle\" tabindex=\"0\">\r\n <code class=\"x-md-code-content\">\r\n <span v-for=\"(line, i) in lines\" :key=\"i\" class=\"x-md-code-line\">\r\n <span v-if=\"!line.length\">&nbsp;</span>\r\n <span \r\n v-else \r\n v-for=\"(token, j) in line\" \r\n :key=\"j\" \r\n :style=\"getTokenStyle(token)\"\r\n :class=\"{ 'x-md-animated-word': props.enableAnimate }\"\r\n >{{ token.content }}</span>\r\n </span>\r\n </code>\r\n </pre>\r\n </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { computed, type CSSProperties } from 'vue'\r\nimport { useHighlight } from '../../hooks/useHighlight'\r\nimport type { SyntaxCodeBlockProps } from './types'\r\n\r\ninterface HighlightToken {\r\n content?: string\r\n color?: string\r\n fontStyle?: 'italic' | null\r\n fontWeight?: 'normal' | 'bold' | null\r\n htmlStyle?: Record<string, string>\r\n}\r\n\r\ndefineOptions({\r\n name: 'SyntaxCodeBlock',\r\n})\r\n\r\nconst props = withDefaults(defineProps<SyntaxCodeBlockProps>(), {\r\n lightTheme: 'vitesse-light',\r\n darkTheme: 'vitesse-dark',\r\n isDark: false,\r\n enableAnimate: false,\r\n})\r\n\r\nconst code = computed(() => props.code.trim())\r\n\r\nconst language = computed(() => props.language || 'text')\r\n\r\nconst actualTheme = computed(() => (props.isDark ? props.darkTheme : props.lightTheme))\r\n\r\nconst { lines, preStyle } = useHighlight(code, {\r\n language,\r\n theme: actualTheme,\r\n colorReplacements: props.colorReplacements,\r\n})\r\n\r\nconst applyColorReplacement = (color: string, replacements?: Record<string, string>) => {\r\n if (!replacements) return color\r\n return replacements[color.toLowerCase()] || color\r\n}\r\n\r\nconst normalizeStyleKeys = (style: Record<string, string | number>): CSSProperties => {\r\n const normalized: CSSProperties = {}\r\n Object.entries(style).forEach(([key, value]) => {\r\n const camelKey = key.replace(/-([a-z])/g, (_, char) => char.toUpperCase())\r\n ;(normalized as Record<string, string | number>)[camelKey] = value\r\n })\r\n return normalized\r\n}\r\n\r\nconst getTokenStyle = (token: HighlightToken | null | undefined): CSSProperties => {\r\n // 处理 null/undefined token\r\n if (!token) {\r\n return {}\r\n }\r\n\r\n // 优先使用 htmlStyle(如果存在)\r\n if (token.htmlStyle) {\r\n const baseStyle = normalizeStyleKeys(token.htmlStyle)\r\n\r\n if (!props.colorReplacements) return baseStyle\r\n\r\n const style = { ...baseStyle }\r\n\r\n if (style.color && typeof style.color === 'string') {\r\n style.color = applyColorReplacement(style.color, props.colorReplacements)\r\n }\r\n if (style.backgroundColor && typeof style.backgroundColor === 'string') {\r\n style.backgroundColor = applyColorReplacement(style.backgroundColor, props.colorReplacements)\r\n }\r\n\r\n return style\r\n }\r\n\r\n // 直接使用 token 的 color、fontStyle、fontWeight 属性\r\n const style: CSSProperties = {}\r\n\r\n if (token.color) {\r\n style.color = props.colorReplacements\r\n ? applyColorReplacement(token.color, props.colorReplacements)\r\n : token.color\r\n }\r\n\r\n if (token.fontStyle === 'italic') {\r\n style.fontStyle = 'italic'\r\n }\r\n\r\n if (token.fontWeight) {\r\n style.fontWeight = token.fontWeight\r\n }\r\n\r\n return style\r\n}\r\n\r\nconst showFallback = computed(() => !lines.value?.length)\r\n\r\nconst codeContainerStyle = computed(() => ({\r\n ...preStyle.value,\r\n maxHeight: props.codeMaxHeight,\r\n}))\r\n\r\ndefineExpose({\r\n lines,\r\n code,\r\n language,\r\n actualTheme,\r\n})\r\n</script>\r\n\r\n<style scoped>\r\n.x-md-syntax-code-block {\r\n width: 100%;\r\n}\r\n\r\n.x-md-syntax-code-block pre {\r\n margin: 0;\r\n padding: 16px;\r\n overflow: auto;\r\n background: transparent !important;\r\n}\r\n\r\n.x-md-code-content {\r\n display: flex;\r\n flex-direction: column;\r\n}\r\n\r\n.x-md-code-line {\r\n width: 100%;\r\n font-size: 14px;\r\n line-height: 1.5;\r\n display: flex;\r\n}\r\n</style>"],"names":["style","_openBlock","_createElementBlock","_createElementVNode","_Fragment","_renderList","_unref","_normalizeStyle","_normalizeClass","_toDisplayString"],"mappings":"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"}