@botpress/webchat 0.5.1 → 1.0.0

package/src/types/block-type.ts

@@ -0,0 +1,150 @@
+import type { Theme } from '../schemas'
+
+export const blockTypes = [
+  'button',
+  'text',
+  'image',
+  'audio',
+  'video',
+  'file',
+  'location',
+  'column',
+  'row',
+  'bubble',
+  'carousel',
+  'dropdown',
+] as const
+
+export const markdownTypes = [
+  'heading1',
+  'heading2',
+  'heading3',
+  'text',
+  'horizontalRule',
+  'link',
+  'italic',
+  'bold',
+  'orderedList',
+  'unorderedList',
+  'listItem',
+  'lineBreak',
+  'pre',
+] as const
+
+export type MarkdownTypes = (typeof markdownTypes)[number]
+
+export type BlockTypes = (typeof blockTypes)[number]
+export type BlockStyles = NonNullable<Theme['message']>['blocks']
+
+export type BlockObject =
+  | DropdownBlock
+  | ButtonBlock
+  | TextBlock
+  | ImageBlock
+  | AudioBlock
+  | VideoBlock
+  | FileBlock
+  | LocationBlock
+  | ColumnBlock
+  | RowBlock
+  | BubbleBlock
+  | CarouselBlock
+
+export type Sender = {
+  name: string
+  avatar?: string
+}
+
+export type MessageObject = {
+  direction: 'incoming' | 'outgoing' | 'system'
+  disableInput?: boolean
+  sender: Sender
+  timestamp: Date
+  block: BlockObject
+}
+
+export type ButtonBlock = {
+  type: 'button'
+  variant: 'action' | 'link'
+  reusable?: boolean
+  groupId?: string
+  text: string
+  buttonValue: string
+}
+
+export type TextBlock = {
+  type: 'text'
+  text: string
+}
+
+export type ImageBlock = {
+  type: 'image'
+  orientation?: 'portrait' | 'landscape' | 'square' | 'auto'
+  url: string
+}
+
+export type AudioBlock = {
+  type: 'audio'
+  url: string
+}
+
+export type VideoBlock = {
+  type: 'video'
+  url: string
+}
+
+export type FileBlock = {
+  type: 'file'
+  url: string
+  title?: string
+}
+
+type DropdownChoice = {
+  label: string
+  value: string
+}
+export type DropdownBlock = {
+  label?: string
+  type: 'dropdown'
+  reusable?: boolean
+  options: DropdownChoice[]
+}
+
+export type LocationBlock = {
+  type: 'location'
+  latitude: number
+  longitude: number
+  title?: string
+}
+
+export type ColumnBlock = {
+  type: 'column'
+  blocks: BlockObject[]
+  horizontalAlignment?: 'left' | 'center' | 'right'
+  verticalAlignment?: 'top' | 'center' | 'bottom' | 'stretch'
+}
+
+export type RowBlock = {
+  type: 'row'
+  blocks: BlockObject[]
+  horizontalAlignment?: 'left' | 'center' | 'right' | 'stretch'
+  verticalAlignment?: 'top' | 'center' | 'bottom'
+}
+
+export type CarouselBlock = {
+  type: 'carousel'
+  blocks: BlockObject[]
+}
+
+export type BubbleBlock = {
+  type: 'bubble'
+  block: BlockObject
+}
+
+export type CommonBlockProps = {
+  styles?: BlockStyles
+}
+
+export type BlockMap<P extends BlockObject = BlockObject> = {
+  [T in P['type']]: Extract<P, { type: T }>
+}

package/src/types/image.ts

@@ -0,0 +1,10 @@
+export type Options = {
+  timeout?: number
+}
+
+export type Dimensions = {
+  width: number
+  height: number
+}
+
+export type UseImageSizeResult = [Dimensions | null, { loading: boolean; error: string | null }]

package/src/types/index.ts

@@ -0,0 +1,2 @@
+export * from './block-type'
+export * from './image'

package/src/vite-env.d.ts

@@ -0,0 +1 @@
+/// <reference types="vite/client" />

package/tsconfig.json

@@ -0,0 +1,30 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "useDefineForClassFields": true,
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "module": "ESNext",
+    "skipLibCheck": true,
+    "esModuleInterop": true,
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "jsx": "react-jsx",
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": false,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+    "forceConsistentCasingInFileNames": false,
+
+    "typeRoots": ["./node_modules/@types"],
+    "outDir": "./dist"
+  },
+  "include": ["src"],
+  "references": [{ "path": "./tsconfig.node.json" }]
+}

package/tsconfig.node.json

@@ -0,0 +1,10 @@
+{
+  "compilerOptions": {
+    "composite": true,
+    "skipLibCheck": true,
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "allowSyntheticDefaultImports": true
+  },
+  "include": ["vite.config.ts"]
+}

package/vite.config.ts

@@ -0,0 +1,31 @@
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react-swc'
+import svgr from 'vite-plugin-svgr'
+import path from 'path'
+import dts from 'vite-plugin-dts'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [react(), svgr({ include: '**/*.svg' }), dts()],
+  build: {
+    lib: {
+      // Could also be a dictionary or array of multiple entry points
+      entry: path.join(__dirname, 'src/index.ts'),
+      name: 'Webchat',
+      // the proper extensions will be added
+      fileName: 'index',
+    },
+    rollupOptions: {
+      // make sure to externalize deps that shouldn't be bundled
+      // into your library
+      external: ['react'],
+      output: {
+        // Provide global variables to use in the UMD build
+        // for externalized deps
+        globals: {
+          react: 'React',
+        },
+      },
+    },
+  },
+})

package/README.md

@@ -1,41 +0,0 @@
-# Webchat
-
-### Sending
-
-| Channels | Webchat | Details |
-| -------- | :-----: | :------ |
-| Text     |   ✅    |         |
-| Image    |   ✅    |         |
-| Choice   |   ✅    |         |
-| Dropdown |   ✅    |         |
-| Card     |   ✅    |         |
-| Carousel |   ✅    |         |
-| File     |   ✅    |         |
-| Audio    |   ✅    |         |
-| Video    |   ✅    |         |
-| Location |   ✅    |         |
-
-### Receiving
-
-| Channels      | Webchat | Details |
-| ------------- | :-----: | :------ |
-| Text          |   ✅    |         |
-| Quick Reply   |   ✅    |         |
-| Postback      |   ✅    |         |
-| Say Something |   ✅    |         |
-| Voice         |   ✅    |         |
-| Image         |   ❌    |         |
-| File          |   ❌    |         |
-| Audio         |   ❌    |         |
-| Video         |   ❌    |         |
-| Location      |   ❌    |         |
-
-## Development
-
-When working on the webchat, to see changes made to the codebase, you will need to follow the steps detailed [here](../inject/README.md). The inject script is the part that links any web page to a webchat. This is the easiest way to manually test the webchat.
-
-## Tests
-
-To run automated E2E tests, simply run the command `yarn test:chat [--browser <chromium | firefox | edge | electron>]` (for the list of supported browsers see: https://docs.cypress.io/guides/guides/launching-browsers#Browsers).
-
-Tests can be found in `tests/e2e` and uses Cypress as the test framework. Configurations for Cypress can be found in the `cypress.json` file at the root of the repository.

package/assets/fonts/roboto.css

@@ -1,128 +0,0 @@
-/* cyrillic-ext */
-@font-face {
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 400;
-  font-display: swap;
-  src: local('Roboto'), local('Roboto-Regular'), url(roboto/roboto.woff2) format('woff2');
-  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
-}
-/* cyrillic */
-@font-face {
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 400;
-  font-display: swap;
-  src: local('Roboto'), local('Roboto-Regular'), url(roboto/roboto.woff2) format('woff2');
-  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
-}
-/* greek-ext */
-@font-face {
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 400;
-  font-display: swap;
-  src: local('Roboto'), local('Roboto-Regular'), url(roboto/roboto.woff2) format('woff2');
-  unicode-range: U+1F00-1FFF;
-}
-/* greek */
-@font-face {
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 400;
-  font-display: swap;
-  src: local('Roboto'), local('Roboto-Regular'), url(roboto/roboto.woff2) format('woff2');
-  unicode-range: U+0370-03FF;
-}
-/* vietnamese */
-@font-face {
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 400;
-  font-display: swap;
-  src: local('Roboto'), local('Roboto-Regular'), url(roboto/roboto.woff2) format('woff2');
-  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
-}
-/* latin-ext */
-@font-face {
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 400;
-  font-display: swap;
-  src: local('Roboto'), local('Roboto-Regular'), url(roboto/roboto.woff2) format('woff2');
-  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 400;
-  font-display: swap;
-  src: local('Roboto'), local('Roboto-Regular'), url(roboto/roboto.woff2) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC,
-    U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-/* cyrillic-ext */
-@font-face {
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 500;
-  font-display: swap;
-  src: local('Roboto Medium'), local('Roboto-Medium'), url(roboto/roboto500.woff2) format('woff2');
-  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
-}
-/* cyrillic */
-@font-face {
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 500;
-  font-display: swap;
-  src: local('Roboto Medium'), local('Roboto-Medium'), url(roboto/roboto500.woff2) format('woff2');
-  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
-}
-/* greek-ext */
-@font-face {
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 500;
-  font-display: swap;
-  src: local('Roboto Medium'), local('Roboto-Medium'), url(roboto/roboto500.woff2) format('woff2');
-  unicode-range: U+1F00-1FFF;
-}
-/* greek */
-@font-face {
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 500;
-  font-display: swap;
-  src: local('Roboto Medium'), local('Roboto-Medium'), url(roboto/roboto500.woff2) format('woff2');
-  unicode-range: U+0370-03FF;
-}
-/* vietnamese */
-@font-face {
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 500;
-  font-display: swap;
-  src: local('Roboto Medium'), local('Roboto-Medium'), url(roboto/roboto500.woff2) format('woff2');
-  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
-}
-/* latin-ext */
-@font-face {
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 500;
-  font-display: swap;
-  src: local('Roboto Medium'), local('Roboto-Medium'), url(roboto/roboto500.woff2) format('woff2');
-  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 500;
-  font-display: swap;
-  src: local('Roboto Medium'), local('Roboto-Medium'), url(roboto/roboto500.woff2) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC,
-    U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}

package/dist/components/Composer.js

@@ -1,118 +0,0 @@
-"use strict";
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const mobx_1 = require("mobx");
-const mobx_react_1 = require("mobx-react");
-const react_1 = __importDefault(require("react"));
-const react_intl_1 = require("react-intl");
-const ToolTip_1 = __importDefault(require("./common/ToolTip"));
-const VoiceRecorder_1 = __importDefault(require("./VoiceRecorder"));
-class Composer extends react_1.default.Component {
-    constructor(props) {
-        super(props);
-        this.focus = () => {
-            setTimeout(() => {
-                var _a;
-                (_a = this.textInput.current) === null || _a === void 0 ? void 0 : _a.focus();
-            }, 50);
-        };
-        this.handleKeyPress = (e) => __awaiter(this, void 0, void 0, function* () {
-            if (e.key === 'Enter') {
-                e.preventDefault();
-                yield this.props.sendMessage();
-            }
-        });
-        this.handleKeyDown = (e) => {
-            if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {
-                this.props.recallHistory(e.key);
-            }
-        };
-        this.handleMessageChanged = (e) => this.props.updateMessage(e.target.value);
-        this.isLastMessageFromBot = () => {
-            var _a, _b, _c, _d;
-            return ((_d = (_c = (_b = (_a = this.props.currentConversation) === null || _a === void 0 ? void 0 : _a.messages) === null || _b === void 0 ? void 0 : _b.slice(-1)) === null || _c === void 0 ? void 0 : _c.pop()) === null || _d === void 0 ? void 0 : _d.authorId) === undefined;
-        };
-        this.onVoiceStart = () => {
-            this.setState({ isRecording: true });
-        };
-        this.onVoiceEnd = (voice, ext) => __awaiter(this, void 0, void 0, function* () {
-            this.setState({ isRecording: false });
-            yield this.props.sendVoiceMessage(voice, ext);
-        });
-        this.onVoiceNotAvailable = () => {
-            console.warn('Voice input is not available on this browser. Please check https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder for compatibility');
-        };
-        this.textInput = react_1.default.createRef();
-        this.state = { isRecording: false };
-    }
-    componentDidMount() {
-        this.focus();
-        (0, mobx_1.observe)(this.props.focusedArea, (focus) => {
-            var _a;
-            focus.newValue === 'input' && ((_a = this.textInput.current) === null || _a === void 0 ? void 0 : _a.focus());
-        });
-    }
-    componentWillReceiveProps(newProps) {
-        // Focus on the composer when it's unlocked
-        if (this.props.composerLocked === true && newProps.composerLocked === false) {
-            this.focus();
-        }
-    }
-    render() {
-        if (this.props.composerHidden) {
-            return null;
-        }
-        const placeholder = this.props.composerPlaceholder ||
-            this.props.intl.formatMessage({
-                id: this.isLastMessageFromBot() ? 'composer.placeholder' : 'composer.placeholderInit'
-            }, { name: this.props.botName });
-        return (react_1.default.createElement("div", { role: "region", className: 'bpw-composer' },
-            react_1.default.createElement("div", { className: 'bpw-composer-inner' },
-                react_1.default.createElement("textarea", { ref: this.textInput, id: "input-message", onFocus: this.props.setFocus.bind(this, 'input'), placeholder: placeholder, onChange: this.handleMessageChanged, value: this.props.message, onKeyPress: this.handleKeyPress, onKeyDown: this.handleKeyDown, "aria-label": this.props.intl.formatMessage({
-                        id: 'composer.message',
-                        defaultMessage: 'Message to send'
-                    }), disabled: this.props.composerLocked }),
-                react_1.default.createElement("label", { htmlFor: "input-message", style: { display: 'none' } }, placeholder),
-                react_1.default.createElement("div", { className: 'bpw-send-buttons' },
-                    this.props.enableVoiceComposer && (react_1.default.createElement(VoiceRecorder_1.default, { onStart: this.onVoiceStart, onDone: this.onVoiceEnd, onNotAvailable: this.onVoiceNotAvailable })),
-                    react_1.default.createElement(ToolTip_1.default, { childId: "btn-send", content: this.props.intl.formatMessage({
-                            id: 'composer.sendMessage',
-                            defaultMessage: 'Send Message'
-                        }) },
-                        react_1.default.createElement("button", { className: 'bpw-send-button', disabled: !this.props.message.length || this.props.composerLocked || this.state.isRecording, onClick: this.props.sendMessage.bind(this, undefined), "aria-label": this.props.intl.formatMessage({
-                                id: 'composer.send',
-                                defaultMessage: 'Send'
-                            }), id: "btn-send" },
-                            react_1.default.createElement(react_intl_1.FormattedMessage, { id: 'composer.send' })))))));
-    }
-}
-exports.default = (0, mobx_react_1.inject)(({ store }) => ({
-    enableVoiceComposer: store.config.enableVoiceComposer,
-    message: store.composer.message,
-    composerLocked: store.composer.locked,
-    composerHidden: store.composer.hidden,
-    composerPlaceholder: store.composer.composerPlaceholder,
-    updateMessage: store.composer.updateMessage,
-    recallHistory: store.composer.recallHistory,
-    intl: store.intl,
-    sendMessage: store.sendMessage,
-    sendVoiceMessage: store.sendVoiceMessage,
-    botName: store.botName,
-    setFocus: store.view.setFocus,
-    focusedArea: store.view.focusedArea,
-    focusPrevious: store.view.focusPrevious,
-    focusNext: store.view.focusNext,
-    currentConversation: store.currentConversation,
-    preferredLanguage: store.preferredLanguage
-}))((0, react_intl_1.injectIntl)((0, mobx_react_1.observer)(Composer)));

package/dist/components/Container.js

@@ -1,62 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const messaging_components_1 = require("@botpress/messaging-components");
-const classnames_1 = __importDefault(require("classnames"));
-const mobx_react_1 = require("mobx-react");
-const react_1 = __importDefault(require("react"));
-const react_intl_1 = require("react-intl");
-const BotInfo_1 = __importDefault(require("./common/BotInfo"));
-const Composer_1 = __importDefault(require("./Composer"));
-const ConversationList_1 = __importDefault(require("./ConversationList"));
-const Footer_1 = __importDefault(require("./Footer"));
-const Header_1 = __importDefault(require("./Header"));
-const MessageList_1 = __importDefault(require("./messages/MessageList"));
-class Container extends react_1.default.Component {
-    renderBody() {
-        if (!this.props.isInitialized) {
-            return (react_1.default.createElement("div", { className: "bpw-msg-list-container bpw-msg-list-container-loading" },
-                react_1.default.createElement("div", { className: "bpw-msg-list-loading" })));
-        }
-        if (this.props.isConversationsDisplayed) {
-            return react_1.default.createElement(ConversationList_1.default, null);
-        }
-        else if (this.props.isBotInfoDisplayed) {
-            return react_1.default.createElement(BotInfo_1.default, null);
-        }
-        else {
-            return (react_1.default.createElement("div", { className: (0, classnames_1.default)('bpw-msg-list-container', {
-                    'bpw-rtl': this.props.rtl
-                }) },
-                react_1.default.createElement(MessageList_1.default, null),
-                react_1.default.createElement(messaging_components_1.Keyboard, null,
-                    react_1.default.createElement(Composer_1.default, null))));
-        }
-    }
-    render() {
-        const classNames = (0, classnames_1.default)('bpw-layout', 'bpw-chat-container', {
-            'bpw-layout-fullscreen': this.props.isFullscreen && 'fullscreen',
-            [`bpw-anim-${this.props.sideTransition}`]: true
-        });
-        return (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement("div", { className: classNames, style: { width: this.props.dimensions.layout } },
-                react_1.default.createElement(Header_1.default, null),
-                this.renderBody(),
-                this.props.isPoweredByDisplayed && react_1.default.createElement(Footer_1.default, null))));
-    }
-}
-exports.default = (0, mobx_react_1.inject)(({ store }) => ({
-    store,
-    isConversationsDisplayed: store.view.isConversationsDisplayed,
-    isBotInfoDisplayed: store.view.isBotInfoDisplayed,
-    isFullscreen: store.view.isFullscreen,
-    sideTransition: store.view.sideTransition,
-    dimensions: store.view.dimensions,
-    isInitialized: store.isInitialized,
-    isPoweredByDisplayed: store.view.isPoweredByDisplayed,
-    config: store.config,
-    botName: store.botName,
-    rtl: store.rtl
-}))((0, react_intl_1.injectIntl)((0, mobx_react_1.observer)(Container)));

package/dist/components/ConversationList.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-import { WrappedComponentProps } from 'react-intl';
-import { StoreDef } from '../store';
-declare const _default: React.ForwardRefExoticComponent<import("react-intl").Omit<ConversationListProps, "intl"> & {
-    forwardedRef?: React.Ref<any> | undefined;
-} & React.RefAttributes<any>> & {
-    WrappedComponent: React.ComponentType<ConversationListProps>;
-} & import("mobx-react").IWrappedComponent<unknown>;
-export default _default;
-declare type ConversationListProps = WrappedComponentProps & Pick<StoreDef, 'conversations' | 'fetchConversation' | 'createConversation'>;

package/dist/components/ConversationList.js

@@ -1,41 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const intl_utils_1 = require("@formatjs/intl-utils");
-const mobx_react_1 = require("mobx-react");
-const react_1 = __importDefault(require("react"));
-const react_intl_1 = require("react-intl");
-const Add_1 = __importDefault(require("../icons/Add"));
-const ConversationListItem = (0, react_intl_1.injectIntl)(({ conversation, onClick, intl }) => {
-    var _a, _b, _c;
-    const title = intl.formatMessage({ id: 'conversationList.title' }, { id: conversation.id });
-    const { value, unit } = (0, intl_utils_1.selectUnit)(new Date(((_a = conversation.lastMessage) === null || _a === void 0 ? void 0 : _a.sentOn) || conversation.createdOn));
-    const date = intl.formatRelativeTime(value, unit);
-    const message = ((_c = (_b = conversation.lastMessage) === null || _b === void 0 ? void 0 : _b.payload) === null || _c === void 0 ? void 0 : _c.text) || '...';
-    return (react_1.default.createElement("div", { className: 'bpw-convo-item', onClick: onClick },
-        react_1.default.createElement("div", { className: 'bpw-align-right' },
-            react_1.default.createElement("div", { className: 'bpw-title' },
-                react_1.default.createElement("div", null, title),
-                react_1.default.createElement("div", { className: 'bpw-date' },
-                    react_1.default.createElement("span", null, date))),
-            react_1.default.createElement("div", { className: 'bpw-convo-preview' }, message))));
-});
-class ConversationList extends react_1.default.Component {
-    componentDidMount() {
-        this.main.focus();
-    }
-    render() {
-        const { conversations, createConversation, fetchConversation } = this.props;
-        return (react_1.default.createElement("div", { tabIndex: 0, ref: (el) => (this.main = el), className: 'bpw-convo-list' },
-            conversations.map((conversation, idx) => (react_1.default.createElement(ConversationListItem, { key: conversation.id, conversation: conversation, onClick: fetchConversation.bind(this, conversation.id) }))),
-            react_1.default.createElement("button", { id: "btn-convo-add", className: 'bpw-convo-add-btn', onClick: createConversation.bind(this, undefined) },
-                react_1.default.createElement(Add_1.default, { width: 15, height: 15 }))));
-    }
-}
-exports.default = (0, mobx_react_1.inject)(({ store }) => ({
-    conversations: store.conversations,
-    createConversation: store.createConversation,
-    fetchConversation: store.fetchConversation
-}))((0, react_intl_1.injectIntl)((0, mobx_react_1.observer)(ConversationList)));

package/dist/components/Footer.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-declare const Footer: () => JSX.Element;
-export default Footer;