diff --git a/src/runtime/components/Button.vue b/src/runtime/components/Button.vue
index e4a9efa9..343438e2 100644
--- a/src/runtime/components/Button.vue
+++ b/src/runtime/components/Button.vue
@@ -1,9 +1,8 @@
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
-
-
+ />
+
+
+
diff --git a/src/runtime/inertia/components/LinkBase.vue b/src/runtime/inertia/components/LinkBase.vue
new file mode 100644
index 00000000..2019d9ce
--- /dev/null
+++ b/src/runtime/inertia/components/LinkBase.vue
@@ -0,0 +1,77 @@
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/runtime/utils/link.ts b/src/runtime/utils/link.ts
index 6678c1cf..d8ebbd51 100644
--- a/src/runtime/utils/link.ts
+++ b/src/runtime/utils/link.ts
@@ -1,4 +1,5 @@
import { reactivePick } from '@vueuse/core'
+import { isEqual, diff } from 'ohash/utils'
import type { LinkProps } from '../types'
export function pickLinkProps(link: LinkProps & { [key: string]: any }) {
@@ -19,3 +20,17 @@ export function pickLinkProps(link: LinkProps & { [key: string]: any }) {
return reactivePick(link, ...propsToInclude)
}
+
+export function isPartiallyEqual(item1: any, item2: any) {
+ const diffedKeys = diff(item1, item2).reduce((filtered, q) => {
+ if (q.type === 'added') {
+ filtered.add(q.key)
+ }
+ return filtered
+ }, new Set())
+
+ const item1Filtered = Object.fromEntries(Object.entries(item1).filter(([key]) => !diffedKeys.has(key)))
+ const item2Filtered = Object.fromEntries(Object.entries(item2).filter(([key]) => !diffedKeys.has(key)))
+
+ return isEqual(item1Filtered, item2Filtered)
+}
diff --git a/src/runtime/vue/components/Link.vue b/src/runtime/vue/components/Link.vue
index 73aec38a..07d955ce 100644
--- a/src/runtime/vue/components/Link.vue
+++ b/src/runtime/vue/components/Link.vue
@@ -87,15 +87,17 @@ export interface LinkSlots {
-
-
+
+
@@ -258,12 +242,12 @@ function resolveLinkClass({ route, isActive, isExactActive }: any = {}) {
type,
disabled,
href: (to as string),
- target: isExternal ? '_blank' : undefined
+ target: isExternal ? '_blank' : undefined,
+ isExternal
}"
- :is-external="isExternal"
:class="resolveLinkClass()"
>
-
+
diff --git a/src/theme/link.ts b/src/theme/link.ts
index 538a8d2f..e0b4bb2e 100644
--- a/src/theme/link.ts
+++ b/src/theme/link.ts
@@ -5,10 +5,15 @@ export default (options: Required) => ({
variants: {
active: {
true: 'text-primary',
- false: ['text-muted hover:text-default', options.theme.transitions && 'transition-colors']
+ false: 'text-muted'
},
disabled: {
true: 'cursor-not-allowed opacity-75'
}
- }
+ },
+ compoundVariants: [{
+ active: false,
+ disabled: false,
+ class: ['hover:text-default', options.theme.transitions && 'transition-colors']
+ }]
})
diff --git a/test/components/Link.spec.ts b/test/components/Link.spec.ts
index 8e21e0c6..2a231ea2 100644
--- a/test/components/Link.spec.ts
+++ b/test/components/Link.spec.ts
@@ -10,10 +10,12 @@ describe('Link', () => {
['with to', { props: { to: '/' } }],
['with type', { props: { type: 'submit' as const } }],
['with disabled', { props: { disabled: true } }],
- ['with raw', { props: { raw: true } }],
- ['with class', { props: { class: 'font-medium' } }],
['with activeClass', { props: { active: true, activeClass: 'text-highlighted' } }],
['with inactiveClass', { props: { active: false, inactiveClass: 'hover:text-primary' } }],
+ ['with raw', { props: { raw: true } }],
+ ['with raw activeClass', { props: { raw: true, active: true, activeClass: 'text-highlighted' } }],
+ ['with raw inactiveClass', { props: { raw: true, active: false, inactiveClass: 'hover:text-primary' } }],
+ ['with class', { props: { class: 'font-medium' } }],
// Slots
['with default slot', { slots: { default: () => 'Default slot' } }]
])('renders %s correctly', async (nameOrHtml: string, options: { props?: LinkProps, slots?: Partial }) => {
diff --git a/test/components/__snapshots__/Link-vue.spec.ts.snap b/test/components/__snapshots__/Link-vue.spec.ts.snap
index 1d0d6278..88603153 100644
--- a/test/components/__snapshots__/Link-vue.spec.ts.snap
+++ b/test/components/__snapshots__/Link-vue.spec.ts.snap
@@ -8,12 +8,16 @@ exports[`Link > renders with class correctly 1`] = `"