@mailstep/design-system 0.4.1-beta.4 → 0.4.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mailstep/design-system",
-  "version": "0.4.1-beta.4",
+  "version": "0.4.2",
   "license": "ISC",
   "type": "module",
   "main": "./ui/index.js",

package/ui/Blocks/ImageList/stories/ImageList.stories.js

@@ -18,9 +18,8 @@ var meta = {
 };
 export default meta;
 var images = [
-    { id: '1', smallUrl: 'https://picsum.photos/200/300', url: 'https://d3l7rp8qrtssjc.cloudfront.net/cache/receipt_original/001074f6-997d-46e5-80e0-82edaa6f3d3a/06a09ae0-557c-4808-86f7-f75ac43c6238.jpg' },
-    { id: '2', smallUrl: 'https://picsum.photos/200/300', url: 'https://d3l7rp8qrtssjc.cloudfront.net/cache/receipt_original/001074f6-997d-46e5-80e0-82edaa6f3d3a/d0d38623-a7db-40dc-b2d9-2dc851f6a702.jpg' },
-    { id: '3', smallUrl: 'https://picsum.photos/200/300', url: 'https://d3l7rp8qrtssjc.cloudfront.net/cache/receipt_original/001074f6-997d-46e5-80e0-82edaa6f3d3a/639e91d9-49b8-4106-a2b6-152d4d3d8f1e.jpg' },
+    { id: '1', smallUrl: 'https://picsum.photos/200/300', url: 'https://picsum.photos/400/400' },
+    { id: '1', smallUrl: 'https://picsum.photos/200/300', url: 'https://picsum.photos/400/400' },
 ];
 export var ImageListDefault = {
     args: {

package/ui/Blocks/LightBox/styles.js

@@ -6,5 +6,5 @@ import styled from '@xstyled/styled-components';
 export var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 100%;\n  height: 100%;\n  position: relative;\n  display: flex;\n"], ["\n  width: 100%;\n  height: 100%;\n  position: relative;\n  display: flex;\n"])));
 export var Image = styled.img(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: 100%;\n  height: 100%;\n"], ["\n  width: 100%;\n  height: 100%;\n"])));
 export var ButtonContainer = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  position: absolute;\n  bottom: -60px;\n"], ["\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  position: absolute;\n  bottom: -60px;\n"])));
-export var Description = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  padding: 10px;\n  position: absolute;\n  bottom: 0px;\n  background: rgba(255, 255, 255, 0.5);\n"], ["\n  padding: 10px;\n  position: absolute;\n  bottom: 0px;\n  background: rgba(255, 255, 255, 0.5);\n"])));
+export var Description = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  padding: 10px;\n  position: absolute;\n  width: 100%;\n  bottom: 0px;\n  background: rgba(255, 255, 255, 0.8);\n"], ["\n  padding: 10px;\n  position: absolute;\n  width: 100%;\n  bottom: 0px;\n  background: rgba(255, 255, 255, 0.8);\n"])));
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/ui/index.es.js

@@ -14828,8 +14828,9 @@ const qT = V.div`
 `, eL = V.div`
   padding: 10px;
   position: absolute;
+  width: 100%;
   bottom: 0px;
-  background: rgba(255, 255, 255, 0.5);
+  background: rgba(255, 255, 255, 0.8);
 `, tL = ({
   isLightBoxOpen: e,
   onCloseLightBox: t,

package/ui/index.umd.js

@@ -1418,8 +1418,9 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
 `,dL=F.div`
   padding: 10px;
   position: absolute;
+  width: 100%;
   bottom: 0px;
-  background: rgba(255, 255, 255, 0.5);
+  background: rgba(255, 255, 255, 0.8);
 `,cf=({isLightBoxOpen:e,onCloseLightBox:t,lightBoxAction:r,lightBoxActionTitle:n,images:i,initialSlide:a=0})=>i!=null&&i.length?d.jsx(D3,{isShown:e,onClose:t,variant:"mobileFullscreen",top:"10px",children:d.jsx(sf,{initialSlide:a,slidesPerView:1,autoHeight:!0,children:i.map(o=>d.jsx(lf,{children:d.jsxs(lL,{children:[d.jsx(cL,{src:o.originalUrl??o.url,loading:"lazy",alt:""}),(o.date||o.description)&&d.jsxs(dL,{children:[o.date," ",o.description]}),!!o.withLightBoxAction&&r&&n&&d.jsx(fL,{children:d.jsx(vn,{onClick:r(o.id),appearance:"primaryLight",children:n})})]})},o.id))})}):null,ff=()=>{const{isOpen:e,onOpen:t,onClose:r,data:n}=V3();return{onOpenLightBox:M.useCallback((a=0)=>()=>{t({initialSlide:a})},[t]),onCloseLightBox:r,isLightBoxOpen:e,lightBoxData:n}},uL=F.div`
   position: relative;
   flex-shrink: 0;