From 9546872186eb7ed5e67e61cbe4b331a4f09bb2a3 Mon Sep 17 00:00:00 2001
From: YulianaYarema <59561179+yarema184@users.noreply.github.com>
Date: Mon, 12 Feb 2024 08:50:43 +0200
Subject: [PATCH 1/6] fix: MDS-989 add initialFocus to Modal (#2542)

* fix: MDS-989 add initialFocus to Modal

* fix: MDS-989 after PR review
---
 workspaces/core/src/modal/Modal.tsx | 41 +++++++++++++++++++++++------
 1 file changed, 33 insertions(+), 8 deletions(-)

diff --git a/workspaces/core/src/modal/Modal.tsx b/workspaces/core/src/modal/Modal.tsx
index a56bf2a7d2..cbdbebe174 100644
--- a/workspaces/core/src/modal/Modal.tsx
+++ b/workspaces/core/src/modal/Modal.tsx
@@ -1,4 +1,10 @@
-import React, { ReactNode } from 'react';
+import React, {
+  ReactNode,
+  useRef,
+  useState,
+  useEffect,
+  MutableRefObject,
+} from 'react';
 import { Dialog, Transition } from '@headlessui/react';
 import Backdrop from '../backdrop/Backdrop';
 import mergeClassnames from '../mergeClassnames/mergeClassnames';
@@ -8,19 +14,38 @@ type WithChildren<T = {}> = T & { children?: ReactNode };
 type ModalRootProps = {
   open: boolean;
   onClose: () => void;
+  initialFocus?: React.MutableRefObject<HTMLElement | null>;
 };
 
 type ModalComponentProps = (
   props: WithChildren<ModalRootProps>
 ) => React.ReactElement | null;
 
-const ModalRoot: ModalComponentProps = ({ open, onClose, children }) => (
-  <Transition appear show={open} as={React.Fragment}>
-    <Dialog as="div" className="relative z-10" onClose={onClose}>
-      {children}
-    </Dialog>
-  </Transition>
-);
+const ModalRoot: ModalComponentProps = ({
+  open,
+  onClose,
+  children,
+  initialFocus,
+}) => {
+  const defFocus = useRef(null);
+  const [focusElRef, setFocusElRef] =
+    useState<MutableRefObject<HTMLElement | null>>();
+  useEffect(() => {
+    setFocusElRef(initialFocus ? initialFocus : defFocus);
+  }, [initialFocus, defFocus]);
+  return (
+    <Transition appear show={open} as={React.Fragment}>
+      <Dialog
+        as="div"
+        className="relative z-10"
+        onClose={onClose}
+        initialFocus={focusElRef}
+      >
+        {children}
+      </Dialog>
+    </Transition>
+  );
+};
 
 type PanelProps = {
   className?: string;

From daebd2815f6f02f7839de9bdf05d0dc7fffd7f50 Mon Sep 17 00:00:00 2001
From: Zsolt <zsolt.essig@icloud.com>
Date: Mon, 12 Feb 2024 00:08:28 -0800
Subject: [PATCH 2/6] feat: TagsInput remove last element on Backspace (#2528)

* feat: TagsInput remove last element on Backspace

* Update TagsInput.tsx
---
 next-docs/pages/components/tagsInput.tsx    | 13 ++++++++-----
 workspaces/core/src/tagsInput/TagsInput.tsx |  5 +++++
 2 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/next-docs/pages/components/tagsInput.tsx b/next-docs/pages/components/tagsInput.tsx
index 52b7915f9d..78d54c52d0 100644
--- a/next-docs/pages/components/tagsInput.tsx
+++ b/next-docs/pages/components/tagsInput.tsx
@@ -25,10 +25,13 @@ const PageTagsInput = () => {
       >
         <p>{text}</p>
         <p>
-          These selected text entries are being dispalyed as tags. Tags represent a set of interactive keywords that help organise and categorise objects.
+          These selected text entries are being displayed as tags. Tags
+          represent a set of interactive keywords that help organize and
+          categorize objects.
         </p>
         <p>
-          Tags can be added by pressing the Enter key or removed by the mouse click from the input element.
+          Tags can be added by pressing the Enter key or removed by Backspace
+          key or the mouse click from the input element.
         </p>
       </ComponentPageDescription>
 
@@ -120,15 +123,15 @@ const PageTagsInput = () => {
             type: '(value: string) => void;',
             required: false,
             default: '-',
-            description: 'The function to select the text and append it to the tag set.',
+            description:
+              'The function to select the text and append it to the tag set.',
           },
           {
             name: 'onClear',
             type: '(index: number) => void',
             required: false,
             default: '-',
-            description:
-              'The function to remove the selected tag.',
+            description: 'The function to remove the selected tag.',
           },
         ]}
       />
diff --git a/workspaces/core/src/tagsInput/TagsInput.tsx b/workspaces/core/src/tagsInput/TagsInput.tsx
index e661f7c5c3..973a2da438 100644
--- a/workspaces/core/src/tagsInput/TagsInput.tsx
+++ b/workspaces/core/src/tagsInput/TagsInput.tsx
@@ -85,6 +85,11 @@ const TagsInputRoot = forwardRef<HTMLSpanElement, TagsInputRootProps>(
                   onEnter((e.target as HTMLInputElement).value);
                 e.code === 'Enter' &&
                   ((e.target as HTMLInputElement).value = '');
+                e.code === 'Backspace' &&
+                  (e.target as HTMLInputElement).value === '' &&
+                  selected.length !== 0 &&
+                  onClear &&
+                  onClear(selected.length - 1);
               }}
               onFocus={() => setIsFocused(true)}
               onBlur={() => setIsFocused(false)}

From bd6bef26f0357e8e621017164119abb58323222b Mon Sep 17 00:00:00 2001
From: Zsolt <zsolt.essig@icloud.com>
Date: Mon, 12 Feb 2024 00:12:57 -0800
Subject: [PATCH 3/6] fix: Fix avatar to set backgroundImage to none instead of
 `url(undefined)` when imageUrl is not set (#2522)

* Fix avatar to not set backgroundImage if imageUrl is not set

* fix: set backgroundImage to none when imageUrl is undefined

---------

Co-authored-by: Zsolt Essig-Kacso <zsolt.essig-kacso@scoutbee.com>
---
 packages/components/src/avatar/Avatar.tsx     | 2 +-
 packages/core/src/avatar/Avatar.tsx           | 3 +--
 packages/core/src/avatar/styles/Wrapper.ts    | 4 ++--
 workspaces/core/src/avatar/styles/Wrapper.tsx | 2 +-
 4 files changed, 5 insertions(+), 6 deletions(-)

diff --git a/packages/components/src/avatar/Avatar.tsx b/packages/components/src/avatar/Avatar.tsx
index 5a7dfe0a91..2a1fa9057d 100644
--- a/packages/components/src/avatar/Avatar.tsx
+++ b/packages/components/src/avatar/Avatar.tsx
@@ -35,7 +35,7 @@ const AvatarWrapper = styled.div<AvatarProps>(
       display: 'flex',
       alignItems: 'center',
       justifyContent: 'center',
-      backgroundImage: `url(${imageUrl})`,
+      backgroundImage: imageUrl ? `url(${imageUrl})`: 'none',
       backgroundSize: 'cover',
     },
     size === 'xsmall' && {
diff --git a/packages/core/src/avatar/Avatar.tsx b/packages/core/src/avatar/Avatar.tsx
index 7374281063..6a302d60cc 100644
--- a/packages/core/src/avatar/Avatar.tsx
+++ b/packages/core/src/avatar/Avatar.tsx
@@ -9,7 +9,7 @@ import type AvatarProps from './private/types/AvatarProps';
 
 const Avatar: React.FC<AvatarProps> = ({
   name,
-  imageUrl = '',
+  imageUrl,
   color = 'bulma.100',
   backgroundColor = 'gohan.100',
   size = Size.MEDIUM,
@@ -27,7 +27,6 @@ const Avatar: React.FC<AvatarProps> = ({
     ) : (
       <Wrapper
         size={size}
-        imageUrl={imageUrl}
         color={color}
         backgroundColor={backgroundColor}
       >
diff --git a/packages/core/src/avatar/styles/Wrapper.ts b/packages/core/src/avatar/styles/Wrapper.ts
index 055ee9485c..82c2b21fc5 100644
--- a/packages/core/src/avatar/styles/Wrapper.ts
+++ b/packages/core/src/avatar/styles/Wrapper.ts
@@ -1,7 +1,7 @@
 import { themed } from '@heathmont/moon-utils';
 import styled from 'styled-components';
-import setWrapperSize from '../private/utils/setWrapperSize';
 import type AvatarProps from '../private/types/AvatarProps';
+import setWrapperSize from '../private/utils/setWrapperSize';
 
 const Wrapper = styled.div<AvatarProps>(
   ({ size, imageUrl, color, backgroundColor, theme }) => [
@@ -14,7 +14,7 @@ const Wrapper = styled.div<AvatarProps>(
       display: 'flex',
       alignItems: 'center',
       justifyContent: 'center',
-      backgroundImage: `url(${imageUrl})`,
+      backgroundImage: imageUrl ? `url(${imageUrl})` : 'none',
       backgroundSize: 'cover',
     },
     setWrapperSize(size),
diff --git a/workspaces/core/src/avatar/styles/Wrapper.tsx b/workspaces/core/src/avatar/styles/Wrapper.tsx
index 96aee11800..3507b481ec 100644
--- a/workspaces/core/src/avatar/styles/Wrapper.tsx
+++ b/workspaces/core/src/avatar/styles/Wrapper.tsx
@@ -23,7 +23,7 @@ const Wrapper = ({
       getBorderRadius(size, isRounded),
       className
     )}
-    style={{ backgroundImage: `url('${imageUrl}')` }}
+    style={{ backgroundImage: imageUrl ? `url('${imageUrl}')` : 'none' }}
   >
     {children}
   </div>

From 4a1fc417a2eaede5b8a7f22715234501586ee8c6 Mon Sep 17 00:00:00 2001
From: Dmytro Kireiev <dmytro.kireiev@gmail.com>
Date: Mon, 12 Feb 2024 17:26:15 +0200
Subject: [PATCH 4/6] =?UTF-8?q?Revert=20"fix:=20Fix=20avatar=20to=20set=20?=
 =?UTF-8?q?backgroundImage=20to=20none=20instead=20of=20`url(undefi?=
 =?UTF-8?q?=E2=80=A6"=20(#2546)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This reverts commit bd6bef26f0357e8e621017164119abb58323222b.
---
 packages/components/src/avatar/Avatar.tsx     | 2 +-
 packages/core/src/avatar/Avatar.tsx           | 3 ++-
 packages/core/src/avatar/styles/Wrapper.ts    | 4 ++--
 workspaces/core/src/avatar/styles/Wrapper.tsx | 2 +-
 4 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/packages/components/src/avatar/Avatar.tsx b/packages/components/src/avatar/Avatar.tsx
index 2a1fa9057d..5a7dfe0a91 100644
--- a/packages/components/src/avatar/Avatar.tsx
+++ b/packages/components/src/avatar/Avatar.tsx
@@ -35,7 +35,7 @@ const AvatarWrapper = styled.div<AvatarProps>(
       display: 'flex',
       alignItems: 'center',
       justifyContent: 'center',
-      backgroundImage: imageUrl ? `url(${imageUrl})`: 'none',
+      backgroundImage: `url(${imageUrl})`,
       backgroundSize: 'cover',
     },
     size === 'xsmall' && {
diff --git a/packages/core/src/avatar/Avatar.tsx b/packages/core/src/avatar/Avatar.tsx
index 6a302d60cc..7374281063 100644
--- a/packages/core/src/avatar/Avatar.tsx
+++ b/packages/core/src/avatar/Avatar.tsx
@@ -9,7 +9,7 @@ import type AvatarProps from './private/types/AvatarProps';
 
 const Avatar: React.FC<AvatarProps> = ({
   name,
-  imageUrl,
+  imageUrl = '',
   color = 'bulma.100',
   backgroundColor = 'gohan.100',
   size = Size.MEDIUM,
@@ -27,6 +27,7 @@ const Avatar: React.FC<AvatarProps> = ({
     ) : (
       <Wrapper
         size={size}
+        imageUrl={imageUrl}
         color={color}
         backgroundColor={backgroundColor}
       >
diff --git a/packages/core/src/avatar/styles/Wrapper.ts b/packages/core/src/avatar/styles/Wrapper.ts
index 82c2b21fc5..055ee9485c 100644
--- a/packages/core/src/avatar/styles/Wrapper.ts
+++ b/packages/core/src/avatar/styles/Wrapper.ts
@@ -1,7 +1,7 @@
 import { themed } from '@heathmont/moon-utils';
 import styled from 'styled-components';
-import type AvatarProps from '../private/types/AvatarProps';
 import setWrapperSize from '../private/utils/setWrapperSize';
+import type AvatarProps from '../private/types/AvatarProps';
 
 const Wrapper = styled.div<AvatarProps>(
   ({ size, imageUrl, color, backgroundColor, theme }) => [
@@ -14,7 +14,7 @@ const Wrapper = styled.div<AvatarProps>(
       display: 'flex',
       alignItems: 'center',
       justifyContent: 'center',
-      backgroundImage: imageUrl ? `url(${imageUrl})` : 'none',
+      backgroundImage: `url(${imageUrl})`,
       backgroundSize: 'cover',
     },
     setWrapperSize(size),
diff --git a/workspaces/core/src/avatar/styles/Wrapper.tsx b/workspaces/core/src/avatar/styles/Wrapper.tsx
index 3507b481ec..96aee11800 100644
--- a/workspaces/core/src/avatar/styles/Wrapper.tsx
+++ b/workspaces/core/src/avatar/styles/Wrapper.tsx
@@ -23,7 +23,7 @@ const Wrapper = ({
       getBorderRadius(size, isRounded),
       className
     )}
-    style={{ backgroundImage: imageUrl ? `url('${imageUrl}')` : 'none' }}
+    style={{ backgroundImage: `url('${imageUrl}')` }}
   >
     {children}
   </div>

From 13573ff8ff55e3cb4379464cdcfad46e907788a1 Mon Sep 17 00:00:00 2001
From: Dmytro Kireiev <dmytro.kireiev@gmail.com>
Date: Tue, 13 Feb 2024 10:37:44 +0200
Subject: [PATCH 5/6] fix: Avatar undefined background (#2547)

---
 .../__snapshots__/index.test.tsx.snap         | 104 ------------------
 workspaces/core/src/avatar/styles/Wrapper.tsx |   6 +-
 2 files changed, 3 insertions(+), 107 deletions(-)

diff --git a/next-docs/public/examples/avatar/__tests__/__snapshots__/index.test.tsx.snap b/next-docs/public/examples/avatar/__tests__/__snapshots__/index.test.tsx.snap
index 89e77efd1f..a595b9355b 100644
--- a/next-docs/public/examples/avatar/__tests__/__snapshots__/index.test.tsx.snap
+++ b/next-docs/public/examples/avatar/__tests__/__snapshots__/index.test.tsx.snap
@@ -10,7 +10,6 @@ Object {
       >
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -37,7 +36,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           md
@@ -65,7 +63,6 @@ Object {
     >
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -92,7 +89,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         md
@@ -177,7 +173,6 @@ Object {
       >
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2 text-chichi"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -201,7 +196,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2 bg-piccolo text-goten"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -225,7 +219,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2 rounded-full"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -249,7 +242,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -276,7 +268,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -310,7 +301,6 @@ Object {
     >
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2 text-chichi"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -334,7 +324,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2 bg-piccolo text-goten"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -358,7 +347,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2 rounded-full"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -382,7 +370,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -409,7 +396,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -500,7 +486,6 @@ Object {
       >
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -531,7 +516,6 @@ Object {
     >
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -622,7 +606,6 @@ Object {
         >
           <div
             class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-6 w-6 text-moon-10-caption rounded-moon-i-xs [&_.status]:w-2 [&_.status]:h-2 [&_.status]:border"
-            style="background-image: url(undefined);"
           >
              
             <svg
@@ -646,7 +629,6 @@ Object {
           </div>
           <div
             class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-8 w-8 text-moon-12 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-            style="background-image: url(undefined);"
           >
              
             <svg
@@ -670,7 +652,6 @@ Object {
           </div>
           <div
             class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-            style="background-image: url(undefined);"
           >
              
             <svg
@@ -694,7 +675,6 @@ Object {
           </div>
           <div
             class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-12 w-12 text-moon-16 rounded-moon-i-sm [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-            style="background-image: url(undefined);"
           >
              
             <svg
@@ -718,7 +698,6 @@ Object {
           </div>
           <div
             class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-14 w-14 text-moon-16 rounded-moon-i-sm [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-            style="background-image: url(undefined);"
           >
              
             <svg
@@ -742,7 +721,6 @@ Object {
           </div>
           <div
             class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-16 w-16 text-moon-20 rounded-moon-i-md [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-            style="background-image: url(undefined);"
           >
              
             <svg
@@ -770,7 +748,6 @@ Object {
         >
           <div
             class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-6 w-6 text-moon-10-caption rounded-moon-i-xs [&_.status]:w-2 [&_.status]:h-2 [&_.status]:border"
-            style="background-image: url(undefined);"
           >
              
             xs
@@ -778,7 +755,6 @@ Object {
           </div>
           <div
             class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-8 w-8 text-moon-12 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-            style="background-image: url(undefined);"
           >
              
             sm
@@ -786,7 +762,6 @@ Object {
           </div>
           <div
             class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-            style="background-image: url(undefined);"
           >
              
             md
@@ -794,7 +769,6 @@ Object {
           </div>
           <div
             class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-12 w-12 text-moon-16 rounded-moon-i-sm [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-            style="background-image: url(undefined);"
           >
              
             lg
@@ -802,7 +776,6 @@ Object {
           </div>
           <div
             class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-14 w-14 text-moon-16 rounded-moon-i-sm [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-            style="background-image: url(undefined);"
           >
              
             xl
@@ -810,7 +783,6 @@ Object {
           </div>
           <div
             class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-16 w-16 text-moon-20 rounded-moon-i-md [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-            style="background-image: url(undefined);"
           >
              
             2xl
@@ -875,7 +847,6 @@ Object {
       >
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-6 w-6 text-moon-10-caption rounded-moon-i-xs [&_.status]:w-2 [&_.status]:h-2 [&_.status]:border"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -899,7 +870,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-8 w-8 text-moon-12 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -923,7 +893,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -947,7 +916,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-12 w-12 text-moon-16 rounded-moon-i-sm [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -971,7 +939,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-14 w-14 text-moon-16 rounded-moon-i-sm [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -995,7 +962,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-16 w-16 text-moon-20 rounded-moon-i-md [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -1023,7 +989,6 @@ Object {
       >
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-6 w-6 text-moon-10-caption rounded-moon-i-xs [&_.status]:w-2 [&_.status]:h-2 [&_.status]:border"
-          style="background-image: url(undefined);"
         >
            
           xs
@@ -1031,7 +996,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-8 w-8 text-moon-12 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           sm
@@ -1039,7 +1003,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           md
@@ -1047,7 +1010,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-12 w-12 text-moon-16 rounded-moon-i-sm [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           lg
@@ -1055,7 +1017,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-14 w-14 text-moon-16 rounded-moon-i-sm [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           xl
@@ -1063,7 +1024,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-16 w-16 text-moon-20 rounded-moon-i-md [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           2xl
@@ -1182,7 +1142,6 @@ Object {
       >
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -1209,7 +1168,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -1236,7 +1194,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -1263,7 +1220,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -1297,7 +1253,6 @@ Object {
     >
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -1324,7 +1279,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -1351,7 +1305,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -1378,7 +1331,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -1469,7 +1421,6 @@ Object {
       >
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -1493,7 +1444,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           md
@@ -1515,7 +1465,6 @@ Object {
     >
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -1539,7 +1488,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         md
@@ -1615,7 +1563,6 @@ Object {
     <div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -1642,7 +1589,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         md
@@ -1666,7 +1612,6 @@ Object {
   "container": <div>
     <div
       class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-      style="background-image: url(undefined);"
     >
        
       <svg
@@ -1693,7 +1638,6 @@ Object {
     </div>
     <div
       class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-      style="background-image: url(undefined);"
     >
        
       md
@@ -1774,7 +1718,6 @@ Object {
     <div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2 text-chichi"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -1798,7 +1741,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2 bg-piccolo text-goten"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -1822,7 +1764,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2 rounded-full"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -1846,7 +1787,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -1873,7 +1813,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -1903,7 +1842,6 @@ Object {
   "container": <div>
     <div
       class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2 text-chichi"
-      style="background-image: url(undefined);"
     >
        
       <svg
@@ -1927,7 +1865,6 @@ Object {
     </div>
     <div
       class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2 bg-piccolo text-goten"
-      style="background-image: url(undefined);"
     >
        
       <svg
@@ -1951,7 +1888,6 @@ Object {
     </div>
     <div
       class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2 rounded-full"
-      style="background-image: url(undefined);"
     >
        
       <svg
@@ -1975,7 +1911,6 @@ Object {
     </div>
     <div
       class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-      style="background-image: url(undefined);"
     >
        
       <svg
@@ -2002,7 +1937,6 @@ Object {
     </div>
     <div
       class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-      style="background-image: url(undefined);"
     >
        
       <svg
@@ -2089,7 +2023,6 @@ Object {
     <div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -2116,7 +2049,6 @@ Object {
   "container": <div>
     <div
       class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-      style="background-image: url(undefined);"
     >
        
       <svg
@@ -2203,7 +2135,6 @@ Object {
       >
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-6 w-6 text-moon-10-caption rounded-moon-i-xs [&_.status]:w-2 [&_.status]:h-2 [&_.status]:border"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -2227,7 +2158,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-8 w-8 text-moon-12 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -2251,7 +2181,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -2275,7 +2204,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-12 w-12 text-moon-16 rounded-moon-i-sm [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -2299,7 +2227,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-14 w-14 text-moon-16 rounded-moon-i-sm [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -2323,7 +2250,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-16 w-16 text-moon-20 rounded-moon-i-md [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           <svg
@@ -2351,7 +2277,6 @@ Object {
       >
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-6 w-6 text-moon-10-caption rounded-moon-i-xs [&_.status]:w-2 [&_.status]:h-2 [&_.status]:border"
-          style="background-image: url(undefined);"
         >
            
           xs
@@ -2359,7 +2284,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-8 w-8 text-moon-12 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           sm
@@ -2367,7 +2291,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           md
@@ -2375,7 +2298,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-12 w-12 text-moon-16 rounded-moon-i-sm [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           lg
@@ -2383,7 +2305,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-14 w-14 text-moon-16 rounded-moon-i-sm [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           xl
@@ -2391,7 +2312,6 @@ Object {
         </div>
         <div
           class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-16 w-16 text-moon-20 rounded-moon-i-md [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-          style="background-image: url(undefined);"
         >
            
           2xl
@@ -2452,7 +2372,6 @@ Object {
     >
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-6 w-6 text-moon-10-caption rounded-moon-i-xs [&_.status]:w-2 [&_.status]:h-2 [&_.status]:border"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -2476,7 +2395,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-8 w-8 text-moon-12 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -2500,7 +2418,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -2524,7 +2441,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-12 w-12 text-moon-16 rounded-moon-i-sm [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -2548,7 +2464,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-14 w-14 text-moon-16 rounded-moon-i-sm [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -2572,7 +2487,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-16 w-16 text-moon-20 rounded-moon-i-md [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -2600,7 +2514,6 @@ Object {
     >
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-6 w-6 text-moon-10-caption rounded-moon-i-xs [&_.status]:w-2 [&_.status]:h-2 [&_.status]:border"
-        style="background-image: url(undefined);"
       >
          
         xs
@@ -2608,7 +2521,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-8 w-8 text-moon-12 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         sm
@@ -2616,7 +2528,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         md
@@ -2624,7 +2535,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-12 w-12 text-moon-16 rounded-moon-i-sm [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         lg
@@ -2632,7 +2542,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-14 w-14 text-moon-16 rounded-moon-i-sm [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         xl
@@ -2640,7 +2549,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-16 w-16 text-moon-20 rounded-moon-i-md [&_.status]:w-4 [&_.status]:h-4 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         2xl
@@ -2755,7 +2663,6 @@ Object {
     <div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -2782,7 +2689,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -2809,7 +2715,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -2836,7 +2741,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -2866,7 +2770,6 @@ Object {
   "container": <div>
     <div
       class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-      style="background-image: url(undefined);"
     >
        
       <svg
@@ -2893,7 +2796,6 @@ Object {
     </div>
     <div
       class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-      style="background-image: url(undefined);"
     >
        
       <svg
@@ -2920,7 +2822,6 @@ Object {
     </div>
     <div
       class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-      style="background-image: url(undefined);"
     >
        
       <svg
@@ -2947,7 +2848,6 @@ Object {
     </div>
     <div
       class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-      style="background-image: url(undefined);"
     >
        
       <svg
@@ -3034,7 +2934,6 @@ Object {
     <div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         <svg
@@ -3058,7 +2957,6 @@ Object {
       </div>
       <div
         class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-        style="background-image: url(undefined);"
       >
          
         md
@@ -3076,7 +2974,6 @@ Object {
   "container": <div>
     <div
       class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-      style="background-image: url(undefined);"
     >
        
       <svg
@@ -3100,7 +2997,6 @@ Object {
     </div>
     <div
       class="relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover text-bulma bg-goku h-10 w-10 text-moon-14 rounded-moon-i-sm [&_.status]:w-3 [&_.status]:h-3 [&_.status]:border-2"
-      style="background-image: url(undefined);"
     >
        
       md
diff --git a/workspaces/core/src/avatar/styles/Wrapper.tsx b/workspaces/core/src/avatar/styles/Wrapper.tsx
index 96aee11800..59be658562 100644
--- a/workspaces/core/src/avatar/styles/Wrapper.tsx
+++ b/workspaces/core/src/avatar/styles/Wrapper.tsx
@@ -17,13 +17,13 @@ const Wrapper = ({
     className={mergeClassnames(
       'relative overflow-hidden uppercase font-medium flex items-center justify-center bg-cover',
       'text-bulma bg-goku',
-      color && color,
-      bgColor && bgColor,
+      color,
+      bgColor,
       getWrapperSize(size),
       getBorderRadius(size, isRounded),
       className
     )}
-    style={{ backgroundImage: `url('${imageUrl}')` }}
+    style={{ backgroundImage: imageUrl && `url('${imageUrl}')` }}
   >
     {children}
   </div>

From 551207661ca06a989d5f73add3b83fbc824e844f Mon Sep 17 00:00:00 2001
From: Dmytro Kireiev <dmytro.kireiev@gmail.com>
Date: Tue, 13 Feb 2024 12:18:14 +0200
Subject: [PATCH 6/6] chore: bump version to 10.13.1 (#2548)

---
 docs/CHANGELOG.md              | 11 +++++++++++
 docs/package.json              | 10 +++++-----
 next-docs/CHANGELOG.md         | 11 +++++++++++
 next-docs/package.json         | 10 +++++-----
 pnpm-lock.yaml                 | 20 ++++++++++----------
 workspaces/base/CHANGELOG.md   |  6 ++++++
 workspaces/base/package.json   |  2 +-
 workspaces/cmdk/CHANGELOG.md   |  8 ++++++++
 workspaces/cmdk/package.json   |  4 ++--
 workspaces/core/CHANGELOG.md   |  6 ++++++
 workspaces/core/package.json   |  2 +-
 workspaces/tables/CHANGELOG.md |  8 ++++++++
 workspaces/tables/package.json |  4 ++--
 workspaces/themes/CHANGELOG.md |  6 ++++++
 workspaces/themes/package.json |  2 +-
 15 files changed, 83 insertions(+), 27 deletions(-)

diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md
index 3f4be6ec96..97204783e3 100644
--- a/docs/CHANGELOG.md
+++ b/docs/CHANGELOG.md
@@ -1,5 +1,16 @@
 # docs
 
+## 10.13.1
+
+### Patch Changes
+
+- Deploy 10.13.1
+- Updated dependencies
+  - @heathmont/moon-core-tw@10.13.1
+  - @heathmont/moon-base-tw@10.13.1
+  - @heathmont/moon-cmdk-tw@10.13.1
+  - @heathmont/moon-themes-tw@10.13.1
+
 ## 10.13.0
 
 ### Minor Changes
diff --git a/docs/package.json b/docs/package.json
index 2c253beda9..a1a40d2c91 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "docs",
-  "version": "10.13.0",
+  "version": "10.13.1",
   "private": true,
   "type": "module",
   "scripts": {
@@ -11,11 +11,11 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@heathmont/moon-base-tw": "workspace:^10.13.0",
-    "@heathmont/moon-cmdk-tw": "workspace:^10.13.0",
-    "@heathmont/moon-core-tw": "workspace:^10.13.0",
+    "@heathmont/moon-base-tw": "workspace:^10.13.1",
+    "@heathmont/moon-cmdk-tw": "workspace:^10.13.1",
+    "@heathmont/moon-core-tw": "workspace:^10.13.1",
     "@heathmont/moon-icons-tw": "9.28.6",
-    "@heathmont/moon-themes-tw": "workspace:^10.13.0",
+    "@heathmont/moon-themes-tw": "workspace:^10.13.1",
     "@types/node": "20.4.9",
     "@types/react": "18.2.19",
     "@types/react-dom": "18.2.7",
diff --git a/next-docs/CHANGELOG.md b/next-docs/CHANGELOG.md
index e6ab534d51..3833887e42 100644
--- a/next-docs/CHANGELOG.md
+++ b/next-docs/CHANGELOG.md
@@ -1,5 +1,16 @@
 # Change Log
 
+## 10.13.1
+
+### Patch Changes
+
+- Deploy 10.13.1
+- Updated dependencies
+  - @heathmont/moon-core-tw@10.13.1
+  - @heathmont/moon-cmdk-tw@10.13.1
+  - @heathmont/moon-table-tw@10.13.1
+  - @heathmont/moon-themes-tw@10.13.1
+
 ## 10.13.0
 
 ### Minor Changes
diff --git a/next-docs/package.json b/next-docs/package.json
index 2c384d2502..7ac1d9370f 100644
--- a/next-docs/package.json
+++ b/next-docs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "next-docs",
-  "version": "10.13.0",
+  "version": "10.13.1",
   "private": true,
   "scripts": {
     "dev": "next dev",
@@ -19,9 +19,9 @@
     "@heathmont/moon-assets": "workspace:^10.7.1",
     "@heathmont/moon-charts": "workspace:^10.7.1",
     "@heathmont/moon-components": "workspace:^10.7.1",
-    "@heathmont/moon-cmdk-tw": "workspace:^10.13.0",
+    "@heathmont/moon-cmdk-tw": "workspace:^10.13.1",
     "@heathmont/moon-core": "workspace:^10.7.1",
-    "@heathmont/moon-core-tw": "workspace:^10.13.0",
+    "@heathmont/moon-core-tw": "workspace:^10.13.1",
     "@heathmont/moon-datepicker": "workspace:^10.7.1",
     "@heathmont/moon-draggabletable": "workspace:^10.7.1",
     "@heathmont/moon-icons": "workspace:^10.7.1",
@@ -30,9 +30,9 @@
     "@heathmont/moon-select": "workspace:^10.7.1",
     "@heathmont/moon-sidebar": "workspace:^10.7.1",
     "@heathmont/moon-table": "workspace:^10.7.1",
-    "@heathmont/moon-table-tw": "workspace:^10.13.0",
+    "@heathmont/moon-table-tw": "workspace:^10.13.1",
     "@heathmont/moon-themes": "workspace:^10.7.1",
-    "@heathmont/moon-themes-tw": "workspace:^10.13.0",
+    "@heathmont/moon-themes-tw": "workspace:^10.13.1",
     "@heathmont/moon-utils": "workspace:^10.7.1",
     "@heathmont/moon-icons-tw": "9.28.6",
     "@hookform/resolvers": "3.2.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 988f992a00..3cbd1ff4c4 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -166,19 +166,19 @@ importers:
   docs:
     dependencies:
       '@heathmont/moon-base-tw':
-        specifier: workspace:^10.13.0
+        specifier: workspace:^10.13.1
         version: link:../workspaces/base
       '@heathmont/moon-cmdk-tw':
-        specifier: workspace:^10.13.0
+        specifier: workspace:^10.13.1
         version: link:../workspaces/cmdk
       '@heathmont/moon-core-tw':
-        specifier: workspace:^10.13.0
+        specifier: workspace:^10.13.1
         version: link:../workspaces/core
       '@heathmont/moon-icons-tw':
         specifier: 9.28.6
         version: 9.28.6(react-dom@18.2.0)(react@18.2.0)
       '@heathmont/moon-themes-tw':
-        specifier: workspace:^10.13.0
+        specifier: workspace:^10.13.1
         version: link:../workspaces/themes
       '@types/node':
         specifier: 20.4.9
@@ -238,7 +238,7 @@ importers:
         specifier: workspace:^10.7.1
         version: link:../packages/charts
       '@heathmont/moon-cmdk-tw':
-        specifier: workspace:^10.13.0
+        specifier: workspace:^10.13.1
         version: link:../workspaces/cmdk
       '@heathmont/moon-components':
         specifier: workspace:^10.7.1
@@ -247,7 +247,7 @@ importers:
         specifier: workspace:^10.7.1
         version: link:../packages/core
       '@heathmont/moon-core-tw':
-        specifier: workspace:^10.13.0
+        specifier: workspace:^10.13.1
         version: link:../workspaces/core
       '@heathmont/moon-datepicker':
         specifier: workspace:^10.7.1
@@ -277,13 +277,13 @@ importers:
         specifier: workspace:^10.7.1
         version: link:../packages/table
       '@heathmont/moon-table-tw':
-        specifier: workspace:^10.13.0
+        specifier: workspace:^10.13.1
         version: link:../workspaces/tables
       '@heathmont/moon-themes':
         specifier: workspace:^10.7.1
         version: link:../packages/themes
       '@heathmont/moon-themes-tw':
-        specifier: workspace:^10.13.0
+        specifier: workspace:^10.13.1
         version: link:../workspaces/themes
       '@heathmont/moon-utils':
         specifier: workspace:^10.7.1
@@ -1005,7 +1005,7 @@ importers:
         specifier: 1.7.16
         version: 1.7.16(react-dom@18.2.0)(react@18.2.0)
       '@heathmont/moon-core-tw':
-        specifier: workspace:^10.13.0
+        specifier: workspace:^10.13.1
         version: link:../core
       cmdk:
         specifier: 0.2.0
@@ -1065,7 +1065,7 @@ importers:
   workspaces/tables:
     dependencies:
       '@heathmont/moon-core-tw':
-        specifier: workspace:^10.13.0
+        specifier: workspace:^10.13.1
         version: link:../core
       react:
         specifier: 18.2.0
diff --git a/workspaces/base/CHANGELOG.md b/workspaces/base/CHANGELOG.md
index ea17a5aaad..5d583abd27 100644
--- a/workspaces/base/CHANGELOG.md
+++ b/workspaces/base/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @heathmont/moon-base-tw
 
+## 10.13.1
+
+### Patch Changes
+
+- Deploy 10.13.1
+
 ## 10.13.0
 
 ### Minor Changes
diff --git a/workspaces/base/package.json b/workspaces/base/package.json
index 11dd1efe8c..75461f761d 100644
--- a/workspaces/base/package.json
+++ b/workspaces/base/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@heathmont/moon-base-tw",
   "sideEffects": false,
-  "version": "10.13.0",
+  "version": "10.13.1",
   "files": [
     "lib"
   ],
diff --git a/workspaces/cmdk/CHANGELOG.md b/workspaces/cmdk/CHANGELOG.md
index bde2699029..5bfc5bf27b 100644
--- a/workspaces/cmdk/CHANGELOG.md
+++ b/workspaces/cmdk/CHANGELOG.md
@@ -1,5 +1,13 @@
 # @heathmont/moon-cmdk-tw
 
+## 10.13.1
+
+### Patch Changes
+
+- Deploy 10.13.1
+- Updated dependencies
+  - @heathmont/moon-core-tw@10.13.1
+
 ## 10.13.0
 
 ### Minor Changes
diff --git a/workspaces/cmdk/package.json b/workspaces/cmdk/package.json
index 3a9795861d..e4e8a84490 100644
--- a/workspaces/cmdk/package.json
+++ b/workspaces/cmdk/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@heathmont/moon-cmdk-tw",
   "sideEffects": false,
-  "version": "10.13.0",
+  "version": "10.13.1",
   "files": [
     "lib"
   ],
@@ -21,7 +21,7 @@
   },
   "dependencies": {
     "@headlessui/react": "1.7.16",
-    "@heathmont/moon-core-tw": "workspace:^10.13.0",
+    "@heathmont/moon-core-tw": "workspace:^10.13.1",
     "cmdk": "0.2.0",
     "tailwind-merge": "1.14.0",
     "tailwindcss-radix": "2.8.0"
diff --git a/workspaces/core/CHANGELOG.md b/workspaces/core/CHANGELOG.md
index 3f9ecab9b1..5d265aa92c 100644
--- a/workspaces/core/CHANGELOG.md
+++ b/workspaces/core/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @heathmont/moon-core-tw
 
+## 10.13.1
+
+### Patch Changes
+
+- Deploy 10.13.1
+
 ## 10.13.0
 
 ### Minor Changes
diff --git a/workspaces/core/package.json b/workspaces/core/package.json
index 5540896025..93ce944c4a 100644
--- a/workspaces/core/package.json
+++ b/workspaces/core/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@heathmont/moon-core-tw",
   "sideEffects": false,
-  "version": "10.13.0",
+  "version": "10.13.1",
   "files": [
     "lib"
   ],
diff --git a/workspaces/tables/CHANGELOG.md b/workspaces/tables/CHANGELOG.md
index 1a0838257a..1332e9ec40 100644
--- a/workspaces/tables/CHANGELOG.md
+++ b/workspaces/tables/CHANGELOG.md
@@ -1,5 +1,13 @@
 # @heathmont/moon-table-tw
 
+## 10.13.1
+
+### Patch Changes
+
+- Deploy 10.13.1
+- Updated dependencies
+  - @heathmont/moon-core-tw@10.13.1
+
 ## 10.13.0
 
 ### Minor Changes
diff --git a/workspaces/tables/package.json b/workspaces/tables/package.json
index 5d92b57415..055726108e 100644
--- a/workspaces/tables/package.json
+++ b/workspaces/tables/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@heathmont/moon-table-tw",
   "sideEffects": false,
-  "version": "10.13.0",
+  "version": "10.13.1",
   "files": [
     "lib"
   ],
@@ -20,7 +20,7 @@
     "chokidar": "chokidar \"**/*.tsx\" \"**/*.ts\" -i \"lib/**/*.d.ts\" -c \"pnpm run build:code\" "
   },
   "dependencies": {
-    "@heathmont/moon-core-tw": "workspace:^10.13.0",
+    "@heathmont/moon-core-tw": "workspace:^10.13.1",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "react-table": "7.8.0",
diff --git a/workspaces/themes/CHANGELOG.md b/workspaces/themes/CHANGELOG.md
index aea9a4ea8c..c1d5f1f7d7 100644
--- a/workspaces/themes/CHANGELOG.md
+++ b/workspaces/themes/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @heathmont/moon-themes-tw
 
+## 10.13.1
+
+### Patch Changes
+
+- Deploy 10.13.1
+
 ## 10.13.0
 
 ### Minor Changes
diff --git a/workspaces/themes/package.json b/workspaces/themes/package.json
index 166fddb4d4..892fff74d1 100644
--- a/workspaces/themes/package.json
+++ b/workspaces/themes/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@heathmont/moon-themes-tw",
   "sideEffects": false,
-  "version": "10.13.0",
+  "version": "10.13.1",
   "files": [
     "lib"
   ],