fix(Button): remove illegal div wrapping children

scaleway · Jan 23, 2025 · e6d79d7 · e6d79d7
1 parent fddc860
commit e6d79d7
Show file tree

Hide file tree

Showing 7 changed files with 1,618 additions and 2,193 deletions.
diff --git a/.changeset/moody-yaks-watch.md b/.changeset/moody-yaks-watch.md
@@ -0,0 +1,5 @@
+---
+"@ultraviolet/ui": patch
+---
+
+Fix `<Button />` to remove illegal div in children when text as children
diff --git a/packages/form/src/components/NumberInputField/__tests__/__snapshots__/index.test.tsx.snap b/packages/form/src/components/NumberInputField/__tests__/__snapshots__/index.test.tsx.snap
@@ -321,18 +321,16 @@ exports[`NumberInputField > should render correctly 1`] = `
               disabled=""
               type="button"
             >
-              <div>
-                <svg
-                  class="emotion-9 emotion-10"
-                  viewBox="0 0 20 20"
-                >
-                  <path
-                    clip-rule="evenodd"
-                    d="M4 9.75A.75.75 0 0 1 4.75 9h10.5a.75.75 0 0 1 0 1.5H4.75A.75.75 0 0 1 4 9.75"
-                    fill-rule="evenodd"
-                  />
-                </svg>
-              </div>
+              <svg
+                class="emotion-9 emotion-10"
+                viewBox="0 0 20 20"
+              >
+                <path
+                  clip-rule="evenodd"
+                  d="M4 9.75A.75.75 0 0 1 4.75 9h10.5a.75.75 0 0 1 0 1.5H4.75A.75.75 0 0 1 4 9.75"
+                  fill-rule="evenodd"
+                />
+              </svg>
             </button>
             <div
               aria-live="assertive"
@@ -357,16 +355,14 @@ exports[`NumberInputField > should render correctly 1`] = `
               class="emotion-6 emotion-18 emotion-8"
               type="button"
             >
-              <div>
-                <svg
-                  class="emotion-20 emotion-10"
-                  viewBox="0 0 20 20"
-                >
-                  <path
-                    d="M10.75 4.75a.75.75 0 0 0-1.5 0v4.5h-4.5a.75.75 0 0 0 0 1.5h4.5v4.5a.75.75 0 0 0 1.5 0v-4.5h4.5a.75.75 0 0 0 0-1.5h-4.5z"
-                  />
-                </svg>
-              </div>
+              <svg
+                class="emotion-20 emotion-10"
+                viewBox="0 0 20 20"
+              >
+                <path
+                  d="M10.75 4.75a.75.75 0 0 0-1.5 0v4.5h-4.5a.75.75 0 0 0 0 1.5h4.5v4.5a.75.75 0 0 0 1.5 0v-4.5h4.5a.75.75 0 0 0 0-1.5h-4.5z"
+                />
+              </svg>
             </button>
           </div>
         </div>
@@ -626,18 +622,16 @@ exports[`NumberInputField > should render correctly disabled 1`] = `
               disabled=""
               type="button"
             >
-              <div>
-                <svg
-                  class="emotion-9 emotion-10"
-                  viewBox="0 0 20 20"
-                >
-                  <path
-                    clip-rule="evenodd"
-                    d="M4 9.75A.75.75 0 0 1 4.75 9h10.5a.75.75 0 0 1 0 1.5H4.75A.75.75 0 0 1 4 9.75"
-                    fill-rule="evenodd"
-                  />
-                </svg>
-              </div>
+              <svg
+                class="emotion-9 emotion-10"
+                viewBox="0 0 20 20"
+              >
+                <path
+                  clip-rule="evenodd"
+                  d="M4 9.75A.75.75 0 0 1 4.75 9h10.5a.75.75 0 0 1 0 1.5H4.75A.75.75 0 0 1 4 9.75"
+                  fill-rule="evenodd"
+                />
+              </svg>
             </button>
             <div
               aria-live="assertive"
@@ -664,16 +658,14 @@ exports[`NumberInputField > should render correctly disabled 1`] = `
               disabled=""
               type="button"
             >
-              <div>
-                <svg
-                  class="emotion-9 emotion-10"
-                  viewBox="0 0 20 20"
-                >
-                  <path
-                    d="M10.75 4.75a.75.75 0 0 0-1.5 0v4.5h-4.5a.75.75 0 0 0 0 1.5h4.5v4.5a.75.75 0 0 0 1.5 0v-4.5h4.5a.75.75 0 0 0 0-1.5h-4.5z"
-                  />
-                </svg>
-              </div>
+              <svg
+                class="emotion-9 emotion-10"
+                viewBox="0 0 20 20"
+              >
+                <path
+                  d="M10.75 4.75a.75.75 0 0 0-1.5 0v4.5h-4.5a.75.75 0 0 0 0 1.5h4.5v4.5a.75.75 0 0 0 1.5 0v-4.5h4.5a.75.75 0 0 0 0-1.5h-4.5z"
+                />
+              </svg>
             </button>
           </div>
         </div>
@@ -1003,18 +995,16 @@ exports[`NumberInputField > should trigger event onMinCrossed & onMaxCrossed 1`]
               class="emotion-6 emotion-7 emotion-8"
               type="button"
             >
-              <div>
-                <svg
-                  class="emotion-9 emotion-10"
-                  viewBox="0 0 20 20"
-                >
-                  <path
-                    clip-rule="evenodd"
-                    d="M4 9.75A.75.75 0 0 1 4.75 9h10.5a.75.75 0 0 1 0 1.5H4.75A.75.75 0 0 1 4 9.75"
-                    fill-rule="evenodd"
-                  />
-                </svg>
-              </div>
+              <svg
+                class="emotion-9 emotion-10"
+                viewBox="0 0 20 20"
+              >
+                <path
+                  clip-rule="evenodd"
+                  d="M4 9.75A.75.75 0 0 1 4.75 9h10.5a.75.75 0 0 1 0 1.5H4.75A.75.75 0 0 1 4 9.75"
+                  fill-rule="evenodd"
+                />
+              </svg>
             </button>
             <div
               aria-live="assertive"
@@ -1040,16 +1030,14 @@ exports[`NumberInputField > should trigger event onMinCrossed & onMaxCrossed 1`]
               disabled=""
               type="button"
             >
-              <div>
-                <svg
-                  class="emotion-20 emotion-10"
-                  viewBox="0 0 20 20"
-                >
-                  <path
-                    d="M10.75 4.75a.75.75 0 0 0-1.5 0v4.5h-4.5a.75.75 0 0 0 0 1.5h4.5v4.5a.75.75 0 0 0 1.5 0v-4.5h4.5a.75.75 0 0 0 0-1.5h-4.5z"
-                  />
-                </svg>
-              </div>
+              <svg
+                class="emotion-20 emotion-10"
+                viewBox="0 0 20 20"
+              >
+                <path
+                  d="M10.75 4.75a.75.75 0 0 0-1.5 0v4.5h-4.5a.75.75 0 0 0 0 1.5h4.5v4.5a.75.75 0 0 0 1.5 0v-4.5h4.5a.75.75 0 0 0 0-1.5h-4.5z"
+                />
+              </svg>
             </button>
           </div>
         </div>
@@ -1317,18 +1305,16 @@ exports[`NumberInputField > should trigger events correctly 1`] = `
               class="emotion-6 emotion-7 emotion-8"
               type="button"
             >
-              <div>
-                <svg
-                  class="emotion-9 emotion-10"
-                  viewBox="0 0 20 20"
-                >
-                  <path
-                    clip-rule="evenodd"
-                    d="M4 9.75A.75.75 0 0 1 4.75 9h10.5a.75.75 0 0 1 0 1.5H4.75A.75.75 0 0 1 4 9.75"
-                    fill-rule="evenodd"
-                  />
-                </svg>
-              </div>
+              <svg
+                class="emotion-9 emotion-10"
+                viewBox="0 0 20 20"
+              >
+                <path
+                  clip-rule="evenodd"
+                  d="M4 9.75A.75.75 0 0 1 4.75 9h10.5a.75.75 0 0 1 0 1.5H4.75A.75.75 0 0 1 4 9.75"
+                  fill-rule="evenodd"
+                />
+              </svg>
             </button>
             <div
               aria-live="assertive"
@@ -1353,16 +1339,14 @@ exports[`NumberInputField > should trigger events correctly 1`] = `
               class="emotion-6 emotion-7 emotion-8"
               type="button"
             >
-              <div>
-                <svg
-                  class="emotion-9 emotion-10"
-                  viewBox="0 0 20 20"
-                >
-                  <path
-                    d="M10.75 4.75a.75.75 0 0 0-1.5 0v4.5h-4.5a.75.75 0 0 0 0 1.5h4.5v4.5a.75.75 0 0 0 1.5 0v-4.5h4.5a.75.75 0 0 0 0-1.5h-4.5z"
-                  />
-                </svg>
-              </div>
+              <svg
+                class="emotion-9 emotion-10"
+                viewBox="0 0 20 20"
+              >
+                <path
+                  d="M10.75 4.75a.75.75 0 0 0-1.5 0v4.5h-4.5a.75.75 0 0 0 0 1.5h4.5v4.5a.75.75 0 0 0 1.5 0v-4.5h4.5a.75.75 0 0 0 0-1.5h-4.5z"
+                />
+              </svg>
             </button>
           </div>
         </div>