npm - @bikdotai/bik-component-library - Versions diffs - 0.0.821-beta.2 → 0.0.821-beta.3 - Mend

@bikdotai/bik-component-library 0.0.821-beta.2 → 0.0.821-beta.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/dist/cjs/components/BikGiftedChat/Bubble/Bubble.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),c=require("react"),l=require("../../../constants/Theme.js"),R=require("../../../hooks/useWindowSize.js"),g=require("../GiftedChat/types.js"),S=require("../GiftedChat/utils.js"),A=require("./types.js"),P=n=>n&&typeof n=="object"&&"default"in n?n:{default:n},q=P(c),B=n=>{const{currentMessage:d,position:s,renderMessageText:C,renderTicks:T,renderTime:v,renderCustomView:y,isCustomViewBottom:h,isUnsatisfactoryMessageFn:m,messagesGroupedByAiTraceId:x,onPress:j,containerStyle:t,bubbleStyles:i,appType:I=A.GiftedChatAppType.Bik}=n,u=R.useWindowSize(),e=d,r=I===A.GiftedChatAppType.Manifest,b=c.useMemo(()=>e.category===S.Constants.ChatActivity.Category.ACTIVITY&&e.activityType===S.Constants.ChatActivity.Type.PRIVATE_NOTE,[e.category,e.activityType]),M=c.useMemo(()=>{const[p,f]=S.isStringifiedArray(e?.message);return p&&f&&Array.isArray(f)},[e?.message]),k=e?.channelId===g.MESSAGE_CHANNELS.SMTP||e?.channelName===g.MESSAGE_CHANNELS.SMTP,E=c.useMemo(()=>{const p={borderRadius:8,minHeight:20,margin:0,flexGrow:u?1:0,width:"100%"},f=e?.channelId===g.MESSAGE_CHANNELS.GMAIL||e?.channelName===g.MESSAGE_CHANNELS.GMAIL;let a={};if(r)return s==="left"?a=i&&typeof i.left=="object"?i.left:{}:a=i&&typeof i.right=="object"?i.right:{},{...a};if(s==="left")a={...u||f||k?{maxWidth:"100%"}:{},...b?{background:l.COLORS.background.warning.light}:{backgroundColor:e?.isPrivateMail?l.COLORS.background.blue.light:l.COLORS.background.warning.light}};else{const N=m&&m({aiTraceId:e.eventProperties?.aiTraceId,messagesGroupedByAiTraceId:x});a={backgroundColor:e.status==="failed"||N?l.COLORS.background.negative.light:l.COLORS.background.brandUltraLight,...b?{background:l.COLORS.background.warning.light}:{},...!u&&M?{maxWidth:500}:{}}}const L=i&&typeof i=="object"?"left"in i||"right"in i?s==="left"?i.left??{}:i.right??{}:i:{};return{...p,...a,...L}},[e?.channelId,e?.channelName,e?.meta?.aiUsed,e?.status,e?.eventProperties?.aiTraceId,s,u,b,M,m,x,e?.isPrivateMail,i,r]),O=c.useCallback(()=>o.jsxs("div",{children:[!h&&y?.(n),C?.(n),h&&y?.(n)]}),[h,y,C,n]),w=c.useMemo(()=>!r||typeof t!="object"?{}:s==="left"&&"left"in t&&t.left&&typeof t.left=="object"?t.left:s==="right"&&"right"in t&&t.right&&typeof t.right=="object"?t.right:{},[r,t,s]),G=!r&&t&&typeof t=="object"?"left"in t||"right"in t?s==="left"?t.left??{}:t.right??{}:t:{};return o.jsx("div",{style:{display:"flex",marginTop:r?0:6,marginBottom:r?0:d?.messageInformation?.reactions?.length>0?24:6,flexGrow:u?1:0,...r?{alignItems:"flex-end",...s==="right"?{cursor:"pointer"}:{}}:{},...w,...G},...r?{onClick:j}:{},children:o.jsx("div",{style:E,children:o.jsxs("div",{style:s==="right"?{display:"flex",flexWrap:"wrap",alignItems:"flex-end",justifyContent:"flex-end",columnGap:6}:void 0,children:[o.jsx("div",{id:d.chatActivityId||`message-${d.psqlId}`,children:O()}),o.jsxs("div",{style:{display:"flex",flexDirection:"row",justifyContent:"flex-end",flexShrink:0},children:[v?.(n),T?.(d)]})]})})})},_=q.default.memo(B);exports.Bubble=_;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),c=require("react"),l=require("../../../constants/Theme.js"),R=require("../../../hooks/useWindowSize.js"),g=require("../GiftedChat/types.js"),S=require("../GiftedChat/utils.js"),A=require("./types.js"),P=n=>n&&typeof n=="object"&&"default"in n?n:{default:n},q=P(c),B=n=>{const{currentMessage:d,position:r,renderMessageText:C,renderTicks:T,renderTime:v,renderCustomView:y,isCustomViewBottom:h,isUnsatisfactoryMessageFn:m,messagesGroupedByAiTraceId:x,onPress:j,containerStyle:t,bubbleStyles:i,appType:I=A.GiftedChatAppType.Bik}=n,u=R.useWindowSize(),e=d,s=I===A.GiftedChatAppType.Manifest,b=c.useMemo(()=>e.category===S.Constants.ChatActivity.Category.ACTIVITY&&e.activityType===S.Constants.ChatActivity.Type.PRIVATE_NOTE,[e.category,e.activityType]),M=c.useMemo(()=>{const[p,f]=S.isStringifiedArray(e?.message);return p&&f&&Array.isArray(f)},[e?.message]),k=e?.channelId===g.MESSAGE_CHANNELS.SMTP||e?.channelName===g.MESSAGE_CHANNELS.SMTP,E=c.useMemo(()=>{const p={borderRadius:8,minHeight:20,margin:0,flexGrow:u?1:0,width:"100%"},f=e?.channelId===g.MESSAGE_CHANNELS.GMAIL||e?.channelName===g.MESSAGE_CHANNELS.GMAIL;let a={};if(s)return r==="left"?a=i&&typeof i.left=="object"?i.left:{}:a=i&&typeof i.right=="object"?i.right:{},{...a};if(r==="left")a={...u||f||k?{maxWidth:"100%"}:{},...b?{background:l.COLORS.background.warning.light}:{backgroundColor:e?.isPrivateMail?l.COLORS.background.blue.light:l.COLORS.background.warning.light}};else{const N=m&&m({aiTraceId:e.eventProperties?.aiTraceId,messagesGroupedByAiTraceId:x});a={backgroundColor:e.status==="failed"||N?l.COLORS.background.negative.light:l.COLORS.background.brandUltraLight,...b?{background:l.COLORS.background.warning.light}:{},...!u&&M?{maxWidth:500}:{}}}const G=i&&typeof i=="object"?"left"in i||"right"in i?r==="left"?i.left??{}:i.right??{}:i:{};return{...p,...a,...G}},[e?.channelId,e?.channelName,e?.meta?.aiUsed,e?.status,e?.eventProperties?.aiTraceId,r,u,b,M,m,x,e?.isPrivateMail,i,s]),L=c.useCallback(()=>o.jsxs("div",{children:[!h&&y?.(n),C?.(n),h&&y?.(n)]}),[h,y,C,n]),O=c.useMemo(()=>!s||typeof t!="object"?{}:r==="left"&&"left"in t&&t.left&&typeof t.left=="object"?t.left:r==="right"&&"right"in t&&t.right&&typeof t.right=="object"?t.right:{},[s,t,r]),w=!s&&t&&typeof t=="object"?"left"in t||"right"in t?r==="left"?t.left??{}:t.right??{}:t:{};return o.jsx("div",{style:{display:"flex",marginTop:s?0:6,marginBottom:s?0:d?.messageInformation?.reactions?.length>0?24:6,flexGrow:u?1:0,...s?{alignItems:"flex-end",...r==="right"?{cursor:"pointer"}:{}}:{},...O,...w},...s?{onClick:j}:{},children:o.jsx("div",{style:E,children:o.jsxs("div",{style:{display:"flex",flexWrap:"wrap",alignItems:"flex-end",columnGap:6},children:[o.jsx("div",{id:d.chatActivityId||`message-${d.psqlId}`,children:L()}),o.jsxs("div",{style:{display:"flex",flexDirection:"row",justifyContent:"flex-end",flexShrink:0,marginLeft:"auto"},children:[v?.(n),T?.(d)]})]})})})},_=q.default.memo(B);exports.Bubble=_;
 //# sourceMappingURL=Bubble.js.map

package/dist/cjs/components/BikGiftedChat/Bubble/Bubble.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Bubble.js","sources":["../../../../../src/components/BikGiftedChat/Bubble/Bubble.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react';\nimport { COLORS } from '../../../constants/Theme';\nimport { useWindowSize } from '../../../hooks/useWindowSize';\nimport { MESSAGE_CHANNELS } from '../GiftedChat/types';\nimport { Constants, isStringifiedArray } from '../GiftedChat/utils';\nimport { IMessage } from '../types';\nimport { BubbleProps, GiftedChatAppType } from './types';\n\nconst BubbleComponent = <TMessage extends IMessage = IMessage>(\n\tprops: BubbleProps<TMessage>,\n): React.ReactElement => {\n\tconst {\n\t\tcurrentMessage,\n\t\tposition,\n\t\trenderMessageText,\n\t\trenderTicks,\n\t\trenderTime,\n\t\trenderCustomView,\n\t\tisCustomViewBottom,\n\t\tisUnsatisfactoryMessageFn,\n\t\tmessagesGroupedByAiTraceId,\n\t\tonPress,\n\t\tcontainerStyle,\n\t\tbubbleStyles,\n\t\tappType = GiftedChatAppType.Bik,\n\t} = props;\n\n\tconst isMobile = useWindowSize();\n\tconst message = currentMessage as any;\n\tconst isManifestApp = appType === GiftedChatAppType.Manifest;\n\n\t// Check if message is a private note\n\tconst isPrivateNote = useMemo(\n\t\t() =>\n\t\t\tmessage.category === Constants.ChatActivity.Category.ACTIVITY &&\n\t\t\tmessage.activityType === Constants.ChatActivity.Type.PRIVATE_NOTE,\n\t\t[message.category, message.activityType],\n\t);\n\n\t// Check if message is a carousel (array of items)\n\tconst isCarouselMessage = useMemo(() => {\n\t\tconst [parsedSuccessfully, parsedMessage] = isStringifiedArray(\n\t\t\tmessage?.message,\n\t\t);\n\t\treturn parsedSuccessfully && parsedMessage && Array.isArray(parsedMessage);\n\t}, [message?.message]);\n\tconst isSmtp =\n\t\tmessage?.channelId === MESSAGE_CHANNELS.SMTP \|\|\n\t\tmessage?.channelName === MESSAGE_CHANNELS.SMTP;\n\n\t// Generates wrapper styles for the message bubble\n\t// Handles position-based styling, channel-specific layouts, and message states\n\tconst wrapperStyles = useMemo((): React.CSSProperties => {\n\t\tconst baseStyles: React.CSSProperties = {\n\t\t\tborderRadius: 8,\n\t\t\tminHeight: 20,\n\t\t\tmargin: 0,\n\t\t\tflexGrow: isMobile ? 1 : 0,\n\t\t\twidth: '100%',\n\t\t};\n\n\t\t// Check if message is from email channels\n\t\tconst isGmail =\n\t\t\tmessage?.channelId === MESSAGE_CHANNELS.GMAIL \|\|\n\t\t\tmessage?.channelName === MESSAGE_CHANNELS.GMAIL;\n\n\t\tlet dynamicStyles: React.CSSProperties = {};\n\n\t\tif (isManifestApp) {\n\t\t\tif (position === 'left') {\n\t\t\t\tdynamicStyles =\n\t\t\t\t\tbubbleStyles && typeof bubbleStyles.left === 'object'\n\t\t\t\t\t\t? bubbleStyles.left\n\t\t\t\t\t\t: {};\n\t\t\t} else {\n\t\t\t\tdynamicStyles =\n\t\t\t\t\tbubbleStyles && typeof bubbleStyles.right === 'object'\n\t\t\t\t\t\t? bubbleStyles.right\n\t\t\t\t\t\t: {};\n\t\t\t}\n\t\t\treturn { ...dynamicStyles };\n\t\t} else {\n\t\t\tif (position === 'left') {\n\t\t\t\tdynamicStyles = {\n\t\t\t\t\t...(isMobile \|\| isGmail \|\| isSmtp ? { maxWidth: '100%' } : {}),\n\t\t\t\t\t...(isPrivateNote\n\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\tbackground: COLORS.background.warning.light,\n\t\t\t\t\t\t }\n\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\tbackgroundColor: message?.isPrivateMail\n\t\t\t\t\t\t\t\t\t? COLORS.background.blue.light\n\t\t\t\t\t\t\t\t\t: COLORS.background.warning.light,\n\t\t\t\t\t\t }),\n\t\t\t\t};\n\t\t\t} else {\n\t\t\t\tconst isUnsatisfactory =\n\t\t\t\t\tisUnsatisfactoryMessageFn &&\n\t\t\t\t\tisUnsatisfactoryMessageFn({\n\t\t\t\t\t\taiTraceId: message.eventProperties?.aiTraceId,\n\t\t\t\t\t\tmessagesGroupedByAiTraceId,\n\t\t\t\t\t});\n\n\t\t\t\tdynamicStyles = {\n\t\t\t\t\tbackgroundColor:\n\t\t\t\t\t\tmessage.status === 'failed' \|\| isUnsatisfactory\n\t\t\t\t\t\t\t? COLORS.background.negative.light\n\t\t\t\t\t\t\t: COLORS.background.brandUltraLight,\n\t\t\t\t\t...(isPrivateNote\n\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\tbackground: COLORS.background.warning.light,\n\t\t\t\t\t\t }\n\t\t\t\t\t\t: {}),\n\t\t\t\t\t...(!isMobile && isCarouselMessage ? { maxWidth: 500 } : {}),\n\t\t\t\t};\n\t\t\t}\n\t\t}\n\t\tconst extraBubbleStyles: React.CSSProperties =\n\t\t\tbubbleStyles && typeof bubbleStyles === 'object'\n\t\t\t\t? 'left' in bubbleStyles \|\| 'right' in bubbleStyles\n\t\t\t\t\t? position === 'left'\n\t\t\t\t\t\t? (bubbleStyles as { left?: React.CSSProperties }).left ?? {}\n\t\t\t\t\t\t: (bubbleStyles as { right?: React.CSSProperties }).right ?? {}\n\t\t\t\t\t: (bubbleStyles as React.CSSProperties)\n\t\t\t\t: {};\n\n\t\treturn { ...baseStyles, ...dynamicStyles, ...extraBubbleStyles };\n\t}, [\n\t\tmessage?.channelId,\n\t\tmessage?.channelName,\n\t\tmessage?.meta?.aiUsed,\n\t\tmessage?.status,\n\t\tmessage?.eventProperties?.aiTraceId,\n\t\tposition,\n\t\tisMobile,\n\t\tisPrivateNote,\n\t\tisCarouselMessage,\n\t\tisUnsatisfactoryMessageFn,\n\t\tmessagesGroupedByAiTraceId,\n\t\tmessage?.isPrivateMail,\n\t\tbubbleStyles,\n\t\tisManifestApp,\n\t]);\n\n\t// Renders the content of the message bubble\n\t// Handles custom views and message text in the correct order\n\tconst renderContent = useCallback(() => {\n\t\treturn (\n\t\t\t<div>\n\t\t\t\t{!isCustomViewBottom && renderCustomView?.(props)}\n\n\t\t\t\t{renderMessageText?.(props)}\n\n\t\t\t\t{isCustomViewBottom && renderCustomView?.(props)}\n\t\t\t</div>\n\t\t);\n\t}, [isCustomViewBottom, renderCustomView, renderMessageText, props]);\n\n\tconst manifestContainerStyle = useMemo(() => {\n\t\tif (!isManifestApp \|\| typeof containerStyle !== 'object') return {};\n\t\tif (\n\t\t\tposition === 'left' &&\n\t\t\t'left' in containerStyle &&\n\t\t\tcontainerStyle.left &&\n\t\t\ttypeof containerStyle.left === 'object'\n\t\t) {\n\t\t\treturn containerStyle.left;\n\t\t}\n\t\tif (\n\t\t\tposition === 'right' &&\n\t\t\t'right' in containerStyle &&\n\t\t\tcontainerStyle.right &&\n\t\t\ttypeof containerStyle.right === 'object'\n\t\t) {\n\t\t\treturn containerStyle.right;\n\t\t}\n\t\treturn {};\n\t}, [isManifestApp, containerStyle, position]);\n\n\tconst extraContainerStyle: React.CSSProperties =\n\t\t!isManifestApp && containerStyle && typeof containerStyle === 'object'\n\t\t\t? 'left' in containerStyle \|\| 'right' in containerStyle\n\t\t\t\t? position === 'left'\n\t\t\t\t\t? (containerStyle as { left?: React.CSSProperties }).left ?? {}\n\t\t\t\t\t: (containerStyle as { right?: React.CSSProperties }).right ?? {}\n\t\t\t\t: (containerStyle as React.CSSProperties)\n\t\t\t: {};\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\tdisplay: 'flex',\n\t\t\t\tmarginTop: isManifestApp ? 0 : 6,\n\t\t\t\tmarginBottom: isManifestApp\n\t\t\t\t\t? 0\n\t\t\t\t\t: currentMessage?.['messageInformation']?.reactions?.length > 0\n\t\t\t\t\t? 24\n\t\t\t\t\t: 6,\n\t\t\t\tflexGrow: isMobile ? 1 : 0,\n\t\t\t\t...(isManifestApp\n\t\t\t\t\t? {\n\t\t\t\t\t\t\talignItems: 'flex-end',\n\t\t\t\t\t\t\t...(position === 'right' ? { cursor: 'pointer' } : {}),\n\t\t\t\t\t }\n\t\t\t\t\t: {}),\n\t\t\t\t...manifestContainerStyle,\n\t\t\t\t...extraContainerStyle,\n\t\t\t}}\n\t\t\t{...(isManifestApp ? { onClick: onPress } : {})}\n\t\t>\n\t\t\t<div style={wrapperStyles}>\n\t\t\t\t<div\n\t\t\t\t\t// For sent (right) messages, lay the content and the time/ticks\n\t\t\t\t\t// in a wrapping row so a short message keeps the time beside it\n\t\t\t\t\t// (with a gap) like WhatsApp, while wide/long content pushes the\n\t\t\t\t\t// time onto its own line below.\n\t\t\t\t\tstyle={\n\t\t\t\t\t\tposition === 'right'\n\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\tflexWrap: 'wrap',\n\t\t\t\t\t\t\t\t\talignItems: 'flex-end',\n\t\t\t\t\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t\t\t\t\t\tcolumnGap: 6,\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t{/* Message content /}\n\t\t\t\t\t<div\n\t\t\t\t\t\tid={\n\t\t\t\t\t\t\tcurrentMessage['chatActivityId'] \|\|\n\t\t\t\t\t\t\t`message-${currentMessage['psqlId']}`\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderContent()}\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{/ Message metadata (time and status) */}\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t\t\t\tflexShrink: 0,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderTime?.(props)}\n\t\t\t\t\t\t{renderTicks?.(currentMessage)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\n// Export memoized version for performance\nexport const Bubble = React.memo(BubbleComponent) as typeof BubbleComponent;\n\nexport default Bubble;\n"],"names":["BubbleComponent","props","currentMessage","position","renderMessageText","renderTicks","renderTime","renderCustomView","isCustomViewBottom","isUnsatisfactoryMessageFn","messagesGroupedByAiTraceId","onPress","containerStyle","bubbleStyles","appType","GiftedChatAppType","isMobile","useWindowSize","message","isManifestApp","isPrivateNote","useMemo","Constants","isCarouselMessage","parsedSuccessfully","parsedMessage","isStringifiedArray","isSmtp","MESSAGE_CHANNELS","wrapperStyles","baseStyles","isGmail","dynamicStyles","COLORS","isUnsatisfactory","extraBubbleStyles","renderContent","useCallback","manifestContainerStyle","extraContainerStyle","jsx","jsxs","Bubble","React"],"mappings":"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"}
1	+ {"version":3,"file":"Bubble.js","sources":["../../../../../src/components/BikGiftedChat/Bubble/Bubble.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react';\nimport { COLORS } from '../../../constants/Theme';\nimport { useWindowSize } from '../../../hooks/useWindowSize';\nimport { MESSAGE_CHANNELS } from '../GiftedChat/types';\nimport { Constants, isStringifiedArray } from '../GiftedChat/utils';\nimport { IMessage } from '../types';\nimport { BubbleProps, GiftedChatAppType } from './types';\n\nconst BubbleComponent = <TMessage extends IMessage = IMessage>(\n\tprops: BubbleProps<TMessage>,\n): React.ReactElement => {\n\tconst {\n\t\tcurrentMessage,\n\t\tposition,\n\t\trenderMessageText,\n\t\trenderTicks,\n\t\trenderTime,\n\t\trenderCustomView,\n\t\tisCustomViewBottom,\n\t\tisUnsatisfactoryMessageFn,\n\t\tmessagesGroupedByAiTraceId,\n\t\tonPress,\n\t\tcontainerStyle,\n\t\tbubbleStyles,\n\t\tappType = GiftedChatAppType.Bik,\n\t} = props;\n\n\tconst isMobile = useWindowSize();\n\tconst message = currentMessage as any;\n\tconst isManifestApp = appType === GiftedChatAppType.Manifest;\n\n\t// Check if message is a private note\n\tconst isPrivateNote = useMemo(\n\t\t() =>\n\t\t\tmessage.category === Constants.ChatActivity.Category.ACTIVITY &&\n\t\t\tmessage.activityType === Constants.ChatActivity.Type.PRIVATE_NOTE,\n\t\t[message.category, message.activityType],\n\t);\n\n\t// Check if message is a carousel (array of items)\n\tconst isCarouselMessage = useMemo(() => {\n\t\tconst [parsedSuccessfully, parsedMessage] = isStringifiedArray(\n\t\t\tmessage?.message,\n\t\t);\n\t\treturn parsedSuccessfully && parsedMessage && Array.isArray(parsedMessage);\n\t}, [message?.message]);\n\tconst isSmtp =\n\t\tmessage?.channelId === MESSAGE_CHANNELS.SMTP \|\|\n\t\tmessage?.channelName === MESSAGE_CHANNELS.SMTP;\n\n\t// Generates wrapper styles for the message bubble\n\t// Handles position-based styling, channel-specific layouts, and message states\n\tconst wrapperStyles = useMemo((): React.CSSProperties => {\n\t\tconst baseStyles: React.CSSProperties = {\n\t\t\tborderRadius: 8,\n\t\t\tminHeight: 20,\n\t\t\tmargin: 0,\n\t\t\tflexGrow: isMobile ? 1 : 0,\n\t\t\twidth: '100%',\n\t\t};\n\n\t\t// Check if message is from email channels\n\t\tconst isGmail =\n\t\t\tmessage?.channelId === MESSAGE_CHANNELS.GMAIL \|\|\n\t\t\tmessage?.channelName === MESSAGE_CHANNELS.GMAIL;\n\n\t\tlet dynamicStyles: React.CSSProperties = {};\n\n\t\tif (isManifestApp) {\n\t\t\tif (position === 'left') {\n\t\t\t\tdynamicStyles =\n\t\t\t\t\tbubbleStyles && typeof bubbleStyles.left === 'object'\n\t\t\t\t\t\t? bubbleStyles.left\n\t\t\t\t\t\t: {};\n\t\t\t} else {\n\t\t\t\tdynamicStyles =\n\t\t\t\t\tbubbleStyles && typeof bubbleStyles.right === 'object'\n\t\t\t\t\t\t? bubbleStyles.right\n\t\t\t\t\t\t: {};\n\t\t\t}\n\t\t\treturn { ...dynamicStyles };\n\t\t} else {\n\t\t\tif (position === 'left') {\n\t\t\t\tdynamicStyles = {\n\t\t\t\t\t...(isMobile \|\| isGmail \|\| isSmtp ? { maxWidth: '100%' } : {}),\n\t\t\t\t\t...(isPrivateNote\n\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\tbackground: COLORS.background.warning.light,\n\t\t\t\t\t\t }\n\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\tbackgroundColor: message?.isPrivateMail\n\t\t\t\t\t\t\t\t\t? COLORS.background.blue.light\n\t\t\t\t\t\t\t\t\t: COLORS.background.warning.light,\n\t\t\t\t\t\t }),\n\t\t\t\t};\n\t\t\t} else {\n\t\t\t\tconst isUnsatisfactory =\n\t\t\t\t\tisUnsatisfactoryMessageFn &&\n\t\t\t\t\tisUnsatisfactoryMessageFn({\n\t\t\t\t\t\taiTraceId: message.eventProperties?.aiTraceId,\n\t\t\t\t\t\tmessagesGroupedByAiTraceId,\n\t\t\t\t\t});\n\n\t\t\t\tdynamicStyles = {\n\t\t\t\t\tbackgroundColor:\n\t\t\t\t\t\tmessage.status === 'failed' \|\| isUnsatisfactory\n\t\t\t\t\t\t\t? COLORS.background.negative.light\n\t\t\t\t\t\t\t: COLORS.background.brandUltraLight,\n\t\t\t\t\t...(isPrivateNote\n\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\tbackground: COLORS.background.warning.light,\n\t\t\t\t\t\t }\n\t\t\t\t\t\t: {}),\n\t\t\t\t\t...(!isMobile && isCarouselMessage ? { maxWidth: 500 } : {}),\n\t\t\t\t};\n\t\t\t}\n\t\t}\n\t\tconst extraBubbleStyles: React.CSSProperties =\n\t\t\tbubbleStyles && typeof bubbleStyles === 'object'\n\t\t\t\t? 'left' in bubbleStyles \|\| 'right' in bubbleStyles\n\t\t\t\t\t? position === 'left'\n\t\t\t\t\t\t? (bubbleStyles as { left?: React.CSSProperties }).left ?? {}\n\t\t\t\t\t\t: (bubbleStyles as { right?: React.CSSProperties }).right ?? {}\n\t\t\t\t\t: (bubbleStyles as React.CSSProperties)\n\t\t\t\t: {};\n\n\t\treturn { ...baseStyles, ...dynamicStyles, ...extraBubbleStyles };\n\t}, [\n\t\tmessage?.channelId,\n\t\tmessage?.channelName,\n\t\tmessage?.meta?.aiUsed,\n\t\tmessage?.status,\n\t\tmessage?.eventProperties?.aiTraceId,\n\t\tposition,\n\t\tisMobile,\n\t\tisPrivateNote,\n\t\tisCarouselMessage,\n\t\tisUnsatisfactoryMessageFn,\n\t\tmessagesGroupedByAiTraceId,\n\t\tmessage?.isPrivateMail,\n\t\tbubbleStyles,\n\t\tisManifestApp,\n\t]);\n\n\t// Renders the content of the message bubble\n\t// Handles custom views and message text in the correct order\n\tconst renderContent = useCallback(() => {\n\t\treturn (\n\t\t\t<div>\n\t\t\t\t{!isCustomViewBottom && renderCustomView?.(props)}\n\n\t\t\t\t{renderMessageText?.(props)}\n\n\t\t\t\t{isCustomViewBottom && renderCustomView?.(props)}\n\t\t\t</div>\n\t\t);\n\t}, [isCustomViewBottom, renderCustomView, renderMessageText, props]);\n\n\tconst manifestContainerStyle = useMemo(() => {\n\t\tif (!isManifestApp \|\| typeof containerStyle !== 'object') return {};\n\t\tif (\n\t\t\tposition === 'left' &&\n\t\t\t'left' in containerStyle &&\n\t\t\tcontainerStyle.left &&\n\t\t\ttypeof containerStyle.left === 'object'\n\t\t) {\n\t\t\treturn containerStyle.left;\n\t\t}\n\t\tif (\n\t\t\tposition === 'right' &&\n\t\t\t'right' in containerStyle &&\n\t\t\tcontainerStyle.right &&\n\t\t\ttypeof containerStyle.right === 'object'\n\t\t) {\n\t\t\treturn containerStyle.right;\n\t\t}\n\t\treturn {};\n\t}, [isManifestApp, containerStyle, position]);\n\n\tconst extraContainerStyle: React.CSSProperties =\n\t\t!isManifestApp && containerStyle && typeof containerStyle === 'object'\n\t\t\t? 'left' in containerStyle \|\| 'right' in containerStyle\n\t\t\t\t? position === 'left'\n\t\t\t\t\t? (containerStyle as { left?: React.CSSProperties }).left ?? {}\n\t\t\t\t\t: (containerStyle as { right?: React.CSSProperties }).right ?? {}\n\t\t\t\t: (containerStyle as React.CSSProperties)\n\t\t\t: {};\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\tdisplay: 'flex',\n\t\t\t\tmarginTop: isManifestApp ? 0 : 6,\n\t\t\t\tmarginBottom: isManifestApp\n\t\t\t\t\t? 0\n\t\t\t\t\t: currentMessage?.['messageInformation']?.reactions?.length > 0\n\t\t\t\t\t? 24\n\t\t\t\t\t: 6,\n\t\t\t\tflexGrow: isMobile ? 1 : 0,\n\t\t\t\t...(isManifestApp\n\t\t\t\t\t? {\n\t\t\t\t\t\t\talignItems: 'flex-end',\n\t\t\t\t\t\t\t...(position === 'right' ? { cursor: 'pointer' } : {}),\n\t\t\t\t\t }\n\t\t\t\t\t: {}),\n\t\t\t\t...manifestContainerStyle,\n\t\t\t\t...extraContainerStyle,\n\t\t\t}}\n\t\t\t{...(isManifestApp ? { onClick: onPress } : {})}\n\t\t>\n\t\t\t<div style={wrapperStyles}>\n\t\t\t\t<div\n\t\t\t\t\t// Lay the content and the time/ticks in a wrapping row so a short\n\t\t\t\t\t// message keeps the time beside it (with a gap) like WhatsApp, while\n\t\t\t\t\t// wide/long content pushes the time onto its own line below. The\n\t\t\t\t\t// time's `margin-left: auto` keeps it right-aligned on either side.\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexWrap: 'wrap',\n\t\t\t\t\t\talignItems: 'flex-end',\n\t\t\t\t\t\tcolumnGap: 6,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{/* Message content /}\n\t\t\t\t\t<div\n\t\t\t\t\t\tid={\n\t\t\t\t\t\t\tcurrentMessage['chatActivityId'] \|\|\n\t\t\t\t\t\t\t`message-${currentMessage['psqlId']}`\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderContent()}\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{/ Message metadata (time and status) */}\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t\t\t\tflexShrink: 0,\n\t\t\t\t\t\t\tmarginLeft: 'auto',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderTime?.(props)}\n\t\t\t\t\t\t{renderTicks?.(currentMessage)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\n// Export memoized version for performance\nexport const Bubble = React.memo(BubbleComponent) as typeof BubbleComponent;\n\nexport default Bubble;\n"],"names":["BubbleComponent","props","currentMessage","position","renderMessageText","renderTicks","renderTime","renderCustomView","isCustomViewBottom","isUnsatisfactoryMessageFn","messagesGroupedByAiTraceId","onPress","containerStyle","bubbleStyles","appType","GiftedChatAppType","isMobile","useWindowSize","message","isManifestApp","isPrivateNote","useMemo","Constants","isCarouselMessage","parsedSuccessfully","parsedMessage","isStringifiedArray","isSmtp","MESSAGE_CHANNELS","wrapperStyles","baseStyles","isGmail","dynamicStyles","COLORS","isUnsatisfactory","extraBubbleStyles","renderContent","useCallback","manifestContainerStyle","extraContainerStyle","jsx","jsxs","Bubble","React"],"mappings":"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"}

package/dist/esm/components/BikGiftedChat/Bubble/Bubble.js CHANGED Viewed

@@ -49,20 +49,20 @@ const _ = (a) => {
         }
       };
     else {
-      const L = u && u({
+      const E = u && u({
         aiTraceId: e.eventProperties?.aiTraceId,
         messagesGroupedByAiTraceId: S
       });
       s = {
-        backgroundColor: e.status === "failed" || L ? o.background.negative.light : o.background.brandUltraLight,
+        backgroundColor: e.status === "failed" || E ? o.background.negative.light : o.background.brandUltraLight,
         ...h ? {
           background: o.background.warning.light
         } : {},
         ...!c && T ? { maxWidth: 500 } : {}
       };
     }
-    const E = i && typeof i == "object" ? "left" in i || "right" in i ? r === "left" ? i.left ?? {} : i.right ?? {} : i : {};
-    return { ...p, ...s, ...E };
+    const L = i && typeof i == "object" ? "left" in i || "right" in i ? r === "left" ? i.left ?? {} : i.right ?? {} : i : {};
+    return { ...p, ...s, ...L };
   }, [
     e?.channelId,
     e?.channelName,
@@ -102,13 +102,12 @@ const _ = (a) => {
       children: /* @__PURE__ */ C("div", { style: G, children: /* @__PURE__ */ b(
         "div",
         {
-          style: r === "right" ? {
+          style: {
             display: "flex",
             flexWrap: "wrap",
             alignItems: "flex-end",
-            justifyContent: "flex-end",
             columnGap: 6
-          } : void 0,
+          },
           children: [
             /* @__PURE__ */ C(
               "div",
@@ -124,7 +123,8 @@ const _ = (a) => {
                   display: "flex",
                   flexDirection: "row",
                   justifyContent: "flex-end",
-                  flexShrink: 0
+                  flexShrink: 0,
+                  marginLeft: "auto"
                 },
                 children: [
                   k?.(a),

package/dist/esm/components/BikGiftedChat/Bubble/Bubble.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Bubble.js","sources":["../../../../../src/components/BikGiftedChat/Bubble/Bubble.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react';\nimport { COLORS } from '../../../constants/Theme';\nimport { useWindowSize } from '../../../hooks/useWindowSize';\nimport { MESSAGE_CHANNELS } from '../GiftedChat/types';\nimport { Constants, isStringifiedArray } from '../GiftedChat/utils';\nimport { IMessage } from '../types';\nimport { BubbleProps, GiftedChatAppType } from './types';\n\nconst BubbleComponent = <TMessage extends IMessage = IMessage>(\n\tprops: BubbleProps<TMessage>,\n): React.ReactElement => {\n\tconst {\n\t\tcurrentMessage,\n\t\tposition,\n\t\trenderMessageText,\n\t\trenderTicks,\n\t\trenderTime,\n\t\trenderCustomView,\n\t\tisCustomViewBottom,\n\t\tisUnsatisfactoryMessageFn,\n\t\tmessagesGroupedByAiTraceId,\n\t\tonPress,\n\t\tcontainerStyle,\n\t\tbubbleStyles,\n\t\tappType = GiftedChatAppType.Bik,\n\t} = props;\n\n\tconst isMobile = useWindowSize();\n\tconst message = currentMessage as any;\n\tconst isManifestApp = appType === GiftedChatAppType.Manifest;\n\n\t// Check if message is a private note\n\tconst isPrivateNote = useMemo(\n\t\t() =>\n\t\t\tmessage.category === Constants.ChatActivity.Category.ACTIVITY &&\n\t\t\tmessage.activityType === Constants.ChatActivity.Type.PRIVATE_NOTE,\n\t\t[message.category, message.activityType],\n\t);\n\n\t// Check if message is a carousel (array of items)\n\tconst isCarouselMessage = useMemo(() => {\n\t\tconst [parsedSuccessfully, parsedMessage] = isStringifiedArray(\n\t\t\tmessage?.message,\n\t\t);\n\t\treturn parsedSuccessfully && parsedMessage && Array.isArray(parsedMessage);\n\t}, [message?.message]);\n\tconst isSmtp =\n\t\tmessage?.channelId === MESSAGE_CHANNELS.SMTP \|\|\n\t\tmessage?.channelName === MESSAGE_CHANNELS.SMTP;\n\n\t// Generates wrapper styles for the message bubble\n\t// Handles position-based styling, channel-specific layouts, and message states\n\tconst wrapperStyles = useMemo((): React.CSSProperties => {\n\t\tconst baseStyles: React.CSSProperties = {\n\t\t\tborderRadius: 8,\n\t\t\tminHeight: 20,\n\t\t\tmargin: 0,\n\t\t\tflexGrow: isMobile ? 1 : 0,\n\t\t\twidth: '100%',\n\t\t};\n\n\t\t// Check if message is from email channels\n\t\tconst isGmail =\n\t\t\tmessage?.channelId === MESSAGE_CHANNELS.GMAIL \|\|\n\t\t\tmessage?.channelName === MESSAGE_CHANNELS.GMAIL;\n\n\t\tlet dynamicStyles: React.CSSProperties = {};\n\n\t\tif (isManifestApp) {\n\t\t\tif (position === 'left') {\n\t\t\t\tdynamicStyles =\n\t\t\t\t\tbubbleStyles && typeof bubbleStyles.left === 'object'\n\t\t\t\t\t\t? bubbleStyles.left\n\t\t\t\t\t\t: {};\n\t\t\t} else {\n\t\t\t\tdynamicStyles =\n\t\t\t\t\tbubbleStyles && typeof bubbleStyles.right === 'object'\n\t\t\t\t\t\t? bubbleStyles.right\n\t\t\t\t\t\t: {};\n\t\t\t}\n\t\t\treturn { ...dynamicStyles };\n\t\t} else {\n\t\t\tif (position === 'left') {\n\t\t\t\tdynamicStyles = {\n\t\t\t\t\t...(isMobile \|\| isGmail \|\| isSmtp ? { maxWidth: '100%' } : {}),\n\t\t\t\t\t...(isPrivateNote\n\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\tbackground: COLORS.background.warning.light,\n\t\t\t\t\t\t }\n\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\tbackgroundColor: message?.isPrivateMail\n\t\t\t\t\t\t\t\t\t? COLORS.background.blue.light\n\t\t\t\t\t\t\t\t\t: COLORS.background.warning.light,\n\t\t\t\t\t\t }),\n\t\t\t\t};\n\t\t\t} else {\n\t\t\t\tconst isUnsatisfactory =\n\t\t\t\t\tisUnsatisfactoryMessageFn &&\n\t\t\t\t\tisUnsatisfactoryMessageFn({\n\t\t\t\t\t\taiTraceId: message.eventProperties?.aiTraceId,\n\t\t\t\t\t\tmessagesGroupedByAiTraceId,\n\t\t\t\t\t});\n\n\t\t\t\tdynamicStyles = {\n\t\t\t\t\tbackgroundColor:\n\t\t\t\t\t\tmessage.status === 'failed' \|\| isUnsatisfactory\n\t\t\t\t\t\t\t? COLORS.background.negative.light\n\t\t\t\t\t\t\t: COLORS.background.brandUltraLight,\n\t\t\t\t\t...(isPrivateNote\n\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\tbackground: COLORS.background.warning.light,\n\t\t\t\t\t\t }\n\t\t\t\t\t\t: {}),\n\t\t\t\t\t...(!isMobile && isCarouselMessage ? { maxWidth: 500 } : {}),\n\t\t\t\t};\n\t\t\t}\n\t\t}\n\t\tconst extraBubbleStyles: React.CSSProperties =\n\t\t\tbubbleStyles && typeof bubbleStyles === 'object'\n\t\t\t\t? 'left' in bubbleStyles \|\| 'right' in bubbleStyles\n\t\t\t\t\t? position === 'left'\n\t\t\t\t\t\t? (bubbleStyles as { left?: React.CSSProperties }).left ?? {}\n\t\t\t\t\t\t: (bubbleStyles as { right?: React.CSSProperties }).right ?? {}\n\t\t\t\t\t: (bubbleStyles as React.CSSProperties)\n\t\t\t\t: {};\n\n\t\treturn { ...baseStyles, ...dynamicStyles, ...extraBubbleStyles };\n\t}, [\n\t\tmessage?.channelId,\n\t\tmessage?.channelName,\n\t\tmessage?.meta?.aiUsed,\n\t\tmessage?.status,\n\t\tmessage?.eventProperties?.aiTraceId,\n\t\tposition,\n\t\tisMobile,\n\t\tisPrivateNote,\n\t\tisCarouselMessage,\n\t\tisUnsatisfactoryMessageFn,\n\t\tmessagesGroupedByAiTraceId,\n\t\tmessage?.isPrivateMail,\n\t\tbubbleStyles,\n\t\tisManifestApp,\n\t]);\n\n\t// Renders the content of the message bubble\n\t// Handles custom views and message text in the correct order\n\tconst renderContent = useCallback(() => {\n\t\treturn (\n\t\t\t<div>\n\t\t\t\t{!isCustomViewBottom && renderCustomView?.(props)}\n\n\t\t\t\t{renderMessageText?.(props)}\n\n\t\t\t\t{isCustomViewBottom && renderCustomView?.(props)}\n\t\t\t</div>\n\t\t);\n\t}, [isCustomViewBottom, renderCustomView, renderMessageText, props]);\n\n\tconst manifestContainerStyle = useMemo(() => {\n\t\tif (!isManifestApp \|\| typeof containerStyle !== 'object') return {};\n\t\tif (\n\t\t\tposition === 'left' &&\n\t\t\t'left' in containerStyle &&\n\t\t\tcontainerStyle.left &&\n\t\t\ttypeof containerStyle.left === 'object'\n\t\t) {\n\t\t\treturn containerStyle.left;\n\t\t}\n\t\tif (\n\t\t\tposition === 'right' &&\n\t\t\t'right' in containerStyle &&\n\t\t\tcontainerStyle.right &&\n\t\t\ttypeof containerStyle.right === 'object'\n\t\t) {\n\t\t\treturn containerStyle.right;\n\t\t}\n\t\treturn {};\n\t}, [isManifestApp, containerStyle, position]);\n\n\tconst extraContainerStyle: React.CSSProperties =\n\t\t!isManifestApp && containerStyle && typeof containerStyle === 'object'\n\t\t\t? 'left' in containerStyle \|\| 'right' in containerStyle\n\t\t\t\t? position === 'left'\n\t\t\t\t\t? (containerStyle as { left?: React.CSSProperties }).left ?? {}\n\t\t\t\t\t: (containerStyle as { right?: React.CSSProperties }).right ?? {}\n\t\t\t\t: (containerStyle as React.CSSProperties)\n\t\t\t: {};\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\tdisplay: 'flex',\n\t\t\t\tmarginTop: isManifestApp ? 0 : 6,\n\t\t\t\tmarginBottom: isManifestApp\n\t\t\t\t\t? 0\n\t\t\t\t\t: currentMessage?.['messageInformation']?.reactions?.length > 0\n\t\t\t\t\t? 24\n\t\t\t\t\t: 6,\n\t\t\t\tflexGrow: isMobile ? 1 : 0,\n\t\t\t\t...(isManifestApp\n\t\t\t\t\t? {\n\t\t\t\t\t\t\talignItems: 'flex-end',\n\t\t\t\t\t\t\t...(position === 'right' ? { cursor: 'pointer' } : {}),\n\t\t\t\t\t }\n\t\t\t\t\t: {}),\n\t\t\t\t...manifestContainerStyle,\n\t\t\t\t...extraContainerStyle,\n\t\t\t}}\n\t\t\t{...(isManifestApp ? { onClick: onPress } : {})}\n\t\t>\n\t\t\t<div style={wrapperStyles}>\n\t\t\t\t<div\n\t\t\t\t\t// For sent (right) messages, lay the content and the time/ticks\n\t\t\t\t\t// in a wrapping row so a short message keeps the time beside it\n\t\t\t\t\t// (with a gap) like WhatsApp, while wide/long content pushes the\n\t\t\t\t\t// time onto its own line below.\n\t\t\t\t\tstyle={\n\t\t\t\t\t\tposition === 'right'\n\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\tflexWrap: 'wrap',\n\t\t\t\t\t\t\t\t\talignItems: 'flex-end',\n\t\t\t\t\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t\t\t\t\t\tcolumnGap: 6,\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t{/* Message content /}\n\t\t\t\t\t<div\n\t\t\t\t\t\tid={\n\t\t\t\t\t\t\tcurrentMessage['chatActivityId'] \|\|\n\t\t\t\t\t\t\t`message-${currentMessage['psqlId']}`\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderContent()}\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{/ Message metadata (time and status) */}\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t\t\t\tflexShrink: 0,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderTime?.(props)}\n\t\t\t\t\t\t{renderTicks?.(currentMessage)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\n// Export memoized version for performance\nexport const Bubble = React.memo(BubbleComponent) as typeof BubbleComponent;\n\nexport default Bubble;\n"],"names":["BubbleComponent","props","currentMessage","position","renderMessageText","renderTicks","renderTime","renderCustomView","isCustomViewBottom","isUnsatisfactoryMessageFn","messagesGroupedByAiTraceId","onPress","containerStyle","bubbleStyles","appType","GiftedChatAppType","isMobile","useWindowSize","message","isManifestApp","isPrivateNote","useMemo","Constants","isCarouselMessage","parsedSuccessfully","parsedMessage","isStringifiedArray","isSmtp","MESSAGE_CHANNELS","wrapperStyles","baseStyles","isGmail","dynamicStyles","COLORS","isUnsatisfactory","extraBubbleStyles","renderContent","useCallback","manifestContainerStyle","extraContainerStyle","jsx","jsxs","Bubble","React"],"mappings":"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"}
1	+ {"version":3,"file":"Bubble.js","sources":["../../../../../src/components/BikGiftedChat/Bubble/Bubble.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react';\nimport { COLORS } from '../../../constants/Theme';\nimport { useWindowSize } from '../../../hooks/useWindowSize';\nimport { MESSAGE_CHANNELS } from '../GiftedChat/types';\nimport { Constants, isStringifiedArray } from '../GiftedChat/utils';\nimport { IMessage } from '../types';\nimport { BubbleProps, GiftedChatAppType } from './types';\n\nconst BubbleComponent = <TMessage extends IMessage = IMessage>(\n\tprops: BubbleProps<TMessage>,\n): React.ReactElement => {\n\tconst {\n\t\tcurrentMessage,\n\t\tposition,\n\t\trenderMessageText,\n\t\trenderTicks,\n\t\trenderTime,\n\t\trenderCustomView,\n\t\tisCustomViewBottom,\n\t\tisUnsatisfactoryMessageFn,\n\t\tmessagesGroupedByAiTraceId,\n\t\tonPress,\n\t\tcontainerStyle,\n\t\tbubbleStyles,\n\t\tappType = GiftedChatAppType.Bik,\n\t} = props;\n\n\tconst isMobile = useWindowSize();\n\tconst message = currentMessage as any;\n\tconst isManifestApp = appType === GiftedChatAppType.Manifest;\n\n\t// Check if message is a private note\n\tconst isPrivateNote = useMemo(\n\t\t() =>\n\t\t\tmessage.category === Constants.ChatActivity.Category.ACTIVITY &&\n\t\t\tmessage.activityType === Constants.ChatActivity.Type.PRIVATE_NOTE,\n\t\t[message.category, message.activityType],\n\t);\n\n\t// Check if message is a carousel (array of items)\n\tconst isCarouselMessage = useMemo(() => {\n\t\tconst [parsedSuccessfully, parsedMessage] = isStringifiedArray(\n\t\t\tmessage?.message,\n\t\t);\n\t\treturn parsedSuccessfully && parsedMessage && Array.isArray(parsedMessage);\n\t}, [message?.message]);\n\tconst isSmtp =\n\t\tmessage?.channelId === MESSAGE_CHANNELS.SMTP \|\|\n\t\tmessage?.channelName === MESSAGE_CHANNELS.SMTP;\n\n\t// Generates wrapper styles for the message bubble\n\t// Handles position-based styling, channel-specific layouts, and message states\n\tconst wrapperStyles = useMemo((): React.CSSProperties => {\n\t\tconst baseStyles: React.CSSProperties = {\n\t\t\tborderRadius: 8,\n\t\t\tminHeight: 20,\n\t\t\tmargin: 0,\n\t\t\tflexGrow: isMobile ? 1 : 0,\n\t\t\twidth: '100%',\n\t\t};\n\n\t\t// Check if message is from email channels\n\t\tconst isGmail =\n\t\t\tmessage?.channelId === MESSAGE_CHANNELS.GMAIL \|\|\n\t\t\tmessage?.channelName === MESSAGE_CHANNELS.GMAIL;\n\n\t\tlet dynamicStyles: React.CSSProperties = {};\n\n\t\tif (isManifestApp) {\n\t\t\tif (position === 'left') {\n\t\t\t\tdynamicStyles =\n\t\t\t\t\tbubbleStyles && typeof bubbleStyles.left === 'object'\n\t\t\t\t\t\t? bubbleStyles.left\n\t\t\t\t\t\t: {};\n\t\t\t} else {\n\t\t\t\tdynamicStyles =\n\t\t\t\t\tbubbleStyles && typeof bubbleStyles.right === 'object'\n\t\t\t\t\t\t? bubbleStyles.right\n\t\t\t\t\t\t: {};\n\t\t\t}\n\t\t\treturn { ...dynamicStyles };\n\t\t} else {\n\t\t\tif (position === 'left') {\n\t\t\t\tdynamicStyles = {\n\t\t\t\t\t...(isMobile \|\| isGmail \|\| isSmtp ? { maxWidth: '100%' } : {}),\n\t\t\t\t\t...(isPrivateNote\n\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\tbackground: COLORS.background.warning.light,\n\t\t\t\t\t\t }\n\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\tbackgroundColor: message?.isPrivateMail\n\t\t\t\t\t\t\t\t\t? COLORS.background.blue.light\n\t\t\t\t\t\t\t\t\t: COLORS.background.warning.light,\n\t\t\t\t\t\t }),\n\t\t\t\t};\n\t\t\t} else {\n\t\t\t\tconst isUnsatisfactory =\n\t\t\t\t\tisUnsatisfactoryMessageFn &&\n\t\t\t\t\tisUnsatisfactoryMessageFn({\n\t\t\t\t\t\taiTraceId: message.eventProperties?.aiTraceId,\n\t\t\t\t\t\tmessagesGroupedByAiTraceId,\n\t\t\t\t\t});\n\n\t\t\t\tdynamicStyles = {\n\t\t\t\t\tbackgroundColor:\n\t\t\t\t\t\tmessage.status === 'failed' \|\| isUnsatisfactory\n\t\t\t\t\t\t\t? COLORS.background.negative.light\n\t\t\t\t\t\t\t: COLORS.background.brandUltraLight,\n\t\t\t\t\t...(isPrivateNote\n\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\tbackground: COLORS.background.warning.light,\n\t\t\t\t\t\t }\n\t\t\t\t\t\t: {}),\n\t\t\t\t\t...(!isMobile && isCarouselMessage ? { maxWidth: 500 } : {}),\n\t\t\t\t};\n\t\t\t}\n\t\t}\n\t\tconst extraBubbleStyles: React.CSSProperties =\n\t\t\tbubbleStyles && typeof bubbleStyles === 'object'\n\t\t\t\t? 'left' in bubbleStyles \|\| 'right' in bubbleStyles\n\t\t\t\t\t? position === 'left'\n\t\t\t\t\t\t? (bubbleStyles as { left?: React.CSSProperties }).left ?? {}\n\t\t\t\t\t\t: (bubbleStyles as { right?: React.CSSProperties }).right ?? {}\n\t\t\t\t\t: (bubbleStyles as React.CSSProperties)\n\t\t\t\t: {};\n\n\t\treturn { ...baseStyles, ...dynamicStyles, ...extraBubbleStyles };\n\t}, [\n\t\tmessage?.channelId,\n\t\tmessage?.channelName,\n\t\tmessage?.meta?.aiUsed,\n\t\tmessage?.status,\n\t\tmessage?.eventProperties?.aiTraceId,\n\t\tposition,\n\t\tisMobile,\n\t\tisPrivateNote,\n\t\tisCarouselMessage,\n\t\tisUnsatisfactoryMessageFn,\n\t\tmessagesGroupedByAiTraceId,\n\t\tmessage?.isPrivateMail,\n\t\tbubbleStyles,\n\t\tisManifestApp,\n\t]);\n\n\t// Renders the content of the message bubble\n\t// Handles custom views and message text in the correct order\n\tconst renderContent = useCallback(() => {\n\t\treturn (\n\t\t\t<div>\n\t\t\t\t{!isCustomViewBottom && renderCustomView?.(props)}\n\n\t\t\t\t{renderMessageText?.(props)}\n\n\t\t\t\t{isCustomViewBottom && renderCustomView?.(props)}\n\t\t\t</div>\n\t\t);\n\t}, [isCustomViewBottom, renderCustomView, renderMessageText, props]);\n\n\tconst manifestContainerStyle = useMemo(() => {\n\t\tif (!isManifestApp \|\| typeof containerStyle !== 'object') return {};\n\t\tif (\n\t\t\tposition === 'left' &&\n\t\t\t'left' in containerStyle &&\n\t\t\tcontainerStyle.left &&\n\t\t\ttypeof containerStyle.left === 'object'\n\t\t) {\n\t\t\treturn containerStyle.left;\n\t\t}\n\t\tif (\n\t\t\tposition === 'right' &&\n\t\t\t'right' in containerStyle &&\n\t\t\tcontainerStyle.right &&\n\t\t\ttypeof containerStyle.right === 'object'\n\t\t) {\n\t\t\treturn containerStyle.right;\n\t\t}\n\t\treturn {};\n\t}, [isManifestApp, containerStyle, position]);\n\n\tconst extraContainerStyle: React.CSSProperties =\n\t\t!isManifestApp && containerStyle && typeof containerStyle === 'object'\n\t\t\t? 'left' in containerStyle \|\| 'right' in containerStyle\n\t\t\t\t? position === 'left'\n\t\t\t\t\t? (containerStyle as { left?: React.CSSProperties }).left ?? {}\n\t\t\t\t\t: (containerStyle as { right?: React.CSSProperties }).right ?? {}\n\t\t\t\t: (containerStyle as React.CSSProperties)\n\t\t\t: {};\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\tdisplay: 'flex',\n\t\t\t\tmarginTop: isManifestApp ? 0 : 6,\n\t\t\t\tmarginBottom: isManifestApp\n\t\t\t\t\t? 0\n\t\t\t\t\t: currentMessage?.['messageInformation']?.reactions?.length > 0\n\t\t\t\t\t? 24\n\t\t\t\t\t: 6,\n\t\t\t\tflexGrow: isMobile ? 1 : 0,\n\t\t\t\t...(isManifestApp\n\t\t\t\t\t? {\n\t\t\t\t\t\t\talignItems: 'flex-end',\n\t\t\t\t\t\t\t...(position === 'right' ? { cursor: 'pointer' } : {}),\n\t\t\t\t\t }\n\t\t\t\t\t: {}),\n\t\t\t\t...manifestContainerStyle,\n\t\t\t\t...extraContainerStyle,\n\t\t\t}}\n\t\t\t{...(isManifestApp ? { onClick: onPress } : {})}\n\t\t>\n\t\t\t<div style={wrapperStyles}>\n\t\t\t\t<div\n\t\t\t\t\t// Lay the content and the time/ticks in a wrapping row so a short\n\t\t\t\t\t// message keeps the time beside it (with a gap) like WhatsApp, while\n\t\t\t\t\t// wide/long content pushes the time onto its own line below. The\n\t\t\t\t\t// time's `margin-left: auto` keeps it right-aligned on either side.\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexWrap: 'wrap',\n\t\t\t\t\t\talignItems: 'flex-end',\n\t\t\t\t\t\tcolumnGap: 6,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{/* Message content /}\n\t\t\t\t\t<div\n\t\t\t\t\t\tid={\n\t\t\t\t\t\t\tcurrentMessage['chatActivityId'] \|\|\n\t\t\t\t\t\t\t`message-${currentMessage['psqlId']}`\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderContent()}\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{/ Message metadata (time and status) */}\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t\t\t\tflexShrink: 0,\n\t\t\t\t\t\t\tmarginLeft: 'auto',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderTime?.(props)}\n\t\t\t\t\t\t{renderTicks?.(currentMessage)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\n// Export memoized version for performance\nexport const Bubble = React.memo(BubbleComponent) as typeof BubbleComponent;\n\nexport default Bubble;\n"],"names":["BubbleComponent","props","currentMessage","position","renderMessageText","renderTicks","renderTime","renderCustomView","isCustomViewBottom","isUnsatisfactoryMessageFn","messagesGroupedByAiTraceId","onPress","containerStyle","bubbleStyles","appType","GiftedChatAppType","isMobile","useWindowSize","message","isManifestApp","isPrivateNote","useMemo","Constants","isCarouselMessage","parsedSuccessfully","parsedMessage","isStringifiedArray","isSmtp","MESSAGE_CHANNELS","wrapperStyles","baseStyles","isGmail","dynamicStyles","COLORS","isUnsatisfactory","extraBubbleStyles","renderContent","useCallback","manifestContainerStyle","extraContainerStyle","jsx","jsxs","Bubble","React"],"mappings":"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"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.821-beta.2",
+	"version": "0.0.821-beta.3",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",