Skip to content

Commit

Permalink
📸 test: 更新快照
Browse files Browse the repository at this point in the history
  • Loading branch information
@arvinxx
arvinxx committed Jul 26, 2022
1 parent 9742445 commit 7001a37
Show file tree
Hide file tree
Showing 3 changed files with 378 additions and 3 deletions.
375 changes: 375 additions & 0 deletions packages/color-picker/tests/__snapshots__/index.test.tsx.snap
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,375 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`ColorPicker 默认状态 1`] = `
<div>
<div
class="avx-sketch-picker"
style="width: 200px; padding: 10px 10px 0px; box-sizing: initial; background: rgb(255, 255, 255); border-radius: 4px; box-shadow: 0 0 0 1px rgba(0,0,0,.15);"
>
<div
style="width: 100%; padding-bottom: 75%; position: relative; overflow: hidden;"
>
<div
style="position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; background: hsl(250, 100%, 50%); border-radius: 4px;"
>
<style>
.saturation-white {
background: -webkit-linear-gradient(to right, #fff, rgba(255,255,255,0));
background: linear-gradient(to right, #fff, rgba(255,255,255,0));
}
.saturation-black {
background: -webkit-linear-gradient(to top, #000, rgba(0,0,0,0));
background: linear-gradient(to top, #000, rgba(0,0,0,0));
}
</style>
<div
class="saturation-white"
style="position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; border-radius: 4px;"
>
<div
class="saturation-black"
style="position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.09), inset 0 0 4px rgba(0,0,0,.15); border-radius: 4px;"
/>
<div
style="position: absolute; top: 70%; left: 68%; cursor: default;"
>
<div
style="width: 4px; height: 4px; box-shadow: 0 0 0 1.5px #fff, inset 0 0 1px 1px rgba(0,0,0,.3),
0 0 1px 2px rgba(0,0,0,.4); border-radius: 50%; cursor: hand; transform: translate(-2px, -2px);"
/>
</div>
</div>
</div>
</div>
<div
style="display: flex;"
>
<div
style="padding: 4px 0px; flex: 1;"
>
<div
style="position: relative; height: 10px; overflow: hidden;"
>
<div
style="position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; border-radius: 2px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15), inset 0 0 4px rgba(0,0,0,.25);"
>
<div
class="hue-horizontal"
style="padding: 0px 2px; position: relative; height: 100%; border-radius: 2px;"
>
<div
style="position: absolute; left: 69.44444444444444%;"
>
<div
style="margin-top: 1px; width: 4px; border-radius: 1px; height: 8px; box-shadow: 0 0 2px rgba(0, 0, 0, .6); background: rgb(255, 255, 255); transform: translateX(-2px);"
/>
</div>
</div>
</div>
</div>
<div
style="position: relative; height: 10px; margin-top: 4px; overflow: hidden;"
>
<div>
<div>
<div
style="position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABmJLR0QA/wD/AP+gvaeTAAAAK0lEQVQ4jWNkYGAQYcAP3uCTZCKgmSAYNWAwGMBIhBq86WTgvTBqABUMAABXlAEzkiIyLgAAAABJRU5ErkJggg==) left;"
/>
</div>
<div />
<div>
<div
style="position: absolute; left: 100%;"
>
<div />
</div>
</div>
</div>
</div>
</div>
<div
style="width: 24px; height: 24px; position: relative; margin-top: 4px; margin-left: 4px; border-radius: 12px; overflow: hidden; cursor: pointer;"
>
<div
style="position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABmJLR0QA/wD/AP+gvaeTAAAAK0lEQVQ4jWNkYGAQYcAP3uCTZCKgmSAYNWAwGMBIhBq86WTgvTBqABUMAABXlAEzkiIyLgAAAABJRU5ErkJggg==) left;"
/>
<div
style="border-radius: 12px; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; background: rgb(34, 25, 77); box-shadow: inset 0 0 0 1px rgba(0,0,0,.15), inset 0 0 4px rgba(0,0,0,.25);"
/>
</div>
</div>
<div
class="sc-bdvvtL heuskx layoutkit-flexbox"
style="margin: 4px 0px;"
>
<div
class="sc-bdvvtL iTLskC avx-color-fields layoutkit-flexbox"
>
<div
class="avx-color-fields-hex"
>
<input
class="avx-color-fields-input"
spellcheck="false"
style="width: 56px; font-family: monospace;"
value="22194D"
/>
</div>
<div>
<input
class="avx-color-fields-input"
spellcheck="false"
value="250"
/>
</div>
<div>
<input
class="avx-color-fields-input"
spellcheck="false"
value="68"
/>
</div>
<div>
<input
class="avx-color-fields-input"
spellcheck="false"
value="30"
/>
</div>
<div>
<input
class="avx-color-fields-input"
spellcheck="false"
value="100"
/>
</div>
</div>
<div
class="sc-bdvvtL hLgIaz avx-color-fields-label-ctn layoutkit-flexbox"
>
<div
class="avx-color-fields-label avx-color-fields-label-hex"
style="cursor: pointer;"
title="点击复制"
>
hex
</div>
<div
class="sc-bdvvtL kiqHeS avx-color-fields-switcher layoutkit-flexbox"
style="padding-left: 5px;"
>
<div>
<select
class="avx-color-fields-select"
>
<option
value="rgb"
>
RGB
</option>
<option
value="hsv"
>
HSV
</option>
</select>
</div>
<div
class="avx-color-fields-label"
>
h
</div>
<div
class="avx-color-fields-label"
>
s
</div>
<div
class="avx-color-fields-label"
>
v
</div>
</div>
<div
class="avx-color-fields-label avx-color-fields-label-alpha"
style="margin-left: 4px;"
>
Alpha
</div>
</div>
</div>
<div
class="flexbox-fix"
style="margin: 0px -10px; padding: 10px 0px 0px 10px; border-top: 1px solid #eee; display: flex; flex-wrap: wrap; position: relative;"
>
<div
style="width: 16px; height: 16px; margin: 0px 10px 10px 0px;"
>
<span>
<div
style="background: rgb(208, 2, 27); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none; border-radius: 3px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);"
tabindex="0"
title="#D0021B"
/>
</span>
</div>
<div
style="width: 16px; height: 16px; margin: 0px 10px 10px 0px;"
>
<span>
<div
style="background: rgb(245, 166, 35); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none; border-radius: 3px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);"
tabindex="0"
title="#F5A623"
/>
</span>
</div>
<div
style="width: 16px; height: 16px; margin: 0px 10px 10px 0px;"
>
<span>
<div
style="background: rgb(248, 231, 28); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none; border-radius: 3px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);"
tabindex="0"
title="#F8E71C"
/>
</span>
</div>
<div
style="width: 16px; height: 16px; margin: 0px 10px 10px 0px;"
>
<span>
<div
style="background: rgb(139, 87, 42); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none; border-radius: 3px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);"
tabindex="0"
title="#8B572A"
/>
</span>
</div>
<div
style="width: 16px; height: 16px; margin: 0px 10px 10px 0px;"
>
<span>
<div
style="background: rgb(126, 211, 33); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none; border-radius: 3px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);"
tabindex="0"
title="#7ED321"
/>
</span>
</div>
<div
style="width: 16px; height: 16px; margin: 0px 10px 10px 0px;"
>
<span>
<div
style="background: rgb(65, 117, 5); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none; border-radius: 3px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);"
tabindex="0"
title="#417505"
/>
</span>
</div>
<div
style="width: 16px; height: 16px; margin: 0px 10px 10px 0px;"
>
<span>
<div
style="background: rgb(189, 16, 224); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none; border-radius: 3px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);"
tabindex="0"
title="#BD10E0"
/>
</span>
</div>
<div
style="width: 16px; height: 16px; margin: 0px 10px 10px 0px;"
>
<span>
<div
style="background: rgb(144, 19, 254); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none; border-radius: 3px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);"
tabindex="0"
title="#9013FE"
/>
</span>
</div>
<div
style="width: 16px; height: 16px; margin: 0px 10px 10px 0px;"
>
<span>
<div
style="background: rgb(74, 144, 226); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none; border-radius: 3px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);"
tabindex="0"
title="#4A90E2"
/>
</span>
</div>
<div
style="width: 16px; height: 16px; margin: 0px 10px 10px 0px;"
>
<span>
<div
style="background: rgb(80, 227, 194); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none; border-radius: 3px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);"
tabindex="0"
title="#50E3C2"
/>
</span>
</div>
<div
style="width: 16px; height: 16px; margin: 0px 10px 10px 0px;"
>
<span>
<div
style="background: rgb(184, 233, 134); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none; border-radius: 3px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);"
tabindex="0"
title="#B8E986"
/>
</span>
</div>
<div
style="width: 16px; height: 16px; margin: 0px 10px 10px 0px;"
>
<span>
<div
style="background: rgb(0, 0, 0); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none; border-radius: 3px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);"
tabindex="0"
title="#000000"
/>
</span>
</div>
<div
style="width: 16px; height: 16px; margin: 0px 10px 10px 0px;"
>
<span>
<div
style="background: rgb(74, 74, 74); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none; border-radius: 3px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);"
tabindex="0"
title="#4A4A4A"
/>
</span>
</div>
<div
style="width: 16px; height: 16px; margin: 0px 10px 10px 0px;"
>
<span>
<div
style="background: rgb(155, 155, 155); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none; border-radius: 3px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);"
tabindex="0"
title="#9B9B9B"
/>
</span>
</div>
<div
style="width: 16px; height: 16px; margin: 0px 10px 10px 0px;"
>
<span>
<div
style="background: rgb(255, 255, 255); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none; border-radius: 3px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);"
tabindex="0"
title="#FFFFFF"
/>
</span>
</div>
</div>
</div>
</div>
`;
2 changes: 1 addition & 1 deletion packages/layout-kit/tests/__snapshots__/index.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
exports[`Flexbox gap 1`] = `
<div>
<div
class="sc-bdvvtL nqSUR layoutkit-flexbox"
class="sc-bdvvtL heuskx layoutkit-flexbox"
>
<div>
1
Expand Down
Loading

0 comments on commit 7001a37

Please sign in to comment.