@wishbone-media/spark 0.30.0 → 0.31.0
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.js +1031 -1030
- package/package.json +1 -1
- package/src/containers/SparkDefaultContainer.vue +18 -4
- package/src/plugins/fontawesome.js +2 -0
package/package.json
CHANGED
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
>
|
|
30
30
|
<a
|
|
31
31
|
:class="{
|
|
32
|
-
'bg-gray-100': item
|
|
32
|
+
'bg-gray-100': isCurrentRoute(item),
|
|
33
33
|
'hover:bg-gray-100': item?.href,
|
|
34
34
|
}"
|
|
35
35
|
:href="item?.href"
|
|
@@ -38,7 +38,7 @@
|
|
|
38
38
|
>
|
|
39
39
|
<font-awesome-icon
|
|
40
40
|
:icon="Icons[item.icon]"
|
|
41
|
-
:class="[item
|
|
41
|
+
:class="[isCurrentRoute(item) ? 'text-gray-400' : 'text-gray-400']"
|
|
42
42
|
class="size-4"
|
|
43
43
|
v-if="item.icon"
|
|
44
44
|
/>
|
|
@@ -60,7 +60,7 @@
|
|
|
60
60
|
<ul v-if="item.children" class="mt-[5px] flex flex-col gap-[5px]">
|
|
61
61
|
<li v-for="child in item.children" :key="child.name">
|
|
62
62
|
<a
|
|
63
|
-
:class="[child
|
|
63
|
+
:class="[isCurrentRoute(child) ? 'bg-gray-100' : '', 'hover:bg-gray-100']"
|
|
64
64
|
:href="child.href"
|
|
65
65
|
class="h-[37px] sgroup flex items-center gap-x-2 rounded-md p-3 text-gray-800 leading-5 transition-all duration-300 ease-in-out"
|
|
66
66
|
@click.prevent="mainNavStore.goto(child.href)"
|
|
@@ -68,7 +68,7 @@
|
|
|
68
68
|
<font-awesome-icon
|
|
69
69
|
v-if="child.icon"
|
|
70
70
|
:icon="Icons[child.icon]"
|
|
71
|
-
:class="[child
|
|
71
|
+
:class="[isCurrentRoute(child) ? 'text-gray-400' : 'text-gray-400']"
|
|
72
72
|
class="size-4"
|
|
73
73
|
/>
|
|
74
74
|
<span class="text-[13px]" v-if="!mainNavStore.state.collapsed">
|
|
@@ -199,6 +199,20 @@ const emit = defineEmits(['overlayClose'])
|
|
|
199
199
|
const slots = useSlots()
|
|
200
200
|
const route = useRoute()
|
|
201
201
|
|
|
202
|
+
// Compute current state directly from route for reliable reactivity
|
|
203
|
+
const isCurrentRoute = (item) => {
|
|
204
|
+
if (!item.href) return false
|
|
205
|
+
// Direct match on route name or path
|
|
206
|
+
if (item.href === route.name || item.href === route.path) {
|
|
207
|
+
return true
|
|
208
|
+
}
|
|
209
|
+
// Child route match: highlight parent when on child (e.g., '/sub-nav' matches '/sub-nav/general')
|
|
210
|
+
if (route.path.startsWith(item.href + '/')) {
|
|
211
|
+
return true
|
|
212
|
+
}
|
|
213
|
+
return false
|
|
214
|
+
}
|
|
215
|
+
|
|
202
216
|
const sparkBrandFilterStore = useSparkBrandFilterStore()
|
|
203
217
|
const sparkAppSelectorStore = useSparkAppSelectorStore()
|
|
204
218
|
|
|
@@ -42,6 +42,7 @@ import {
|
|
|
42
42
|
faUndo,
|
|
43
43
|
faBolt,
|
|
44
44
|
faCloudDownload,
|
|
45
|
+
faCloudArrowUp,
|
|
45
46
|
faInbox,
|
|
46
47
|
faCircleCheck,
|
|
47
48
|
// Additional icons for FormKit genesis replacement
|
|
@@ -106,6 +107,7 @@ export const Icons = {
|
|
|
106
107
|
farUndo: faUndo,
|
|
107
108
|
farBolt: faBolt,
|
|
108
109
|
farCloudDownload: faCloudDownload,
|
|
110
|
+
farCloudArrowUp: faCloudArrowUp,
|
|
109
111
|
farInbox: faInbox,
|
|
110
112
|
farCircleCheck: faCircleCheck,
|
|
111
113
|
|