@chief-editor/ui/lib/components/slider/SliderDragger.js

UI Component for chief editor

"use strict";var __importStar=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var r={};if(null!=e)for(var t in e)Object.hasOwnProperty.call(e,t)&&(r[t]=e[t]);return r.default=e,r};Object.defineProperty(exports,"__esModule",{value:!0});var popper_1=require("@rc-hooks/popper"),region_1=require("@rc-hooks/region"),use_1=require("@rc-hooks/use"),react_1=__importStar(require("react")),hooks_1=require("../../hooks"),TooltipContent_1=require("../tooltip/TooltipContent");exports.SliderDragger=react_1.memo((function(e){var r=e.name,t=e.format,o=e.tooltip,a=e.draggable,i=void 0!==a&&a,n=e.invalid,l=void 0!==n&&n,s=use_1.useGuid(),u=react_1.useMemo((function(){return[s]}),[]),p=react_1.useRef(null),c=region_1.useDragger(p,r,i),_=c.offset,g=c.dragging,d=c.precision,f=react_1.useState(!1),m=f[0],v=f[1],h=hooks_1.usePrefixCls("slider-dragger",{invalid:l,dragging:g,selected:!0,disabled:!i}),C=hooks_1.usePrefixCls("slider-dragger-pop-wrapper"),k=react_1.useCallback((function(){return o||(t?t(d.x):d.x)}),[o,t,d]);return react_1.default.createElement(react_1.Fragment,null,react_1.default.createElement(popper_1.RcHoverTrigger,{ref:p,className:h,triggerId:s,style:{left:_.x+"px"}}),react_1.default.createElement(TooltipContent_1.TooltipContent,{refType:"trigger",refId:s,triggerIds:u,placement:"top",show:g||m,onVisibleChange:v,preventOverflow:!1,arrow:!0,wrapperClassName:C,content:k}))}));