feat(switch): support variant mode

[YHoney7]

Checklist

List of tasks you have already done and plan to do.

• Fix linting errors
• Tests have been added / updated (or snapshots)

Change information

Describe your modifications here.

Issues

close #1550

Related Links

Links related to this pr.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
varlet	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Mar 29, 2024 6:47am
varlet-ui-playground	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Mar 29, 2024 6:47am

[vercel]

@YHoney7 is attempting to deploy a commit to the varletjs Team on Vercel.

A member of the Team first needs to authorize it.

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 92.79%. Comparing base (6588b4a) to head (c0ce8ee).
Report is 4 commits behind head on dev.

Additional details and impacted files

@@            Coverage Diff             @@
##              dev    #1552      +/-   ##
==========================================
- Coverage   92.81%   92.79%   -0.03%     
==========================================
  Files         305      305              
  Lines        7167     7173       +6     
  Branches     1780     1786       +6     
==========================================
+ Hits         6652     6656       +4     
- Misses        449      451       +2     
  Partials       66       66              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[haoziqaq]

playground 显示似乎有些问题。

[haoziqaq]

还有一个问题就是 ripple 似乎有点过于大了。

[haoziqaq]

props.size 似乎在 variant 模式下没有适配

[YHoney7]

我看下playground是有问题, ripple的尺寸目前是对比figma标注的尺寸的

[BeADre]

参考md3, 间距还有样式好像不太对

[YHoney7]

我们看到的效果似乎不一样

[YHoney7]

@BeADre 分为两种形式，目前实现的是没有图标的，但当前这个看来还缺个hover和拖动实现开关的效果

[BeADre]

上面的是我们的，下面这个是md3的， 样式和间距都不太一样

[YHoney7]

收到👌

[chouchouji]

影响到了form的快照，看下为啥，如果有必要就更新下快照

[YHoney7]

好的

[BeADre]

样式上还有点小问题，官方是hover的时候只有水波纹，按下去里面的滑块才会变大，还有一个就是亮色模式并打开switch的时候hover效果会导致滑块颜色改变，这里颜色应该是不会变化的

[YHoney7]

收到, 已经在改进了

[BeADre]

我点击switch其他的地方，switch的块应该也会变大，这是官方的实现

[YHoney7]

明白， 我看了你发的示例，在开和关的情况下还有个小回弹的效果，但是在另个示例中却没有这个回弹效果