diff --git a/.changeset/empty-roses-peel.md b/.changeset/empty-roses-peel.md new file mode 100644 index 0000000000..7d7d8dd243 --- /dev/null +++ b/.changeset/empty-roses-peel.md @@ -0,0 +1,5 @@ +--- +'@clerk/astro': minor +--- + +Introduce `` component for Astro diff --git a/packages/astro/src/astro-components/index.ts b/packages/astro/src/astro-components/index.ts index bd41eafb34..67be6d14e3 100644 --- a/packages/astro/src/astro-components/index.ts +++ b/packages/astro/src/astro-components/index.ts @@ -24,3 +24,4 @@ export { OrganizationProfile } from './interactive/OrganizationProfile'; export { OrganizationSwitcher } from './interactive/OrganizationSwitcher'; export { default as OrganizationList } from './interactive/OrganizationList.astro'; export { default as GoogleOneTap } from './interactive/GoogleOneTap.astro'; +export { default as Waitlist } from './interactive/Waitlist.astro'; diff --git a/packages/astro/src/astro-components/interactive/InternalUIComponentRenderer.astro b/packages/astro/src/astro-components/interactive/InternalUIComponentRenderer.astro index d7facd1f9a..51da54a4c5 100644 --- a/packages/astro/src/astro-components/interactive/InternalUIComponentRenderer.astro +++ b/packages/astro/src/astro-components/interactive/InternalUIComponentRenderer.astro @@ -1,13 +1,22 @@ --- interface Props { - [key: string]: unknown - id?: string - component: 'sign-in' | 'sign-up' | 'organization-list' | 'organization-profile' | 'organization-switcher' | 'user-button' | 'user-profile' | 'google-one-tap' + [key: string]: unknown; + id?: string; + component: + | 'sign-in' + | 'sign-up' + | 'organization-list' + | 'organization-profile' + | 'organization-switcher' + | 'user-button' + | 'user-profile' + | 'google-one-tap' + | 'waitlist'; } import { generateSafeId } from '@clerk/astro/internal'; -const { component, id, ...props } = Astro.props +const { component, id, ...props } = Astro.props; const safeId = id || generateSafeId(); --- diff --git a/packages/astro/src/astro-components/interactive/Waitlist.astro b/packages/astro/src/astro-components/interactive/Waitlist.astro new file mode 100644 index 0000000000..cfbcbb6bdc --- /dev/null +++ b/packages/astro/src/astro-components/interactive/Waitlist.astro @@ -0,0 +1,8 @@ +--- +import type { WaitlistProps } from "@clerk/types"; +type Props = WaitlistProps + +import InternalUIComponentRenderer from './InternalUIComponentRenderer.astro' +--- + + diff --git a/packages/astro/src/internal/mount-clerk-astro-js-components.ts b/packages/astro/src/internal/mount-clerk-astro-js-components.ts index af8fb87ea7..0a9664450d 100644 --- a/packages/astro/src/internal/mount-clerk-astro-js-components.ts +++ b/packages/astro/src/internal/mount-clerk-astro-js-components.ts @@ -13,6 +13,7 @@ const mountAllClerkAstroJSComponents = () => { 'sign-in': 'mountSignIn', 'sign-up': 'mountSignUp', 'google-one-tap': 'openGoogleOneTap', + waitlist: 'mountWaitlist', } as const; Object.entries(mountFns).forEach(([category, mountFn]) => { diff --git a/packages/astro/src/react/uiComponents.tsx b/packages/astro/src/react/uiComponents.tsx index 3bedd626e4..9b7ad219cb 100644 --- a/packages/astro/src/react/uiComponents.tsx +++ b/packages/astro/src/react/uiComponents.tsx @@ -7,6 +7,7 @@ import type { SignUpProps, UserButtonProps, UserProfileProps, + WaitlistProps, } from '@clerk/types'; import React from 'react'; @@ -174,3 +175,13 @@ export const GoogleOneTap = withClerk(({ clerk, ...props }: WithClerkProp ); }, 'GoogleOneTap'); + +export const Waitlist = withClerk(({ clerk, ...props }: WithClerkProp) => { + return ( + + ); +}, 'Waitlist');