beem-component 2.1.14 → 2.1.16

package/dist/components/HorizontalCard/HorizontalCard.js

@@ -47,7 +47,7 @@ const Badge = _styledComponents.default.span.withConfig({
 });
 const Description = _styledComponents.default.p.withConfig({
   displayName: "HorizontalCard__Description"
-})(["margin-top:4px;font-size:0.9rem;color:#6b7280;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;"]);
+})(["margin-top:4px;font-size:0.9rem;color:#6b7280;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;word-break:break-word;"]);
 const MetaRow = _styledComponents.default.div.withConfig({
   displayName: "HorizontalCard__MetaRow"
 })(["display:flex;flex-wrap:wrap;gap:16px;margin-top:12px;"]);
@@ -80,7 +80,10 @@ const BmHorizontalCard = _ref4 => {
     selectedResources,
     address,
     duration,
-    guest_limit
+    guest_limit,
+    deleteToolTip,
+    editToolTip,
+    copyToolTip
   } = _ref4;
   return /*#__PURE__*/_react.default.createElement(RowContainer, {
     isActive: isActive
@@ -105,7 +108,7 @@ const BmHorizontalCard = _ref4 => {
       e.stopPropagation();
       onCopyLink();
     },
-    title: "Copy shareable link"
+    title: copyToolTip || ''
   }, /*#__PURE__*/_react.default.createElement(_Link.default, {
     fontSize: "small"
   })), /*#__PURE__*/_react.default.createElement(IconButton, {
@@ -113,7 +116,7 @@ const BmHorizontalCard = _ref4 => {
       e.stopPropagation();
       onView();
     },
-    title: "Edit appointment type"
+    title: editToolTip || ''
   }, /*#__PURE__*/_react.default.createElement(_Edit.default, {
     fontSize: "small"
   })), /*#__PURE__*/_react.default.createElement(IconButton, {
@@ -123,7 +126,7 @@ const BmHorizontalCard = _ref4 => {
       e.stopPropagation();
       onDelete();
     },
-    title: "Delete appointment type"
+    title: deleteToolTip || ''
   }, /*#__PURE__*/_react.default.createElement(_Delete.default, {
     fontSize: "small"
   }))));

package/dist/components/HorizontalCard/HorizontalCard.stories.js

@@ -34,6 +34,9 @@ const Example = () => /*#__PURE__*/_react.default.createElement(_HorizontalCard.
   selectedResources: sampleResources,
   address: "456 Innovation Avenue, Tech City",
   duration: 60,
-  guest_limit: 10
+  guest_limit: 10,
+  editToolTip: "edit appointment type",
+  deleteToolTip: "delete appointment type",
+  copyToolTip: "copy appointment type link"
 });
 exports.Example = Example;

package/dist/components/Modals/modal.js

@@ -25,7 +25,7 @@ const {
 } = /*#__PURE__*/_react.default.createContext();
 const Overlay = exports.Overlay = _styledComponents.default.div.withConfig({
   displayName: "modal__Overlay"
-})(["position:fixed;top:0;left:0;z-index:9999;width:100vw;height:100vh;background-color:", ";"], _colors.BmBgGrey45);
+})(["position:fixed;top:0;left:0;z-index:20;width:100vw;height:100vh;background-color:", ";"], _colors.BmBgGrey45);
 const ModalContent = exports.ModalContent = _styledComponents.default.div.withConfig({
   displayName: "modal__ModalContent"
 })(["display:flex;flex-direction:column;border-radius:0.8571rem;padding:1rem;margin:2rem auto;background:", ";width:auto;max-width:100%;> *:not(:last-child){margin-bottom:0.5rem;}@media (min-width:576px){width:", ";}"], _colors.BmPrimaryWhite, _ref => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "beem-component",
-  "version": "2.1.14",
+  "version": "2.1.16",
   "private": false,
   "main": "dist/components/index.js",
   "scripts": {

package/src/App.js

@@ -1108,7 +1108,7 @@ const Chat = () => {
           {sampleAppointmentTypes.map((type) => (
             <BmHorizontalCard
               name={type.name}
-              description={type.description}
+              description="Handles imaging and diagnostic scanssdijfsdoijfoisd jsdoij fosidf jsdoif jsdoifs ergjri gr[  jdi[t gegrepg fghepoiurig hroegeigig hep etghtpg hepghrp eug hrg[o hrgiorwrgh w[uugo ggwg iuhwoigw[ig soiug [oh g[wgh[oig hrw[ouig hei reg rwg wgujhsuw hgwrg h9rug rfewrewg fskg42398 glskjgur ghwpgh43hsaujhpghrpeihhou re9ojgpoh"
               price={type.price}
               color={type.color}
               isActive={type.isActive}
@@ -1123,6 +1123,9 @@ const Chat = () => {
               onDelete={() => handleDelete(type)}
               onCopyLink={() => handleCopyLink(type.id)}
               data={type}
+              editToolTip="edit appointment type"
+              deleteToolTip="delete appointment type"
+              copyToolTip="copy appointment type link"
             />
           ))}
         </div>

package/src/lib/components/HorizontalCard/HorizontalCard.js

@@ -90,9 +90,12 @@ const Description = styled.p`
   margin-top: 4px;
   font-size: 0.9rem;
   color: #6b7280;
+  display: -webkit-box;
+  -webkit-line-clamp: 1;
+  -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
-  white-space: nowrap;
+  word-break: break-word;
 `;
 
 const MetaRow = styled.div`
@@ -162,6 +165,9 @@ const BmHorizontalCard = ({
   address,
   duration,
   guest_limit,
+  deleteToolTip,
+  editToolTip,
+  copyToolTip,
 }) => {
   return (
     <RowContainer isActive={isActive}>
@@ -227,7 +233,7 @@ const BmHorizontalCard = ({
             e.stopPropagation();
             onCopyLink();
           }}
-          title="Copy shareable link"
+          title={copyToolTip || ''}
         >
           <LinkIcon fontSize="small" />
         </IconButton>
@@ -236,7 +242,7 @@ const BmHorizontalCard = ({
             e.stopPropagation();
             onView();
           }}
-          title="Edit appointment type"
+          title={editToolTip || ''}
         >
           <EditIcon fontSize="small" />
         </IconButton>
@@ -247,7 +253,7 @@ const BmHorizontalCard = ({
             e.stopPropagation();
             onDelete();
           }}
-          title="Delete appointment type"
+          title={deleteToolTip || ''}
         >
           <DeleteIcon fontSize="small" />
         </IconButton>

package/src/lib/components/HorizontalCard/HorizontalCard.stories.jsx

@@ -26,5 +26,8 @@ export const Example = () => (
     address="456 Innovation Avenue, Tech City"
     duration={60}
     guest_limit={10}
+    editToolTip="edit appointment type"
+    deleteToolTip="delete appointment type"
+    copyToolTip="copy appointment type link"
   />
 );

package/src/lib/components/Modals/modal.js

@@ -15,7 +15,7 @@ export const Overlay = styled.div`
   position: fixed;
   top: 0;
   left: 0;
-  z-index: 9999;
+  z-index: 20;
   width: 100vw;
   height: 100vh;
   background-color: ${BmBgGrey45};