From b35214212de45f595b6fcbad47cf371b7b23996e Mon Sep 17 00:00:00 2001
From: Robb Niznik <rniznik@launchdarkly.com>
Date: Tue, 1 Oct 2024 16:22:02 -0400
Subject: [PATCH] fix: keep text

---
 packages/components/src/Button.tsx               | 10 +++++-----
 packages/components/src/styles/Button.module.css | 12 ++----------
 packages/components/stories/Button.stories.tsx   |  4 ++--
 3 files changed, 9 insertions(+), 17 deletions(-)

diff --git a/packages/components/src/Button.tsx b/packages/components/src/Button.tsx
index 206ac4a74..b4516bac6 100644
--- a/packages/components/src/Button.tsx
+++ b/packages/components/src/Button.tsx
@@ -6,7 +6,9 @@ import { cva, cx } from 'class-variance-authority';
 import { forwardRef } from 'react';
 import {
 	Button as AriaButton,
+	Provider,
 	SelectContext,
+	TextContext,
 	composeRenderProps,
 	useSlottedContext,
 } from 'react-aria-components';
@@ -57,12 +59,10 @@ const _Button = (
 			)}
 		>
 			{composeRenderProps(props.children, (children, { isPending }) => (
-				<>
+				<Provider values={[[TextContext, { className: isPending ? styles.pending : undefined }]]}>
 					{children}
-					{isPending && (
-						<ProgressBar isIndeterminate aria-label="loading" className={styles.progress} />
-					)}
-				</>
+					{isPending && <ProgressBar isIndeterminate aria-label="loading" />}
+				</Provider>
 			))}
 		</AriaButton>
 	);
diff --git a/packages/components/src/styles/Button.module.css b/packages/components/src/styles/Button.module.css
index c59ef1816..c7651fce0 100644
--- a/packages/components/src/styles/Button.module.css
+++ b/packages/components/src/styles/Button.module.css
@@ -216,14 +216,6 @@
 	z-index: 1;
 }
 
-.base[data-pending] {
-	position: relative;
-	color: transparent;
-}
-
-.progress {
-	position: absolute;
-	top: 50%;
-	left: 50%;
-	transform: translate(-50%, -50%);
+.pending {
+	opacity: 50%;
 }
diff --git a/packages/components/stories/Button.stories.tsx b/packages/components/stories/Button.stories.tsx
index 31be29231..58948463b 100644
--- a/packages/components/stories/Button.stories.tsx
+++ b/packages/components/stories/Button.stories.tsx
@@ -6,7 +6,7 @@ import { vars } from '@launchpad-ui/vars';
 import { fireEvent, userEvent, within } from '@storybook/test';
 import { useEffect, useRef, useState } from 'react';
 
-import { Button } from '../src';
+import { Button, Text } from '../src';
 
 const meta: Meta<typeof Button> = {
 	component: Button,
@@ -157,7 +157,7 @@ export const Pending: Story = {
 		return <Button isPending={isPending} onPress={handlePress} {...args} />;
 	},
 	args: {
-		children: 'Pending',
+		children: <Text>Pending</Text>,
 	},
 	play: async ({ canvasElement }) => {
 		const canvas = within(canvasElement);