@haklex/rich-renderer-codeblock 0.0.81 → 0.0.83
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.
- package/dist/CodeBlockRenderer-DSXP75Xm.js +125 -0
- package/dist/constants.mjs +70 -67
- package/dist/icons.mjs +91 -2
- package/dist/index.mjs +270 -238
- package/dist/language-UrxzhGSS.js +154 -0
- package/dist/rich-renderer-codeblock.css +1 -2
- package/dist/shiki.mjs +28 -19
- package/dist/static.mjs +4 -3
- package/package.json +5 -5
- package/dist/CodeBlockRenderer-ECu_hR7l.js +0 -134
- package/dist/icons-CnFW5y6g.js +0 -230
|
@@ -0,0 +1,154 @@
|
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { useMemo } from "react";
|
|
3
|
+
import { getIconData, iconToSVG, iconToHTML } from "@iconify/utils";
|
|
4
|
+
import { icons } from "@iconify-json/material-icon-theme";
|
|
5
|
+
function getMaterialIconSvg(iconName) {
|
|
6
|
+
const data = getIconData(icons, iconName);
|
|
7
|
+
if (!data) return null;
|
|
8
|
+
const svg = iconToSVG(data);
|
|
9
|
+
return iconToHTML(svg.body, svg.attributes);
|
|
10
|
+
}
|
|
11
|
+
var semanticClassNames = { card: "rr-code-card", lang: "rr-code-lang", langIcon: "rr-code-lang-icon", copyButton: "rr-code-copy", bodyBackground: "rr-code-bg", scroll: "rr-code-scroll", scrollCollapsed: "rr-code-scroll-collapsed", body: "rr-code-body", bodyReadonly: "rr-code-readonly", expandWrap: "rr-code-expand-wrap", expandButton: "rr-code-expand", lined: "rr-code-lined", linedWithNumbers: "rr-code-lined-ln" };
|
|
12
|
+
var card = "_1pn9r4q0";
|
|
13
|
+
var langInput = "_1pn9r4q1";
|
|
14
|
+
var lang = "_1pn9r4q2";
|
|
15
|
+
var langIcon = "_1pn9r4q3";
|
|
16
|
+
var copyButton = "_1pn9r4q4";
|
|
17
|
+
var bodyBackground = "_1pn9r4q5";
|
|
18
|
+
var scroll = "_1pn9r4q6";
|
|
19
|
+
var scrollCollapsed = "_1pn9r4q7";
|
|
20
|
+
var body = "_1pn9r4q8";
|
|
21
|
+
var bodyReadonly = "_1pn9r4q9";
|
|
22
|
+
var expandWrap = "_1pn9r4qa";
|
|
23
|
+
var expandButton = "_1pn9r4qb";
|
|
24
|
+
var lined = "_1pn9r4qc";
|
|
25
|
+
var linedWithNumbers = "_1pn9r4qd";
|
|
26
|
+
const LANG_TO_ICON = {
|
|
27
|
+
"javascript": "javascript",
|
|
28
|
+
"js": "javascript",
|
|
29
|
+
"typescript": "typescript",
|
|
30
|
+
"ts": "typescript",
|
|
31
|
+
"angular-ts": "angular",
|
|
32
|
+
"angular-html": "angular",
|
|
33
|
+
"jsx": "react",
|
|
34
|
+
"tsx": "react",
|
|
35
|
+
"html": "html",
|
|
36
|
+
"html-derivative": "html",
|
|
37
|
+
"css": "css",
|
|
38
|
+
"scss": "sass",
|
|
39
|
+
"sass": "sass",
|
|
40
|
+
"less": "sass",
|
|
41
|
+
"postcss": "postcss",
|
|
42
|
+
"stylus": "stylus",
|
|
43
|
+
"json": "json",
|
|
44
|
+
"json5": "json",
|
|
45
|
+
"jsonc": "json",
|
|
46
|
+
"jsonl": "json",
|
|
47
|
+
"markdown": "markdown",
|
|
48
|
+
"md": "markdown",
|
|
49
|
+
"mdx": "markdown",
|
|
50
|
+
"mdc": "markdown",
|
|
51
|
+
"bash": "console",
|
|
52
|
+
"sh": "console",
|
|
53
|
+
"shell": "console",
|
|
54
|
+
"shellscript": "console",
|
|
55
|
+
"zsh": "console",
|
|
56
|
+
"python": "python",
|
|
57
|
+
"py": "python",
|
|
58
|
+
"rust": "rust",
|
|
59
|
+
"go": "go",
|
|
60
|
+
"java": "java",
|
|
61
|
+
"c": "c",
|
|
62
|
+
"cpp": "cpp",
|
|
63
|
+
"c++": "cpp",
|
|
64
|
+
"swift": "swift",
|
|
65
|
+
"kotlin": "kotlin",
|
|
66
|
+
"kt": "kotlin",
|
|
67
|
+
"yaml": "yaml",
|
|
68
|
+
"yml": "yaml",
|
|
69
|
+
"sql": "database",
|
|
70
|
+
"xml": "xml",
|
|
71
|
+
"vue": "vue",
|
|
72
|
+
"vue-html": "vue",
|
|
73
|
+
"vue-vine": "vue",
|
|
74
|
+
"svelte": "svelte",
|
|
75
|
+
"astro": "astro",
|
|
76
|
+
"php": "php",
|
|
77
|
+
"rb": "ruby",
|
|
78
|
+
"r": "r",
|
|
79
|
+
"julia": "julia",
|
|
80
|
+
"lua": "lua",
|
|
81
|
+
"zig": "zig",
|
|
82
|
+
"toml": "toml",
|
|
83
|
+
"graphql": "graphql",
|
|
84
|
+
"gql": "graphql",
|
|
85
|
+
"dockerfile": "docker",
|
|
86
|
+
"coffee": "coffee",
|
|
87
|
+
"pug": "pug",
|
|
88
|
+
"haml": "haml",
|
|
89
|
+
"handlebars": "handlebars",
|
|
90
|
+
"marko": "markojs",
|
|
91
|
+
"imba": "imba",
|
|
92
|
+
"hurl": "hurl",
|
|
93
|
+
"http": "http"
|
|
94
|
+
};
|
|
95
|
+
function getLanguageIconSvg(lang2) {
|
|
96
|
+
const iconName = LANG_TO_ICON[lang2] ?? "code";
|
|
97
|
+
return getMaterialIconSvg(iconName);
|
|
98
|
+
}
|
|
99
|
+
function hasLanguageIcon(lang2) {
|
|
100
|
+
return getLanguageIconSvg(lang2) !== null;
|
|
101
|
+
}
|
|
102
|
+
const LanguageIcon = ({
|
|
103
|
+
language,
|
|
104
|
+
size = 14,
|
|
105
|
+
className = `${langIcon} ${semanticClassNames.langIcon}`
|
|
106
|
+
}) => {
|
|
107
|
+
const html = useMemo(() => getLanguageIconSvg(language), [language]);
|
|
108
|
+
if (!html) {
|
|
109
|
+
return /* @__PURE__ */ jsx(
|
|
110
|
+
"span",
|
|
111
|
+
{
|
|
112
|
+
className,
|
|
113
|
+
style: {
|
|
114
|
+
width: size,
|
|
115
|
+
height: size,
|
|
116
|
+
display: "inline-flex",
|
|
117
|
+
alignItems: "center",
|
|
118
|
+
justifyContent: "center",
|
|
119
|
+
opacity: 0.6,
|
|
120
|
+
fontSize: size * 0.6
|
|
121
|
+
},
|
|
122
|
+
children: "•"
|
|
123
|
+
}
|
|
124
|
+
);
|
|
125
|
+
}
|
|
126
|
+
return /* @__PURE__ */ jsx(
|
|
127
|
+
"span",
|
|
128
|
+
{
|
|
129
|
+
className,
|
|
130
|
+
dangerouslySetInnerHTML: { __html: html },
|
|
131
|
+
style: { width: size, height: size }
|
|
132
|
+
}
|
|
133
|
+
);
|
|
134
|
+
};
|
|
135
|
+
export {
|
|
136
|
+
LANG_TO_ICON as L,
|
|
137
|
+
LanguageIcon as a,
|
|
138
|
+
langInput as b,
|
|
139
|
+
lined as c,
|
|
140
|
+
linedWithNumbers as d,
|
|
141
|
+
body as e,
|
|
142
|
+
bodyReadonly as f,
|
|
143
|
+
getMaterialIconSvg as g,
|
|
144
|
+
hasLanguageIcon as h,
|
|
145
|
+
card as i,
|
|
146
|
+
copyButton as j,
|
|
147
|
+
bodyBackground as k,
|
|
148
|
+
lang as l,
|
|
149
|
+
expandWrap as m,
|
|
150
|
+
expandButton as n,
|
|
151
|
+
scroll as o,
|
|
152
|
+
scrollCollapsed as p,
|
|
153
|
+
semanticClassNames as s
|
|
154
|
+
};
|
|
@@ -1,2 +1 @@
|
|
|
1
|
-
:root{--rc-text:#000;--rc-text-secondary:#27272a;--rc-text-tertiary:#71717a;--rc-text-quaternary:#a1a1aa;--rc-bg:#fff;--rc-bg-secondary:#fafafa;--rc-bg-tertiary:#f4f4f5;--rc-fill:#e8e8ec;--rc-fill-secondary:#eeeeef;--rc-fill-tertiary:#f4f4f6;--rc-fill-quaternary:#f9f9fa;--rc-border:#f4f4f5;--rc-accent:#2563eb;--rc-accent-light:#2563eb20;--rc-link:#2563eb;--rc-code-text:#3f3f46;--rc-code-bg:#f4f4f5;--rc-hr-border:#e4e4e7;--rc-quote-border:#2563eb;--rc-quote-bg:#eff6ff;--rc-alert-info:#006bb7;--rc-alert-warning:#c50;--rc-alert-tip:#1c0;--rc-alert-caution:#c01;--rc-alert-important:#50c;--rc-max-width:700px;--rc-shadow-top-bar:0 8px 30px #0000001f, 0 2px 8px #0000000f;--rc-shadow-modal:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--rc-shadow-menu:0 1px 4px #0000000a, 0 4px 16px #00000014;--rc-space-xs:4px;--rc-space-sm:8px;--rc-space-md:16px;--rc-space-lg:24px;--rc-space-xl:32px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:16px;--rc-font-size-small:14px;--rc-line-height:1.7;--rc-line-height-tight:1.4;--rc-font-family:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm:4px;--rc-radius-md:8px;--rc-radius-lg:12px}:root.dark{--rc-text:#fafafa;--rc-text-secondary:#a1a1aa;--rc-text-tertiary:#71717a;--rc-text-quaternary:#52525b;--rc-bg:#09090b;--rc-bg-secondary:#18181b;--rc-bg-tertiary:#27272a;--rc-fill:#2a2a2f;--rc-fill-secondary:#222226;--rc-fill-tertiary:#1b1b1f;--rc-fill-quaternary:#131316;--rc-border:#27272a;--rc-accent:#60a5fa;--rc-accent-light:#60a5fa20;--rc-link:#60a5fa;--rc-code-text:#e4e4e7;--rc-code-bg:#27272a;--rc-hr-border:#27272a;--rc-quote-border:#60a5fa;--rc-quote-bg:#1e3a5f;--rc-alert-info:#7db9e5;--rc-alert-warning:#da864a;--rc-alert-tip:#54da48;--rc-alert-caution:#e16973;--rc-alert-important:#9966e0;--rc-max-width:700px;--rc-shadow-top-bar:0 8px 30px #00000073, 0 2px 8px #0000004d;--rc-shadow-modal:0 10px 15px -3px #0006, 0 4px 6px -4px #00000059;--rc-shadow-menu:0 1px 4px #00000040, 0 4px 16px #0006;--rc-space-xs:4px;--rc-space-sm:8px;--rc-space-md:16px;--rc-space-lg:24px;--rc-space-xl:32px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:16px;--rc-font-size-small:14px;--rc-line-height:1.7;--rc-line-height-tight:1.4;--rc-font-family:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm:4px;--rc-radius-md:8px;--rc-radius-lg:12px}.axx50{--rc-text:#000;--rc-text-secondary:#27272a;--rc-text-tertiary:#71717a;--rc-text-quaternary:#a1a1aa;--rc-bg:#fff;--rc-bg-secondary:#fafafa;--rc-bg-tertiary:#f4f4f5;--rc-fill:#e8e8ec;--rc-fill-secondary:#eeeeef;--rc-fill-tertiary:#f4f4f6;--rc-fill-quaternary:#f9f9fa;--rc-border:#f4f4f5;--rc-accent:#2563eb;--rc-accent-light:#2563eb20;--rc-link:#2563eb;--rc-code-text:#3f3f46;--rc-code-bg:#f4f4f5;--rc-hr-border:#e4e4e7;--rc-quote-border:#2563eb;--rc-quote-bg:#eff6ff;--rc-alert-info:#006bb7;--rc-alert-warning:#c50;--rc-alert-tip:#1c0;--rc-alert-caution:#c01;--rc-alert-important:#50c;--rc-max-width:700px;--rc-shadow-top-bar:0 8px 30px #0000001f, 0 2px 8px #0000000f;--rc-shadow-modal:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--rc-shadow-menu:0 1px 4px #0000000a, 0 4px 16px #00000014;--rc-space-xs:4px;--rc-space-sm:8px;--rc-space-md:16px;--rc-space-lg:24px;--rc-space-xl:32px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:16px;--rc-font-size-small:14px;--rc-line-height:1.7;--rc-line-height-tight:1.4;--rc-font-family:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm:4px;--rc-radius-md:8px;--rc-radius-lg:12px}.axx51{--rc-text:#000;--rc-text-secondary:#27272a;--rc-text-tertiary:#71717a;--rc-text-quaternary:#a1a1aa;--rc-bg:#fff;--rc-bg-secondary:#fafafa;--rc-bg-tertiary:#f4f4f5;--rc-fill:#e8e8ec;--rc-fill-secondary:#eeeeef;--rc-fill-tertiary:#f4f4f6;--rc-fill-quaternary:#f9f9fa;--rc-border:#f4f4f5;--rc-accent:#2563eb;--rc-accent-light:#2563eb20;--rc-link:#2563eb;--rc-code-text:#3f3f46;--rc-code-bg:#f4f4f5;--rc-hr-border:#e4e4e7;--rc-quote-border:#2563eb;--rc-quote-bg:#eff6ff;--rc-alert-info:#006bb7;--rc-alert-warning:#c50;--rc-alert-tip:#1c0;--rc-alert-caution:#c01;--rc-alert-important:#50c;--rc-max-width:700px;--rc-shadow-top-bar:0 8px 30px #0000001f, 0 2px 8px #0000000f;--rc-shadow-modal:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--rc-shadow-menu:0 1px 4px #0000000a, 0 4px 16px #00000014;--rc-space-xs:4px;--rc-space-sm:8px;--rc-space-md:16px;--rc-space-lg:24px;--rc-space-xl:32px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:16px;--rc-font-size-small:14px;--rc-line-height:1.8;--rc-line-height-tight:1.4;--rc-font-family:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-radius-sm:4px;--rc-radius-md:8px;--rc-radius-lg:12px}.axx52{--rc-text:#000;--rc-text-secondary:#27272a;--rc-text-tertiary:#71717a;--rc-text-quaternary:#a1a1aa;--rc-bg:#fff;--rc-bg-secondary:#fafafa;--rc-bg-tertiary:#f4f4f5;--rc-fill:#e8e8ec;--rc-fill-secondary:#eeeeef;--rc-fill-tertiary:#f4f4f6;--rc-fill-quaternary:#f9f9fa;--rc-border:#f4f4f5;--rc-accent:#2563eb;--rc-accent-light:#2563eb20;--rc-link:#2563eb;--rc-code-text:#3f3f46;--rc-code-bg:#f4f4f5;--rc-hr-border:#e4e4e7;--rc-quote-border:#a1a1aa;--rc-quote-bg:#fafafa;--rc-alert-info:#006bb7;--rc-alert-warning:#c50;--rc-alert-tip:#1c0;--rc-alert-caution:#c01;--rc-alert-important:#50c;--rc-max-width:none;--rc-shadow-top-bar:0 8px 30px #0000001f, 0 2px 8px #0000000f;--rc-shadow-modal:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--rc-shadow-menu:0 1px 4px #0000000a, 0 4px 16px #00000014;--rc-space-xs:2px;--rc-space-sm:4px;--rc-space-md:10px;--rc-space-lg:16px;--rc-space-xl:20px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:14px;--rc-font-size-small:12px;--rc-line-height:1.5;--rc-line-height-tight:1.3;--rc-font-family:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm:3px;--rc-radius-md:6px;--rc-radius-lg:12px}.dark .axx50,[data-theme=dark] .axx50,.dark.axx50,[data-theme=dark].axx50,.dark .axx51,[data-theme=dark] .axx51,.dark.axx51,[data-theme=dark].axx51,.dark .axx52,[data-theme=dark] .axx52,.dark.axx52,[data-theme=dark].axx52{--rc-text:#fafafa;--rc-text-secondary:#a1a1aa;--rc-text-tertiary:#71717a;--rc-text-quaternary:#52525b;--rc-bg:#09090b;--rc-bg-secondary:#18181b;--rc-bg-tertiary:#27272a;--rc-fill:#2a2a2f;--rc-fill-secondary:#222226;--rc-fill-tertiary:#1b1b1f;--rc-fill-quaternary:#131316;--rc-border:#27272a;--rc-accent:#60a5fa;--rc-accent-light:#60a5fa20;--rc-link:#60a5fa;--rc-code-text:#e4e4e7;--rc-code-bg:#27272a;--rc-hr-border:#27272a;--rc-quote-border:#60a5fa;--rc-quote-bg:#1e3a5f;--rc-alert-info:#7db9e5;--rc-alert-warning:#da864a;--rc-alert-tip:#54da48;--rc-alert-caution:#e16973;--rc-alert-important:#9966e0;--rc-shadow-top-bar:0 8px 30px #00000073, 0 2px 8px #0000004d;--rc-shadow-modal:0 10px 15px -3px #0006, 0 4px 6px -4px #00000059;--rc-shadow-menu:0 1px 4px #00000040, 0 4px 16px #0006}._1pn9r4q0{--rr-code-accent:#737373;font-size:var(--rc-font-size-md);font-family:var(--rc-font-mono);border-radius:.5rem;margin:1.5rem 0;position:relative;overflow:hidden}._1pn9r4q1{-webkit-appearance:none;appearance:none;color:inherit;font:inherit;opacity:1;background:0 0;border:none;outline:none;width:8em;padding:0}._1pn9r4q1::placeholder{opacity:.5}._1pn9r4q2{z-index:1;font-size:var(--rc-font-size-md);opacity:.6;pointer-events:none;align-items:center;gap:.375rem;display:flex;position:absolute;bottom:.75rem;right:.75rem}._1pn9r4q2:has(._1pn9r4q1){pointer-events:auto}._1pn9r4q3{flex-shrink:0;display:inline-flex}._1pn9r4q3 svg{width:100%;height:100%}._1pn9r4q4{-webkit-appearance:none;appearance:none;z-index:3;border:1px solid color-mix(in srgb, var(--rr-code-accent) 5%, transparent);background:color-mix(in srgb, var(--rr-code-accent) 80%, transparent);color:#fff;cursor:pointer;opacity:0;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:.375rem;justify-content:center;align-items:center;padding:.375rem;transition:opacity .2s;display:flex;position:absolute;top:.5rem;right:.5rem}._1pn9r4q0:hover ._1pn9r4q4{opacity:1}._1pn9r4q5{background:color-mix(in srgb, var(--rr-code-accent) 5%, transparent);padding:0;position:relative}._1pn9r4q6{width:100%;position:relative;overflow:auto}._1pn9r4q7{max-height:50vh;overflow:hidden}._1pn9r4q8{position:relative;overflow:auto;background-color:#0000!important}._1pn9r4q8 .cm-editor{color:var(--rc-text);font-family:var(--rc-font-mono);background:0 0}._1pn9r4q8 .cm-scroller{line-height:1.6;font-family:var(--rc-font-mono)!important}._1pn9r4q8 .cm-content{min-height:1.6em;padding:0 1.25rem}._1pn9r4q8:has(.cm-gutters) .cm-content{padding-left:.5rem;padding-right:1.25rem}._1pn9r4q8 .cm-line{padding:0}._1pn9r4q8 .cm-gutters{border-right:none;padding-left:1.25rem}._1pn9r4q8 .cm-lineNumbers .cm-gutterElement{text-align:right;min-width:3em;padding-right:2em;color:color-mix(in srgb, var(--rc-text-secondary) 40%, transparent)!important}._1pn9r4q8>.shikicode.output{position:static!important;top:auto!important;bottom:auto!important;left:auto!important;right:auto!important}._1pn9r4q9>textarea.shikicode{display:none}._1pn9r4qa{background:linear-gradient(to bottom, transparent 0%, var(--bg,var(--rc-bg-secondary)) 80%);pointer-events:none;justify-content:center;padding:.5rem 0 .75rem;display:flex;position:absolute;bottom:0;left:0;right:0}._1pn9r4qb{-webkit-appearance:none;appearance:none;cursor:pointer;font-size:var(--rc-font-size-xs);color:inherit;opacity:.7;pointer-events:auto;background:0 0;border:none;align-items:center;gap:.5rem;display:flex}._1pn9r4qb:hover{opacity:1}._1pn9r4q0 .shikicode.input,._1pn9r4q0 .shikicode.output,._1pn9r4q0 .shikicode.output code,._1pn9r4q0 .shikicode.output .line,._1pn9r4q0 .shikicode.output .line span{font-variant-ligatures:none;font-kerning:none}._1pn9r4q0 .shikicode.input,._1pn9r4q0 .shikicode.output,._1pn9r4q8 pre,._1pn9r4q8 code,._1pn9r4q8 .line,._1pn9r4q8 .line span{font-family:var(--rc-font-mono)!important}._1pn9r4q0 pre{border-radius:0;font-size:1em;margin:0!important;padding:0!important}._1pn9r4q0 pre code{flex-direction:column;display:flex;font-family:var(--rc-font-mono)!important}._1pn9r4q0 .shiki,._1pn9r4q0 code,._1pn9r4q0 pre{background:0 0!important}[data-theme=dark] ._1pn9r4q0 .shiki-themes,[data-theme=dark] ._1pn9r4q0 .shiki-themes span{color:var(--shiki-dark)!important;font-style:var(--shiki-dark-font-style)!important;font-weight:var(--shiki-dark-font-weight)!important;-webkit-text-decoration:var(--shiki-dark-text-decoration)!important;text-decoration:var(--shiki-dark-text-decoration)!important}._1pn9r4q8:has(.shikicode.input.line-numbers) .shikicode.output .line:before{width:5em;padding-right:2em;color:color-mix(in srgb, var(--rc-text-secondary) 40%, transparent)!important;background-color:#0000!important}._1pn9r4q8:not(:has(.shikicode.input.line-numbers)) .shikicode.output .line:before{display:none}._1pn9r4q0 .line{padding:0 1.25rem;display:block}._1pn9r4q0 .shikicode.input.line-numbers{padding-left:calc(5em + 1.25rem)}._1pn9r4q0 .shikicode.input:not(.line-numbers){padding-left:1.25rem}._1pn9r4q0 .line>span:last-child{margin-right:1.25rem}._1pn9r4q0 .line:after{content:" "}._1pn9r4q0 .highlighted,._1pn9r4q0 .diff{overflow-wrap:break-word;position:relative}._1pn9r4q0 .highlighted:before,._1pn9r4q0 .diff:before{content:"";width:2px;height:100%;position:absolute;top:0;left:0}._1pn9r4q0 .highlighted{background:color-mix(in srgb, var(--rr-code-accent) 20%, transparent)}._1pn9r4q0 .highlighted:before{background:var(--rr-code-accent)}._1pn9r4q0 .diff.add{background:#22c55e26}._1pn9r4q0 .diff.add:before{background:#22c55e}._1pn9r4q0 .diff.add:after{content:" +";color:#22c55e;position:absolute;left:0}._1pn9r4q0 .diff.remove{background:#ef444426}._1pn9r4q0 .diff.remove:before{background:#ef4444}._1pn9r4q0 .diff.remove:after{content:" -";color:#ef4444;position:absolute;left:0}._1pn9r4qc{counter-reset:shiki-line 0}._1pn9r4qc .line{counter-increment:shiki-line 1}._1pn9r4qc .line:before{content:counter(shiki-line);color:#0000;text-align:right;box-sizing:border-box;width:2em;display:inline-block;position:sticky;left:0}._1pn9r4qd .line:before{color:inherit;opacity:.4;width:5em;padding-right:2em}._1pn9r4q6 pre::-webkit-scrollbar-track{margin-left:1rem;margin-right:var(--sr-margin,0)}._1pn9r4q6 pre::-webkit-scrollbar{background-color:#0000!important}._1pn9r4qe{font-family:var(--rc-font-mono);font-size:var(--rc-font-size-md);background-color:var(--rc-code-bg);border-radius:var(--rc-radius-md);margin:var(--rc-space-md) 0;border:1px solid var(--rc-border);overflow:hidden}._1pn9r4qf{padding:var(--rc-space-sm) var(--rc-space-md);border-bottom:1px solid var(--rc-border);font-size:var(--rc-font-size-md);color:var(--rc-text-secondary);-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;display:flex}._1pn9r4qg{font-family:var(--rc-font-mono);text-transform:uppercase;letter-spacing:.05em;font-size:.85em}._1pn9r4qh{-webkit-appearance:none;appearance:none;color:var(--rc-text-secondary);cursor:pointer;padding:var(--rc-space-xs) var(--rc-space-sm);border-radius:var(--rc-radius-sm);font-family:var(--rc-font-family);font-size:var(--rc-font-size-md);background:0 0;border:none;line-height:1;transition:color .15s,background-color .15s}.rich-code-block{font-family:var(--rc-font-mono);font-size:var(--rc-font-size-md);background-color:var(--rc-code-bg);border-radius:var(--rc-radius-md);margin:var(--rc-space-md) 0;border:1px solid var(--rc-border);overflow:hidden}.rich-code-block pre{padding:var(--rc-space-md);margin:0;overflow-x:auto}.rich-code-block code{font-family:inherit;font-size:inherit;color:inherit;background:0 0;border:none;padding:0}.rich-code-block-header{padding:var(--rc-space-sm) var(--rc-space-md);border-bottom:1px solid var(--rc-border);font-size:var(--rc-font-size-md);color:var(--rc-text-secondary);-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;display:flex}.rich-code-block-lang{font-family:var(--rc-font-mono);text-transform:uppercase;letter-spacing:.05em;font-size:.85em}.rich-code-block-copy{-webkit-appearance:none;appearance:none;color:var(--rc-text-secondary);cursor:pointer;padding:var(--rc-space-xs) var(--rc-space-sm);border-radius:var(--rc-radius-sm);font-family:var(--rc-font-family);font-size:var(--rc-font-size-md);background:0 0;border:none;line-height:1;transition:color .15s,background-color .15s}.rich-code-block-copy:hover{color:var(--rc-text);background-color:var(--rc-fill-secondary)}.rich-code-block-numbered pre{counter-reset:line}.rich-code-block-numbered .line{counter-increment:line}.rich-code-block-numbered .line:before{content:counter(line);width:2.5em;margin-right:var(--rc-space-md);text-align:right;opacity:.4;-webkit-user-select:none;user-select:none;font-size:var(--rc-font-size-md);display:inline-block;color:color-mix(in srgb, var(--rc-text-secondary) 40%, transparent)!important}
|
|
2
|
-
/*$vite$:1*/
|
|
1
|
+
:root{--rc-text: #000;--rc-text-secondary: #27272a;--rc-text-tertiary: #71717a;--rc-text-quaternary: #a1a1aa;--rc-bg: #ffffff;--rc-bg-secondary: #fafafa;--rc-bg-tertiary: #f4f4f5;--rc-fill: #e8e8ec;--rc-fill-secondary: #eeeeef;--rc-fill-tertiary: #f4f4f6;--rc-fill-quaternary: #f9f9fa;--rc-border: #f4f4f5;--rc-accent: #2563eb;--rc-accent-light: #2563eb20;--rc-link: #2563eb;--rc-code-text: #3f3f46;--rc-code-bg: #f4f4f5;--rc-hr-border: #e4e4e7;--rc-quote-border: #2563eb;--rc-quote-bg: #eff6ff;--rc-alert-info: #006bb7;--rc-alert-warning: #cc5500;--rc-alert-tip: #11cc00;--rc-alert-caution: #cc0011;--rc-alert-important: #5500cc;--rc-max-width: 700px;--rc-shadow-top-bar: 0 8px 30px rgba(0, 0, 0, .12), 0 2px 8px rgba(0, 0, 0, .06);--rc-shadow-modal: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1);--rc-shadow-menu: 0 1px 4px rgba(0,0,0,.04), 0 4px 16px rgba(0,0,0,.08);--rc-space-xs: 4px;--rc-space-sm: 8px;--rc-space-md: 16px;--rc-space-lg: 24px;--rc-space-xl: 32px;--rc-font-family-sans: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono: "SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs: .625em;--rc-font-size-xs: .75em;--rc-font-size-sm: .8125em;--rc-font-size-md: .875em;--rc-font-size-lg: 1.25em;--rc-font-size-base: 16px;--rc-font-size-small: 14px;--rc-line-height: 1.7;--rc-line-height-tight: 1.4;--rc-font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm: 4px;--rc-radius-md: 8px;--rc-radius-lg: 12px}:root.dark{--rc-text: #fafafa;--rc-text-secondary: #a1a1aa;--rc-text-tertiary: #71717a;--rc-text-quaternary: #52525b;--rc-bg: #09090b;--rc-bg-secondary: #18181b;--rc-bg-tertiary: #27272a;--rc-fill: #2a2a2f;--rc-fill-secondary: #222226;--rc-fill-tertiary: #1b1b1f;--rc-fill-quaternary: #131316;--rc-border: #27272a;--rc-accent: #60a5fa;--rc-accent-light: #60a5fa20;--rc-link: #60a5fa;--rc-code-text: #e4e4e7;--rc-code-bg: #27272a;--rc-hr-border: #27272a;--rc-quote-border: #60a5fa;--rc-quote-bg: #1e3a5f;--rc-alert-info: #7db9e5;--rc-alert-warning: #da864a;--rc-alert-tip: #54da48;--rc-alert-caution: #e16973;--rc-alert-important: #9966e0;--rc-max-width: 700px;--rc-shadow-top-bar: 0 8px 30px rgba(0, 0, 0, .45), 0 2px 8px rgba(0, 0, 0, .3);--rc-shadow-modal: 0 10px 15px -3px rgba(0,0,0,.4), 0 4px 6px -4px rgba(0,0,0,.35);--rc-shadow-menu: 0 1px 4px rgba(0,0,0,.25), 0 4px 16px rgba(0,0,0,.4);--rc-space-xs: 4px;--rc-space-sm: 8px;--rc-space-md: 16px;--rc-space-lg: 24px;--rc-space-xl: 32px;--rc-font-family-sans: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono: "SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs: .625em;--rc-font-size-xs: .75em;--rc-font-size-sm: .8125em;--rc-font-size-md: .875em;--rc-font-size-lg: 1.25em;--rc-font-size-base: 16px;--rc-font-size-small: 14px;--rc-line-height: 1.7;--rc-line-height-tight: 1.4;--rc-font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm: 4px;--rc-radius-md: 8px;--rc-radius-lg: 12px}.axx50{--rc-text: #000;--rc-text-secondary: #27272a;--rc-text-tertiary: #71717a;--rc-text-quaternary: #a1a1aa;--rc-bg: #ffffff;--rc-bg-secondary: #fafafa;--rc-bg-tertiary: #f4f4f5;--rc-fill: #e8e8ec;--rc-fill-secondary: #eeeeef;--rc-fill-tertiary: #f4f4f6;--rc-fill-quaternary: #f9f9fa;--rc-border: #f4f4f5;--rc-accent: #2563eb;--rc-accent-light: #2563eb20;--rc-link: #2563eb;--rc-code-text: #3f3f46;--rc-code-bg: #f4f4f5;--rc-hr-border: #e4e4e7;--rc-quote-border: #2563eb;--rc-quote-bg: #eff6ff;--rc-alert-info: #006bb7;--rc-alert-warning: #cc5500;--rc-alert-tip: #11cc00;--rc-alert-caution: #cc0011;--rc-alert-important: #5500cc;--rc-max-width: 700px;--rc-shadow-top-bar: 0 8px 30px rgba(0, 0, 0, .12), 0 2px 8px rgba(0, 0, 0, .06);--rc-shadow-modal: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1);--rc-shadow-menu: 0 1px 4px rgba(0,0,0,.04), 0 4px 16px rgba(0,0,0,.08);--rc-space-xs: 4px;--rc-space-sm: 8px;--rc-space-md: 16px;--rc-space-lg: 24px;--rc-space-xl: 32px;--rc-font-family-sans: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono: "SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs: .625em;--rc-font-size-xs: .75em;--rc-font-size-sm: .8125em;--rc-font-size-md: .875em;--rc-font-size-lg: 1.25em;--rc-font-size-base: 16px;--rc-font-size-small: 14px;--rc-line-height: 1.7;--rc-line-height-tight: 1.4;--rc-font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm: 4px;--rc-radius-md: 8px;--rc-radius-lg: 12px}.axx51{--rc-text: #000;--rc-text-secondary: #27272a;--rc-text-tertiary: #71717a;--rc-text-quaternary: #a1a1aa;--rc-bg: #ffffff;--rc-bg-secondary: #fafafa;--rc-bg-tertiary: #f4f4f5;--rc-fill: #e8e8ec;--rc-fill-secondary: #eeeeef;--rc-fill-tertiary: #f4f4f6;--rc-fill-quaternary: #f9f9fa;--rc-border: #f4f4f5;--rc-accent: #2563eb;--rc-accent-light: #2563eb20;--rc-link: #2563eb;--rc-code-text: #3f3f46;--rc-code-bg: #f4f4f5;--rc-hr-border: #e4e4e7;--rc-quote-border: #2563eb;--rc-quote-bg: #eff6ff;--rc-alert-info: #006bb7;--rc-alert-warning: #cc5500;--rc-alert-tip: #11cc00;--rc-alert-caution: #cc0011;--rc-alert-important: #5500cc;--rc-max-width: 700px;--rc-shadow-top-bar: 0 8px 30px rgba(0, 0, 0, .12), 0 2px 8px rgba(0, 0, 0, .06);--rc-shadow-modal: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1);--rc-shadow-menu: 0 1px 4px rgba(0,0,0,.04), 0 4px 16px rgba(0,0,0,.08);--rc-space-xs: 4px;--rc-space-sm: 8px;--rc-space-md: 16px;--rc-space-lg: 24px;--rc-space-xl: 32px;--rc-font-family-sans: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono: "SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs: .625em;--rc-font-size-xs: .75em;--rc-font-size-sm: .8125em;--rc-font-size-md: .875em;--rc-font-size-lg: 1.25em;--rc-font-size-base: 16px;--rc-font-size-small: 14px;--rc-line-height: 1.8;--rc-line-height-tight: 1.4;--rc-font-family: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-radius-sm: 4px;--rc-radius-md: 8px;--rc-radius-lg: 12px}.axx52{--rc-text: #000;--rc-text-secondary: #27272a;--rc-text-tertiary: #71717a;--rc-text-quaternary: #a1a1aa;--rc-bg: #ffffff;--rc-bg-secondary: #fafafa;--rc-bg-tertiary: #f4f4f5;--rc-fill: #e8e8ec;--rc-fill-secondary: #eeeeef;--rc-fill-tertiary: #f4f4f6;--rc-fill-quaternary: #f9f9fa;--rc-border: #f4f4f5;--rc-accent: #2563eb;--rc-accent-light: #2563eb20;--rc-link: #2563eb;--rc-code-text: #3f3f46;--rc-code-bg: #f4f4f5;--rc-hr-border: #e4e4e7;--rc-quote-border: #a1a1aa;--rc-quote-bg: #fafafa;--rc-alert-info: #006bb7;--rc-alert-warning: #cc5500;--rc-alert-tip: #11cc00;--rc-alert-caution: #cc0011;--rc-alert-important: #5500cc;--rc-max-width: none;--rc-shadow-top-bar: 0 8px 30px rgba(0, 0, 0, .12), 0 2px 8px rgba(0, 0, 0, .06);--rc-shadow-modal: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1);--rc-shadow-menu: 0 1px 4px rgba(0,0,0,.04), 0 4px 16px rgba(0,0,0,.08);--rc-space-xs: 2px;--rc-space-sm: 4px;--rc-space-md: 10px;--rc-space-lg: 16px;--rc-space-xl: 20px;--rc-font-family-sans: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono: "SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs: .625em;--rc-font-size-xs: .75em;--rc-font-size-sm: .8125em;--rc-font-size-md: .875em;--rc-font-size-lg: 1.25em;--rc-font-size-base: 14px;--rc-font-size-small: 12px;--rc-line-height: 1.5;--rc-line-height-tight: 1.3;--rc-font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm: 3px;--rc-radius-md: 6px;--rc-radius-lg: 12px}.dark .axx50,[data-theme=dark] .axx50,.dark.axx50,[data-theme=dark].axx50,.dark .axx51,[data-theme=dark] .axx51,.dark.axx51,[data-theme=dark].axx51,.dark .axx52,[data-theme=dark] .axx52,.dark.axx52,[data-theme=dark].axx52{--rc-text: #fafafa;--rc-text-secondary: #a1a1aa;--rc-text-tertiary: #71717a;--rc-text-quaternary: #52525b;--rc-bg: #09090b;--rc-bg-secondary: #18181b;--rc-bg-tertiary: #27272a;--rc-fill: #2a2a2f;--rc-fill-secondary: #222226;--rc-fill-tertiary: #1b1b1f;--rc-fill-quaternary: #131316;--rc-border: #27272a;--rc-accent: #60a5fa;--rc-accent-light: #60a5fa20;--rc-link: #60a5fa;--rc-code-text: #e4e4e7;--rc-code-bg: #27272a;--rc-hr-border: #27272a;--rc-quote-border: #60a5fa;--rc-quote-bg: #1e3a5f;--rc-alert-info: #7db9e5;--rc-alert-warning: #da864a;--rc-alert-tip: #54da48;--rc-alert-caution: #e16973;--rc-alert-important: #9966e0;--rc-shadow-top-bar: 0 8px 30px rgba(0, 0, 0, .45), 0 2px 8px rgba(0, 0, 0, .3);--rc-shadow-modal: 0 10px 15px -3px rgba(0,0,0,.4), 0 4px 6px -4px rgba(0,0,0,.35);--rc-shadow-menu: 0 1px 4px rgba(0,0,0,.25), 0 4px 16px rgba(0,0,0,.4)}._1pn9r4q0{--rr-code-accent: #737373;position:relative;margin:1.5rem 0;border-radius:.5rem;overflow:hidden;font-size:var(--rc-font-size-md);font-family:var(--rc-font-mono)}._1pn9r4q1{appearance:none;border:none;background:transparent;color:inherit;font:inherit;padding:0;outline:none;width:8em;opacity:1}._1pn9r4q1::placeholder{opacity:.5}._1pn9r4q2{position:absolute;bottom:.75rem;right:.75rem;z-index:1;display:flex;align-items:center;gap:.375rem;font-size:var(--rc-font-size-md);opacity:.6;pointer-events:none}._1pn9r4q2:has(._1pn9r4q1){pointer-events:auto}._1pn9r4q3{display:inline-flex;flex-shrink:0}._1pn9r4q3 svg{width:100%;height:100%}._1pn9r4q4{appearance:none;position:absolute;right:.5rem;top:.5rem;z-index:3;display:flex;align-items:center;justify-content:center;padding:.375rem;border-radius:.375rem;border:1px solid color-mix(in srgb,var(--rr-code-accent) 5%,transparent);background:color-mix(in srgb,var(--rr-code-accent) 80%,transparent);color:#fff;cursor:pointer;opacity:0;transition:opacity .2s ease;backdrop-filter:blur(8px)}._1pn9r4q0:hover ._1pn9r4q4{opacity:1}._1pn9r4q5{position:relative;background:color-mix(in srgb,var(--rr-code-accent) 5%,transparent);padding:0}._1pn9r4q6{position:relative;width:100%;overflow:auto}._1pn9r4q7{max-height:50vh;overflow:hidden}._1pn9r4q8{position:relative;overflow:auto;background-color:transparent!important}._1pn9r4q8 .cm-editor{background:transparent;color:var(--rc-text);font-family:var(--rc-font-mono)}._1pn9r4q8 .cm-scroller{font-family:var(--rc-font-mono)!important;line-height:1.6}._1pn9r4q8 .cm-content{padding-top:0;padding-bottom:0;padding-left:1.25rem;padding-right:1.25rem;min-height:1.6em}._1pn9r4q8:has(.cm-gutters) .cm-content{padding-left:.5rem;padding-right:1.25rem}._1pn9r4q8 .cm-line{padding:0}._1pn9r4q8 .cm-gutters{border-right:none;padding-left:1.25rem}._1pn9r4q8 .cm-lineNumbers .cm-gutterElement{min-width:3em;text-align:right;padding-right:2em;color:color-mix(in srgb,var(--rc-text-secondary) 40%,transparent)!important}._1pn9r4q8>.shikicode.output{position:static!important;inset:auto!important}._1pn9r4q9>textarea.shikicode{display:none}._1pn9r4qa{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:center;padding:.5rem 0 .75rem;background:linear-gradient(to bottom,transparent 0%,var(--bg, var(--rc-bg-secondary)) 80%);pointer-events:none}._1pn9r4qb{appearance:none;border:none;background:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;font-size:var(--rc-font-size-xs);color:inherit;opacity:.7;pointer-events:auto}._1pn9r4qb:hover{opacity:1}._1pn9r4q0 .shikicode.input,._1pn9r4q0 .shikicode.output,._1pn9r4q0 .shikicode.output code,._1pn9r4q0 .shikicode.output .line,._1pn9r4q0 .shikicode.output .line span{font-variant-ligatures:none;font-kerning:none}._1pn9r4q0 .shikicode.input,._1pn9r4q0 .shikicode.output,._1pn9r4q8 pre,._1pn9r4q8 code,._1pn9r4q8 .line,._1pn9r4q8 .line span{font-family:var(--rc-font-mono)!important}._1pn9r4q0 pre{margin:0!important;padding:0!important;border-radius:0;font-size:1em}._1pn9r4q0 pre code{display:flex;flex-direction:column;font-family:var(--rc-font-mono)!important}._1pn9r4q0 .shiki,._1pn9r4q0 code,._1pn9r4q0 pre{background:transparent!important}[data-theme=dark] ._1pn9r4q0 .shiki-themes,[data-theme=dark] ._1pn9r4q0 .shiki-themes span{color:var(--shiki-dark)!important;font-style:var(--shiki-dark-font-style)!important;font-weight:var(--shiki-dark-font-weight)!important;text-decoration:var(--shiki-dark-text-decoration)!important}._1pn9r4q8:has(.shikicode.input.line-numbers) .shikicode.output .line:before{background-color:transparent!important;color:color-mix(in srgb,var(--rc-text-secondary) 40%,transparent)!important;width:5em;padding-right:2em}._1pn9r4q8:not(:has(.shikicode.input.line-numbers)) .shikicode.output .line:before{display:none}._1pn9r4q0 .line{display:block;padding:0 1.25rem}._1pn9r4q0 .shikicode.input.line-numbers{padding-left:calc(5em + 1.25rem)}._1pn9r4q0 .shikicode.input:not(.line-numbers){padding-left:1.25rem}._1pn9r4q0 .line>span:last-child{margin-right:1.25rem}._1pn9r4q0 .line:after{content:" "}._1pn9r4q0 .highlighted,._1pn9r4q0 .diff{position:relative;overflow-wrap:break-word}._1pn9r4q0 .highlighted:before,._1pn9r4q0 .diff:before{content:"";position:absolute;left:0;top:0;height:100%;width:2px}._1pn9r4q0 .highlighted{background:color-mix(in srgb,var(--rr-code-accent) 20%,transparent)}._1pn9r4q0 .highlighted:before{background:var(--rr-code-accent)}._1pn9r4q0 .diff.add{background:#22c55e26}._1pn9r4q0 .diff.add:before{background:#22c55e}._1pn9r4q0 .diff.add:after{content:" +";position:absolute;left:0;color:#22c55e}._1pn9r4q0 .diff.remove{background:#ef444426}._1pn9r4q0 .diff.remove:before{background:#ef4444}._1pn9r4q0 .diff.remove:after{content:" -";position:absolute;left:0;color:#ef4444}._1pn9r4qc{counter-reset:shiki-line 0}._1pn9r4qc .line{counter-increment:shiki-line 1}._1pn9r4qc .line:before{content:counter(shiki-line);color:transparent;text-align:right;box-sizing:border-box;width:2em;display:inline-block;position:sticky;left:0}._1pn9r4qd .line:before{color:inherit;opacity:.4;width:5em;padding-right:2em}._1pn9r4q6 pre::-webkit-scrollbar-track{margin-left:1rem;margin-right:var(--sr-margin, 0)}._1pn9r4q6 pre::-webkit-scrollbar{background-color:transparent!important}._1pn9r4qe{font-family:var(--rc-font-mono);font-size:var(--rc-font-size-md);background-color:var(--rc-code-bg);border-radius:var(--rc-radius-md);overflow:hidden;margin:var(--rc-space-md) 0;border:1px solid var(--rc-border)}._1pn9r4qf{display:flex;align-items:center;justify-content:space-between;padding:var(--rc-space-sm) var(--rc-space-md);border-bottom:1px solid var(--rc-border);font-size:var(--rc-font-size-md);color:var(--rc-text-secondary);user-select:none}._1pn9r4qg{font-family:var(--rc-font-mono);font-size:.85em;text-transform:uppercase;letter-spacing:.05em}._1pn9r4qh{appearance:none;border:none;background:none;color:var(--rc-text-secondary);cursor:pointer;padding:var(--rc-space-xs) var(--rc-space-sm);border-radius:var(--rc-radius-sm);font-family:var(--rc-font-family);font-size:var(--rc-font-size-md);line-height:1;transition:color .15s ease,background-color .15s ease}.rich-code-block{font-family:var(--rc-font-mono);font-size:var(--rc-font-size-md);background-color:var(--rc-code-bg);border-radius:var(--rc-radius-md);overflow:hidden;margin:var(--rc-space-md) 0;border:1px solid var(--rc-border)}.rich-code-block pre{margin:0;padding:var(--rc-space-md);overflow-x:auto}.rich-code-block code{font-family:inherit;font-size:inherit;background:none;border:none;padding:0;color:inherit}.rich-code-block-header{display:flex;align-items:center;justify-content:space-between;padding:var(--rc-space-sm) var(--rc-space-md);border-bottom:1px solid var(--rc-border);font-size:var(--rc-font-size-md);color:var(--rc-text-secondary);user-select:none}.rich-code-block-lang{font-family:var(--rc-font-mono);font-size:.85em;text-transform:uppercase;letter-spacing:.05em}.rich-code-block-copy{appearance:none;border:none;background:none;color:var(--rc-text-secondary);cursor:pointer;padding:var(--rc-space-xs) var(--rc-space-sm);border-radius:var(--rc-radius-sm);font-family:var(--rc-font-family);font-size:var(--rc-font-size-md);line-height:1;transition:color .15s ease,background-color .15s ease}.rich-code-block-copy:hover{color:var(--rc-text);background-color:var(--rc-fill-secondary)}.rich-code-block-numbered pre{counter-reset:line}.rich-code-block-numbered .line{counter-increment:line}.rich-code-block-numbered .line:before{content:counter(line);display:inline-block;width:2.5em;margin-right:var(--rc-space-md);text-align:right;color:color-mix(in srgb,var(--rc-text-secondary) 40%,transparent)!important;opacity:.4;user-select:none;font-size:var(--rc-font-size-md)}
|
package/dist/shiki.mjs
CHANGED
|
@@ -1,24 +1,33 @@
|
|
|
1
|
-
|
|
2
|
-
var highlighterPromise = null;
|
|
1
|
+
let highlighterPromise = null;
|
|
3
2
|
function getHighlighter() {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
3
|
+
if (!highlighterPromise) {
|
|
4
|
+
highlighterPromise = import("shiki/bundle/web").then(
|
|
5
|
+
(mod) => mod.createHighlighter({
|
|
6
|
+
langs: [],
|
|
7
|
+
themes: ["github-light", "github-dark"]
|
|
8
|
+
})
|
|
9
|
+
);
|
|
10
|
+
}
|
|
11
|
+
return highlighterPromise;
|
|
9
12
|
}
|
|
10
13
|
async function getHighlighterWithLang(language) {
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
14
|
+
const highlighter = await getHighlighter();
|
|
15
|
+
if (language && language !== "text" && language !== "plaintext") {
|
|
16
|
+
const loaded = highlighter.getLoadedLanguages();
|
|
17
|
+
if (!loaded.includes(language)) {
|
|
18
|
+
try {
|
|
19
|
+
await highlighter.loadLanguage(language);
|
|
20
|
+
} catch {
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
return highlighter;
|
|
18
25
|
}
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
26
|
+
const SHIKI_DUAL_THEMES = {
|
|
27
|
+
light: "github-light",
|
|
28
|
+
dark: "github-dark"
|
|
29
|
+
};
|
|
30
|
+
export {
|
|
31
|
+
SHIKI_DUAL_THEMES,
|
|
32
|
+
getHighlighterWithLang
|
|
22
33
|
};
|
|
23
|
-
//#endregion
|
|
24
|
-
export { SHIKI_DUAL_THEMES, getHighlighterWithLang };
|
package/dist/static.mjs
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
-
import "./
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
import { C } from "./CodeBlockRenderer-DSXP75Xm.js";
|
|
2
|
+
export {
|
|
3
|
+
C as CodeBlockRenderer
|
|
4
|
+
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@haklex/rich-renderer-codeblock",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.83",
|
|
4
4
|
"description": "Code block renderer with Shiki syntax highlighting",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -44,10 +44,10 @@
|
|
|
44
44
|
"@iconify/utils": "^3.1.0",
|
|
45
45
|
"lucide-react": "^0.577.0",
|
|
46
46
|
"shiki": "^4.0.1",
|
|
47
|
-
"@haklex/cm-editor": "0.0.
|
|
48
|
-
"@haklex/rich-editor": "0.0.
|
|
49
|
-
"@haklex/rich-editor-ui": "0.0.
|
|
50
|
-
"@haklex/rich-style-token": "0.0.
|
|
47
|
+
"@haklex/cm-editor": "0.0.83",
|
|
48
|
+
"@haklex/rich-editor": "0.0.83",
|
|
49
|
+
"@haklex/rich-editor-ui": "0.0.83",
|
|
50
|
+
"@haklex/rich-style-token": "0.0.83"
|
|
51
51
|
},
|
|
52
52
|
"devDependencies": {
|
|
53
53
|
"@types/react": "^19.2.14",
|
|
@@ -1,134 +0,0 @@
|
|
|
1
|
-
import { getLanguageDisplayName, languageToColorMap, normalizeLanguage } from "./constants.mjs";
|
|
2
|
-
import { _ as semanticClassNames, a as bodyBackground, c as copyButton, h as scroll, n as LanguageIcon, r as hasLanguageIcon, s as card } from "./icons-CnFW5y6g.js";
|
|
3
|
-
import { SHIKI_DUAL_THEMES, getHighlighterWithLang } from "./shiki.mjs";
|
|
4
|
-
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
|
|
5
|
-
import { Check, ChevronDown, Copy } from "lucide-react";
|
|
6
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
|
-
//#region src/CodeBlockCard.tsx
|
|
8
|
-
var CopyIcon = /* @__PURE__ */ jsx(Copy, { size: 16 });
|
|
9
|
-
var CheckIcon = /* @__PURE__ */ jsx(Check, { size: 16 });
|
|
10
|
-
var ExpandIcon = /* @__PURE__ */ jsx(ChevronDown, { size: 14 });
|
|
11
|
-
function CodeBlockCard({ code, language, collapsible = true, langSlot, children }) {
|
|
12
|
-
const normalizedLanguage = normalizeLanguage(language);
|
|
13
|
-
const [copied, setCopied] = useState(false);
|
|
14
|
-
const copyTimerRef = useRef(void 0);
|
|
15
|
-
const [isCollapsed, setIsCollapsed] = useState(true);
|
|
16
|
-
const [isOverflow, setIsOverflow] = useState(false);
|
|
17
|
-
const scrollRef = useRef(null);
|
|
18
|
-
useEffect(() => {
|
|
19
|
-
if (!collapsible) {
|
|
20
|
-
setIsOverflow(false);
|
|
21
|
-
return;
|
|
22
|
-
}
|
|
23
|
-
const el = scrollRef.current;
|
|
24
|
-
if (!el) return;
|
|
25
|
-
const check = () => {
|
|
26
|
-
const halfVh = window.innerHeight / 2;
|
|
27
|
-
setIsOverflow(el.scrollHeight >= halfVh);
|
|
28
|
-
};
|
|
29
|
-
const raf = requestAnimationFrame(check);
|
|
30
|
-
return () => cancelAnimationFrame(raf);
|
|
31
|
-
}, [code, collapsible]);
|
|
32
|
-
useEffect(() => {
|
|
33
|
-
return () => clearTimeout(copyTimerRef.current);
|
|
34
|
-
}, []);
|
|
35
|
-
const handleCopy = useCallback(() => {
|
|
36
|
-
navigator.clipboard.writeText(code).then(() => {
|
|
37
|
-
setCopied(true);
|
|
38
|
-
clearTimeout(copyTimerRef.current);
|
|
39
|
-
copyTimerRef.current = setTimeout(() => setCopied(false), 2e3);
|
|
40
|
-
}).catch(() => {});
|
|
41
|
-
}, [code]);
|
|
42
|
-
const languageLabel = getLanguageDisplayName(normalizedLanguage);
|
|
43
|
-
const accent = languageToColorMap[normalizedLanguage] || "#737373";
|
|
44
|
-
const cardStyle = useMemo(() => ({ "--rr-code-accent": accent }), [accent]);
|
|
45
|
-
const scrollClassName = [
|
|
46
|
-
scroll,
|
|
47
|
-
semanticClassNames.scroll,
|
|
48
|
-
collapsible && isCollapsed && isOverflow && "_1pn9r4q7",
|
|
49
|
-
collapsible && isCollapsed && isOverflow && semanticClassNames.scrollCollapsed
|
|
50
|
-
].filter(Boolean).join(" ");
|
|
51
|
-
return /* @__PURE__ */ jsxs("div", {
|
|
52
|
-
className: `${card} ${semanticClassNames.card}`,
|
|
53
|
-
style: cardStyle,
|
|
54
|
-
children: [
|
|
55
|
-
langSlot ?? (normalizedLanguage !== "text" && /* @__PURE__ */ jsx("div", {
|
|
56
|
-
"aria-hidden": true,
|
|
57
|
-
className: `_1pn9r4q2 ${semanticClassNames.lang}`,
|
|
58
|
-
children: hasLanguageIcon(normalizedLanguage) ? /* @__PURE__ */ jsx(LanguageIcon, {
|
|
59
|
-
language: normalizedLanguage,
|
|
60
|
-
size: 14
|
|
61
|
-
}) : /* @__PURE__ */ jsx("span", { children: languageLabel })
|
|
62
|
-
})),
|
|
63
|
-
/* @__PURE__ */ jsx("button", {
|
|
64
|
-
"aria-label": copied ? "Copied" : "Copy code",
|
|
65
|
-
className: `${copyButton} ${semanticClassNames.copyButton}`,
|
|
66
|
-
type: "button",
|
|
67
|
-
onClick: handleCopy,
|
|
68
|
-
children: copied ? CheckIcon : CopyIcon
|
|
69
|
-
}),
|
|
70
|
-
/* @__PURE__ */ jsxs("div", {
|
|
71
|
-
className: `${bodyBackground} ${semanticClassNames.bodyBackground}`,
|
|
72
|
-
children: [/* @__PURE__ */ jsx("div", {
|
|
73
|
-
className: scrollClassName,
|
|
74
|
-
ref: scrollRef,
|
|
75
|
-
children
|
|
76
|
-
}), collapsible && isOverflow && isCollapsed && /* @__PURE__ */ jsx("div", {
|
|
77
|
-
className: `_1pn9r4qa ${semanticClassNames.expandWrap}`,
|
|
78
|
-
children: /* @__PURE__ */ jsxs("button", {
|
|
79
|
-
className: `_1pn9r4qb ${semanticClassNames.expandButton}`,
|
|
80
|
-
type: "button",
|
|
81
|
-
onClick: () => setIsCollapsed(false),
|
|
82
|
-
children: [ExpandIcon, /* @__PURE__ */ jsx("span", { children: "展开" })]
|
|
83
|
-
})
|
|
84
|
-
})]
|
|
85
|
-
})
|
|
86
|
-
]
|
|
87
|
-
});
|
|
88
|
-
}
|
|
89
|
-
//#endregion
|
|
90
|
-
//#region src/CodeBlockRenderer.tsx
|
|
91
|
-
var CodeBlockRenderer = ({ code, language, showLineNumbers: showLineNumbersProp }) => {
|
|
92
|
-
const showLineNumbers = showLineNumbersProp ?? false;
|
|
93
|
-
const normalizedLanguage = normalizeLanguage(language);
|
|
94
|
-
const [html, setHtml] = useState(null);
|
|
95
|
-
useEffect(() => {
|
|
96
|
-
let cancelled = false;
|
|
97
|
-
(async () => {
|
|
98
|
-
const highlighter = await getHighlighterWithLang(normalizedLanguage);
|
|
99
|
-
if (cancelled) return;
|
|
100
|
-
const lang = highlighter.getLoadedLanguages().includes(normalizedLanguage) ? normalizedLanguage : "text";
|
|
101
|
-
const result = highlighter.codeToHtml(code, {
|
|
102
|
-
lang,
|
|
103
|
-
themes: SHIKI_DUAL_THEMES
|
|
104
|
-
});
|
|
105
|
-
if (!cancelled) setHtml(result);
|
|
106
|
-
})();
|
|
107
|
-
return () => {
|
|
108
|
-
cancelled = true;
|
|
109
|
-
};
|
|
110
|
-
}, [code, normalizedLanguage]);
|
|
111
|
-
const fallbackLines = useMemo(() => code.split("\n"), [code]);
|
|
112
|
-
const linedClassName = [
|
|
113
|
-
showLineNumbers && "_1pn9r4qc",
|
|
114
|
-
showLineNumbers && semanticClassNames.lined,
|
|
115
|
-
showLineNumbers && "_1pn9r4qd",
|
|
116
|
-
showLineNumbers && semanticClassNames.linedWithNumbers
|
|
117
|
-
].filter(Boolean).join(" ");
|
|
118
|
-
return /* @__PURE__ */ jsx(CodeBlockCard, {
|
|
119
|
-
code,
|
|
120
|
-
language,
|
|
121
|
-
children: html ? /* @__PURE__ */ jsx("div", {
|
|
122
|
-
className: linedClassName,
|
|
123
|
-
dangerouslySetInnerHTML: { __html: html }
|
|
124
|
-
}) : /* @__PURE__ */ jsx("pre", {
|
|
125
|
-
className: linedClassName,
|
|
126
|
-
children: /* @__PURE__ */ jsx("code", { children: fallbackLines.map((line, i) => /* @__PURE__ */ jsx("span", {
|
|
127
|
-
className: "line",
|
|
128
|
-
children: line
|
|
129
|
-
}, i)) })
|
|
130
|
-
})
|
|
131
|
-
});
|
|
132
|
-
};
|
|
133
|
-
//#endregion
|
|
134
|
-
export { CodeBlockCard as n, CodeBlockRenderer as t };
|