Process completed with exit code 1.

Error: Snapshot `Sidenav Component > Notification > should match snapshot with notification 1` mismatched - Expected + Received @@ -48,11 +48,11 @@ <button class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="inbox" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -65,11 +65,11 @@ > Inbox </p> </div> <div - class="flex rounded-full px-2 py-1 transition-all duration-300 bg-gray-10 text-gray-60 opacity-100 delay-0" + class="flex rounded-full px-2 py-1 bg-gray-10 text-gray-60 opacity-100 delay-0" > <p class="text-xs font-medium" > 5 @@ -80,11 +80,11 @@ <button class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="sent" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -96,21 +96,18 @@ class="font-medium whitespace-nowrap overflow-hidden transition-all duration-300 opacity-100 delay-0" > Sent </p> </div> - <div - class="flex rounded-full px-2 py-1 transition-all duration-300 bg-gray-10 text-gray-60 opacity-0 invisible delay-300" - /> </div> </button> <button class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="drafts" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -123,11 +120,11 @@ > Drafts </p> </div> <div - class="flex rounded-full px-2 py-1 transition-all duration-300 bg-gray-10 text-gray-60 opacity-100 delay-0" + class="flex rounded-full px-2 py-1 bg-gray-10 text-gray-60 opacity-100 delay-0" > <p class="text-xs font-medium" > 2 @@ -138,11 +135,11 @@ <button class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="labels" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -154,13 +151,10 @@ class="font-medium whitespace-nowrap overflow-hidden transition-all duration-300 opacity-100 delay-0" > Labels </p> </div> - <div - class="flex rounded-full px-2 py-1 transition-all duration-300 b

Error: Snapshot `Sidenav Component > should match snapshot with primary action 1` mismatched - Expected + Received @@ -54,11 +54,11 @@ <button class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="inbox" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -71,11 +71,11 @@ > Inbox </p> </div> <div - class="flex rounded-full px-2 py-1 transition-all duration-300 bg-gray-10 text-gray-60 opacity-100 delay-0" + class="flex rounded-full px-2 py-1 bg-gray-10 text-gray-60 opacity-100 delay-0" > <p class="text-xs font-medium" > 5 @@ -86,11 +86,11 @@ <button class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="sent" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -102,21 +102,18 @@ class="font-medium whitespace-nowrap overflow-hidden transition-all duration-300 opacity-100 delay-0" > Sent </p> </div> - <div - class="flex rounded-full px-2 py-1 transition-all duration-300 bg-gray-10 text-gray-60 opacity-0 invisible delay-300" - /> </div> </button> <button class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="drafts" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -129,11 +126,11 @@ > Drafts </p> </div> <div - class="flex rounded-full px-2 py-1 transition-all duration-300 bg-gray-10 text-gray-60 opacity-100 delay-0" + class="flex rounded-full px-2 py-1 bg-gray-10 text-gray-60 opacity-100 delay-0" > <p class="text-xs font-medium" > 2 @@ -144,11 +141,11 @@ <button class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="labels" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -160,13 +157,10 @@ class="font-medium whitespace-nowrap overflow-hidden transition-all duration-300 opacity-100 delay-0" > Labels </p> </div> - <div - class="flex rounded-full px-2 py-1 transition-all duration-300 bg-gray-10 t

Error: Snapshot `Sidenav Component > should match snapshot with storage 1` mismatched - Expected + Received @@ -48,11 +48,11 @@ <button class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="inbox" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -65,11 +65,11 @@ > Inbox </p> </div> <div - class="flex rounded-full px-2 py-1 transition-all duration-300 bg-gray-10 text-gray-60 opacity-100 delay-0" + class="flex rounded-full px-2 py-1 bg-gray-10 text-gray-60 opacity-100 delay-0" > <p class="text-xs font-medium" > 5 @@ -80,11 +80,11 @@ <button class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="sent" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -96,21 +96,18 @@ class="font-medium whitespace-nowrap overflow-hidden transition-all duration-300 opacity-100 delay-0" > Sent </p> </div> - <div - class="flex rounded-full px-2 py-1 transition-all duration-300 bg-gray-10 text-gray-60 opacity-0 invisible delay-300" - /> </div> </button> <button class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="drafts" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -123,11 +120,11 @@ > Drafts </p> </div> <div - class="flex rounded-full px-2 py-1 transition-all duration-300 bg-gray-10 text-gray-60 opacity-100 delay-0" + class="flex rounded-full px-2 py-1 bg-gray-10 text-gray-60 opacity-100 delay-0" > <p class="text-xs font-medium" > 2 @@ -138,11 +135,11 @@ <button class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="labels" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -154,13 +151,10 @@ class="font-medium whitespace-nowrap overflow-hidden transition-all duration-300 opacity-100 delay-0" > Labels </p> </div> - <div - class="flex rounded-full px-2 py-1 transition-all duration-300 bg-gray-10 text-gray-

Error: Snapshot `Sidenav Component > should match snapshot when collapsed 1` mismatched - Expected + Received @@ -75,11 +75,11 @@ class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="inbox" title="Inbox" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -92,11 +92,11 @@ > Inbox </p> </div> <div - class="flex rounded-full px-2 py-1 transition-all duration-300 bg-gray-10 text-gray-60 opacity-0 invisible delay-300" + class="flex rounded-full px-2 py-1 bg-gray-10 text-gray-60 opacity-0 invisible delay-300" > <p class="text-xs font-medium" > 5 @@ -108,11 +108,11 @@ class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="sent" title="Sent" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -124,22 +124,19 @@ class="font-medium whitespace-nowrap overflow-hidden transition-all duration-300 opacity-0 delay-200" > Sent </p> </div> - <div - class="flex rounded-full px-2 py-1 transition-all duration-300 bg-gray-10 text-gray-60 opacity-0 invisible delay-300" - /> </div> </button> <button class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="drafts" title="Drafts" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -152,11 +149,11 @@ > Drafts </p> </div> <div - class="flex rounded-full px-2 py-1 transition-all duration-300 bg-gray-10 text-gray-60 opacity-0 invisible delay-300" + class="flex rounded-full px-2 py-1 bg-gray-10 text-gray-60 opacity-0 invisible delay-300" > <p class="text-xs font-medium" > 2 @@ -168,11 +165,11 @@ class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="labels" title="Labels" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -184,13 +181,10 @@ class="font-medium whitespace-nowrap overflow-hidden transition-all duration-300 opacity-0 delay-200" > Labels </p> </div> - <div -

Error: Snapshot `Sidenav Component > should match snapshot 1` mismatched - Expected + Received @@ -48,11 +48,11 @@ <button class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="inbox" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -65,11 +65,11 @@ > Inbox </p> </div> <div - class="flex rounded-full px-2 py-1 transition-all duration-300 bg-gray-10 text-gray-60 opacity-100 delay-0" + class="flex rounded-full px-2 py-1 bg-gray-10 text-gray-60 opacity-100 delay-0" > <p class="text-xs font-medium" > 5 @@ -80,11 +80,11 @@ <button class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="sent" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -96,21 +96,18 @@ class="font-medium whitespace-nowrap overflow-hidden transition-all duration-300 opacity-100 delay-0" > Sent </p> </div> - <div - class="flex rounded-full px-2 py-1 transition-all duration-300 bg-gray-10 text-gray-60 opacity-0 invisible delay-300" - /> </div> </button> <button class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="drafts" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -123,11 +120,11 @@ > Drafts </p> </div> <div - class="flex rounded-full px-2 py-1 transition-all duration-300 bg-gray-10 text-gray-60 opacity-100 delay-0" + class="flex rounded-full px-2 py-1 bg-gray-10 text-gray-60 opacity-100 delay-0" > <p class="text-xs font-medium" > 2 @@ -138,11 +135,11 @@ <button class="flex w-full flex-col overflow-hidden focus-visible:bg-gray-10 rounded-lg hover:bg-gray-5 " data-cy="labels" > <div - class="flex flex-row px-2.5 py-2 w-full items-center justify-between min-h-[36px]" + class="flex flex-row px-2.5 py-2 w-full items-center justify-between h-9" > <div class="flex flex-row gap-3 items-center text-gray-80" > <svg @@ -154,13 +151,10 @@ class="font-medium whitespace-nowrap overflow-hidden transition-all duration-300 opacity-100 delay-0" > Labels </p> </div> - <div - class="flex rounded-full px-2 py-1 transition-all duration-300 bg-gray-10 text-gray-60 opacity-0

Error: Snapshot `TrayList > should match snapshot 1` mismatched - Expected + Received @@ -12,21 +12,45 @@ <div> <div class="flex items-center w-full flex-col" > <button - class="flex flex-col border-b border-gray-10 text-left gap-2 w-full py-3 px-5 " + class="group flex flex-col border-b border-gray-10 text-left gap-2 w-full py-3 px-5 " > <div class="flex flex-row w-full gap-2" > - <img + <div + class="relative h-7 w-7 flex-shrink-0" + > + <div + class="absolute inset-0 flex items-center justify-center transition-opacity opacity-100 group-hover:opacity-0" + > + <img - class=" shrink-0 select-none rounded-full object-cover" + class=" shrink-0 select-none rounded-full object-cover" - draggable="false" + draggable="false" - src="https://example.com/avatar1.jpg" + src="https://example.com/avatar1.jpg" - style="width: 28px; height: 28px;" + style="width: 28px; height: 28px;" - /> + /> + </div> + <div + class="absolute z-30 inset-0 flex items-center justify-center transition-opacity opacity-0 group-hover:opacity-100" + > + <label + class="relative h-5 w-5 rounded focus-within:outline-primary undefined" + > + <div + class="relative flex h-5 w-5 cursor-pointer flex-col items-center justify-center rounded border text-white border-gray-30 hover:border-gray-40" + /> + <input + class="base-checkbox h-0 w-0 appearance-none opacity-0" + readonly="" + type="checkbox" + /> + </label> + </div> + </div> <div class="flex flex-col w-full" > <div class="flex flex-row w-full justify-between " @@ -67,21 +91,45 @@ </div> <div class="flex items-center w-full flex-col" > <button - class="flex flex-col border-b border-gray-10 text-left gap-2 w-full py-3 px-5 " + class="group flex flex-col border-b border-gray-10 text-left gap-2 w-full py-3 px-5 " > <div class="flex flex-row w-full gap-2" > - <img + <div + class="relative h-7 w-7 flex-shrink-0" + > + <div + class="absolute inset-0 flex items-center justify-center transition-opacity opacity-100 group-hover:opacity-0" + > + <img - class=" shrink-0 select-none rounded-full object-cover" + class=" shrink-0 select-none rounded-full object-cover" - draggable="false" + draggable="false" - src="https://example.com/avatar2.jpg" + src="https://example.com/avatar2.jpg" - style="width: 28px; height: 28px;" + style="width: 28px; height: 28px;" - /> + /> + </div> + <div + class="absolute z-30 inset-0 flex items-center justify-center transition-opacity opacity-0

Error: Snapshot `MessageCheap > should match snapshot 1` mismatched - Expected + Received @@ -1,21 +1,60 @@ { "asFragment": [Function], "baseElement": <body> <div> <button - class="flex flex-col border-b border-gray-10 text-left gap-2 w-full py-3 px-5 " + class="group flex flex-col border-b border-gray-10 text-left gap-2 w-full py-3 px-5 " > <div class="flex flex-row w-full gap-2" > - <img - class=" shrink-0 select-none rounded-full object-cover" + <div + class="relative h-7 w-7 flex-shrink-0" + > + <div + class="absolute inset-0 flex items-center justify-center transition-opacity opacity-100 group-hover:opacity-0" + > + <img + class=" shrink-0 select-none rounded-full object-cover" - draggable="false" + draggable="false" - src="https://example.com/avatar.jpg" + src="https://example.com/avatar.jpg" - style="width: 28px; height: 28px;" + style="width: 28px; height: 28px;" - /> + /> + </div> + <div + class="absolute z-30 inset-0 flex items-center justify-center transition-opacity opacity-0 group-hover:opacity-100" + > + <label + class="relative h-5 w-5 rounded focus-within:outline-primary undefined" + > + <div + class="relative flex h-5 w-5 cursor-pointer flex-col items-center justify-center rounded border text-white border-primary bg-primary" + > + <svg + class="absolute -inset-px" + fill="none" + height="20" + viewBox="0 0 20 20" + width="20" + xmlns="http://www.w3.org/2000/svg" + > + <path + d="m8.85955 15c.38202 0 .67978-.1461.88202-.4551l5.23593-8.00557c.1461-.22472.2079-.43259.2079-.62922 0-.52809-.3933-.91011-.9326-.91011-.3708 0-.6011.13483-.8258.48876l-4.59554 7.24724-2.33146-2.8933c-.20787-.24719-.43259-.35955-.74719-.35955-.54495 0-.9382.38764-.9382.91575 0 .2359.07303.4438.27528.6741l2.89887 3.5113c.24158.2865.51124.4157.87079.4157z" + fill="currentColor" + /> + </svg> + </div> + <input + checked="" + class="base-checkbox h-0 w-0 appearance-none opacity-0" + readonly="" + type="checkbox" + /> + </label> + </div> + </div> <div class="flex flex-col w-full" > <div class="flex flex-row w-full justify-between " @@ -55,21 +94,60 @@ </button> </div> </body>, "container": <div> <button - class="flex flex-col border-b border-gray-10 text-left gap-2 w-full py-3 px-5 " + class="group flex flex-col border-b border-gray-10 text-left gap-2 w-full py-3 px-5 " > <div class="flex flex-row w-full gap-2" > - <img + <div + class="relative h-7 w-7 flex-shrink-0" + > + <div + class="absolute inset-0 flex items-center justify-center transition-opacity opacity-100 group-hover:opacity-0" + > + <img - class=" shrink-0 select-none rounded-full object-cover" + class=" shrink-0 select-none rounded-full object-cover" - draggable="false" + draggable="false" - src="https://example.com/avatar.jpg" + src="https://example.com/avatar.jpg" - style="width: 28px; height: 28px;" + style="width: 28px; height: 28px;" - /> + /> + </div> + <div +