UNPKG

monday-ui-react-core

Version:

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

github.com/mondaycom/vibe

mondaycom/vibe

3 lines (2 loc) • 2.57 kB
1
2
3
import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{getStyle as t}from"../../helpers/typesciptCssModulesHelper.js";import r from"classnames";import o,{forwardRef as n,useMemo as s}from"react";import a from"../Button/Button.js";import l from"../IconButton/IconButton.js";import i from"../Icon/Icons/components/CloseSmall.js";import{AlertBannerBackgroundColor as c}from"./AlertBannerConstants.js";import{NOOP as m}from"../../utils/function-utils.js";import{ComponentDefaultTestId as p}from"../../tests/constants.js";import{getTestId as u}from"../../tests/testIds.js";import{withStaticProps as d}from"../../types/withStaticProps.js";import f from"./AlertBanner.module.scss.js";import A from"../Text/Text.js";import{AlertBannerContext as B}from"./AlertBannerContext.js";var N=n((function(n,c){var d=n.children,C=n.className,E=n.backgroundColor,b=void 0===E?N.backgroundColors.PRIMARY:E,R=n.onClose,v=void 0===R?m:R,I=n.ariaLabel,j=void 0===I?"":I,T=n.closeButtonAriaLabel,k=void 0===T?"Close":T,y=n.isCloseHidden,g=void 0!==y&&y,_=n.id,L=n["data-testid"],O=s((function(){return r(C,f.alertBanner,t(f,b))}),[C,b]),x=b===N.backgroundColors.DARK,D=b===N.backgroundColors.WARNING,P=s((function(){return D?A.colors.FIXED_DARK:x?A.colors.ON_INVERTED:A.colors.ON_PRIMARY}),[x,D]),h=s((function(){return o.Children.toArray(d).filter((function(e){return!(!e.type.isAlertBannerItem&&"MDXCreateElement"!==e.type.displayName)||(console.error("Alert banner child is not supported. Please use AlertBannerText, AlertBannerLink or AlertBannerButton.",e),!1)})).map((function(e,t){return o.cloneElement(e,Object.assign(Object.assign({},null==e?void 0:e.props),{marginLeft:t>0,isDarkBackground:x}))}))}),[d,x]);return o.createElement(A,{type:A.types.TEXT2,color:P,ref:c,className:O,role:"banner","aria-label":j||"banner",id:_,"data-testid":L||u(p.ALERT_BANNER,_)},o.createElement(B.Provider,{value:{textColor:P}},o.createElement("div",{className:r(f.content)},h.map((function(t,n){var s=t.type.isAlertBannerText;return o.createElement("div",{key:n,className:r(f.contentItem,e({},f.contentItemText,s))},s?o.createElement("div",{className:r(f.ellipsis)},t):t)})))),o.createElement("div",{className:r(f.closeButtonWrapper)},g?null:o.createElement(l,{"data-testid":"alert-banner-close-button",icon:i,className:r(f.closeBtn),hideTooltip:!0,onClick:v,size:a.sizes.SMALL,kind:l.kinds.TERTIARY,color:x?a.colors.ON_INVERTED_BACKGROUND:a.colors.ON_PRIMARY_COLOR,ariaLabel:k})))})),C=d(N,{backgroundColors:c});export{C as default}; //# sourceMappingURL=AlertBanner.js.map