From 05aa9d7cca9656eb2ad88587609f3a516d753e31 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 23 Mar 2026 20:53:52 +0000 Subject: [PATCH 1/2] chore(deps): bump styled-components in /extensions/react-widget Bumps [styled-components](https://github.com/styled-components/styled-components) from 6.1.11 to 6.3.12. - [Release notes](https://github.com/styled-components/styled-components/releases) - [Commits](https://github.com/styled-components/styled-components/compare/v6.1.11...styled-components@6.3.12) --- updated-dependencies: - dependency-name: styled-components dependency-version: 6.3.12 dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] --- extensions/react-widget/package-lock.json | 109 ++++++++++++---------- 1 file changed, 59 insertions(+), 50 deletions(-) diff --git a/extensions/react-widget/package-lock.json b/extensions/react-widget/package-lock.json index 6548b565..ddc434cd 100644 --- a/extensions/react-widget/package-lock.json +++ b/extensions/react-widget/package-lock.json @@ -1833,22 +1833,25 @@ "license": "MIT" }, "node_modules/@emotion/is-prop-valid": { - "version": "1.2.2", - "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.2.2.tgz", - "integrity": "sha512-uNsoYd37AFmaCdXlg6EYD1KaPOaRWRByMCYzbKUX4+hhMfrxdVSelShywL4JVaAeM/eHUOSprYBQls+/neX3pw==", + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.4.0.tgz", + "integrity": "sha512-QgD4fyscGcbbKwJmqNvUMSE02OsHUa+lAWKdEUIJKgqe5IwRSKd7+KhibEWdaKwgjLj0DRSHA9biAIqGBk05lw==", + "license": "MIT", "dependencies": { - "@emotion/memoize": "^0.8.1" + "@emotion/memoize": "^0.9.0" } }, "node_modules/@emotion/memoize": { - "version": "0.8.1", - "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.8.1.tgz", - "integrity": "sha512-W2P2c/VRW1/1tLox0mVUalvnWXxavmv/Oum2aPsRcoDJuob75FC3Y8FbpfLwUegRcxINtGUMPq0tFCvYNTBXNA==" + "version": "0.9.0", + "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.9.0.tgz", + "integrity": "sha512-30FAj7/EoJ5mwVPOWhAyCX+FPfMDrVecJAM+Iw9NRoSl4BBAQeqj4cApHHUXOVvIPgLVDsCFoz/hGD+5QQD1GQ==", + "license": "MIT" }, "node_modules/@emotion/unitless": { - "version": "0.8.1", - "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.8.1.tgz", - "integrity": "sha512-KOEGMu6dmJZtpadb476IsZBclKvILjopjUii3V+7MnXIQCYh8W3NgNcgwo21n9LXZX6EDIKvqfjYxXebDwxKmQ==" + "version": "0.10.0", + "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.10.0.tgz", + "integrity": "sha512-dFoMUuQA20zvtVTuxZww6OHoJYgrzfKM1t52mVySDJnMSEa08ruEvdYQbhvyu6soU+NeLVd3yKfTfT0NeV6qGg==", + "license": "MIT" }, "node_modules/@jridgewell/gen-mapping": { "version": "0.3.5", @@ -4324,13 +4327,6 @@ "tslib": "^2.8.0" } }, - "node_modules/@swc/helpers/node_modules/tslib": { - "version": "2.8.1", - "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz", - "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==", - "devOptional": true, - "license": "0BSD" - }, "node_modules/@swc/types": { "version": "0.1.25", "resolved": "https://registry.npmjs.org/@swc/types/-/types-0.1.25.tgz", @@ -4400,9 +4396,10 @@ } }, "node_modules/@types/stylis": { - "version": "4.2.5", - "resolved": "https://registry.npmjs.org/@types/stylis/-/stylis-4.2.5.tgz", - "integrity": "sha512-1Xve+NMN7FWjY14vLoY5tL3BVEQ/n42YLwaqJIPYhotZ9uBHt87VceMwWQpzmdEt2TNXIorIFG+YeCUUW7RInw==" + "version": "4.2.7", + "resolved": "https://registry.npmjs.org/@types/stylis/-/stylis-4.2.7.tgz", + "integrity": "sha512-VgDNokpBoKF+wrdvhAAfS55OMQpL6QRglwTwNC3kIgBrzZxA4WsFj+2eLfEA/uMUDzBcEhYmjSbwQakn/i3ajA==", + "license": "MIT" }, "node_modules/@types/trusted-types": { "version": "2.0.7", @@ -4846,9 +4843,10 @@ "license": "CC0-1.0" }, "node_modules/csstype": { - "version": "3.1.3", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", - "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==" + "version": "3.2.3", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.2.3.tgz", + "integrity": "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==", + "license": "MIT" }, "node_modules/debug": { "version": "4.3.5", @@ -5681,15 +5679,16 @@ } }, "node_modules/nanoid": { - "version": "3.3.8", - "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.8.tgz", - "integrity": "sha512-WNLf5Sd8oZxOm+TzppcYk8gVOgP+l58xNy58D0nbUnOxOWRWvlcCV4kUF7ltmI6PsrLl/BgKEyS4mqsGChFN0w==", + "version": "3.3.11", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz", + "integrity": "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==", "funding": [ { "type": "github", "url": "https://github.com/sponsors/ai" } ], + "license": "MIT", "bin": { "nanoid": "bin/nanoid.cjs" }, @@ -5954,9 +5953,9 @@ } }, "node_modules/postcss": { - "version": "8.4.38", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.38.tgz", - "integrity": "sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==", + "version": "8.4.49", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.49.tgz", + "integrity": "sha512-OCVPnIObs4N29kxTjzLfUryOkvZEq+pf8jTF0lg8E7uETuWHA+v7j3c/xJmiqpX450191LlmZfUKkXxkTry7nA==", "funding": [ { "type": "opencollective", @@ -5971,10 +5970,11 @@ "url": "https://github.com/sponsors/ai" } ], + "license": "MIT", "dependencies": { "nanoid": "^3.3.7", - "picocolors": "^1.0.0", - "source-map-js": "^1.2.0" + "picocolors": "^1.1.1", + "source-map-js": "^1.2.1" }, "engines": { "node": "^10 || ^12 || >=14" @@ -6195,27 +6195,29 @@ } }, "node_modules/source-map-js": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz", - "integrity": "sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==", + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz", + "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==", + "license": "BSD-3-Clause", "engines": { "node": ">=0.10.0" } }, "node_modules/styled-components": { - "version": "6.1.11", - "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-6.1.11.tgz", - "integrity": "sha512-Ui0jXPzbp1phYij90h12ksljKGqF8ncGx+pjrNPsSPhbUUjWT2tD1FwGo2LF6USCnbrsIhNngDfodhxbegfEOA==", + "version": "6.3.12", + "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-6.3.12.tgz", + "integrity": "sha512-hFR6xsVkVYbsdcUlzPYFvFfoc6o2KlV0VvgRIQwSYMtdThM7SCxnjX9efh/cWce2kTq16I/Kl3xM98xiLptsXA==", + "license": "MIT", "dependencies": { - "@emotion/is-prop-valid": "1.2.2", - "@emotion/unitless": "0.8.1", - "@types/stylis": "4.2.5", + "@emotion/is-prop-valid": "1.4.0", + "@emotion/unitless": "0.10.0", + "@types/stylis": "4.2.7", "css-to-react-native": "3.2.0", - "csstype": "3.1.3", - "postcss": "8.4.38", + "csstype": "3.2.3", + "postcss": "8.4.49", "shallowequal": "1.1.0", - "stylis": "4.3.2", - "tslib": "2.6.2" + "stylis": "4.3.6", + "tslib": "2.8.1" }, "engines": { "node": ">= 16" @@ -6227,12 +6229,18 @@ "peerDependencies": { "react": ">= 16.8.0", "react-dom": ">= 16.8.0" + }, + "peerDependenciesMeta": { + "react-dom": { + "optional": true + } } }, "node_modules/stylis": { - "version": "4.3.2", - "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.3.2.tgz", - "integrity": "sha512-bhtUjWd/z6ltJiQwg0dUfxEJ+W+jdqQd8TbWLWyeIJHlnsqmGLRFFd8e5mA0AZi/zx90smXRlN66YMTcaSFifg==" + "version": "4.3.6", + "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.3.6.tgz", + "integrity": "sha512-yQ3rwFWRfwNUY7H5vpU0wfdkNSnvnJinhF9830Swlaxl03zsOjCfmX0ugac+3LtK0lYSgwL/KXc8oYL3mG4YFQ==", + "license": "MIT" }, "node_modules/supports-color": { "version": "7.2.0", @@ -6315,9 +6323,10 @@ } }, "node_modules/tslib": { - "version": "2.6.2", - "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz", - "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==" + "version": "2.8.1", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz", + "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==", + "license": "0BSD" }, "node_modules/type-fest": { "version": "0.20.2", From db5c69ca763378395be4545881456d9b1fa140d1 Mon Sep 17 00:00:00 2001 From: ManishMadan2882 Date: Wed, 25 Mar 2026 01:37:09 +0530 Subject: [PATCH 2/2] (chore)react widget: build fix --- extensions/react-widget/custom.d.ts | 9 --- .../react-widget/src/assets/dislike.svg | 4 -- extensions/react-widget/src/assets/like.svg | 4 -- .../src/components/DocsGPTWidget.tsx | 68 +++++++++++-------- extensions/react-widget/src/types/index.ts | 27 ++++++++ extensions/react-widget/tsconfig.json | 11 ++- 6 files changed, 72 insertions(+), 51 deletions(-) delete mode 100644 extensions/react-widget/src/assets/dislike.svg delete mode 100644 extensions/react-widget/src/assets/like.svg diff --git a/extensions/react-widget/custom.d.ts b/extensions/react-widget/custom.d.ts index 4914b1ec..e69de29b 100644 --- a/extensions/react-widget/custom.d.ts +++ b/extensions/react-widget/custom.d.ts @@ -1,9 +0,0 @@ -declare module "*.svg" { - import * as React from "react"; - - const ReactComponent: React.FunctionComponent< - React.SVGProps & { title?: string } - >; - - export default ReactComponent; - } \ No newline at end of file diff --git a/extensions/react-widget/src/assets/dislike.svg b/extensions/react-widget/src/assets/dislike.svg deleted file mode 100644 index ec1d24c2..00000000 --- a/extensions/react-widget/src/assets/dislike.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/extensions/react-widget/src/assets/like.svg b/extensions/react-widget/src/assets/like.svg deleted file mode 100644 index c49604ed..00000000 --- a/extensions/react-widget/src/assets/like.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/extensions/react-widget/src/components/DocsGPTWidget.tsx b/extensions/react-widget/src/components/DocsGPTWidget.tsx index e778e5a8..61a2961f 100644 --- a/extensions/react-widget/src/components/DocsGPTWidget.tsx +++ b/extensions/react-widget/src/components/DocsGPTWidget.tsx @@ -6,10 +6,22 @@ import { PaperPlaneIcon, RocketIcon, ExclamationTriangleIcon, Cross2Icon } from import { FEEDBACK, MESSAGE_TYPE, Query, Status, WidgetCoreProps, WidgetProps } from '../types/index'; import { fetchAnswerStreaming, sendFeedback } from '../requests/streamingApi'; import { ThemeProvider } from 'styled-components'; -import Like from '../assets/like.svg'; -import Dislike from '../assets/dislike.svg'; import MarkdownIt from 'markdown-it'; +const LikeIcon = (props: React.SVGProps) => ( + + + + +); + +const DislikeIcon = (props: React.SVGProps) => ( + + + + +); + const themes = { dark: { bg: '#222327', @@ -78,14 +90,14 @@ const openContainer = keyframes` height: 100px; } 100% { - width: ${(props) => props.theme.dimensions.width}; - height: ${(props) => props.theme.dimensions.height}; + width: ${(props) => props.theme.dimensions!.width}; + height: ${(props) => props.theme.dimensions!.height}; border-radius: 12px; }` const closeContainer = keyframes` 0% { - width: ${(props) => props.theme.dimensions.width}; - height: ${(props) => props.theme.dimensions.height}; + width: ${(props) => props.theme.dimensions!.width}; + height: ${(props) => props.theme.dimensions!.height}; border-radius: 12px; } 100% { @@ -96,29 +108,29 @@ const closeContainer = keyframes` const fadeIn = keyframes` from { opacity: 0; - width: ${(props) => props.theme.dimensions.width}; - height: ${(props) => props.theme.dimensions.height}; + width: ${(props) => props.theme.dimensions!.width}; + height: ${(props) => props.theme.dimensions!.height}; transform: scale(0.9); } to { opacity: 1; transform: scale(1); - width: ${(props) => props.theme.dimensions.width}; - height: ${(props) => props.theme.dimensions.height}; + width: ${(props) => props.theme.dimensions!.width}; + height: ${(props) => props.theme.dimensions!.height}; } ` const fadeOut = keyframes` from { opacity: 1; - width: ${(props) => props.theme.dimensions.width}; - height: ${(props) => props.theme.dimensions.height}; + width: ${(props) => props.theme.dimensions!.width}; + height: ${(props) => props.theme.dimensions!.height}; } to { opacity: 0; transform: scale(0.9); - width: ${(props) => props.theme.dimensions.width}; - height: ${(props) => props.theme.dimensions.height}; + width: ${(props) => props.theme.dimensions!.width}; + height: ${(props) => props.theme.dimensions!.height}; } ` const scaleAnimation = keyframes` @@ -164,10 +176,10 @@ const WidgetContainer = styled.div<{ $modal?: boolean }>` const StyledContainer = styled.div<{ $isOpen: boolean }>` all: initial; - max-height: ${(props) => props.theme.dimensions.maxHeight}; - max-width: ${(props) => props.theme.dimensions.maxWidth}; - width: ${(props) => props.theme.dimensions.width}; - height: ${(props) => props.theme.dimensions.height} ; + max-height: ${(props) => props.theme.dimensions!.maxHeight}; + max-width: ${(props) => props.theme.dimensions!.maxWidth}; + width: ${(props) => props.theme.dimensions!.width}; + height: ${(props) => props.theme.dimensions!.height} ; position: relative; flex-direction: column; justify-content: space-between; @@ -180,7 +192,7 @@ const StyledContainer = styled.div<{ $isOpen: boolean }>` box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 2px 4px rgba(0, 0, 0, 0.1); padding: 26px 26px 0px 26px; animation: ${({ $isOpen, theme }) => - theme.dimensions.size === 'large' + theme.dimensions!.size === 'large' ? $isOpen ? css`${fadeIn} 150ms ease-in forwards` : css` ${fadeOut} 150ms ease-in forwards` @@ -452,7 +464,7 @@ const Delay = styled(DotAnimation) <{ $delay: number }>` `; const PromptContainer = styled.form` background-color: transparent; - min-height: ${props => props.theme.dimensions.size == 'large' ? '40px' : '23px'}; + min-height: ${props => props.theme.dimensions!.size == 'large' ? '40px' : '23px'}; max-height:150px; display: flex; align-items: end; @@ -462,7 +474,7 @@ const StyledTextarea = styled.textarea` box-sizing: border-box; width: 100%; border: 1px solid #686877; - padding: ${props => props.theme.dimensions.size === 'large' ? '18px 12px 14px 12px' : '8px 12px 4px 12px'}; + padding: ${props => props.theme.dimensions!.size === 'large' ? '18px 12px 14px 12px' : '8px 12px 4px 12px'}; background-color: transparent; font-size: 16px; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; @@ -475,7 +487,7 @@ const StyledTextarea = styled.textarea` white-space: pre-wrap; line-height: 1.4; text-align: left; - min-height: ${props => props.theme.dimensions.size === 'large' ? '60px' : '40px'}; + min-height: ${props => props.theme.dimensions!.size === 'large' ? '60px' : '40px'}; max-height: 140px; overflow-y: auto; scrollbar-width: thin; @@ -503,8 +515,8 @@ const StyledButton = styled.button` background-image: linear-gradient(to bottom right, #5AF0EC, #E80D9D); background-color: rgba(0, 0, 0, 0.3); border-radius: 6px; - min-width: ${props => props.theme.dimensions.size === 'large' ? '60px' : '40px'}; - height: ${props => props.theme.dimensions.size === 'large' ? '60px' : '40px'}; + min-width: ${props => props.theme.dimensions!.size === 'large' ? '60px' : '40px'}; + height: ${props => props.theme.dimensions!.size === 'large' ? '60px' : '40px'}; margin-left:8px; padding: 0px; @@ -1013,13 +1025,13 @@ export const WidgetCore = ({ e.stopPropagation() handleFeedback("LIKE", index)} }> - + /> } diff --git a/extensions/react-widget/src/types/index.ts b/extensions/react-widget/src/types/index.ts index 5c6dada3..7b62387e 100644 --- a/extensions/react-widget/src/types/index.ts +++ b/extensions/react-widget/src/types/index.ts @@ -1,3 +1,30 @@ +import 'styled-components'; + +declare module 'styled-components' { + export interface DefaultTheme { + bg: string; + text: string; + primary: { + text: string; + bg: string; + }; + secondary: { + text: string; + bg: string; + }; + /** Present only in SearchBar theme */ + name?: string; + /** Present only in DocsGPTWidget theme (always provided when these styled components render) */ + dimensions?: { + size: string; + width: string; + height: string; + maxWidth?: string; + maxHeight?: string; + }; + } +} + export type MESSAGE_TYPE = 'QUESTION' | 'ANSWER' | 'ERROR'; export type Status = 'idle' | 'loading' | 'failed'; diff --git a/extensions/react-widget/tsconfig.json b/extensions/react-widget/tsconfig.json index 88e86216..20540869 100644 --- a/extensions/react-widget/tsconfig.json +++ b/extensions/react-widget/tsconfig.json @@ -1,9 +1,5 @@ { "compilerOptions": { - "baseUrl": ".", - "paths": { - "@/*": ["src/*", "@/*"] - }, "target": "ES2020", "useDefineForClassFields": true, "lib": ["ES2020", "DOM", "DOM.Iterable"], @@ -23,8 +19,11 @@ "noUnusedLocals": false, "noUnusedParameters": false, "noFallthroughCasesInSwitch": true, - /* The "typeRoots" configuration specifies the locations where - TypeScript looks for type definitions (.d.ts files) to + "paths": { + "@/*": ["./src/*"] + }, + /* The "typeRoots" configuration specifies the locations where + TypeScript looks for type definitions (.d.ts files) to include in the compilation process.*/ "typeRoots": ["./dist/index.d.ts", "node_modules/@types"] },