{"version":3,"sources":["webpack:///./src/components/help/helpArticle/styled.js","webpack:///./src/components/help/helpArticle/index.js","webpack:///./src/components/help/searchbar/autocomplete.js","webpack:///./src/components/help/searchbar/customhighlight.js","webpack:///./src/img/ui/arrow_black.svg","webpack:///./src/components/ui/startUsing/index.js","webpack:///./src/components/help/searchbar/CustomHits.js","webpack:///./src/components/help/searchbar/SearchBar.js","webpack:///./src/components/help/searchbox/styled.js","webpack:///./src/components/help/searchbox/index.js"],"names":["Title","styled","h1","media","tablet","SubTitle","h3","StyledH4","h4","Article","section","mobile","StyledLink","Related","div","HeaderSection","CustomLi","li","HelpArticle","Content","renderRelatedList","related","props","length","list","map","el","key","link","href","title","description","className","render","this","metaTitle","metaDescription","titleOverride","canonical","nav","src","arrow","alt","toLowerCase","replace","React","Component","StyledA","a","StyledBox","StyledLabel","label","StyledInput","input","StyledDivInput","AutoComplete","state","value","currentRefinement","focused","onChange","_","newValue","onSuggestionCleared","setState","onBlur","prevState","onFocus","checkHits","hits","isHitsLoaded","renderInputComponent","inputProps","htmlFor","ref","role","aria-label","disabled","onSuggestionsFetchRequested","refine","onSuggestionsClearRequested","getSuggestionValue","hit","frontmatter","renderSuggestion","target","rel","attribute","tagName","onSuggestionSelected","placeholder","suggestions","connectAutoComplete","StyledP","p","CustomHighlight","connectHighlight","parsedHit","highlight","highlightProperty","part","idx","isHighlighted","module","exports","StartUsingLS","deleteMarginTop","setMarginTop","useSourceParams","useState","email","setEmail","style","onSubmit","e","preventDefault","navigate","id","type","name","required","as","secondary","defaultProps","StyledUl","ul","CustomHits","connectHits","index","StyledContainer","VirtalSearchBox","connectSearchBox","searchClient","algoliasearch","Hit","Highlight","SearchBar","query","suggestion","window","location","InstantSearch","indexName","process","Configure","hitsPerPage","defaultRefinement","hitComponent","FindAnswer","desktop","SearchBox","onClick","Intercom","openChat"],"mappings":"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","file":"8ccceac4a338bf6b46e7eae47f92b7a2f27e6cec-79105df17c41f86b38c4.js","sourcesContent":["import styled from 'styled-components';\nimport { media } from 'theme/breakpoints';\nimport { StyledLink } from 'components/ui/link';\n\nexport const Title = styled.h1`\n  margin: 0 0 3rem;\n  ${media.tablet} {\n    margin: 0 0 24px;\n  }\n`;\n\nexport const SubTitle = styled.h3`\n  font-size: 24px;\n  margin-bottom: 24px;\n  font-weight: 800;\n`;\n\nexport const StyledH4 = styled.h4`\n  font-size: 20px;\n  margin-bottom: 16px;\n  font-weight: 800;\n`;\n\nexport const Article = styled.section`\n  padding: 0;\n  margin: 0 auto 24px;\n  & .article-content {\n    padding-left: 0;\n    & ul,\n    ol {\n      padding: 0 0 0 20px;\n    }\n    & .gatsby-image-wrapper {\n      margin-bottom: 32px;\n    }\n    & table {\n      margin: 0 0 48px;\n      width: 100%;\n      & thead {\n        border-bottom: 1px solid #e4e5e8;\n        tr {\n          td {\n            padding: 24px 15px;\n            font-size: 16px;\n            font-weight: 800;\n            ${media.mobile} {\n              padding: 12px 8px;\n            }\n          }\n        }\n      }\n      tbody {\n        tr {\n          td {\n            padding: 20px 16px 20px 15px;\n            font-size: 16px;\n            ${media.mobile} {\n              padding: 20px 16px 20px 8px;\n            }\n          }\n        }\n      }\n    }\n  }\n  ${StyledLink} {\n    display: inline;\n  }\n  ${media.tablet} {\n    margin: 132px auto 24px;\n    & .article-content {\n      padding-left: 15px;\n    }\n  }\n  ${media.mobile} {\n    ${StyledLink} {\n      font-size: 18px;\n    }\n  }\n`;\n\nexport const Related = styled.div`\n  padding: 120px 0 0;\n  border-top: 1px solid #eaebec;\n  margin-top: 5rem;\n  ${media.tablet} {\n    padding: 80px 0 0;\n    margin-top: 4rem;\n  }\n  h4 {\n    font-size: 32px;\n    font-weight: 800;\n    margin-bottom: 0;\n    ${media.tablet} {\n      font-size: 24px;\n      line-height: 42px;\n    }\n  }\n  ul {\n    padding: 0;\n  }\n`;\n\nexport const HeaderSection = styled.section`\n  width: 100%;\n  padding: 0;\n  margin: 144px 0 56px;\n  max-width: 1200px;\n  transform: translateX(5px);\n  ${media.tablet} {\n    display: none;\n  }\n  .breadcrumbs {\n    grid-area: breadcrumbs;\n    display: flex;\n    align-items: center;\n    & img {\n      margin: 0 16px;\n      ${media.mobile} {\n        max-width: 8px;\n      }\n    }\n    & p {\n      margin: 0;\n      color: #000;\n      font-size: 14px;\n      line-height: 24px;\n      ${media.mobile} {\n        line-height: normal;\n      }\n      & a {\n        color: #000;\n        font-size: 14px;\n        line-height: 24px;\n        ${media.mobile} {\n          font-size: 12px;\n          line-height: 24px;\n        }\n      }\n    }\n  }\n`;\n\nexport const CustomLi = styled.li`\n  list-style: none;\n  padding: 48px 0;\n  border-bottom: 1px solid #e4e5e8;\n  ${media.tablet} {\n    padding: 24px 0;\n  }\n  a {\n    font-weight: 900;\n    font-size: 20px;\n    ${media.tablet} {\n      font-size: 18px;\n      line-height: 28px;\n    }\n  }\n  p {\n    font-weight: 500;\n    margin: 16px 0 0;\n    ${media.tablet} {\n      font-size: 14px;\n      line-height: 26px;\n    }\n  }\n  &:last-child {\n    border-bottom: none;\n  }\n`;\n","/* eslint-disable react/prop-types */\nimport React from 'react';\nimport map from 'lodash/map';\nimport Link from 'components/ui/link';\nimport Layout from 'layout';\nimport StartUsingLS from 'components/ui/startUsing';\nimport arrow from 'img/ui/arrow_black.svg';\nimport * as Styled from './styled';\nimport { SubTitle } from './styled';\nimport SearchBox from '../searchbox';\n\nconst HelpArticle = (Content) =>\n  class extends React.Component {\n    renderRelatedList = () => {\n      const { related } = this.props;\n      if (!related || related.length === 0) return false;\n\n      const list = map(related, (el) => (\n        <Styled.CustomLi key={el.link}>\n          <Link href={el.link}>{el.title}</Link>\n          {el.description && <p>{el.description}</p>}\n        </Styled.CustomLi>\n      ));\n      return (\n        <Styled.Related>\n          <h4>Related topics</h4>\n          <ul className=\"col-lg-7\">{list}</ul>\n        </Styled.Related>\n      );\n    };\n\n    render() {\n      const {\n        metaTitle,\n        metaDescription,\n        titleOverride,\n        canonical,\n        section,\n        nav,\n        title,\n      } = this.props;\n      return (\n        <Layout\n          metaTitle={metaTitle}\n          metaDescription={metaDescription}\n          titleOverride={titleOverride}\n          canonical={canonical}\n        >\n          <Styled.Article className=\"help-article\">\n            <div className=\"container\">\n              <div className=\"row\">\n                <Styled.HeaderSection>\n                  <div className=\"breadcrumbs\">\n                    <p>\n                      <Link href=\"/help/\">Help</Link>\n                    </p>\n                    <img src={arrow} alt=\"arrow\" title=\"Arrow\" />\n                    <p>\n                      <Link href={`/help/${section.toLowerCase().replace(' ', '-')}/`}>\n                        {nav || section}\n                      </Link>\n                    </p>\n                    <img src={arrow} alt=\"arrow\" title=\"Arrow\" />\n                    <p>\n                      <strong>{title}</strong>\n                    </p>\n                  </div>\n                </Styled.HeaderSection>\n              </div>\n              <div className=\"row justify-content-between\">\n                <div className=\"col-lg-8 article-content\">\n                  <Styled.Title>{title}</Styled.Title>\n                  <Content {...this.props} />\n                </div>\n                <SearchBox />\n              </div>\n              <div className=\"row\">\n                <div className=\"col\">{this.renderRelatedList()}</div>\n              </div>\n            </div>\n          </Styled.Article>\n          <StartUsingLS />\n        </Layout>\n      );\n    }\n  };\n\nexport { HelpArticle, SubTitle };\n\nexport default HelpArticle;\n","import React, { Component } from 'react';\nimport PropTypes from 'prop-types';\nimport { connectAutoComplete } from 'react-instantsearch-dom';\nimport AutoSuggest from 'react-autosuggest';\nimport styled from 'styled-components';\nimport { media } from 'theme/breakpoints';\nimport CustomHighlight from './customhighlight';\n\nexport const StyledA = styled.a`\n  width: 100%;\n  display: block;\n  &:hover {\n    cursor: pointer;\n    text-decoration: none;\n  }\n`;\n\nconst StyledBox = styled.div`\n  display: flex;\n  min-height: 110px;\n  padding: 24px 32px;\n  flex-direction: column;\n  justify-content: center;\n  border-bottom: 1px solid #e4e5e8;\n  background-color: #fff;\n  ${media.tablet} {\n    padding: 16px;\n  }\n  &:hover {\n    background-color: #f6f8f9;\n  }\n  li {\n    list-style: none;\n  }\n  p:nth-child(1) {\n    margin-bottom: 0;\n    font-size: 16px;\n    text-align: left;\n    ${media.tablet} {\n      font-size: 14px;\n      line-height: 20px;\n      width: 100%;\n    }\n    span {\n      font-size: 16px;\n      font-weight: 900;\n      color: #0a4ed6;\n      ${media.tablet} {\n        font-size: 14px;\n      }\n    }\n    mark {\n      ${media.tablet} {\n        font-size: 14px;\n      }\n    }\n  }\n  p:nth-child(2) {\n    font-weight: 600;\n    color: #000;\n    margin-top: 8px;\n    margin-bottom: 0;\n    font-size: 14px;\n    text-align: left;\n    ${media.tablet} {\n      font-size: 12px;\n      line-height: 18px;\n      width: 100%;\n    }\n    span {\n      ${media.tablet} {\n        font-size: 12px;\n      }\n    }\n    mark {\n      font-weight: 600;\n      font-size: inherit;\n      ${media.tablet} {\n        font-size: 12px;\n      }\n    }\n  }\n`;\n\nconst StyledLabel = styled.label`\n  color: #a9a9a9;\n  margin: 0;\n  font-family: 'searchicon' !important;\n  &::before {\n    content: '\\\\e900';\n    color: #000;\n    position: absolute;\n    padding: 16px;\n    transform: translateY(-32px);\n    line-height: 100%;\n  }\n`;\n\nconst StyledInput = styled.input`\n  padding: 0;\n  background-color: transparent;\n  border: none;\n  outline: none;\n  width: 100%;\n  height: 100%;\n  padding-left: 48px;\n  border: 1px solid #000;\n  border-radius: 4px;\n  font-size: 16px;\n  -webkit-appearance: none;\n  &:focus {\n    border: 1px solid #0a4ed6;\n  }\n  &::placeholder {\n    color: #999;\n    font-size: 16px;\n  }\n`;\n\nexport const StyledDivInput = styled.div`\n  width: 488px;\n  height: 44px;\n  border-radius: 4px;\n  text-align: center;\n  position: relative;\n  margin: 0 auto;\n  background-color: #fff;\n  &:focus-within {\n    ${StyledLabel} {\n      &::before {\n        color: #0a4ed6;\n      }\n    }\n  }\n  @media (max-width: 766px) {\n    width: 95%;\n  }\n`;\n\nclass AutoComplete extends Component {\n  state = {\n    // eslint-disable-next-line react/destructuring-assignment\n    value: this.props.currentRefinement,\n    focused: false,\n  };\n\n  onChange = (_, { newValue }) => {\n    const { onSuggestionCleared } = this.props;\n    if (!newValue) {\n      onSuggestionCleared();\n    }\n\n    this.setState({\n      value: newValue,\n    });\n  };\n\n  onBlur = () => {\n    this.setState((prevState) => ({\n      focused: !prevState.focused,\n    }));\n  };\n\n  onFocus = () => {\n    this.setState((prevState) => ({\n      focused: !prevState.focused,\n    }));\n  };\n\n  // eslint-disable-next-line consistent-return\n  checkHits = () => {\n    const { hits } = this.props;\n    const { value } = this.state;\n    let isHitsLoaded = null;\n    if (hits.length === 0) {\n      isHitsLoaded = true;\n      if (value) {\n        isHitsLoaded = false;\n        return isHitsLoaded;\n      }\n      return isHitsLoaded;\n    }\n    if (hits.length !== 0) {\n      isHitsLoaded = false;\n      return isHitsLoaded;\n    }\n  };\n\n  renderInputComponent = (inputProps) => {\n    // const { hits } = this.props;\n    const { focused } = this.state;\n    return (\n      <StyledDivInput className=\"styledInput\">\n        <StyledLabel htmlFor=\"search\" focused={focused} />\n        <StyledInput\n          {...inputProps}\n          // eslint-disable-next-line no-return-assign\n          ref={(ref) => (this.input = ref)}\n          role=\"combobox\"\n          aria-label=\"searchbar\"\n          disabled={this.checkHits()}\n        />\n      </StyledDivInput>\n    );\n  };\n\n  onSuggestionsFetchRequested = ({ value }) => {\n    const { refine } = this.props;\n    refine(value);\n  };\n\n  onSuggestionsClearRequested = () => {\n    const { refine } = this.props;\n    refine();\n  };\n\n  getSuggestionValue = (hit) => {\n    return hit.frontmatter.metaTitle;\n  };\n\n  renderSuggestion = (hit) => {\n    return (\n      <StyledA\n        href={hit.frontmatter.canonical}\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n        className=\"articlepreview\"\n      >\n        <StyledBox className=\"styledbox\">\n          <CustomHighlight hit={hit} attribute=\"frontmatter.metaTitle\" tagName=\"mark\" />\n          <CustomHighlight hit={hit} attribute=\"frontmatter.metaDescription\" tagName=\"mark\" />\n        </StyledBox>\n      </StyledA>\n    );\n  };\n\n  render() {\n    const { hits, onSuggestionSelected } = this.props;\n    const { value } = this.state;\n\n    const inputProps = {\n      placeholder: 'Search...',\n      onChange: this.onChange,\n      onBlur: this.onBlur,\n      onFocus: this.onFocus,\n      value,\n      focused: false,\n    };\n    return (\n      hits && (\n        <AutoSuggest\n          suggestions={hits}\n          onSuggestionsFetchRequested={this.onSuggestionsFetchRequested}\n          onSuggestionsClearRequested={this.onSuggestionsClearRequested}\n          onSuggestionSelected={onSuggestionSelected}\n          getSuggestionValue={this.getSuggestionValue}\n          renderSuggestion={this.renderSuggestion}\n          inputProps={inputProps}\n          renderInputComponent={this.renderInputComponent}\n        />\n      )\n    );\n  }\n}\n\nexport default connectAutoComplete(AutoComplete);\n\nAutoComplete.propTypes = {\n  hits: PropTypes.arrayOf(PropTypes.object).isRequired,\n  currentRefinement: PropTypes.string.isRequired,\n  refine: PropTypes.func.isRequired,\n  onSuggestionSelected: PropTypes.func.isRequired,\n  onSuggestionCleared: PropTypes.func.isRequired,\n};\n","/* eslint-disable react/no-array-index-key */\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport { connectHighlight } from 'react-instantsearch-dom';\nimport styled from 'styled-components';\n\nconst StyledP = styled.p`\n  mark {\n    font-size: initial;\n    font-weight: 900;\n    color: #000;\n    background-color: #ffe478;\n    padding: 0;\n  }\n  span {\n    font-size: 14px;\n    margin: 0;\n  }\n`;\n\nconst Highlight = ({ highlight, attribute, hit }) => {\n  const parsedHit = highlight({\n    highlightProperty: '_highlightResult',\n    attribute,\n    hit,\n  });\n  return (\n    <StyledP>\n      {parsedHit.map((part, idx) =>\n        part.isHighlighted ? (\n          <mark key={idx}>{part.value}</mark>\n        ) : (\n          <span key={idx}>{part.value}</span>\n        ),\n      )}\n    </StyledP>\n  );\n};\nconst CustomHighlight = connectHighlight(Highlight);\nexport default CustomHighlight;\n\nHighlight.propTypes = {\n  highlight: PropTypes.func.isRequired,\n  attribute: PropTypes.string.isRequired,\n  hit: PropTypes.oneOfType([PropTypes.object]).isRequired,\n};\n","module.exports = \"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSIxMiIgdmlld0JveD0iMCAwIDEyIDEyIj48ZGVmcz48c3R5bGU+LmF7ZmlsbDojMDAwMDAwO308L3N0eWxlPjwvZGVmcz48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtODUgLTg1KSI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoODUgODUpIj48cGF0aCBjbGFzcz0iYSIgZD0iTTg1LDkxLjc1aDkuMTEybC00LjIsNC4yTDkxLDk3bDYtNi02LTYtMS4wNSwxLjA1LDQuMTYyLDQuMkg4NVoiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC04NSAtODUpIi8+PC9nPjwvZz48L3N2Zz4=\"","import React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { useSourceParams } from 'hooks/useSourceParams';\nimport { navigate } from 'gatsby';\nimport * as Styled from './styled';\n\nconst StartUsingLS = ({ deleteMarginTop, setMarginTop }) => {\n  const { link } = useSourceParams('start-using');\n  const [email, setEmail] = useState('');\n\n  const handleSubmit = (e) => {\n    e.preventDefault();\n    navigate(`${link}&email=${email}`);\n  };\n  return (\n    <Styled.StartUsing\n      className=\"container\"\n      deleteMarginTop={deleteMarginTop}\n      style={{ setMarginTop }}\n    >\n      <h2>\n        Start using LiveSession for free <span>now.</span>\n      </h2>\n      <div className=\"start\">\n        <Styled.ExtendSignUpForm onSubmit={handleSubmit}>\n          <label htmlFor=\"email-form-start-using\" className=\"sign-up-free\">\n            <input\n              id=\"email-form-start-using\"\n              type=\"email\"\n              name=\"email\"\n              placeholder=\"Your business email\"\n              required\n              value={email}\n              onChange={(e) => setEmail(e.target.value)}\n              className=\"input-email\"\n            />\n          </label>\n          <Styled.CustomButton as=\"button\" type=\"submit\" secondary>\n            Sign up free\n          </Styled.CustomButton>\n        </Styled.ExtendSignUpForm>\n        <div className=\"checkmarks\">\n          <p>Free 14-day trial</p>\n          <p>\n            No credit card <span>required</span>\n          </p>\n          <p>Easy setup</p>\n        </div>\n      </div>\n    </Styled.StartUsing>\n  );\n};\n\nexport default StartUsingLS;\n\nStartUsingLS.propTypes = {\n  deleteMarginTop: PropTypes.bool,\n  // eslint-disable-next-line react/forbid-prop-types\n  setMarginTop: PropTypes.oneOfType([PropTypes.object, PropTypes.bool]),\n};\n\nStartUsingLS.defaultProps = {\n  deleteMarginTop: false,\n  setMarginTop: false,\n};\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { connectHits } from 'react-instantsearch-dom';\nimport styled from 'styled-components';\nimport CustomHighlight from './customhighlight';\n\nconst StyledUl = styled.ul`\n  margin: 0;\n  padding: 0;\n`;\n\nconst StyledA = styled.a`\n  width: 100%;\n\n  &:hover {\n    cursor: pointer;\n    text-decoration: none;\n  }\n`;\n\nconst StyledBox = styled.li`\n  display: flex;\n  min-height: 110px;\n  align-items: center;\n  padding: 24px 32px;\n  display: flex;\n  flex-direction: column;\n  border-bottom: 1px solid #e4e5e8;\n  background-color: #fff;\n  &:hover {\n    background-color: #f6f8f9;\n  }\n  p:nth-child(1) {\n    span {\n      font-size: 16px;\n      font-weight: 800;\n      color: #0a4ed6;\n    }\n  }\n  p:nth-child(2) {\n    font-weight: 400;\n    color: #000;\n    margin-top: 8px;\n    mark {\n      font-weight: 400;\n    }\n  }\n`;\n\nconst Hits = ({ hits }) => (\n  <StyledUl>\n    {hits.map((hit, index) => (\n      <StyledA\n        href={hit.frontmatter.canonical}\n        className=\"articlepreview\"\n        // eslint-disable-next-line react/no-array-index-key\n        key={index}\n      >\n        <StyledBox>\n          <CustomHighlight hit={hit} attribute=\"frontmatter.metaTitle\" />\n          <CustomHighlight hit={hit} attribute=\"frontmatter.metaDescription\" />\n        </StyledBox>\n      </StyledA>\n    ))}\n  </StyledUl>\n);\n\nconst CustomHits = connectHits(Hits);\n\nexport default CustomHits;\n\nHits.propTypes = {\n  hits: PropTypes.arrayOf(PropTypes.object).isRequired,\n};\n","import React, { Component } from 'react';\nimport { media } from 'theme/breakpoints';\nimport PropTypes from 'prop-types';\nimport algoliasearch from 'algoliasearch/lite';\nimport { InstantSearch, Configure, Highlight, connectSearchBox } from 'react-instantsearch-dom';\nimport styled from 'styled-components';\nimport Autocomplete from './autocomplete';\nimport CustomHits from './CustomHits';\n\nconst StyledContainer = styled.div`\n  position: relative;\n  z-index: 20;\n  .react-autosuggest__suggestions-container--open {\n    max-height: 363px;\n    overflow-y: auto;\n    width: 488px;\n    box-shadow: 0px 0px 20px #00000029;\n    border-radius: 4px;\n    position: absolute;\n    top: 0;\n    right: 50%;\n    transform: translate(50%, 52px);\n    z-index: 15;\n  }\n  ${media.tablet} {\n    .react-autosuggest__suggestions-container--open {\n      width: 100%;\n    }\n  }\n  .react-autosuggest__suggestion {\n    list-style: none;\n    display: list-item;\n  }\n  .react-autosuggest__suggestions-list {\n    padding: 0;\n    margin: 0;\n  }\n\n  .react-autosuggest__suggestion--highlighted .styledbox {\n    background-color: #f6f8f9;\n  }\n`;\n\nconst VirtalSearchBox = connectSearchBox(() => null);\n\nconst index = process.env.GATSBY_ALGOLIA_HELPCENTER;\n\nconst searchClient = algoliasearch('G5L9QWEP2F', 'bf1653634fbcabb418d2f166f607c083');\n\nconst Hit = ({ hit }) => {\n  return (\n    <div>\n      <Highlight attribute=\"name\" hit={hit} />\n    </div>\n  );\n};\n\nHit.propTypes = {\n  // eslint-disable-next-line react/forbid-prop-types\n  hit: PropTypes.object.isRequired,\n};\n\nclass SearchBar extends Component {\n  state = {\n    query: '',\n  };\n\n  onSuggestionSelected = (_, { suggestion }) => {\n    window.location.href = suggestion.frontmatter.canonical;\n    this.setState({\n      query: suggestion.name,\n    });\n  };\n\n  onSuggestionCleared = () => {\n    this.setState({\n      query: '',\n    });\n  };\n\n  render() {\n    const { query } = this.state;\n    return (\n      <StyledContainer>\n        <InstantSearch indexName={index} searchClient={searchClient}>\n          <Configure hitsPerPage={5} />\n          <Autocomplete\n            onSuggestionSelected={this.onSuggestionSelected}\n            onSuggestionCleared={this.onSuggestionCleared}\n          />\n        </InstantSearch>\n\n        <InstantSearch indexName={index} searchClient={searchClient}>\n          <VirtalSearchBox defaultRefinement={query} />\n          {query && <CustomHits hitComponent={Hit} />}\n        </InstantSearch>\n      </StyledContainer>\n    );\n  }\n}\n\nexport default SearchBar;\n","import styled from 'styled-components';\nimport { media } from 'theme/breakpoints';\nimport { StyledDivInput, StyledA } from 'components/help/searchbar/autocomplete';\n\nexport const FindAnswer = styled.div`\n  max-width: 380px;\n  z-index: 10;\n  height: fit-content;\n  background-color: #f1f5f9;\n  padding: 40px;\n  display: flex;\n  flex-direction: column;\n  position: sticky;\n  top: 120px;\n  ${media.desktop} {\n    max-width: 100%;\n    margin-top: 32px;\n  }\n  h2 {\n    font-weight: 900;\n    font-size: 20px;\n    line-height: 44px;\n    margin-bottom: 0;\n    ${media.tablet} {\n      font-size: 18px;\n    }\n  }\n  p {\n    margin-top: 16px;\n    margin-bottom: 24px;\n    font-size: 16px;\n    font-weight: 500;\n    ${media.tablet} {\n      font-size: 14px;\n    }\n  }\n  a {\n    margin-top: 98px;\n    color: #0a4ed6;\n    font-weight: 800;\n    font-size: 20px;\n    ${media.tablet} {\n      margin-top: 64px;\n      font-size: 18px;\n    }\n  }\n  a + a {\n    margin-top: 24px;\n  }\n\n  & ${StyledDivInput} {\n    width: auto;\n    margin: 0;\n  }\n  & ${StyledA} {\n    margin-top: 0;\n    div {\n      p:nth-child(1) {\n        margin-top: 0;\n      }\n    }\n  }\n  & .react-autosuggest__suggestions-container--open {\n    right: 0 !important;\n    transform: translate(0, 52px) !important;\n    ${media.desktop} {\n      width: 100% !important;\n    }\n  }\n  ${media.tablet} {\n    margin: 58px 15px 15px;\n    padding: 30px;\n    height: auto;\n  }\n`;\n","import React from 'react';\nimport * as Styled from './styled';\nimport SearchBar from '../searchbar/SearchBar';\n\nconst SearchBox = () => {\n  const openChat = (e) => {\n    e.preventDefault();\n    /*eslint-disable */\n    Intercom('show');\n    /* eslint-enable */\n  };\n\n  return (\n    <Styled.FindAnswer className=\"col-lg-4\">\n      <h2>Didn’t find an answer?</h2>\n      <p>Try using the search engine or just contact us</p>\n      <SearchBar />\n      <a href=\"mailto:hello@livesession.io?subject=Question\">hello@livesession.io</a>\n      <a href=\"/#\" onClick={(e) => openChat(e)}>\n        Chat with us\n      </a>\n    </Styled.FindAnswer>\n  );\n};\n\nexport default SearchBox;\n"],"sourceRoot":""}