@mailstep/design-system 0.7.48-beta.3 → 0.7.49-beta.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mailstep/design-system",
-  "version": "0.7.48-beta.3",
+  "version": "0.7.49-beta.0",
   "license": "ISC",
   "type": "module",
   "main": "./ui/index.js",

package/ui/Forms/Input/Input.js

@@ -32,7 +32,7 @@ var allowedInputTypes = ['text', 'number', 'password'];
 export var Input = function (_a) {
     var _b = _a.appearance, appearance = _b === void 0 ? 'primary' : _b, type = _a.type, name = _a.name, label = _a.label, value = _a.value, icon = _a.icon, _c = _a.variant, variant = _c === void 0 ? 'default' : _c, disabled = _a.disabled, error = _a.error, _d = _a.isInvalid, isInvalid = _d === void 0 ? undefined : _d, _e = _a.spaceAround, spaceAround = _e === void 0 ? false : _e, inputRef = _a.inputRef, autoComplete = _a.autoComplete, isLoading = _a.isLoading, className = _a.className, suffix = _a.suffix, suffixOnClick = _a.suffixOnClick, errorAppearance = _a.errorAppearance, _f = _a.iconPlacement, iconPlacement = _f === void 0 ? 'left' : _f, iconOnClick = _a.iconOnClick, iconTooltip = _a.iconTooltip, big = _a.big, _g = _a.showArrowsController, showArrowsController = _g === void 0 ? false : _g, onClear = _a.onClear, alwaysShowClear = _a.alwaysShowClear, setNumber = _a.setNumber, onEnter = _a.onEnter, _h = _a.forceFocus, forceFocus = _h === void 0 ? false : _h, _j = _a.autoFocus, autoFocus = _j === void 0 ? false : _j, onBlur = _a.onBlur, _k = _a.asTextArea, asTextArea = _k === void 0 ? false : _k, rest = __rest(_a, ["appearance", "type", "name", "label", "value", "icon", "variant", "disabled", "error", "isInvalid", "spaceAround", "inputRef", "autoComplete", "isLoading", "className", "suffix", "suffixOnClick", "errorAppearance", "iconPlacement", "iconOnClick", "iconTooltip", "big", "showArrowsController", "onClear", "alwaysShowClear", "setNumber", "onEnter", "forceFocus", "autoFocus", "onBlur", "asTextArea"]);
     var $isInvalid = isInvalid !== undefined ? isInvalid : !!error;
-    var $isClearable = !!onClear && (!!value || alwaysShowClear) && !disabled && !isLoading;
+    var $isClearable = !!onClear && (!!value || alwaysShowClear) && !isLoading;
     var $hasSuffix = !!suffix;
     var checkIconPlacement = showArrowsController ? 'left' : iconPlacement;
     var onAddItem = useCallback(function () {

package/ui/index.es.js

@@ -27560,7 +27560,7 @@ const Ove = (e) => {
   asTextArea: ee = !1,
   ...$
 }) => {
-  const te = f !== void 0 ? f : !!u, ue = !!F && (!!i || H) && !c && !m, ge = !!w, de = B ? "left" : I, Z = ve(() => {
+  const te = f !== void 0 ? f : !!u, ue = !!F && (!!i || H) && !m, ge = !!w, de = B ? "left" : I, Z = ve(() => {
     z && z((X) => X + 1);
   }, [z]), q = ve(() => {
     z && z((X) => X > 1 ? X - 1 : 1);

package/ui/index.umd.js

@@ -1897,7 +1897,7 @@ Me.version="2.30.1",I3e(fr),Me.fn=Te,Me.min=h4e,Me.max=A4e,Me.now=g4e,Me.utc=ho,
       display: block;
     }
   }
-`,N5e=["text","number","password"],mo=({appearance:e="primary",type:t,name:r,label:n,value:i,icon:o,variant:l="default",disabled:c,error:u,isInvalid:f=void 0,spaceAround:p=!1,inputRef:h,autoComplete:v,isLoading:m,className:y,suffix:w,suffixOnClick:x,errorAppearance:C,iconPlacement:k="left",iconOnClick:P,iconTooltip:T,big:L,showArrowsController:F=!1,onClear:V,alwaysShowClear:z,setNumber:G,onEnter:Z,forceFocus:R=!1,autoFocus:H=!1,onBlur:j,asTextArea:te=!1,...ee})=>{const re=f!==void 0?f:!!u,fe=!!V&&(!!i||z)&&!c&&!m,ve=!!w,pe=F?"left":k,Y=I.useCallback(()=>{G&&G(Q=>Q+1)},[G]),$=I.useCallback(()=>{G&&G(Q=>Q>1?Q-1:1)},[G]),le=I.useRef(),ce=h||le;I.useEffect(()=>{var Q;R&&!c&&!m&&((Q=ce==null?void 0:ce.current)==null||Q.focus())},[c,R,m]);const Ae=I.useCallback(Q=>{var oe,de,me,Oe,we;j==null||j(Q),R&&(((de=(oe=Q.relatedTarget)==null?void 0:oe.tagName)==null?void 0:de.toLowerCase())!=="input"||!N5e.includes((Oe=(me=Q.relatedTarget)==null?void 0:me.type)==null?void 0:Oe.toLowerCase()))&&((we=Q.target)==null||we.focus())},[R,j]),se=I.useCallback(Q=>{Q.key==="Enter"&&(Z==null||Z())},[Z]);return g.jsxs(Ms,{spaceAround:p,className:y,children:[g.jsxs(T5e,{children:[n&&g.jsx(bu,{htmlFor:r,children:n}),g.jsxs(L5e,{hasValue:!!i,$isInvalid:re,disabled:!!c,$icon:o,variant:l,children:[g.jsx(P5e,{autoFocus:H,className:`${e} ${pe}`,type:t,name:r,"data-cy":r?`${r}Inp`:void 0,"data-testid":r?`input-${r}`:void 0,value:i,$isInvalid:re,$isClearable:fe,$hasSuffix:ve,disabled:c||m,ref:ce,autoComplete:v,onKeyDown:se,big:L,onBlur:Ae,$asTextArea:te,variant:l,...ee}),o&&g.jsx(Ql,{right:F?!1:k==="right",hasValue:!!i,$isInvalid:re,disabled:c,onClick:P,children:g.jsxs(D5e,{children:[g.jsx(At,{icon:o}),T&&g.jsx("span",{children:T})]})}),F&&g.jsxs(O5e,{children:[g.jsx(QN,{onClick:Y,children:g.jsx(At,{icon:"goUp",fill:"gray1"})}),g.jsx(QN,{onClick:$,children:g.jsx(At,{icon:"goDown",fill:"gray1"})})]}),fe&&g.jsx(k5e,{right:!0,onClick:V,children:g.jsx(At,{icon:"deleteX",size:"16px",fill:"gray1"})}),w&&!m&&g.jsx(M5e,{onClick:x,$isPointer:!!x,$isInvalid:re,children:w}),m&&g.jsx(Ql,{right:!0,children:g.jsx(X0,{variant:"sm"})})]})]}),u&&g.jsx(p1,{appearance:C,children:u})]})};function B5e(e,t){e.prototype=Object.create(t.prototype),e.prototype.constructor=e,m8(e,t)}function m8(e,t){return m8=Object.setPrototypeOf||function(n,i){return n.__proto__=i,n},m8(e,t)}function R5e(e,t){if(e==null)return{};var r={},n=Object.keys(e),i,o;for(o=0;o<n.length;o++)i=n[o],!(t.indexOf(i)>=0)&&(r[i]=e[i]);return r}function KN(e){if(e===void 0)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function F5e(e,t,r){return e===t?!0:e.correspondingElement?e.correspondingElement.classList.contains(r):e.classList.contains(r)}function V5e(e,t,r){if(e===t)return!0;for(;e.parentNode||e.host;){if(e.parentNode&&F5e(e,t,r))return!0;e=e.parentNode||e.host}return e}function j5e(e){return document.documentElement.clientWidth<=e.clientX||document.documentElement.clientHeight<=e.clientY}var W5e=function(){if(!(typeof window>"u"||typeof window.addEventListener!="function")){var t=!1,r=Object.defineProperty({},"passive",{get:function(){t=!0}}),n=function(){};return window.addEventListener("testPassiveEventSupport",n,r),window.removeEventListener("testPassiveEventSupport",n,r),t}};function H5e(e){return e===void 0&&(e=0),function(){return++e}}var z5e=H5e(),b8,HA={},y8={},G5e=["touchstart","touchmove"],_5e="ignore-react-onclickoutside";function qN(e,t){var r={},n=G5e.indexOf(t)!==-1;return n&&b8&&(r.passive=!e.props.preventDefault),r}function U5e(e,t){var r,n,i=e.displayName||e.name||"Component";return n=r=function(o){B5e(l,o);function l(u){var f;return f=o.call(this,u)||this,f.__outsideClickHandler=function(p){if(typeof f.__clickOutsideHandlerProp=="function"){f.__clickOutsideHandlerProp(p);return}var h=f.getInstance();if(typeof h.props.handleClickOutside=="function"){h.props.handleClickOutside(p);return}if(typeof h.handleClickOutside=="function"){h.handleClickOutside(p);return}throw new Error("WrappedComponent: "+i+" lacks a handleClickOutside(event) function for processing outside click events.")},f.__getComponentNode=function(){var p=f.getInstance();return t&&typeof t.setClickOutsideRef=="function"?t.setClickOutsideRef()(p):typeof p.setClickOutsideRef=="function"?p.setClickOutsideRef():Uc.findDOMNode(p)},f.enableOnClickOutside=function(){if(!(typeof document>"u"||y8[f._uid])){typeof b8>"u"&&(b8=W5e()),y8[f._uid]=!0;var p=f.props.eventTypes;p.forEach||(p=[p]),HA[f._uid]=function(h){if(f.componentNode!==null&&(f.props.preventDefault&&h.preventDefault(),f.props.stopPropagation&&h.stopPropagation(),!(f.props.excludeScrollbar&&j5e(h)))){var v=h.composed&&h.composedPath&&h.composedPath().shift()||h.target;V5e(v,f.componentNode,f.props.outsideClickIgnoreClass)===document&&f.__outsideClickHandler(h)}},p.forEach(function(h){document.addEventListener(h,HA[f._uid],qN(KN(f),h))})}},f.disableOnClickOutside=function(){delete y8[f._uid];var p=HA[f._uid];if(p&&typeof document<"u"){var h=f.props.eventTypes;h.forEach||(h=[h]),h.forEach(function(v){return document.removeEventListener(v,p,qN(KN(f),v))}),delete HA[f._uid]}},f.getRef=function(p){return f.instanceRef=p},f._uid=z5e(),f}var c=l.prototype;return c.getInstance=function(){if(e.prototype&&!e.prototype.isReactComponent)return this;var f=this.instanceRef;return f.getInstance?f.getInstance():f},c.componentDidMount=function(){if(!(typeof document>"u"||!document.createElement)){var f=this.getInstance();if(t&&typeof t.handleClickOutside=="function"&&(this.__clickOutsideHandlerProp=t.handleClickOutside(f),typeof this.__clickOutsideHandlerProp!="function"))throw new Error("WrappedComponent: "+i+" lacks a function for processing outside click events specified by the handleClickOutside config option.");this.componentNode=this.__getComponentNode(),!this.props.disableOnClickOutside&&this.enableOnClickOutside()}},c.componentDidUpdate=function(){this.componentNode=this.__getComponentNode()},c.componentWillUnmount=function(){this.disableOnClickOutside()},c.render=function(){var f=this.props;f.excludeScrollbar;var p=R5e(f,["excludeScrollbar"]);return e.prototype&&e.prototype.isReactComponent?p.ref=this.getRef:p.wrappedRef=this.getRef,p.disableOnClickOutside=this.disableOnClickOutside,p.enableOnClickOutside=this.enableOnClickOutside,I.createElement(e,p)},l}(I.Component),r.displayName="OnClickOutside("+i+")",r.defaultProps={eventTypes:["mousedown","touchstart"],excludeScrollbar:t&&t.excludeScrollbar||!1,outsideClickIgnoreClass:_5e,preventDefault:!1,stopPropagation:!1},r.getClass=function(){return e.getClass?e.getClass():e},n}var js=(e=>(e.EVERY_TODAY="every-today",e.EVERY_YESTERDAY="every-yesterday",e))(js||{}),N1=(e=>(e.FROM="from",e.TO="to",e.AT="at",e))(N1||{});const C8={[js.EVERY_TODAY]:ze._({id:"dataGrid.everyToday",message:"Every today"}),[js.EVERY_YESTERDAY]:ze._({id:"dataGrid.everyYesterday",message:"Every yesterday"})},$N={[N1.FROM]:ze._({id:"dataGrid.timepicker.from",message:"from"}),[N1.TO]:ze._({id:"dataGrid.timepicker.to",message:"to"}),[N1.AT]:ze._({id:"dataGrid.timepicker.at",message:"at"})},eB=J.div`
+`,N5e=["text","number","password"],mo=({appearance:e="primary",type:t,name:r,label:n,value:i,icon:o,variant:l="default",disabled:c,error:u,isInvalid:f=void 0,spaceAround:p=!1,inputRef:h,autoComplete:v,isLoading:m,className:y,suffix:w,suffixOnClick:x,errorAppearance:C,iconPlacement:k="left",iconOnClick:P,iconTooltip:T,big:L,showArrowsController:F=!1,onClear:V,alwaysShowClear:z,setNumber:G,onEnter:Z,forceFocus:R=!1,autoFocus:H=!1,onBlur:j,asTextArea:te=!1,...ee})=>{const re=f!==void 0?f:!!u,fe=!!V&&(!!i||z)&&!m,ve=!!w,pe=F?"left":k,Y=I.useCallback(()=>{G&&G(Q=>Q+1)},[G]),$=I.useCallback(()=>{G&&G(Q=>Q>1?Q-1:1)},[G]),le=I.useRef(),ce=h||le;I.useEffect(()=>{var Q;R&&!c&&!m&&((Q=ce==null?void 0:ce.current)==null||Q.focus())},[c,R,m]);const Ae=I.useCallback(Q=>{var oe,de,me,Oe,we;j==null||j(Q),R&&(((de=(oe=Q.relatedTarget)==null?void 0:oe.tagName)==null?void 0:de.toLowerCase())!=="input"||!N5e.includes((Oe=(me=Q.relatedTarget)==null?void 0:me.type)==null?void 0:Oe.toLowerCase()))&&((we=Q.target)==null||we.focus())},[R,j]),se=I.useCallback(Q=>{Q.key==="Enter"&&(Z==null||Z())},[Z]);return g.jsxs(Ms,{spaceAround:p,className:y,children:[g.jsxs(T5e,{children:[n&&g.jsx(bu,{htmlFor:r,children:n}),g.jsxs(L5e,{hasValue:!!i,$isInvalid:re,disabled:!!c,$icon:o,variant:l,children:[g.jsx(P5e,{autoFocus:H,className:`${e} ${pe}`,type:t,name:r,"data-cy":r?`${r}Inp`:void 0,"data-testid":r?`input-${r}`:void 0,value:i,$isInvalid:re,$isClearable:fe,$hasSuffix:ve,disabled:c||m,ref:ce,autoComplete:v,onKeyDown:se,big:L,onBlur:Ae,$asTextArea:te,variant:l,...ee}),o&&g.jsx(Ql,{right:F?!1:k==="right",hasValue:!!i,$isInvalid:re,disabled:c,onClick:P,children:g.jsxs(D5e,{children:[g.jsx(At,{icon:o}),T&&g.jsx("span",{children:T})]})}),F&&g.jsxs(O5e,{children:[g.jsx(QN,{onClick:Y,children:g.jsx(At,{icon:"goUp",fill:"gray1"})}),g.jsx(QN,{onClick:$,children:g.jsx(At,{icon:"goDown",fill:"gray1"})})]}),fe&&g.jsx(k5e,{right:!0,onClick:V,children:g.jsx(At,{icon:"deleteX",size:"16px",fill:"gray1"})}),w&&!m&&g.jsx(M5e,{onClick:x,$isPointer:!!x,$isInvalid:re,children:w}),m&&g.jsx(Ql,{right:!0,children:g.jsx(X0,{variant:"sm"})})]})]}),u&&g.jsx(p1,{appearance:C,children:u})]})};function B5e(e,t){e.prototype=Object.create(t.prototype),e.prototype.constructor=e,m8(e,t)}function m8(e,t){return m8=Object.setPrototypeOf||function(n,i){return n.__proto__=i,n},m8(e,t)}function R5e(e,t){if(e==null)return{};var r={},n=Object.keys(e),i,o;for(o=0;o<n.length;o++)i=n[o],!(t.indexOf(i)>=0)&&(r[i]=e[i]);return r}function KN(e){if(e===void 0)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function F5e(e,t,r){return e===t?!0:e.correspondingElement?e.correspondingElement.classList.contains(r):e.classList.contains(r)}function V5e(e,t,r){if(e===t)return!0;for(;e.parentNode||e.host;){if(e.parentNode&&F5e(e,t,r))return!0;e=e.parentNode||e.host}return e}function j5e(e){return document.documentElement.clientWidth<=e.clientX||document.documentElement.clientHeight<=e.clientY}var W5e=function(){if(!(typeof window>"u"||typeof window.addEventListener!="function")){var t=!1,r=Object.defineProperty({},"passive",{get:function(){t=!0}}),n=function(){};return window.addEventListener("testPassiveEventSupport",n,r),window.removeEventListener("testPassiveEventSupport",n,r),t}};function H5e(e){return e===void 0&&(e=0),function(){return++e}}var z5e=H5e(),b8,HA={},y8={},G5e=["touchstart","touchmove"],_5e="ignore-react-onclickoutside";function qN(e,t){var r={},n=G5e.indexOf(t)!==-1;return n&&b8&&(r.passive=!e.props.preventDefault),r}function U5e(e,t){var r,n,i=e.displayName||e.name||"Component";return n=r=function(o){B5e(l,o);function l(u){var f;return f=o.call(this,u)||this,f.__outsideClickHandler=function(p){if(typeof f.__clickOutsideHandlerProp=="function"){f.__clickOutsideHandlerProp(p);return}var h=f.getInstance();if(typeof h.props.handleClickOutside=="function"){h.props.handleClickOutside(p);return}if(typeof h.handleClickOutside=="function"){h.handleClickOutside(p);return}throw new Error("WrappedComponent: "+i+" lacks a handleClickOutside(event) function for processing outside click events.")},f.__getComponentNode=function(){var p=f.getInstance();return t&&typeof t.setClickOutsideRef=="function"?t.setClickOutsideRef()(p):typeof p.setClickOutsideRef=="function"?p.setClickOutsideRef():Uc.findDOMNode(p)},f.enableOnClickOutside=function(){if(!(typeof document>"u"||y8[f._uid])){typeof b8>"u"&&(b8=W5e()),y8[f._uid]=!0;var p=f.props.eventTypes;p.forEach||(p=[p]),HA[f._uid]=function(h){if(f.componentNode!==null&&(f.props.preventDefault&&h.preventDefault(),f.props.stopPropagation&&h.stopPropagation(),!(f.props.excludeScrollbar&&j5e(h)))){var v=h.composed&&h.composedPath&&h.composedPath().shift()||h.target;V5e(v,f.componentNode,f.props.outsideClickIgnoreClass)===document&&f.__outsideClickHandler(h)}},p.forEach(function(h){document.addEventListener(h,HA[f._uid],qN(KN(f),h))})}},f.disableOnClickOutside=function(){delete y8[f._uid];var p=HA[f._uid];if(p&&typeof document<"u"){var h=f.props.eventTypes;h.forEach||(h=[h]),h.forEach(function(v){return document.removeEventListener(v,p,qN(KN(f),v))}),delete HA[f._uid]}},f.getRef=function(p){return f.instanceRef=p},f._uid=z5e(),f}var c=l.prototype;return c.getInstance=function(){if(e.prototype&&!e.prototype.isReactComponent)return this;var f=this.instanceRef;return f.getInstance?f.getInstance():f},c.componentDidMount=function(){if(!(typeof document>"u"||!document.createElement)){var f=this.getInstance();if(t&&typeof t.handleClickOutside=="function"&&(this.__clickOutsideHandlerProp=t.handleClickOutside(f),typeof this.__clickOutsideHandlerProp!="function"))throw new Error("WrappedComponent: "+i+" lacks a function for processing outside click events specified by the handleClickOutside config option.");this.componentNode=this.__getComponentNode(),!this.props.disableOnClickOutside&&this.enableOnClickOutside()}},c.componentDidUpdate=function(){this.componentNode=this.__getComponentNode()},c.componentWillUnmount=function(){this.disableOnClickOutside()},c.render=function(){var f=this.props;f.excludeScrollbar;var p=R5e(f,["excludeScrollbar"]);return e.prototype&&e.prototype.isReactComponent?p.ref=this.getRef:p.wrappedRef=this.getRef,p.disableOnClickOutside=this.disableOnClickOutside,p.enableOnClickOutside=this.enableOnClickOutside,I.createElement(e,p)},l}(I.Component),r.displayName="OnClickOutside("+i+")",r.defaultProps={eventTypes:["mousedown","touchstart"],excludeScrollbar:t&&t.excludeScrollbar||!1,outsideClickIgnoreClass:_5e,preventDefault:!1,stopPropagation:!1},r.getClass=function(){return e.getClass?e.getClass():e},n}var js=(e=>(e.EVERY_TODAY="every-today",e.EVERY_YESTERDAY="every-yesterday",e))(js||{}),N1=(e=>(e.FROM="from",e.TO="to",e.AT="at",e))(N1||{});const C8={[js.EVERY_TODAY]:ze._({id:"dataGrid.everyToday",message:"Every today"}),[js.EVERY_YESTERDAY]:ze._({id:"dataGrid.everyYesterday",message:"Every yesterday"})},$N={[N1.FROM]:ze._({id:"dataGrid.timepicker.from",message:"from"}),[N1.TO]:ze._({id:"dataGrid.timepicker.to",message:"to"}),[N1.AT]:ze._({id:"dataGrid.timepicker.at",message:"at"})},eB=J.div`
   display: flex;
   justify-content: space-between;
   align-items: center;