softchatjs-react/dist/components/user-conversations/ConversationHeader.mjs.map

Install the softchat-js SDKs

{"version":3,"sources":["../../../src/components/user-conversations/ConversationHeader.tsx"],"sourcesContent":["import { ConnectionStatus } from \"@/src/providers/clientStateProvider\";\r\nimport { ReactTheme } from \"@/src/theme/type\";\r\nimport React, { useState } from \"react\";\r\n\r\nexport default function ConversationHeader({\r\n  connectionStatus,\r\n  theme,\r\n  onTextChange\r\n}: {\r\n  connectionStatus: ConnectionStatus;\r\n  theme: ReactTheme;\r\n  onTextChange: (value: string) => void;\r\n}) {\r\n\r\n  const [ value, setValue ] = useState('');\r\n\r\n  const handleTextChange = (value: string) => {\r\n    setValue(value); onTextChange(value)\r\n  }\r\n\r\n  return (\r\n    <div\r\n      style={{\r\n        width: \"100%\",\r\n        padding: \"20px\",\r\n      }}\r\n    >\r\n      <div>\r\n        {connectionStatus.isConnected ? (\r\n          <span\r\n            style={{\r\n              display: \"flex\",\r\n              alignItems: \"center\",\r\n              color: theme.text.primary,\r\n            }}\r\n          >\r\n            {/* Connected{\" \"}\r\n            <div\r\n              style={{\r\n                marginLeft: 10,\r\n                height: \"5px\",\r\n                width: \"5px\",\r\n                borderRadius: \"5px\",\r\n                backgroundColor: \"green\",\r\n              }}\r\n            /> */}\r\n            <p style={{ fontWeight: \"bold\", fontSize: \"26px\" }}>Chats</p>\r\n            <span\r\n              style={{\r\n                marginLeft: 10,\r\n                height: \"5px\",\r\n                width: \"5px\",\r\n                borderRadius: \"5px\",\r\n                backgroundColor: \"green\",\r\n              }}\r\n            /> \r\n          </span>\r\n        ) : (\r\n          <p style={{ color: theme.text.primary }}>Connecting...</p>\r\n        )}\r\n      </div>\r\n      <input \r\n        value={value}\r\n        onChange={e => handleTextChange(e.target.value)}\r\n        placeholder=\"Search chats\"\r\n        style={{ \r\n          height: '40px', \r\n          width: '100%', \r\n          marginTop: '15px', \r\n          textIndent: '15px', \r\n          backgroundColor: 'transparent', \r\n          // color: 'white', \r\n          border: `1px solid ${theme.divider}`, \r\n          borderRadius: '10px',\r\n          color: theme.text.primary\r\n        }}\r\n      />\r\n    </div>\r\n  );\r\n}\r\n"],"mappings":"AAEA,OAAgB,YAAAA,MAAgB,QA2BtB,OAiBE,OAAAC,EAjBF,QAAAC,MAAA,oBAzBK,SAARC,EAAoC,CACzC,iBAAAC,EACA,MAAAC,EACA,aAAAC,CACF,EAIG,CAED,GAAM,CAAEC,EAAOC,CAAS,EAAIR,EAAS,EAAE,EAEjCS,EAAoBF,GAAkB,CAC1CC,EAASD,CAAK,EAAGD,EAAaC,CAAK,CACrC,EAEA,OACEL,EAAC,OACC,MAAO,CACL,MAAO,OACP,QAAS,MACX,EAEA,UAAAD,EAAC,OACE,SAAAG,EAAiB,YAChBF,EAAC,QACC,MAAO,CACL,QAAS,OACT,WAAY,SACZ,MAAOG,EAAM,KAAK,OACpB,EAYA,UAAAJ,EAAC,KAAE,MAAO,CAAE,WAAY,OAAQ,SAAU,MAAO,EAAG,iBAAK,EACzDA,EAAC,QACC,MAAO,CACL,WAAY,GACZ,OAAQ,MACR,MAAO,MACP,aAAc,MACd,gBAAiB,OACnB,EACF,GACF,EAEAA,EAAC,KAAE,MAAO,CAAE,MAAOI,EAAM,KAAK,OAAQ,EAAG,yBAAa,EAE1D,EACAJ,EAAC,SACC,MAAOM,EACP,SAAUG,GAAKD,EAAiBC,EAAE,OAAO,KAAK,EAC9C,YAAY,eACZ,MAAO,CACL,OAAQ,OACR,MAAO,OACP,UAAW,OACX,WAAY,OACZ,gBAAiB,cAEjB,OAAQ,aAAaL,EAAM,OAAO,GAClC,aAAc,OACd,MAAOA,EAAM,KAAK,OACpB,EACF,GACF,CAEJ","names":["useState","jsx","jsxs","ConversationHeader","connectionStatus","theme","onTextChange","value","setValue","handleTextChange","e"]}