UNPKG

@cgi-learning-hub/ui

Version:

@cgi-learning-hub/ui is an open-source React component library that implements UI for HUB's features

5 lines (4 loc) 13.5 kB
"use strict";const Qe=require("react"),e=require("./index-kjfz41UI.cjs"),A=require("./generateUtilityClasses-CENS22bI.cjs"),Ze=require("./index-D_kvDIOz.cjs"),eo=require("./useTheme-BrGF2Vm0.cjs"),g=require("react/jsx-runtime"),x=require("./DefaultPropsProvider-C1g4BXET.cjs"),G=require("./memoTheme-Bi1UNdyO.cjs"),D=require("./useSlot-C-aMxEm0.cjs"),O=require("./useTimeout-COCrDKz-.cjs"),oo=require("./useControlled-QrrYcKxm.cjs"),to=require("./useId-DNXtOFeX.cjs"),he=require("./useEventCallback-BxpcFap0.cjs"),ro=require("./useForkRef-CFhhTu-Q.cjs"),Pe=require("./elementAcceptingRef-CuMilXz3.cjs"),po=require("./Grow-6zwoqUfO.cjs"),we=require("./Popper-D5Cs38W_.cjs"),ve=require("./capitalize-3OjkeP9i.cjs"),ge=require("./isFocusVisible-DlSijby6.cjs");function no(r){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const n in r)if(n!=="default"){const l=Object.getOwnPropertyDescriptor(r,n);Object.defineProperty(o,n,l.get?l:{enumerable:!0,get:()=>r[n]})}}return o.default=r,Object.freeze(o)}const s=no(Qe);function Re(r){return A.generateUtilityClass("MuiTooltip",r)}const p=A.generateUtilityClasses("MuiTooltip",["popper","popperInteractive","popperArrow","popperClose","tooltip","tooltipArrow","touch","tooltipPlacementLeft","tooltipPlacementRight","tooltipPlacementTop","tooltipPlacementBottom","arrow"]);function so(r){return Math.round(r*1e5)/1e5}const io=r=>{const{classes:o,disableInteractive:n,arrow:l,touch:C,placement:b}=r,K={popper:["popper",!n&&"popperInteractive",l&&"popperArrow"],tooltip:["tooltip",l&&"tooltipArrow",C&&"touch",`tooltipPlacement${ve.capitalize(b.split("-")[0])}`],arrow:["arrow"]};return x.composeClasses(K,Re,o)},ao=x.styled(we.Popper,{name:"MuiTooltip",slot:"Popper",overridesResolver:(r,o)=>{const{ownerState:n}=r;return[o.popper,!n.disableInteractive&&o.popperInteractive,n.arrow&&o.popperArrow,!n.open&&o.popperClose]}})(G.memoTheme(({theme:r})=>({zIndex:(r.vars||r).zIndex.tooltip,pointerEvents:"none",variants:[{props:({ownerState:o})=>!o.disableInteractive,style:{pointerEvents:"auto"}},{props:({open:o})=>!o,style:{pointerEvents:"none"}},{props:({ownerState:o})=>o.arrow,style:{[`&[data-popper-placement*="bottom"] .${p.arrow}`]:{top:0,marginTop:"-0.71em","&::before":{transformOrigin:"0 100%"}},[`&[data-popper-placement*="top"] .${p.arrow}`]:{bottom:0,marginBottom:"-0.71em","&::before":{transformOrigin:"100% 0"}},[`&[data-popper-placement*="right"] .${p.arrow}`]:{height:"1em",width:"0.71em","&::before":{transformOrigin:"100% 100%"}},[`&[data-popper-placement*="left"] .${p.arrow}`]:{height:"1em",width:"0.71em","&::before":{transformOrigin:"0 0"}}}},{props:({ownerState:o})=>o.arrow&&!o.isRtl,style:{[`&[data-popper-placement*="right"] .${p.arrow}`]:{left:0,marginLeft:"-0.71em"}}},{props:({ownerState:o})=>o.arrow&&!!o.isRtl,style:{[`&[data-popper-placement*="right"] .${p.arrow}`]:{right:0,marginRight:"-0.71em"}}},{props:({ownerState:o})=>o.arrow&&!o.isRtl,style:{[`&[data-popper-placement*="left"] .${p.arrow}`]:{right:0,marginRight:"-0.71em"}}},{props:({ownerState:o})=>o.arrow&&!!o.isRtl,style:{[`&[data-popper-placement*="left"] .${p.arrow}`]:{left:0,marginLeft:"-0.71em"}}}]}))),lo=x.styled("div",{name:"MuiTooltip",slot:"Tooltip",overridesResolver:(r,o)=>{const{ownerState:n}=r;return[o.tooltip,n.touch&&o.touch,n.arrow&&o.tooltipArrow,o[`tooltipPlacement${ve.capitalize(n.placement.split("-")[0])}`]]}})(G.memoTheme(({theme:r})=>({backgroundColor:r.vars?r.vars.palette.Tooltip.bg:r.alpha(r.palette.grey[700],.92),borderRadius:(r.vars||r).shape.borderRadius,color:(r.vars||r).palette.common.white,fontFamily:r.typography.fontFamily,padding:"4px 8px",fontSize:r.typography.pxToRem(11),maxWidth:300,margin:2,wordWrap:"break-word",fontWeight:r.typography.fontWeightMedium,[`.${p.popper}[data-popper-placement*="left"] &`]:{transformOrigin:"right center"},[`.${p.popper}[data-popper-placement*="right"] &`]:{transformOrigin:"left center"},[`.${p.popper}[data-popper-placement*="top"] &`]:{transformOrigin:"center bottom",marginBottom:"14px"},[`.${p.popper}[data-popper-placement*="bottom"] &`]:{transformOrigin:"center top",marginTop:"14px"},variants:[{props:({ownerState:o})=>o.arrow,style:{position:"relative",margin:0}},{props:({ownerState:o})=>o.touch,style:{padding:"8px 16px",fontSize:r.typography.pxToRem(14),lineHeight:`${so(16/14)}em`,fontWeight:r.typography.fontWeightRegular}},{props:({ownerState:o})=>!o.isRtl,style:{[`.${p.popper}[data-popper-placement*="left"] &`]:{marginRight:"14px"},[`.${p.popper}[data-popper-placement*="right"] &`]:{marginLeft:"14px"}}},{props:({ownerState:o})=>!o.isRtl&&o.touch,style:{[`.${p.popper}[data-popper-placement*="left"] &`]:{marginRight:"24px"},[`.${p.popper}[data-popper-placement*="right"] &`]:{marginLeft:"24px"}}},{props:({ownerState:o})=>!!o.isRtl,style:{[`.${p.popper}[data-popper-placement*="left"] &`]:{marginLeft:"14px"},[`.${p.popper}[data-popper-placement*="right"] &`]:{marginRight:"14px"}}},{props:({ownerState:o})=>!!o.isRtl&&o.touch,style:{[`.${p.popper}[data-popper-placement*="left"] &`]:{marginLeft:"24px"},[`.${p.popper}[data-popper-placement*="right"] &`]:{marginRight:"24px"}}},{props:({ownerState:o})=>o.touch,style:{[`.${p.popper}[data-popper-placement*="top"] &`]:{marginBottom:"24px"}}},{props:({ownerState:o})=>o.touch,style:{[`.${p.popper}[data-popper-placement*="bottom"] &`]:{marginTop:"24px"}}}]}))),co=x.styled("span",{name:"MuiTooltip",slot:"Arrow"})(G.memoTheme(({theme:r})=>({overflow:"hidden",position:"absolute",width:"1em",height:"0.71em",boxSizing:"border-box",color:r.vars?r.vars.palette.Tooltip.bg:r.alpha(r.palette.grey[700],.9),"&::before":{content:'""',margin:"auto",display:"block",width:"100%",height:"100%",backgroundColor:"currentColor",transform:"rotate(45deg)"}})));let I=!1;const be=new O.Timeout;let R={x:0,y:0};function k(r,o){return(n,...l)=>{o&&o(n,...l),r(n,...l)}}const Oe=s.forwardRef(function(o,n){const l=x.useDefaultProps({props:o,name:"MuiTooltip"}),{arrow:C=!1,children:b,classes:K,components:S={},componentsProps:E={},describeChild:xe=!1,disableFocusListener:Ce=!1,disableHoverListener:X=!1,disableInteractive:Se=!1,disableTouchListener:Ee=!1,enterDelay:J=100,enterNextDelay:Q=0,enterTouchDelay:Me=700,followCursor:F=!1,id:je,leaveDelay:Z=0,leaveTouchDelay:$e=1500,onClose:ee,onOpen:oe,open:te,placement:re="bottom",PopperComponent:pe,PopperProps:f={},slotProps:T={},slots:Ne={},title:y,TransitionComponent:Le,TransitionProps:qe,...ne}=l,d=s.isValidElement(b)?b:g.jsx("span",{children:b}),se=eo.useTheme(),De=Ze.useRtl(),[i,ie]=s.useState(),[U,Ie]=s.useState(null),M=s.useRef(!1),W=Se||F,ae=O.useTimeout(),B=O.useTimeout(),j=O.useTimeout(),le=O.useTimeout(),[ke,ce]=oo.useControlled({controlled:te,default:!1,name:"Tooltip",state:"open"});let m=ke;if(process.env.NODE_ENV!=="production"){const{current:t}=s.useRef(te!==void 0);s.useEffect(()=>{i&&i.disabled&&!t&&y!==""&&i.tagName.toLowerCase()==="button"&&console.warn(["MUI: You are providing a disabled `button` child to the Tooltip component.","A disabled element does not fire events.","Tooltip needs to listen to the child element's events to display the title.","","Add a simple wrapper element, such as a `span`."].join(` `))},[y,i,t])}const z=to.useId(je),P=s.useRef(),$=he.useEventCallback(()=>{P.current!==void 0&&(document.body.style.WebkitUserSelect=P.current,P.current=void 0),le.clear()});s.useEffect(()=>$,[$]);const ue=t=>{be.clear(),I=!0,ce(!0),oe&&!m&&oe(t)},N=he.useEventCallback(t=>{be.start(800+Z,()=>{I=!1}),ce(!1),ee&&m&&ee(t),ae.start(se.transitions.duration.shortest,()=>{M.current=!1})}),L=t=>{M.current&&t.type!=="touchstart"||(i&&i.removeAttribute("title"),B.clear(),j.clear(),J||I&&Q?B.start(I?Q:J,()=>{ue(t)}):ue(t))},V=t=>{B.clear(),j.start(Z,()=>{N(t)})},[,de]=s.useState(!1),me=t=>{ge.isFocusVisible(t.target)||(de(!1),V(t))},fe=t=>{i||ie(t.currentTarget),ge.isFocusVisible(t.target)&&(de(!0),L(t))},Te=t=>{M.current=!0;const u=d.props;u.onTouchStart&&u.onTouchStart(t)},Ae=t=>{Te(t),j.clear(),ae.clear(),$(),P.current=document.body.style.WebkitUserSelect,document.body.style.WebkitUserSelect="none",le.start(Me,()=>{document.body.style.WebkitUserSelect=P.current,L(t)})},Fe=t=>{d.props.onTouchEnd&&d.props.onTouchEnd(t),$(),j.start($e,()=>{N(t)})};s.useEffect(()=>{if(!m)return;function t(u){u.key==="Escape"&&N(u)}return document.addEventListener("keydown",t),()=>{document.removeEventListener("keydown",t)}},[N,m]);const Ue=ro.useForkRef(Pe.getReactElementRef(d),ie,n);!y&&y!==0&&(m=!1);const _=s.useRef(),We=t=>{const u=d.props;u.onMouseMove&&u.onMouseMove(t),R={x:t.clientX,y:t.clientY},_.current&&_.current.update()},w={},H=typeof y=="string";xe?(w.title=!m&&H&&!X?y:null,w["aria-describedby"]=m?z:null):(w["aria-label"]=H?y:null,w["aria-labelledby"]=m&&!H?z:null);const a={...w,...ne,...d.props,className:A.clsx(ne.className,d.props.className),onTouchStart:Te,ref:Ue,...F?{onMouseMove:We}:{}};process.env.NODE_ENV!=="production"&&(a["data-mui-internal-clone-element"]=!0,s.useEffect(()=>{i&&!i.getAttribute("data-mui-internal-clone-element")&&console.error(["MUI: The `children` component of the Tooltip is not forwarding its props correctly.","Please make sure that props are spread on the same element that the ref is applied to."].join(` `))},[i]));const v={};Ee||(a.onTouchStart=Ae,a.onTouchEnd=Fe),X||(a.onMouseOver=k(L,a.onMouseOver),a.onMouseLeave=k(V,a.onMouseLeave),W||(v.onMouseOver=L,v.onMouseLeave=V)),Ce||(a.onFocus=k(fe,a.onFocus),a.onBlur=k(me,a.onBlur),W||(v.onFocus=fe,v.onBlur=me)),process.env.NODE_ENV!=="production"&&d.props.title&&console.error(["MUI: You have provided a `title` prop to the child of <Tooltip />.",`Remove this title prop \`${d.props.title}\` or the Tooltip component.`].join(` `));const h={...l,isRtl:De,arrow:C,disableInteractive:W,placement:re,PopperComponentProp:pe,touch:M.current},c=typeof T.popper=="function"?T.popper(h):T.popper,Be=s.useMemo(()=>{var u,ye;let t=[{name:"arrow",enabled:!!U,options:{element:U,padding:4}}];return(u=f.popperOptions)!=null&&u.modifiers&&(t=t.concat(f.popperOptions.modifiers)),(ye=c==null?void 0:c.popperOptions)!=null&&ye.modifiers&&(t=t.concat(c.popperOptions.modifiers)),{...f.popperOptions,...c==null?void 0:c.popperOptions,modifiers:t}},[U,f.popperOptions,c==null?void 0:c.popperOptions]),Y=io(h),ze=typeof T.transition=="function"?T.transition(h):T.transition,q={slots:{popper:S.Popper,transition:S.Transition??Le,tooltip:S.Tooltip,arrow:S.Arrow,...Ne},slotProps:{arrow:T.arrow??E.arrow,popper:{...f,...c??E.popper},tooltip:T.tooltip??E.tooltip,transition:{...qe,...ze??E.transition}}},[Ve,_e]=D.useSlot("popper",{elementType:ao,externalForwardedProps:q,ownerState:h,className:A.clsx(Y.popper,f==null?void 0:f.className)}),[He,Ye]=D.useSlot("transition",{elementType:po.Grow,externalForwardedProps:q,ownerState:h}),[Ge,Ke]=D.useSlot("tooltip",{elementType:lo,className:Y.tooltip,externalForwardedProps:q,ownerState:h}),[Xe,Je]=D.useSlot("arrow",{elementType:co,className:Y.arrow,externalForwardedProps:q,ownerState:h,ref:Ie});return g.jsxs(s.Fragment,{children:[s.cloneElement(d,a),g.jsx(Ve,{as:pe??we.Popper,placement:re,anchorEl:F?{getBoundingClientRect:()=>({top:R.y,left:R.x,right:R.x,bottom:R.y,width:0,height:0})}:i,popperRef:_,open:i?m:!1,id:z,transition:!0,...v,..._e,popperOptions:Be,children:({TransitionProps:t})=>g.jsx(He,{timeout:se.transitions.duration.shorter,...t,...Ye,children:g.jsxs(Ge,{...Ke,children:[y,C?g.jsx(Xe,{...Je}):null]})})})]})});process.env.NODE_ENV!=="production"&&(Oe.propTypes={arrow:e.PropTypes.bool,children:Pe.elementAcceptingRef.isRequired,classes:e.PropTypes.object,className:e.PropTypes.string,components:e.PropTypes.shape({Arrow:e.PropTypes.elementType,Popper:e.PropTypes.elementType,Tooltip:e.PropTypes.elementType,Transition:e.PropTypes.elementType}),componentsProps:e.PropTypes.shape({arrow:e.PropTypes.object,popper:e.PropTypes.object,tooltip:e.PropTypes.object,transition:e.PropTypes.object}),describeChild:e.PropTypes.bool,disableFocusListener:e.PropTypes.bool,disableHoverListener:e.PropTypes.bool,disableInteractive:e.PropTypes.bool,disableTouchListener:e.PropTypes.bool,enterDelay:e.PropTypes.number,enterNextDelay:e.PropTypes.number,enterTouchDelay:e.PropTypes.number,followCursor:e.PropTypes.bool,id:e.PropTypes.string,leaveDelay:e.PropTypes.number,leaveTouchDelay:e.PropTypes.number,onClose:e.PropTypes.func,onOpen:e.PropTypes.func,open:e.PropTypes.bool,placement:e.PropTypes.oneOf(["auto-end","auto-start","auto","bottom-end","bottom-start","bottom","left-end","left-start","left","right-end","right-start","right","top-end","top-start","top"]),PopperComponent:e.PropTypes.elementType,PopperProps:e.PropTypes.object,slotProps:e.PropTypes.shape({arrow:e.PropTypes.oneOfType([e.PropTypes.func,e.PropTypes.object]),popper:e.PropTypes.oneOfType([e.PropTypes.func,e.PropTypes.object]),tooltip:e.PropTypes.oneOfType([e.PropTypes.func,e.PropTypes.object]),transition:e.PropTypes.oneOfType([e.PropTypes.func,e.PropTypes.object])}),slots:e.PropTypes.shape({arrow:e.PropTypes.elementType,popper:e.PropTypes.elementType,tooltip:e.PropTypes.elementType,transition:e.PropTypes.elementType}),sx:e.PropTypes.oneOfType([e.PropTypes.arrayOf(e.PropTypes.oneOfType([e.PropTypes.func,e.PropTypes.object,e.PropTypes.bool])),e.PropTypes.func,e.PropTypes.object]),title:e.PropTypes.node,TransitionComponent:e.PropTypes.elementType,TransitionProps:e.PropTypes.object});exports.Tooltip=Oe;exports.getTooltipUtilityClass=Re;exports.tooltipClasses=p;