ll-package
Version:
13 lines (12 loc) • 5.21 kB
JavaScript
;Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("../../../../@babel/runtime/helpers/esm/extends.js");require("../../theme/internal.js");const S=require("../../style/index.js"),g=require("../../theme/util/genComponentStyleHook.js"),$=require("../../theme/util/statistic.js"),b=require("../../../../@ctrl/tinycolor/dist/module/index.js"),p=r=>{const{componentCls:i,controlSize:e,dotSize:o,marginFull:t,marginPart:a,colorFillContentHover:d}=r;return{[i]:n.default(n.default({},S.resetComponent(r)),{position:"relative",height:e,margin:`${a}px ${t}px`,padding:0,cursor:"pointer",touchAction:"none","&-vertical":{margin:`${t}px ${a}px`},[`${i}-rail`]:{position:"absolute",backgroundColor:r.colorFillTertiary,borderRadius:r.borderRadiusXS,transition:`background-color ${r.motionDurationMid}`},[`${i}-track`]:{position:"absolute",backgroundColor:r.colorPrimaryBorder,borderRadius:r.borderRadiusXS,transition:`background-color ${r.motionDurationMid}`},"&:hover":{[`${i}-rail`]:{backgroundColor:r.colorFillSecondary},[`${i}-track`]:{backgroundColor:r.colorPrimaryBorderHover},[`${i}-dot`]:{borderColor:d},[`${i}-handle::after`]:{boxShadow:`0 0 0 ${r.handleLineWidth}px ${r.colorPrimaryBorderHover}`},[`${i}-dot-active`]:{borderColor:r.colorPrimary}},[`${i}-handle`]:{position:"absolute",width:r.handleSize,height:r.handleSize,outline:"none",[`${i}-dragging`]:{zIndex:1},"&::before":{content:'""',position:"absolute",insetInlineStart:-r.handleLineWidth,insetBlockStart:-r.handleLineWidth,width:r.handleSize+r.handleLineWidth*2,height:r.handleSize+r.handleLineWidth*2,backgroundColor:"transparent"},"&::after":{content:'""',position:"absolute",insetBlockStart:0,insetInlineStart:0,width:r.handleSize,height:r.handleSize,backgroundColor:r.colorBgElevated,boxShadow:`0 0 0 ${r.handleLineWidth}px ${r.colorPrimaryBorder}`,borderRadius:"50%",cursor:"pointer",transition:`
inset-inline-start ${r.motionDurationMid},
inset-block-start ${r.motionDurationMid},
width ${r.motionDurationMid},
height ${r.motionDurationMid},
box-shadow ${r.motionDurationMid}
`},"&:hover, &:active, &:focus":{"&::before":{insetInlineStart:-((r.handleSizeHover-r.handleSize)/2+r.handleLineWidthHover),insetBlockStart:-((r.handleSizeHover-r.handleSize)/2+r.handleLineWidthHover),width:r.handleSizeHover+r.handleLineWidthHover*2,height:r.handleSizeHover+r.handleLineWidthHover*2},"&::after":{boxShadow:`0 0 0 ${r.handleLineWidthHover}px ${r.colorPrimary}`,width:r.handleSizeHover,height:r.handleSizeHover,insetInlineStart:(r.handleSize-r.handleSizeHover)/2,insetBlockStart:(r.handleSize-r.handleSizeHover)/2}}},[`${i}-mark`]:{position:"absolute",fontSize:r.fontSize},[`${i}-mark-text`]:{position:"absolute",display:"inline-block",color:r.colorTextDescription,textAlign:"center",wordBreak:"keep-all",cursor:"pointer",userSelect:"none","&-active":{color:r.colorText}},[`${i}-step`]:{position:"absolute",background:"transparent",pointerEvents:"none"},[`${i}-dot`]:{position:"absolute",width:o,height:o,backgroundColor:r.colorBgElevated,border:`${r.handleLineWidth}px solid ${r.colorBorderSecondary}`,borderRadius:"50%",cursor:"pointer",transition:`border-color ${r.motionDurationSlow}`,"&-active":{borderColor:r.colorPrimaryBorder}},[`&${i}-disabled`]:{cursor:"not-allowed",[`${i}-rail`]:{backgroundColor:`${r.colorFillSecondary} !important`},[`${i}-track`]:{backgroundColor:`${r.colorTextDisabled} !important`},[`
${i}-dot
`]:{backgroundColor:r.colorBgElevated,borderColor:r.colorTextDisabled,boxShadow:"none",cursor:"not-allowed"},[`${i}-handle::after`]:{backgroundColor:r.colorBgElevated,cursor:"not-allowed",width:r.handleSize,height:r.handleSize,boxShadow:`0 0 0 ${r.handleLineWidth}px ${new b.TinyColor(r.colorTextDisabled).onBackground(r.colorBgContainer).toHexString()}`,insetInlineStart:0,insetBlockStart:0},[`
${i}-mark-text,
${i}-dot
`]:{cursor:"not-allowed !important"}}})}},u=(r,i)=>{const{componentCls:e,railSize:o,handleSize:t,dotSize:a}=r,d=i?"paddingBlock":"paddingInline",c=i?"width":"height",l=i?"height":"width",s=i?"insetBlockStart":"insetInlineStart",h=i?"top":"insetInlineStart";return{[d]:o,[l]:o*3,[`${e}-rail`]:{[c]:"100%",[l]:o},[`${e}-track`]:{[l]:o},[`${e}-handle`]:{[s]:(o*3-t)/2},[`${e}-mark`]:{insetInlineStart:0,top:0,[h]:t,[c]:"100%"},[`${e}-step`]:{insetInlineStart:0,top:0,[h]:o,[c]:"100%",[l]:o},[`${e}-dot`]:{position:"absolute",[s]:(o-a)/2}}},m=r=>{const{componentCls:i,marginPartWithMark:e}=r;return{[`${i}-horizontal`]:n.default(n.default({},u(r,!0)),{[`&${i}-with-marks`]:{marginBottom:e}})}},v=r=>{const{componentCls:i}=r;return{[`${i}-vertical`]:n.default(n.default({},u(r,!1)),{height:"100%"})}},z=g.default("Slider",r=>{const i=$.merge(r,{marginPart:(r.controlHeight-r.controlSize)/2,marginFull:r.controlSize/2,marginPartWithMark:r.controlHeightLG-r.controlSize});return[p(i),m(i),v(i)]},r=>{const e=r.controlHeightLG/4,o=r.controlHeightSM/2,t=r.lineWidth+1,a=r.lineWidth+1*3;return{controlSize:e,railSize:4,handleSize:e,handleSizeHover:o,dotSize:8,handleLineWidth:t,handleLineWidthHover:a}});exports.default=z;