@botpress/webchat 1.0.0 → 1.0.1
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.
- package/package.json +2 -1
- package/dist/vite.svg +0 -1
- package/index.html +0 -18
- package/public/vite.svg +0 -1
- package/src/App.tsx +0 -41
- package/src/Utils/colors.ts +0 -45
- package/src/Utils/eventEmitter.ts +0 -31
- package/src/Utils/index.ts +0 -2
- package/src/assets/check-circle-bold.svg +0 -5
- package/src/assets/chevron-up.svg +0 -3
- package/src/assets/file-05.svg +0 -6
- package/src/assets/globe-02.svg +0 -6
- package/src/assets/help-circle.svg +0 -3
- package/src/assets/info-circle.svg +0 -3
- package/src/assets/lock-01.svg +0 -4
- package/src/assets/mail-01.svg +0 -6
- package/src/assets/minus-circle.svg +0 -3
- package/src/assets/phone.svg +0 -6
- package/src/assets/send-03.svg +0 -4
- package/src/assets/share-04.svg +0 -5
- package/src/assets/slash-circle-01.svg +0 -3
- package/src/assets/x-circle-bold.svg +0 -5
- package/src/assets/x-close.svg +0 -3
- package/src/assets/x.svg +0 -3
- package/src/client/MessagingClient.ts +0 -87
- package/src/client/adapters/Audio.ts +0 -10
- package/src/client/adapters/Card.ts +0 -104
- package/src/client/adapters/Carousel.ts +0 -11
- package/src/client/adapters/Choice.ts +0 -48
- package/src/client/adapters/Dropdown.ts +0 -39
- package/src/client/adapters/File.ts +0 -10
- package/src/client/adapters/Image.ts +0 -10
- package/src/client/adapters/Location.ts +0 -18
- package/src/client/adapters/Message.ts +0 -26
- package/src/client/adapters/Text.ts +0 -11
- package/src/client/adapters/Utils.ts +0 -11
- package/src/client/adapters/Video.ts +0 -10
- package/src/client/adapters/Voice.ts +0 -9
- package/src/client/adapters/index.ts +0 -12
- package/src/client/index.ts +0 -2
- package/src/components/Avatar.tsx +0 -22
- package/src/components/Block.tsx +0 -17
- package/src/components/Composer.tsx +0 -115
- package/src/components/Container.tsx +0 -17
- package/src/components/Header.tsx +0 -141
- package/src/components/LoadingIndicator.tsx +0 -15
- package/src/components/Message.tsx +0 -52
- package/src/components/MessageList.tsx +0 -75
- package/src/components/Modal.tsx +0 -49
- package/src/components/RestartConversation.tsx +0 -52
- package/src/components/Webchat.tsx +0 -68
- package/src/components/dev-tools/DevTools.tsx +0 -496
- package/src/components/dev-tools/configuration.tsx +0 -27
- package/src/components/dev-tools/helpers.ts +0 -21
- package/src/components/index.ts +0 -12
- package/src/components/renderers/Audio.tsx +0 -11
- package/src/components/renderers/Bubble.tsx +0 -12
- package/src/components/renderers/Button.tsx +0 -59
- package/src/components/renderers/Carousel.tsx +0 -51
- package/src/components/renderers/Column.tsx +0 -22
- package/src/components/renderers/Dropdown.tsx +0 -170
- package/src/components/renderers/File.tsx +0 -13
- package/src/components/renderers/Image.tsx +0 -63
- package/src/components/renderers/Location.tsx +0 -16
- package/src/components/renderers/Row.tsx +0 -22
- package/src/components/renderers/Text.tsx +0 -32
- package/src/components/renderers/Video.tsx +0 -11
- package/src/components/renderers/index.ts +0 -28
- package/src/contexts/ComposerContext.ts +0 -16
- package/src/contexts/MessageContext.ts +0 -16
- package/src/contexts/ModalContext.ts +0 -19
- package/src/contexts/WebchatContext.ts +0 -61
- package/src/contexts/index.ts +0 -4
- package/src/hooks/index.ts +0 -3
- package/src/hooks/useImageSize.ts +0 -30
- package/src/hooks/useRefresh.ts +0 -33
- package/src/hooks/useWebchatStore.ts +0 -45
- package/src/index.css +0 -18
- package/src/index.ts +0 -3
- package/src/main.tsx +0 -33
- package/src/providers/ModalProvider.tsx +0 -35
- package/src/providers/WebchatProvider.tsx +0 -107
- package/src/providers/index.ts +0 -2
- package/src/schemas/index.ts +0 -1
- package/src/schemas/theme.ts +0 -188
- package/src/services/clipboard.ts +0 -8
- package/src/services/images.ts +0 -39
- package/src/services/index.ts +0 -3
- package/src/services/toast.tsx +0 -71
- package/src/themes/dawn.ts +0 -277
- package/src/themes/duskTheme.ts +0 -349
- package/src/themes/eggplant.ts +0 -353
- package/src/themes/galaxy.ts +0 -323
- package/src/themes/index.ts +0 -6
- package/src/themes/midnight.ts +0 -276
- package/src/themes/prism.ts +0 -349
- package/src/twind.config.ts +0 -31
- package/src/types/block-type.ts +0 -150
- package/src/types/image.ts +0 -10
- package/src/types/index.ts +0 -2
- package/src/vite-env.d.ts +0 -1
- package/tailwind.config.js +0 -0
- package/tsconfig.json +0 -30
- package/tsconfig.node.json +0 -10
- package/vite.config.ts +0 -31
package/package.json
CHANGED
package/dist/vite.svg
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
|
package/index.html
DELETED
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="en">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="UTF-8" />
|
|
5
|
-
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
6
|
-
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
7
|
-
<link
|
|
8
|
-
href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@300;400;500;600;700&family=IBM+Plex+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Inter:wght@100;200;300;400;500;600;700;800;900&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
|
9
|
-
rel="stylesheet"
|
|
10
|
-
/>
|
|
11
|
-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
12
|
-
<title>Echo</title>
|
|
13
|
-
</head>
|
|
14
|
-
<body>
|
|
15
|
-
<div id="root"></div>
|
|
16
|
-
<script type="module" src="/src/main.tsx"></script>
|
|
17
|
-
</body>
|
|
18
|
-
</html>
|
package/public/vite.svg
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
|
package/src/App.tsx
DELETED
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
/// <reference types="vite-plugin-svgr/client" />
|
|
2
|
-
|
|
3
|
-
import { GlobeAltIcon } from '@heroicons/react/24/outline'
|
|
4
|
-
import { DocumentTextIcon, EnvelopeIcon, LockClosedIcon, PhoneIcon } from '@heroicons/react/24/solid'
|
|
5
|
-
import { ComponentProps } from 'react'
|
|
6
|
-
import { Toaster } from 'react-hot-toast'
|
|
7
|
-
import { WebchatClient } from './client'
|
|
8
|
-
import {
|
|
9
|
-
Composer,
|
|
10
|
-
ComposerButton,
|
|
11
|
-
ComposerInput,
|
|
12
|
-
Container,
|
|
13
|
-
Header,
|
|
14
|
-
MessageList,
|
|
15
|
-
RestartConversation,
|
|
16
|
-
Webchat,
|
|
17
|
-
} from './components'
|
|
18
|
-
import { WebchatProvider } from './providers'
|
|
19
|
-
import { Theme } from './schemas'
|
|
20
|
-
import { DevTools } from './components/dev-tools/DevTools'
|
|
21
|
-
import { defaultConfiguration } from './components/dev-tools/configuration'
|
|
22
|
-
// import { getSheet, stringify } from '@twind/core'
|
|
23
|
-
// import { twObject } from './main'
|
|
24
|
-
|
|
25
|
-
type Props = {
|
|
26
|
-
theme: Theme
|
|
27
|
-
client: WebchatClient
|
|
28
|
-
} & ComponentProps<typeof Container>
|
|
29
|
-
|
|
30
|
-
export const App = ({ theme, client }: Props) => {
|
|
31
|
-
return (
|
|
32
|
-
<WebchatProvider client={client} styles={theme} configuration={defaultConfiguration}>
|
|
33
|
-
{(configuration) => (
|
|
34
|
-
<>
|
|
35
|
-
<DevTools />
|
|
36
|
-
<Webchat configuration={configuration} />
|
|
37
|
-
</>
|
|
38
|
-
)}
|
|
39
|
-
</WebchatProvider>
|
|
40
|
-
)
|
|
41
|
-
}
|
package/src/Utils/colors.ts
DELETED
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
import { argbFromHex, hexFromArgb, themeFromSourceColor } from '@material/material-color-utilities'
|
|
2
|
-
import convert from 'color-convert'
|
|
3
|
-
import colors from 'tailwindcss/colors'
|
|
4
|
-
|
|
5
|
-
export function buildColorPalette(color: string, theme: 'light' | 'dark' = 'light') {
|
|
6
|
-
const {
|
|
7
|
-
palettes: { primary: primaryPalette, secondary: secondaryPalette },
|
|
8
|
-
schemes,
|
|
9
|
-
} = themeFromSourceColor(argbFromHex(color))
|
|
10
|
-
|
|
11
|
-
const scheme = schemes[theme]
|
|
12
|
-
|
|
13
|
-
return {
|
|
14
|
-
primary: hexFromArgb(scheme.primary),
|
|
15
|
-
primaryHover: hexFromArgb(primaryPalette.tone(theme === 'light' ? 30 : 90)),
|
|
16
|
-
primaryHoverDark: hexFromArgb(primaryPalette.tone(theme === 'light' ? 20 : 95)),
|
|
17
|
-
onPrimary: hexFromArgb(scheme.onPrimary),
|
|
18
|
-
primaryContainer: hexFromArgb(scheme.primaryContainer),
|
|
19
|
-
primaryContainerHover: hexFromArgb(primaryPalette.tone(theme === 'light' ? 80 : 40)),
|
|
20
|
-
onPrimaryContainer: hexFromArgb(scheme.onPrimaryContainer),
|
|
21
|
-
secondary: hexFromArgb(scheme.secondary),
|
|
22
|
-
secondaryHover: hexFromArgb(secondaryPalette.tone(theme === 'light' ? 30 : 90)),
|
|
23
|
-
onSecondary: hexFromArgb(scheme.onSecondary),
|
|
24
|
-
secondaryContainer: hexFromArgb(scheme.secondaryContainer),
|
|
25
|
-
secondaryContainerHover: hexFromArgb(secondaryPalette.tone(theme === 'light' ? 80 : 40)),
|
|
26
|
-
onSecondaryContainer: hexFromArgb(scheme.onSecondaryContainer),
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
type Grays = 'gray' | 'stone' | 'slate' | 'zinc' | 'neutral'
|
|
31
|
-
export function selectGrayFromColor(color: string, omit?: Grays[]) {
|
|
32
|
-
const [primaryHue, ,] = convert.hex.hsl(color)
|
|
33
|
-
|
|
34
|
-
const grays: { name: Grays; HSL: [number, number, number] }[] = [
|
|
35
|
-
{ name: 'gray' as const, HSL: convert.hex.hsl(colors.gray[500]) },
|
|
36
|
-
{ name: 'stone' as const, HSL: convert.hex.hsl(colors.stone[500]) },
|
|
37
|
-
{ name: 'slate' as const, HSL: convert.hex.hsl(colors.slate[500]) },
|
|
38
|
-
{ name: 'zinc' as const, HSL: convert.hex.hsl(colors.zinc[500]) },
|
|
39
|
-
{ name: 'neutral' as const, HSL: convert.hex.hsl(colors.neutral[500]) },
|
|
40
|
-
].filter((gray) => !omit?.includes(gray.name))
|
|
41
|
-
|
|
42
|
-
const hueDiffs = grays.map((gray) => Math.abs(gray.HSL[0] - primaryHue))
|
|
43
|
-
const closestHueIndex = hueDiffs.indexOf(Math.min(...hueDiffs))
|
|
44
|
-
return grays[closestHueIndex].name
|
|
45
|
-
}
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
type CallbackFn<T> = (args: T) => void
|
|
2
|
-
|
|
3
|
-
export class EventEmitter<T extends Record<string, any>> {
|
|
4
|
-
private readonly eventMap: Partial<Record<keyof T, Set<CallbackFn<any>>>>
|
|
5
|
-
|
|
6
|
-
constructor() {
|
|
7
|
-
this.eventMap = {}
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
on<U extends keyof T>(event: U, callback: CallbackFn<T[U]>): () => void {
|
|
11
|
-
if (!this.eventMap[event]) {
|
|
12
|
-
this.eventMap[event] = new Set<CallbackFn<T[U]>>()
|
|
13
|
-
}
|
|
14
|
-
this.eventMap[event]?.add(callback)
|
|
15
|
-
|
|
16
|
-
return () => {
|
|
17
|
-
this.eventMap[event]?.delete(callback)
|
|
18
|
-
}
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
emit<U extends keyof T>(event: U, arg?: T[U]): void {
|
|
22
|
-
this.eventMap[event]?.forEach((callback) => {
|
|
23
|
-
callback(arg)
|
|
24
|
-
})
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
export type Events = {
|
|
29
|
-
[key: string]: undefined
|
|
30
|
-
}
|
|
31
|
-
export const eventEmitter = new EventEmitter<Events>()
|
package/src/Utils/index.ts
DELETED
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"
|
|
2
|
-
stroke-width="1.5">
|
|
3
|
-
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
|
|
4
|
-
d="m7.5 12 3 3 6-6m5.5 3c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10Z" />
|
|
5
|
-
</svg>
|
package/src/assets/file-05.svg
DELETED
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"
|
|
2
|
-
stroke-width="1.5"
|
|
3
|
-
>
|
|
4
|
-
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
|
|
5
|
-
d="M14 2.27V6.4c0 .56 0 .84.109 1.054a1 1 0 0 0 .437.437c.214.11.494.11 1.054.11h4.13M14 17H8m8-4H8m12-3.012V17.2c0 1.68 0 2.52-.327 3.162a3 3 0 0 1-1.311 1.311C17.72 22 16.88 22 15.2 22H8.8c-1.68 0-2.52 0-3.162-.327a3 3 0 0 1-1.311-1.311C4 19.72 4 18.88 4 17.2V6.8c0-1.68 0-2.52.327-3.162a3 3 0 0 1 1.311-1.311C6.28 2 7.12 2 8.8 2h3.212c.733 0 1.1 0 1.446.083.306.073.598.195.867.36.303.185.562.444 1.08.963l3.19 3.188c.518.519.777.778.963 1.081a3 3 0 0 1 .36.867c.082.346.082.712.082 1.446Z" />
|
|
6
|
-
</svg>
|
package/src/assets/globe-02.svg
DELETED
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="18" stroke-width="1.5" height="18" fill="none"
|
|
2
|
-
viewBox="0 0 18 18"
|
|
3
|
-
>
|
|
4
|
-
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
|
|
5
|
-
d="M9 .667A12.75 12.75 0 0 1 12.333 9 12.75 12.75 0 0 1 9 17.333M9 .667A12.75 12.75 0 0 0 5.667 9 12.75 12.75 0 0 0 9 17.333M9 .667a8.333 8.333 0 0 0 0 16.666M9 .667a8.333 8.333 0 0 1 0 16.666M1.083 6.5h15.834m-15.834 5h15.834" />
|
|
6
|
-
</svg>
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
|
|
2
|
-
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3m.08 4h.01M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10Z"/>
|
|
3
|
-
</svg>
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
|
|
2
|
-
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M12 16v-4m0-4h.01M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10Z"/>
|
|
3
|
-
</svg>
|
package/src/assets/lock-01.svg
DELETED
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
|
|
2
|
-
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"
|
|
3
|
-
d="M17 10V8A5 5 0 0 0 7 8v2m5 4.5v2M8.8 21h6.4c1.68 0 2.52 0 3.162-.327a3 3 0 0 0 1.311-1.311C20 18.72 20 17.88 20 16.2v-1.4c0-1.68 0-2.52-.327-3.162a3 3 0 0 0-1.311-1.311C17.72 10 16.88 10 15.2 10H8.8c-1.68 0-2.52 0-3.162.327a3 3 0 0 0-1.311 1.311C4 12.28 4 13.12 4 14.8v1.4c0 1.68 0 2.52.327 3.162a3 3 0 0 0 1.311 1.311C6.28 21 7.12 21 8.8 21Z" />
|
|
4
|
-
</svg>
|
package/src/assets/mail-01.svg
DELETED
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" stroke-width="1.5" width="18" height="16" fill="none"
|
|
2
|
-
viewBox="0 0 18 16"
|
|
3
|
-
>
|
|
4
|
-
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
|
|
5
|
-
d="M.667 3.833 7.47 8.596c.55.386.826.579 1.126.653.265.066.541.066.806 0 .3-.074.575-.267 1.126-.653l6.804-4.763M4.667 14.667h8.666c1.4 0 2.1 0 2.635-.273a2.5 2.5 0 0 0 1.093-1.092c.272-.535.272-1.235.272-2.635V5.333c0-1.4 0-2.1-.272-2.635a2.5 2.5 0 0 0-1.093-1.092c-.534-.273-1.235-.273-2.635-.273H4.667c-1.4 0-2.1 0-2.635.273A2.5 2.5 0 0 0 .939 2.698C.667 3.233.667 3.933.667 5.333v5.334c0 1.4 0 2.1.272 2.635a2.5 2.5 0 0 0 1.093 1.092c.534.273 1.234.273 2.635.273Z" />
|
|
6
|
-
</svg>
|
package/src/assets/phone.svg
DELETED
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" stroke-width="1.5" width="18" height="18" fill="none"
|
|
2
|
-
viewBox="0 0 18 18"
|
|
3
|
-
>
|
|
4
|
-
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
|
|
5
|
-
d="M5.984 6.378c.58 1.208 1.37 2.34 2.372 3.341a12.17 12.17 0 0 0 3.341 2.372c.104.05.156.075.222.094a.87.87 0 0 0 .718-.122c.056-.04.103-.088.199-.183.29-.291.437-.437.583-.532a1.667 1.667 0 0 1 1.817 0c.146.095.292.24.584.532l.162.162c.443.443.664.665.785.903a1.667 1.667 0 0 1 0 1.504c-.12.238-.342.46-.785.902l-.131.131c-.442.442-.662.663-.963.831-.332.187-.85.322-1.231.32-.344 0-.58-.067-1.05-.2a15.866 15.866 0 0 1-6.903-4.062 15.866 15.866 0 0 1-4.061-6.903c-.134-.47-.2-.706-.202-1.05a2.814 2.814 0 0 1 .32-1.232c.17-.3.39-.52.831-.962l.132-.131c.443-.443.664-.664.902-.785a1.667 1.667 0 0 1 1.504 0c.238.12.46.342.902.785l.163.162c.291.292.437.437.532.584.36.552.36 1.264 0 1.817-.095.146-.24.292-.532.583a1.682 1.682 0 0 0-.183.199.872.872 0 0 0-.122.718c.019.066.044.118.094.222Z" />
|
|
6
|
-
</svg>
|
package/src/assets/send-03.svg
DELETED
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
|
|
2
|
-
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"
|
|
3
|
-
d="M10.5 12H5m-.084.291L2.58 19.267c-.184.548-.275.822-.21.99a.5.5 0 0 0 .332.3c.174.05.438-.07.965-.306l16.711-7.52c.515-.232.772-.348.851-.508a.5.5 0 0 0 0-.444c-.08-.16-.336-.276-.85-.508L3.661 3.748c-.525-.237-.788-.355-.962-.306a.5.5 0 0 0-.332.299c-.066.168.025.442.206.988l2.342 7.057c.032.094.047.14.053.188a.5.5 0 0 1 0 .129c-.006.048-.022.095-.053.188Z" />
|
|
4
|
-
</svg>
|
package/src/assets/share-04.svg
DELETED
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"
|
|
2
|
-
>
|
|
3
|
-
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
|
|
4
|
-
d="M15.5 5.5v-5m0 0h-5m5 0L8.833 7.167m-2.5-5H4.5c-1.4 0-2.1 0-2.635.272A2.5 2.5 0 0 0 .772 3.532C.5 4.066.5 4.767.5 6.167V11.5c0 1.4 0 2.1.272 2.635a2.5 2.5 0 0 0 1.093 1.092C2.4 15.5 3.1 15.5 4.5 15.5h5.333c1.4 0 2.1 0 2.635-.273a2.5 2.5 0 0 0 1.093-1.092c.272-.535.272-1.235.272-2.635V9.667" />
|
|
5
|
-
</svg>
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
|
|
2
|
-
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="m4.93 4.93 14.14 14.14M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10Z"/>
|
|
3
|
-
</svg>
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"
|
|
2
|
-
stroke-width="1.5">
|
|
3
|
-
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
|
|
4
|
-
d="m15 9-6 6m0-6 6 6m7-3c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10Z" />
|
|
5
|
-
</svg>
|
package/src/assets/x-close.svg
DELETED
package/src/assets/x.svg
DELETED
|
@@ -1,87 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
MessagingSocket,
|
|
3
|
-
type MessagingSocketOptions,
|
|
4
|
-
type UserCredentials,
|
|
5
|
-
type Message,
|
|
6
|
-
} from '@botpress/messaging-socket'
|
|
7
|
-
import { EventEmitter } from '../Utils'
|
|
8
|
-
|
|
9
|
-
type Events = {
|
|
10
|
-
connect: UserCredentials
|
|
11
|
-
disconnect: undefined
|
|
12
|
-
user: string | undefined
|
|
13
|
-
conversation: string | undefined
|
|
14
|
-
message: Message
|
|
15
|
-
messageSent: string
|
|
16
|
-
startTyping: undefined
|
|
17
|
-
stopTyping: undefined
|
|
18
|
-
}
|
|
19
|
-
export class WebchatClient {
|
|
20
|
-
private socket: MessagingSocket
|
|
21
|
-
public userId: string | undefined
|
|
22
|
-
private conversationId: string | undefined
|
|
23
|
-
private userToken: string | undefined
|
|
24
|
-
private connected = false
|
|
25
|
-
private readonly emitter: EventEmitter<Events>
|
|
26
|
-
public on: EventEmitter<Events>['on']
|
|
27
|
-
|
|
28
|
-
constructor(options: MessagingSocketOptions) {
|
|
29
|
-
this.socket = new MessagingSocket(options)
|
|
30
|
-
this.emitter = new EventEmitter()
|
|
31
|
-
|
|
32
|
-
this.on = this.emitter.on.bind(this.emitter)
|
|
33
|
-
|
|
34
|
-
this.socket.on('connect', (event) => {
|
|
35
|
-
this.emitter.emit('connect', event)
|
|
36
|
-
})
|
|
37
|
-
|
|
38
|
-
this.socket.on('disconnect', (event) => {
|
|
39
|
-
this.emitter.emit('disconnect', event)
|
|
40
|
-
})
|
|
41
|
-
|
|
42
|
-
this.socket.on('message', (message) => {
|
|
43
|
-
this.emitter.emit('message', message)
|
|
44
|
-
})
|
|
45
|
-
|
|
46
|
-
this.socket.on('conversation', (conversation) => {
|
|
47
|
-
this.emitter.emit('conversation', conversation)
|
|
48
|
-
})
|
|
49
|
-
this.socket.on('user', (user) => {
|
|
50
|
-
this.emitter.emit('user', user)
|
|
51
|
-
})
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
public async connect(creds?: UserCredentials) {
|
|
55
|
-
if (this.connected) {
|
|
56
|
-
return
|
|
57
|
-
}
|
|
58
|
-
this.connected = true
|
|
59
|
-
const user = await this.socket.connect(creds).catch((err) => {
|
|
60
|
-
this.connected = false
|
|
61
|
-
throw err
|
|
62
|
-
})
|
|
63
|
-
this.userId = user.userId
|
|
64
|
-
this.userToken = user.userToken
|
|
65
|
-
|
|
66
|
-
return user
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
public async disconnect() {
|
|
70
|
-
await this.socket.disconnect()
|
|
71
|
-
this.connected = false
|
|
72
|
-
}
|
|
73
|
-
|
|
74
|
-
public async sendMessage(message: string) {
|
|
75
|
-
if (!this.conversationId) {
|
|
76
|
-
await this.newConversation()
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
-
await this.socket.sendText(message)
|
|
80
|
-
this.emitter.emit('messageSent', message)
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
public async newConversation() {
|
|
84
|
-
const { id } = await this.socket.createConversation()
|
|
85
|
-
this.conversationId = id
|
|
86
|
-
}
|
|
87
|
-
}
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { z } from 'zod'
|
|
2
|
-
import { AudioBlock } from '../../types'
|
|
3
|
-
|
|
4
|
-
export const AudioSchema = z
|
|
5
|
-
.object({
|
|
6
|
-
type: z.literal('audio'),
|
|
7
|
-
audio: z.string(),
|
|
8
|
-
title: z.string().optional(),
|
|
9
|
-
})
|
|
10
|
-
.transform<AudioBlock>(({ type, audio }) => ({ type, url: audio }))
|
|
@@ -1,104 +0,0 @@
|
|
|
1
|
-
import { z } from 'zod'
|
|
2
|
-
import { ButtonBlock, ColumnBlock, ImageBlock, TextBlock } from '../../types'
|
|
3
|
-
import { WithBubble, withBubble } from './Utils'
|
|
4
|
-
|
|
5
|
-
const ActionSaySomethingSchema = z
|
|
6
|
-
.object({
|
|
7
|
-
title: z.string(),
|
|
8
|
-
action: z.literal('Say something'),
|
|
9
|
-
text: z.string(),
|
|
10
|
-
})
|
|
11
|
-
.transform<ButtonBlock>(({ title, text }) => ({
|
|
12
|
-
type: 'button',
|
|
13
|
-
variant: 'action',
|
|
14
|
-
text: title,
|
|
15
|
-
buttonValue: text,
|
|
16
|
-
reusable: true,
|
|
17
|
-
}))
|
|
18
|
-
|
|
19
|
-
const ActionOpenURLSchema = z
|
|
20
|
-
.object({
|
|
21
|
-
title: z.string(),
|
|
22
|
-
action: z.literal('Open URL'),
|
|
23
|
-
url: z.string(),
|
|
24
|
-
})
|
|
25
|
-
.transform<ButtonBlock>(({ title, url }) => ({
|
|
26
|
-
type: 'button',
|
|
27
|
-
variant: 'link',
|
|
28
|
-
text: title,
|
|
29
|
-
buttonValue: url,
|
|
30
|
-
reusable: true,
|
|
31
|
-
}))
|
|
32
|
-
|
|
33
|
-
const ActionPostbackSchema = z
|
|
34
|
-
.object({
|
|
35
|
-
title: z.string(),
|
|
36
|
-
action: z.literal('Postback'),
|
|
37
|
-
payload: z.string(),
|
|
38
|
-
})
|
|
39
|
-
.transform<ButtonBlock>(({ title, payload }) => ({
|
|
40
|
-
type: 'button',
|
|
41
|
-
variant: 'action',
|
|
42
|
-
text: title,
|
|
43
|
-
buttonValue: payload,
|
|
44
|
-
reusable: true,
|
|
45
|
-
}))
|
|
46
|
-
|
|
47
|
-
const ActionButtonSchema = z.union([ActionSaySomethingSchema, ActionOpenURLSchema, ActionPostbackSchema])
|
|
48
|
-
|
|
49
|
-
export type CardBlockType = { blocks: CardBlocks } & Omit<ColumnBlock, 'blocks'>
|
|
50
|
-
type CardBlocks = (ImageBlock | TextBlock | { type: 'row'; blocks: ButtonBlock[] })[]
|
|
51
|
-
|
|
52
|
-
export const BaseCardSchema = z.object({
|
|
53
|
-
type: z.literal('card'),
|
|
54
|
-
title: z.string().optional(),
|
|
55
|
-
subtitle: z.string().optional(),
|
|
56
|
-
image: z.string().optional(),
|
|
57
|
-
actions: z.array(ActionButtonSchema),
|
|
58
|
-
})
|
|
59
|
-
|
|
60
|
-
export const CardSchemaTransform = ({
|
|
61
|
-
title,
|
|
62
|
-
image,
|
|
63
|
-
actions,
|
|
64
|
-
subtitle,
|
|
65
|
-
}: Omit<z.infer<typeof BaseCardSchema>, 'type'>): CardBlockType => {
|
|
66
|
-
const cardBlocks: CardBlocks = []
|
|
67
|
-
|
|
68
|
-
if (image) {
|
|
69
|
-
cardBlocks.push({
|
|
70
|
-
type: 'image',
|
|
71
|
-
url: image,
|
|
72
|
-
})
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
if (title) {
|
|
76
|
-
cardBlocks.push({
|
|
77
|
-
type: 'text',
|
|
78
|
-
text: `## ${title}`,
|
|
79
|
-
})
|
|
80
|
-
}
|
|
81
|
-
if (subtitle) {
|
|
82
|
-
cardBlocks.push({
|
|
83
|
-
type: 'text',
|
|
84
|
-
text: subtitle,
|
|
85
|
-
})
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
if (actions.length > 0) {
|
|
89
|
-
cardBlocks.push({
|
|
90
|
-
type: 'row',
|
|
91
|
-
blocks: actions,
|
|
92
|
-
})
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
return {
|
|
96
|
-
type: 'column',
|
|
97
|
-
horizontalAlignment: 'center',
|
|
98
|
-
blocks: [...cardBlocks],
|
|
99
|
-
}
|
|
100
|
-
}
|
|
101
|
-
|
|
102
|
-
export const CardSchema = BaseCardSchema.transform<WithBubble<CardBlockType>>((card) =>
|
|
103
|
-
withBubble(CardSchemaTransform(card))
|
|
104
|
-
)
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { z } from 'zod'
|
|
2
|
-
import { BaseCardSchema, CardBlockType, CardSchemaTransform } from './Card'
|
|
3
|
-
import { CarouselBlock } from '../../types'
|
|
4
|
-
|
|
5
|
-
type CarouselBlockType = { blocks: CardBlockType[] } & Omit<CarouselBlock, 'blocks'>
|
|
6
|
-
export const CarouselSchema = z
|
|
7
|
-
.object({
|
|
8
|
-
type: z.literal('carousel'),
|
|
9
|
-
items: z.array(BaseCardSchema.omit({ type: true }).transform<CardBlockType>(CardSchemaTransform)),
|
|
10
|
-
})
|
|
11
|
-
.transform<CarouselBlockType>(({ items }) => ({ type: 'carousel', blocks: items }))
|
|
@@ -1,48 +0,0 @@
|
|
|
1
|
-
import { z } from 'zod'
|
|
2
|
-
import { v4 } from 'uuid'
|
|
3
|
-
import { ButtonBlock, ColumnBlock, RowBlock, TextBlock } from '../../types'
|
|
4
|
-
import { WithBubble, withBubble } from './Utils'
|
|
5
|
-
|
|
6
|
-
//TODO: Fix choice title that will not show up
|
|
7
|
-
type ButtonBlocks = { blocks: ButtonBlock[] } & Omit<RowBlock, 'blocks'>
|
|
8
|
-
|
|
9
|
-
type ChoiceBlockType = { blocks: (ButtonBlocks | TextBlock)[] } & Omit<ColumnBlock, 'blocks'>
|
|
10
|
-
export const ChoiceSchema = z
|
|
11
|
-
.object({
|
|
12
|
-
type: z.literal('single-choice'),
|
|
13
|
-
text: z.string(),
|
|
14
|
-
choices: z.array(
|
|
15
|
-
z.object({
|
|
16
|
-
title: z.string(),
|
|
17
|
-
value: z.string(),
|
|
18
|
-
})
|
|
19
|
-
),
|
|
20
|
-
})
|
|
21
|
-
.transform<WithBubble<ChoiceBlockType>>(({ choices, text }) => {
|
|
22
|
-
const groupId = v4()
|
|
23
|
-
|
|
24
|
-
const blocks: (ButtonBlocks | TextBlock)[] = [
|
|
25
|
-
{
|
|
26
|
-
type: 'row',
|
|
27
|
-
blocks: choices.map(({ title, value }) => ({
|
|
28
|
-
type: 'button',
|
|
29
|
-
variant: 'action',
|
|
30
|
-
text: title,
|
|
31
|
-
buttonValue: value,
|
|
32
|
-
groupId,
|
|
33
|
-
})),
|
|
34
|
-
},
|
|
35
|
-
]
|
|
36
|
-
|
|
37
|
-
if (text) {
|
|
38
|
-
blocks.unshift({
|
|
39
|
-
type: 'text',
|
|
40
|
-
text,
|
|
41
|
-
})
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
return withBubble({
|
|
45
|
-
type: 'column',
|
|
46
|
-
blocks,
|
|
47
|
-
})
|
|
48
|
-
})
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
import { z } from 'zod'
|
|
2
|
-
import { v4 } from 'uuid'
|
|
3
|
-
import { ButtonBlock, ColumnBlock, DropdownBlock, RowBlock, TextBlock } from '../../types'
|
|
4
|
-
import { WithBubble, withBubble } from './Utils'
|
|
5
|
-
|
|
6
|
-
type DropdownBlockType = { blocks: (DropdownBlock | TextBlock)[] } & Omit<ColumnBlock, 'blocks'>
|
|
7
|
-
export const DropdownSchema = z
|
|
8
|
-
.object({
|
|
9
|
-
type: z.literal('dropdown'),
|
|
10
|
-
text: z.string().optional(),
|
|
11
|
-
message: z.string().optional(),
|
|
12
|
-
options: z.array(
|
|
13
|
-
z.object({
|
|
14
|
-
label: z.string(),
|
|
15
|
-
value: z.string(),
|
|
16
|
-
})
|
|
17
|
-
),
|
|
18
|
-
})
|
|
19
|
-
.transform<WithBubble<DropdownBlockType>>(({ options, text }) => {
|
|
20
|
-
const blocks: (DropdownBlock | TextBlock)[] = [
|
|
21
|
-
{
|
|
22
|
-
type: 'dropdown',
|
|
23
|
-
label: text ?? 'Select an option',
|
|
24
|
-
options,
|
|
25
|
-
},
|
|
26
|
-
]
|
|
27
|
-
|
|
28
|
-
if (text) {
|
|
29
|
-
blocks.unshift({
|
|
30
|
-
type: 'text',
|
|
31
|
-
text,
|
|
32
|
-
})
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
return withBubble({
|
|
36
|
-
type: 'column',
|
|
37
|
-
blocks,
|
|
38
|
-
})
|
|
39
|
-
})
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { z } from 'zod'
|
|
2
|
-
import { FileBlock } from '../../types'
|
|
3
|
-
|
|
4
|
-
export const FileSchema = z
|
|
5
|
-
.object({
|
|
6
|
-
type: z.literal('file'),
|
|
7
|
-
file: z.string(),
|
|
8
|
-
title: z.string().optional(),
|
|
9
|
-
})
|
|
10
|
-
.transform<FileBlock>(({ file, ...props }) => ({ url: file, ...props }))
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { z } from 'zod'
|
|
2
|
-
import { ImageBlock } from '../../types'
|
|
3
|
-
|
|
4
|
-
export const ImageSchema = z
|
|
5
|
-
.object({
|
|
6
|
-
type: z.literal('image'),
|
|
7
|
-
image: z.string(),
|
|
8
|
-
title: z.string().optional(),
|
|
9
|
-
})
|
|
10
|
-
.transform<ImageBlock>(({ type, image }) => ({ type, url: image }))
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import { z } from 'zod'
|
|
2
|
-
import { LocationBlock } from '../../types'
|
|
3
|
-
|
|
4
|
-
//TODO: Decide what to do with title and address and fix ui when they are empty
|
|
5
|
-
export const LocationSchema = z
|
|
6
|
-
.object({
|
|
7
|
-
type: z.literal('location'),
|
|
8
|
-
latitude: z.number(),
|
|
9
|
-
longitude: z.number(),
|
|
10
|
-
address: z.string().optional(),
|
|
11
|
-
title: z.string().optional(),
|
|
12
|
-
})
|
|
13
|
-
.transform<LocationBlock>(({ type, latitude, longitude, title, address }) => ({
|
|
14
|
-
type,
|
|
15
|
-
latitude,
|
|
16
|
-
longitude,
|
|
17
|
-
title: title ?? address ?? 'View on map',
|
|
18
|
-
}))
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import { z } from 'zod'
|
|
2
|
-
import { TextSchema } from './Text'
|
|
3
|
-
import { ImageSchema } from './Image'
|
|
4
|
-
import { AudioSchema } from './Audio'
|
|
5
|
-
import { VideoSchema } from './Video'
|
|
6
|
-
import { CarouselSchema } from './Carousel'
|
|
7
|
-
import { CardSchema } from './Card'
|
|
8
|
-
import { LocationSchema } from './Location'
|
|
9
|
-
import { FileSchema } from './File'
|
|
10
|
-
import { ChoiceSchema } from './Choice'
|
|
11
|
-
import { VoiceSchema } from './Voice'
|
|
12
|
-
import { DropdownSchema } from './Dropdown.ts'
|
|
13
|
-
|
|
14
|
-
export const MessageContentSchema = z.union([
|
|
15
|
-
TextSchema,
|
|
16
|
-
ImageSchema,
|
|
17
|
-
AudioSchema,
|
|
18
|
-
VideoSchema,
|
|
19
|
-
CarouselSchema,
|
|
20
|
-
CardSchema,
|
|
21
|
-
LocationSchema,
|
|
22
|
-
FileSchema,
|
|
23
|
-
VoiceSchema,
|
|
24
|
-
ChoiceSchema,
|
|
25
|
-
DropdownSchema,
|
|
26
|
-
])
|