diff --git a/extensions/react-widget/package.json b/extensions/react-widget/package.json index a7fb03602..60397ef5e 100644 --- a/extensions/react-widget/package.json +++ b/extensions/react-widget/package.json @@ -1,6 +1,6 @@ { "name": "docsgpt", - "version": "0.3.9", + "version": "0.4.0", "private": false, "description": "DocsGPT 🦖 is an innovative open-source tool designed to simplify the retrieval of information from project documentation using advanced GPT models 🤖.", "source": "./src/index.html", diff --git a/extensions/react-widget/src/components/DocsGPTWidget.tsx b/extensions/react-widget/src/components/DocsGPTWidget.tsx index ae62fb428..320b83121 100644 --- a/extensions/react-widget/src/components/DocsGPTWidget.tsx +++ b/extensions/react-widget/src/components/DocsGPTWidget.tsx @@ -142,8 +142,8 @@ const Conversation = styled.div<{ size: string }>` @media only screen and (max-width: 768px) { width: 90vw !important; } - @media only screen and (min-width:768px ) and (max-width: 1023px) { - width:${props => props.size === 'medium' ? '400px' : '60vw'} !important; + @media only screen and (min-width:768px ) and (max-width: 1024px) { + width:${props => props.size === 'medium' ? '60vw' : '400px'} !important; } `; @@ -160,7 +160,7 @@ const Message = styled.p<{ type: MESSAGE_TYPE }>` '#38383b'}; color: #ffff; border: none; - max-width: 80%; + max-width: ${props => props.type === 'ANSWER' ? '100%' : '80'}; overflow: auto; margin: 4px; display: block; diff --git a/extensions/react-widget/src/main.tsx b/extensions/react-widget/src/main.tsx index 1342df12d..b766ce3fb 100644 --- a/extensions/react-widget/src/main.tsx +++ b/extensions/react-widget/src/main.tsx @@ -2,6 +2,7 @@ import React from 'react'; import { createRoot } from 'react-dom/client'; import { DocsGPTWidget } from './components/DocsGPTWidget'; + const renderWidget = (elementId: string, props = {}) => { const root = createRoot(document.getElementById(elementId) as HTMLElement); root.render();