From 3709d09bb1a88854d46b6d06243392a95fb221a5 Mon Sep 17 00:00:00 2001
From: Vitaly Rtishchev <rtivital@gmail.com>
Date: Sat, 13 Aug 2022 11:02:55 +0300
Subject: [PATCH] [@mantine/styles] Fix incorrect theme.spacing calculation
 when it is override with 0 values (#1832)

---
 src/mantine-core/src/Table/Table.story.tsx    | 42 +++++++++++++++++++
 .../src/theme/functions/fns/size/size.ts      |  4 +-
 2 files changed, 45 insertions(+), 1 deletion(-)
 create mode 100644 src/mantine-core/src/Table/Table.story.tsx

diff --git a/src/mantine-core/src/Table/Table.story.tsx b/src/mantine-core/src/Table/Table.story.tsx
new file mode 100644
index 00000000000..704d68f2aec
--- /dev/null
+++ b/src/mantine-core/src/Table/Table.story.tsx
@@ -0,0 +1,42 @@
+import React from 'react';
+import { MantineProvider } from '@mantine/styles';
+import { Table } from './Table';
+
+export default { title: 'Table' };
+
+const elements = [
+  { position: 6, mass: 12.011, symbol: 'C', name: 'Carbon' },
+  { position: 7, mass: 14.007, symbol: 'N', name: 'Nitrogen' },
+  { position: 39, mass: 88.906, symbol: 'Y', name: 'Yttrium' },
+  { position: 56, mass: 137.33, symbol: 'Ba', name: 'Barium' },
+  { position: 58, mass: 140.12, symbol: 'Ce', name: 'Cerium' },
+];
+
+export function Usage() {
+  const rows = elements.map((element) => (
+    <tr key={element.name}>
+      <td>{element.position}</td>
+      <td>{element.name}</td>
+      <td>{element.symbol}</td>
+      <td>{element.mass}</td>
+    </tr>
+  ));
+
+  return (
+    <MantineProvider inherit theme={{ spacing: { xs: 0, sm: 2, md: 4, lg: 8, xl: 12 } }}>
+      <div style={{ padding: 40 }}>
+        <Table verticalSpacing="xl" horizontalSpacing="xs" fontSize="xl" striped>
+          <thead>
+            <tr>
+              <th>Element position</th>
+              <th>Element name</th>
+              <th>Symbol</th>
+              <th>Atomic mass</th>
+            </tr>
+          </thead>
+          <tbody>{rows}</tbody>
+        </Table>
+      </div>
+    </MantineProvider>
+  );
+}
diff --git a/src/mantine-styles/src/theme/functions/fns/size/size.ts b/src/mantine-styles/src/theme/functions/fns/size/size.ts
index 97d9c9dc829..7a9cde3e43f 100644
--- a/src/mantine-styles/src/theme/functions/fns/size/size.ts
+++ b/src/mantine-styles/src/theme/functions/fns/size/size.ts
@@ -8,5 +8,7 @@ export function size(props: GetSize) {
     return props.size;
   }
 
-  return props.sizes[props.size] || props.size || props.sizes.md;
+  const computedSize = props.sizes[props.size];
+
+  return computedSize !== undefined ? computedSize : props.size || props.sizes.md;
 }