beem-component 1.8.2 → 1.8.3

package/src/lib/components/examples/App.js

@@ -1,11 +1,11 @@
-import React from "react";
-import { AttachFile } from "@material-ui/icons";
-import EmojiEmotionsIcon from "@material-ui/icons/EmojiEmotions";
-import QuickreplyIcon from "@mui/icons-material/Quickreply";
-import SendIcon from "@mui/icons-material/Send";
-import { BmChat, BmIcons, BmInput } from "./lib/components";
-import "../src/lib/assets/css/sidebar.scss";
-import image from "../src/lib/assets/chart-img.png";
+import React from 'react';
+import { AttachFile } from '@material-ui/icons';
+import EmojiEmotionsIcon from '@material-ui/icons/EmojiEmotions';
+import QuickreplyIcon from '@mui/icons-material/Quickreply';
+import SendIcon from '@mui/icons-material/Send';
+import { BmChat, BmIcons, BmInput } from './lib/components';
+import '../src/lib/assets/css/sidebar.scss';
+import image from '../src/lib/assets/chart-img.png';
 
 const Chat = () => {
   return (
@@ -19,7 +19,7 @@ const Chat = () => {
           src={image}
           fileName={<p>attachment.jpg</p>}
         />
-         <BmChat.Details
+        <BmChat.Details
           state="outbound"
           session="bot"
           displayTime={<p>12:00pm</p>}
@@ -27,19 +27,24 @@ const Chat = () => {
           // src={image}
           // fileName={<p>attachment.jpg</p>}
         >
-          <p>Technical No Signal - Ili kupata chaneli au chaneli zifunguke kwa wakati ukilipia kifurushi, hakikisha kwanza kama unapata signal vizuri kutoka kwenye dish kwa kutumia remote control.
-Bonyeza MENU, Bonyeza OK kwenye SEARCH, Bonyeza OK kwenye TP LIST.
-Angalia asilimia ya QUALITY pale chini.
-Angalia Transponder zote, 001, 002, 003 na 004 zinatakiwa ziwe na QUALITY si pungufu ya asilimia 60%.
-Au kama una aina nyingine ya kisimbuzi;
-Bonyeza MENU, Bonyeza OK kwenye SETTINGS, Bonyeza OK kwenye INSTALLATION, Bonyeza OK kwenye AUTOMATIC SEARCH.
-Shuka kwenye frequency na uangalie frequency zote kuanzia 11044, 10981, 11106 na 10971.
-Au
-Bonyeza MENU, Bonyeza OK kwenye SETTINGS, Bonyeza OK kwenye INSTALLATION, kwenye EUTELSAT 7C bonyeza kitufe cha KIJANI.
-Angalia QUALITY kwenye frequency zote kuanzia 11044, 10981, 11106 na 10971.
-Angalia asilimia ya QUALITY pale chini.
-QUALITY inatakiwa isiwe pungufu ya asilimia 60%.
-Je, kwako inasoma ngapi? Kama ipo chini ya 60%, wasiliana na aliyekufungia dish arekebishe.</p>
+          <p>
+            Technical No Signal - Ili kupata chaneli au chaneli zifunguke kwa
+            wakati ukilipia kifurushi, hakikisha kwanza kama unapata signal
+            vizuri kutoka kwenye dish kwa kutumia remote control. Bonyeza MENU,
+            Bonyeza OK kwenye SEARCH, Bonyeza OK kwenye TP LIST. Angalia
+            asilimia ya QUALITY pale chini. Angalia Transponder zote, 001, 002,
+            003 na 004 zinatakiwa ziwe na QUALITY si pungufu ya asilimia 60%. Au
+            kama una aina nyingine ya kisimbuzi; Bonyeza MENU, Bonyeza OK kwenye
+            SETTINGS, Bonyeza OK kwenye INSTALLATION, Bonyeza OK kwenye
+            AUTOMATIC SEARCH. Shuka kwenye frequency na uangalie frequency zote
+            kuanzia 11044, 10981, 11106 na 10971. Au Bonyeza MENU, Bonyeza OK
+            kwenye SETTINGS, Bonyeza OK kwenye INSTALLATION, kwenye EUTELSAT 7C
+            bonyeza kitufe cha KIJANI. Angalia QUALITY kwenye frequency zote
+            kuanzia 11044, 10981, 11106 na 10971. Angalia asilimia ya QUALITY
+            pale chini. QUALITY inatakiwa isiwe pungufu ya asilimia 60%. Je,
+            kwako inasoma ngapi? Kama ipo chini ya 60%, wasiliana na
+            aliyekufungia dish arekebishe.
+          </p>
         </BmChat.Details>
         <BmChat.Details
           state="inbound"
@@ -49,19 +54,24 @@ Je, kwako inasoma ngapi? Kama ipo chini ya 60%, wasiliana na aliyekufungia dish
           // src={image}
           // fileName={<p>attachment.jpg</p>}
         >
-          <p>Technical No Signal - Ili kupata chaneli au chaneli zifunguke kwa wakati ukilipia kifurushi, hakikisha kwanza kama unapata signal vizuri kutoka kwenye dish kwa kutumia remote control.
-Bonyeza MENU, Bonyeza OK kwenye SEARCH, Bonyeza OK kwenye TP LIST.
-Angalia asilimia ya QUALITY pale chini.
-Angalia Transponder zote, 001, 002, 003 na 004 zinatakiwa ziwe na QUALITY si pungufu ya asilimia 60%.
-Au kama una aina nyingine ya kisimbuzi;
-Bonyeza MENU, Bonyeza OK kwenye SETTINGS, Bonyeza OK kwenye INSTALLATION, Bonyeza OK kwenye AUTOMATIC SEARCH.
-Shuka kwenye frequency na uangalie frequency zote kuanzia 11044, 10981, 11106 na 10971.
-Au
-Bonyeza MENU, Bonyeza OK kwenye SETTINGS, Bonyeza OK kwenye INSTALLATION, kwenye EUTELSAT 7C bonyeza kitufe cha KIJANI.
-Angalia QUALITY kwenye frequency zote kuanzia 11044, 10981, 11106 na 10971.
-Angalia asilimia ya QUALITY pale chini.
-QUALITY inatakiwa isiwe pungufu ya asilimia 60%.
-Je, kwako inasoma ngapi? Kama ipo chini ya 60%, wasiliana na aliyekufungia dish arekebishe.</p>
+          <p>
+            Technical No Signal - Ili kupata chaneli au chaneli zifunguke kwa
+            wakati ukilipia kifurushi, hakikisha kwanza kama unapata signal
+            vizuri kutoka kwenye dish kwa kutumia remote control. Bonyeza MENU,
+            Bonyeza OK kwenye SEARCH, Bonyeza OK kwenye TP LIST. Angalia
+            asilimia ya QUALITY pale chini. Angalia Transponder zote, 001, 002,
+            003 na 004 zinatakiwa ziwe na QUALITY si pungufu ya asilimia 60%. Au
+            kama una aina nyingine ya kisimbuzi; Bonyeza MENU, Bonyeza OK kwenye
+            SETTINGS, Bonyeza OK kwenye INSTALLATION, Bonyeza OK kwenye
+            AUTOMATIC SEARCH. Shuka kwenye frequency na uangalie frequency zote
+            kuanzia 11044, 10981, 11106 na 10971. Au Bonyeza MENU, Bonyeza OK
+            kwenye SETTINGS, Bonyeza OK kwenye INSTALLATION, kwenye EUTELSAT 7C
+            bonyeza kitufe cha KIJANI. Angalia QUALITY kwenye frequency zote
+            kuanzia 11044, 10981, 11106 na 10971. Angalia asilimia ya QUALITY
+            pale chini. QUALITY inatakiwa isiwe pungufu ya asilimia 60%. Je,
+            kwako inasoma ngapi? Kama ipo chini ya 60%, wasiliana na
+            aliyekufungia dish arekebishe.
+          </p>
         </BmChat.Details>
         <BmChat.Details
           state="outbound"
@@ -96,7 +106,7 @@ Je, kwako inasoma ngapi? Kama ipo chini ya 60%, wasiliana na aliyekufungia dish
           status="failed"
         >
           <p>Outbound</p>
-        </BmChat.Details>{" "}
+        </BmChat.Details>{' '}
         <BmChat.Details
           state="outbound"
           session="live"
@@ -112,7 +122,7 @@ Je, kwako inasoma ngapi? Kama ipo chini ya 60%, wasiliana na aliyekufungia dish
             kwa mteja) 6. Change language 0. Au ungependa kutuuliza swali
             lingine?
           </p>
-        </BmChat.Details>{" "}
+        </BmChat.Details>{' '}
         <BmChat.Details
           state="outbound"
           session="live"
@@ -120,7 +130,7 @@ Je, kwako inasoma ngapi? Kama ipo chini ya 60%, wasiliana na aliyekufungia dish
           status="failed"
         >
           <p>Outbound</p>
-        </BmChat.Details>{" "}
+        </BmChat.Details>{' '}
         <BmChat.Details
           state="outbound"
           session="live"
@@ -128,7 +138,7 @@ Je, kwako inasoma ngapi? Kama ipo chini ya 60%, wasiliana na aliyekufungia dish
           status="failed"
         >
           <p>Outbound</p>
-        </BmChat.Details>{" "}
+        </BmChat.Details>{' '}
         <BmChat.Details
           state="outbound"
           session="live"
@@ -136,7 +146,7 @@ Je, kwako inasoma ngapi? Kama ipo chini ya 60%, wasiliana na aliyekufungia dish
           status="failed"
         >
           <p>Outbound</p>
-        </BmChat.Details>{" "}
+        </BmChat.Details>{' '}
         <BmChat.Details
           state="outbound"
           session="live"
@@ -144,7 +154,7 @@ Je, kwako inasoma ngapi? Kama ipo chini ya 60%, wasiliana na aliyekufungia dish
           status="failed"
         >
           <p>Outbound</p>
-        </BmChat.Details>{" "}
+        </BmChat.Details>{' '}
         <BmChat.Details
           state="outbound"
           session="live"
@@ -152,7 +162,7 @@ Je, kwako inasoma ngapi? Kama ipo chini ya 60%, wasiliana na aliyekufungia dish
           status="failed"
         >
           <p>Outbound</p>
-        </BmChat.Details>{" "}
+        </BmChat.Details>{' '}
         <BmChat.Details
           state="outbound"
           session="live"
@@ -162,7 +172,7 @@ Je, kwako inasoma ngapi? Kama ipo chini ya 60%, wasiliana na aliyekufungia dish
           <p>Outbound</p>
         </BmChat.Details>
       </BmChat.Body>
-      <BmChat.Footer style={{ justifyContent: "flex-start" }}>
+      <BmChat.Footer style={{ justifyContent: 'flex-start' }}>
         <div class="chat-footer">
           <BmIcons icon={<EmojiEmotionsIcon />} size="xlarge" />
         </div>

package/src/lib/components/examples/InfoAccordion.js

@@ -1,7 +1,6 @@
-
-import React from "react";
-import { BmAccordion } from "./lib/components";
-import BmForm from "./lib/components/ChatComponents/FormAccordion/FormAccordion";
+import React from 'react';
+import { BmAccordion } from './lib/components';
+import BmForm from './lib/components/ChatComponents/FormAccordion/FormAccordion';
 
 const InfoAccordion = () => {
   return (
@@ -12,7 +11,9 @@ const InfoAccordion = () => {
         </BmAccordion.Title>
         <BmAccordion.Body>
           <BmForm>
-            <BmForm.Label><h4>Hello</h4></BmForm.Label>
+            <BmForm.Label>
+              <h4>Hello</h4>
+            </BmForm.Label>
             <BmForm.Input placeholder="Hello" />
           </BmForm>
         </BmAccordion.Body>

package/src/lib/components/examples/chatBodyExample.js

@@ -1,7 +1,7 @@
-import React, { useState } from "react";
-import { GlobalStyle, BmChat } from "..";
-import "./list.scss";
-import { ScrollbarWrapper } from "../ScrollBar/scrollBar";
+import React, { useState } from 'react';
+import { GlobalStyle, BmChat } from '..';
+import './list.scss';
+import { ScrollbarWrapper } from '../ScrollBar/scrollBar';
 
 const App = () => {
   return (
@@ -62,7 +62,7 @@ const App = () => {
               status="failed"
               fileName={<p>file.csv</p>}
               onDownload={() => {
-                alert("hello");
+                alert('hello');
               }}
             />
           </BmChat.Body>

package/src/lib/components/examples/selectExample.js

@@ -1,14 +1,14 @@
-import React, { useState } from "react";
-import map from "lodash/map";
-import { GlobalStyle, BmModal, BmButton } from "./lib/components";
-import Select from "react-select";
+import React, { useState } from 'react';
+import map from 'lodash/map';
+import Select from 'react-select';
+import { GlobalStyle, BmModal, BmButton } from './lib/components';
 
 const App = () => {
   const [showModal, setShowModal] = useState(false);
 
   const VENDOR_ACCOUNT_STATUSES = {
-    0: "Inactive",
-    1: "Active",
+    0: 'Inactive',
+    1: 'Active',
   };
 
   const VENDOR_ACCOUNT_STATUS_OPTIONS = map(
@@ -16,7 +16,7 @@ const App = () => {
     (type, key) => ({
       value: key,
       label: type,
-    }),
+    })
   );
   return (
     <>

package/src/lib/components/index-copy.js

@@ -1,14 +1,14 @@
-import { BmAvatar } from "./avatars";
-import { BmAlertIcon } from "./buttonAlertIcons";
-import { BmBtnIcon } from "./buttonIconsOnly";
-import { BmButton } from "./buttons";
-import { BmCheckboxToggler } from "./checkboxToggler";
-import { BmDropdown } from "./dropdown";
-import { BmInput } from "./input";
-import { BmLogo } from "./logo";
-import { BmSearch } from "./search";
-import { BmAccordicon } from "./Accordicon";
-import { BmRouteLink } from "./Link";
+import { BmAvatar } from './avatars';
+import { BmAlertIcon } from './buttonAlertIcons';
+import { BmBtnIcon } from './buttonIconsOnly';
+import { BmButton } from './buttons';
+import { BmCheckboxToggler } from './checkboxToggler';
+import { BmDropdown } from './dropdown';
+import { BmInput } from './input';
+import { BmLogo } from './logo';
+import { BmSearch } from './search';
+import { BmAccordicon } from './Accordicon';
+import { BmRouteLink } from './Link';
 
 import {
   BmTab,
@@ -17,8 +17,8 @@ import {
   BmTabText,
   BmLeftTabIcon,
   BmRightTabIcon,
-} from "./tabs";
-import { BmTag } from "./tags";
+} from './tabs';
+import { BmTag } from './tags';
 
 // Navabar
 import {
@@ -29,7 +29,7 @@ import {
   BmNavBarProfile,
   BmNavbarSearch,
   BmNavbarLogo,
-} from "./navbar";
+} from './navbar';
 
 // iconsStyles
 import {
@@ -48,11 +48,11 @@ import {
   BmChatbot,
   BmIcons,
   CopyToClipBoard,
-} from "./iconStyles";
+} from './iconStyles';
 
-import { Loader, BmLoader } from "./loaders";
+import { Loader, BmLoader } from './loaders';
 
-import { GlobalStyle } from "./globalStyles";
+import { GlobalStyle } from './globalStyles';
 
 // Main chat
 import {
@@ -68,14 +68,14 @@ import {
   BmImage,
   BmImageFileName,
   BmImageChat,
-} from "./Chats/chat";
+} from './Chats/chat';
 import {
   BmMessageTab,
   BmMessageTabInput,
   BmSend,
   BmAttachment,
   BmMessage,
-} from "./Chats/chatInput";
+} from './Chats/chatInput';
 
 import {
   Main,
@@ -84,7 +84,7 @@ import {
   MessageIn,
   MessageOut,
   MainWrapper,
-} from "./Chats/chatwrapper";
+} from './Chats/chatwrapper';
 
 // sidebar
 import {
@@ -92,7 +92,7 @@ import {
   BmSideBarSearch,
   BmSideBarBtnIcon,
   BmSideBarTab,
-} from "./sidebar";
+} from './sidebar';
 
 // Sidebar contacts
 import {
@@ -108,7 +108,7 @@ import {
   BmContactTime,
   BmContactSideBar,
   BmUnreadMessage,
-} from "./contacts";
+} from './contacts';
 
 import {
   BmCustomerDetails,
@@ -121,22 +121,22 @@ import {
   BmIcon,
   BmCustomerIcons,
   BmCustomerInfoTab,
-} from "../components/CustomerInfo/customerInfo";
+} from '../components/CustomerInfo/customerInfo';
 
 import {
   BmCustomerBar,
   BmCustomerInfoAccordicon,
-} from "../components/CustomerInfo/customerInfoBar";
+} from '../components/CustomerInfo/customerInfoBar';
 
-import { BmButtonDropDown } from "./dropdownButton";
+import { BmButtonDropDown } from './dropdownButton';
 import {
   BmButtonDropdownItem,
   BmDropDownItem,
   BmDropDownMenu,
   BmCustomizedDropdown,
-} from "./dropdownItems";
+} from './dropdownItems';
 
-import { BmProgressBar } from "../components/progressbar";
+import { BmProgressBar } from '../components/progressbar';
 
 import {
   BmInfoAccordiconMenu,
@@ -149,16 +149,16 @@ import {
   BmInfoContentItem,
   BmInfoContentLabel,
   BmInfoContentValue,
-} from "../components/CustomerInfo/infoAccordion";
+} from '../components/CustomerInfo/infoAccordion';
 import {
   BmChatHeaderWrapper,
   BmChatHeaderText,
   BmChatHeaderTime,
   BmChatHeaderInfoIcon,
   BmChatHeader,
-} from "./chatHeader";
+} from './chatHeader';
 
-import { BmChatInfoWrapper, BmChatMenuWrapper } from "./wrapper";
+import { BmChatInfoWrapper, BmChatMenuWrapper } from './wrapper';
 
 import {
   Overlay,
@@ -170,12 +170,12 @@ import {
   CloseModal,
   ModalHeader,
   Modal,
-} from "./Modals/noteModalHeader";
+} from './Modals/noteModalHeader';
 
-import { ModalBody } from "./Modals/noteModalBody";
-import { ModalFooter, BmFooterButtons } from "./Modals/noteModalFooter";
+import { ModalBody } from './Modals/noteModalBody';
+import { ModalFooter, BmFooterButtons } from './Modals/noteModalFooter';
 
-import { BmReportsButton } from "./Reports/buttons";
+import { BmReportsButton } from './Reports/buttons';
 import {
   BmCard,
   CardTitleWrapper,
@@ -187,22 +187,22 @@ import {
   BmCardFooter,
   BmCardFooterText,
   BmCardDetails,
-} from "./Reports/cards";
+} from './Reports/cards';
 import {
   BmReportsBody,
   BmOverviewCards,
   BmOverviewCharts,
-} from "./Reports/reportsBody";
+} from './Reports/reportsBody';
 import {
   BmReportsTitle,
   BmReportsHeader,
   BmReportsButtons,
-} from "./Reports/title";
+} from './Reports/title';
 import {
   BmReportsInfoHeader,
   CloseNote,
   BmReportsHeaderText,
-} from "./Reports/infoHeader";
+} from './Reports/infoHeader';
 
 import {
   BmChart,
@@ -216,7 +216,7 @@ import {
   BmMainChartWrapper,
   BmMainChartContent,
   BmMainChart,
-} from "./Reports/charts";
+} from './Reports/charts';
 
 import {
   BmAgentSearch,
@@ -230,17 +230,17 @@ import {
   BmPreviousAgent,
   BmPreviousAgentName,
   BmPreviousAgentMessage,
-} from "./Modals/modalBody";
+} from './Modals/modalBody';
 
-import { BmListHeader } from "./Lists/listheader";
-import { BmRowLabel } from "./Lists/rowLabels";
-import { BmContent } from "./SuperFluid/Content/index";
+import { BmListHeader } from './Lists/listheader';
+import { BmRowLabel } from './Lists/rowLabels';
+import { BmContent } from './SuperFluid/Content/index';
 import {
   BmContentFooter,
   BmContentTitle,
   BmFooterLeft,
   BmFooterRight,
-} from "./SuperFluid/ContentTitle.js/index.js";
+} from './SuperFluid/ContentTitle.js/index.js';
 import {
   BmSegmentCard,
   BmSegmentSelector,
@@ -249,23 +249,23 @@ import {
   BmSegmentCompleteContent,
   BmSegmentCompleteIcon,
   BmSegmentCreateContent,
-} from "./SuperFluid/SegmentCard/index";
-import { BmInfoNote } from "./infoNote";
-import { BmCheckbox } from "./checkbox";
+} from './SuperFluid/SegmentCard/index';
+import { BmInfoNote } from './infoNote';
+import { BmCheckbox } from './checkbox';
 import {
   BmAddNote,
   BmNoteInfo,
   BmNote,
   BmNoteFooter,
   BmNoteDetails,
-} from "./CustomerInfo/notesInfo";
+} from './CustomerInfo/notesInfo';
 import {
   BmAddLabel,
   BmLabelInfo,
   BmLabels,
   BmColorLabel,
   BmColorLabelPicker,
-} from "./CustomerInfo/labelsInfo";
+} from './CustomerInfo/labelsInfo';
 
 export {
   BmButton,

package/src/lib/components/index.js

@@ -66,6 +66,7 @@ import {
   BmSegmentCompleteIcon,
   BmSegmentCreateContent,
 } from './SuperFluid/SegmentCard/index';
+import BmButtonGroup from './ButtonGroup/buttonGroup';
 
 export {
   BmAccordion,
@@ -84,6 +85,7 @@ export {
   BmCheckboxToggle,
   BmPaymentBox,
   BmJumbotron,
+  BmButtonGroup,
   // Fix height and if there is dropdown option inside the modal body
   BmModal,
   BmNoteBar,

package/src/lib/components/logo.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import styled from "styled-components";
+import styled from 'styled-components';
 
 export const Logo = styled.img`
   height: 45;
   width: 9.857rem;
-  ${"" /* border: 0.071rem solid #33B1BA; */}
+  ${'' /* border: 0.071rem solid #33B1BA; */}
   box-sizing: border-box;
 `;
 

package/src/lib/components/navbar.js

@@ -1,7 +1,7 @@
 // import React from 'react';
-import styled from "styled-components";
-import { BmPrimaryWhite } from "./colors";
-import { BmSearch } from "./search";
+import styled from 'styled-components';
+import { BmPrimaryWhite } from './colors';
+import { BmSearch } from './search';
 
 // Old with NavbarContent Main wrapper for navbar
 export const BmNavbar = styled.div`
@@ -9,7 +9,7 @@ export const BmNavbar = styled.div`
     box-shadow:  0rem 0.286rem 0.214rem rgba(0, 0, 0, 0.25);
     padding: 0rem 2.5rem !important;
     flex-wrap: wrap;
-    ${"" /* width: 100vw; */}
+    ${'' /* width: 100vw; */}
   }
 `;
 
@@ -42,7 +42,7 @@ export const OldBmNavbar = styled(GlobalNavbarWrapper)`
 // Navbar Profile Icon Wrapper
 export const BmNavBarProfile = styled(GlobalNavbarWrapper)`
   @media (max-width: 768px) {
-   display: none !important;
+    display: none !important;
   }
 `;
 

package/src/lib/components/search.js

@@ -1,13 +1,13 @@
 import React from 'react';
-import styled from "styled-components";
+import styled from 'styled-components';
 import {
   BmPrimaryWhite,
   BmGrey400,
   BmSecondaryGrey,
   BmPrimaryBlack,
-} from "./colors";
-import { BmDropdown } from "./dropdown";
-import { BmSearchIcon } from "./iconStyles";
+} from './colors';
+import { BmDropdown } from './dropdown';
+import { BmSearchIcon } from './iconStyles';
 
 const BmSearchField = styled.input`
   color: ${BmSecondaryGrey};
@@ -21,7 +21,7 @@ const BmSearchField = styled.input`
     text-decoration: none;
     color: ${BmPrimaryBlack};
   }
-  ${(props) => props.dropdown === "yes" && "margin-right: 1.714rem;"}
+  ${(props) => props.dropdown === 'yes' && 'margin-right: 1.714rem;'}
 `;
 
 const BmSearchWrapper = styled.div`
@@ -32,13 +32,12 @@ const BmSearchWrapper = styled.div`
   border: 0.071rem solid ${BmGrey400};
   box-sizing: border-box;
   border-radius: 0.25rem;
-  ${"" /* height: 2.929rem; */}
+  ${'' /* height: 2.929rem; */}
   padding: ${({ dropdown }) => {
-    if (dropdown === "yes") {
-      return "0rem 0rem 0rem 1.143rem";
-    } else {
-      return "0.786rem 1.143rem";
+    if (dropdown === 'yes') {
+      return '0rem 0rem 0rem 1.143rem';
     }
+    return '0.786rem 1.143rem';
   }};
 `;
 
@@ -58,7 +57,7 @@ export const BmSearch = ({ dropdown, ...rest }) => {
           <SearchIcon size="small" {...rest} />
           <BmSearchField {...rest} dropdown={dropdown} />
         </BmSearchWrapper>
-        {dropdown === "yes" && <BmDropdown />}
+        {dropdown === 'yes' && <BmDropdown />}
       </BmStretch>
     </div>
   );

package/src/lib/components/shadow.js

@@ -1 +1 @@
-export const BmGeneralShadow = "0rem 0.286rem 0.286rem rgba(0, 0, 0, 0.25)";
+export const BmGeneralShadow = '0rem 0.286rem 0.286rem rgba(0, 0, 0, 0.25)';

package/src/lib/components/wrapper.js

@@ -1,4 +1,4 @@
-import styled from "styled-components";
+import styled from 'styled-components';
 
 export const BmChatInfoWrapper = styled.div`
   display: flex;
@@ -13,7 +13,6 @@ export const BmChatInfoWrapper = styled.div`
   height: 100%;
 `;
 
-
 export const BmChatMenuWrapper = styled.div`
   display: flex;
   flex-direction: row;

package/babel.config.js

@@ -1,11 +0,0 @@
-module.exports = function (api) {
-  api.cache(true);
-
-  const presets = ['@babel/preset-env', '@babel/preset-react'];
-  const plugins = ['macros'];
-
-  return {
-    presets,
-    plugins,
-  };
-};