add margins to mantine components

vazco · May 24, 2024 · 578f25b · 578f25b
1 parent 2b57f0a
commit 578f25b
Show file tree

Hide file tree

Showing 16 changed files with 798 additions and 97 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -22,11 +22,12 @@
     "@docusaurus/preset-classic": "2.1.0",
     "@emotion/react": "11.7.1",
     "@emotion/styled": "11.6.0",
-    "@mantine/core": "7.1.2",
+    "@mantine/core": "7.8.0",
+    "@mantine/dates": "7.8.0",
+    "@tabler/icons-react": "3.2.0",
     "@material-ui/core": "4.11.2",
     "@material-ui/icons": "4.11.2",
     "@mui/material": "5.4.1",
-    "@tabler/icons-react": "2.38.0",
     "@testing-library/jest-dom": "5.16.5",
     "@testing-library/react": "12.1.5",
     "@testing-library/user-event": "14.4.3",

diff --git a/packages/uniforms-mantine/src/BoolField.tsx b/packages/uniforms-mantine/src/BoolField.tsx
@@ -23,6 +23,7 @@ function Bool({
 }: BoolFieldProps) {
   return (
     <Checkbox
+      mb="xs"
       checked={value || false}
       disabled={disabled}
       error={showInlineError && !!error && errorMessage}

diff --git a/packages/uniforms-mantine/src/DateField.tsx b/packages/uniforms-mantine/src/DateField.tsx
@@ -1,6 +1,6 @@
+import { DateInput, DateTimePicker, DateInputProps } from '@mantine/dates';
 import React, { RefObject } from 'react';
 import { connectField, filterDOMProps, FieldProps } from 'uniforms';
-import { DateInput, DateTimePicker, DateInputProps } from '@mantine/dates';
 
 type DateFieldType = 'date' | 'datetime-local';
 
@@ -30,12 +30,13 @@ function Date({
   if (type === 'date') {
     return (
       <DateInput
+        mb="xs"
         disabled={disabled}
         label={label}
         name={name}
         maxDate={max}
         minDate={min}
-        onChange={date =>
+        onChange={(date: Date) =>
           readOnly
             ? undefined
             : date === null
@@ -60,7 +61,7 @@ function Date({
       placeholder={placeholder}
       ref={inputRef as RefObject<HTMLButtonElement>}
       value={value}
-      onChange={date =>
+      onChange={(date: Date) =>
         readOnly
           ? undefined
           : date === null

diff --git a/packages/uniforms-mantine/src/HiddenField.tsx b/packages/uniforms-mantine/src/HiddenField.tsx
@@ -22,6 +22,7 @@ export default function HiddenField({ value, ...rawProps }: HiddenFieldProps) {
 
   return props.noDOM ? null : (
     <input
+      mb="xs"
       disabled={props.disabled}
       name={props.name}
       readOnly={props.readOnly}

diff --git a/packages/uniforms-mantine/src/ListAddField.tsx b/packages/uniforms-mantine/src/ListAddField.tsx
@@ -40,6 +40,7 @@ function ListAdd({
 
   return (
     <Button
+      mb="xs"
       {...filterDOMProps(props)}
       fullWidth
       disabled={!limitNotReached}

diff --git a/packages/uniforms-mantine/src/ListDelField.tsx b/packages/uniforms-mantine/src/ListDelField.tsx
@@ -25,6 +25,7 @@ function ListDel({ disabled, name, readOnly, ...props }: ListDelFieldProps) {
 
   return (
     <ActionIcon
+      mb="xs"
       {...filterDOMProps(props)}
       disabled={disabled}
       onClick={() => {