From a0046f330fa9500687ac41981e7244bfd1fd5d61 Mon Sep 17 00:00:00 2001
From: wobsoriano <sorianorobertc@gmail.com>
Date: Wed, 12 Feb 2025 08:26:24 -0800
Subject: [PATCH 1/2] chore: Remove deprecated as prop in unstyled components

---
 .../unstyled/SignInButton.astro               | 21 +++++++------------
 .../unstyled/SignOutButton.astro              | 21 +++++++------------
 .../unstyled/SignUpButton.astro               | 21 +++++++------------
 .../src/astro-components/unstyled/utils.ts    | 14 -------------
 packages/astro/src/types.ts                   | 11 +---------
 5 files changed, 22 insertions(+), 66 deletions(-)

diff --git a/packages/astro/src/astro-components/unstyled/SignInButton.astro b/packages/astro/src/astro-components/unstyled/SignInButton.astro
index ed95f51168b..b0ece650ba8 100644
--- a/packages/astro/src/astro-components/unstyled/SignInButton.astro
+++ b/packages/astro/src/astro-components/unstyled/SignInButton.astro
@@ -1,21 +1,14 @@
 ---
-import type { HTMLTag, Polymorphic } from 'astro/types'
-import type { SignInButtonProps } from '@clerk/types'
-import type { ButtonProps } from '../../types';
-import { addUnstyledAttributeToFirstTag, logAsPropUsageDeprecation } from './utils'
-
-type Props<Tag extends HTMLTag = 'button'> = Polymorphic<ButtonProps<Tag>> & SignInButtonProps;
-
+import type { SignInButtonProps } from '@clerk/types';
+import type { AsChildProps } from '../../types';
+import { addUnstyledAttributeToFirstTag } from './utils';
 import { generateSafeId } from '@clerk/astro/internal';
 
-const safeId = generateSafeId();
+type Props = AsChildProps<SignInButtonProps>;
 
-if ('as' in Astro.props) {
-  logAsPropUsageDeprecation()
-}
+const safeId = generateSafeId();
 
 const {
-  as: Tag = 'button',
   asChild,
   forceRedirectUrl,
   fallbackRedirectUrl,
@@ -44,9 +37,9 @@ if (asChild) {
   asChild ? (
     <Fragment set:html={htmlElement} />
   ) : (
-    <Tag {...props} data-clerk-unstyled-id={safeId}>
+    <button {...props} data-clerk-unstyled-id={safeId}>
       <slot>Sign in</slot>
-    </Tag >
+    </button >
   )
 }
 
diff --git a/packages/astro/src/astro-components/unstyled/SignOutButton.astro b/packages/astro/src/astro-components/unstyled/SignOutButton.astro
index b855ed37fc3..a27d3088c1e 100644
--- a/packages/astro/src/astro-components/unstyled/SignOutButton.astro
+++ b/packages/astro/src/astro-components/unstyled/SignOutButton.astro
@@ -1,21 +1,14 @@
 ---
-import type { HTMLTag, Polymorphic } from 'astro/types'
-import type { SignOutOptions, Without } from '@clerk/types'
-import type { ButtonProps } from '../../types';
-import { addUnstyledAttributeToFirstTag, logAsPropUsageDeprecation } from './utils'
+import type { SignOutOptions } from '@clerk/types';
+import type { AsChildProps } from '../../types';
+import { addUnstyledAttributeToFirstTag } from './utils';
+import { generateSafeId } from '@clerk/astro/internal';
 
-type Props<Tag extends HTMLTag = 'button'> = Polymorphic<SignOutOptions & ButtonProps<Tag>>
-
-import { generateSafeId } from '@clerk/astro/internal'
+type Props = AsChildProps<SignOutOptions>;
 
 const safeId = generateSafeId();
 
-if ('as' in Astro.props) {
-  logAsPropUsageDeprecation()
-}
-
 const {
-  as: Tag = 'button',
   asChild,
   redirectUrl = '/',
   sessionId,
@@ -34,9 +27,9 @@ if (asChild) {
   asChild ? (
     <Fragment set:html={htmlElement} />
   ) : (
-    <Tag {...elementProps} data-clerk-unstyled-id={safeId}>
+    <button {...elementProps} data-clerk-unstyled-id={safeId}>
       <slot>Sign out</slot>
-    </Tag >
+    </button >
   )
 }
 
diff --git a/packages/astro/src/astro-components/unstyled/SignUpButton.astro b/packages/astro/src/astro-components/unstyled/SignUpButton.astro
index 3576892b1b8..92aa9a9f57b 100644
--- a/packages/astro/src/astro-components/unstyled/SignUpButton.astro
+++ b/packages/astro/src/astro-components/unstyled/SignUpButton.astro
@@ -1,21 +1,14 @@
 ---
-import type { HTMLTag, Polymorphic } from 'astro/types'
-import type { SignUpButtonProps } from '@clerk/types'
-import type { ButtonProps } from '../../types'
-import { addUnstyledAttributeToFirstTag, logAsPropUsageDeprecation } from './utils'
-
-type Props<Tag extends HTMLTag = 'button'> = Polymorphic<ButtonProps<Tag>> & SignUpButtonProps;
-
+import type { SignUpButtonProps } from '@clerk/types';
+import type { AsChildProps } from '../../types';
+import { addUnstyledAttributeToFirstTag } from './utils';
 import { generateSafeId } from '@clerk/astro/internal';
 
 const safeId = generateSafeId();
 
-if ('as' in Astro.props) {
-  logAsPropUsageDeprecation()
-}
-
+type Props = AsChildProps<SignUpButtonProps>;
+  
 const {
-  as: Tag = 'button',
   asChild,
   fallbackRedirectUrl,
   forceRedirectUrl,
@@ -46,9 +39,9 @@ if (asChild) {
   asChild ? (
     <Fragment set:html={htmlElement} />
   ) : (
-    <Tag {...props} data-clerk-unstyled-id={safeId}>
+    <button {...props} data-clerk-unstyled-id={safeId}>
       <slot>Sign up</slot>
-    </Tag >
+    </button >
   )
 }
 
diff --git a/packages/astro/src/astro-components/unstyled/utils.ts b/packages/astro/src/astro-components/unstyled/utils.ts
index 255e7949d00..6a1c08fbc21 100644
--- a/packages/astro/src/astro-components/unstyled/utils.ts
+++ b/packages/astro/src/astro-components/unstyled/utils.ts
@@ -5,17 +5,3 @@
 export function addUnstyledAttributeToFirstTag(html: string, attributeValue: string): string {
   return html.replace(/(<[^>]+)>/, `$1 data-clerk-unstyled-id="${attributeValue}">`);
 }
-
-/**
- * Logs a deprecation warning when the 'as' prop is used.
- */
-export function logAsPropUsageDeprecation() {
-  if (import.meta.env.PROD) {
-    return;
-  }
-
-  console.warn(
-    `[@clerk/astro] The 'as' prop is deprecated and will be removed in a future version. ` +
-      `Use the default slot with the 'asChild' prop instead. `,
-  );
-}
diff --git a/packages/astro/src/types.ts b/packages/astro/src/types.ts
index 49054017e2c..25b63e3e213 100644
--- a/packages/astro/src/types.ts
+++ b/packages/astro/src/types.ts
@@ -71,15 +71,6 @@ type ProtectProps =
 
 export type { AstroClerkUpdateOptions, AstroClerkIntegrationParams, AstroClerkCreateInstanceParams, ProtectProps };
 
-export type ButtonProps<Tag> = {
-  /**
-   * @deprecated The 'as' prop is deprecated and will be removed in a future version.
-   * Use the default slot with the 'asChild' prop instead.
-   * @example
-   * <SignInButton asChild>
-   *   <button>Sign in</button>
-   * </SignInButton>
-   */
-  as: Tag;
+export type AsChildProps<T> = T & {
   asChild?: boolean;
 };

From bf56d6493703138892e3f85daf15b2aa0c4354bb Mon Sep 17 00:00:00 2001
From: Robert Soriano <sorianorobertc@gmail.com>
Date: Wed, 12 Feb 2025 08:29:56 -0800
Subject: [PATCH 2/2] chore: add changeset

---
 .changeset/smart-rabbits-reflect.md | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)
 create mode 100644 .changeset/smart-rabbits-reflect.md

diff --git a/.changeset/smart-rabbits-reflect.md b/.changeset/smart-rabbits-reflect.md
new file mode 100644
index 00000000000..2ebd0684fc9
--- /dev/null
+++ b/.changeset/smart-rabbits-reflect.md
@@ -0,0 +1,17 @@
+---
+"@clerk/astro": minor
+---
+
+Remove deprecated `as` prop in the `<SignInButton />`, `<SignOutButton />`, and `<SignUpButton>` components. Please use the `asChild` prop if you are passing children to it.
+
+Example:
+
+```astro
+---
+import { SignInButton } from '@clerk/astro/components'
+---
+
+<SignInButton asChild>
+  <button>Custom sign in button</button>
+</SignInButton>
+```