@codemonster-ru/vue-codeblock 1.0.0 → 1.1.1
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/README.md +15 -1
- package/dist/components/CodeBlock.vue.d.ts +6 -2
- package/dist/index.css +1 -1
- package/dist/index.js +315 -357
- package/dist/index.umd.cjs +9 -9
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -115,13 +115,20 @@ The component ships with light and dark defaults. You can override it with:
|
|
|
115
115
|
|
|
116
116
|
- `theme="light"`
|
|
117
117
|
- `theme="dark"`
|
|
118
|
-
- `theme="inherit"` and
|
|
118
|
+
- `theme="inherit"` and the nearest ancestor theme from `data-theme` or, if absent, `data-vf-theme`
|
|
119
119
|
|
|
120
120
|
Main CSS custom properties:
|
|
121
121
|
|
|
122
122
|
- `--vcb-background-color`
|
|
123
123
|
- `--vcb-text-color`
|
|
124
124
|
- `--vcb-border-color`
|
|
125
|
+
- `--vcb-border-radius`
|
|
126
|
+
- `--vcb-header-background-color`
|
|
127
|
+
- `--vcb-header-border-color`
|
|
128
|
+
- `--vcb-header-padding`
|
|
129
|
+
- `--vcb-code-background-color`
|
|
130
|
+
- `--vcb-action-background-color`
|
|
131
|
+
- `--vcb-action-border-color`
|
|
125
132
|
- `--vcb-padding`
|
|
126
133
|
- `--vcb-font-size`
|
|
127
134
|
- `--vcb-line-height`
|
|
@@ -143,6 +150,13 @@ Example:
|
|
|
143
150
|
}
|
|
144
151
|
```
|
|
145
152
|
|
|
153
|
+
The default styles are tuned to feel closer to a documentation surface:
|
|
154
|
+
|
|
155
|
+
- the outer container stays close to the page background
|
|
156
|
+
- separation comes mostly from border and header chrome
|
|
157
|
+
- the code area does not introduce a heavy extra panel by default
|
|
158
|
+
- light and dark themes follow the same surface logic
|
|
159
|
+
|
|
146
160
|
## Notes
|
|
147
161
|
|
|
148
162
|
- The built-in highlighter is lightweight and regex-based by design.
|
|
@@ -4,7 +4,9 @@ declare function __VLS_template(): {
|
|
|
4
4
|
slots: {
|
|
5
5
|
actions?(_: {}): any;
|
|
6
6
|
};
|
|
7
|
-
refs: {
|
|
7
|
+
refs: {
|
|
8
|
+
rootElement: HTMLElement;
|
|
9
|
+
};
|
|
8
10
|
rootEl: HTMLElement;
|
|
9
11
|
};
|
|
10
12
|
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
@@ -29,7 +31,9 @@ declare const __VLS_component: import('vue').DefineComponent<CodeBlockProps, {},
|
|
|
29
31
|
maxHeight: string;
|
|
30
32
|
ariaLabel: string;
|
|
31
33
|
theme: import('..').CodeBlockTheme;
|
|
32
|
-
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
|
|
34
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
|
|
35
|
+
rootElement: HTMLElement;
|
|
36
|
+
}, HTMLElement>;
|
|
33
37
|
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
34
38
|
export default _default;
|
|
35
39
|
type __VLS_WithTemplateSlots<T, S> = T & {
|
package/dist/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.vcb{display:grid;gap:var(--vcb-gap, 0);border:1px solid var(--vcb-border-color, #cbd5e1);border-radius:var(--vcb-border-radius, .625rem);background:var(--vcb-background-color, #
|
|
1
|
+
.vcb{display:grid;gap:var(--vcb-gap, 0);border:1px solid var(--vcb-border-color, color-mix(in srgb, var(--vf-color-border, rgba(15, 23, 42, .12)) 92%, #cbd5e1));border-radius:var(--vcb-border-radius, var(--vf-radius-control, var(--vf-radius-surface, var(--vf-radius, .625rem))));background:var(--vcb-background-color, var(--vf-color-bg, #ffffff));color:var(--vcb-text-color, var(--vf-color-text, #1f232b));font-family:var(--vcb-font-family, var(--vf-font-family-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace));font-size:var(--vcb-font-size, var(--vf-font-size-sm, .8125rem));line-height:var(--vcb-line-height, var(--vf-line-height-normal, 1.5));overflow:hidden}.vcb__header{display:flex;align-items:center;justify-content:space-between;gap:var(--vcb-header-gap, .75rem);min-height:0;padding:var(--vcb-header-padding, .4rem .75rem);border-bottom:1px solid var(--vcb-header-border-color, color-mix(in srgb, var(--vf-color-border, rgba(15, 23, 42, .12)) 78%, transparent));background:var(--vcb-header-background-color, var(--vcb-background-color, var(--vf-color-bg, #ffffff)));opacity:var(--vcb-header-opacity, .9)}.vcb__meta{display:inline-flex;align-items:center;gap:var(--vcb-meta-gap, .55rem);color:var(--vcb-meta-color, var(--vf-color-muted, #616773));font-size:var(--vcb-meta-font-size, var(--vf-font-size-sm, .75rem));letter-spacing:0}.vcb__filename{color:var(--vcb-filename-color, var(--vf-color-text, #1f232b));font-weight:var(--vcb-filename-font-weight, var(--vf-font-weight-semibold, 600))}.vcb__actions{display:inline-flex;align-items:center;gap:var(--vcb-actions-gap, .45rem)}.vcb__copy{border:1px solid var(--vcb-action-border-color, color-mix(in srgb, var(--vf-color-border, rgba(15, 23, 42, .12)) 80%, transparent));border-radius:var(--vcb-action-border-radius, var(--vf-radius-control-tight, .375rem));background:var(--vcb-action-background-color, var(--vf-color-bg, #ffffff));color:var(--vcb-action-text-color, var(--vf-color-text, #1f232b));padding:var(--vcb-action-padding, .125rem .5rem);font-size:var(--vcb-action-font-size, var(--vf-font-size-sm, .75rem));font-weight:var(--vcb-action-font-weight, var(--vf-text-body-font-weight, 400));opacity:var(--vcb-action-opacity, .88)}.vcb__pre{margin:0;padding:var(--vcb-padding, var(--vf-prose-code-block-padding, .75rem .9rem));background:var(--vcb-code-background-color, transparent);overflow:auto;white-space:pre}.vcb__pre_wrap{white-space:pre-wrap;word-break:break-word}.vcb__line{display:flex;align-items:baseline;gap:var(--vcb-line-gap, .7rem)}.vcb__line-number{text-align:right;color:var(--vcb-line-number-color, var(--vf-color-muted, #616773));min-width:var(--vcb-line-number-min-width, 2.1rem);-webkit-user-select:none;user-select:none}.vcb__line-content{white-space:inherit}.vcb__token_keyword{color:var(--vcb-token-keyword-color, var(--vf-color-help, #8553a1))}.vcb__token_string{color:var(--vcb-token-string-color, var(--vf-color-success, #2e7d32))}.vcb__token_number{color:var(--vcb-token-number-color, var(--vf-color-warn, #9f8400))}.vcb__token_comment{color:var(--vcb-token-comment-color, var(--vf-color-muted, #616773))}.vcb__token_variable{color:var(--vcb-token-variable-color, var(--vf-color-text, #1f232b))}.vcb__token_identifier{color:var(--vcb-token-identifier-color, var(--vf-color-info, #0069ba))}.vcb__token_function{color:var(--vcb-token-function-color, var(--vf-color-primary, #0e639c))}.vcb__token_property{color:var(--vcb-token-property-color, var(--vf-color-primary, #0e639c))}.vcb__token_operator{color:var(--vcb-token-operator-color, var(--vf-color-danger, #c72e39))}.vcb__token_tag{color:var(--vcb-token-tag-color, var(--vf-color-primary, #0e639c))}.vcb__token_selector{color:var(--vcb-token-selector-color, var(--vf-color-primary, #0e639c))}.vcb__token_component{color:var(--vcb-token-component-color, var(--vf-color-info, #0069ba))}.vcb__token_attribute{color:var(--vcb-token-attribute-color, var(--vf-color-help, #8553a1))}.vcb__token_directive{color:var(--vcb-token-directive-color, var(--vf-color-help, #8553a1))}.vcb[data-theme=dark],:root[data-theme=dark] .vcb:not([data-theme=light]),[data-theme=dark] .vcb:not([data-theme=light]){--vcb-background-color: var( --vcb-dark-background-color, var(--vf-color-bg, #1e1e1e) );--vcb-text-color: var(--vcb-dark-text-color, var(--vf-color-text, #d4d4d4));--vcb-border-color: var( --vcb-dark-border-color, color-mix(in srgb, var(--vf-color-border, #3c3c3c) 88%, black) );--vcb-header-border-color: var( --vcb-dark-header-border-color, color-mix(in srgb, var(--vf-color-border, #3c3c3c) 72%, transparent) );--vcb-header-background-color: var( --vcb-dark-header-background-color, transparent );--vcb-meta-color: var(--vcb-dark-meta-color, var(--vf-color-muted, #9da0a6));--vcb-filename-color: var( --vcb-dark-filename-color, var(--vf-color-text, #d4d4d4) );--vcb-action-border-color: var( --vcb-dark-action-border-color, color-mix(in srgb, var(--vf-color-border, #3c3c3c) 76%, transparent) );--vcb-action-background-color: var( --vcb-dark-action-background-color, color-mix(in srgb, var(--vf-color-surface, #252526) 72%, transparent) );--vcb-action-text-color: var( --vcb-dark-action-text-color, var(--vf-color-text, #d4d4d4) );--vcb-line-number-color: var( --vcb-dark-line-number-color, var(--vf-color-muted, #9da0a6) );--vcb-token-keyword-color: var( --vcb-dark-token-keyword-color, var(--vf-color-help, #c586c0) );--vcb-token-string-color: var( --vcb-dark-token-string-color, var(--vf-color-success, #6a9955) );--vcb-token-number-color: var( --vcb-dark-token-number-color, var(--vf-color-warn, #d7ba7d) );--vcb-token-comment-color: var(--vcb-dark-token-comment-color, #6a9955);--vcb-token-variable-color: var( --vcb-dark-token-variable-color, var(--vf-color-text, #d4d4d4) );--vcb-token-tag-color: var( --vcb-dark-token-tag-color, var(--vf-color-primary, #569cd6) );--vcb-token-selector-color: var( --vcb-dark-token-selector-color, var(--vf-color-warn, #d7ba7d) );--vcb-token-component-color: var( --vcb-dark-token-component-color, var(--vf-color-info, #4ec9b0) );--vcb-token-attribute-color: var(--vcb-dark-token-attribute-color, #9cdcfe);--vcb-token-directive-color: var(--vcb-dark-token-directive-color, #c586c0);--vcb-token-identifier-color: var(--vcb-dark-token-identifier-color, #9cdcfe);--vcb-token-function-color: var( --vcb-dark-token-function-color, var(--vf-color-contrast, #dcdcaa) );--vcb-token-property-color: var(--vcb-dark-token-property-color, #9cdcfe);--vcb-token-operator-color: var(--vcb-dark-token-operator-color, #d4d4d4)}.vcb[data-theme=light],:root:not([data-theme=dark]) .vcb:not([data-theme=dark]),[data-theme=light] .vcb,[data-vf-theme=light] .vcb,:root:not([data-vf-theme=dark]) .vcb:not([data-theme=dark]){box-shadow:var(--vcb-shadow, 0 1px 2px rgba(15, 23, 42, .04))}.vcb_disabled{opacity:var(--vcb-disabled-opacity, .6)}
|
package/dist/index.js
CHANGED
|
@@ -1,67 +1,64 @@
|
|
|
1
|
-
import { defineComponent as R, ref as
|
|
2
|
-
const n = (
|
|
3
|
-
let
|
|
4
|
-
for (;
|
|
5
|
-
const
|
|
6
|
-
if (
|
|
1
|
+
import { defineComponent as R, ref as W, computed as S, onMounted as U, onBeforeUnmount as G, openBlock as $, createElementBlock as A, normalizeClass as q, toDisplayString as L, createCommentVNode as z, createElementVNode as E, renderSlot as K, normalizeStyle as X, Fragment as Y, renderList as ee } from "vue";
|
|
2
|
+
const n = (e) => e.replaceAll("&", "&").replaceAll("<", "<").replaceAll(">", ">"), V = (e) => e.replaceAll(""", '"').replaceAll("'", "'").replaceAll("<", "<").replaceAll(">", ">").replaceAll("&", "&"), B = (e) => n(e), l = (e, c) => `<span class="vcb__token ${e}">${c}</span>`, te = "\\b\\d(?:[\\d_]*\\d)?(?:\\.\\d(?:[\\d_]*\\d)?)?\\b", ne = "\\b-?\\d(?:[\\d_]*\\d)?(?:\\.\\d(?:[\\d_]*\\d)?)?(?:px|rem|em|%|vh|vw|fr|s|ms|deg)?\\b", O = (e) => e.startsWith(":") || e.startsWith("@") || e.startsWith("#") || e.startsWith("v-"), F = (e) => /^[A-Z]/.test(e), se = (e) => {
|
|
3
|
+
let c = 0, s = l("vcb__token_string", n("`"));
|
|
4
|
+
for (; c < e.length - 1; ) {
|
|
5
|
+
const t = e.indexOf("${", c), o = t === -1 ? e.length - 1 : t, r = e.slice(c, o);
|
|
6
|
+
if (r && (s += l("vcb__token_string", n(r))), t === -1)
|
|
7
7
|
break;
|
|
8
8
|
s += n("${");
|
|
9
|
-
let a =
|
|
10
|
-
for (; a <
|
|
11
|
-
const u =
|
|
12
|
-
u === "{" ?
|
|
9
|
+
let a = t + 2, i = 1;
|
|
10
|
+
for (; a < e.length && i > 0; ) {
|
|
11
|
+
const u = e[a];
|
|
12
|
+
u === "{" ? i += 1 : u === "}" && (i -= 1), a += 1;
|
|
13
13
|
}
|
|
14
|
-
const
|
|
15
|
-
|
|
14
|
+
const d = e.slice(
|
|
15
|
+
t + 2,
|
|
16
16
|
a - 1
|
|
17
17
|
);
|
|
18
|
-
s +=
|
|
18
|
+
s += T(d), s += n("}"), c = a;
|
|
19
19
|
}
|
|
20
20
|
return s += l("vcb__token_string", n("`")), s;
|
|
21
|
-
},
|
|
22
|
-
if (
|
|
23
|
-
return l("vcb__token_string",
|
|
24
|
-
const
|
|
25
|
-
return `${
|
|
26
|
-
},
|
|
27
|
-
const
|
|
28
|
-
return `${
|
|
29
|
-
},
|
|
30
|
-
const
|
|
31
|
-
return `${n("{{ ")}${
|
|
32
|
-
}),
|
|
21
|
+
}, T = (e) => N(e), ce = (e) => {
|
|
22
|
+
if (e.length < 2)
|
|
23
|
+
return l("vcb__token_string", e);
|
|
24
|
+
const c = e[0], s = V(e.slice(1, -1)), t = T(s), o = c === '"' ? """ : "'";
|
|
25
|
+
return `${o}${t}${o}`;
|
|
26
|
+
}, M = (e, c, s, t, o) => {
|
|
27
|
+
const r = s ? T(V(e)) : l("vcb__token_string", n(e)), a = c === '"' ? """ : "'";
|
|
28
|
+
return `${t ? a : ""}${r}${o ? a : ""}`;
|
|
29
|
+
}, j = (e) => e.replaceAll(/{{\s*([\s\S]*?)\s*}}/g, (c, s) => {
|
|
30
|
+
const t = T(s);
|
|
31
|
+
return `${n("{{ ")}${t}${n(" }}")}`;
|
|
32
|
+
}), H = (e) => e.replaceAll(
|
|
33
33
|
/(\s+)([:@#]?[\w-]+(?::[\w-]+)?)(\s*=\s*)?("[^"]*"|'[^']*')?/g,
|
|
34
|
-
(
|
|
35
|
-
|
|
36
|
-
n(
|
|
37
|
-
)}${n(
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
)
|
|
41
|
-
|
|
42
|
-
const o = t.
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
const [, s, e, i] = o, c = e.startsWith("/"), a = c ? e.slice(1) : e, r = V(a) ? "vcb__token_component" : "vcb__token_tag";
|
|
46
|
-
return `${n(s)}${n(c ? "</" : "<")}${l(
|
|
47
|
-
r,
|
|
34
|
+
(c, s, t, o = "", r = "") => `${n(s)}${l(
|
|
35
|
+
O(t) ? "vcb__token_directive" : "vcb__token_attribute",
|
|
36
|
+
n(t)
|
|
37
|
+
)}${n(o)}${r ? O(t) ? ce(r) : l("vcb__token_string", n(r)) : ""}`
|
|
38
|
+
), Z = (e) => {
|
|
39
|
+
const c = e.match(/^(\s*)<([/\w-]+)([\s\S]*)$/);
|
|
40
|
+
if (!c)
|
|
41
|
+
return n(e);
|
|
42
|
+
const [, s, t, o] = c, r = t.startsWith("/"), a = r ? t.slice(1) : t, i = F(a) ? "vcb__token_component" : "vcb__token_tag";
|
|
43
|
+
return `${n(s)}${n(r ? "</" : "<")}${l(
|
|
44
|
+
i,
|
|
48
45
|
n(a)
|
|
49
|
-
)}${
|
|
50
|
-
},
|
|
51
|
-
if (
|
|
52
|
-
return l("vcb__token_comment", n(
|
|
53
|
-
const
|
|
54
|
-
|
|
55
|
-
|
|
46
|
+
)}${H(String(o))}`;
|
|
47
|
+
}, re = (e) => {
|
|
48
|
+
if (e.startsWith("<!--") && e.endsWith("-->"))
|
|
49
|
+
return l("vcb__token_comment", n(e));
|
|
50
|
+
const c = e.startsWith("</"), s = e.endsWith("/>"), o = e.slice(
|
|
51
|
+
c ? 2 : 1,
|
|
52
|
+
e.length - (s ? 2 : 1)
|
|
56
53
|
).match(/^([\w-]+)([\s\S]*)$/);
|
|
57
|
-
if (!
|
|
58
|
-
return n(
|
|
59
|
-
const [,
|
|
60
|
-
return `${n(
|
|
61
|
-
|
|
62
|
-
n(
|
|
63
|
-
)}${
|
|
64
|
-
},
|
|
54
|
+
if (!o)
|
|
55
|
+
return n(e);
|
|
56
|
+
const [, r, a] = o, i = F(r) ? "vcb__token_component" : "vcb__token_tag";
|
|
57
|
+
return `${n(c ? "</" : "<")}${l(
|
|
58
|
+
i,
|
|
59
|
+
n(r)
|
|
60
|
+
)}${H(a)}${n(s ? "/>" : ">")}`;
|
|
61
|
+
}, oe = (e) => n(e).replaceAll(
|
|
65
62
|
/"(?:[^"\\]|\\.)*"(?=\s*:)?/g,
|
|
66
63
|
(s) => l("vcb__token_string", s)
|
|
67
64
|
).replaceAll(
|
|
@@ -70,372 +67,312 @@ const n = (t) => t.replaceAll("&", "&").replaceAll("<", "<").replaceAll("
|
|
|
70
67
|
).replaceAll(
|
|
71
68
|
/\b-?\d(?:[\d_]*\d)?(?:\.\d(?:[\d_]*\d)?)?(?:[eE][+-]?\d(?:[\d_]*\d)?)?\b/g,
|
|
72
69
|
(s) => l("vcb__token_number", s)
|
|
73
|
-
),
|
|
74
|
-
for (let s =
|
|
75
|
-
const
|
|
76
|
-
if (!/\s/.test(
|
|
77
|
-
return
|
|
70
|
+
), ie = (e, c) => {
|
|
71
|
+
for (let s = c - 1; s >= 0; s -= 1) {
|
|
72
|
+
const t = e[s];
|
|
73
|
+
if (!/\s/.test(t))
|
|
74
|
+
return t;
|
|
78
75
|
}
|
|
79
76
|
return "";
|
|
80
|
-
}, J = (
|
|
81
|
-
for (let s =
|
|
82
|
-
const
|
|
83
|
-
if (!/\s/.test(
|
|
84
|
-
return
|
|
77
|
+
}, J = (e, c) => {
|
|
78
|
+
for (let s = c; s < e.length; s += 1) {
|
|
79
|
+
const t = e[s];
|
|
80
|
+
if (!/\s/.test(t))
|
|
81
|
+
return t;
|
|
85
82
|
}
|
|
86
83
|
return "";
|
|
87
|
-
},
|
|
88
|
-
let s =
|
|
89
|
-
for (; s > 0 && /\s/.test(
|
|
84
|
+
}, le = (e, c) => {
|
|
85
|
+
let s = c;
|
|
86
|
+
for (; s > 0 && /\s/.test(e[s - 1]); )
|
|
90
87
|
s -= 1;
|
|
91
|
-
return
|
|
92
|
-
},
|
|
93
|
-
const
|
|
94
|
-
return
|
|
95
|
-
},
|
|
96
|
-
const
|
|
97
|
-
`(//.*$)|((["'\`])(?:\\\\.|(?!\\3).)*\\3)|\\b(const|let|var|function|return|if|else|for|while|class|new|import|export|from|await|async|try|catch|throw|true|false|null|undefined)\\b|(=>|\\?\\?|\\?|:|\\.|[{}()[\\],])|${
|
|
88
|
+
return e.slice(0, s).match(/([A-Za-z_$][\w$]*)\s*$/)?.[1] ?? "";
|
|
89
|
+
}, ae = (e, c, s) => {
|
|
90
|
+
const t = ie(e, s), o = J(e, s + c.length), r = le(e, s), a = e.slice(0, s);
|
|
91
|
+
return t === "." || /\?\.\s*$/.test(a) || o === ":" && ["{", ",", ""].includes(t) ? "vcb__token_property" : o === "(" ? "vcb__token_function" : /^[A-Z]/.test(c) || ["import", "from", "new", "class", "extends"].includes(r) ? "vcb__token_identifier" : "vcb__token_variable";
|
|
92
|
+
}, N = (e) => {
|
|
93
|
+
const c = new RegExp(
|
|
94
|
+
`(//.*$)|((["'\`])(?:\\\\.|(?!\\3).)*\\3)|\\b(const|let|var|function|return|if|else|for|while|class|new|import|export|from|await|async|try|catch|throw|true|false|null|undefined)\\b|(=>|\\?\\?|\\?|:|\\.|[{}()[\\],])|${te}|\\b[A-Za-z_$][\\w$]*\\b`,
|
|
98
95
|
"g"
|
|
99
96
|
);
|
|
100
|
-
let s = 0,
|
|
101
|
-
for (const
|
|
102
|
-
const
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
n(
|
|
106
|
-
)
|
|
107
|
-
"vcb__token_keyword",
|
|
108
|
-
n(c)
|
|
109
|
-
) : i[5] ? e += l(
|
|
110
|
-
"vcb__token_operator",
|
|
111
|
-
n(c)
|
|
112
|
-
) : /^\d/.test(c) ? e += l(
|
|
113
|
-
"vcb__token_number",
|
|
114
|
-
n(c)
|
|
115
|
-
) : e += l(
|
|
116
|
-
lt(t, c, a),
|
|
117
|
-
n(c)
|
|
118
|
-
), s = a + c.length;
|
|
97
|
+
let s = 0, t = "";
|
|
98
|
+
for (const o of e.matchAll(c)) {
|
|
99
|
+
const r = o[0] ?? "", a = o.index ?? 0;
|
|
100
|
+
t += n(e.slice(s, a)), o[1] ? t += l("vcb__token_comment", n(r)) : o[2] ? t += r.startsWith("`") && r.includes("${") ? se(r) : l("vcb__token_string", n(r)) : o[4] ? t += l("vcb__token_keyword", n(r)) : o[5] ? t += l("vcb__token_operator", n(r)) : /^\d/.test(r) ? t += l("vcb__token_number", n(r)) : t += l(
|
|
101
|
+
ae(e, r, a),
|
|
102
|
+
n(r)
|
|
103
|
+
), s = a + r.length;
|
|
119
104
|
}
|
|
120
|
-
return
|
|
121
|
-
},
|
|
105
|
+
return t += n(e.slice(s)), t;
|
|
106
|
+
}, ue = (e, c) => {
|
|
122
107
|
let s = null;
|
|
123
|
-
for (let
|
|
124
|
-
const
|
|
108
|
+
for (let t = c + 1; t < e.length; t += 1) {
|
|
109
|
+
const o = e[t];
|
|
125
110
|
if (s) {
|
|
126
|
-
|
|
111
|
+
o === s && e[t - 1] !== "\\" && (s = null);
|
|
127
112
|
continue;
|
|
128
113
|
}
|
|
129
|
-
if (
|
|
130
|
-
s =
|
|
114
|
+
if (o === '"' || o === "'") {
|
|
115
|
+
s = o;
|
|
131
116
|
continue;
|
|
132
117
|
}
|
|
133
|
-
if (
|
|
134
|
-
return
|
|
118
|
+
if (o === ">")
|
|
119
|
+
return t;
|
|
135
120
|
}
|
|
136
121
|
return -1;
|
|
137
|
-
},
|
|
138
|
-
if (!
|
|
139
|
-
return n(
|
|
140
|
-
let
|
|
141
|
-
for (;
|
|
142
|
-
const
|
|
143
|
-
if (
|
|
144
|
-
s +=
|
|
122
|
+
}, y = (e) => {
|
|
123
|
+
if (!e.trim())
|
|
124
|
+
return n(e);
|
|
125
|
+
let c = 0, s = "";
|
|
126
|
+
for (; c < e.length; ) {
|
|
127
|
+
const t = e.indexOf("<", c);
|
|
128
|
+
if (t === -1) {
|
|
129
|
+
s += j(n(e.slice(c)));
|
|
145
130
|
break;
|
|
146
131
|
}
|
|
147
|
-
s +=
|
|
148
|
-
n(
|
|
132
|
+
s += j(
|
|
133
|
+
n(e.slice(c, t))
|
|
149
134
|
);
|
|
150
|
-
const
|
|
151
|
-
if (
|
|
152
|
-
s += n(
|
|
135
|
+
const o = ue(e, t);
|
|
136
|
+
if (o === -1) {
|
|
137
|
+
s += n(e.slice(t));
|
|
153
138
|
break;
|
|
154
139
|
}
|
|
155
|
-
s +=
|
|
140
|
+
s += re(e.slice(t, o + 1)), c = o + 1;
|
|
156
141
|
}
|
|
157
142
|
return s;
|
|
158
|
-
},
|
|
159
|
-
const
|
|
160
|
-
if (
|
|
143
|
+
}, de = (e) => {
|
|
144
|
+
const c = e.match(/^(\s*)(npm)(\s+)(run)(\s+)([^\s].*)$/);
|
|
145
|
+
if (c) {
|
|
161
146
|
const [
|
|
162
147
|
,
|
|
163
|
-
|
|
164
|
-
|
|
148
|
+
i,
|
|
149
|
+
d,
|
|
165
150
|
u,
|
|
166
151
|
f,
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
] =
|
|
170
|
-
return `${n(
|
|
152
|
+
_,
|
|
153
|
+
h
|
|
154
|
+
] = c;
|
|
155
|
+
return `${n(i)}${l(
|
|
171
156
|
"vcb__token_keyword",
|
|
172
|
-
n(
|
|
157
|
+
n(d)
|
|
173
158
|
)}${n(u)}${l(
|
|
174
159
|
"vcb__token_function",
|
|
175
160
|
n(f)
|
|
176
|
-
)}${n(
|
|
161
|
+
)}${n(_)}${l(
|
|
177
162
|
"vcb__token_variable",
|
|
178
|
-
n(
|
|
163
|
+
n(h)
|
|
179
164
|
)}`;
|
|
180
165
|
}
|
|
181
|
-
const s = (
|
|
182
|
-
const
|
|
166
|
+
const s = (i) => {
|
|
167
|
+
const d = /(\s+)|((["'])(?:\\.|(?!\3).)*\3)|(\$[A-Za-z_][A-Za-z0-9_]*)|(@[A-Za-z0-9._/-]+|[A-Za-z0-9._-]+\/[A-Za-z0-9._/@-]+)|(-{1,2}[A-Za-z][\w-]*)(?:=(\S+))?|([^\s]+)/g;
|
|
183
168
|
let u = 0, f = "";
|
|
184
|
-
for (const
|
|
185
|
-
const
|
|
186
|
-
f += n(
|
|
187
|
-
"vcb__token_string",
|
|
188
|
-
n(
|
|
189
|
-
) :
|
|
190
|
-
"vcb__token_variable",
|
|
191
|
-
n(d)
|
|
192
|
-
) : h[5] ? f += l(
|
|
193
|
-
"vcb__token_string",
|
|
194
|
-
n(d)
|
|
195
|
-
) : h[6] ? (f += l(
|
|
196
|
-
"vcb__token_directive",
|
|
197
|
-
n(h[6])
|
|
198
|
-
), h[7] && (f += `${n("=")}${l(
|
|
199
|
-
h[7].startsWith("@") || h[7].includes("/") ? "vcb__token_string" : "vcb__token_variable",
|
|
200
|
-
n(h[7])
|
|
201
|
-
)}`)) : h[8] ? f += l(
|
|
202
|
-
"vcb__token_variable",
|
|
203
|
-
n(d)
|
|
204
|
-
) : f += n(d), u = A + d.length;
|
|
169
|
+
for (const _ of i.matchAll(d)) {
|
|
170
|
+
const h = _[0] ?? "", w = _.index ?? 0;
|
|
171
|
+
f += n(i.slice(u, w)), _[1] ? f += n(h) : _[2] ? f += l("vcb__token_string", n(h)) : _[4] ? f += l("vcb__token_variable", n(h)) : _[5] ? f += l("vcb__token_string", n(h)) : _[6] ? (f += l("vcb__token_directive", n(_[6])), _[7] && (f += `${n("=")}${l(
|
|
172
|
+
_[7].startsWith("@") || _[7].includes("/") ? "vcb__token_string" : "vcb__token_variable",
|
|
173
|
+
n(_[7])
|
|
174
|
+
)}`)) : _[8] ? f += l("vcb__token_variable", n(h)) : f += n(h), u = w + h.length;
|
|
205
175
|
}
|
|
206
|
-
return f += n(
|
|
207
|
-
},
|
|
176
|
+
return f += n(i.slice(u)), f;
|
|
177
|
+
}, t = e.match(
|
|
208
178
|
/^(\s*)(npm|pnpm|yarn|bun)(\s+)(i|install|add|remove|rm|uninstall|create|dlx|exec|x)(\s+)(.+)$/
|
|
209
179
|
);
|
|
210
|
-
if (
|
|
180
|
+
if (t) {
|
|
211
181
|
const [
|
|
212
182
|
,
|
|
213
|
-
|
|
214
|
-
|
|
183
|
+
i,
|
|
184
|
+
d,
|
|
215
185
|
u,
|
|
216
186
|
f,
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
] =
|
|
220
|
-
return `${n(
|
|
187
|
+
_,
|
|
188
|
+
h
|
|
189
|
+
] = t;
|
|
190
|
+
return `${n(i)}${l(
|
|
221
191
|
"vcb__token_keyword",
|
|
222
|
-
n(
|
|
192
|
+
n(d)
|
|
223
193
|
)}${n(u)}${l(
|
|
224
194
|
"vcb__token_function",
|
|
225
195
|
n(f)
|
|
226
|
-
)}${n(
|
|
196
|
+
)}${n(_)}${s(h)}`;
|
|
227
197
|
}
|
|
228
|
-
const
|
|
229
|
-
let
|
|
230
|
-
for (const
|
|
231
|
-
const
|
|
232
|
-
if (a += n(
|
|
233
|
-
a += l(
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
);
|
|
242
|
-
else if (r[4])
|
|
243
|
-
a += l(
|
|
244
|
-
"vcb__token_variable",
|
|
245
|
-
n(_)
|
|
246
|
-
);
|
|
247
|
-
else if (r[5])
|
|
248
|
-
a += l(
|
|
249
|
-
"vcb__token_string",
|
|
250
|
-
n(_)
|
|
251
|
-
);
|
|
252
|
-
else if (r[6])
|
|
198
|
+
const o = /(#[^\n]*$)|((["'])(?:\\.|(?!\3).)*\3)|(\$[A-Za-z_][A-Za-z0-9_]*)|(@[A-Za-z0-9._/-]+)|(^\s*[A-Za-z][\w-]*\b)|(\s-[A-Za-z-]+\b|\s--[A-Za-z-]+\b)/g;
|
|
199
|
+
let r = 0, a = "";
|
|
200
|
+
for (const i of e.matchAll(o)) {
|
|
201
|
+
const d = i[0] ?? "", u = i.index ?? 0;
|
|
202
|
+
if (a += n(e.slice(r, u)), i[1])
|
|
203
|
+
a += l("vcb__token_comment", n(d));
|
|
204
|
+
else if (i[2])
|
|
205
|
+
a += l("vcb__token_string", n(d));
|
|
206
|
+
else if (i[4])
|
|
207
|
+
a += l("vcb__token_variable", n(d));
|
|
208
|
+
else if (i[5])
|
|
209
|
+
a += l("vcb__token_string", n(d));
|
|
210
|
+
else if (i[6])
|
|
253
211
|
a += l(
|
|
254
212
|
"vcb__token_keyword",
|
|
255
|
-
n(
|
|
213
|
+
n(d.trimStart())
|
|
256
214
|
);
|
|
257
|
-
else if (
|
|
258
|
-
const f =
|
|
215
|
+
else if (i[7]) {
|
|
216
|
+
const f = d.match(/^\s*/)?.[0] ?? "";
|
|
259
217
|
a += `${n(f)}${l(
|
|
260
218
|
"vcb__token_directive",
|
|
261
|
-
n(
|
|
219
|
+
n(d.trimStart())
|
|
262
220
|
)}`;
|
|
263
221
|
} else
|
|
264
|
-
a += n(
|
|
265
|
-
|
|
222
|
+
a += n(d);
|
|
223
|
+
r = u + d.length;
|
|
266
224
|
}
|
|
267
|
-
return a += n(
|
|
268
|
-
},
|
|
269
|
-
const
|
|
270
|
-
`(\\/\\*.*?\\*\\/)|((["'])(?:\\\\.|(?!\\3).)*\\3)|(#[0-9A-Fa-f]{3,8})|(@[A-Za-z-]+)|([A-Za-z_-][\\w-]*)(?=\\s*\\()|${
|
|
225
|
+
return a += n(e.slice(r)), a;
|
|
226
|
+
}, I = (e) => {
|
|
227
|
+
const c = new RegExp(
|
|
228
|
+
`(\\/\\*.*?\\*\\/)|((["'])(?:\\\\.|(?!\\3).)*\\3)|(#[0-9A-Fa-f]{3,8})|(@[A-Za-z-]+)|([A-Za-z_-][\\w-]*)(?=\\s*\\()|${ne}|\\b[A-Za-z_-][\\w-]*\\b`,
|
|
271
229
|
"g"
|
|
272
230
|
);
|
|
273
|
-
let s = 0,
|
|
274
|
-
for (const
|
|
275
|
-
const
|
|
276
|
-
|
|
277
|
-
"vcb__token_comment",
|
|
278
|
-
n(c)
|
|
279
|
-
) : i[2] ? e += l(
|
|
280
|
-
"vcb__token_string",
|
|
281
|
-
n(c)
|
|
282
|
-
) : /^#[0-9A-Fa-f]{3,8}$/.test(c) ? e += l(
|
|
283
|
-
"vcb__token_number",
|
|
284
|
-
n(c)
|
|
285
|
-
) : c.startsWith("@") ? e += l(
|
|
286
|
-
"vcb__token_keyword",
|
|
287
|
-
n(c)
|
|
288
|
-
) : J(t, a + c.length) === "(" ? e += l(
|
|
289
|
-
"vcb__token_function",
|
|
290
|
-
n(c)
|
|
291
|
-
) : /^-?\d/.test(c) ? e += l(
|
|
292
|
-
"vcb__token_number",
|
|
293
|
-
n(c)
|
|
294
|
-
) : e += l(
|
|
295
|
-
"vcb__token_variable",
|
|
296
|
-
n(c)
|
|
297
|
-
), s = a + c.length;
|
|
231
|
+
let s = 0, t = "";
|
|
232
|
+
for (const o of e.matchAll(c)) {
|
|
233
|
+
const r = o[0] ?? "", a = o.index ?? 0;
|
|
234
|
+
t += n(e.slice(s, a)), o[1] ? t += l("vcb__token_comment", n(r)) : o[2] ? t += l("vcb__token_string", n(r)) : /^#[0-9A-Fa-f]{3,8}$/.test(r) ? t += l("vcb__token_number", n(r)) : r.startsWith("@") ? t += l("vcb__token_keyword", n(r)) : J(e, a + r.length) === "(" ? t += l("vcb__token_function", n(r)) : /^-?\d/.test(r) ? t += l("vcb__token_number", n(r)) : t += l("vcb__token_variable", n(r)), s = a + r.length;
|
|
298
235
|
}
|
|
299
|
-
return
|
|
300
|
-
},
|
|
301
|
-
const
|
|
302
|
-
if (
|
|
303
|
-
return `${n(
|
|
236
|
+
return t += n(e.slice(s)), t;
|
|
237
|
+
}, he = (e) => {
|
|
238
|
+
const c = e.match(/^(\s*)(\/\*.*\*\/)(\s*)$/);
|
|
239
|
+
if (c)
|
|
240
|
+
return `${n(c[1])}${l(
|
|
304
241
|
"vcb__token_comment",
|
|
305
|
-
n(
|
|
306
|
-
)}${n(
|
|
307
|
-
const s =
|
|
242
|
+
n(c[2])
|
|
243
|
+
)}${n(c[3])}`;
|
|
244
|
+
const s = e.match(/^(\s*)([^{}][^{}]*?)(\s*)(\{|\})\s*$/);
|
|
308
245
|
if (s) {
|
|
309
|
-
const [,
|
|
310
|
-
return `${n(
|
|
246
|
+
const [, o, r, a, i] = s, d = r.trim(), u = d === ":root" || d.startsWith(".") || d.startsWith("#") || /^[A-Za-z_-][\w-]*$/.test(d) ? "vcb__token_selector" : "vcb__token_variable";
|
|
247
|
+
return `${n(o)}${l(u, n(d))}${n(
|
|
311
248
|
a
|
|
312
|
-
)}${n(
|
|
249
|
+
)}${n(i)}`;
|
|
313
250
|
}
|
|
314
|
-
const
|
|
251
|
+
const t = e.match(
|
|
315
252
|
/^(\s*)(--?[A-Za-z_][\w-]*|[A-Za-z_][\w-]*)(\s*:\s*)(.*)$/
|
|
316
253
|
);
|
|
317
|
-
if (
|
|
318
|
-
const [,
|
|
319
|
-
return `${n(
|
|
254
|
+
if (t) {
|
|
255
|
+
const [, o, r, a, i] = t;
|
|
256
|
+
return `${n(o)}${l(
|
|
320
257
|
"vcb__token_property",
|
|
321
|
-
n(
|
|
322
|
-
)}${n(a)}${
|
|
258
|
+
n(r)
|
|
259
|
+
)}${n(a)}${I(i)}`;
|
|
323
260
|
}
|
|
324
|
-
return
|
|
325
|
-
},
|
|
261
|
+
return I(e);
|
|
262
|
+
}, _e = (e, c, s = !0) => {
|
|
326
263
|
if (!s)
|
|
327
|
-
return B(
|
|
328
|
-
const
|
|
329
|
-
return
|
|
330
|
-
},
|
|
331
|
-
const s = (
|
|
264
|
+
return B(c);
|
|
265
|
+
const t = e.toLowerCase();
|
|
266
|
+
return t.includes("json") ? oe(c) : t.includes("vue") || t.includes("html") ? y(c) : t.includes("js") || t.includes("ts") || t.includes("javascript") || t.includes("typescript") ? N(c) : t.includes("bash") || t.includes("shell") || t === "sh" ? de(c) : t.includes("css") || t.includes("scss") || t.includes("sass") ? he(c) : B(c);
|
|
267
|
+
}, fe = (e, c) => {
|
|
268
|
+
const s = (e || "").replace(/\r\n/g, `
|
|
332
269
|
`).split(`
|
|
333
270
|
`);
|
|
334
|
-
let
|
|
271
|
+
let t = !1, o = null, r = null;
|
|
335
272
|
return s.map((a) => {
|
|
336
|
-
const
|
|
337
|
-
if (!
|
|
338
|
-
return B(
|
|
339
|
-
const
|
|
273
|
+
const i = a;
|
|
274
|
+
if (!c)
|
|
275
|
+
return B(i);
|
|
276
|
+
const d = n(i), u = d.trim();
|
|
340
277
|
if (!u)
|
|
341
|
-
return
|
|
278
|
+
return d;
|
|
342
279
|
if (/^<script\b/i.test(u)) {
|
|
343
|
-
|
|
344
|
-
const
|
|
345
|
-
return
|
|
280
|
+
o = "script";
|
|
281
|
+
const h = u.includes(">");
|
|
282
|
+
return t = !h, h ? y(i) : Z(i);
|
|
346
283
|
}
|
|
347
284
|
if (/^<template\b/i.test(u)) {
|
|
348
|
-
|
|
349
|
-
const
|
|
350
|
-
return
|
|
285
|
+
o = "template";
|
|
286
|
+
const h = u.includes(">");
|
|
287
|
+
return t = !h, h ? y(i) : Z(i);
|
|
351
288
|
}
|
|
352
289
|
if (/^<style\b/i.test(u)) {
|
|
353
|
-
|
|
354
|
-
const
|
|
355
|
-
return
|
|
290
|
+
o = "style";
|
|
291
|
+
const h = u.includes(">");
|
|
292
|
+
return t = !h, h ? y(i) : Z(i);
|
|
356
293
|
}
|
|
357
294
|
if (/^<\/script>/i.test(u) || /^<\/template>/i.test(u) || /^<\/style>/i.test(u))
|
|
358
|
-
return
|
|
359
|
-
const f = u.startsWith("<") && !u.startsWith("</"),
|
|
295
|
+
return o = null, t = !1, y(i);
|
|
296
|
+
const f = u.startsWith("<") && !u.startsWith("</"), _ = u.includes(">");
|
|
360
297
|
if (f) {
|
|
361
|
-
const
|
|
362
|
-
return
|
|
298
|
+
const h = _ ? y(i) : Z(i);
|
|
299
|
+
return t = !_, h;
|
|
363
300
|
}
|
|
364
|
-
if (
|
|
301
|
+
if (t) {
|
|
365
302
|
if (u === ">" || u === "/>")
|
|
366
|
-
return
|
|
367
|
-
if (
|
|
368
|
-
const p =
|
|
369
|
-
if (
|
|
370
|
-
return
|
|
371
|
-
|
|
303
|
+
return t = !1, r = null, d;
|
|
304
|
+
if (r) {
|
|
305
|
+
const p = r, v = i.indexOf(r.quote);
|
|
306
|
+
if (v === -1)
|
|
307
|
+
return M(
|
|
308
|
+
i,
|
|
372
309
|
p.quote,
|
|
373
310
|
p.directive,
|
|
374
311
|
!1,
|
|
375
312
|
!1
|
|
376
313
|
);
|
|
377
|
-
const
|
|
378
|
-
return
|
|
379
|
-
|
|
314
|
+
const x = i.slice(0, v), g = i.slice(v + 1), m = n(g);
|
|
315
|
+
return r = null, g.includes(">") && (t = !1), `${M(
|
|
316
|
+
x,
|
|
380
317
|
p.quote,
|
|
381
318
|
p.directive,
|
|
382
319
|
!1,
|
|
383
320
|
!0
|
|
384
|
-
)}${
|
|
321
|
+
)}${m}`;
|
|
385
322
|
}
|
|
386
|
-
const
|
|
323
|
+
const h = i.match(
|
|
387
324
|
/^(\s+)([:@#]?[\w-]+(?::[\w-]+)?)(\s*=\s*)(["'])([\s\S]*)$/
|
|
388
325
|
);
|
|
389
|
-
if (
|
|
390
|
-
const [, p,
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
)}${n(
|
|
394
|
-
if (
|
|
395
|
-
return
|
|
396
|
-
quote:
|
|
397
|
-
directive:
|
|
398
|
-
}, `${
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
326
|
+
if (h) {
|
|
327
|
+
const [, p, v, x, g, m] = h, k = O(v), b = m.indexOf(g), C = `${p}${l(
|
|
328
|
+
k ? "vcb__token_directive" : "vcb__token_attribute",
|
|
329
|
+
v
|
|
330
|
+
)}${n(x)}`;
|
|
331
|
+
if (b === -1)
|
|
332
|
+
return r = {
|
|
333
|
+
quote: g,
|
|
334
|
+
directive: k
|
|
335
|
+
}, `${C}${M(
|
|
336
|
+
m,
|
|
337
|
+
g,
|
|
338
|
+
k,
|
|
402
339
|
!0,
|
|
403
340
|
!1
|
|
404
341
|
)}`;
|
|
405
|
-
const Q =
|
|
406
|
-
return P.includes(">") && (
|
|
342
|
+
const Q = m.slice(0, b), P = m.slice(b + 1);
|
|
343
|
+
return P.includes(">") && (t = !1), `${C}${M(
|
|
407
344
|
Q,
|
|
408
|
-
|
|
409
|
-
|
|
345
|
+
g,
|
|
346
|
+
k,
|
|
410
347
|
!0,
|
|
411
348
|
!0
|
|
412
349
|
)}${n(P)}`;
|
|
413
350
|
}
|
|
414
|
-
const
|
|
415
|
-
return
|
|
351
|
+
const w = H(d);
|
|
352
|
+
return _ && (t = !1), w;
|
|
416
353
|
}
|
|
417
|
-
return
|
|
354
|
+
return o === "script" ? N(i) : y(i);
|
|
418
355
|
}).join(`
|
|
419
356
|
`);
|
|
420
|
-
},
|
|
421
|
-
const
|
|
422
|
-
return
|
|
357
|
+
}, me = (e, c, s = !0) => {
|
|
358
|
+
const t = e.toLowerCase();
|
|
359
|
+
return t.includes("vue") || t.includes("html") ? fe(c, s) : (c || "").replace(/\r\n/g, `
|
|
423
360
|
`).split(`
|
|
424
|
-
`).map((
|
|
361
|
+
`).map((o) => _e(e, o, s)).join(`
|
|
425
362
|
`);
|
|
426
|
-
},
|
|
363
|
+
}, ge = ["data-theme", "aria-label"], be = {
|
|
427
364
|
key: 0,
|
|
428
365
|
class: "vcb__header"
|
|
429
|
-
},
|
|
366
|
+
}, pe = {
|
|
430
367
|
key: 0,
|
|
431
368
|
class: "vcb__meta"
|
|
432
|
-
},
|
|
369
|
+
}, ve = {
|
|
433
370
|
key: 0,
|
|
434
371
|
class: "vcb__filename"
|
|
435
|
-
},
|
|
372
|
+
}, ke = { class: "vcb__language" }, $e = { class: "vcb__actions" }, Ae = ["disabled"], ye = {
|
|
436
373
|
key: 0,
|
|
437
374
|
class: "vcb__line-number"
|
|
438
|
-
},
|
|
375
|
+
}, we = ["innerHTML"], D = /* @__PURE__ */ R({
|
|
439
376
|
name: "VcbCodeBlock",
|
|
440
377
|
__name: "CodeBlock",
|
|
441
378
|
props: {
|
|
@@ -457,78 +394,99 @@ const n = (t) => t.replaceAll("&", "&").replaceAll("<", "<").replaceAll("
|
|
|
457
394
|
theme: { default: "inherit" }
|
|
458
395
|
},
|
|
459
396
|
emits: ["copy"],
|
|
460
|
-
setup(
|
|
461
|
-
const s =
|
|
462
|
-
let
|
|
463
|
-
const
|
|
464
|
-
`)),
|
|
465
|
-
`) : [""]), _ =
|
|
466
|
-
() =>
|
|
397
|
+
setup(e, { emit: c }) {
|
|
398
|
+
const s = e, t = c, o = W(!1), r = W(null), a = W("light");
|
|
399
|
+
let i = null, d = null;
|
|
400
|
+
const u = S(() => s.code.replace(/\r\n/g, `
|
|
401
|
+
`)), f = S(() => u.value ? u.value.split(`
|
|
402
|
+
`) : [""]), _ = S(
|
|
403
|
+
() => me(
|
|
467
404
|
s.language,
|
|
468
|
-
|
|
405
|
+
u.value,
|
|
469
406
|
s.highlight
|
|
470
407
|
).split(`
|
|
471
408
|
`)
|
|
472
|
-
),
|
|
473
|
-
() => s.theme === "inherit" ?
|
|
474
|
-
),
|
|
409
|
+
), h = S(
|
|
410
|
+
() => s.theme === "inherit" ? a.value : s.theme
|
|
411
|
+
), w = S(() => {
|
|
475
412
|
if (s.maxHeight)
|
|
476
413
|
return {
|
|
477
414
|
maxHeight: s.maxHeight
|
|
478
415
|
};
|
|
479
|
-
}),
|
|
416
|
+
}), p = async () => {
|
|
480
417
|
if (!s.disabled)
|
|
481
418
|
try {
|
|
482
|
-
typeof navigator < "u" && navigator.clipboard?.writeText && await navigator.clipboard.writeText(
|
|
419
|
+
typeof navigator < "u" && navigator.clipboard?.writeText && await navigator.clipboard.writeText(u.value);
|
|
483
420
|
} finally {
|
|
484
|
-
|
|
485
|
-
|
|
421
|
+
t("copy", { text: u.value }), o.value = !0, i && clearTimeout(i), i = setTimeout(() => {
|
|
422
|
+
o.value = !1, i = null;
|
|
486
423
|
}, s.copiedDuration);
|
|
487
424
|
}
|
|
425
|
+
}, v = (m) => m === "dark" ? "dark" : "light", x = (m, k) => {
|
|
426
|
+
let b = m?.parentElement ?? null;
|
|
427
|
+
for (; b; ) {
|
|
428
|
+
if (b.hasAttribute(k))
|
|
429
|
+
return v(b.getAttribute(k));
|
|
430
|
+
b = b.parentElement;
|
|
431
|
+
}
|
|
432
|
+
return null;
|
|
433
|
+
}, g = () => {
|
|
434
|
+
s.theme === "inherit" && (a.value = x(r.value, "data-theme") ?? x(r.value, "data-vf-theme") ?? "light");
|
|
488
435
|
};
|
|
489
436
|
return U(() => {
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
437
|
+
g(), !(typeof MutationObserver > "u" || !r.value) && (d = new MutationObserver(() => {
|
|
438
|
+
g();
|
|
439
|
+
}), d.observe(document.documentElement, {
|
|
440
|
+
subtree: !0,
|
|
441
|
+
childList: !0,
|
|
442
|
+
attributes: !0,
|
|
443
|
+
attributeFilter: ["data-theme", "data-vf-theme"]
|
|
444
|
+
}));
|
|
445
|
+
}), G(() => {
|
|
446
|
+
i && (clearTimeout(i), i = null), d && (d.disconnect(), d = null);
|
|
447
|
+
}), (m, k) => ($(), A("section", {
|
|
448
|
+
ref_key: "rootElement",
|
|
449
|
+
ref: r,
|
|
450
|
+
class: q(["vcb", { vcb_disabled: e.disabled }]),
|
|
451
|
+
"data-theme": h.value,
|
|
452
|
+
"aria-label": e.ariaLabel
|
|
495
453
|
}, [
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
])) :
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
454
|
+
e.showHeader || m.$slots.actions ? ($(), A("header", be, [
|
|
455
|
+
e.showHeader ? ($(), A("div", pe, [
|
|
456
|
+
e.filename ? ($(), A("span", ve, L(e.filename), 1)) : z("", !0),
|
|
457
|
+
E("span", ke, L(e.languageLabel) + ": " + L(e.language), 1)
|
|
458
|
+
])) : z("", !0),
|
|
459
|
+
E("div", $e, [
|
|
460
|
+
K(m.$slots, "actions"),
|
|
461
|
+
e.copyable ? ($(), A("button", {
|
|
504
462
|
key: 0,
|
|
505
463
|
type: "button",
|
|
506
464
|
class: "vcb__copy",
|
|
507
|
-
disabled:
|
|
508
|
-
onClick:
|
|
509
|
-
},
|
|
465
|
+
disabled: e.disabled,
|
|
466
|
+
onClick: p
|
|
467
|
+
}, L(o.value ? e.copiedLabel : e.copyLabel), 9, Ae)) : z("", !0)
|
|
510
468
|
])
|
|
511
|
-
])) :
|
|
512
|
-
|
|
513
|
-
class: q(["vcb__pre", { vcb__pre_wrap:
|
|
514
|
-
style:
|
|
469
|
+
])) : z("", !0),
|
|
470
|
+
E("pre", {
|
|
471
|
+
class: q(["vcb__pre", { vcb__pre_wrap: e.wrap }]),
|
|
472
|
+
style: X(w.value)
|
|
515
473
|
}, [
|
|
516
|
-
|
|
517
|
-
(
|
|
518
|
-
key:
|
|
474
|
+
E("code", null, [
|
|
475
|
+
($(!0), A(Y, null, ee(f.value, (b, C) => ($(), A("span", {
|
|
476
|
+
key: C,
|
|
519
477
|
class: "vcb__line"
|
|
520
478
|
}, [
|
|
521
|
-
|
|
522
|
-
|
|
479
|
+
e.showLineNumbers ? ($(), A("span", ye, L(C + 1), 1)) : z("", !0),
|
|
480
|
+
E("span", {
|
|
523
481
|
class: "vcb__line-content",
|
|
524
|
-
innerHTML: _.value[
|
|
525
|
-
}, null, 8,
|
|
482
|
+
innerHTML: _.value[C] ?? ""
|
|
483
|
+
}, null, 8, we)
|
|
526
484
|
]))), 128))
|
|
527
485
|
])
|
|
528
486
|
], 6)
|
|
529
|
-
], 10,
|
|
487
|
+
], 10, ge));
|
|
530
488
|
}
|
|
531
|
-
}),
|
|
489
|
+
}), Ce = [
|
|
532
490
|
"plaintext",
|
|
533
491
|
"text",
|
|
534
492
|
"txt",
|
|
@@ -545,16 +503,16 @@ const n = (t) => t.replaceAll("&", "&").replaceAll("<", "<").replaceAll("
|
|
|
545
503
|
"css",
|
|
546
504
|
"scss",
|
|
547
505
|
"sass"
|
|
548
|
-
],
|
|
549
|
-
install(
|
|
550
|
-
|
|
506
|
+
], Se = {
|
|
507
|
+
install(e) {
|
|
508
|
+
e.component("CodeBlock", D), e.component("VueCodeBlock", D);
|
|
551
509
|
}
|
|
552
510
|
};
|
|
553
511
|
export {
|
|
554
512
|
D as CodeBlock,
|
|
555
|
-
|
|
556
|
-
|
|
513
|
+
Ce as SUPPORTED_CODE_BLOCK_LANGUAGES,
|
|
514
|
+
Se as default,
|
|
557
515
|
n as escapeCodeHtml,
|
|
558
|
-
|
|
559
|
-
|
|
516
|
+
me as highlightCodeBlock,
|
|
517
|
+
_e as highlightCodeLine
|
|
560
518
|
};
|
package/dist/index.umd.cjs
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
(function(
|
|
2
|
-
/*$vite$:1*/`,document.head.appendChild(
|
|
1
|
+
(function(h,i){typeof exports=="object"&&typeof module<"u"?i(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],i):(h=typeof globalThis<"u"?globalThis:h||self,i(h.VueCodeBlock={},h.Vue))})(this,(function(h,i){"use strict";var N=document.createElement("style");N.textContent=`.vcb{display:grid;gap:var(--vcb-gap, 0);border:1px solid var(--vcb-border-color, color-mix(in srgb, var(--vf-color-border, rgba(15, 23, 42, .12)) 92%, #cbd5e1));border-radius:var(--vcb-border-radius, var(--vf-radius-control, var(--vf-radius-surface, var(--vf-radius, .625rem))));background:var(--vcb-background-color, var(--vf-color-bg, #ffffff));color:var(--vcb-text-color, var(--vf-color-text, #1f232b));font-family:var(--vcb-font-family, var(--vf-font-family-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace));font-size:var(--vcb-font-size, var(--vf-font-size-sm, .8125rem));line-height:var(--vcb-line-height, var(--vf-line-height-normal, 1.5));overflow:hidden}.vcb__header{display:flex;align-items:center;justify-content:space-between;gap:var(--vcb-header-gap, .75rem);min-height:0;padding:var(--vcb-header-padding, .4rem .75rem);border-bottom:1px solid var(--vcb-header-border-color, color-mix(in srgb, var(--vf-color-border, rgba(15, 23, 42, .12)) 78%, transparent));background:var(--vcb-header-background-color, var(--vcb-background-color, var(--vf-color-bg, #ffffff)));opacity:var(--vcb-header-opacity, .9)}.vcb__meta{display:inline-flex;align-items:center;gap:var(--vcb-meta-gap, .55rem);color:var(--vcb-meta-color, var(--vf-color-muted, #616773));font-size:var(--vcb-meta-font-size, var(--vf-font-size-sm, .75rem));letter-spacing:0}.vcb__filename{color:var(--vcb-filename-color, var(--vf-color-text, #1f232b));font-weight:var(--vcb-filename-font-weight, var(--vf-font-weight-semibold, 600))}.vcb__actions{display:inline-flex;align-items:center;gap:var(--vcb-actions-gap, .45rem)}.vcb__copy{border:1px solid var(--vcb-action-border-color, color-mix(in srgb, var(--vf-color-border, rgba(15, 23, 42, .12)) 80%, transparent));border-radius:var(--vcb-action-border-radius, var(--vf-radius-control-tight, .375rem));background:var(--vcb-action-background-color, var(--vf-color-bg, #ffffff));color:var(--vcb-action-text-color, var(--vf-color-text, #1f232b));padding:var(--vcb-action-padding, .125rem .5rem);font-size:var(--vcb-action-font-size, var(--vf-font-size-sm, .75rem));font-weight:var(--vcb-action-font-weight, var(--vf-text-body-font-weight, 400));opacity:var(--vcb-action-opacity, .88)}.vcb__pre{margin:0;padding:var(--vcb-padding, var(--vf-prose-code-block-padding, .75rem .9rem));background:var(--vcb-code-background-color, transparent);overflow:auto;white-space:pre}.vcb__pre_wrap{white-space:pre-wrap;word-break:break-word}.vcb__line{display:flex;align-items:baseline;gap:var(--vcb-line-gap, .7rem)}.vcb__line-number{text-align:right;color:var(--vcb-line-number-color, var(--vf-color-muted, #616773));min-width:var(--vcb-line-number-min-width, 2.1rem);-webkit-user-select:none;user-select:none}.vcb__line-content{white-space:inherit}.vcb__token_keyword{color:var(--vcb-token-keyword-color, var(--vf-color-help, #8553a1))}.vcb__token_string{color:var(--vcb-token-string-color, var(--vf-color-success, #2e7d32))}.vcb__token_number{color:var(--vcb-token-number-color, var(--vf-color-warn, #9f8400))}.vcb__token_comment{color:var(--vcb-token-comment-color, var(--vf-color-muted, #616773))}.vcb__token_variable{color:var(--vcb-token-variable-color, var(--vf-color-text, #1f232b))}.vcb__token_identifier{color:var(--vcb-token-identifier-color, var(--vf-color-info, #0069ba))}.vcb__token_function{color:var(--vcb-token-function-color, var(--vf-color-primary, #0e639c))}.vcb__token_property{color:var(--vcb-token-property-color, var(--vf-color-primary, #0e639c))}.vcb__token_operator{color:var(--vcb-token-operator-color, var(--vf-color-danger, #c72e39))}.vcb__token_tag{color:var(--vcb-token-tag-color, var(--vf-color-primary, #0e639c))}.vcb__token_selector{color:var(--vcb-token-selector-color, var(--vf-color-primary, #0e639c))}.vcb__token_component{color:var(--vcb-token-component-color, var(--vf-color-info, #0069ba))}.vcb__token_attribute{color:var(--vcb-token-attribute-color, var(--vf-color-help, #8553a1))}.vcb__token_directive{color:var(--vcb-token-directive-color, var(--vf-color-help, #8553a1))}.vcb[data-theme=dark],:root[data-theme=dark] .vcb:not([data-theme=light]),[data-theme=dark] .vcb:not([data-theme=light]){--vcb-background-color: var( --vcb-dark-background-color, var(--vf-color-bg, #1e1e1e) );--vcb-text-color: var(--vcb-dark-text-color, var(--vf-color-text, #d4d4d4));--vcb-border-color: var( --vcb-dark-border-color, color-mix(in srgb, var(--vf-color-border, #3c3c3c) 88%, black) );--vcb-header-border-color: var( --vcb-dark-header-border-color, color-mix(in srgb, var(--vf-color-border, #3c3c3c) 72%, transparent) );--vcb-header-background-color: var( --vcb-dark-header-background-color, transparent );--vcb-meta-color: var(--vcb-dark-meta-color, var(--vf-color-muted, #9da0a6));--vcb-filename-color: var( --vcb-dark-filename-color, var(--vf-color-text, #d4d4d4) );--vcb-action-border-color: var( --vcb-dark-action-border-color, color-mix(in srgb, var(--vf-color-border, #3c3c3c) 76%, transparent) );--vcb-action-background-color: var( --vcb-dark-action-background-color, color-mix(in srgb, var(--vf-color-surface, #252526) 72%, transparent) );--vcb-action-text-color: var( --vcb-dark-action-text-color, var(--vf-color-text, #d4d4d4) );--vcb-line-number-color: var( --vcb-dark-line-number-color, var(--vf-color-muted, #9da0a6) );--vcb-token-keyword-color: var( --vcb-dark-token-keyword-color, var(--vf-color-help, #c586c0) );--vcb-token-string-color: var( --vcb-dark-token-string-color, var(--vf-color-success, #6a9955) );--vcb-token-number-color: var( --vcb-dark-token-number-color, var(--vf-color-warn, #d7ba7d) );--vcb-token-comment-color: var(--vcb-dark-token-comment-color, #6a9955);--vcb-token-variable-color: var( --vcb-dark-token-variable-color, var(--vf-color-text, #d4d4d4) );--vcb-token-tag-color: var( --vcb-dark-token-tag-color, var(--vf-color-primary, #569cd6) );--vcb-token-selector-color: var( --vcb-dark-token-selector-color, var(--vf-color-warn, #d7ba7d) );--vcb-token-component-color: var( --vcb-dark-token-component-color, var(--vf-color-info, #4ec9b0) );--vcb-token-attribute-color: var(--vcb-dark-token-attribute-color, #9cdcfe);--vcb-token-directive-color: var(--vcb-dark-token-directive-color, #c586c0);--vcb-token-identifier-color: var(--vcb-dark-token-identifier-color, #9cdcfe);--vcb-token-function-color: var( --vcb-dark-token-function-color, var(--vf-color-contrast, #dcdcaa) );--vcb-token-property-color: var(--vcb-dark-token-property-color, #9cdcfe);--vcb-token-operator-color: var(--vcb-dark-token-operator-color, #d4d4d4)}.vcb[data-theme=light],:root:not([data-theme=dark]) .vcb:not([data-theme=dark]),[data-theme=light] .vcb,[data-vf-theme=light] .vcb,:root:not([data-vf-theme=dark]) .vcb:not([data-theme=dark]){box-shadow:var(--vcb-shadow, 0 1px 2px rgba(15, 23, 42, .04))}.vcb_disabled{opacity:var(--vcb-disabled-opacity, .6)}
|
|
2
|
+
/*$vite$:1*/`,document.head.appendChild(N);const o=e=>e.replaceAll("&","&").replaceAll("<","<").replaceAll(">",">"),W=e=>e.replaceAll(""",'"').replaceAll("'","'").replaceAll("<","<").replaceAll(">",">").replaceAll("&","&"),B=e=>o(e),s=(e,c)=>`<span class="vcb__token ${e}">${c}</span>`,I="\\b\\d(?:[\\d_]*\\d)?(?:\\.\\d(?:[\\d_]*\\d)?)?\\b",R="\\b-?\\d(?:[\\d_]*\\d)?(?:\\.\\d(?:[\\d_]*\\d)?)?(?:px|rem|em|%|vh|vw|fr|s|ms|deg)?\\b",L=e=>e.startsWith(":")||e.startsWith("@")||e.startsWith("#")||e.startsWith("v-"),O=e=>/^[A-Z]/.test(e),F=e=>{let c=0,r=s("vcb__token_string",o("`"));for(;c<e.length-1;){const t=e.indexOf("${",c),a=t===-1?e.length-1:t,n=e.slice(c,a);if(n&&(r+=s("vcb__token_string",o(n))),t===-1)break;r+=o("${");let d=t+2,l=1;for(;d<e.length&&l>0;){const v=e[d];v==="{"?l+=1:v==="}"&&(l-=1),d+=1}const b=e.slice(t+2,d-1);r+=E(b),r+=o("}"),c=d}return r+=s("vcb__token_string",o("`")),r},E=e=>T(e),U=e=>{if(e.length<2)return s("vcb__token_string",e);const c=e[0],r=W(e.slice(1,-1)),t=E(r),a=c==='"'?""":"'";return`${a}${t}${a}`},S=(e,c,r,t,a)=>{const n=r?E(W(e)):s("vcb__token_string",o(e)),d=c==='"'?""":"'";return`${t?d:""}${n}${a?d:""}`},V=e=>e.replaceAll(/{{\s*([\s\S]*?)\s*}}/g,(c,r)=>{const t=E(r);return`${o("{{ ")}${t}${o(" }}")}`}),M=e=>e.replaceAll(/(\s+)([:@#]?[\w-]+(?::[\w-]+)?)(\s*=\s*)?("[^"]*"|'[^']*')?/g,(c,r,t,a="",n="")=>`${o(r)}${s(L(t)?"vcb__token_directive":"vcb__token_attribute",o(t))}${o(a)}${n?L(t)?U(n):s("vcb__token_string",o(n)):""}`),z=e=>{const c=e.match(/^(\s*)<([/\w-]+)([\s\S]*)$/);if(!c)return o(e);const[,r,t,a]=c,n=t.startsWith("/"),d=n?t.slice(1):t,l=O(d)?"vcb__token_component":"vcb__token_tag";return`${o(r)}${o(n?"</":"<")}${s(l,o(d))}${M(String(a))}`},G=e=>{if(e.startsWith("<!--")&&e.endsWith("-->"))return s("vcb__token_comment",o(e));const c=e.startsWith("</"),r=e.endsWith("/>"),a=e.slice(c?2:1,e.length-(r?2:1)).match(/^([\w-]+)([\s\S]*)$/);if(!a)return o(e);const[,n,d]=a,l=O(n)?"vcb__token_component":"vcb__token_tag";return`${o(c?"</":"<")}${s(l,o(n))}${M(d)}${o(r?"/>":">")}`},J=e=>o(e).replaceAll(/"(?:[^"\\]|\\.)*"(?=\s*:)?/g,r=>s("vcb__token_string",r)).replaceAll(/\b(true|false|null)\b/g,r=>s("vcb__token_keyword",r)).replaceAll(/\b-?\d(?:[\d_]*\d)?(?:\.\d(?:[\d_]*\d)?)?(?:[eE][+-]?\d(?:[\d_]*\d)?)?\b/g,r=>s("vcb__token_number",r)),Q=(e,c)=>{for(let r=c-1;r>=0;r-=1){const t=e[r];if(!/\s/.test(t))return t}return""},P=(e,c)=>{for(let r=c;r<e.length;r+=1){const t=e[r];if(!/\s/.test(t))return t}return""},K=(e,c)=>{let r=c;for(;r>0&&/\s/.test(e[r-1]);)r-=1;return e.slice(0,r).match(/([A-Za-z_$][\w$]*)\s*$/)?.[1]??""},X=(e,c,r)=>{const t=Q(e,r),a=P(e,r+c.length),n=K(e,r),d=e.slice(0,r);return t==="."||/\?\.\s*$/.test(d)||a===":"&&["{",",",""].includes(t)?"vcb__token_property":a==="("?"vcb__token_function":/^[A-Z]/.test(c)||["import","from","new","class","extends"].includes(n)?"vcb__token_identifier":"vcb__token_variable"},T=e=>{const c=new RegExp(`(//.*$)|((["'\`])(?:\\\\.|(?!\\3).)*\\3)|\\b(const|let|var|function|return|if|else|for|while|class|new|import|export|from|await|async|try|catch|throw|true|false|null|undefined)\\b|(=>|\\?\\?|\\?|:|\\.|[{}()[\\],])|${I}|\\b[A-Za-z_$][\\w$]*\\b`,"g");let r=0,t="";for(const a of e.matchAll(c)){const n=a[0]??"",d=a.index??0;t+=o(e.slice(r,d)),a[1]?t+=s("vcb__token_comment",o(n)):a[2]?t+=n.startsWith("`")&&n.includes("${")?F(n):s("vcb__token_string",o(n)):a[4]?t+=s("vcb__token_keyword",o(n)):a[5]?t+=s("vcb__token_operator",o(n)):/^\d/.test(n)?t+=s("vcb__token_number",o(n)):t+=s(X(e,n,d),o(n)),r=d+n.length}return t+=o(e.slice(r)),t},Y=(e,c)=>{let r=null;for(let t=c+1;t<e.length;t+=1){const a=e[t];if(r){a===r&&e[t-1]!=="\\"&&(r=null);continue}if(a==='"'||a==="'"){r=a;continue}if(a===">")return t}return-1},w=e=>{if(!e.trim())return o(e);let c=0,r="";for(;c<e.length;){const t=e.indexOf("<",c);if(t===-1){r+=V(o(e.slice(c)));break}r+=V(o(e.slice(c,t)));const a=Y(e,t);if(a===-1){r+=o(e.slice(t));break}r+=G(e.slice(t,a+1)),c=a+1}return r},ee=e=>{const c=e.match(/^(\s*)(npm)(\s+)(run)(\s+)([^\s].*)$/);if(c){const[,l,b,v,u,m,f]=c;return`${o(l)}${s("vcb__token_keyword",o(b))}${o(v)}${s("vcb__token_function",o(u))}${o(m)}${s("vcb__token_variable",o(f))}`}const r=l=>{const b=/(\s+)|((["'])(?:\\.|(?!\3).)*\3)|(\$[A-Za-z_][A-Za-z0-9_]*)|(@[A-Za-z0-9._/-]+|[A-Za-z0-9._-]+\/[A-Za-z0-9._/@-]+)|(-{1,2}[A-Za-z][\w-]*)(?:=(\S+))?|([^\s]+)/g;let v=0,u="";for(const m of l.matchAll(b)){const f=m[0]??"",x=m.index??0;u+=o(l.slice(v,x)),m[1]?u+=o(f):m[2]?u+=s("vcb__token_string",o(f)):m[4]?u+=s("vcb__token_variable",o(f)):m[5]?u+=s("vcb__token_string",o(f)):m[6]?(u+=s("vcb__token_directive",o(m[6])),m[7]&&(u+=`${o("=")}${s(m[7].startsWith("@")||m[7].includes("/")?"vcb__token_string":"vcb__token_variable",o(m[7]))}`)):m[8]?u+=s("vcb__token_variable",o(f)):u+=o(f),v=x+f.length}return u+=o(l.slice(v)),u},t=e.match(/^(\s*)(npm|pnpm|yarn|bun)(\s+)(i|install|add|remove|rm|uninstall|create|dlx|exec|x)(\s+)(.+)$/);if(t){const[,l,b,v,u,m,f]=t;return`${o(l)}${s("vcb__token_keyword",o(b))}${o(v)}${s("vcb__token_function",o(u))}${o(m)}${r(f)}`}const a=/(#[^\n]*$)|((["'])(?:\\.|(?!\3).)*\3)|(\$[A-Za-z_][A-Za-z0-9_]*)|(@[A-Za-z0-9._/-]+)|(^\s*[A-Za-z][\w-]*\b)|(\s-[A-Za-z-]+\b|\s--[A-Za-z-]+\b)/g;let n=0,d="";for(const l of e.matchAll(a)){const b=l[0]??"",v=l.index??0;if(d+=o(e.slice(n,v)),l[1])d+=s("vcb__token_comment",o(b));else if(l[2])d+=s("vcb__token_string",o(b));else if(l[4])d+=s("vcb__token_variable",o(b));else if(l[5])d+=s("vcb__token_string",o(b));else if(l[6])d+=s("vcb__token_keyword",o(b.trimStart()));else if(l[7]){const u=b.match(/^\s*/)?.[0]??"";d+=`${o(u)}${s("vcb__token_directive",o(b.trimStart()))}`}else d+=o(b);n=v+b.length}return d+=o(e.slice(n)),d},D=e=>{const c=new RegExp(`(\\/\\*.*?\\*\\/)|((["'])(?:\\\\.|(?!\\3).)*\\3)|(#[0-9A-Fa-f]{3,8})|(@[A-Za-z-]+)|([A-Za-z_-][\\w-]*)(?=\\s*\\()|${R}|\\b[A-Za-z_-][\\w-]*\\b`,"g");let r=0,t="";for(const a of e.matchAll(c)){const n=a[0]??"",d=a.index??0;t+=o(e.slice(r,d)),a[1]?t+=s("vcb__token_comment",o(n)):a[2]?t+=s("vcb__token_string",o(n)):/^#[0-9A-Fa-f]{3,8}$/.test(n)?t+=s("vcb__token_number",o(n)):n.startsWith("@")?t+=s("vcb__token_keyword",o(n)):P(e,d+n.length)==="("?t+=s("vcb__token_function",o(n)):/^-?\d/.test(n)?t+=s("vcb__token_number",o(n)):t+=s("vcb__token_variable",o(n)),r=d+n.length}return t+=o(e.slice(r)),t},te=e=>{const c=e.match(/^(\s*)(\/\*.*\*\/)(\s*)$/);if(c)return`${o(c[1])}${s("vcb__token_comment",o(c[2]))}${o(c[3])}`;const r=e.match(/^(\s*)([^{}][^{}]*?)(\s*)(\{|\})\s*$/);if(r){const[,a,n,d,l]=r,b=n.trim(),v=b===":root"||b.startsWith(".")||b.startsWith("#")||/^[A-Za-z_-][\w-]*$/.test(b)?"vcb__token_selector":"vcb__token_variable";return`${o(a)}${s(v,o(b))}${o(d)}${o(l)}`}const t=e.match(/^(\s*)(--?[A-Za-z_][\w-]*|[A-Za-z_][\w-]*)(\s*:\s*)(.*)$/);if(t){const[,a,n,d,l]=t;return`${o(a)}${s("vcb__token_property",o(n))}${o(d)}${D(l)}`}return D(e)},H=(e,c,r=!0)=>{if(!r)return B(c);const t=e.toLowerCase();return t.includes("json")?J(c):t.includes("vue")||t.includes("html")?w(c):t.includes("js")||t.includes("ts")||t.includes("javascript")||t.includes("typescript")?T(c):t.includes("bash")||t.includes("shell")||t==="sh"?ee(c):t.includes("css")||t.includes("scss")||t.includes("sass")?te(c):B(c)},oe=(e,c)=>{const r=(e||"").replace(/\r\n/g,`
|
|
3
3
|
`).split(`
|
|
4
|
-
`);let t=!1,a=null,
|
|
5
|
-
`)},
|
|
4
|
+
`);let t=!1,a=null,n=null;return r.map(d=>{const l=d;if(!c)return B(l);const b=o(l),v=b.trim();if(!v)return b;if(/^<script\b/i.test(v)){a="script";const f=v.includes(">");return t=!f,f?w(l):z(l)}if(/^<template\b/i.test(v)){a="template";const f=v.includes(">");return t=!f,f?w(l):z(l)}if(/^<style\b/i.test(v)){a="style";const f=v.includes(">");return t=!f,f?w(l):z(l)}if(/^<\/script>/i.test(v)||/^<\/template>/i.test(v)||/^<\/style>/i.test(v))return a=null,t=!1,w(l);const u=v.startsWith("<")&&!v.startsWith("</"),m=v.includes(">");if(u){const f=m?w(l):z(l);return t=!m,f}if(t){if(v===">"||v==="/>")return t=!1,n=null,b;if(n){const k=n,y=l.indexOf(n.quote);if(y===-1)return S(l,k.quote,k.directive,!1,!1);const A=l.slice(0,y),g=l.slice(y+1),_=o(g);return n=null,g.includes(">")&&(t=!1),`${S(A,k.quote,k.directive,!1,!0)}${_}`}const f=l.match(/^(\s+)([:@#]?[\w-]+(?::[\w-]+)?)(\s*=\s*)(["'])([\s\S]*)$/);if(f){const[,k,y,A,g,_]=f,$=L(y),p=_.indexOf(g),C=`${k}${s($?"vcb__token_directive":"vcb__token_attribute",y)}${o(A)}`;if(p===-1)return n={quote:g,directive:$},`${C}${S(_,g,$,!0,!1)}`;const me=_.slice(0,p),q=_.slice(p+1);return q.includes(">")&&(t=!1),`${C}${S(me,g,$,!0,!0)}${o(q)}`}const x=M(b);return m&&(t=!1),x}return a==="script"?T(l):w(l)}).join(`
|
|
5
|
+
`)},j=(e,c,r=!0)=>{const t=e.toLowerCase();return t.includes("vue")||t.includes("html")?oe(c,r):(c||"").replace(/\r\n/g,`
|
|
6
6
|
`).split(`
|
|
7
|
-
`).map(a=>
|
|
8
|
-
`)},
|
|
9
|
-
`)),
|
|
10
|
-
`):[""]),
|
|
11
|
-
`)),
|
|
7
|
+
`).map(a=>H(e,a,r)).join(`
|
|
8
|
+
`)},re=["data-theme","aria-label"],ce={key:0,class:"vcb__header"},ne={key:0,class:"vcb__meta"},ae={key:0,class:"vcb__filename"},le={class:"vcb__language"},ie={class:"vcb__actions"},se=["disabled"],de={key:0,class:"vcb__line-number"},ve=["innerHTML"],Z=i.defineComponent({name:"VcbCodeBlock",__name:"CodeBlock",props:{code:{default:""},language:{default:"plaintext"},filename:{default:""},showHeader:{type:Boolean,default:!0},showLineNumbers:{type:Boolean,default:!1},copyable:{type:Boolean,default:!0},copyLabel:{default:"Copy"},copiedLabel:{default:"Copied"},copiedDuration:{default:1200},languageLabel:{default:"Language"},disabled:{type:Boolean,default:!1},wrap:{type:Boolean,default:!1},highlight:{type:Boolean,default:!0},maxHeight:{default:""},ariaLabel:{default:"Code block"},theme:{default:"inherit"}},emits:["copy"],setup(e,{emit:c}){const r=e,t=c,a=i.ref(!1),n=i.ref(null),d=i.ref("light");let l=null,b=null;const v=i.computed(()=>r.code.replace(/\r\n/g,`
|
|
9
|
+
`)),u=i.computed(()=>v.value?v.value.split(`
|
|
10
|
+
`):[""]),m=i.computed(()=>j(r.language,v.value,r.highlight).split(`
|
|
11
|
+
`)),f=i.computed(()=>r.theme==="inherit"?d.value:r.theme),x=i.computed(()=>{if(r.maxHeight)return{maxHeight:r.maxHeight}}),k=async()=>{if(!r.disabled)try{typeof navigator<"u"&&navigator.clipboard?.writeText&&await navigator.clipboard.writeText(v.value)}finally{t("copy",{text:v.value}),a.value=!0,l&&clearTimeout(l),l=setTimeout(()=>{a.value=!1,l=null},r.copiedDuration)}},y=_=>_==="dark"?"dark":"light",A=(_,$)=>{let p=_?.parentElement??null;for(;p;){if(p.hasAttribute($))return y(p.getAttribute($));p=p.parentElement}return null},g=()=>{r.theme==="inherit"&&(d.value=A(n.value,"data-theme")??A(n.value,"data-vf-theme")??"light")};return i.onMounted(()=>{g(),!(typeof MutationObserver>"u"||!n.value)&&(b=new MutationObserver(()=>{g()}),b.observe(document.documentElement,{subtree:!0,childList:!0,attributes:!0,attributeFilter:["data-theme","data-vf-theme"]}))}),i.onBeforeUnmount(()=>{l&&(clearTimeout(l),l=null),b&&(b.disconnect(),b=null)}),(_,$)=>(i.openBlock(),i.createElementBlock("section",{ref_key:"rootElement",ref:n,class:i.normalizeClass(["vcb",{vcb_disabled:e.disabled}]),"data-theme":f.value,"aria-label":e.ariaLabel},[e.showHeader||_.$slots.actions?(i.openBlock(),i.createElementBlock("header",ce,[e.showHeader?(i.openBlock(),i.createElementBlock("div",ne,[e.filename?(i.openBlock(),i.createElementBlock("span",ae,i.toDisplayString(e.filename),1)):i.createCommentVNode("",!0),i.createElementVNode("span",le,i.toDisplayString(e.languageLabel)+": "+i.toDisplayString(e.language),1)])):i.createCommentVNode("",!0),i.createElementVNode("div",ie,[i.renderSlot(_.$slots,"actions"),e.copyable?(i.openBlock(),i.createElementBlock("button",{key:0,type:"button",class:"vcb__copy",disabled:e.disabled,onClick:k},i.toDisplayString(a.value?e.copiedLabel:e.copyLabel),9,se)):i.createCommentVNode("",!0)])])):i.createCommentVNode("",!0),i.createElementVNode("pre",{class:i.normalizeClass(["vcb__pre",{vcb__pre_wrap:e.wrap}]),style:i.normalizeStyle(x.value)},[i.createElementVNode("code",null,[(i.openBlock(!0),i.createElementBlock(i.Fragment,null,i.renderList(u.value,(p,C)=>(i.openBlock(),i.createElementBlock("span",{key:C,class:"vcb__line"},[e.showLineNumbers?(i.openBlock(),i.createElementBlock("span",de,i.toDisplayString(C+1),1)):i.createCommentVNode("",!0),i.createElementVNode("span",{class:"vcb__line-content",innerHTML:m.value[C]??""},null,8,ve)]))),128))])],6)],10,re))}}),be=["plaintext","text","txt","js","javascript","ts","typescript","vue","html","json","bash","shell","sh","css","scss","sass"],fe={install(e){e.component("CodeBlock",Z),e.component("VueCodeBlock",Z)}};h.CodeBlock=Z,h.SUPPORTED_CODE_BLOCK_LANGUAGES=be,h.default=fe,h.escapeCodeHtml=o,h.highlightCodeBlock=j,h.highlightCodeLine=H,Object.defineProperties(h,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@codemonster-ru/vue-codeblock",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.1.1",
|
|
4
4
|
"description": "Standalone Vue code block component with syntax highlighting and light/dark theming.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "Kirill Kolesnikov",
|
|
@@ -48,7 +48,7 @@
|
|
|
48
48
|
"access": "public"
|
|
49
49
|
},
|
|
50
50
|
"scripts": {
|
|
51
|
-
"dev": "vite",
|
|
51
|
+
"dev": "vite --force",
|
|
52
52
|
"build": "vite build",
|
|
53
53
|
"format": "prettier --write .",
|
|
54
54
|
"typecheck": "vue-tsc --noEmit",
|