@botonic/react 0.23.3 → 0.24.0-alpha.1

package/lib/esm/webchat/message-list.js

@@ -1,34 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useContext } from 'react';
-import Fade from 'react-reveal/Fade';
-import styled from 'styled-components';
-import { ROLES, WEBCHAT } from '../constants';
-import { WebchatContext } from '../contexts';
-import { resolveImage } from '../util/environment';
-import { ConditionalWrapper } from '../util/react';
-import { StyledScrollbar } from './components/styled-scrollbar';
-const StyledMessages = styled.div `
-  display: flex;
-  overflow-x: hidden;
-  flex-direction: column;
-  flex: none;
-  white-space: pre;
-  word-wrap: break-word;
-`;
-const DefaultIntroImage = styled.img `
-  max-height: 50%;
-  width: 100%;
-`;
-export const WebchatMessageList = props => {
-    const { webchatState, getThemeProperty } = useContext(WebchatContext);
-    const animationsEnabled = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.enableAnimations, true);
-    const CustomIntro = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.customIntro);
-    const introImage = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.introImage);
-    const introStyle = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.introStyle);
-    const scrollbarOptions = Object.assign({ enable: true, autoHide: true }, getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.scrollbar));
-    const DefaultIntro = introImage && (_jsx(DefaultIntroImage, { style: Object.assign({}, introStyle), src: resolveImage(introImage) }));
-    return (_jsxs(StyledScrollbar, Object.assign({ role: ROLES.MESSAGE_LIST, 
-        // TODO: Distinguis between multiple instances of webchat, e.g. `${uniqueId}-botonic-scrollable`
-        id: 'botonic-scrollable-content', scrollbar: scrollbarOptions, autoHide: scrollbarOptions.autoHide, ismessagescontainer: 'true', style: Object.assign({}, props.style) }, { children: [(CustomIntro || DefaultIntro) && (_jsx(ConditionalWrapper, Object.assign({ condition: animationsEnabled, wrapper: children => _jsx(Fade, { children: children }) }, { children: CustomIntro ? _jsx(CustomIntro, {}) : DefaultIntro }))), webchatState.messagesComponents.map((e, i) => (_jsx(StyledMessages, Object.assign({ role: ROLES.MESSAGE }, { children: e }), i))), props.children] })));
-};
-//# sourceMappingURL=message-list.js.map

package/lib/esm/webchat/message-list.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"message-list.js","sourceRoot":"src/","sources":["webchat/message-list.jsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,IAAI,MAAM,mBAAmB,CAAA;AACpC,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AAC7C,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAC5C,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAA;AAClD,OAAO,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAA;AAClD,OAAO,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAA;AAE/D,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;CAOhC,CAAA;AAED,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAA;;;CAGnC,CAAA;AAED,MAAM,CAAC,MAAM,kBAAkB,GAAG,KAAK,CAAC,EAAE;IACxC,MAAM,EAAE,YAAY,EAAE,gBAAgB,EAAE,GAAG,UAAU,CAAC,cAAc,CAAC,CAAA;IACrE,MAAM,iBAAiB,GAAG,gBAAgB,CACxC,OAAO,CAAC,iBAAiB,CAAC,gBAAgB,EAC1C,IAAI,CACL,CAAA;IACD,MAAM,WAAW,GAAG,gBAAgB,CAAC,OAAO,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAA;IAC3E,MAAM,UAAU,GAAG,gBAAgB,CAAC,OAAO,CAAC,iBAAiB,CAAC,UAAU,CAAC,CAAA;IACzE,MAAM,UAAU,GAAG,gBAAgB,CAAC,OAAO,CAAC,iBAAiB,CAAC,UAAU,CAAC,CAAA;IAEzE,MAAM,gBAAgB,iBACjB,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,EAChC,gBAAgB,CAAC,OAAO,CAAC,iBAAiB,CAAC,SAAS,CAAC,CACzD,CAAA;IAED,MAAM,YAAY,GAAG,UAAU,IAAI,CACjC,KAAC,iBAAiB,IAChB,KAAK,oBACA,UAAU,GAEf,GAAG,EAAE,YAAY,CAAC,UAAU,CAAC,GAC7B,CACH,CAAA;IAED,OAAO,CACL,MAAC,eAAe,kBACd,IAAI,EAAE,KAAK,CAAC,YAAY;QACxB,gGAAgG;QAChG,EAAE,EAAC,4BAA4B,EAC/B,SAAS,EAAE,gBAAgB,EAC3B,QAAQ,EAAE,gBAAgB,CAAC,QAAQ,EACnC,mBAAmB,EAAC,MAAM,EAC1B,KAAK,oBACA,KAAK,CAAC,KAAK,kBAGf,CAAC,WAAW,IAAI,YAAY,CAAC,IAAI,CAChC,KAAC,kBAAkB,kBACjB,SAAS,EAAE,iBAAiB,EAC5B,OAAO,EAAE,QAAQ,CAAC,EAAE,CAAC,KAAC,IAAI,cAAE,QAAQ,GAAQ,gBAE3C,WAAW,CAAC,CAAC,CAAC,KAAC,WAAW,KAAG,CAAC,CAAC,CAAC,YAAY,IAC1B,CACtB,EACA,YAAY,CAAC,kBAAkB,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAC7C,KAAC,cAAc,kBAAC,IAAI,EAAE,KAAK,CAAC,OAAO,gBAChC,CAAC,KADsC,CAAC,CAE1B,CAClB,CAAC,EACD,KAAK,CAAC,QAAQ,KACC,CACnB,CAAA;AACH,CAAC,CAAA"}

package/src/webchat/message-list.jsx

@@ -1,77 +0,0 @@
-import React, { useContext } from 'react'
-import Fade from 'react-reveal/Fade'
-import styled from 'styled-components'
-
-import { ROLES, WEBCHAT } from '../constants'
-import { WebchatContext } from '../contexts'
-import { resolveImage } from '../util/environment'
-import { ConditionalWrapper } from '../util/react'
-import { StyledScrollbar } from './components/styled-scrollbar'
-
-const StyledMessages = styled.div`
-  display: flex;
-  overflow-x: hidden;
-  flex-direction: column;
-  flex: none;
-  white-space: pre;
-  word-wrap: break-word;
-`
-
-const DefaultIntroImage = styled.img`
-  max-height: 50%;
-  width: 100%;
-`
-
-export const WebchatMessageList = props => {
-  const { webchatState, getThemeProperty } = useContext(WebchatContext)
-  const animationsEnabled = getThemeProperty(
-    WEBCHAT.CUSTOM_PROPERTIES.enableAnimations,
-    true
-  )
-  const CustomIntro = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.customIntro)
-  const introImage = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.introImage)
-  const introStyle = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.introStyle)
-
-  const scrollbarOptions = {
-    ...{ enable: true, autoHide: true },
-    ...getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.scrollbar),
-  }
-
-  const DefaultIntro = introImage && (
-    <DefaultIntroImage
-      style={{
-        ...introStyle,
-      }}
-      src={resolveImage(introImage)}
-    />
-  )
-
-  return (
-    <StyledScrollbar
-      role={ROLES.MESSAGE_LIST}
-      // TODO: Distinguis between multiple instances of webchat, e.g. `${uniqueId}-botonic-scrollable`
-      id='botonic-scrollable-content'
-      scrollbar={scrollbarOptions}
-      autoHide={scrollbarOptions.autoHide}
-      ismessagescontainer='true'
-      style={{
-        ...props.style,
-      }}
-    >
-      {(CustomIntro || DefaultIntro) && (
-        <ConditionalWrapper
-          condition={animationsEnabled}
-          wrapper={children => <Fade>{children}</Fade>}
-        >
-          {CustomIntro ? <CustomIntro /> : DefaultIntro}
-        </ConditionalWrapper>
-      )}
-      {webchatState.messagesComponents.map((e, i) => (
-        <StyledMessages role={ROLES.MESSAGE} key={i}>
-          {e}
-        </StyledMessages>
-      ))}
-      {props.children}
-    </StyledScrollbar>
-  )
-}