diff --git a/packages/manager/src/components/CheckoutBar/CheckoutBar.stories.tsx b/packages/manager/src/components/CheckoutBar/CheckoutBar.stories.tsx
index 0a62cd0bb74..85976149c20 100644
--- a/packages/manager/src/components/CheckoutBar/CheckoutBar.stories.tsx
+++ b/packages/manager/src/components/CheckoutBar/CheckoutBar.stories.tsx
@@ -1,4 +1,3 @@
-import { styled } from '@mui/material/styles';
 import React from 'react';
 
 import { Typography } from 'src/components/Typography';
@@ -10,15 +9,9 @@ import type { Meta, StoryFn, StoryObj } from '@storybook/react';
 type Story = StoryObj<typeof CheckoutBar>;
 
 const Item = ({ children }: { children?: React.ReactNode }) => (
-  <StyledItem>{children}</StyledItem>
+  <Typography sx={{ fontStyle: 'italic' }}>{children}</Typography>
 );
 
-const StyledItem = styled(Typography, {
-  label: 'StyledItem',
-})(() => ({
-  fontStyle: 'italic',
-}));
-
 const defaultArgs = {
   calculatedPrice: 30.0,
   children: <Item>Child items can go here!</Item>,