diff --git a/.changeset/good-paws-wonder.md b/.changeset/good-paws-wonder.md new file mode 100644 index 00000000000..147044325a4 --- /dev/null +++ b/.changeset/good-paws-wonder.md @@ -0,0 +1,5 @@ +--- +'@clerk/elements': patch +--- + +Widen optional peerDependency of `next` to include `>=15.0.0-rc`. This way you can use Next.js 15 with Clerk Elements without your package manager complaining. Also allow React 19. diff --git a/packages/elements/package.json b/packages/elements/package.json index 0915f12b908..4fe6090df7f 100644 --- a/packages/elements/package.json +++ b/packages/elements/package.json @@ -95,9 +95,9 @@ "peerDependencies": { "@clerk/clerk-react": "^5.0.0", "@clerk/shared": "^2.0.0", - "next": "^13.5.4 || ^14.0.3", - "react": ">=18", - "react-dom": ">=18" + "next": "^13.5.4 || ^14.0.3 || ^15.0.0-rc", + "react": "^18.0.0 || ^19.0.0-beta", + "react-dom": "^18.0.0 || ^19.0.0-beta" }, "peerDependenciesMeta": { "next": { diff --git a/packages/elements/src/index.ts b/packages/elements/src/index.ts index 7d21ce99b4b..1eb9b4dc1a7 100644 --- a/packages/elements/src/index.ts +++ b/packages/elements/src/index.ts @@ -1,6 +1,5 @@ -// TODO: Add link to docs throw new Error(`No exports are available from the top-level "@clerk/elements" package. Use specific subpath imports instead, e.g. "@clerk/elements/sign-in". Find all available exports in the documentation: -https://clerk.com/docs`); +https://clerk.com/docs/elements/overview`); diff --git a/packages/elements/src/internals/machines/shared/shared.actors.ts b/packages/elements/src/internals/machines/shared/shared.actors.ts index d431000fdd1..61f7692e40a 100644 --- a/packages/elements/src/internals/machines/shared/shared.actors.ts +++ b/packages/elements/src/internals/machines/shared/shared.actors.ts @@ -1,24 +1,6 @@ import type { Clerk, LoadedClerk } from '@clerk/types'; import type { EventObject } from 'xstate'; -import { fromCallback, fromPromise } from 'xstate'; - -import { ClerkElementsRuntimeError } from '~/internals/errors'; - -// TODO: Remove -/** @deprecated Use clerkLoader instead */ -export const waitForClerk = fromPromise(({ input: clerk }) => { - return new Promise((resolve, reject) => { - if (clerk.loaded) { - resolve(clerk as LoadedClerk); - } else if ('addOnLoaded' in clerk) { - // @ts-expect-error - Expects addOnLoaded from IsomorphicClerk. - // We don't want internals to rely on the @clerk/clerk-react package - clerk.addOnLoaded(() => resolve(clerk as LoadedClerk)); - } else { - reject(new ClerkElementsRuntimeError('Clerk client could not be loaded')); - } - }); -}); +import { fromCallback } from 'xstate'; export type ClerkLoaderEvents = { type: 'CLERK.READY' } | { type: 'CLERK.ERROR'; message: string }; diff --git a/packages/elements/src/react/router/__tests__/router.test.ts b/packages/elements/src/react/router/__tests__/router.test.ts index 954a345f7a1..834b8729a59 100644 --- a/packages/elements/src/react/router/__tests__/router.test.ts +++ b/packages/elements/src/react/router/__tests__/router.test.ts @@ -35,6 +35,15 @@ describe('createClerkRouter', () => { expect(clerkRouter.match(path)).toBe(true); }); + it('normalizes path arguments internally', () => { + const path = 'dashboard/'; + const clerkRouter = createClerkRouter(mockRouter, 'app/'); + + mockRouter.pathname.mockReturnValue('/app/dashboard'); + + expect(clerkRouter.match(path)).toBe(true); + }); + it('throws an error when no path is provided', () => { const clerkRouter = createClerkRouter(mockRouter, '/app');