From 3c9a03a026fc3b37248c317415f82a06d0957512 Mon Sep 17 00:00:00 2001
From: Mesteche <meztchek@gmail.com>
Date: Thu, 13 Feb 2020 12:28:02 +0100
Subject: [PATCH] [system] Add boxSizing to sizing styled system (#19684)

---
 docs/src/pages/system/api/api.md           | 1 +
 docs/src/pages/system/sizing/sizing.md     | 1 +
 packages/material-ui-system/src/index.d.ts | 2 ++
 packages/material-ui-system/src/sizing.js  | 5 +++++
 4 files changed, 9 insertions(+)

diff --git a/docs/src/pages/system/api/api.md b/docs/src/pages/system/api/api.md
index 56c3d679692417..7be57dfdd4cce3 100644
--- a/docs/src/pages/system/api/api.md
+++ b/docs/src/pages/system/api/api.md
@@ -38,6 +38,7 @@
 | [sizing](/system/sizing/) | `minHeight` | `minHeight`| `min-height` | none |
 | [sizing](/system/sizing/) | `minWidth` | `minWidth` | `min-width` | none |
 | [sizing](/system/sizing/) | `width` | `width` | `width` | none |
+| [sizing](/system/sizing/) | `boxSizing` | `boxSizing` | `box-sizing` | none |
 | [spacing](/system/spacing/) | `spacing` | `m` | `margin` | [`spacing`](/customization/default-theme/?expand-path=$.spacing) |
 | [spacing](/system/spacing/) | `spacing` | `mb` | `margin-bottom` | [`spacing`](/customization/default-theme/?expand-path=$.spacing) |
 | [spacing](/system/spacing/) | `spacing` | `ml` | `margin-left` | [`spacing`](/customization/default-theme/?expand-path=$.spacing) |
diff --git a/docs/src/pages/system/sizing/sizing.md b/docs/src/pages/system/sizing/sizing.md
index 1573143f940b25..b68587840090d7 100644
--- a/docs/src/pages/system/sizing/sizing.md
+++ b/docs/src/pages/system/sizing/sizing.md
@@ -52,3 +52,4 @@ import { sizing } from '@material-ui/system';
 | `height` | `height` | `height` | none |
 | `maxHeight` | `maxHeight`| `max-height` | none |
 | `minHeight` | `minHeight`| `min-height` | none |
+| `boxSizing` | `boxSizing`| `box-sizing` | none |
diff --git a/packages/material-ui-system/src/index.d.ts b/packages/material-ui-system/src/index.d.ts
index 459f49406acbe4..7bb156580bef1d 100644
--- a/packages/material-ui-system/src/index.d.ts
+++ b/packages/material-ui-system/src/index.d.ts
@@ -122,6 +122,7 @@ export const maxHeight: SimpleStyleFunction<'maxHeight'>;
 export const minHeight: SimpleStyleFunction<'minHeight'>;
 export const sizeWidth: SimpleStyleFunction<'sizeWidth'>;
 export const sizeHeight: SimpleStyleFunction<'sizeHeight'>;
+export const boxSizing: SimpleStyleFunction<'boxSizing'>;
 export const sizing: SimpleStyleFunction<
   | 'width'
   | 'maxWidth'
@@ -131,6 +132,7 @@ export const sizing: SimpleStyleFunction<
   | 'minHeight'
   | 'sizeWidth'
   | 'sizeHeight'
+  | 'boxSizing'
 >;
 export type SizingProps = PropsFor<typeof sizing>;
 
diff --git a/packages/material-ui-system/src/sizing.js b/packages/material-ui-system/src/sizing.js
index bfcb69b041e62a..bf9c80b3e3d034 100644
--- a/packages/material-ui-system/src/sizing.js
+++ b/packages/material-ui-system/src/sizing.js
@@ -47,6 +47,10 @@ export const sizeHeight = style({
   transform,
 });
 
+export const boxSizing = style({
+  prop: 'boxSizing',
+});
+
 const sizing = compose(
   width,
   maxWidth,
@@ -54,6 +58,7 @@ const sizing = compose(
   height,
   maxHeight,
   minHeight,
+  boxSizing,
 );
 
 export default sizing;