@chief-editor/ui/es/components/slider/SliderMark.js

UI Component for chief editor

import{RcHoverTrigger}from"@rc-hooks/popper";import{AxisType,useAxisMark}from"@rc-hooks/region";import{useGuid}from"@rc-hooks/use";import React,{Fragment,memo,useCallback,useMemo,useRef}from"react";import{usePrefixCls}from"../../hooks";import{PopoverWrapper}from"../popover/PopoverWrapper";export var SliderMark=memo((function(e){var r=e.value,o=e.format,t=e.tooltip,a=void 0!==t&&t,s=e.invalid,i=void 0!==s&&s,p=e.placement,l=void 0===p?"center":p,m=useGuid(),n=useMemo((function(){return[m]}),[]),c=useAxisMark(AxisType.HORIZONTAL,r),u=c.selected,f=c.offset,d=c.precisionValue,v=useRef(null),g=usePrefixCls("slider-mark",{invalid:i,selected:u}),k=usePrefixCls("slider-mark-pop"),x=usePrefixCls("slider-mark-pop-wrapper"),R=useCallback((function(){return a||(o?o(d):d)}),[a,o,d]);return React.createElement(Fragment,null,React.createElement(RcHoverTrigger,{ref:v,className:g,triggerId:m,style:{left:f+"px"}}),React.createElement(PopoverWrapper,{arrow:!1,className:k,zIndex:0,refType:"trigger",refId:m,triggerIds:n,wrapperClassName:x,placement:"left"===l?"bottom-start":"right"===l?"bottom-end":"bottom",show:!0,disableAnimation:!0,preventOverflow:!1,scaleAnimation:!1,getPopper:R}))}));