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

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

import{slicedToArray as e,defineProperty as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import t,{forwardRef as i,useRef as r,useState as s,useEffect as n,useMemo as a,Fragment as l}from"react";import m from"classnames";import{AnimationType as p,JustifyType as c,HideShowEvent as d}from"../../constants/dialog.js";import"../../constants/sizes.js";import{DialogPosition as T}from"../../constants/positions.js";import{EMPTY_ARR as u}from"../../constants/common.js";import f from"../../hooks/useMergeRef.js";import h from"../Tooltip/Tooltip.js";import v from"../Button/Button.js";import y from"../IconButton/IconButton.js";import E from"../Icon/Icons/components/CloseSmall.js";import R from"./TipseenTitle.js";import{TipseenColor as j,TipseenCloseButtonTheme as N,TIPSEEN_CLOSE_BUTTON_ARIA_LABEL as g}from"./TipseenConstants.js";import{withStaticProps as C}from"../../types/withStaticProps.js";import{backwardCompatibilityForProperties as I}from"../../helpers/backwardCompatibilityForProperties.js";import{ComponentDefaultTestId as A}from"../../tests/constants.js";import{getTestId as D}from"../../tests/testIds.js";import B from"../Text/Text.js";import w from"./Tipseen.module.scss.js";import{TooltipTheme as P}from"../Tooltip/TooltipConstants.js";import{ButtonColor as O}from"../Button/ButtonConstants.js";import{TypographyColor as S}from"../Typography/TypographyConstants.js";import{useWarnDeprecated as _}from"../../utils/warn-deprecated.js";var k=t.createContext(j.PRIMARY),M=C(i((function(i,d){var C=i.className,M=i.id,b=i.position,H=void 0===b?T.BOTTOM:b,W=i.animationType,x=void 0===W?p.EXPAND:W,V=i.hideDelay,Y=void 0===V?0:V,L=i.showDelay,X=void 0===L?0:L,z=i.title,G=i.titleClassName,K=i.hideCloseButton,F=i.isCloseButtonHidden,U=i.closeButtonTheme,q=void 0===U?N.LIGHT:U,J=i.onClose,Q=i.closeAriaLabel,Z=i.children,$=void 0===Z?null:Z,ee=i.content,oe=i.justify,te=void 0===oe?c.CENTER:oe,ie=i.containerSelector,re=i.hideTrigger,se=void 0===re?u:re,ne=i.showTrigger,ae=void 0===ne?u:ne,le=i.width,me=i.moveBy,pe=i.hideWhenReferenceHidden,ce=void 0!==pe&&pe,de=i.tip,Te=void 0===de||de,ue=i.tooltipArrowClassName,fe=i.modifiers,he=void 0===fe?u:fe,ve=i.floating,ye=void 0!==ve&&ve,Ee=i.color,Re=i["data-testid"];_({component:"Tipseen",condition:void 0===Ee,message:"The default `color` prop will be changed to 'Tipseen.colors.INVERTED' in the next major version. To keep current color, please use `color={Tipseen.colors.PRIMARY}`"});var je=null!=Ee?Ee:j.PRIMARY,Ne=Array.isArray(ae)&&Array.isArray(se)&&0===ae.length&&X>0,ge=r(null),Ce=f(d,ge),Ie=s(!Ne),Ae=e(Ie,2),De=Ae[0],Be=Ae[1],we=Q||g,Pe=I([K,F],!1);n((function(){var e;return X&&(e=setTimeout((function(){Be(!0)}),X)),function(){clearTimeout(e)}}),[X,Be]);var Oe=a((function(){return je===j.INVERTED?S.ON_INVERTED:S.ON_PRIMARY}),[je]),Se=a((function(){return q===N.LIGHT?je===j.INVERTED?O.ON_INVERTED_BACKGROUND:O.ON_PRIMARY_COLOR:q}),[je,q]),_e=d||M?"div":l,ke=t.createElement("div",null,t.createElement("div",{className:m(w.tipseenHeader)},Pe?null:t.createElement(y,{hideTooltip:!0,className:m(w.tipseenCloseButton,o({},w.dark,q===N.DARK||q===N.FIXED_DARK)),onClick:J,size:v.sizes.XS,kind:v.kinds.TERTIARY,color:Se,ariaLabel:we,icon:E}),t.createElement(R,{text:z,className:m(w.tipseenTitle,G)})),t.createElement(B,{color:Oe,type:B.types.TEXT2,element:"p",className:m(w.tipseenContent)},t.createElement(k.Provider,{value:je},ee)));return t.createElement(_e,{ref:Ce,id:M,"data-testid":Re||D(A.TIPSEEN,M)},t.createElement(h,{className:m(w.tipseenWrapper,C,o(o({},w.tipseenWrapperWithoutCustomWidth,!le),w.floating,ye)),arrowClassName:ue,style:le?{width:le}:void 0,shouldShowOnMount:!Ne,position:H,animationType:x,hideDelay:Y,showDelay:X,hideTrigger:se,showTrigger:ae,content:ke,theme:je===j.INVERTED?P.Dark:P.Primary,justify:te,containerSelector:ie,disableDialogSlide:!1,moveBy:me,hideWhenReferenceHidden:ce,tip:Te&&!ye,modifiers:he,open:Ne?De:void 0,forceRenderWithoutChildren:ye},$))})),{closeButtonThemes:N,positions:T,animationTypes:p,justifyTypes:c,hideShowTriggers:d,colors:j});export{k as TipseenContext,M as default};
//# sourceMappingURL=Tipseen.js.map