[READ-ONLY] Mirror of https://github.com/flo-bit/ui-kit. 🦊 fox ui, svelte 5 and tailwind 4
flo-bit.dev/ui-kit/
svelte
tailwindcss
ui-components
text: fix link stuff, social: improve post creator, core: add default bg and text color
+326
-126
+7
.changeset/breezy-dogs-dance.md
+7
.changeset/breezy-dogs-dance.md
+1
-1
apps/docs/src/app.html
+1
-1
apps/docs/src/app.html
···
14
14
</head>
15
15
<body
16
16
data-sveltekit-preload-data="hover"
17
-
class="bg-base-100 dark:bg-base-900 overflow-x-hidden motion-safe:transition-colors"
17
+
class="overflow-x-hidden motion-safe:transition-colors"
18
18
>
19
19
<div style="display: contents">%sveltekit.body%</div>
20
20
</body>
+4
packages/core/src/lib/theme.css
+4
packages/core/src/lib/theme.css
+2
-2
apps/docs/src/lib/site-components/Logo.svelte
+2
-2
apps/docs/src/lib/site-components/Logo.svelte
···
11
11
12
12
<div class={cn('flex items-center gap-2', className)}>
13
13
<a
14
-
class="text-base-950 dark:text-base-50 focus-visible:outline-base-900 dark:focus-visible:outline-base-50 rounded-xl font-semibold focus-visible:outline-2 focus-visible:outline-offset-4"
15
-
href={resolve('/')}>🦊 fox ui</a
14
+
class="text-base-950 dark:text-base-50 focus-visible:outline-base-900 dark:focus-visible:outline-base-50 rounded-xl font-semibold focus-visible:outline-2 focus-visible:outline-offset-4 flex gap-2"
15
+
href={resolve('/')}>🦊 <span class="hidden sm:block">fox ui</span></a
16
16
>
17
17
<Badge>alpha</Badge>
18
18
</div>
+23
-9
packages/text/src/lib/components/link/LinkExtension.ts
+23
-9
packages/text/src/lib/components/link/LinkExtension.ts
···
1
1
import { Extension, InputRule, markInputRule, markPasteRule, PasteRule } from '@tiptap/core';
2
2
import { Link } from '@tiptap/extension-link';
3
+
import { Plugin, PluginKey } from '@tiptap/pm/state';
3
4
import { AddMarkStep } from '@tiptap/pm/transform';
4
5
import type { LinkExtensionOptions } from './helpers';
5
6
···
52
53
};
53
54
},
54
55
55
-
onTransaction({ transaction }) {
56
-
const onlinkadded = this.options.onlinkadded;
57
-
if (!onlinkadded || !transaction.docChanged) return;
56
+
addProseMirrorPlugins() {
57
+
const ext = this;
58
+
return [
59
+
new Plugin({
60
+
key: new PluginKey('linkAddedDetector'),
61
+
appendTransaction(transactions, _oldState, newState) {
62
+
const onlinkadded = ext.options.onlinkadded;
63
+
if (!onlinkadded) return;
58
64
59
-
for (const step of transaction.steps) {
60
-
if (step instanceof AddMarkStep && step.mark.type.name === 'link') {
61
-
const text = transaction.doc.textBetween(step.from, step.to);
62
-
onlinkadded({ href: step.mark.attrs.href, text, editor: this.editor });
63
-
}
64
-
}
65
+
for (const transaction of transactions) {
66
+
for (const step of transaction.steps) {
67
+
if (step instanceof AddMarkStep && step.mark.type.name === 'link') {
68
+
const text = newState.doc.textBetween(step.from, step.to);
69
+
console.log('[LinkExtension] link detected:', { href: step.mark.attrs.href, text });
70
+
onlinkadded({ href: step.mark.attrs.href, text, editor: ext.editor });
71
+
}
72
+
}
73
+
}
74
+
return null;
75
+
}
76
+
})
77
+
];
65
78
},
66
79
67
80
addExtensions() {
···
109
122
},
110
123
addPasteRules() {
111
124
return [
125
+
...(this.parent?.() ?? []),
112
126
linkPasteRule({
113
127
find: pasteRegex,
114
128
type: this.type,