@mailstep/design-system 0.6.29 → 0.6.31

package/package.json

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

package/ui/Blocks/CommonGrid/components/FloatingButton/FloatingButton.js

@@ -40,7 +40,7 @@ var FloatingButton = function (_a) {
             name: item.name,
         }); });
     }, [handleSelectItem, options]);
-    return (_jsx(FloatingWrapper, { children: _jsxs(StyledButton, { ref: ref, onClick: handleOnClick, children: [_jsxs(StyledCross, { isOpen: showDropdownMenu, children: [_jsx("span", { className: "line" }), _jsx("span", { className: "line" })] }), showDropdownMenu && (_jsx(Popover, { parentRef: ref, onClose: onClose, placement: "left-end", children: _jsx(StyledDropdownMenu, { showMenu: true, items: items }) }))] }) }));
+    return (_jsx(FloatingWrapper, { children: _jsxs(StyledButton, { ref: ref, onClick: handleOnClick, children: [_jsxs(StyledCross, { isOpen: showDropdownMenu, children: [_jsx("span", { className: "line" }), _jsx("span", { className: "line" })] }), showDropdownMenu && (_jsx(Popover, { parentRef: ref, onClose: onClose, placement: "top-end", children: _jsx(StyledDropdownMenu, { showMenu: true, items: items }) }))] }) }));
 };
 export default FloatingButton;
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/ui/Blocks/CornerDialog/styles.js

@@ -3,7 +3,7 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
     return cooked;
 };
 import styled, { th } from '@xstyled/styled-components';
-export var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: fixed;\n  z-index: 10;\n  bottom: 3rem;\n  right: 3rem;\n  background: white;\n  border-radius: 12px;\n  box-shadow: cornerDialogShadow;\n  width: 400px;\n  padding: 50px 30px 30px;\n  color: typoPrimary;\n  transition: opacity 225ms linear;\n  opacity: ", ";\n"], ["\n  position: fixed;\n  z-index: 10;\n  bottom: 3rem;\n  right: 3rem;\n  background: white;\n  border-radius: 12px;\n  box-shadow: cornerDialogShadow;\n  width: 400px;\n  padding: 50px 30px 30px;\n  color: typoPrimary;\n  transition: opacity 225ms linear;\n  opacity: ", ";\n"])), function (_a) {
+export var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: fixed;\n  z-index: 10;\n  bottom: 3rem;\n  right: 3rem;\n  background: white;\n  border-radius: 12px;\n  box-shadow: cornerDialogShadow;\n  width: auto;\n  max-width: 400px;\n  padding: 50px 30px 30px;\n  color: typoPrimary;\n  transition: opacity 225ms linear;\n  opacity: ", ";\n"], ["\n  position: fixed;\n  z-index: 10;\n  bottom: 3rem;\n  right: 3rem;\n  background: white;\n  border-radius: 12px;\n  box-shadow: cornerDialogShadow;\n  width: auto;\n  max-width: 400px;\n  padding: 50px 30px 30px;\n  color: typoPrimary;\n  transition: opacity 225ms linear;\n  opacity: ", ";\n"])), function (_a) {
     var $mounted = _a.$mounted;
     return ($mounted ? 1 : 0);
 });

package/ui/index.es.js

@@ -8189,7 +8189,8 @@ const rU = {
   background: white;
   border-radius: 12px;
   box-shadow: cornerDialogShadow;
-  width: 400px;
+  width: auto;
+  max-width: 400px;
   padding: 50px 30px 30px;
   color: typoPrimary;
   transition: opacity 225ms linear;
@@ -46454,7 +46455,7 @@ const iCe = ie.div`
       /* @__PURE__ */ b.jsx("span", { className: "line" }),
       /* @__PURE__ */ b.jsx("span", { className: "line" })
     ] }),
-    n && /* @__PURE__ */ b.jsx(Oj, { parentRef: o, onClose: l, placement: "left-end", children: /* @__PURE__ */ b.jsx(oCe, { showMenu: !0, items: f }) })
+    n && /* @__PURE__ */ b.jsx(Oj, { parentRef: o, onClose: l, placement: "top-end", children: /* @__PURE__ */ b.jsx(oCe, { showMenu: !0, items: f }) })
   ] }) });
 }, cCe = {
   outline: "none"

package/ui/index.umd.js

@@ -934,7 +934,8 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
   background: white;
   border-radius: 12px;
   box-shadow: cornerDialogShadow;
-  width: 400px;
+  width: auto;
+  max-width: 400px;
   padding: 50px 30px 30px;
   color: typoPrimary;
   transition: opacity 225ms linear;
@@ -3369,7 +3370,7 @@ Avoid returning a new reference inside your input selector, e.g.
   > :nth-child(2) {
     transform: ${({isOpen:e})=>e?"rotate(45deg) translate(-1px, -1px)":"rotate(90deg) translate(-2px, 0)"};
   }
-`,axe=({options:e,onSelect:t,onClick:r})=>{const[n,i]=I.useState(!1),o=I.useRef(null),l=I.useCallback(()=>i(!1),[]),u=I.useCallback(()=>{e&&(e==null?void 0:e.length)>0&&i(h=>!h),r==null||r()},[r,e]),c=I.useCallback(h=>{i(!1),t==null||t(h.value)},[t]),f=I.useMemo(()=>e==null?void 0:e.map(h=>({title:h.label,onClick:()=>c(h),link:"#",name:h.name})),[c,e]);return b.jsx(txe,{children:b.jsxs(nxe,{ref:o,onClick:u,children:[b.jsxs(ixe,{isOpen:n,children:[b.jsx("span",{className:"line"}),b.jsx("span",{className:"line"})]}),n&&b.jsx(C9,{parentRef:o,onClose:l,placement:"left-end",children:b.jsx(rxe,{showMenu:!0,items:f})})]})})},oxe={outline:"none"},nv=(...e)=>null,sxe=Xn.uxState,lxe={},uxe=({filters:e,handleDragEnd:t,gridSelectors:r,gridActions:n,isLoading:i,rowsData:o,hasColouredRows:l,columnsDefinitions:u,actionColumnDefinition:c,allowRowSelect:f,allowRowSelectOnAction:h,onRowAction:p,onRowEditClick:v,onRowReadClick:m,onRowClick:w,columnLayout:C="normal",displayColumnsDefinitions:S,className:x,gridRef:k,minColumnWidth:T,errorMessage:P,floatingButtonProps:D})=>{const{uxState:B=sxe,columnConfig:F,columnsWidth:W=lxe,columnsWidthVariant:G,page:U=1,filter:R,sorting:j,rowsPerPage:V=10}=r,{clearUxState:$,handleUxChange:Y,addFilter:ne=nv,addSorting:he=nv,setColumnWidth:be=nv,setColumnsOrder:fe=nv}=n,Z=Zwe(o,B,Y);Ywe(o,B,$);let X,le="info";i&&(X=b.jsx(vn,{id:"dataGrid.status.loadingData",message:"... loading data ..."})),!i&&(!o||o.length<1)&&(X=b.jsx(vn,{id:"dataGrid.status.noDataFound",message:"No data found."})),!i&&P&&(X=P,le="error");const{displayColumnsWidth:se,totalColumnsWidth:ve,gridBoxRef:oe,handleResizeDrag:K}=eAe(S,W,G,be,C,T),ie=I.useMemo(()=>P6e(S),[S]),de=I.useCallback(ge=>{oe.current=ge,k&&(k.current=ge)},[]);return b.jsxs(b.Fragment,{children:[b.jsx(ot.div,{className:x||"",children:b.jsxs(E5e,{columnLayout:C,isLoading:i,totalColumnsWidth:ve,floatingChildren:X&&b.jsx(S1,{className:"dataRow",align:"center",children:b.jsx(y5e,{align:"center",className:`gridMessage ${le}`,width:window.innerWidth,children:X})}),ref:de,children:[b.jsxs("div",{className:"gridHead",children:[u.find(ge=>ge.group)&&b.jsx(I5e,{actionColumn:c,columns:S,displayColumnsWidth:se,groups:ie}),b.jsx(zwe,{columns:S,actionColumn:c,onAddSort:he,columnLayout:C,sortingValues:j,displayColumnsWidth:se,handleResizeDrag:K,groups:ie,handleDragEnd:t}),u.find(ge=>ge.filtering)&&b.jsx(Y5e,{filters:e,columns:S,actionColumn:c,onChange:ne,filterValues:R,displayColumnsWidth:se,groups:ie,rowsData:o,uxState:B,handleUxChange:Y})]}),b.jsx("div",{className:"body flx_1",style:oxe,tabIndex:-1,onKeyDown:Z,children:!i&&o&&S&&o.map((ge,Te)=>{const Ce=V*U+(Te+1)-V;return b.jsx($5e,{rowData:ge,rowIndex:Ce,uxState:B,isEven:l&&(Te+1)%2===0,allowRowSelect:f,allowRowSelectOnAction:h,onRowAction:p,onUxChange:Y,onRowEditClick:v,onRowReadClick:m,onRowClick:w,columns:S,actionColumn:c,displayColumnsWidth:se,groups:ie},ge.id)})})]})}),D&&b.jsx(axe,{...D})]})},cxe=ae(ot.div)`
+`,axe=({options:e,onSelect:t,onClick:r})=>{const[n,i]=I.useState(!1),o=I.useRef(null),l=I.useCallback(()=>i(!1),[]),u=I.useCallback(()=>{e&&(e==null?void 0:e.length)>0&&i(h=>!h),r==null||r()},[r,e]),c=I.useCallback(h=>{i(!1),t==null||t(h.value)},[t]),f=I.useMemo(()=>e==null?void 0:e.map(h=>({title:h.label,onClick:()=>c(h),link:"#",name:h.name})),[c,e]);return b.jsx(txe,{children:b.jsxs(nxe,{ref:o,onClick:u,children:[b.jsxs(ixe,{isOpen:n,children:[b.jsx("span",{className:"line"}),b.jsx("span",{className:"line"})]}),n&&b.jsx(C9,{parentRef:o,onClose:l,placement:"top-end",children:b.jsx(rxe,{showMenu:!0,items:f})})]})})},oxe={outline:"none"},nv=(...e)=>null,sxe=Xn.uxState,lxe={},uxe=({filters:e,handleDragEnd:t,gridSelectors:r,gridActions:n,isLoading:i,rowsData:o,hasColouredRows:l,columnsDefinitions:u,actionColumnDefinition:c,allowRowSelect:f,allowRowSelectOnAction:h,onRowAction:p,onRowEditClick:v,onRowReadClick:m,onRowClick:w,columnLayout:C="normal",displayColumnsDefinitions:S,className:x,gridRef:k,minColumnWidth:T,errorMessage:P,floatingButtonProps:D})=>{const{uxState:B=sxe,columnConfig:F,columnsWidth:W=lxe,columnsWidthVariant:G,page:U=1,filter:R,sorting:j,rowsPerPage:V=10}=r,{clearUxState:$,handleUxChange:Y,addFilter:ne=nv,addSorting:he=nv,setColumnWidth:be=nv,setColumnsOrder:fe=nv}=n,Z=Zwe(o,B,Y);Ywe(o,B,$);let X,le="info";i&&(X=b.jsx(vn,{id:"dataGrid.status.loadingData",message:"... loading data ..."})),!i&&(!o||o.length<1)&&(X=b.jsx(vn,{id:"dataGrid.status.noDataFound",message:"No data found."})),!i&&P&&(X=P,le="error");const{displayColumnsWidth:se,totalColumnsWidth:ve,gridBoxRef:oe,handleResizeDrag:K}=eAe(S,W,G,be,C,T),ie=I.useMemo(()=>P6e(S),[S]),de=I.useCallback(ge=>{oe.current=ge,k&&(k.current=ge)},[]);return b.jsxs(b.Fragment,{children:[b.jsx(ot.div,{className:x||"",children:b.jsxs(E5e,{columnLayout:C,isLoading:i,totalColumnsWidth:ve,floatingChildren:X&&b.jsx(S1,{className:"dataRow",align:"center",children:b.jsx(y5e,{align:"center",className:`gridMessage ${le}`,width:window.innerWidth,children:X})}),ref:de,children:[b.jsxs("div",{className:"gridHead",children:[u.find(ge=>ge.group)&&b.jsx(I5e,{actionColumn:c,columns:S,displayColumnsWidth:se,groups:ie}),b.jsx(zwe,{columns:S,actionColumn:c,onAddSort:he,columnLayout:C,sortingValues:j,displayColumnsWidth:se,handleResizeDrag:K,groups:ie,handleDragEnd:t}),u.find(ge=>ge.filtering)&&b.jsx(Y5e,{filters:e,columns:S,actionColumn:c,onChange:ne,filterValues:R,displayColumnsWidth:se,groups:ie,rowsData:o,uxState:B,handleUxChange:Y})]}),b.jsx("div",{className:"body flx_1",style:oxe,tabIndex:-1,onKeyDown:Z,children:!i&&o&&S&&o.map((ge,Te)=>{const Ce=V*U+(Te+1)-V;return b.jsx($5e,{rowData:ge,rowIndex:Ce,uxState:B,isEven:l&&(Te+1)%2===0,allowRowSelect:f,allowRowSelectOnAction:h,onRowAction:p,onUxChange:Y,onRowEditClick:v,onRowReadClick:m,onRowClick:w,columns:S,actionColumn:c,displayColumnsWidth:se,groups:ie},ge.id)})})]})}),D&&b.jsx(axe,{...D})]})},cxe=ae(ot.div)`
   padding-bottom: 11px;
   padding-top: 10px;
   position: ${({isFixed:e})=>e?"fixed":"relative"};