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

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

import e,{forwardRef as s,useRef as o,useMemo as t,Fragment as i}from"react";import r from"classnames";import{noop as a}from"lodash-es";import n from"../../hooks/useMergeRef.js";import d from"../Tooltip/Tooltip.js";import c from"../Icon/Icon.js";import l from"../Icon/Icons/components/AddSmall.js";import{getWidthHeight as p}from"./services/IconButton-helpers.js";import{withStaticProps as m}from"../../types/withStaticProps.js";import{getTestId as u}from"../../tests/testIds.js";import{ComponentDefaultTestId as f}from"../../tests/constants.js";import{backwardCompatibilityForProperties as b}from"../../helpers/backwardCompatibilityForProperties.js";import v from"../Button/Button.js";import{BUTTON_ICON_SIZE as j}from"../Button/ButtonConstants.js";import{getStyle as I}from"../../helpers/typesciptCssModulesHelper.js";import C from"./IconButton.module.scss.js";var y=s((function(s,m){var g=s.className,h=s.wrapperClassName,k=s.iconClassName,z=s.id,E=s.icon,N=void 0===E?l:E,B=s.size,S=void 0===B?y.sizes.MEDIUM:B,T=s.tooltipProps,L=void 0===T?{}:T,M=s.tooltipContent,O=s.ariaLabeledBy,P=s.ariaLabel,w=s.ariaHasPopup,x=s.ariaExpanded,R=s.ariaControls,A=s["aria-describedby"],F=s["aria-hidden"],H=s["aria-pressed"],U=s.hideTooltip,X=void 0!==U&&U,D=s.kind,G=void 0===D?y.kinds.TERTIARY:D,W=s.active,V=s.disabled,Y=void 0!==V&&V,_=s.disabledReason,q=s.onClick,J=void 0===q?a:q,K=s.color,Q=s.dataTestId,Z=s["data-testid"],$=s.insetFocus,ee=void 0!==$&&$,se=s.tabIndex,oe=s.loading,te=void 0!==oe&&oe,ie=o(null),re=n(m,ie),ae=b([Z,Q]),ne=t((function(){return(null==L?void 0:L.content)||M}),[null==L?void 0:L.content,M]),de=t((function(){return P||("string"==typeof ne?ne:void 0)}),[P,ne]),ce=t((function(){switch(S){case y.sizes.XXS:case y.sizes.XS:return 16;case y.sizes.SMALL:case y.sizes.MEDIUM:case y.sizes.LARGE:return j;default:return 24}}),[S]),le=t((function(){var e={justifyContent:"center",alignItems:"center",padding:0};return S&&(e=Object.assign(Object.assign({},e),p(S))),e}),[S]),pe=t((function(){return X?null:Y&&_?_:ne||P}),[X,Y,_,ne,P]),me=h?"div":i,ue=t((function(){return h?{className:r(h,C.wrapper)}:{}}),[h]);return e.createElement(me,Object.assign({},ue),e.createElement(d,Object.assign({},L,{content:pe,referenceWrapperClassName:C.referenceWrapper}),e.createElement(v,{onClick:J,disabled:Y,color:K,kind:G,ariaLabeledBy:O,ariaLabel:de,ariaHasPopup:w,ariaExpanded:x,ariaControls:R,"aria-describedby":A,"aria-hidden":F,"aria-pressed":H,ref:re,id:z,"data-testid":ae||u(f.ICON_BUTTON,z),noSidePadding:!0,active:W,className:g,style:le,insetFocus:ee,tabIndex:se,loading:te,loaderClassName:r(C.loader,I(C,S))},e.createElement(c,{icon:N,iconType:c.type.SVG,iconSize:ce,ignoreFocusStyle:!0,className:k,clickable:!1}))))})),g=m(y,{sizes:v.sizes,kinds:v.kinds,colors:v.colors});export{g as default};
//# sourceMappingURL=IconButton.js.map