switch-CsMGEdLR.js 7.7 KB

1
  1. import{a as e,n as t}from"./react-dom-stZKkA6x.js";import{$n as n,Dr as r,En as i,Gt as a,In as o,Kt as s,Mn as c,Mr as l,Rn as u,Vn as d,bn as f,ir as p,jn as m,jr as h,on as g,sn as _,tr as v,wn as y}from"./jsx-runtime-dm82oUI8.js";var b=e(t()),x=e(l()),S=[`prefixCls`,`className`,`checked`,`defaultChecked`,`disabled`,`loadingIcon`,`checkedChildren`,`unCheckedChildren`,`onClick`,`onChange`,`onKeyDown`],C=b.forwardRef(function(e,t){var n,i=e.prefixCls,a=i===void 0?`rc-switch`:i,o=e.className,s=e.checked,l=e.defaultChecked,u=e.disabled,d=e.loadingIcon,f=e.checkedChildren,m=e.unCheckedChildren,g=e.onClick,y=e.onChange,C=e.onKeyDown,w=v(e,S),T=p(c(!1,{value:s,defaultValue:l}),2),E=T[0],D=T[1];function O(e,t){var n=E;return u||(n=e,D(n),y?.(n,t)),n}function k(e){e.which===_.LEFT?O(!1,e):e.which===_.RIGHT&&O(!0,e),C?.(e)}function A(e){var t=O(!E,e);g?.(t,e)}var j=(0,x.default)(a,o,(n={},r(n,`${a}-checked`,E),r(n,`${a}-disabled`,u),n));return b.createElement(`button`,h({},w,{type:`button`,role:`switch`,"aria-checked":E,disabled:u,className:j,ref:t,onKeyDown:k,onClick:A}),d,b.createElement(`span`,{className:`${a}-inner`},b.createElement(`span`,{className:`${a}-inner-checked`},f),b.createElement(`span`,{className:`${a}-inner-unchecked`},m)))});C.displayName=`Switch`;var w=e=>{let{componentCls:t,trackHeightSM:r,trackPadding:i,trackMinWidthSM:a,innerMinMarginSM:o,innerMaxMarginSM:s,handleSizeSM:c,calc:l}=e,u=`${t}-inner`,d=n(l(c).add(l(i).mul(2)).equal()),f=n(l(s).mul(2).equal());return{[t]:{[`&${t}-small`]:{minWidth:a,height:r,lineHeight:n(r),[`${t}-inner`]:{paddingInlineStart:s,paddingInlineEnd:o,[`${u}-checked, ${u}-unchecked`]:{minHeight:r},[`${u}-checked`]:{marginInlineStart:`calc(-100% + ${d} - ${f})`,marginInlineEnd:`calc(100% - ${d} + ${f})`},[`${u}-unchecked`]:{marginTop:l(r).mul(-1).equal(),marginInlineStart:0,marginInlineEnd:0}},[`${t}-handle`]:{width:c,height:c},[`${t}-loading-icon`]:{top:l(l(c).sub(e.switchLoadingIconSize)).div(2).equal(),fontSize:e.switchLoadingIconSize},[`&${t}-checked`]:{[`${t}-inner`]:{paddingInlineStart:o,paddingInlineEnd:s,[`${u}-checked`]:{marginInlineStart:0,marginInlineEnd:0},[`${u}-unchecked`]:{marginInlineStart:`calc(100% - ${d} + ${f})`,marginInlineEnd:`calc(-100% + ${d} - ${f})`}},[`${t}-handle`]:{insetInlineStart:`calc(100% - ${n(l(c).add(i).equal())})`}},[`&:not(${t}-disabled):active`]:{[`&:not(${t}-checked) ${u}`]:{[`${u}-unchecked`]:{marginInlineStart:l(e.marginXXS).div(2).equal(),marginInlineEnd:l(e.marginXXS).mul(-1).div(2).equal()}},[`&${t}-checked ${u}`]:{[`${u}-checked`]:{marginInlineStart:l(e.marginXXS).mul(-1).div(2).equal(),marginInlineEnd:l(e.marginXXS).div(2).equal()}}}}}}},T=e=>{let{componentCls:t,handleSize:n,calc:r}=e;return{[t]:{[`${t}-loading-icon${e.iconCls}`]:{position:`relative`,top:r(r(n).sub(e.fontSize)).div(2).equal(),color:e.switchLoadingIconColor,verticalAlign:`top`},[`&${t}-checked ${t}-loading-icon`]:{color:e.switchColor}}}},E=e=>{let{componentCls:t,trackPadding:r,handleBg:i,handleShadow:a,handleSize:o,calc:s}=e,c=`${t}-handle`;return{[t]:{[c]:{position:`absolute`,top:r,insetInlineStart:r,width:o,height:o,transition:`all ${e.switchDuration} ease-in-out`,"&::before":{position:`absolute`,top:0,insetInlineEnd:0,bottom:0,insetInlineStart:0,backgroundColor:i,borderRadius:s(o).div(2).equal(),boxShadow:a,transition:`all ${e.switchDuration} ease-in-out`,content:`""`}},[`&${t}-checked ${c}`]:{insetInlineStart:`calc(100% - ${n(s(o).add(r).equal())})`},[`&:not(${t}-disabled):active`]:{[`${c}::before`]:{insetInlineEnd:e.switchHandleActiveInset,insetInlineStart:0},[`&${t}-checked ${c}::before`]:{insetInlineEnd:0,insetInlineStart:e.switchHandleActiveInset}}}}},D=e=>{let{componentCls:t,trackHeight:r,trackPadding:i,innerMinMargin:a,innerMaxMargin:o,handleSize:s,calc:c}=e,l=`${t}-inner`,u=n(c(s).add(c(i).mul(2)).equal()),d=n(c(o).mul(2).equal());return{[t]:{[l]:{display:`block`,overflow:`hidden`,borderRadius:100,height:`100%`,paddingInlineStart:o,paddingInlineEnd:a,transition:`padding-inline-start ${e.switchDuration} ease-in-out, padding-inline-end ${e.switchDuration} ease-in-out`,[`${l}-checked, ${l}-unchecked`]:{display:`block`,color:e.colorTextLightSolid,fontSize:e.fontSizeSM,transition:`margin-inline-start ${e.switchDuration} ease-in-out, margin-inline-end ${e.switchDuration} ease-in-out`,pointerEvents:`none`,minHeight:r},[`${l}-checked`]:{marginInlineStart:`calc(-100% + ${u} - ${d})`,marginInlineEnd:`calc(100% - ${u} + ${d})`},[`${l}-unchecked`]:{marginTop:c(r).mul(-1).equal(),marginInlineStart:0,marginInlineEnd:0}},[`&${t}-checked ${l}`]:{paddingInlineStart:a,paddingInlineEnd:o,[`${l}-checked`]:{marginInlineStart:0,marginInlineEnd:0},[`${l}-unchecked`]:{marginInlineStart:`calc(100% - ${u} + ${d})`,marginInlineEnd:`calc(-100% + ${u} - ${d})`}},[`&:not(${t}-disabled):active`]:{[`&:not(${t}-checked) ${l}`]:{[`${l}-unchecked`]:{marginInlineStart:c(i).mul(2).equal(),marginInlineEnd:c(i).mul(-1).mul(2).equal()}},[`&${t}-checked ${l}`]:{[`${l}-checked`]:{marginInlineStart:c(i).mul(-1).mul(2).equal(),marginInlineEnd:c(i).mul(2).equal()}}}}}},O=e=>{let{componentCls:t,trackHeight:r,trackMinWidth:a}=e;return{[t]:Object.assign(Object.assign(Object.assign(Object.assign({},i(e)),{position:`relative`,display:`inline-block`,boxSizing:`border-box`,minWidth:a,height:r,lineHeight:n(r),verticalAlign:`middle`,background:e.colorTextQuaternary,border:`0`,borderRadius:100,cursor:`pointer`,transition:`all ${e.motionDurationMid}`,userSelect:`none`,[`&:hover:not(${t}-disabled)`]:{background:e.colorTextTertiary}}),y(e)),{[`&${t}-checked`]:{background:e.switchColor,[`&:hover:not(${t}-disabled)`]:{background:e.colorPrimaryHover}},[`&${t}-loading, &${t}-disabled`]:{cursor:`not-allowed`,opacity:e.switchDisabledOpacity,"*":{boxShadow:`none`,cursor:`not-allowed`}},[`&${t}-rtl`]:{direction:`rtl`}})}},k=f(`Switch`,e=>{let t=m(e,{switchDuration:e.motionDurationMid,switchColor:e.colorPrimary,switchDisabledOpacity:e.opacityLoading,switchLoadingIconSize:e.calc(e.fontSizeIcon).mul(.75).equal(),switchLoadingIconColor:`rgba(0, 0, 0, ${e.opacityLoading})`,switchHandleActiveInset:`-30%`});return[O(t),D(t),E(t),T(t),w(t)]},e=>{let{fontSize:t,lineHeight:n,controlHeight:r,colorWhite:i}=e,a=t*n,o=r/2,s=a-4,c=o-4;return{trackHeight:a,trackHeightSM:o,trackMinWidth:s*2+8,trackMinWidthSM:c*2+4,trackPadding:2,handleBg:i,handleSize:s,handleSizeSM:c,handleShadow:`0 2px 4px 0 ${new d(`#00230b`).setA(.2).toRgbString()}`,innerMinMargin:s/2,innerMaxMargin:s+2+4,innerMinMarginSM:c/2,innerMaxMarginSM:c+2+4}}),A=function(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(e!=null&&typeof Object.getOwnPropertySymbols==`function`)for(var i=0,r=Object.getOwnPropertySymbols(e);i<r.length;i++)t.indexOf(r[i])<0&&Object.prototype.propertyIsEnumerable.call(e,r[i])&&(n[r[i]]=e[r[i]]);return n},j=b.forwardRef((e,t)=>{let{prefixCls:n,size:r,disabled:i,loading:l,className:d,rootClassName:f,style:p,checked:m,value:h,defaultChecked:_,defaultValue:v,onChange:y}=e,S=A(e,[`prefixCls`,`size`,`disabled`,`loading`,`className`,`rootClassName`,`style`,`checked`,`value`,`defaultChecked`,`defaultValue`,`onChange`]),[w,T]=c(!1,{value:m??h,defaultValue:_??v}),{getPrefixCls:E,direction:D,switch:O}=b.useContext(u),j=b.useContext(o),M=(i??j)||l,N=E(`switch`,n),P=b.createElement(`div`,{className:`${N}-handle`},l&&b.createElement(g,{className:`${N}-loading-icon`})),[F,I,L]=k(N),R=a(r),z=(0,x.default)(O?.className,{[`${N}-small`]:R===`small`,[`${N}-loading`]:l,[`${N}-rtl`]:D===`rtl`},d,f,I,L),B=Object.assign(Object.assign({},O?.style),p);return F(b.createElement(s,{component:`Switch`,disabled:M},b.createElement(C,Object.assign({},S,{checked:w,onChange:(...e)=>{T(e[0]),y?.apply(void 0,e)},prefixCls:N,className:z,style:B,disabled:M,ref:t,loadingIcon:P}))))});j.__ANT_SWITCH=!0;export{j as t};