build(deps-dev): bump chromatic from 11.28.0 to 11.28.2 #219
dependabot[bot]Annotations
10 errors
|
src/components/common/Popover/Popover.test.tsx > Component: Popover > Snapshot > Default:
src/components/common/Popover/Popover.test.tsx#L13
Error: Snapshot `Component: Popover > Snapshot > Default 1` mismatched
- Expected
+ Received
<DocumentFragment>
- <button>
+ <button
+ type="button"
+ >
Trigger
</button>
</DocumentFragment>
❯ src/components/common/Popover/Popover.test.tsx:13:25
|
|
src/components/common/NumberField/NumberField.test.tsx > Component: NumberField > Snapshot > Default:
src/components/common/NumberField/NumberField.test.tsx#L13
Error: Snapshot `Component: NumberField > Snapshot > Default 1` mismatched
- Expected
+ Received
@@ -1,24 +1,25 @@
<DocumentFragment>
<div
class="flex flex-row items-center justify-between"
>
<label
- class="text-sm font-semibold text-gray-600"
+ class="font-semibold text-gray-600 text-sm"
/>
<div
class="w-1/2"
role="group"
>
<input
aria-roledescription="Number field"
autocomplete="off"
autocorrect="off"
- class="w-full rounded border-none bg-gray-100 py-1 px-2 text-sm font-semibold transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0"
+ class="w-full rounded border-none bg-gray-100 px-2 py-1 font-semibold text-sm transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0"
- id="react-aria-:r0:"
+ id="react-aria-«r0»"
inputmode="numeric"
spellcheck="false"
+ tabindex="0"
type="text"
value=""
/>
</div>
</div>
❯ src/components/common/NumberField/NumberField.test.tsx:13:25
|
|
src/components/common/NumberArrayField/NumberArrayField.test.tsx > Component: NumberArrayField > Snapshot > Default:
src/components/common/NumberArrayField/NumberArrayField.test.tsx#L13
Error: Snapshot `Component: NumberArrayField > Snapshot > Default 1` mismatched
- Expected
+ Received
@@ -1,68 +1,70 @@
<DocumentFragment>
<div
class="flex flex-row items-center justify-between"
>
<label
- class="text-sm font-semibold text-gray-600"
+ class="font-semibold text-gray-600 text-sm"
>
Numbers
</label>
<div
class="flex w-1/2 flex-row gap-1"
>
<div
- class="flex flex-row items-center justify-between gap-2 rounded bg-gray-100 py-0.5 px-2"
+ class="flex flex-row items-center justify-between gap-2 rounded bg-gray-100 px-2 py-0.5"
>
<label
- class="text-sm font-semibold text-gray-500"
+ class="font-semibold text-gray-500 text-sm"
- for="react-aria-:r0:"
+ for="react-aria-«r0»"
- id="react-aria-:r2:"
+ id="react-aria-«r2»"
>
X
</label>
<div
class="w-full"
role="group"
>
<input
- aria-labelledby="react-aria-:r2:"
+ aria-labelledby="react-aria-«r2»"
aria-roledescription="Number field"
autocomplete="off"
autocorrect="off"
- class="w-full rounded border-none py-0.5 px-1 text-sm font-semibold transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0"
+ class="w-full rounded border-none px-1 py-0.5 font-semibold text-sm transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0"
- id="react-aria-:r0:"
+ id="react-aria-«r0»"
inputmode="numeric"
spellcheck="false"
+ tabindex="0"
type="text"
value="0"
/>
</div>
</div>
<div
- class="flex flex-row items-center justify-between gap-2 rounded bg-gray-100 py-0.5 px-2"
+ class="flex flex-row items-center justify-between gap-2 rounded bg-gray-100 px-2 py-0.5"
>
<label
- class="text-sm font-semibold text-gray-500"
+ class="font-semibold text-gray-500 text-sm"
- for="react-aria-:r8:"
+ for="react-aria-«r8»"
- id="react-aria-:ra:"
+ id="react-aria-«ra»"
>
Y
</label>
<div
class="w-full"
role="group"
>
<input
- aria-labelledby="react-aria-:ra:"
+ aria-labelledby="react-aria-«ra»"
aria-roledescription="Number field"
autocomplete="off"
autocorrect="off"
- class="w-full rounded border-none py-0.5 px-1 text-sm font-semibold transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0"
+ class="w-full rounded border-none px-1 py-0.5 font-semibold text-sm transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0"
- id="react-aria-:r8:"
+ id="react-aria-«r8»"
inputmode="numeric"
spellcheck="false"
+ tabindex="0"
type="text"
value="0"
/>
</div>
</div>
❯ src/components/common/NumberArrayField/NumberArrayField.test.tsx:13:25
|
|
src/components/common/FilterInputField/FilterInputField.test.tsx > Component: FilterInputField > Snapshot > Default:
src/components/common/FilterInputField/FilterInputField.test.tsx#L13
Error: Snapshot `Component: FilterInputField > Snapshot > Default 1` mismatched
❯ src/components/common/FilterInputField/FilterInputField.test.tsx:13:25
|
|
src/components/common/ComboBox/ComboBox.test.tsx > Component: ComboBox > Snapshot > Default:
src/components/common/ComboBox/ComboBox.test.tsx#L13
Error: Snapshot `Component: ComboBox > Snapshot > Default 1` mismatched
- Expected
+ Received
@@ -5,30 +5,31 @@
<div
class="font-semibold text-gray-600"
/>
<div
aria-expanded="false"
- class="flex w-1/2 cursor-pointer flex-row rounded border-none bg-gray-100 py-1 px-2 text-sm font-semibold transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0 aria-expanded:bg-gray-200"
+ class="flex w-1/2 cursor-pointer flex-row rounded border-none bg-gray-100 px-2 py-1 font-semibold text-sm transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0 aria-expanded:bg-gray-200"
>
<input
aria-autocomplete="list"
aria-expanded="false"
autocomplete="off"
autocorrect="off"
class="w-full flex-1 border-none focus-visible:outline-0"
- id="react-aria-:r2:"
+ id="react-aria-«r3»"
role="combobox"
spellcheck="false"
+ tabindex="0"
type="text"
value=""
/>
<button
aria-expanded="false"
aria-haspopup="listbox"
aria-label="Show suggestions"
class="cursor-pointer"
- id="react-aria-:r0:"
+ id="react-aria-«r0»"
>
<svg
aria-hidden="true"
class="w-4"
viewBox="0 -960 960 960"
❯ src/components/common/ComboBox/ComboBox.test.tsx:13:25
|
|
src/components/common/ColorField/ColorField.test.tsx > Component: ColorField > Snapshot > Default:
src/components/common/ColorField/ColorField.test.tsx#L13
Error: Snapshot `Component: ColorField > Snapshot > Default 1` mismatched
- Expected
+ Received
@@ -1,51 +1,54 @@
<DocumentFragment>
<div
class="flex flex-row items-center justify-between"
>
<label
- class="text-sm font-semibold text-gray-600"
+ class="font-semibold text-gray-600 text-sm"
/>
<div
- class="flex w-1/2 flex-row items-center gap-2 rounded border-none bg-gray-100 py-1 px-2 text-sm font-semibold transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0"
+ class="flex w-1/2 flex-row items-center gap-2 rounded border-none bg-gray-100 px-2 py-1 font-semibold text-sm transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0"
>
<div
class="h-4 w-4"
>
<button
class="cursor-pointer transition-colors hover:bg-gray-100 active:bg-gray-300 h-full w-full border border-gray-300 focus:outline-0"
+ tabindex="0"
type="button"
>
<div
aria-label="transparent"
aria-roledescription="color swatch"
class="h-full w-full"
- id="react-aria-:re:"
+ id="react-aria-«re»"
role="img"
style="background-color: rgba(255, 255, 255, 0);"
/>
</button>
</div>
<input
autocomplete="off"
autocorrect="off"
class="min-w-10 flex-2 border-none focus-visible:outline-0"
- id="react-aria-:r0:"
+ id="react-aria-«r0»"
role="textbox"
spellcheck="false"
+ tabindex="0"
type="text"
value=""
/>
<input
- aria-labelledby="react-aria-:r8:"
+ aria-labelledby="react-aria-«r8»"
aria-roledescription="Number field"
autocomplete="off"
autocorrect="off"
class="min-w-8 flex-1 border-none focus-visible:outline-0"
- id="react-aria-:r6:"
+ id="react-aria-«r6»"
inputmode="numeric"
spellcheck="false"
+ tabindex="0"
type="text"
value=""
/>
</div>
</div>
❯ src/components/common/ColorField/ColorField.test.tsx:13:25
|
|
src/components/common/Button/Button.test.tsx > Component: Button > Snapshot > Default:
src/components/common/Button/Button.test.tsx#L13
Error: Snapshot `Component: Button > Snapshot > Default 1` mismatched
- Expected
+ Received
<DocumentFragment>
<button
class="cursor-pointer transition-colors hover:bg-gray-100 active:bg-gray-300"
+ tabindex="0"
type="button"
>
Button
</button>
</DocumentFragment>
❯ src/components/common/Button/Button.test.tsx:13:25
|
|
src/components/common/BoxRadioGroup/BoxRadioGroup.test.tsx > Component: BoxRadioGroup > Snapshot > Default:
src/components/common/BoxRadioGroup/BoxRadioGroup.test.tsx#L13
Error: Snapshot `Component: BoxRadioGroup > Snapshot > Default 1` mismatched
- Expected
+ Received
@@ -1,55 +1,55 @@
<DocumentFragment>
<div
- aria-labelledby="react-aria-:r1:"
+ aria-labelledby="react-aria-«r1»"
aria-orientation="vertical"
class="flex items-center justify-between text-sm"
- id="react-aria-:r0:"
+ id="react-aria-«r0»"
role="radiogroup"
>
<span
class="font-semibold text-gray-600"
- id="react-aria-:r1:"
+ id="react-aria-«r1»"
>
Numbers
</span>
<div
class="flex w-1/2 flex-row items-center justify-end gap-1"
>
<label
aria-checked="false"
- class="block cursor-pointer rounded border-none bg-gray-100 py-1 px-2 text-sm font-semibold transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0 aria-checked:bg-gray-300"
+ class="block cursor-pointer rounded border-none bg-gray-100 px-2 py-1 font-semibold text-sm transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0 aria-checked:bg-gray-300"
>
<input
class="sr-only"
- name="react-aria-:r5:"
+ name="react-aria-«r5»"
tabindex="0"
type="radio"
value="1"
/>
One
</label>
<label
aria-checked="false"
- class="block cursor-pointer rounded border-none bg-gray-100 py-1 px-2 text-sm font-semibold transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0 aria-checked:bg-gray-300"
+ class="block cursor-pointer rounded border-none bg-gray-100 px-2 py-1 font-semibold text-sm transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0 aria-checked:bg-gray-300"
>
<input
class="sr-only"
- name="react-aria-:r5:"
+ name="react-aria-«r5»"
tabindex="0"
type="radio"
value="2"
/>
Two
</label>
<label
aria-checked="false"
- class="block cursor-pointer rounded border-none bg-gray-100 py-1 px-2 text-sm font-semibold transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0 aria-checked:bg-gray-300"
+ class="block cursor-pointer rounded border-none bg-gray-100 px-2 py-1 font-semibold text-sm transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0 aria-checked:bg-gray-300"
>
<input
class="sr-only"
- name="react-aria-:r5:"
+ name="react-aria-«r5»"
tabindex="0"
type="radio"
value="3"
/>
Three
❯ src/components/common/BoxRadioGroup/BoxRadioGroup.test.tsx:13:25
|
|
src/components/editor/PropertiesPanel/PropertiesPanel.test.tsx > Component: PropertiesPanel > Snapshot > Default:
src/components/editor/PropertiesPanel/PropertiesPanel.test.tsx#L13
Error: Snapshot `Component: PropertiesPanel > Snapshot > Default 1` mismatched
- Expected
+ Received
@@ -7,33 +7,33 @@
>
<div
class="flex flex-col gap-2 px-4"
>
<h3
- class="font-montserrat text-sm font-semibold"
+ class="font-montserrat font-semibold text-sm"
>
General
</h3>
<div
- aria-labelledby="react-aria-:r1:"
+ aria-labelledby="react-aria-«r1»"
class="h-auto w-full horizontal"
- id="react-aria-:r0:"
+ id="react-aria-«r0»"
role="group"
>
<div
class="flex items-center justify-between"
>
<label
- class="text-sm font-semibold text-gray-600"
+ class="font-semibold text-gray-600 text-sm"
- id="react-aria-:r1:"
+ id="react-aria-«r1»"
>
Zoom Range
</label>
<output
aria-live="off"
- class="text-sm font-semibold text-gray-800"
+ class="font-semibold text-gray-800 text-sm"
- for="react-aria-:r1:-0 react-aria-:r1:-1"
+ for="react-aria-«r1»-0 react-aria-«r1»-1"
>
0 - 24
</output>
</div>
<div
@@ -52,14 +52,14 @@
style="border: 0px; clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap;"
>
<input
aria-describedby=""
aria-details=""
- aria-labelledby="react-aria-:r1:"
+ aria-labelledby="react-aria-«r1»"
aria-orientation="horizontal"
aria-valuetext="0"
- id="react-aria-:r1:-0"
+ id="react-aria-«r1»-0"
max="24"
min="0"
step="1"
tabindex="0"
type="range"
@@ -75,14 +75,14 @@
style="border: 0px; clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap;"
>
<input
aria-describedby=""
aria-details=""
- aria-labelledby="react-aria-:r1:"
+ aria-labelledby="react-aria-«r1»"
aria-orientation="horizontal"
aria-valuetext="24"
- id="react-aria-:r1:-1"
+ id="react-aria-«r1»-1"
max="24"
min="0"
step="1"
tabindex="0"
type="range"
@@ -95,131 +95,136 @@
</div>
<div
class="flex flex-col gap-2 px-4"
>
<h3
- class="font-montserrat text-sm font-semibold"
+ class="font-montserrat font-semibold text-sm"
>
Paint
</h3>
<div
class="flex flex-row items-center justify-between"
>
<label
- class="text-sm font-semibold text-gray-600"
+ class="font-semibold text-gray-600 text-sm"
- for="react-aria-:r9:"
+ for="react-aria-«r9»"
- id="react-aria-:rb:"
+ id="react-aria-«rb»"
>
Opacity
</label>
<div
class="w-1/2"
role="group"
>
<input
- aria-labelledby="react-aria-:rb:"
+ aria-labelledby="react-aria-«rb»"
aria-roledescription="Number field"
autocomplete="off"
autocorrect="off"
- class="w-full rounded border-none bg-gray-100 py-1 px-2 text-sm font-semibold transition-colors hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-0"
+
|
|
src/components/editor/NavigationPanel/NavigationPanel.test.tsx > Component: NavigationPanel > Snapshot > Default:
src/components/editor/NavigationPanel/NavigationPanel.test.tsx#L13
Error: Snapshot `Component: NavigationPanel > Snapshot > Default 1` mismatched
- Expected
+ Received
@@ -2,11 +2,11 @@
<div
class="pointer-events-auto flex h-auto w-auto flex-col rounded-lg border border-gray-300 bg-white"
style="height: 500px;"
>
<div
- class="flex flex-col gap-2 border-b border-b-gray-300 py-4 px-4"
+ class="flex flex-col gap-2 border-b border-b-gray-300 px-4 py-4"
>
<h1
class="font-[Montserrat] font-bold"
>
Kartore
@@ -16,11 +16,11 @@
>
OSM Liberty
</h2>
</div>
<div
- class="border-b border-b-gray-300 py-2 px-4 font-[Montserrat] text-sm font-medium text-gray-500"
+ class="border-b border-b-gray-300 px-4 py-2 font-[Montserrat] font-medium text-gray-500 text-sm"
>
<h2>
Layers
</h2>
</div>
@@ -29,11 +29,11 @@
>
<div
aria-describedby="DndDescribedBy-0"
aria-disabled="false"
aria-roledescription="sortable"
- class="flex w-full items-center gap-2 py-2 px-4 text-sm text-gray-800 pointer-events-auto bg-gray-200"
+ class="flex w-full items-center gap-2 px-4 py-2 text-gray-800 text-sm pointer-events-auto bg-gray-200"
role="button"
style="transition: transform 200ms ease;"
tabindex="0"
>
<svg
@@ -53,11 +53,11 @@
</div>
<div
aria-describedby="DndDescribedBy-0"
aria-disabled="false"
aria-roledescription="sortable"
- class="flex w-full items-center gap-2 py-2 px-4 text-sm text-gray-800 pointer-events-auto hover:bg-gray-100"
+ class="flex w-full items-center gap-2 px-4 py-2 text-gray-800 text-sm pointer-events-auto hover:bg-gray-100"
role="button"
style="transition: transform 200ms ease;"
tabindex="0"
>
<svg
@@ -77,11 +77,11 @@
</div>
<div
aria-describedby="DndDescribedBy-0"
aria-disabled="false"
aria-roledescription="sortable"
- class="flex w-full items-center gap-2 py-2 px-4 text-sm text-gray-800 pointer-events-auto hover:bg-gray-100"
+ class="flex w-full items-center gap-2 px-4 py-2 text-gray-800 text-sm pointer-events-auto hover:bg-gray-100"
role="button"
style="transition: transform 200ms ease;"
tabindex="0"
>
<svg
@@ -101,11 +101,11 @@
</div>
<div
aria-describedby="DndDescribedBy-0"
aria-disabled="false"
aria-roledescription="sortable"
- class="flex w-full items-center gap-2 py-2 px-4 text-sm text-gray-800 pointer-events-auto hover:bg-gray-100"
+ class="flex w-full items-center gap-2 px-4 py-2 text-gray-800 text-sm pointer-events-auto hover:bg-gray-100"
role="button"
style="transition: transform 200ms ease;"
tabindex="0"
>
<svg
@@ -126,11 +126,11 @@
</div>
<div
aria-describedby="DndDescribedBy-0"
aria-disabled="false"
aria-roledescription="sortable"
- class="flex w-full items-center gap-2 py-2 px-4 text-sm text-gray-800 pointer-events-auto hover:bg-gray-100"
+ class="flex w-full items-center gap-2 px-4 py-2 text-gray-800 text-sm pointer-events-auto hover:bg-gray-100"
role="button"
style="transition: transform 200ms ease;"
tabindex="0"
>
<svg
@@ -150,11 +150,11 @@
</div>
<div
aria-describedby="DndDescribedBy-0"
aria-disabled="false"
aria-roledescription="sortable"
- class="flex w-full items-center gap-2 py-2 px-4 text-sm text-gray-800 pointer-events-auto hover:bg-gray-100"
+ class="flex w-full items-center gap-2 px-4 py-2 text-gray-800 text-sm pointer-events-auto hover:bg-gray-100"
role="button"
style="transition: transform 200ms ease;"
tabindex="0"
>
<svg
@@ -174,11 +174,11 @@
</div>
|