intelliwaketssveltekitv25 1.0.87 → 1.0.90
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/TabHeader.svelte +19 -11
- package/dist/TabHref.svelte +5 -3
- package/package.json +1 -1
package/dist/TabHeader.svelte
CHANGED
|
@@ -55,12 +55,26 @@
|
|
|
55
55
|
const controlElementRect = controlElement.getBoundingClientRect()
|
|
56
56
|
const activeElementRect = activeElement.getBoundingClientRect()
|
|
57
57
|
indicatorStyles = `left: ${activeElementRect.left - controlElementRect.left - 4}px; width: ${activeElementRect.width + 8}px; top: ${activeElementRect.top - controlElementRect.top - 3}px; height: ${activeElementRect.height + 4}px;`
|
|
58
|
+
} else {
|
|
59
|
+
console.log('No active element found', currentKey, tabItems)
|
|
58
60
|
}
|
|
59
61
|
} else {
|
|
60
62
|
console.log('No control element found', currentKey, tabItems)
|
|
61
63
|
}
|
|
62
64
|
}
|
|
63
65
|
|
|
66
|
+
$effect(() => {
|
|
67
|
+
clientWidth
|
|
68
|
+
tabItems
|
|
69
|
+
|
|
70
|
+
if (currentKey && (isVisible || clientWidth > 0)) {
|
|
71
|
+
setIndicatorStyle().then(() => {
|
|
72
|
+
})
|
|
73
|
+
} else {
|
|
74
|
+
console.log('No currentKey or not visible', currentKey, isVisible)
|
|
75
|
+
}
|
|
76
|
+
})
|
|
77
|
+
|
|
64
78
|
onMount(() => {
|
|
65
79
|
const observer = new IntersectionObserver(
|
|
66
80
|
(entries) => {
|
|
@@ -68,7 +82,10 @@
|
|
|
68
82
|
isVisible = entry.isIntersecting
|
|
69
83
|
})
|
|
70
84
|
},
|
|
71
|
-
{
|
|
85
|
+
{
|
|
86
|
+
threshold: [0, 0.1],
|
|
87
|
+
rootMargin: '50px'
|
|
88
|
+
}
|
|
72
89
|
)
|
|
73
90
|
|
|
74
91
|
if (controlElement) {
|
|
@@ -82,16 +99,6 @@
|
|
|
82
99
|
}
|
|
83
100
|
})
|
|
84
101
|
|
|
85
|
-
$effect(() => {
|
|
86
|
-
clientWidth
|
|
87
|
-
tabItems
|
|
88
|
-
|
|
89
|
-
if (currentKey && isVisible) {
|
|
90
|
-
setIndicatorStyle().then(() => {
|
|
91
|
-
})
|
|
92
|
-
}
|
|
93
|
-
})
|
|
94
|
-
|
|
95
102
|
</script>
|
|
96
103
|
|
|
97
104
|
<div class='grid mx-auto mb-2 relative'
|
|
@@ -100,6 +107,7 @@
|
|
|
100
107
|
bind:clientWidth>
|
|
101
108
|
<div
|
|
102
109
|
class="tab_href_indicator absolute h-8 z-10 bg-transparent border-b-2 border-b-primary-selected transition-all duration-300 ease-[cubic-bezier(0.4,0,0.2,1)] select-none pointer-events-none"
|
|
110
|
+
hidden={!currentKey}
|
|
103
111
|
style={indicatorStyles}
|
|
104
112
|
in:fly={{ y: 10, duration: 200, easing: cubicInOut }}>
|
|
105
113
|
|
package/dist/TabHref.svelte
CHANGED
|
@@ -9,7 +9,6 @@
|
|
|
9
9
|
import Icon from './Icon.svelte'
|
|
10
10
|
import { cubicInOut } from 'svelte/easing'
|
|
11
11
|
import { fly } from 'svelte/transition'
|
|
12
|
-
import path from 'node:path'
|
|
13
12
|
|
|
14
13
|
let {
|
|
15
14
|
tabHrefs,
|
|
@@ -58,7 +57,10 @@
|
|
|
58
57
|
isVisible = entry.isIntersecting
|
|
59
58
|
})
|
|
60
59
|
},
|
|
61
|
-
{
|
|
60
|
+
{
|
|
61
|
+
threshold: [0, 0.1],
|
|
62
|
+
rootMargin: '50px'
|
|
63
|
+
}
|
|
62
64
|
)
|
|
63
65
|
|
|
64
66
|
if (controlElement) {
|
|
@@ -223,7 +225,7 @@
|
|
|
223
225
|
clientWidth
|
|
224
226
|
tabHrefs
|
|
225
227
|
|
|
226
|
-
if (pathAnalyzer?.activePageSlug && isVisible) {
|
|
228
|
+
if (pathAnalyzer?.activePageSlug && (isVisible || clientWidth > 0)) {
|
|
227
229
|
setIndicatorStyle().then(() => {
|
|
228
230
|
})
|
|
229
231
|
}
|