fix: keep text

launchdarkly · Oct 1, 2024 · b352142 · b352142
1 parent 59dc44d
commit b352142
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 17 deletions.
diff --git 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
@@ -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
@@ -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);