react-fathom 0.1.0 → 0.1.2

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.
Files changed (49) hide show
  1. package/README.md +222 -52
  2. package/dist/cjs/index.cjs +3 -4
  3. package/dist/cjs/index.cjs.map +1 -1
  4. package/dist/cjs/next/index.cjs +186 -725
  5. package/dist/cjs/next/index.cjs.map +1 -1
  6. package/dist/es/index.js +3 -4
  7. package/dist/es/index.js.map +1 -1
  8. package/dist/es/next/index.js +186 -724
  9. package/dist/es/next/index.js.map +1 -1
  10. package/dist/react-fathom.js +3 -4
  11. package/dist/react-fathom.js.map +1 -1
  12. package/dist/react-fathom.min.js +2 -2
  13. package/dist/react-fathom.min.js.map +1 -1
  14. package/package.json +16 -2
  15. package/src/FathomProvider.tsx +0 -1
  16. package/src/next/NextFathomTrackViewApp.test.tsx +265 -0
  17. package/src/next/NextFathomTrackViewApp.tsx +78 -0
  18. package/src/next/NextFathomTrackViewPages.test.tsx +222 -0
  19. package/src/next/NextFathomTrackViewPages.tsx +83 -0
  20. package/src/next/compositions/withAppRouter.test.tsx +31 -10
  21. package/src/next/compositions/withAppRouter.tsx +10 -3
  22. package/src/next/compositions/withPagesRouter.test.tsx +31 -10
  23. package/src/next/compositions/withPagesRouter.tsx +10 -3
  24. package/src/next/index.ts +3 -3
  25. package/src/next/types.ts +0 -7
  26. package/src/types.ts +0 -1
  27. package/types/FathomProvider.d.ts.map +1 -1
  28. package/types/next/NextFathomProviderApp.d.ts.map +1 -1
  29. package/types/next/NextFathomProviderPages.d.ts.map +1 -1
  30. package/types/next/NextFathomTrackViewApp.d.ts +34 -0
  31. package/types/next/NextFathomTrackViewApp.d.ts.map +1 -0
  32. package/types/next/NextFathomTrackViewPages.d.ts +30 -0
  33. package/types/next/NextFathomTrackViewPages.d.ts.map +1 -0
  34. package/types/next/compositions/withAppRouter.d.ts +1 -0
  35. package/types/next/compositions/withAppRouter.d.ts.map +1 -1
  36. package/types/next/compositions/withPagesRouter.d.ts +1 -0
  37. package/types/next/compositions/withPagesRouter.d.ts.map +1 -1
  38. package/types/next/index.d.ts +2 -3
  39. package/types/next/index.d.ts.map +1 -1
  40. package/types/next/types.d.ts +0 -6
  41. package/types/next/types.d.ts.map +1 -1
  42. package/types/types.d.ts +0 -1
  43. package/types/types.d.ts.map +1 -1
  44. package/src/next/NextFathomProvider.test.tsx +0 -131
  45. package/src/next/NextFathomProvider.tsx +0 -62
  46. package/src/next/NextFathomProviderApp.test.tsx +0 -308
  47. package/src/next/NextFathomProviderApp.tsx +0 -106
  48. package/src/next/NextFathomProviderPages.test.tsx +0 -330
  49. package/src/next/NextFathomProviderPages.tsx +0 -112
@@ -6,27 +6,42 @@ import { render, screen } from '@testing-library/react'
6
6
 
7
7
  import { withAppRouter } from './withAppRouter'
8
8
 
9
- // Mock NextFathomProviderApp
10
- vi.mock('../NextFathomProviderApp', () => ({
11
- default: ({
9
+ // Mock FathomProvider and NextFathomTrackViewApp
10
+ vi.mock('../../FathomProvider', () => ({
11
+ FathomProvider: ({
12
12
  children,
13
13
  siteId,
14
14
  }: {
15
15
  children: React.ReactNode
16
16
  siteId?: string
17
17
  }) => (
18
- <div data-testid="app-provider" data-site-id={siteId}>
18
+ <div data-testid="fathom-provider" data-site-id={siteId}>
19
19
  {children}
20
20
  </div>
21
21
  ),
22
22
  }))
23
23
 
24
+ vi.mock('../NextFathomTrackViewApp', () => ({
25
+ NextFathomTrackViewApp: ({
26
+ disableAutoTrack,
27
+ }: {
28
+ disableAutoTrack?: boolean
29
+ }) => (
30
+ <div
31
+ data-testid="track-view-app"
32
+ data-disable-auto-track={disableAutoTrack}
33
+ >
34
+ TrackViewApp
35
+ </div>
36
+ ),
37
+ }))
38
+
24
39
  describe('withAppRouter', () => {
25
40
  beforeEach(() => {
26
41
  vi.clearAllMocks()
27
42
  })
28
43
 
29
- it('should wrap component with NextFathomProviderApp', () => {
44
+ it('should wrap component with FathomProvider and NextFathomTrackViewApp', () => {
30
45
  const TestComponent = ({ name }: { name: string }) => (
31
46
  <div>Hello {name}</div>
32
47
  )
@@ -37,11 +52,12 @@ describe('withAppRouter', () => {
37
52
 
38
53
  render(<WrappedComponent name="World" />)
39
54
 
40
- expect(screen.getByTestId('app-provider')).toBeInTheDocument()
41
- expect(screen.getByTestId('app-provider')).toHaveAttribute(
55
+ expect(screen.getByTestId('fathom-provider')).toBeInTheDocument()
56
+ expect(screen.getByTestId('fathom-provider')).toHaveAttribute(
42
57
  'data-site-id',
43
58
  'TEST_SITE_ID',
44
59
  )
60
+ expect(screen.getByTestId('track-view-app')).toBeInTheDocument()
45
61
  expect(screen.getByText('Hello World')).toBeInTheDocument()
46
62
  })
47
63
 
@@ -57,7 +73,7 @@ describe('withAppRouter', () => {
57
73
  expect(screen.getByText('Count: 42')).toBeInTheDocument()
58
74
  })
59
75
 
60
- it('should pass provider props to NextFathomProviderApp', () => {
76
+ it('should pass provider props to FathomProvider and disableAutoTrack to NextFathomTrackViewApp', () => {
61
77
  const TestComponent = () => <div>Test</div>
62
78
 
63
79
  const WrappedComponent = withAppRouter(TestComponent, {
@@ -68,7 +84,11 @@ describe('withAppRouter', () => {
68
84
 
69
85
  render(<WrappedComponent />)
70
86
 
71
- expect(screen.getByTestId('app-provider')).toBeInTheDocument()
87
+ expect(screen.getByTestId('fathom-provider')).toBeInTheDocument()
88
+ expect(screen.getByTestId('track-view-app')).toHaveAttribute(
89
+ 'data-disable-auto-track',
90
+ 'true',
91
+ )
72
92
  })
73
93
 
74
94
  it('should work without provider props', () => {
@@ -78,7 +98,8 @@ describe('withAppRouter', () => {
78
98
 
79
99
  render(<WrappedComponent />)
80
100
 
81
- expect(screen.getByTestId('app-provider')).toBeInTheDocument()
101
+ expect(screen.getByTestId('fathom-provider')).toBeInTheDocument()
102
+ expect(screen.getByTestId('track-view-app')).toBeInTheDocument()
82
103
  expect(screen.getByText('Test')).toBeInTheDocument()
83
104
  })
84
105
 
@@ -1,11 +1,14 @@
1
1
  import React from 'react'
2
2
  import type { ComponentType } from 'react'
3
3
 
4
- import NextFathomProviderApp from '../NextFathomProviderApp'
4
+ import { FathomProvider } from '../../FathomProvider'
5
+ import type { FathomProviderProps } from '../../types'
6
+ import { NextFathomTrackViewApp } from '../NextFathomTrackViewApp'
5
7
  import type { NextFathomProviderProps } from '../types'
6
8
 
7
9
  /**
8
10
  * Higher-order component that wraps your Next.js App Router app with FathomProvider
11
+ * and automatically tracks pageviews using NextFathomTrackViewApp.
9
12
  *
10
13
  * @example
11
14
  * ```tsx
@@ -33,10 +36,14 @@ const withAppRouter = <P extends object>(
33
36
  providerProps?: NextFathomProviderProps,
34
37
  ): ComponentType<P> => {
35
38
  const WithAppRouter: React.FC<P> = (props) => {
39
+ // Extract disableAutoTrack for the tracking component
40
+ const { disableAutoTrack, ...fathomProviderProps } = providerProps ?? {}
41
+
36
42
  return (
37
- <NextFathomProviderApp {...providerProps}>
43
+ <FathomProvider {...(fathomProviderProps as FathomProviderProps)}>
44
+ <NextFathomTrackViewApp disableAutoTrack={disableAutoTrack} />
38
45
  <Component {...props} />
39
- </NextFathomProviderApp>
46
+ </FathomProvider>
40
47
  )
41
48
  }
42
49
 
@@ -6,27 +6,42 @@ import { render, screen } from '@testing-library/react'
6
6
 
7
7
  import { withPagesRouter } from './withPagesRouter'
8
8
 
9
- // Mock NextFathomProviderPages
10
- vi.mock('../NextFathomProviderPages', () => ({
11
- default: ({
9
+ // Mock FathomProvider and NextFathomTrackViewPages
10
+ vi.mock('../../FathomProvider', () => ({
11
+ FathomProvider: ({
12
12
  children,
13
13
  siteId,
14
14
  }: {
15
15
  children: React.ReactNode
16
16
  siteId?: string
17
17
  }) => (
18
- <div data-testid="pages-provider" data-site-id={siteId}>
18
+ <div data-testid="fathom-provider" data-site-id={siteId}>
19
19
  {children}
20
20
  </div>
21
21
  ),
22
22
  }))
23
23
 
24
+ vi.mock('../NextFathomTrackViewPages', () => ({
25
+ NextFathomTrackViewPages: ({
26
+ disableAutoTrack,
27
+ }: {
28
+ disableAutoTrack?: boolean
29
+ }) => (
30
+ <div
31
+ data-testid="track-view-pages"
32
+ data-disable-auto-track={disableAutoTrack}
33
+ >
34
+ TrackViewPages
35
+ </div>
36
+ ),
37
+ }))
38
+
24
39
  describe('withPagesRouter', () => {
25
40
  beforeEach(() => {
26
41
  vi.clearAllMocks()
27
42
  })
28
43
 
29
- it('should wrap component with NextFathomProviderPages', () => {
44
+ it('should wrap component with FathomProvider and NextFathomTrackViewPages', () => {
30
45
  const TestComponent = ({ name }: { name: string }) => (
31
46
  <div>Hello {name}</div>
32
47
  )
@@ -37,11 +52,12 @@ describe('withPagesRouter', () => {
37
52
 
38
53
  render(<WrappedComponent name="World" />)
39
54
 
40
- expect(screen.getByTestId('pages-provider')).toBeInTheDocument()
41
- expect(screen.getByTestId('pages-provider')).toHaveAttribute(
55
+ expect(screen.getByTestId('fathom-provider')).toBeInTheDocument()
56
+ expect(screen.getByTestId('fathom-provider')).toHaveAttribute(
42
57
  'data-site-id',
43
58
  'TEST_SITE_ID',
44
59
  )
60
+ expect(screen.getByTestId('track-view-pages')).toBeInTheDocument()
45
61
  expect(screen.getByText('Hello World')).toBeInTheDocument()
46
62
  })
47
63
 
@@ -57,7 +73,7 @@ describe('withPagesRouter', () => {
57
73
  expect(screen.getByText('Count: 42')).toBeInTheDocument()
58
74
  })
59
75
 
60
- it('should pass provider props to NextFathomProviderPages', () => {
76
+ it('should pass provider props to FathomProvider and disableAutoTrack to NextFathomTrackViewPages', () => {
61
77
  const TestComponent = () => <div>Test</div>
62
78
 
63
79
  const WrappedComponent = withPagesRouter(TestComponent, {
@@ -68,7 +84,11 @@ describe('withPagesRouter', () => {
68
84
 
69
85
  render(<WrappedComponent />)
70
86
 
71
- expect(screen.getByTestId('pages-provider')).toBeInTheDocument()
87
+ expect(screen.getByTestId('fathom-provider')).toBeInTheDocument()
88
+ expect(screen.getByTestId('track-view-pages')).toHaveAttribute(
89
+ 'data-disable-auto-track',
90
+ 'true',
91
+ )
72
92
  })
73
93
 
74
94
  it('should work without provider props', () => {
@@ -78,7 +98,8 @@ describe('withPagesRouter', () => {
78
98
 
79
99
  render(<WrappedComponent />)
80
100
 
81
- expect(screen.getByTestId('pages-provider')).toBeInTheDocument()
101
+ expect(screen.getByTestId('fathom-provider')).toBeInTheDocument()
102
+ expect(screen.getByTestId('track-view-pages')).toBeInTheDocument()
82
103
  expect(screen.getByText('Test')).toBeInTheDocument()
83
104
  })
84
105
 
@@ -1,11 +1,14 @@
1
1
  import React from 'react'
2
2
  import type { ComponentType } from 'react'
3
3
 
4
- import NextFathomProviderPages from '../NextFathomProviderPages'
4
+ import { FathomProvider } from '../../FathomProvider'
5
+ import type { FathomProviderProps } from '../../types'
6
+ import { NextFathomTrackViewPages } from '../NextFathomTrackViewPages'
5
7
  import type { NextFathomProviderProps } from '../types'
6
8
 
7
9
  /**
8
10
  * Higher-order component that wraps your Next.js Pages Router app with FathomProvider
11
+ * and automatically tracks pageviews using NextFathomTrackViewPages.
9
12
  *
10
13
  * @example
11
14
  * ```tsx
@@ -29,10 +32,14 @@ const withPagesRouter = <P extends object>(
29
32
  providerProps?: NextFathomProviderProps,
30
33
  ): ComponentType<P> => {
31
34
  const WithPagesRouter: React.FC<P> = (props) => {
35
+ // Extract disableAutoTrack for the tracking component
36
+ const { disableAutoTrack, ...fathomProviderProps } = providerProps ?? {}
37
+
32
38
  return (
33
- <NextFathomProviderPages {...providerProps}>
39
+ <FathomProvider {...(fathomProviderProps as FathomProviderProps)}>
40
+ <NextFathomTrackViewPages disableAutoTrack={disableAutoTrack} />
34
41
  <Component {...props} />
35
- </NextFathomProviderPages>
42
+ </FathomProvider>
36
43
  )
37
44
  }
38
45
 
package/src/next/index.ts CHANGED
@@ -1,6 +1,6 @@
1
- export * from './NextFathomProviderPages'
2
- export * from './NextFathomProviderApp'
3
- export * from './NextFathomProvider'
1
+ // Router-specific tracking components
2
+ export * from './NextFathomTrackViewPages'
3
+ export * from './NextFathomTrackViewApp'
4
4
 
5
5
  // Convenience compositions for easy setup
6
6
  export * from './compositions/withPagesRouter'
package/src/next/types.ts CHANGED
@@ -1,7 +1,5 @@
1
1
  import type { PropsWithChildren } from 'react'
2
2
 
3
- import type { PageViewOptions } from 'fathom-client'
4
-
5
3
  import type { FathomProviderProps } from '../types'
6
4
 
7
5
  export interface NextFathomProviderProps
@@ -11,9 +9,4 @@ export interface NextFathomProviderProps
11
9
  * @default false
12
10
  */
13
11
  disableAutoTrack?: boolean
14
- /**
15
- * Default options to pass to trackPageview on route changes
16
- * @deprecated Use `defaultPageviewOptions` instead
17
- */
18
- trackDefaultOptions?: PageViewOptions
19
12
  }
package/src/types.ts CHANGED
@@ -31,7 +31,6 @@ export interface FathomProviderProps extends PropsWithChildren {
31
31
  client?: FathomClient
32
32
  clientOptions?: LoadOptions
33
33
  siteId?: string
34
- disableDefaultTrack?: boolean
35
34
  defaultPageviewOptions?: PageViewOptions
36
35
  defaultEventOptions?: EventOptions
37
36
  }
@@ -1 +1 @@
1
- {"version":3,"file":"FathomProvider.d.ts","sourceRoot":"","sources":["../src/FathomProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsD,MAAM,OAAO,CAAA;AAM1E,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAElD,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CA6GjD,CAAA;AAID,OAAO,EAAE,cAAc,EAAE,CAAA"}
1
+ {"version":3,"file":"FathomProvider.d.ts","sourceRoot":"","sources":["../src/FathomProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsD,MAAM,OAAO,CAAA;AAM1E,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAElD,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CA4GjD,CAAA;AAID,OAAO,EAAE,cAAc,EAAE,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"NextFathomProviderApp.d.ts","sourceRoot":"","sources":["../../src/next/NextFathomProviderApp.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAA;AAOtE,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAA;AAGtD,QAAA,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA0F5D,CAAA;AAID,eAAe,qBAAqB,CAAA;AACpC,OAAO,EAAE,qBAAqB,EAAE,CAAA"}
1
+ {"version":3,"file":"NextFathomProviderApp.d.ts","sourceRoot":"","sources":["../../src/next/NextFathomProviderApp.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAA;AAOtE,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAA;AAGtD,QAAA,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAyF5D,CAAA;AAID,eAAe,qBAAqB,CAAA;AACpC,OAAO,EAAE,qBAAqB,EAAE,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"NextFathomProviderPages.d.ts","sourceRoot":"","sources":["../../src/next/NextFathomProviderPages.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAA;AAOtE,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAA;AAGtD,QAAA,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAgG9D,CAAA;AAID,eAAe,uBAAuB,CAAA;AACtC,OAAO,EAAE,uBAAuB,EAAE,CAAA"}
1
+ {"version":3,"file":"NextFathomProviderPages.d.ts","sourceRoot":"","sources":["../../src/next/NextFathomProviderPages.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAA;AAOtE,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAA;AAGtD,QAAA,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA+F9D,CAAA;AAID,eAAe,uBAAuB,CAAA;AACtC,OAAO,EAAE,uBAAuB,EAAE,CAAA"}
@@ -0,0 +1,34 @@
1
+ import React from 'react';
2
+ export interface NextFathomTrackViewAppProps {
3
+ /**
4
+ * Disable automatic pageview tracking on route changes
5
+ * @default false
6
+ */
7
+ disableAutoTrack?: boolean;
8
+ }
9
+ /**
10
+ * Component that tracks pageviews for Next.js App Router.
11
+ * Must be used within a FathomProvider.
12
+ *
13
+ * @example
14
+ * ```tsx
15
+ * // app/layout.tsx
16
+ * import { FathomProvider } from 'react-fathom'
17
+ * import { NextFathomTrackViewApp } from 'react-fathom/next'
18
+ *
19
+ * export default function RootLayout({ children }) {
20
+ * return (
21
+ * <html>
22
+ * <body>
23
+ * <FathomProvider siteId="YOUR_SITE_ID">
24
+ * <NextFathomTrackViewApp />
25
+ * {children}
26
+ * </FathomProvider>
27
+ * </body>
28
+ * </html>
29
+ * )
30
+ * }
31
+ * ```
32
+ */
33
+ export declare const NextFathomTrackViewApp: React.FC<NextFathomTrackViewAppProps>;
34
+ //# sourceMappingURL=NextFathomTrackViewApp.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"NextFathomTrackViewApp.d.ts","sourceRoot":"","sources":["../../src/next/NextFathomTrackViewApp.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAA;AAMhD,MAAM,WAAW,2BAA2B;IAC1C;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC3B;AAED;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,2BAA2B,CAqCxE,CAAA"}
@@ -0,0 +1,30 @@
1
+ import React from 'react';
2
+ export interface NextFathomTrackViewPagesProps {
3
+ /**
4
+ * Disable automatic pageview tracking on route changes
5
+ * @default false
6
+ */
7
+ disableAutoTrack?: boolean;
8
+ }
9
+ /**
10
+ * Component that tracks pageviews for Next.js Pages Router.
11
+ * Must be used within a FathomProvider.
12
+ *
13
+ * @example
14
+ * ```tsx
15
+ * // pages/_app.tsx
16
+ * import { FathomProvider } from 'react-fathom'
17
+ * import { NextFathomTrackViewPages } from 'react-fathom/next'
18
+ *
19
+ * function MyApp({ Component, pageProps }) {
20
+ * return (
21
+ * <FathomProvider siteId="YOUR_SITE_ID">
22
+ * <NextFathomTrackViewPages />
23
+ * <Component {...pageProps} />
24
+ * </FathomProvider>
25
+ * )
26
+ * }
27
+ * ```
28
+ */
29
+ export declare const NextFathomTrackViewPages: React.FC<NextFathomTrackViewPagesProps>;
30
+ //# sourceMappingURL=NextFathomTrackViewPages.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"NextFathomTrackViewPages.d.ts","sourceRoot":"","sources":["../../src/next/NextFathomTrackViewPages.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAA;AAMhD,MAAM,WAAW,6BAA6B;IAC5C;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC3B;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,wBAAwB,EAAE,KAAK,CAAC,EAAE,CAC7C,6BAA6B,CA6C9B,CAAA"}
@@ -2,6 +2,7 @@ import type { ComponentType } from 'react';
2
2
  import type { NextFathomProviderProps } from '../types';
3
3
  /**
4
4
  * Higher-order component that wraps your Next.js App Router app with FathomProvider
5
+ * and automatically tracks pageviews using NextFathomTrackViewApp.
5
6
  *
6
7
  * @example
7
8
  * ```tsx
@@ -1 +1 @@
1
- {"version":3,"file":"withAppRouter.d.ts","sourceRoot":"","sources":["../../../src/next/compositions/withAppRouter.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAG1C,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,UAAU,CAAA;AAEvD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,QAAA,MAAM,aAAa,GAAI,CAAC,SAAS,MAAM,EACrC,WAAW,aAAa,CAAC,CAAC,CAAC,EAC3B,gBAAgB,uBAAuB,KACtC,aAAa,CAAC,CAAC,CAYjB,CAAA;AAED,OAAO,EAAE,aAAa,EAAE,CAAA"}
1
+ {"version":3,"file":"withAppRouter.d.ts","sourceRoot":"","sources":["../../../src/next/compositions/withAppRouter.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAK1C,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,UAAU,CAAA;AAEvD;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,QAAA,MAAM,aAAa,GAAI,CAAC,SAAS,MAAM,EACrC,WAAW,aAAa,CAAC,CAAC,CAAC,EAC3B,gBAAgB,uBAAuB,KACtC,aAAa,CAAC,CAAC,CAgBjB,CAAA;AAED,OAAO,EAAE,aAAa,EAAE,CAAA"}
@@ -2,6 +2,7 @@ import type { ComponentType } from 'react';
2
2
  import type { NextFathomProviderProps } from '../types';
3
3
  /**
4
4
  * Higher-order component that wraps your Next.js Pages Router app with FathomProvider
5
+ * and automatically tracks pageviews using NextFathomTrackViewPages.
5
6
  *
6
7
  * @example
7
8
  * ```tsx
@@ -1 +1 @@
1
- {"version":3,"file":"withPagesRouter.d.ts","sourceRoot":"","sources":["../../../src/next/compositions/withPagesRouter.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAG1C,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,UAAU,CAAA;AAEvD;;;;;;;;;;;;;;;;;;;GAmBG;AACH,QAAA,MAAM,eAAe,GAAI,CAAC,SAAS,MAAM,EACvC,WAAW,aAAa,CAAC,CAAC,CAAC,EAC3B,gBAAgB,uBAAuB,KACtC,aAAa,CAAC,CAAC,CAYjB,CAAA;AAED,OAAO,EAAE,eAAe,EAAE,CAAA"}
1
+ {"version":3,"file":"withPagesRouter.d.ts","sourceRoot":"","sources":["../../../src/next/compositions/withPagesRouter.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAK1C,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,UAAU,CAAA;AAEvD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,QAAA,MAAM,eAAe,GAAI,CAAC,SAAS,MAAM,EACvC,WAAW,aAAa,CAAC,CAAC,CAAC,EAC3B,gBAAgB,uBAAuB,KACtC,aAAa,CAAC,CAAC,CAgBjB,CAAA;AAED,OAAO,EAAE,eAAe,EAAE,CAAA"}
@@ -1,6 +1,5 @@
1
- export * from './NextFathomProviderPages';
2
- export * from './NextFathomProviderApp';
3
- export * from './NextFathomProvider';
1
+ export * from './NextFathomTrackViewPages';
2
+ export * from './NextFathomTrackViewApp';
4
3
  export * from './compositions/withPagesRouter';
5
4
  export * from './compositions/withAppRouter';
6
5
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/next/index.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAA;AACzC,cAAc,yBAAyB,CAAA;AACvC,cAAc,sBAAsB,CAAA;AAGpC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,8BAA8B,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/next/index.ts"],"names":[],"mappings":"AACA,cAAc,4BAA4B,CAAA;AAC1C,cAAc,0BAA0B,CAAA;AAGxC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,8BAA8B,CAAA"}
@@ -1,5 +1,4 @@
1
1
  import type { PropsWithChildren } from 'react';
2
- import type { PageViewOptions } from 'fathom-client';
3
2
  import type { FathomProviderProps } from '../types';
4
3
  export interface NextFathomProviderProps extends PropsWithChildren, Omit<FathomProviderProps, 'disableDefaultTrack'> {
5
4
  /**
@@ -7,10 +6,5 @@ export interface NextFathomProviderProps extends PropsWithChildren, Omit<FathomP
7
6
  * @default false
8
7
  */
9
8
  disableAutoTrack?: boolean;
10
- /**
11
- * Default options to pass to trackPageview on route changes
12
- * @deprecated Use `defaultPageviewOptions` instead
13
- */
14
- trackDefaultOptions?: PageViewOptions;
15
9
  }
16
10
  //# sourceMappingURL=types.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/next/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAE9C,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAEpD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAA;AAEnD,MAAM,WAAW,uBACf,SAAQ,iBAAiB,EAAE,IAAI,CAAC,mBAAmB,EAAE,qBAAqB,CAAC;IAC3E;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B;;;OAGG;IACH,mBAAmB,CAAC,EAAE,eAAe,CAAA;CACtC"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/next/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAE9C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAA;AAEnD,MAAM,WAAW,uBACf,SAAQ,iBAAiB,EAAE,IAAI,CAAC,mBAAmB,EAAE,qBAAqB,CAAC;IAC3E;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC3B"}
package/types/types.d.ts CHANGED
@@ -27,7 +27,6 @@ export interface FathomProviderProps extends PropsWithChildren {
27
27
  client?: FathomClient;
28
28
  clientOptions?: LoadOptions;
29
29
  siteId?: string;
30
- disableDefaultTrack?: boolean;
31
30
  defaultPageviewOptions?: PageViewOptions;
32
31
  defaultEventOptions?: EventOptions;
33
32
  }
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAE9C,OAAO,KAAK,EAAE,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAE/E,MAAM,WAAW,YAAY;IAC3B,kBAAkB,EAAE,MAAM,IAAI,CAAA;IAC9B,mBAAmB,EAAE,MAAM,IAAI,CAAA;IAC/B,aAAa,EAAE,CAAC,IAAI,CAAC,EAAE,eAAe,KAAK,IAAI,CAAA;IAC/C,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAChD,UAAU,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,YAAY,KAAK,IAAI,CAAA;IAC5D,OAAO,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IAC7B,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,WAAW,KAAK,IAAI,CAAA;IACrD,iBAAiB,EAAE,MAAM,OAAO,CAAA;CACjC;AAED,MAAM,WAAW,sBAAsB;IACrC,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC/B,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAA;IAChC,iBAAiB,CAAC,EAAE,MAAM,OAAO,CAAA;IACjC,IAAI,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,WAAW,KAAK,IAAI,CAAA;IACtD,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,aAAa,CAAC,EAAE,CAAC,OAAO,CAAC,EAAE,eAAe,KAAK,IAAI,CAAA;IACnD,UAAU,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,YAAY,KAAK,IAAI,CAAA;IAChE,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjD,MAAM,CAAC,EAAE,YAAY,CAAA;IACrB,sBAAsB,CAAC,EAAE,eAAe,CAAA;IACxC,mBAAmB,CAAC,EAAE,YAAY,CAAA;CACnC;AAED,MAAM,WAAW,mBAAoB,SAAQ,iBAAiB;IAC5D,MAAM,CAAC,EAAE,YAAY,CAAA;IACrB,aAAa,CAAC,EAAE,WAAW,CAAA;IAC3B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,sBAAsB,CAAC,EAAE,eAAe,CAAA;IACxC,mBAAmB,CAAC,EAAE,YAAY,CAAA;CACnC"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAE9C,OAAO,KAAK,EAAE,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAE/E,MAAM,WAAW,YAAY;IAC3B,kBAAkB,EAAE,MAAM,IAAI,CAAA;IAC9B,mBAAmB,EAAE,MAAM,IAAI,CAAA;IAC/B,aAAa,EAAE,CAAC,IAAI,CAAC,EAAE,eAAe,KAAK,IAAI,CAAA;IAC/C,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAChD,UAAU,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,YAAY,KAAK,IAAI,CAAA;IAC5D,OAAO,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IAC7B,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,WAAW,KAAK,IAAI,CAAA;IACrD,iBAAiB,EAAE,MAAM,OAAO,CAAA;CACjC;AAED,MAAM,WAAW,sBAAsB;IACrC,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC/B,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAA;IAChC,iBAAiB,CAAC,EAAE,MAAM,OAAO,CAAA;IACjC,IAAI,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,WAAW,KAAK,IAAI,CAAA;IACtD,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,aAAa,CAAC,EAAE,CAAC,OAAO,CAAC,EAAE,eAAe,KAAK,IAAI,CAAA;IACnD,UAAU,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,YAAY,KAAK,IAAI,CAAA;IAChE,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjD,MAAM,CAAC,EAAE,YAAY,CAAA;IACrB,sBAAsB,CAAC,EAAE,eAAe,CAAA;IACxC,mBAAmB,CAAC,EAAE,YAAY,CAAA;CACnC;AAED,MAAM,WAAW,mBAAoB,SAAQ,iBAAiB;IAC5D,MAAM,CAAC,EAAE,YAAY,CAAA;IACrB,aAAa,CAAC,EAAE,WAAW,CAAA;IAC3B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,sBAAsB,CAAC,EAAE,eAAe,CAAA;IACxC,mBAAmB,CAAC,EAAE,YAAY,CAAA;CACnC"}
@@ -1,131 +0,0 @@
1
- import React from 'react'
2
-
3
- import { beforeEach, describe, expect, it, vi } from 'vitest'
4
-
5
- import { render, screen, waitFor } from '@testing-library/react'
6
-
7
- import { NextFathomProvider } from './NextFathomProvider'
8
-
9
- // Mock the lazy-loaded providers
10
- vi.mock('./NextFathomProviderApp', () => ({
11
- default: ({
12
- children,
13
- siteId,
14
- }: {
15
- children: React.ReactNode
16
- siteId?: string
17
- }) => (
18
- <div data-testid="app-provider" data-site-id={siteId}>
19
- {children}
20
- </div>
21
- ),
22
- }))
23
-
24
- vi.mock('./NextFathomProviderPages', () => ({
25
- default: ({
26
- children,
27
- siteId,
28
- }: {
29
- children: React.ReactNode
30
- siteId?: string
31
- }) => (
32
- <div data-testid="pages-provider" data-site-id={siteId}>
33
- {children}
34
- </div>
35
- ),
36
- }))
37
-
38
- describe('NextFathomProvider', () => {
39
- beforeEach(() => {
40
- vi.clearAllMocks()
41
- })
42
-
43
- it('should render App Router provider by default', async () => {
44
- render(
45
- <NextFathomProvider siteId="TEST_SITE_ID">
46
- <div>Test Content</div>
47
- </NextFathomProvider>,
48
- )
49
-
50
- await waitFor(() => {
51
- expect(screen.getByTestId('app-provider')).toBeInTheDocument()
52
- expect(screen.getByTestId('app-provider')).toHaveAttribute(
53
- 'data-site-id',
54
- 'TEST_SITE_ID',
55
- )
56
- })
57
-
58
- expect(screen.getByText('Test Content')).toBeInTheDocument()
59
- })
60
-
61
- it('should render App Router provider when router="app"', async () => {
62
- render(
63
- <NextFathomProvider siteId="TEST_SITE_ID" router="app">
64
- <div>Test Content</div>
65
- </NextFathomProvider>,
66
- )
67
-
68
- await waitFor(() => {
69
- expect(screen.getByTestId('app-provider')).toBeInTheDocument()
70
- })
71
-
72
- expect(screen.queryByTestId('pages-provider')).not.toBeInTheDocument()
73
- })
74
-
75
- it('should render Pages Router provider when router="pages"', async () => {
76
- render(
77
- <NextFathomProvider siteId="TEST_SITE_ID" router="pages">
78
- <div>Test Content</div>
79
- </NextFathomProvider>,
80
- )
81
-
82
- await waitFor(() => {
83
- expect(screen.getByTestId('pages-provider')).toBeInTheDocument()
84
- expect(screen.getByTestId('pages-provider')).toHaveAttribute(
85
- 'data-site-id',
86
- 'TEST_SITE_ID',
87
- )
88
- })
89
-
90
- expect(screen.queryByTestId('app-provider')).not.toBeInTheDocument()
91
- expect(screen.getByText('Test Content')).toBeInTheDocument()
92
- })
93
-
94
- it('should render custom fallback while loading', async () => {
95
- render(
96
- <NextFathomProvider
97
- siteId="TEST_SITE_ID"
98
- fallback={<div>Loading...</div>}
99
- >
100
- <div>Test Content</div>
101
- </NextFathomProvider>,
102
- )
103
-
104
- // Suspense fallback may be shown briefly, but provider should load quickly
105
- await waitFor(() => {
106
- expect(screen.getByTestId('app-provider')).toBeInTheDocument()
107
- })
108
- })
109
-
110
- it('should pass all props to the underlying provider', async () => {
111
- const clientOptions = { honorDNT: true }
112
- render(
113
- <NextFathomProvider
114
- siteId="TEST_SITE_ID"
115
- router="app"
116
- clientOptions={clientOptions}
117
- disableAutoTrack
118
- >
119
- <div>Test Content</div>
120
- </NextFathomProvider>,
121
- )
122
-
123
- await waitFor(() => {
124
- expect(screen.getByTestId('app-provider')).toBeInTheDocument()
125
- })
126
- })
127
-
128
- it('should have displayName', () => {
129
- expect(NextFathomProvider.displayName).toBe('NextFathomProvider')
130
- })
131
- })
@@ -1,62 +0,0 @@
1
- import React, { Suspense, lazy, useMemo } from 'react'
2
-
3
- import type { NextFathomProviderProps } from './types'
4
-
5
- export interface NextFathomProviderComponentProps extends NextFathomProviderProps {
6
- /**
7
- * Router type to use
8
- * @default 'app'
9
- */
10
- router?: 'pages' | 'app'
11
- /**
12
- * Fallback component to show while loading the router provider
13
- * @default null
14
- */
15
- fallback?: React.ReactNode
16
- }
17
-
18
- // Dynamically import providers to enable code-splitting
19
- const NextFathomProviderAppLazy = lazy(
20
- async () => await import('./NextFathomProviderApp'),
21
- )
22
- const NextFathomProviderPagesLazy = lazy(
23
- async () => await import('./NextFathomProviderPages'),
24
- )
25
-
26
- /**
27
- * Unified provider component that conditionally renders the appropriate
28
- * Next.js router provider based on the `router` prop.
29
- * Providers are dynamically loaded to avoid bundling both router types.
30
- *
31
- * @example
32
- * ```tsx
33
- * // App Router (default)
34
- * <NextFathomProvider siteId="YOUR_SITE_ID" router="app">
35
- * <App>{children}</App>
36
- * </NextFathomProvider>
37
- *
38
- * // Pages Router
39
- * <NextFathomProvider siteId="YOUR_SITE_ID" router="pages">
40
- * <App>{children}</App>
41
- * </NextFathomProvider>
42
- * ```
43
- */
44
- export const NextFathomProvider: React.FC<NextFathomProviderComponentProps> = ({
45
- router = 'app',
46
- fallback = null,
47
- ...props
48
- }) => {
49
- const Provider = useMemo(() => {
50
- return router === 'pages'
51
- ? NextFathomProviderPagesLazy
52
- : NextFathomProviderAppLazy
53
- }, [router])
54
-
55
- return (
56
- <Suspense fallback={fallback}>
57
- <Provider {...props} />
58
- </Suspense>
59
- )
60
- }
61
-
62
- NextFathomProvider.displayName = 'NextFathomProvider'