diff --git a/apps/meteor/client/components/InfoPanel/RetentionPolicyCallout.spec.tsx b/apps/meteor/client/components/InfoPanel/RetentionPolicyCallout.spec.tsx
index 015cc2b4606..9da876c2050 100644
--- a/apps/meteor/client/components/InfoPanel/RetentionPolicyCallout.spec.tsx
+++ b/apps/meteor/client/components/InfoPanel/RetentionPolicyCallout.spec.tsx
@@ -1,29 +1,24 @@
-import { render, screen } from '@testing-library/react';
+import { composeStories } from '@storybook/react';
+import { render } from '@testing-library/react';
+import { axe } from 'jest-axe';
 
-import RetentionPolicyCallout from './RetentionPolicyCallout';
-import { createRenteionPolicySettingsMock as createMock } from '../../../tests/mocks/client/mockRetentionPolicySettings';
-import { createFakeRoom } from '../../../tests/mocks/data';
+import * as stories from './RetentionPolicyCallout.stories';
 
-jest.useFakeTimers();
+const testCases = Object.values(composeStories(stories)).map((Story) => [Story.storyName || 'Story', Story]);
 
-beforeEach(() => {
+test.each(testCases)(`renders %s without crashing`, async (_storyname, Story) => {
+	jest.useFakeTimers();
 	jest.setSystemTime(new Date(2024, 5, 1, 0, 0, 0));
+
+	const { baseElement } = render(<Story />);
+	expect(baseElement).toMatchSnapshot();
 });
 
-describe('RetentionPolicyCallout', () => {
-	it('Should render callout if settings are valid', () => {
-		const fakeRoom = createFakeRoom({ t: 'c' });
-		render(<RetentionPolicyCallout room={fakeRoom} />, {
-			wrapper: createMock({ appliesToChannels: true, TTLChannels: 60000 }),
-		});
-		expect(screen.getByRole('alert')).toHaveTextContent('a minute June 1, 2024 at 12:30 AM');
-	});
+test.each(testCases)('%s should have no a11y violations', async (_storyname, Story) => {
+	// We have to use real timers here because `jest-axe` is breaking otherwise
+	jest.useRealTimers();
+	const { container } = render(<Story />);
 
-	it('Should not render callout if settings are invalid', () => {
-		const fakeRoom = createFakeRoom({ t: 'c' });
-		render(<RetentionPolicyCallout room={fakeRoom} />, {
-			wrapper: createMock({ appliesToChannels: true, TTLChannels: 60000, advancedPrecisionCron: '* * * 12 *', advancedPrecision: true }),
-		});
-		expect(screen.queryByRole('alert')).not.toBeInTheDocument();
-	});
+	const results = await axe(container);
+	expect(results).toHaveNoViolations();
 });
diff --git a/apps/meteor/client/components/InfoPanel/RetentionPolicyCallout.stories.tsx b/apps/meteor/client/components/InfoPanel/RetentionPolicyCallout.stories.tsx
new file mode 100644
index 00000000000..aec43f8d332
--- /dev/null
+++ b/apps/meteor/client/components/InfoPanel/RetentionPolicyCallout.stories.tsx
@@ -0,0 +1,32 @@
+import type { Meta, StoryFn } from '@storybook/react';
+
+import RetentionPolicyCallout from './RetentionPolicyCallout';
+import { createRenteionPolicySettingsMock as createMock } from '../../../tests/mocks/client/mockRetentionPolicySettings';
+import { createFakeRoom } from '../../../tests/mocks/data';
+
+export default {
+	component: RetentionPolicyCallout,
+} satisfies Meta<typeof RetentionPolicyCallout>;
+
+const fakeRoom = createFakeRoom();
+
+const DefaultWrapper = createMock({ appliesToChannels: true, TTLChannels: 60000 });
+
+export const Default: StoryFn<typeof RetentionPolicyCallout> = () => (
+	<DefaultWrapper>
+		<RetentionPolicyCallout room={fakeRoom} />
+	</DefaultWrapper>
+);
+
+const InvalidSettingsWrapper = createMock({
+	appliesToChannels: true,
+	TTLChannels: 60000,
+	advancedPrecisionCron: '* * * 12 * *',
+	advancedPrecision: true,
+});
+
+export const InvalidSettings: StoryFn<typeof RetentionPolicyCallout> = () => (
+	<InvalidSettingsWrapper>
+		<RetentionPolicyCallout room={fakeRoom} />
+	</InvalidSettingsWrapper>
+);
diff --git a/apps/meteor/client/components/InfoPanel/__snapshots__/RetentionPolicyCallout.spec.tsx.snap b/apps/meteor/client/components/InfoPanel/__snapshots__/RetentionPolicyCallout.spec.tsx.snap
new file mode 100644
index 00000000000..8b1d477b28c
--- /dev/null
+++ b/apps/meteor/client/components/InfoPanel/__snapshots__/RetentionPolicyCallout.spec.tsx.snap
@@ -0,0 +1,75 @@
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+
+exports[`renders Default without crashing 1`] = `
+<body>
+  <div>
+    <section
+      aria-live="polite"
+      arial-label="Retention_policy_warning_callout"
+      class="rcx-box rcx-box--full rcx-callout rcx-callout--warning"
+      role="alert"
+    >
+      <i
+        aria-hidden="true"
+        class="rcx-box rcx-box--full rcx-icon--name-warning rcx-icon rcx-callout__icon rcx-css-4pvxx3"
+      >
+        
+      </i>
+      <div
+        class="rcx-box rcx-box--full rcx-callout__wrapper"
+      >
+        <div
+          class="rcx-box rcx-box--full rcx-callout__wrapper-content"
+        >
+          <div
+            class="rcx-box rcx-box--full rcx-callout__content"
+          >
+            <div>
+              <p>
+                a minute June 1, 2024 at 12:30 AM
+              </p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+  </div>
+</body>
+`;
+
+exports[`renders InvalidSettings without crashing 1`] = `
+<body>
+  <div>
+    <section
+      aria-live="polite"
+      arial-label="Retention_policy_warning_callout"
+      class="rcx-box rcx-box--full rcx-callout rcx-callout--warning"
+      role="alert"
+    >
+      <i
+        aria-hidden="true"
+        class="rcx-box rcx-box--full rcx-icon--name-warning rcx-icon rcx-callout__icon rcx-css-4pvxx3"
+      >
+        
+      </i>
+      <div
+        class="rcx-box rcx-box--full rcx-callout__wrapper"
+      >
+        <div
+          class="rcx-box rcx-box--full rcx-callout__wrapper-content"
+        >
+          <div
+            class="rcx-box rcx-box--full rcx-callout__content"
+          >
+            <div>
+              <p>
+                a minute June 12, 2024 at 12:00 AM
+              </p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+  </div>
+</body>
+`;
diff --git a/apps/meteor/client/components/UserInfo/UserInfo.tsx b/apps/meteor/client/components/UserInfo/UserInfo.tsx
index b85010d8995..124fffc2344 100644
--- a/apps/meteor/client/components/UserInfo/UserInfo.tsx
+++ b/apps/meteor/client/components/UserInfo/UserInfo.tsx
@@ -1,14 +1,8 @@
 import type { IUser, Serialized } from '@rocket.chat/core-typings';
 import { Box, Margins, Tag } from '@rocket.chat/fuselage';
-import { useUserDisplayName, ContextualbarScrollableContent } from '@rocket.chat/ui-client';
-import type { TranslationKey } from '@rocket.chat/ui-contexts';
-import type { ReactElement, ReactNode } from 'react';
-import { memo } from 'react';
-import { useTranslation } from 'react-i18next';
-
-import { useTimeAgo } from '../../hooks/useTimeAgo';
-import { useUserCustomFields } from '../../hooks/useUserCustomFields';
 import {
+	useUserDisplayName,
+	ContextualbarScrollableContent,
 	InfoPanel,
 	InfoPanelActionGroup,
 	InfoPanelAvatar,
@@ -17,7 +11,14 @@ import {
 	InfoPanelSection,
 	InfoPanelText,
 	InfoPanelTitle,
-} from '../InfoPanel';
+} from '@rocket.chat/ui-client';
+import type { TranslationKey } from '@rocket.chat/ui-contexts';
+import type { ReactElement, ReactNode } from 'react';
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+
+import { useTimeAgo } from '../../hooks/useTimeAgo';
+import { useUserCustomFields } from '../../hooks/useUserCustomFields';
 import MarkdownText from '../MarkdownText';
 import UTCClock from '../UTCClock';
 import { UserCardRoles } from '../UserCard';
diff --git a/apps/meteor/client/views/admin/deviceManagement/DeviceManagementInfo/DeviceManagementInfo.tsx b/apps/meteor/client/views/admin/deviceManagement/DeviceManagementInfo/DeviceManagementInfo.tsx
index 132f39ee9d6..aa8f9eb146b 100644
--- a/apps/meteor/client/views/admin/deviceManagement/DeviceManagementInfo/DeviceManagementInfo.tsx
+++ b/apps/meteor/client/views/admin/deviceManagement/DeviceManagementInfo/DeviceManagementInfo.tsx
@@ -7,13 +7,16 @@ import {
 	ContextualbarScrollableContent,
 	ContextualbarFooter,
 	ContextualbarTitle,
+	InfoPanel,
+	InfoPanelField,
+	InfoPanelLabel,
+	InfoPanelText,
 } from '@rocket.chat/ui-client';
 import { useRoute, useUserPresence } from '@rocket.chat/ui-contexts';
 import type { ReactElement } from 'react';
 import { useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
 
-import { InfoPanel, InfoPanelField, InfoPanelLabel, InfoPanelText } from '../../../../components/InfoPanel';
 import { useDeviceLogout } from '../../../../hooks/useDeviceLogout';
 import { useFormatDateAndTime } from '../../../../hooks/useFormatDateAndTime';
 
diff --git a/apps/meteor/client/views/omnichannel/additionalForms/MaxChatsPerAgentDisplay.tsx b/apps/meteor/client/views/omnichannel/additionalForms/MaxChatsPerAgentDisplay.tsx
index 17f6f753185..14586678891 100644
--- a/apps/meteor/client/views/omnichannel/additionalForms/MaxChatsPerAgentDisplay.tsx
+++ b/apps/meteor/client/views/omnichannel/additionalForms/MaxChatsPerAgentDisplay.tsx
@@ -1,6 +1,6 @@
+import { InfoPanelLabel, InfoPanelText } from '@rocket.chat/ui-client';
 import { useTranslation } from 'react-i18next';
 
-import { InfoPanelLabel, InfoPanelText } from '../../../components/InfoPanel';
 import { useHasLicenseModule } from '../../../hooks/useHasLicenseModule';
 
 const MaxChatsPerAgentDisplay = ({ maxNumberSimultaneousChat = 0 }) => {
diff --git a/apps/meteor/client/views/omnichannel/agents/AgentInfo.tsx b/apps/meteor/client/views/omnichannel/agents/AgentInfo.tsx
index e409ed17522..0a597947fdc 100644
--- a/apps/meteor/client/views/omnichannel/agents/AgentInfo.tsx
+++ b/apps/meteor/client/views/omnichannel/agents/AgentInfo.tsx
@@ -5,13 +5,14 @@ import {
 	ContextualbarHeader,
 	ContextualbarScrollableContent,
 	ContextualbarSkeletonBody,
+	InfoPanelLabel,
+	InfoPanelText,
 } from '@rocket.chat/ui-client';
 import { useEndpoint, useRouter } from '@rocket.chat/ui-contexts';
 import { useQuery } from '@tanstack/react-query';
 import type { HTMLAttributes } from 'react';
 import { useTranslation } from 'react-i18next';
 
-import { InfoPanelLabel, InfoPanelText } from '../../../components/InfoPanel';
 import { UserInfoAvatar, UserInfoUsername } from '../../../components/UserInfo';
 import { UserStatus } from '../../../components/UserStatus';
 import { MaxChatsPerAgentDisplay } from '../additionalForms';
diff --git a/apps/meteor/client/views/omnichannel/components/CustomField.tsx b/apps/meteor/client/views/omnichannel/components/CustomField.tsx
index 76dfb61ff76..f3c10fde0ed 100644
--- a/apps/meteor/client/views/omnichannel/components/CustomField.tsx
+++ b/apps/meteor/client/views/omnichannel/components/CustomField.tsx
@@ -1,9 +1,9 @@
 import { Box } from '@rocket.chat/fuselage';
+import { InfoPanelField, InfoPanelLabel, InfoPanelText } from '@rocket.chat/ui-client';
 import { useEndpoint } from '@rocket.chat/ui-contexts';
 import { useQuery } from '@tanstack/react-query';
 import { useTranslation } from 'react-i18next';
 
-import { InfoPanelField, InfoPanelLabel, InfoPanelText } from '../../../components/InfoPanel';
 import { FormSkeleton } from '../directory/components/FormSkeleton';
 
 type CustomFieldProps = {
diff --git a/apps/meteor/client/views/omnichannel/directory/calls/contextualBar/InfoField.tsx b/apps/meteor/client/views/omnichannel/directory/calls/contextualBar/InfoField.tsx
index e501a70c124..8ef1167531e 100644
--- a/apps/meteor/client/views/omnichannel/directory/calls/contextualBar/InfoField.tsx
+++ b/apps/meteor/client/views/omnichannel/directory/calls/contextualBar/InfoField.tsx
@@ -1,7 +1,6 @@
+import { InfoPanelField, InfoPanelLabel, InfoPanelText } from '@rocket.chat/ui-client';
 import type { ReactElement } from 'react';
 
-import { InfoPanelField, InfoPanelLabel, InfoPanelText } from '../../../../../components/InfoPanel';
-
 type InfoFieldPropsType = {
 	label: string;
 	info: string;
diff --git a/apps/meteor/client/views/omnichannel/directory/calls/contextualBar/VoipInfo.tsx b/apps/meteor/client/views/omnichannel/directory/calls/contextualBar/VoipInfo.tsx
index 38b6f6888ca..d663f4b791b 100644
--- a/apps/meteor/client/views/omnichannel/directory/calls/contextualBar/VoipInfo.tsx
+++ b/apps/meteor/client/views/omnichannel/directory/calls/contextualBar/VoipInfo.tsx
@@ -9,6 +9,10 @@ import {
 	ContextualbarScrollableContent,
 	ContextualbarFooter,
 	ContextualbarDialog,
+	InfoPanel,
+	InfoPanelField,
+	InfoPanelLabel,
+	InfoPanelText,
 } from '@rocket.chat/ui-client';
 import moment from 'moment';
 import type { ReactElement } from 'react';
@@ -17,7 +21,6 @@ import { useTranslation } from 'react-i18next';
 
 import { InfoField } from './InfoField';
 import { VoipInfoCallButton } from './VoipInfoCallButton';
-import { InfoPanel, InfoPanelField, InfoPanelLabel, InfoPanelText } from '../../../../../components/InfoPanel';
 import { UserStatus } from '../../../../../components/UserStatus';
 import { useIsCallReady } from '../../../../../contexts/CallContext';
 import { parseOutboundPhoneNumber } from '../../../../../lib/voip/parseOutboundPhoneNumber';
diff --git a/apps/meteor/client/views/omnichannel/directory/chats/ChatInfo/ChatInfo.tsx b/apps/meteor/client/views/omnichannel/directory/chats/ChatInfo/ChatInfo.tsx
index 2df005f213b..6d1bd87bfbd 100644
--- a/apps/meteor/client/views/omnichannel/directory/chats/ChatInfo/ChatInfo.tsx
+++ b/apps/meteor/client/views/omnichannel/directory/chats/ChatInfo/ChatInfo.tsx
@@ -1,7 +1,7 @@
 import type { IOmnichannelRoom, IVisitor } from '@rocket.chat/core-typings';
 import { Box, Margins, Tag, Button, ButtonGroup } from '@rocket.chat/fuselage';
 import { useEffectEvent } from '@rocket.chat/fuselage-hooks';
-import { ContextualbarScrollableContent, ContextualbarFooter } from '@rocket.chat/ui-client';
+import { ContextualbarScrollableContent, ContextualbarFooter, InfoPanelField, InfoPanelLabel, InfoPanelText } from '@rocket.chat/ui-client';
 import type { IRouterPaths } from '@rocket.chat/ui-contexts';
 import { useToastMessageDispatch, useRoute, useUserSubscription, useTranslation, usePermission, useUserId } from '@rocket.chat/ui-contexts';
 import moment from 'moment';
@@ -9,7 +9,6 @@ import { useMemo } from 'react';
 
 import DepartmentField from './DepartmentField';
 import VisitorClientInfo from './VisitorClientInfo';
-import { InfoPanelField, InfoPanelLabel, InfoPanelText } from '../../../../../components/InfoPanel';
 import MarkdownText from '../../../../../components/MarkdownText';
 import { useFormatDateAndTime } from '../../../../../hooks/useFormatDateAndTime';
 import { useFormatDuration } from '../../../../../hooks/useFormatDuration';
diff --git a/apps/meteor/client/views/room/contextualBar/Info/RoomInfo/ABAC/RoomInfoABACSection.tsx b/apps/meteor/client/views/room/contextualBar/Info/RoomInfo/ABAC/RoomInfoABACSection.tsx
index 8c11bdde68f..8ecd5a2c2cb 100644
--- a/apps/meteor/client/views/room/contextualBar/Info/RoomInfo/ABAC/RoomInfoABACSection.tsx
+++ b/apps/meteor/client/views/room/contextualBar/Info/RoomInfo/ABAC/RoomInfoABACSection.tsx
@@ -1,9 +1,9 @@
 import type { IRoom } from '@rocket.chat/core-typings';
 import { Box, Divider, Tag } from '@rocket.chat/fuselage';
+import { InfoPanelField, InfoPanelLabel } from '@rocket.chat/ui-client';
 import { useSetting } from '@rocket.chat/ui-contexts';
 import { useTranslation } from 'react-i18next';
 
-import { InfoPanelField, InfoPanelLabel } from '../../../../../../components/InfoPanel';
 import { RoomIcon } from '../../../../../../components/RoomIcon';
 
 // TODO: Remove type union when ABAC is implemented
diff --git a/apps/meteor/client/views/room/contextualBar/Info/RoomInfo/RoomInfo.tsx b/apps/meteor/client/views/room/contextualBar/Info/RoomInfo/RoomInfo.tsx
index d0b0d0a1484..7de94c343d5 100644
--- a/apps/meteor/client/views/room/contextualBar/Info/RoomInfo/RoomInfo.tsx
+++ b/apps/meteor/client/views/room/contextualBar/Info/RoomInfo/RoomInfo.tsx
@@ -10,11 +10,6 @@ import {
 	ContextualbarClose,
 	ContextualbarTitle,
 	ContextualbarDialog,
-} from '@rocket.chat/ui-client';
-import { useTranslation } from 'react-i18next';
-
-import RoomInfoActions from './RoomInfoActions';
-import {
 	InfoPanel,
 	InfoPanelActionGroup,
 	InfoPanelAvatar,
@@ -23,7 +18,10 @@ import {
 	InfoPanelSection,
 	InfoPanelText,
 	InfoPanelTitle,
-} from '../../../../../components/InfoPanel';
+} from '@rocket.chat/ui-client';
+import { useTranslation } from 'react-i18next';
+
+import RoomInfoActions from './RoomInfoActions';
 import RetentionPolicyCallout from '../../../../../components/InfoPanel/RetentionPolicyCallout';
 import MarkdownText from '../../../../../components/MarkdownText';
 import { useRetentionPolicy } from '../../../hooks/useRetentionPolicy';
diff --git a/apps/meteor/client/views/room/contextualBar/Info/RoomInfo/RoomInfoActions.tsx b/apps/meteor/client/views/room/contextualBar/Info/RoomInfo/RoomInfoActions.tsx
index 90a0fd55671..723bee493ea 100644
--- a/apps/meteor/client/views/room/contextualBar/Info/RoomInfo/RoomInfoActions.tsx
+++ b/apps/meteor/client/views/room/contextualBar/Info/RoomInfo/RoomInfoActions.tsx
@@ -1,6 +1,5 @@
 import type { Keys as IconKeys } from '@rocket.chat/icons';
-
-import { InfoPanelAction } from '../../../../../components/InfoPanel';
+import { InfoPanelAction } from '@rocket.chat/ui-client';
 
 type Action = {
 	id: string;
diff --git a/apps/meteor/client/views/teams/contextualBar/info/TeamsInfo.tsx b/apps/meteor/client/views/teams/contextualBar/info/TeamsInfo.tsx
index a1043cb8de3..cc28832c670 100644
--- a/apps/meteor/client/views/teams/contextualBar/info/TeamsInfo.tsx
+++ b/apps/meteor/client/views/teams/contextualBar/info/TeamsInfo.tsx
@@ -9,12 +9,6 @@ import {
 	ContextualbarClose,
 	ContextualbarScrollableContent,
 	ContextualbarDialog,
-} from '@rocket.chat/ui-client';
-import type { ReactElement } from 'react';
-import { useTranslation } from 'react-i18next';
-
-import { useTeamActions } from './useTeamActions';
-import {
 	InfoPanel,
 	InfoPanelAction,
 	InfoPanelActionGroup,
@@ -24,7 +18,11 @@ import {
 	InfoPanelSection,
 	InfoPanelText,
 	InfoPanelTitle,
-} from '../../../../components/InfoPanel';
+} from '@rocket.chat/ui-client';
+import type { ReactElement } from 'react';
+import { useTranslation } from 'react-i18next';
+
+import { useTeamActions } from './useTeamActions';
 import RetentionPolicyCallout from '../../../../components/InfoPanel/RetentionPolicyCallout';
 import MarkdownText from '../../../../components/MarkdownText';
 import { useSplitRoomActions } from '../../../room/contextualBar/Info/hooks/useSplitRoomActions';
diff --git a/apps/meteor/client/components/InfoPanel/InfoPanel.spec.tsx b/packages/ui-client/src/components/InfoPanel/InfoPanel.spec.tsx
similarity index 100%
rename from apps/meteor/client/components/InfoPanel/InfoPanel.spec.tsx
rename to packages/ui-client/src/components/InfoPanel/InfoPanel.spec.tsx
diff --git a/apps/meteor/client/components/InfoPanel/InfoPanel.stories.tsx b/packages/ui-client/src/components/InfoPanel/InfoPanel.stories.tsx
similarity index 86%
rename from apps/meteor/client/components/InfoPanel/InfoPanel.stories.tsx
rename to packages/ui-client/src/components/InfoPanel/InfoPanel.stories.tsx
index bbc53e0a8bc..442a4a20cae 100644
--- a/apps/meteor/client/components/InfoPanel/InfoPanel.stories.tsx
+++ b/packages/ui-client/src/components/InfoPanel/InfoPanel.stories.tsx
@@ -12,8 +12,6 @@ import {
 	InfoPanelText,
 	InfoPanelTitle,
 } from '.';
-import RetentionPolicyCallout from './RetentionPolicyCallout';
-import { createFakeRoom } from '../../../tests/mocks/data';
 
 export default {
 	component: InfoPanel,
@@ -26,12 +24,9 @@ export default {
 		InfoPanelSection: InfoPanelSection as ComponentType<any>,
 		InfoPanelText: InfoPanelText as ComponentType<any>,
 		InfoPanelTitle: InfoPanelTitle as ComponentType<any>,
-		RetentionPolicyCallout: RetentionPolicyCallout as ComponentType<any>,
 	},
 } satisfies Meta<typeof InfoPanel>;
 
-const fakeRoom = createFakeRoom();
-
 export const Default: StoryFn<typeof InfoPanel> = () => (
 	<InfoPanel>
 		<InfoPanelAvatar />
@@ -61,8 +56,5 @@ export const Default: StoryFn<typeof InfoPanel> = () => (
 				</InfoPanelText>
 			</InfoPanelField>
 		</InfoPanelSection>
-		<InfoPanelSection>
-			<RetentionPolicyCallout room={fakeRoom} />
-		</InfoPanelSection>
 	</InfoPanel>
 );
diff --git a/apps/meteor/client/components/InfoPanel/InfoPanel.tsx b/packages/ui-client/src/components/InfoPanel/InfoPanel.tsx
similarity index 100%
rename from apps/meteor/client/components/InfoPanel/InfoPanel.tsx
rename to packages/ui-client/src/components/InfoPanel/InfoPanel.tsx
diff --git a/apps/meteor/client/components/InfoPanel/InfoPanelAction.tsx b/packages/ui-client/src/components/InfoPanel/InfoPanelAction.tsx
similarity index 100%
rename from apps/meteor/client/components/InfoPanel/InfoPanelAction.tsx
rename to packages/ui-client/src/components/InfoPanel/InfoPanelAction.tsx
diff --git a/apps/meteor/client/components/InfoPanel/InfoPanelActionGroup.tsx b/packages/ui-client/src/components/InfoPanel/InfoPanelActionGroup.tsx
similarity index 100%
rename from apps/meteor/client/components/InfoPanel/InfoPanelActionGroup.tsx
rename to packages/ui-client/src/components/InfoPanel/InfoPanelActionGroup.tsx
diff --git a/apps/meteor/client/components/InfoPanel/InfoPanelAvatar.tsx b/packages/ui-client/src/components/InfoPanel/InfoPanelAvatar.tsx
similarity index 100%
rename from apps/meteor/client/components/InfoPanel/InfoPanelAvatar.tsx
rename to packages/ui-client/src/components/InfoPanel/InfoPanelAvatar.tsx
diff --git a/apps/meteor/client/components/InfoPanel/InfoPanelField.tsx b/packages/ui-client/src/components/InfoPanel/InfoPanelField.tsx
similarity index 100%
rename from apps/meteor/client/components/InfoPanel/InfoPanelField.tsx
rename to packages/ui-client/src/components/InfoPanel/InfoPanelField.tsx
diff --git a/apps/meteor/client/components/InfoPanel/InfoPanelLabel.tsx b/packages/ui-client/src/components/InfoPanel/InfoPanelLabel.tsx
similarity index 100%
rename from apps/meteor/client/components/InfoPanel/InfoPanelLabel.tsx
rename to packages/ui-client/src/components/InfoPanel/InfoPanelLabel.tsx
diff --git a/apps/meteor/client/components/InfoPanel/InfoPanelSection.tsx b/packages/ui-client/src/components/InfoPanel/InfoPanelSection.tsx
similarity index 100%
rename from apps/meteor/client/components/InfoPanel/InfoPanelSection.tsx
rename to packages/ui-client/src/components/InfoPanel/InfoPanelSection.tsx
diff --git a/apps/meteor/client/components/InfoPanel/InfoPanelText.tsx b/packages/ui-client/src/components/InfoPanel/InfoPanelText.tsx
similarity index 100%
rename from apps/meteor/client/components/InfoPanel/InfoPanelText.tsx
rename to packages/ui-client/src/components/InfoPanel/InfoPanelText.tsx
diff --git a/apps/meteor/client/components/InfoPanel/InfoPanelTitle.tsx b/packages/ui-client/src/components/InfoPanel/InfoPanelTitle.tsx
similarity index 100%
rename from apps/meteor/client/components/InfoPanel/InfoPanelTitle.tsx
rename to packages/ui-client/src/components/InfoPanel/InfoPanelTitle.tsx
diff --git a/apps/meteor/client/components/InfoPanel/__snapshots__/InfoPanel.spec.tsx.snap b/packages/ui-client/src/components/InfoPanel/__snapshots__/InfoPanel.spec.tsx.snap
similarity index 97%
rename from apps/meteor/client/components/InfoPanel/__snapshots__/InfoPanel.spec.tsx.snap
rename to packages/ui-client/src/components/InfoPanel/__snapshots__/InfoPanel.spec.tsx.snap
index 4ac05766f57..defa96521b2 100644
--- a/apps/meteor/client/components/InfoPanel/__snapshots__/InfoPanel.spec.tsx.snap
+++ b/packages/ui-client/src/components/InfoPanel/__snapshots__/InfoPanel.spec.tsx.snap
@@ -82,9 +82,6 @@ exports[`renders Default without crashing 1`] = `
           </div>
         </div>
       </div>
-      <div
-        class="rcx-box rcx-box--full rcx-css-6jv9ad"
-      />
     </div>
   </div>
 </body>
diff --git a/apps/meteor/client/components/InfoPanel/index.ts b/packages/ui-client/src/components/InfoPanel/index.ts
similarity index 100%
rename from apps/meteor/client/components/InfoPanel/index.ts
rename to packages/ui-client/src/components/InfoPanel/index.ts
diff --git a/packages/ui-client/src/components/index.ts b/packages/ui-client/src/components/index.ts
index f802de9b79d..8f4b428f155 100644
--- a/packages/ui-client/src/components/index.ts
+++ b/packages/ui-client/src/components/index.ts
@@ -20,3 +20,4 @@ export * from './Modal';
 export * from './Wizard';
 export * from './CustomScrollbars';
 export * from './Page';
+export * from './InfoPanel';