@botonic/react 0.21.4 → 0.21.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@botonic/react",
-  "version": "0.21.4",
+  "version": "0.21.5",
   "license": "MIT",
   "description": "Build Chatbots using React",
   "main": "src/index.js",
@@ -42,14 +42,14 @@
     "react-frame-component": "^4.1.3",
     "react-json-tree": "^0.15.0",
     "react-reveal": "^1.2.2",
-    "react-router-dom": "^5.2.1",
+    "react-router-dom": "^5.3.4",
     "react-textarea-autosize": "^7.1.2",
     "reconnecting-websocket": "^4.4.0",
-    "simplebar-react": "^2.3.3",
+    "simplebar-react": "^2.4.3",
     "styled-components": "^5.3.0",
-    "ua-parser-js": "^0.7.21",
+    "ua-parser-js": "^0.8.1",
     "unescape": "^1.0.1",
-    "use-async-effect": "^2.2.3",
+    "use-async-effect": "^2.2.7",
     "uuid": "^8.3.2"
   },
   "devDependencies": {

package/src/components/audio.jsx

@@ -2,6 +2,7 @@ import { INPUT, isBrowser } from '@botonic/core'
 import React from 'react'
 
 import { ROLES } from '../constants'
+import { staticAsset } from '../util/environment'
 import { Message } from './message'
 
 const serialize = audioProps => {
@@ -9,6 +10,7 @@ const serialize = audioProps => {
 }
 
 export const Audio = props => {
+  props = { ...props, src: staticAsset(props.src) }
   let content = props.children
   if (isBrowser())
     content = (

package/src/components/document.jsx

@@ -4,6 +4,7 @@ import styled from 'styled-components'
 
 import { ROLES, WEBCHAT } from '../constants'
 import { WebchatContext } from '../contexts'
+import { staticAsset } from '../util/environment'
 import { Message } from './message'
 
 const StyledButton = styled.a`
@@ -29,6 +30,7 @@ const serialize = documentProps => {
 }
 
 export const Document = props => {
+  props = { ...props, src: staticAsset(props.src) }
   let content = props.children
 
   const { getThemeProperty } = useContext(WebchatContext)

package/src/components/image.jsx

@@ -4,6 +4,7 @@ import styled from 'styled-components'
 
 import { ROLES, WEBCHAT } from '../constants'
 import { WebchatContext } from '../contexts'
+import { staticAsset } from '../util/environment'
 import { Message } from './message'
 
 const StyledImage = styled.img`
@@ -19,6 +20,7 @@ const serialize = imageProps => {
 }
 
 export const Image = props => {
+  props = { ...props, src: staticAsset(props.src) }
   let content = props.children
 
   const [isPreviewerOpened, setIsPreviewerOpened] = useState(false)

package/src/components/pic.jsx

@@ -2,6 +2,7 @@ import React from 'react'
 import styled from 'styled-components'
 
 import { COLORS, WEBCHAT } from '../constants'
+import { staticAsset } from '../util/environment'
 import { renderComponent } from '../util/react'
 
 const PicStyled = styled.img`
@@ -15,6 +16,7 @@ const PicStyled = styled.img`
 `
 
 export const Pic = props => {
+  props = { ...props, src: staticAsset(props.src) }
   const renderBrowser = () => <PicStyled src={props.src} />
   const renderNode = () => <pic>{props.src}</pic>
   return renderComponent({ renderBrowser, renderNode })

package/src/components/video.jsx

@@ -3,6 +3,7 @@ import React from 'react'
 import styled from 'styled-components'
 
 import { COLORS, ROLES } from '../constants'
+import { staticAsset } from '../util/environment'
 import { Message } from './message'
 
 const StyledVideo = styled.video`
@@ -18,6 +19,7 @@ const serialize = videoProps => {
 }
 
 export const Video = props => {
+  props = { ...props, src: staticAsset(props.src) }
   let content = props.children
   if (isBrowser())
     content = (

package/src/util/environment.js

@@ -9,7 +9,8 @@ export const staticAsset = path => {
       .getAttribute('src')
     const scriptName = scriptBaseURL.split('/').pop()
     const basePath = scriptBaseURL.replace('/' + scriptName, '/')
-    return basePath + path
+    const resolvedStaticAssetPath = basePath + path
+    return resolvedStaticAssetPath
   } catch (e) {
     console.error(`Could not resolve path: '${path}'`)
     return path