monday-ui-react-core/dist/esm/src/components/Button/Button.js

Official monday.com UI resources for application development in React.js

import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import t,{forwardRef as o,useRef as a,useEffect as n,useCallback as i,useMemo as s}from"react";import{camelCase as r}from"lodash-es";import l from"classnames";import"../../constants/dialog.js";import{SIZES as c}from"../../constants/sizes.js";import"../../constants/positions.js";import d from"../../hooks/useMergeRef.js";import{NOOP as u}from"../../utils/function-utils.js";import m from"../Icon/Icon.js";import p from"../Loader/Loader.js";import{ButtonType as f,ButtonColor as g,ButtonInputType as y,getActualSize as b,BUTTON_ICON_SIZE as v}from"./ButtonConstants.js";import{TRANSPARENT_COLOR as I,getParentBackgroundColorNotTransparent as h}from"./helper/dom-helpers.js";import{getTestId as C}from"../../tests/testIds.js";import{withStaticProps as N}from"../../types/withStaticProps.js";import{ComponentDefaultTestId as F}from"../../tests/constants.js";import{backwardCompatibilityForProperties as j}from"../../helpers/backwardCompatibilityForProperties.js";import{getStyle as O}from"../../helpers/typesciptCssModulesHelper.js";import P from"./Button.module.scss.js";import{useButtonLoading as T}from"./helper/useButtonLoading.js";var k=o((function(o,c){var u=o.className,y=o.children,I=o.kind,N=o.onClick,k=o.name,E=o.size,M=o.color,L=o.disabled,R=o.rightIcon,S=o.leftIcon,x=o.success,B=o.successText,z=o.successIcon,_=o.style,A=o.loading,D=o.loaderClassName,U=o.active,w=o.activeButtonClassName,H=o.id,Y=o.marginRight,G=o.marginLeft,V=o.type,X=o.onMouseDown,q=o.ariaLabel,J=o.rightFlat,K=o.leftFlat,Q=o.preventClickAnimation,W=o.noSidePadding,Z=o.onFocus,$=o.onBlur,ee=o.ariaLabeledBy,te=o.defaultTextColorOnPrimaryColor,oe=o.ariaHasPopup,ae=o.ariaExpanded,ne=o.ariaControls,ie=o["aria-describedby"],se=o["aria-hidden"],re=o["aria-pressed"],le=o.blurOnMouseUp,ce=o.dataTestId,de=o["data-testid"],ue=o.insetFocus,me=o.tabIndex,pe=a(null),fe=d(c,pe),ge=T({isLoading:A}).loading,ye=j([de,ce]);n((function(){if((M===g.ON_PRIMARY_COLOR||M===g.FIXED_LIGHT)&&I===f.PRIMARY&&pe.current){var e=pe.current;e.style.color=h(e,te)}}),[I,pe,M,te]);var be=i((function(){var e=pe.current;!L&&e&&le&&e.blur()}),[L,pe,le]),ve=i((function(e){L||ge||x?e.preventDefault():N&&N(e)}),[N,L,ge,x]),Ie=i((function(e){L||ge||x?e.preventDefault():X&&X(e)}),[X,L,ge,x]),he=s((function(){var t,o=x?g.POSITIVE:M;return l(u,P.button,O(P,r("size-"+b(E))),O(P,r("kind-"+I)),O(P,r("color-"+o)),(e(e(e(e(e(e(e(e(e(e(t={},P.success,x),O(P,r("color-"+o+"-active")),U),w,U),P.marginRight,Y),P.marginLeft,G),P.rightFlat,J),P.leftFlat,K),P.preventClickAnimation,Q),P.noSidePadding,W),P.disabled,L),e(t,P.insetFocusStyle,ue)))}),[x,M,u,E,I,ge,U,w,Y,G,J,K,Q,W,L,ue]),Ce=s((function(){return{ref:fe,type:V,className:he,name:k,onMouseUp:be,style:_,onClick:ve,id:H,onFocus:Z,onBlur:$,tabIndex:L||se?-1:me,"data-testid":ye||C(F.BUTTON,H),onMouseDown:Ie,"aria-disabled":L,"aria-busy":ge,"aria-labelledby":ee,"aria-label":q,"aria-haspopup":oe,"aria-expanded":ae,"aria-controls":ne,"aria-describedby":ie,"aria-hidden":se,"aria-pressed":re}}),[fe,V,he,k,be,_,ve,H,Z,$,me,ye,Ie,L,ge,ee,q,oe,ae,ne,ie,se,re]),Ne=s((function(){if("function"==typeof S)return v}),[S]),Fe=s((function(){if("function"==typeof R)return v}),[R]),je=s((function(){if("function"==typeof z)return v}),[z]),Oe=s((function(){return t.createElement(t.Fragment,null,S?t.createElement(m,{iconType:null==m?void 0:m.type.ICON_FONT,clickable:!1,icon:S,iconSize:Ne,className:l(e({},P.leftIcon,!!y)),ignoreFocusStyle:!0}):null,y,R?t.createElement(m,{iconType:null==m?void 0:m.type.ICON_FONT,clickable:!1,icon:R,iconSize:Fe,className:l(e({},P.rightIcon,!!y)),ignoreFocusStyle:!0}):null)}),[y,S,Ne,R,Fe]);return ge?t.createElement("button",Object.assign({},Ce,{key:"".concat(H,"-loading")}),t.createElement("span",{className:l(P.loader,D)},t.createElement(p,{className:P.loaderSvg}),t.createElement("span",{"aria-hidden":!0,className:P.textPlaceholder},Oe))):x?t.createElement("button",Object.assign({},Ce,{key:"".concat(H,"-success")}),t.createElement("span",{className:P.successContent},z?t.createElement(m,{iconType:null==m?void 0:m.type.ICON_FONT,clickable:!1,icon:z,iconSize:je,className:l(e({},P.leftIcon,!!B)),ignoreFocusStyle:!0}):null,B),t.createElement("span",{"aria-hidden":"true",className:P.textPlaceholder},Oe)):t.createElement("button",Object.assign({},Ce,{key:"".concat(H,"-button")}),Oe)}));k.defaultProps={className:void 0,name:void 0,style:void 0,id:void 0,dataTestId:void 0,kind:f.PRIMARY,onClick:u,size:c.MEDIUM,color:g.PRIMARY,disabled:!1,rightIcon:null,leftIcon:null,success:!1,successText:"",successIcon:null,loading:!1,loaderClassName:void 0,active:!1,marginRight:!1,marginLeft:!1,type:y.BUTTON,onMouseDown:u,rightFlat:!1,leftFlat:!1,preventClickAnimation:!1,noSidePadding:!1,onFocus:u,onBlur:u,defaultTextColorOnPrimaryColor:I,ariaHasPopup:void 0,blurOnMouseUp:!0,ariaExpanded:void 0,ariaControls:void 0,ariaLabel:void 0,ariaLabeledBy:void 0,insetFocus:!1};var E=N(k,{sizes:c,colors:g,kinds:f,types:y,inputTags:y});export{E as default};
//# sourceMappingURL=Button.js.map