@haklex/rich-ext-embed 0.0.3 → 0.0.5
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/index.mjs +196 -100
- package/dist/nodes/EmbedNode.d.ts.map +1 -1
- package/dist/renderers/EmbedLinkRenderer.d.ts.map +1 -1
- package/dist/renderers/EmbedStaticRenderer.d.ts.map +1 -1
- package/dist/rich-ext-embed.css +163 -166
- package/dist/styles-static.css.d.ts +57 -1
- package/dist/styles-static.css.d.ts.map +1 -1
- package/dist/styles.css.d.ts +39 -1
- package/dist/styles.css.d.ts.map +1 -1
- package/package.json +3 -3
package/dist/index.mjs
CHANGED
|
@@ -7,11 +7,44 @@ import { jsx, jsxs } from "react/jsx-runtime";
|
|
|
7
7
|
import { useColorScheme } from "@haklex/rich-editor";
|
|
8
8
|
import { Github, ExternalLink, Trash2, Code } from "lucide-react";
|
|
9
9
|
import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
|
|
10
|
+
var semanticClassNames$1 = { wrapper: "rich-embed-link-wrapper", embed: "rich-embed", badge: "rich-embed__badge", dot: "rich-embed__dot", divider: "rich-embed__divider", input: "rich-embed__input", actions: "rich-embed__actions", actionButton: "rich-embed__action-btn", actionButtonDanger: "rich-embed__action-btn--danger" };
|
|
11
|
+
var semanticEmbedModifierClass = { generic: "rich-embed--generic", tweet: "rich-embed--tweet", youtube: "rich-embed--youtube", codesandbox: "rich-embed--codesandbox", bilibili: "rich-embed--bilibili", "github-file": "rich-embed--github-file", "github-gist": "rich-embed--github-gist", thinking: "rich-embed--thinking" };
|
|
12
|
+
var wrapper = "_1qucygc1";
|
|
13
|
+
var embed = "_1qucygc2";
|
|
14
|
+
var embedType = { generic: "_1qucygc3", tweet: "_1qucygc4", youtube: "_1qucygc5", codesandbox: "_1qucygc6", bilibili: "_1qucygc7", "github-file": "_1qucygc8", "github-gist": "_1qucygc9", thinking: "_1qucygca" };
|
|
15
|
+
var badge = "_1qucygcb";
|
|
16
|
+
var dot = "_1qucygcc";
|
|
17
|
+
var divider = "_1qucygcd";
|
|
18
|
+
var input = "_1qucygce";
|
|
19
|
+
var actions = "_1qucygcf";
|
|
20
|
+
var actionButton = "_1qucygcg";
|
|
21
|
+
var actionButtonDanger = "_1qucygch";
|
|
10
22
|
const EmbedRendererCtx = createContext({});
|
|
11
23
|
const EmbedRendererProvider = EmbedRendererCtx.Provider;
|
|
12
24
|
function useEmbedRenderers() {
|
|
13
25
|
return use(EmbedRendererCtx);
|
|
14
26
|
}
|
|
27
|
+
var semanticClassNames = { ratioContainer: "embed-static-ratio-container", ratioInner: "embed-static-ratio-inner", iframe: "embed-static-iframe", gist: "embed-static-gist", gistIframe: "embed-static-gist__iframe", sourceLink: "embed-static-source-link", githubFile: "embed-static-github-file", githubFileCode: "embed-static-github-file__code", githubFileCodeLong: "embed-static-github-file__code--long", githubFileLine: "embed-static-github-file__line", githubFileLineNum: "embed-static-github-file__line-num", shiki: "embed-static-shiki", fallback: "embed-static-fallback", fallbackBadge: "embed-static-fallback__badge", fallbackDot: "embed-static-fallback__dot", fallbackLink: "embed-static-fallback__link", tweet: "embed-static-tweet", loading: "embed-static-loading" };
|
|
28
|
+
var semanticFallbackModifierClass = { generic: "embed-static-fallback--generic", tweet: "embed-static-fallback--tweet", youtube: "embed-static-fallback--youtube", codesandbox: "embed-static-fallback--codesandbox", bilibili: "embed-static-fallback--bilibili", "github-file": "embed-static-fallback--github-file", "github-gist": "embed-static-fallback--github-gist", thinking: "embed-static-fallback--thinking" };
|
|
29
|
+
var ratioContainer = "_1xclnej1";
|
|
30
|
+
var ratioInner = "_1xclnej2";
|
|
31
|
+
var iframe = "_1xclnej3";
|
|
32
|
+
var gist = "_1xclnej4";
|
|
33
|
+
var gistIframe = "_1xclnej5";
|
|
34
|
+
var sourceLink = "_1xclnej6";
|
|
35
|
+
var githubFile = "_1xclnej7";
|
|
36
|
+
var githubFileCode = "_1xclnej8";
|
|
37
|
+
var githubFileCodeLong = "_1xclnej9";
|
|
38
|
+
var githubFileLine = "_1xclneja";
|
|
39
|
+
var githubFileLineNum = "_1xclnejb";
|
|
40
|
+
var shiki = "_1xclnejc";
|
|
41
|
+
var fallback = "_1xclnejd";
|
|
42
|
+
var fallbackType = { generic: "_1xclneje", tweet: "_1xclnejf", youtube: "_1xclnejg", codesandbox: "_1xclnejh", bilibili: "_1xclneji", "github-file": "_1xclnejj", "github-gist": "_1xclnejk", thinking: "_1xclnejl" };
|
|
43
|
+
var fallbackBadge = "_1xclnejm";
|
|
44
|
+
var fallbackDot = "_1xclnejn";
|
|
45
|
+
var fallbackLink = "_1xclnejo";
|
|
46
|
+
var tweet = "_1xclnejp";
|
|
47
|
+
var loading = "_1xclnejq";
|
|
15
48
|
const extToLang = {
|
|
16
49
|
".js": "javascript",
|
|
17
50
|
".ts": "typescript",
|
|
@@ -56,9 +89,9 @@ const extToLang = {
|
|
|
56
89
|
".r": "r"
|
|
57
90
|
};
|
|
58
91
|
function getLangFromPath(path) {
|
|
59
|
-
const
|
|
60
|
-
if (
|
|
61
|
-
return extToLang[path.slice(
|
|
92
|
+
const dot2 = path.lastIndexOf(".");
|
|
93
|
+
if (dot2 === -1) return "text";
|
|
94
|
+
return extToLang[path.slice(dot2).toLowerCase()] || "text";
|
|
62
95
|
}
|
|
63
96
|
const shikiPromise = import("shiki/bundle/web").catch(() => null);
|
|
64
97
|
const typeLabels$1 = {
|
|
@@ -92,31 +125,50 @@ function FixedRatioContainer({
|
|
|
92
125
|
children,
|
|
93
126
|
ratio = 58
|
|
94
127
|
}) {
|
|
95
|
-
return /* @__PURE__ */ jsx(
|
|
128
|
+
return /* @__PURE__ */ jsx(
|
|
96
129
|
"div",
|
|
97
130
|
{
|
|
98
|
-
className:
|
|
99
|
-
|
|
100
|
-
|
|
131
|
+
className: `${ratioContainer} ${semanticClassNames.ratioContainer}`,
|
|
132
|
+
children: /* @__PURE__ */ jsx(
|
|
133
|
+
"div",
|
|
134
|
+
{
|
|
135
|
+
className: `${ratioInner} ${semanticClassNames.ratioInner}`,
|
|
136
|
+
style: { paddingBottom: `${ratio}%` },
|
|
137
|
+
children
|
|
138
|
+
}
|
|
139
|
+
)
|
|
101
140
|
}
|
|
102
|
-
)
|
|
141
|
+
);
|
|
103
142
|
}
|
|
104
143
|
function FallbackLink({ url, type }) {
|
|
105
144
|
const label = type ? typeLabels$1[type] : "Embed";
|
|
106
145
|
const cssModifier = type || "generic";
|
|
146
|
+
const fallbackTypeClass = fallbackType[cssModifier];
|
|
147
|
+
const semanticModifierClass = semanticFallbackModifierClass[cssModifier];
|
|
107
148
|
return /* @__PURE__ */ jsxs(
|
|
108
149
|
"div",
|
|
109
150
|
{
|
|
110
|
-
className:
|
|
151
|
+
className: `${fallback} ${fallbackTypeClass} ${semanticClassNames.fallback} ${semanticModifierClass}`.trim(),
|
|
111
152
|
children: [
|
|
112
|
-
/* @__PURE__ */ jsxs(
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
153
|
+
/* @__PURE__ */ jsxs(
|
|
154
|
+
"span",
|
|
155
|
+
{
|
|
156
|
+
className: `${fallbackBadge} ${semanticClassNames.fallbackBadge}`,
|
|
157
|
+
children: [
|
|
158
|
+
/* @__PURE__ */ jsx(
|
|
159
|
+
"span",
|
|
160
|
+
{
|
|
161
|
+
className: `${fallbackDot} ${semanticClassNames.fallbackDot}`
|
|
162
|
+
}
|
|
163
|
+
),
|
|
164
|
+
label
|
|
165
|
+
]
|
|
166
|
+
}
|
|
167
|
+
),
|
|
116
168
|
/* @__PURE__ */ jsx(
|
|
117
169
|
"a",
|
|
118
170
|
{
|
|
119
|
-
className:
|
|
171
|
+
className: `${fallbackLink} ${semanticClassNames.fallbackLink}`,
|
|
120
172
|
href: url,
|
|
121
173
|
target: "_blank",
|
|
122
174
|
rel: "noreferrer",
|
|
@@ -136,11 +188,17 @@ function TweetRenderer({ url }) {
|
|
|
136
188
|
}
|
|
137
189
|
const id = parsedUrl.pathname.split("/").pop();
|
|
138
190
|
if (!id) return /* @__PURE__ */ jsx(FallbackLink, { url, type: "tweet" });
|
|
139
|
-
const
|
|
140
|
-
return /* @__PURE__ */ jsx(EmbedErrorBoundary, { fallback, children: /* @__PURE__ */ jsx("div", { className:
|
|
191
|
+
const fallback2 = /* @__PURE__ */ jsx(FallbackLink, { url, type: "tweet" });
|
|
192
|
+
return /* @__PURE__ */ jsx(EmbedErrorBoundary, { fallback: fallback2, children: /* @__PURE__ */ jsx("div", { className: `${tweet} ${semanticClassNames.tweet}`, children: /* @__PURE__ */ jsx(
|
|
141
193
|
Suspense,
|
|
142
194
|
{
|
|
143
|
-
fallback: /* @__PURE__ */ jsx(
|
|
195
|
+
fallback: /* @__PURE__ */ jsx(
|
|
196
|
+
"div",
|
|
197
|
+
{
|
|
198
|
+
className: `${loading} ${semanticClassNames.loading}`,
|
|
199
|
+
children: "Loading tweet..."
|
|
200
|
+
}
|
|
201
|
+
),
|
|
144
202
|
children: /* @__PURE__ */ jsx(LazyTweet, { id })
|
|
145
203
|
}
|
|
146
204
|
) }) });
|
|
@@ -166,7 +224,7 @@ function GithubFileEmbed({ url, href }) {
|
|
|
166
224
|
}
|
|
167
225
|
const [content, setContent] = useState(null);
|
|
168
226
|
const [highlightedHtml, setHighlightedHtml] = useState(null);
|
|
169
|
-
const [loading, setLoading] = useState(true);
|
|
227
|
+
const [loading$1, setLoading] = useState(true);
|
|
170
228
|
const [error, setError] = useState(false);
|
|
171
229
|
const lang = useMemo(() => getLangFromPath(path), [path]);
|
|
172
230
|
useEffect(() => {
|
|
@@ -212,8 +270,8 @@ function GithubFileEmbed({ url, href }) {
|
|
|
212
270
|
cancelled = true;
|
|
213
271
|
};
|
|
214
272
|
}, [owner, repo, ref, path, lang, startLine, endLine, shikiTheme]);
|
|
215
|
-
if (loading) {
|
|
216
|
-
return /* @__PURE__ */ jsx("div", { className:
|
|
273
|
+
if (loading$1) {
|
|
274
|
+
return /* @__PURE__ */ jsx("div", { className: `${loading} ${semanticClassNames.loading}`, children: "Loading GitHub File Preview..." });
|
|
217
275
|
}
|
|
218
276
|
if (error || content === null) {
|
|
219
277
|
return /* @__PURE__ */ jsx(FallbackLink, { url: href, type: "github-file" });
|
|
@@ -221,39 +279,58 @@ function GithubFileEmbed({ url, href }) {
|
|
|
221
279
|
const lines = content.split("\n");
|
|
222
280
|
const end = endLine ?? lines.length;
|
|
223
281
|
const isLong = end - startLine > 20;
|
|
224
|
-
return /* @__PURE__ */ jsxs(
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
{
|
|
228
|
-
|
|
229
|
-
|
|
282
|
+
return /* @__PURE__ */ jsxs(
|
|
283
|
+
"div",
|
|
284
|
+
{
|
|
285
|
+
className: `${githubFile} ${semanticClassNames.githubFile}`,
|
|
286
|
+
children: [
|
|
287
|
+
/* @__PURE__ */ jsx(
|
|
230
288
|
"div",
|
|
231
289
|
{
|
|
232
|
-
className: "
|
|
233
|
-
|
|
234
|
-
|
|
290
|
+
className: `${githubFileCode} ${semanticClassNames.githubFileCode} ${isLong ? `${githubFileCodeLong} ${semanticClassNames.githubFileCodeLong}` : ""}`.trim(),
|
|
291
|
+
children: highlightedHtml ? /* @__PURE__ */ jsx(
|
|
292
|
+
"div",
|
|
293
|
+
{
|
|
294
|
+
className: `${shiki} ${semanticClassNames.shiki}`,
|
|
295
|
+
style: { "--start-line": startLine },
|
|
296
|
+
dangerouslySetInnerHTML: { __html: highlightedHtml }
|
|
297
|
+
}
|
|
298
|
+
) : /* @__PURE__ */ jsx("pre", { children: /* @__PURE__ */ jsx("code", { children: lines.slice(startLine, end).map((line, i) => /* @__PURE__ */ jsxs(
|
|
299
|
+
"span",
|
|
300
|
+
{
|
|
301
|
+
className: `${githubFileLine} ${semanticClassNames.githubFileLine}`,
|
|
302
|
+
children: [
|
|
303
|
+
/* @__PURE__ */ jsx(
|
|
304
|
+
"span",
|
|
305
|
+
{
|
|
306
|
+
className: `${githubFileLineNum} ${semanticClassNames.githubFileLineNum}`,
|
|
307
|
+
children: startLine + i + 1
|
|
308
|
+
}
|
|
309
|
+
),
|
|
310
|
+
line,
|
|
311
|
+
"\n"
|
|
312
|
+
]
|
|
313
|
+
},
|
|
314
|
+
i
|
|
315
|
+
)) }) })
|
|
235
316
|
}
|
|
236
|
-
)
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
]
|
|
254
|
-
}
|
|
255
|
-
)
|
|
256
|
-
] });
|
|
317
|
+
),
|
|
318
|
+
/* @__PURE__ */ jsxs(
|
|
319
|
+
"a",
|
|
320
|
+
{
|
|
321
|
+
className: `${sourceLink} ${semanticClassNames.sourceLink}`,
|
|
322
|
+
href,
|
|
323
|
+
target: "_blank",
|
|
324
|
+
rel: "noreferrer",
|
|
325
|
+
children: [
|
|
326
|
+
/* @__PURE__ */ jsx(GitHubSvg, {}),
|
|
327
|
+
/* @__PURE__ */ jsx("span", { children: href })
|
|
328
|
+
]
|
|
329
|
+
}
|
|
330
|
+
)
|
|
331
|
+
]
|
|
332
|
+
}
|
|
333
|
+
);
|
|
257
334
|
}
|
|
258
335
|
function EmbedStaticRenderer({ type, url }) {
|
|
259
336
|
const customRenderers = useEmbedRenderers();
|
|
@@ -279,7 +356,7 @@ function EmbedStaticRenderer({ type, url }) {
|
|
|
279
356
|
"iframe",
|
|
280
357
|
{
|
|
281
358
|
src: `https://www.youtube.com/embed/${id}`,
|
|
282
|
-
className:
|
|
359
|
+
className: `${iframe} ${semanticClassNames.iframe}`,
|
|
283
360
|
allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",
|
|
284
361
|
allowFullScreen: true,
|
|
285
362
|
title: "YouTube video player"
|
|
@@ -294,7 +371,7 @@ function EmbedStaticRenderer({ type, url }) {
|
|
|
294
371
|
{
|
|
295
372
|
src: `//player.bilibili.com/player.html?bvid=${id}&autoplay=0`,
|
|
296
373
|
scrolling: "no",
|
|
297
|
-
className:
|
|
374
|
+
className: `${iframe} ${semanticClassNames.iframe}`,
|
|
298
375
|
allowFullScreen: true
|
|
299
376
|
}
|
|
300
377
|
) });
|
|
@@ -304,7 +381,7 @@ function EmbedStaticRenderer({ type, url }) {
|
|
|
304
381
|
return /* @__PURE__ */ jsx(FixedRatioContainer, { children: /* @__PURE__ */ jsx(
|
|
305
382
|
"iframe",
|
|
306
383
|
{
|
|
307
|
-
className:
|
|
384
|
+
className: `${iframe} ${semanticClassNames.iframe}`,
|
|
308
385
|
src: `https://codesandbox.io/embed/${path}?fontsize=14&hidenavigation=1&theme=dark${parsedUrl.search}`
|
|
309
386
|
}
|
|
310
387
|
) });
|
|
@@ -312,18 +389,18 @@ function EmbedStaticRenderer({ type, url }) {
|
|
|
312
389
|
case "github-gist": {
|
|
313
390
|
const [, owner, id] = parsedUrl.pathname.split("/");
|
|
314
391
|
if (!owner || !id) return /* @__PURE__ */ jsx(FallbackLink, { url, type });
|
|
315
|
-
return /* @__PURE__ */ jsxs("div", { className:
|
|
392
|
+
return /* @__PURE__ */ jsxs("div", { className: `${gist} ${semanticClassNames.gist}`, children: [
|
|
316
393
|
/* @__PURE__ */ jsx(
|
|
317
394
|
"iframe",
|
|
318
395
|
{
|
|
319
396
|
src: `https://gist.github.com/${owner}/${id}.pibb`,
|
|
320
|
-
className:
|
|
397
|
+
className: `${gistIframe} ${semanticClassNames.gistIframe}`
|
|
321
398
|
}
|
|
322
399
|
),
|
|
323
400
|
/* @__PURE__ */ jsxs(
|
|
324
401
|
"a",
|
|
325
402
|
{
|
|
326
|
-
className:
|
|
403
|
+
className: `${sourceLink} ${semanticClassNames.sourceLink}`,
|
|
327
404
|
href: url,
|
|
328
405
|
target: "_blank",
|
|
329
406
|
rel: "noreferrer",
|
|
@@ -358,7 +435,7 @@ class EmbedNode extends DecoratorNode {
|
|
|
358
435
|
}
|
|
359
436
|
createDOM(_config) {
|
|
360
437
|
const div = document.createElement("div");
|
|
361
|
-
div.className =
|
|
438
|
+
div.className = `${wrapper} ${semanticClassNames$1.wrapper}`;
|
|
362
439
|
return div;
|
|
363
440
|
}
|
|
364
441
|
updateDOM() {
|
|
@@ -497,49 +574,68 @@ function EmbedLinkRenderer({
|
|
|
497
574
|
}, [url]);
|
|
498
575
|
const label = type ? typeLabels[type] : "Embed";
|
|
499
576
|
const cssModifier = type || "generic";
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
577
|
+
const embedModifierClass = embedType[cssModifier];
|
|
578
|
+
const semanticModifierClass = semanticEmbedModifierClass[cssModifier];
|
|
579
|
+
return /* @__PURE__ */ jsxs(
|
|
580
|
+
"div",
|
|
581
|
+
{
|
|
582
|
+
className: `${embed} ${embedModifierClass} ${semanticClassNames$1.embed} ${semanticModifierClass}`.trim(),
|
|
583
|
+
children: [
|
|
584
|
+
/* @__PURE__ */ jsxs("span", { className: `${badge} ${semanticClassNames$1.badge}`, children: [
|
|
585
|
+
/* @__PURE__ */ jsx("span", { className: `${dot} ${semanticClassNames$1.dot}` }),
|
|
586
|
+
label
|
|
587
|
+
] }),
|
|
588
|
+
/* @__PURE__ */ jsx(
|
|
589
|
+
"span",
|
|
590
|
+
{
|
|
591
|
+
className: `${divider} ${semanticClassNames$1.divider}`
|
|
592
|
+
}
|
|
593
|
+
),
|
|
594
|
+
/* @__PURE__ */ jsx(
|
|
595
|
+
"input",
|
|
596
|
+
{
|
|
597
|
+
ref: inputRef,
|
|
598
|
+
className: `${input} ${semanticClassNames$1.input}`,
|
|
599
|
+
type: "url",
|
|
600
|
+
value: editUrl,
|
|
601
|
+
onChange: (e) => setEditUrl(e.target.value),
|
|
602
|
+
onBlur: commitUrl,
|
|
603
|
+
onKeyDown: handleKeyDown,
|
|
604
|
+
placeholder: "https://..."
|
|
605
|
+
}
|
|
606
|
+
),
|
|
607
|
+
/* @__PURE__ */ jsxs(
|
|
608
|
+
"span",
|
|
609
|
+
{
|
|
610
|
+
className: `${actions} ${semanticClassNames$1.actions}`,
|
|
611
|
+
children: [
|
|
612
|
+
/* @__PURE__ */ jsx(
|
|
613
|
+
"button",
|
|
614
|
+
{
|
|
615
|
+
type: "button",
|
|
616
|
+
className: `${actionButton} ${semanticClassNames$1.actionButton}`,
|
|
617
|
+
onClick: handleOpen,
|
|
618
|
+
title: "Open in new tab",
|
|
619
|
+
disabled: !url,
|
|
620
|
+
children: /* @__PURE__ */ jsx(ExternalLink, {})
|
|
621
|
+
}
|
|
622
|
+
),
|
|
623
|
+
/* @__PURE__ */ jsx(
|
|
624
|
+
"button",
|
|
625
|
+
{
|
|
626
|
+
type: "button",
|
|
627
|
+
className: `${actionButton} ${semanticClassNames$1.actionButton} ${actionButtonDanger} ${semanticClassNames$1.actionButtonDanger}`,
|
|
628
|
+
onClick: handleDelete,
|
|
629
|
+
title: "Delete",
|
|
630
|
+
children: /* @__PURE__ */ jsx(Trash2, {})
|
|
631
|
+
}
|
|
632
|
+
)
|
|
633
|
+
]
|
|
634
|
+
}
|
|
635
|
+
)
|
|
636
|
+
]
|
|
637
|
+
}
|
|
638
|
+
);
|
|
543
639
|
}
|
|
544
640
|
const _EmbedEditNode = class _EmbedEditNode extends EmbedNode {
|
|
545
641
|
static clone(node) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmbedNode.d.ts","sourceRoot":"","sources":["../../src/nodes/EmbedNode.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,YAAY,EACZ,aAAa,EACb,WAAW,EACX,OAAO,EACP,qBAAqB,EACrB,MAAM,EACP,MAAM,SAAS,CAAA;AAChB,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AACvC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"EmbedNode.d.ts","sourceRoot":"","sources":["../../src/nodes/EmbedNode.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,YAAY,EACZ,aAAa,EACb,WAAW,EACX,OAAO,EACP,qBAAqB,EACrB,MAAM,EACP,MAAM,SAAS,CAAA;AAChB,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AACvC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAKzC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAEhD,MAAM,MAAM,mBAAmB,GAAG,MAAM,CACtC;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,SAAS,GAAG,IAAI,CAAA;CAAE,EACzC,qBAAqB,CACtB,CAAA;AAED,qBAAa,SAAU,SAAQ,aAAa,CAAC,YAAY,CAAC;IACxD,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,SAAS,GAAG,IAAI,CAAA;IAE1B,MAAM,CAAC,OAAO,IAAI,MAAM;IAIxB,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,SAAS,GAAG,SAAS;gBAI5B,GAAG,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,GAAG,IAAI,EAAE,GAAG,CAAC,EAAE,OAAO;IAMhE,SAAS,CAAC,OAAO,EAAE,YAAY,GAAG,WAAW;IAM7C,SAAS,IAAI,OAAO;IAIpB,QAAQ,IAAI,OAAO;IAInB,MAAM,CAAC,UAAU,CAAC,cAAc,EAAE,mBAAmB,GAAG,SAAS;IAIjE,UAAU,IAAI,mBAAmB;IAUjC,MAAM,IAAI,MAAM;IAIhB,MAAM,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAKzB,SAAS,IAAI,SAAS,GAAG,IAAI;IAI7B,SAAS,CAAC,MAAM,EAAE,SAAS,GAAG,IAAI,GAAG,IAAI;IAKzC,QAAQ,CAAC,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,YAAY,GAAG,YAAY;CAMtE;AAED,wBAAgB,gBAAgB,CAC9B,GAAG,EAAE,MAAM,EACX,MAAM,EAAE,SAAS,GAAG,IAAI,GACvB,SAAS,CAEX;AAED,wBAAgB,YAAY,CAC1B,IAAI,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,GACnC,IAAI,IAAI,SAAS,CAEnB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmbedLinkRenderer.d.ts","sourceRoot":"","sources":["../../src/renderers/EmbedLinkRenderer.tsx"],"names":[],"mappings":"AAAA,OAAO,kBAAkB,CAAA;
|
|
1
|
+
{"version":3,"file":"EmbedLinkRenderer.d.ts","sourceRoot":"","sources":["../../src/renderers/EmbedLinkRenderer.tsx"],"names":[],"mappings":"AAAA,OAAO,kBAAkB,CAAA;AAQzB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAShD,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,SAAS,GAAG,IAAI,CAAA;IACtB,GAAG,EAAE,MAAM,CAAA;IACX,OAAO,EAAE,MAAM,CAAA;CAChB;AAYD,wBAAgB,iBAAiB,CAAC,EAChC,IAAI,EACJ,GAAG,EACH,OAAO,GACR,EAAE,sBAAsB,2CA+GxB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmbedStaticRenderer.d.ts","sourceRoot":"","sources":["../../src/renderers/EmbedStaticRenderer.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"EmbedStaticRenderer.d.ts","sourceRoot":"","sources":["../../src/renderers/EmbedStaticRenderer.tsx"],"names":[],"mappings":"AAAA,OAAO,kBAAkB,CAAA;AASzB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAuDhD,MAAM,WAAW,wBAAwB;IACvC,IAAI,EAAE,SAAS,GAAG,IAAI,CAAA;IACtB,GAAG,EAAE,MAAM,CAAA;CACZ;AAgRD,wBAAgB,mBAAmB,CAAC,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE,wBAAwB,kDA+F1E"}
|
package/dist/rich-ext-embed.css
CHANGED
|
@@ -1,17 +1,133 @@
|
|
|
1
|
-
.
|
|
1
|
+
._1qucygc1 {
|
|
2
2
|
margin: 8px 0;
|
|
3
3
|
}
|
|
4
|
-
.
|
|
4
|
+
._1qucygc2 {
|
|
5
|
+
--_1qucygc0: 115, 115, 115;
|
|
6
|
+
display: flex;
|
|
7
|
+
align-items: center;
|
|
8
|
+
gap: 0;
|
|
9
|
+
padding: 0 14px;
|
|
10
|
+
height: 48px;
|
|
11
|
+
border: 1px solid color-mix(in srgb, rgb(var(--_1qucygc0)) 25%, transparent);
|
|
12
|
+
border-radius: 12px;
|
|
13
|
+
background-color: color-mix(in srgb, rgb(var(--_1qucygc0)) 12%, transparent);
|
|
14
|
+
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
|
|
15
|
+
font-size: 14px;
|
|
16
|
+
transition: border-color 0.15s ease, background-color 0.15s ease;
|
|
17
|
+
}
|
|
18
|
+
._1qucygc2:focus-within {
|
|
19
|
+
border-color: color-mix(in srgb, rgb(var(--_1qucygc0)) 50%, transparent);
|
|
20
|
+
}
|
|
21
|
+
._1qucygc4 {
|
|
22
|
+
--_1qucygc0: 29, 155, 240;
|
|
23
|
+
}
|
|
24
|
+
._1qucygc5 {
|
|
25
|
+
--_1qucygc0: 255, 0, 0;
|
|
26
|
+
}
|
|
27
|
+
._1qucygc6 {
|
|
28
|
+
--_1qucygc0: 163, 163, 163;
|
|
29
|
+
}
|
|
30
|
+
._1qucygc7 {
|
|
31
|
+
--_1qucygc0: 0, 161, 214;
|
|
32
|
+
}
|
|
33
|
+
._1qucygc8 {
|
|
34
|
+
--_1qucygc0: 110, 84, 148;
|
|
35
|
+
}
|
|
36
|
+
._1qucygc9 {
|
|
37
|
+
--_1qucygc0: 110, 84, 148;
|
|
38
|
+
}
|
|
39
|
+
._1qucygca {
|
|
40
|
+
--_1qucygc0: 139, 92, 246;
|
|
41
|
+
}
|
|
42
|
+
._1qucygcb {
|
|
43
|
+
display: inline-flex;
|
|
44
|
+
align-items: center;
|
|
45
|
+
gap: 8px;
|
|
46
|
+
flex-shrink: 0;
|
|
47
|
+
font-weight: 500;
|
|
48
|
+
font-size: 14px;
|
|
49
|
+
color: var(--rc-text-secondary);
|
|
50
|
+
white-space: nowrap;
|
|
51
|
+
user-select: none;
|
|
52
|
+
padding-right: 14px;
|
|
53
|
+
}
|
|
54
|
+
._1qucygcc {
|
|
55
|
+
width: 8px;
|
|
56
|
+
height: 8px;
|
|
57
|
+
border-radius: 50%;
|
|
58
|
+
flex-shrink: 0;
|
|
59
|
+
background-color: rgb(var(--_1qucygc0));
|
|
60
|
+
}
|
|
61
|
+
._1qucygcd {
|
|
62
|
+
width: 1px;
|
|
63
|
+
height: 20px;
|
|
64
|
+
background-color: var(--rc-border);
|
|
65
|
+
flex-shrink: 0;
|
|
66
|
+
}
|
|
67
|
+
._1qucygce {
|
|
68
|
+
flex: 1;
|
|
69
|
+
min-width: 0;
|
|
70
|
+
height: 100%;
|
|
71
|
+
font-size: 14px;
|
|
72
|
+
font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
|
|
73
|
+
color: var(--rc-text);
|
|
74
|
+
background: transparent;
|
|
75
|
+
border: none;
|
|
76
|
+
padding: 0 14px;
|
|
77
|
+
outline: none;
|
|
78
|
+
}
|
|
79
|
+
._1qucygce::placeholder {
|
|
80
|
+
color: color-mix(in srgb, var(--rc-text-secondary) 60%, transparent);
|
|
81
|
+
}
|
|
82
|
+
._1qucygcf {
|
|
83
|
+
display: flex;
|
|
84
|
+
align-items: center;
|
|
85
|
+
gap: 2px;
|
|
86
|
+
flex-shrink: 0;
|
|
87
|
+
}
|
|
88
|
+
._1qucygcg {
|
|
89
|
+
display: inline-flex;
|
|
90
|
+
align-items: center;
|
|
91
|
+
justify-content: center;
|
|
92
|
+
appearance: none;
|
|
93
|
+
border: none;
|
|
94
|
+
background: none;
|
|
95
|
+
color: var(--rc-text-secondary);
|
|
96
|
+
cursor: pointer;
|
|
97
|
+
padding: 6px;
|
|
98
|
+
border-radius: 6px;
|
|
99
|
+
transition: color 0.15s ease, background-color 0.15s ease;
|
|
100
|
+
}
|
|
101
|
+
._1qucygcg:hover {
|
|
102
|
+
color: var(--rc-text);
|
|
103
|
+
background-color: color-mix(in srgb, var(--rc-text) 8%, transparent);
|
|
104
|
+
}
|
|
105
|
+
._1qucygcg:disabled {
|
|
106
|
+
opacity: 0.3;
|
|
107
|
+
cursor: default;
|
|
108
|
+
}
|
|
109
|
+
._1qucygcg:disabled:hover {
|
|
110
|
+
background: none;
|
|
111
|
+
color: var(--rc-text-secondary);
|
|
112
|
+
}
|
|
113
|
+
._1qucygch:hover {
|
|
114
|
+
color: var(--rc-alert-caution);
|
|
115
|
+
background-color: color-mix(in srgb, var(--rc-alert-caution) 10%, transparent);
|
|
116
|
+
}
|
|
117
|
+
._1qucygcg svg {
|
|
118
|
+
width: 16px;
|
|
119
|
+
height: 16px;
|
|
120
|
+
}._1xclnej1 {
|
|
5
121
|
margin: 8px 0;
|
|
6
122
|
display: flex;
|
|
7
123
|
justify-content: center;
|
|
8
124
|
}
|
|
9
|
-
.
|
|
125
|
+
._1xclnej2 {
|
|
10
126
|
position: relative;
|
|
11
127
|
height: 0;
|
|
12
128
|
width: 100%;
|
|
13
129
|
}
|
|
14
|
-
.
|
|
130
|
+
._1xclnej3 {
|
|
15
131
|
position: absolute;
|
|
16
132
|
inset: 0;
|
|
17
133
|
width: 100%;
|
|
@@ -19,18 +135,18 @@
|
|
|
19
135
|
border: none;
|
|
20
136
|
border-radius: 8px;
|
|
21
137
|
}
|
|
22
|
-
.
|
|
138
|
+
._1xclnej4 {
|
|
23
139
|
display: flex;
|
|
24
140
|
flex-direction: column;
|
|
25
141
|
align-items: center;
|
|
26
142
|
}
|
|
27
|
-
.
|
|
143
|
+
._1xclnej5 {
|
|
28
144
|
width: 100%;
|
|
29
145
|
height: 300px;
|
|
30
146
|
border: none;
|
|
31
147
|
overflow: auto;
|
|
32
148
|
}
|
|
33
|
-
.
|
|
149
|
+
._1xclnej6 {
|
|
34
150
|
display: inline-flex;
|
|
35
151
|
align-items: flex-start;
|
|
36
152
|
gap: 8px;
|
|
@@ -41,27 +157,27 @@
|
|
|
41
157
|
text-decoration: none;
|
|
42
158
|
word-break: break-all;
|
|
43
159
|
}
|
|
44
|
-
.
|
|
160
|
+
._1xclnej6:hover {
|
|
161
|
+
color: var(--rc-text);
|
|
162
|
+
}
|
|
163
|
+
._1xclnej6 svg {
|
|
45
164
|
flex-shrink: 0;
|
|
46
165
|
margin-top: 2px;
|
|
47
166
|
}
|
|
48
|
-
.
|
|
49
|
-
color: var(--rc-text);
|
|
50
|
-
}
|
|
51
|
-
.embed-static-github-file {
|
|
167
|
+
._1xclnej7 {
|
|
52
168
|
display: flex;
|
|
53
169
|
flex-direction: column;
|
|
54
170
|
align-items: center;
|
|
55
171
|
width: 100%;
|
|
56
172
|
}
|
|
57
|
-
.
|
|
173
|
+
._1xclnej8 {
|
|
58
174
|
width: 100%;
|
|
59
175
|
overflow: auto;
|
|
60
176
|
}
|
|
61
|
-
.
|
|
177
|
+
._1xclnej9 {
|
|
62
178
|
max-height: 50vh;
|
|
63
179
|
}
|
|
64
|
-
.
|
|
180
|
+
._1xclnej8 pre {
|
|
65
181
|
margin: 0;
|
|
66
182
|
padding: 16px;
|
|
67
183
|
background: var(--rc-code-bg);
|
|
@@ -71,10 +187,10 @@
|
|
|
71
187
|
font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
|
|
72
188
|
color: var(--rc-text);
|
|
73
189
|
}
|
|
74
|
-
.
|
|
190
|
+
._1xclneja {
|
|
75
191
|
display: block;
|
|
76
192
|
}
|
|
77
|
-
.
|
|
193
|
+
._1xclnejb {
|
|
78
194
|
display: inline-block;
|
|
79
195
|
width: 4ch;
|
|
80
196
|
text-align: right;
|
|
@@ -82,10 +198,10 @@
|
|
|
82
198
|
color: color-mix(in srgb, var(--rc-text-secondary) 60%, transparent);
|
|
83
199
|
user-select: none;
|
|
84
200
|
}
|
|
85
|
-
.
|
|
201
|
+
._1xclnejc {
|
|
86
202
|
counter-reset: shiki-line var(--start-line, 0);
|
|
87
203
|
}
|
|
88
|
-
.
|
|
204
|
+
._1xclnejc pre {
|
|
89
205
|
margin: 0;
|
|
90
206
|
padding: 16px;
|
|
91
207
|
border-radius: 8px;
|
|
@@ -94,16 +210,16 @@
|
|
|
94
210
|
font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
|
|
95
211
|
overflow-x: auto;
|
|
96
212
|
}
|
|
97
|
-
.
|
|
213
|
+
._1xclnejc code {
|
|
98
214
|
font-family: inherit;
|
|
99
215
|
display: flex;
|
|
100
216
|
flex-direction: column;
|
|
101
217
|
}
|
|
102
|
-
.
|
|
218
|
+
._1xclnejc .line {
|
|
103
219
|
display: flex;
|
|
104
220
|
line-height: 1.5;
|
|
105
221
|
}
|
|
106
|
-
.
|
|
222
|
+
._1xclnejc .line::before {
|
|
107
223
|
content: counter(shiki-line);
|
|
108
224
|
counter-increment: shiki-line;
|
|
109
225
|
flex-shrink: 0;
|
|
@@ -113,42 +229,42 @@
|
|
|
113
229
|
color: color-mix(in srgb, var(--rc-text-secondary) 60%, transparent);
|
|
114
230
|
user-select: none;
|
|
115
231
|
}
|
|
116
|
-
.
|
|
117
|
-
--
|
|
232
|
+
._1xclnejd {
|
|
233
|
+
--_1xclnej0: 115, 115, 115;
|
|
118
234
|
display: flex;
|
|
119
235
|
align-items: center;
|
|
120
236
|
gap: 0;
|
|
121
237
|
padding: 0 14px;
|
|
122
238
|
height: 48px;
|
|
123
|
-
border: 1px solid
|
|
239
|
+
border: 1px solid color-mix(in srgb, rgb(var(--_1xclnej0)) 25%, transparent);
|
|
124
240
|
border-radius: 12px;
|
|
125
|
-
background-color:
|
|
241
|
+
background-color: color-mix(in srgb, rgb(var(--_1xclnej0)) 8%, transparent);
|
|
126
242
|
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
|
|
127
243
|
font-size: 14px;
|
|
128
244
|
margin: 8px 0;
|
|
129
245
|
}
|
|
130
|
-
.
|
|
131
|
-
--
|
|
246
|
+
._1xclnejf {
|
|
247
|
+
--_1xclnej0: 29, 155, 240;
|
|
132
248
|
}
|
|
133
|
-
.
|
|
134
|
-
--
|
|
249
|
+
._1xclnejg {
|
|
250
|
+
--_1xclnej0: 255, 0, 0;
|
|
135
251
|
}
|
|
136
|
-
.
|
|
137
|
-
--
|
|
252
|
+
._1xclnejh {
|
|
253
|
+
--_1xclnej0: 163, 163, 163;
|
|
138
254
|
}
|
|
139
|
-
.
|
|
140
|
-
--
|
|
255
|
+
._1xclneji {
|
|
256
|
+
--_1xclnej0: 0, 161, 214;
|
|
141
257
|
}
|
|
142
|
-
.
|
|
143
|
-
--
|
|
258
|
+
._1xclnejj {
|
|
259
|
+
--_1xclnej0: 110, 84, 148;
|
|
144
260
|
}
|
|
145
|
-
.
|
|
146
|
-
--
|
|
261
|
+
._1xclnejk {
|
|
262
|
+
--_1xclnej0: 110, 84, 148;
|
|
147
263
|
}
|
|
148
|
-
.
|
|
149
|
-
--
|
|
264
|
+
._1xclnejl {
|
|
265
|
+
--_1xclnej0: 139, 92, 246;
|
|
150
266
|
}
|
|
151
|
-
.
|
|
267
|
+
._1xclnejm {
|
|
152
268
|
display: inline-flex;
|
|
153
269
|
align-items: center;
|
|
154
270
|
gap: 8px;
|
|
@@ -160,14 +276,14 @@
|
|
|
160
276
|
user-select: none;
|
|
161
277
|
padding-right: 14px;
|
|
162
278
|
}
|
|
163
|
-
.
|
|
279
|
+
._1xclnejn {
|
|
164
280
|
width: 8px;
|
|
165
281
|
height: 8px;
|
|
166
282
|
border-radius: 50%;
|
|
167
283
|
flex-shrink: 0;
|
|
168
|
-
background-color: rgb(var(--
|
|
284
|
+
background-color: rgb(var(--_1xclnej0));
|
|
169
285
|
}
|
|
170
|
-
.
|
|
286
|
+
._1xclnejo {
|
|
171
287
|
flex: 1;
|
|
172
288
|
min-width: 0;
|
|
173
289
|
font-size: 14px;
|
|
@@ -178,139 +294,20 @@
|
|
|
178
294
|
text-overflow: ellipsis;
|
|
179
295
|
white-space: nowrap;
|
|
180
296
|
}
|
|
181
|
-
.
|
|
297
|
+
._1xclnejo:hover {
|
|
182
298
|
color: var(--rc-text);
|
|
183
299
|
text-decoration: underline;
|
|
184
300
|
}
|
|
185
|
-
.
|
|
301
|
+
._1xclnejp {
|
|
186
302
|
display: flex;
|
|
187
303
|
justify-content: center;
|
|
188
304
|
margin: 8px 0;
|
|
189
305
|
}
|
|
190
|
-
.
|
|
306
|
+
._1xclnejq {
|
|
191
307
|
display: flex;
|
|
192
308
|
align-items: center;
|
|
193
309
|
justify-content: center;
|
|
194
310
|
height: 200px;
|
|
195
311
|
color: var(--rc-text-secondary);
|
|
196
312
|
font-size: 14px;
|
|
197
|
-
}.rich-embed-link-wrapper {
|
|
198
|
-
margin: 8px 0;
|
|
199
|
-
}
|
|
200
|
-
.rich-embed {
|
|
201
|
-
--embed-accent: 115, 115, 115;
|
|
202
|
-
display: flex;
|
|
203
|
-
align-items: center;
|
|
204
|
-
gap: 0;
|
|
205
|
-
padding: 0 14px;
|
|
206
|
-
height: 48px;
|
|
207
|
-
border: 1px solid rgba(var(--embed-accent), 0.25);
|
|
208
|
-
border-radius: 12px;
|
|
209
|
-
background-color: rgba(var(--embed-accent), 0.12);
|
|
210
|
-
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
|
|
211
|
-
font-size: 14px;
|
|
212
|
-
transition: border-color 0.15s ease, background-color 0.15s ease;
|
|
213
|
-
}
|
|
214
|
-
.rich-embed:focus-within {
|
|
215
|
-
border-color: rgba(var(--embed-accent), 0.5);
|
|
216
|
-
}
|
|
217
|
-
.rich-embed--tweet {
|
|
218
|
-
--embed-accent: 29, 155, 240;
|
|
219
|
-
}
|
|
220
|
-
.rich-embed--youtube {
|
|
221
|
-
--embed-accent: 255, 0, 0;
|
|
222
|
-
}
|
|
223
|
-
.rich-embed--codesandbox {
|
|
224
|
-
--embed-accent: 163, 163, 163;
|
|
225
|
-
}
|
|
226
|
-
.rich-embed--bilibili {
|
|
227
|
-
--embed-accent: 0, 161, 214;
|
|
228
|
-
}
|
|
229
|
-
.rich-embed--github-file {
|
|
230
|
-
--embed-accent: 110, 84, 148;
|
|
231
|
-
}
|
|
232
|
-
.rich-embed--github-gist {
|
|
233
|
-
--embed-accent: 110, 84, 148;
|
|
234
|
-
}
|
|
235
|
-
.rich-embed--thinking {
|
|
236
|
-
--embed-accent: 139, 92, 246;
|
|
237
|
-
}
|
|
238
|
-
.rich-embed__badge {
|
|
239
|
-
display: inline-flex;
|
|
240
|
-
align-items: center;
|
|
241
|
-
gap: 8px;
|
|
242
|
-
flex-shrink: 0;
|
|
243
|
-
font-weight: 500;
|
|
244
|
-
font-size: 14px;
|
|
245
|
-
color: var(--rc-text-secondary);
|
|
246
|
-
white-space: nowrap;
|
|
247
|
-
user-select: none;
|
|
248
|
-
padding-right: 14px;
|
|
249
|
-
}
|
|
250
|
-
.rich-embed__dot {
|
|
251
|
-
width: 8px;
|
|
252
|
-
height: 8px;
|
|
253
|
-
border-radius: 50%;
|
|
254
|
-
flex-shrink: 0;
|
|
255
|
-
background-color: rgb(var(--embed-accent));
|
|
256
|
-
}
|
|
257
|
-
.rich-embed__divider {
|
|
258
|
-
width: 1px;
|
|
259
|
-
height: 20px;
|
|
260
|
-
background-color: var(--rc-border);
|
|
261
|
-
flex-shrink: 0;
|
|
262
|
-
}
|
|
263
|
-
.rich-embed__input {
|
|
264
|
-
flex: 1;
|
|
265
|
-
min-width: 0;
|
|
266
|
-
height: 100%;
|
|
267
|
-
font-size: 14px;
|
|
268
|
-
font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
|
|
269
|
-
color: var(--rc-text);
|
|
270
|
-
background: transparent;
|
|
271
|
-
border: none;
|
|
272
|
-
padding: 0 14px;
|
|
273
|
-
outline: none;
|
|
274
|
-
}
|
|
275
|
-
.rich-embed__input::placeholder {
|
|
276
|
-
color: color-mix(in srgb, var(--rc-text-secondary) 60%, transparent);
|
|
277
|
-
}
|
|
278
|
-
.rich-embed__actions {
|
|
279
|
-
display: flex;
|
|
280
|
-
align-items: center;
|
|
281
|
-
gap: 2px;
|
|
282
|
-
flex-shrink: 0;
|
|
283
|
-
}
|
|
284
|
-
.rich-embed__action-btn {
|
|
285
|
-
display: inline-flex;
|
|
286
|
-
align-items: center;
|
|
287
|
-
justify-content: center;
|
|
288
|
-
appearance: none;
|
|
289
|
-
border: none;
|
|
290
|
-
background: none;
|
|
291
|
-
color: var(--rc-text-secondary);
|
|
292
|
-
cursor: pointer;
|
|
293
|
-
padding: 6px;
|
|
294
|
-
border-radius: 6px;
|
|
295
|
-
transition: color 0.15s ease, background-color 0.15s ease;
|
|
296
|
-
}
|
|
297
|
-
.rich-embed__action-btn:hover {
|
|
298
|
-
color: var(--rc-text);
|
|
299
|
-
background-color: color-mix(in srgb, var(--rc-text) 8%, transparent);
|
|
300
|
-
}
|
|
301
|
-
.rich-embed__action-btn:disabled {
|
|
302
|
-
opacity: 0.3;
|
|
303
|
-
cursor: default;
|
|
304
|
-
}
|
|
305
|
-
.rich-embed__action-btn:disabled:hover {
|
|
306
|
-
background: none;
|
|
307
|
-
color: var(--rc-text-secondary);
|
|
308
|
-
}
|
|
309
|
-
.rich-embed__action-btn--danger:hover {
|
|
310
|
-
color: var(--rc-alert-caution);
|
|
311
|
-
background-color: color-mix(in srgb, var(--rc-alert-caution) 10%, transparent);
|
|
312
|
-
}
|
|
313
|
-
.rich-embed__action-btn svg {
|
|
314
|
-
width: 16px;
|
|
315
|
-
height: 16px;
|
|
316
313
|
}
|
|
@@ -1,2 +1,58 @@
|
|
|
1
|
-
export {
|
|
1
|
+
export declare const semanticClassNames: {
|
|
2
|
+
readonly ratioContainer: "embed-static-ratio-container";
|
|
3
|
+
readonly ratioInner: "embed-static-ratio-inner";
|
|
4
|
+
readonly iframe: "embed-static-iframe";
|
|
5
|
+
readonly gist: "embed-static-gist";
|
|
6
|
+
readonly gistIframe: "embed-static-gist__iframe";
|
|
7
|
+
readonly sourceLink: "embed-static-source-link";
|
|
8
|
+
readonly githubFile: "embed-static-github-file";
|
|
9
|
+
readonly githubFileCode: "embed-static-github-file__code";
|
|
10
|
+
readonly githubFileCodeLong: "embed-static-github-file__code--long";
|
|
11
|
+
readonly githubFileLine: "embed-static-github-file__line";
|
|
12
|
+
readonly githubFileLineNum: "embed-static-github-file__line-num";
|
|
13
|
+
readonly shiki: "embed-static-shiki";
|
|
14
|
+
readonly fallback: "embed-static-fallback";
|
|
15
|
+
readonly fallbackGeneric: "embed-static-fallback--generic";
|
|
16
|
+
readonly fallbackTweet: "embed-static-fallback--tweet";
|
|
17
|
+
readonly fallbackYoutube: "embed-static-fallback--youtube";
|
|
18
|
+
readonly fallbackCodesandbox: "embed-static-fallback--codesandbox";
|
|
19
|
+
readonly fallbackBilibili: "embed-static-fallback--bilibili";
|
|
20
|
+
readonly fallbackGithubFile: "embed-static-fallback--github-file";
|
|
21
|
+
readonly fallbackGithubGist: "embed-static-fallback--github-gist";
|
|
22
|
+
readonly fallbackThinking: "embed-static-fallback--thinking";
|
|
23
|
+
readonly fallbackBadge: "embed-static-fallback__badge";
|
|
24
|
+
readonly fallbackDot: "embed-static-fallback__dot";
|
|
25
|
+
readonly fallbackLink: "embed-static-fallback__link";
|
|
26
|
+
readonly tweet: "embed-static-tweet";
|
|
27
|
+
readonly loading: "embed-static-loading";
|
|
28
|
+
};
|
|
29
|
+
export declare const semanticFallbackModifierClass: {
|
|
30
|
+
readonly generic: "embed-static-fallback--generic";
|
|
31
|
+
readonly tweet: "embed-static-fallback--tweet";
|
|
32
|
+
readonly youtube: "embed-static-fallback--youtube";
|
|
33
|
+
readonly codesandbox: "embed-static-fallback--codesandbox";
|
|
34
|
+
readonly bilibili: "embed-static-fallback--bilibili";
|
|
35
|
+
readonly 'github-file': "embed-static-fallback--github-file";
|
|
36
|
+
readonly 'github-gist': "embed-static-fallback--github-gist";
|
|
37
|
+
readonly thinking: "embed-static-fallback--thinking";
|
|
38
|
+
};
|
|
39
|
+
export declare const ratioContainer: string;
|
|
40
|
+
export declare const ratioInner: string;
|
|
41
|
+
export declare const iframe: string;
|
|
42
|
+
export declare const gist: string;
|
|
43
|
+
export declare const gistIframe: string;
|
|
44
|
+
export declare const sourceLink: string;
|
|
45
|
+
export declare const githubFile: string;
|
|
46
|
+
export declare const githubFileCode: string;
|
|
47
|
+
export declare const githubFileCodeLong: string;
|
|
48
|
+
export declare const githubFileLine: string;
|
|
49
|
+
export declare const githubFileLineNum: string;
|
|
50
|
+
export declare const shiki: string;
|
|
51
|
+
export declare const fallback: string;
|
|
52
|
+
export declare const fallbackType: Record<"generic" | "tweet" | "youtube" | "codesandbox" | "bilibili" | "github-file" | "github-gist" | "thinking", string>;
|
|
53
|
+
export declare const fallbackBadge: string;
|
|
54
|
+
export declare const fallbackDot: string;
|
|
55
|
+
export declare const fallbackLink: string;
|
|
56
|
+
export declare const tweet: string;
|
|
57
|
+
export declare const loading: string;
|
|
2
58
|
//# sourceMappingURL=styles-static.css.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles-static.css.d.ts","sourceRoot":"","sources":["../src/styles-static.css.ts"],"names":[],"mappings":""}
|
|
1
|
+
{"version":3,"file":"styles-static.css.d.ts","sourceRoot":"","sources":["../src/styles-static.css.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2BrB,CAAA;AAEV,eAAO,MAAM,6BAA6B;;;;;;;;;CAShC,CAAA;AAEV,eAAO,MAAM,cAAc,QAIzB,CAAA;AAEF,eAAO,MAAM,UAAU,QAIrB,CAAA;AAEF,eAAO,MAAM,MAAM,QAOjB,CAAA;AAEF,eAAO,MAAM,IAAI,QAIf,CAAA;AAEF,eAAO,MAAM,UAAU,QAKrB,CAAA;AAEF,eAAO,MAAM,UAAU,QAerB,CAAA;AAOF,eAAO,MAAM,UAAU,QAKrB,CAAA;AAEF,eAAO,MAAM,cAAc,QAGzB,CAAA;AAEF,eAAO,MAAM,kBAAkB,QAE7B,CAAA;AAcF,eAAO,MAAM,cAAc,QAEzB,CAAA;AAEF,eAAO,MAAM,iBAAiB,QAO5B,CAAA;AAEF,eAAO,MAAM,KAAK,QAEhB,CAAA;AAmCF,eAAO,MAAM,QAAQ,QAcnB,CAAA;AAEF,eAAO,MAAM,YAAY,2HASvB,CAAA;AAEF,eAAO,MAAM,aAAa,QAWxB,CAAA;AAEF,eAAO,MAAM,WAAW,QAMtB,CAAA;AAEF,eAAO,MAAM,YAAY,QAiBvB,CAAA;AAEF,eAAO,MAAM,KAAK,QAIhB,CAAA;AAEF,eAAO,MAAM,OAAO,QAOlB,CAAA"}
|
package/dist/styles.css.d.ts
CHANGED
|
@@ -1,2 +1,40 @@
|
|
|
1
|
-
export {
|
|
1
|
+
export declare const semanticClassNames: {
|
|
2
|
+
readonly wrapper: "rich-embed-link-wrapper";
|
|
3
|
+
readonly embed: "rich-embed";
|
|
4
|
+
readonly embedGeneric: "rich-embed--generic";
|
|
5
|
+
readonly embedTweet: "rich-embed--tweet";
|
|
6
|
+
readonly embedYoutube: "rich-embed--youtube";
|
|
7
|
+
readonly embedCodesandbox: "rich-embed--codesandbox";
|
|
8
|
+
readonly embedBilibili: "rich-embed--bilibili";
|
|
9
|
+
readonly embedGithubFile: "rich-embed--github-file";
|
|
10
|
+
readonly embedGithubGist: "rich-embed--github-gist";
|
|
11
|
+
readonly embedThinking: "rich-embed--thinking";
|
|
12
|
+
readonly badge: "rich-embed__badge";
|
|
13
|
+
readonly dot: "rich-embed__dot";
|
|
14
|
+
readonly divider: "rich-embed__divider";
|
|
15
|
+
readonly input: "rich-embed__input";
|
|
16
|
+
readonly actions: "rich-embed__actions";
|
|
17
|
+
readonly actionButton: "rich-embed__action-btn";
|
|
18
|
+
readonly actionButtonDanger: "rich-embed__action-btn--danger";
|
|
19
|
+
};
|
|
20
|
+
export declare const semanticEmbedModifierClass: {
|
|
21
|
+
readonly generic: "rich-embed--generic";
|
|
22
|
+
readonly tweet: "rich-embed--tweet";
|
|
23
|
+
readonly youtube: "rich-embed--youtube";
|
|
24
|
+
readonly codesandbox: "rich-embed--codesandbox";
|
|
25
|
+
readonly bilibili: "rich-embed--bilibili";
|
|
26
|
+
readonly 'github-file': "rich-embed--github-file";
|
|
27
|
+
readonly 'github-gist': "rich-embed--github-gist";
|
|
28
|
+
readonly thinking: "rich-embed--thinking";
|
|
29
|
+
};
|
|
30
|
+
export declare const wrapper: string;
|
|
31
|
+
export declare const embed: string;
|
|
32
|
+
export declare const embedType: Record<"generic" | "tweet" | "youtube" | "codesandbox" | "bilibili" | "github-file" | "github-gist" | "thinking", string>;
|
|
33
|
+
export declare const badge: string;
|
|
34
|
+
export declare const dot: string;
|
|
35
|
+
export declare const divider: string;
|
|
36
|
+
export declare const input: string;
|
|
37
|
+
export declare const actions: string;
|
|
38
|
+
export declare const actionButton: string;
|
|
39
|
+
export declare const actionButtonDanger: string;
|
|
2
40
|
//# sourceMappingURL=styles.css.d.ts.map
|
package/dist/styles.css.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../src/styles.css.ts"],"names":[],"mappings":""}
|
|
1
|
+
{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../src/styles.css.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;CAkBrB,CAAA;AAEV,eAAO,MAAM,0BAA0B;;;;;;;;;CAS7B,CAAA;AAEV,eAAO,MAAM,OAAO,QAElB,CAAA;AAEF,eAAO,MAAM,KAAK,QAmBhB,CAAA;AAEF,eAAO,MAAM,SAAS,2HASpB,CAAA;AAEF,eAAO,MAAM,KAAK,QAWhB,CAAA;AAEF,eAAO,MAAM,GAAG,QAMd,CAAA;AAEF,eAAO,MAAM,OAAO,QAKlB,CAAA;AAEF,eAAO,MAAM,KAAK,QAiBhB,CAAA;AAEF,eAAO,MAAM,OAAO,QAKlB,CAAA;AAEF,eAAO,MAAM,YAAY,QA0BvB,CAAA;AAEF,eAAO,MAAM,kBAAkB,QAO7B,CAAA"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@haklex/rich-ext-embed",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.5",
|
|
4
4
|
"description": "Embed extension for Twitter, YouTube, etc.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
@@ -18,8 +18,8 @@
|
|
|
18
18
|
"dependencies": {
|
|
19
19
|
"lucide-react": "^0.574.0",
|
|
20
20
|
"react-tweet": "npm:@innei/react-tweet@3.4.2",
|
|
21
|
-
"@haklex/rich-editor": "0.0.
|
|
22
|
-
"@haklex/rich-style-token": "0.0.
|
|
21
|
+
"@haklex/rich-editor": "0.0.5",
|
|
22
|
+
"@haklex/rich-style-token": "0.0.5"
|
|
23
23
|
},
|
|
24
24
|
"devDependencies": {
|
|
25
25
|
"@lexical/react": "^0.39.0",
|