chore: more refactor

packages/blade/src/components/ChatBubble/ChatBubble.native.tsx

@@ -0,0 +1,15 @@
+import React from 'react';
+import type { ChatBubbleProps } from './types';
+import { Text } from '~components/Typography';
+import { throwBladeError } from '~utils/logger';
+
+const ChatBubble = (_prop: ChatBubbleProps): React.ReactElement => {
+  throwBladeError({
+    message: 'Morph is not yet implemented for native',
+    moduleName: 'ChatBubble',
+  });
+
+  return <Text>Morph Component is not available for Native mobile apps.</Text>;
+};
+
+export { ChatBubble };

packages/blade/src/components/ChatBubble/ChatBubble.stories.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 import { ChatBubble } from './ChatBubble';
 import { Box } from '~components/Box';
 import { RayIcon } from '~components/Icons';
-import { Card, CardHeaderLeading, CardHeader, CardFooter, CardBody } from '~components/Card';
+import { Card, CardBody } from '~components/Card';
 import { Text } from '~components/Typography';
 import { Radio, RadioGroup } from '~components/Radio';
 

packages/blade/src/components/ChatBubble/ChatBubble.tsx → packages/blade/src/components/ChatBubble/ChatBubble.web.tsx

@@ -1,21 +1,10 @@
 import React from 'react';
 import { SelfMessageBubble } from './SelfMessageBubble';
 import { DefaultMessageBubble } from './DefaultMessageBubble';
+import type { ChatBubbleProps } from './types';
 import { Text } from '~components/Typography';
 import BaseBox from '~components/Box/BaseBox';
 
-export type ChatBubbleProps = {
-  messageType?: 'last' | 'default';
-  senderType?: 'self' | 'other';
-  isLoading?: boolean;
-  validationState?: 'error' | 'none';
-  errorText?: string;
-  onClick?: () => void;
-  footerActions?: React.ReactNode;
-  children?: React.ReactNode | string;
-  leading?: React.ReactNode;
-  loadingText?: string;
-};
 const ChatBubble = ({
   messageType = 'default',
   senderType = 'self',

packages/blade/src/components/ChatBubble/DefaultMessageBubble.tsx → packages/blade/src/components/ChatBubble/DefaultMessageBubble.web.tsx

@@ -1,18 +1,14 @@
 import React from 'react';
 import Rotate from './Rotate';
+import type { DefaultMessageBubbleProps } from './types';
 import BaseBox from '~components/Box/BaseBox';
 
 const DefaultMessageBubble = ({
   children,
   leading,
   isLoading,
   onClick,
-}: {
-  children: React.ReactNode | string;
-  leading?: React.ReactNode;
-  isLoading?: boolean;
-  onClick?: () => void;
-}): React.ReactElement => {
+}: DefaultMessageBubbleProps): React.ReactElement => {
   return (
     <BaseBox maxWidth="296px" onClick={onClick}>
       <BaseBox display="flex" gap="spacing.4" justifyContent="left">

packages/blade/src/components/ChatBubble/index.ts

@@ -1 +1 @@
-export * from "./ChatBubble";
+export * from './ChatBubble';

packages/blade/src/components/ChatBubble/types.ts

@@ -0,0 +1,30 @@
+import type React from 'react';
+type ChatBubbleProps = {
+  messageType?: 'last' | 'default';
+  senderType?: 'self' | 'other';
+  isLoading?: boolean;
+  validationState?: 'error' | 'none';
+  errorText?: string;
+  onClick?: () => void;
+  footerActions?: React.ReactNode;
+  children?: React.ReactNode | string;
+  leading?: React.ReactNode;
+  loadingText?: string;
+};
+
+type DefaultMessageBubbleProps = {
+  children: React.ReactNode | string;
+  leading?: React.ReactNode;
+  isLoading?: boolean;
+  onClick?: () => void;
+};
+
+type SelfMessageBubbleProps = {
+  children: React.ReactNode | string;
+  isError?: boolean;
+  errorText?: string;
+  onClick?: () => void;
+  messageType: 'last' | 'default';
+};
+
+export type { ChatBubbleProps, DefaultMessageBubbleProps, SelfMessageBubbleProps };