@ainsleydev/sveltekit-helper 0.6.3 → 0.6.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.
@@ -36,12 +36,16 @@ export type TableOfContentsProps = {
36
36
  * @default 80
37
37
  */
38
38
  scrollOffset?: number;
39
+ /**
40
+ * Optional callback invoked when a TOC link is clicked.
41
+ * Useful for closing a sidebar or drawer on navigation.
42
+ */
43
+ onLinkClick?: (event: MouseEvent, item: TOCItem) => void;
39
44
  };
40
45
  </script>
41
46
 
42
47
  <script lang="ts">
43
48
  import { onMount } from 'svelte'
44
- import Sidebar from './Sidebar.svelte'
45
49
 
46
50
  let {
47
51
  heading = '',
@@ -50,6 +54,7 @@ export type TableOfContentsProps = {
50
54
  contentSelector = '[data-sidebar-content="true"]',
51
55
  headingSelector,
52
56
  scrollOffset = 80,
57
+ onLinkClick,
53
58
  }: TableOfContentsProps = $props()
54
59
 
55
60
  let activeId = $state<string | null>(null)
@@ -133,29 +138,28 @@ export type TableOfContentsProps = {
133
138
  <TableOfContents items={[{ label: 'Intro', href: 'intro' }]} />
134
139
  ```
135
140
  -->
136
- <Sidebar>
137
- <div class="toc" class:toc--border={displayBorder}>
138
- {#if heading !== ''}
139
- <p class="toc__heading">
140
- {heading}
141
- </p>
142
- {/if}
143
- <menu class="toc__items">
144
- {#each items as item, index (index)}
145
- <li class="toc__item">
146
- <a
147
- class="toc__link"
148
- class:toc__link--active={activeId ===
149
- (item.href.startsWith('#') ? item.href.slice(1) : item.href)}
150
- href="#{item.href}"
151
- >
152
- <small>{item.label}</small>
153
- </a>
154
- </li>
155
- {/each}
156
- </menu>
157
- </div>
158
- </Sidebar>
141
+ <div class="toc" class:toc--border={displayBorder}>
142
+ {#if heading !== ''}
143
+ <p class="toc__heading">
144
+ {heading}
145
+ </p>
146
+ {/if}
147
+ <menu class="toc__items">
148
+ {#each items as item, index (index)}
149
+ <li class="toc__item">
150
+ <a
151
+ class="toc__link"
152
+ class:toc__link--active={activeId ===
153
+ (item.href.startsWith('#') ? item.href.slice(1) : item.href)}
154
+ href="#{item.href}"
155
+ onclick={(e) => onLinkClick?.(e, item)}
156
+ >
157
+ <small>{item.label}</small>
158
+ </a>
159
+ </li>
160
+ {/each}
161
+ </menu>
162
+ </div>
159
163
 
160
164
  <style>.toc__item {
161
165
  margin-bottom: 0.5rem;
@@ -34,6 +34,11 @@ export type TableOfContentsProps = {
34
34
  * @default 80
35
35
  */
36
36
  scrollOffset?: number;
37
+ /**
38
+ * Optional callback invoked when a TOC link is clicked.
39
+ * Useful for closing a sidebar or drawer on navigation.
40
+ */
41
+ onLinkClick?: (event: MouseEvent, item: TOCItem) => void;
37
42
  };
38
43
  /**
39
44
  * Table of Contents with scrollspy, designed to be used alongside a richtext
@@ -1 +1 @@
1
- {"version":3,"file":"TableOfContents.svelte.d.ts","sourceRoot":"","sources":["../../src/components/TableOfContents.svelte.ts"],"names":[],"mappings":"AAGA,MAAM,MAAM,OAAO,GAAG;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACb,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IAClC;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,EAAE,CAAC;IAClB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;;;OAMG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAgGF;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,QAAA,MAAM,eAAe,0DAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}
1
+ {"version":3,"file":"TableOfContents.svelte.d.ts","sourceRoot":"","sources":["../../src/components/TableOfContents.svelte.ts"],"names":[],"mappings":"AAGA,MAAM,MAAM,OAAO,GAAG;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACb,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IAClC;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,EAAE,CAAC;IAClB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;;;OAMG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CACzD,CAAC;AA6FF;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,QAAA,MAAM,eAAe,0DAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ainsleydev/sveltekit-helper",
3
- "version": "0.6.3",
3
+ "version": "0.6.5",
4
4
  "description": "SvelteKit utilities, components and helpers for ainsley.dev builds",
5
5
  "license": "MIT",
6
6
  "type": "module",