From 0eff6ce89c64af0ea4ec3b9741060e78bfaaaa9d Mon Sep 17 00:00:00 2001
From: Kyle Durand <kyledurand@users.noreply.github.com>
Date: Thu, 5 Jan 2023 09:16:21 -0500
Subject: [PATCH 1/2] fix: ChoiceList children spacing

---
 .changeset/afraid-zoos-build.md                              | 5 +++++
 .../src/components/ChoiceList/ChoiceList.stories.tsx         | 4 ++--
 polaris-react/src/components/ChoiceList/ChoiceList.tsx       | 4 +---
 3 files changed, 8 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/afraid-zoos-build.md

diff --git a/.changeset/afraid-zoos-build.md b/.changeset/afraid-zoos-build.md
new file mode 100644
index 00000000000..3bdd82e6ccc
--- /dev/null
+++ b/.changeset/afraid-zoos-build.md
@@ -0,0 +1,5 @@
+---
+'@shopify/polaris': patch
+---
+
+Reduced spacing on ChoiceList children
diff --git a/polaris-react/src/components/ChoiceList/ChoiceList.stories.tsx b/polaris-react/src/components/ChoiceList/ChoiceList.stories.tsx
index 905c4c86484..e081cfea47d 100644
--- a/polaris-react/src/components/ChoiceList/ChoiceList.stories.tsx
+++ b/polaris-react/src/components/ChoiceList/ChoiceList.stories.tsx
@@ -102,8 +102,8 @@ export function WithChildrenContent() {
     <ChoiceList
       title="Discount minimum requirements"
       choices={[
-        {label: 'None', value: 'none'},
-        {label: 'Minimum purchase', value: 'minimum_purchase'},
+        {label: 'None', value: 'none', renderChildren},
+        {label: 'Minimum purchase', value: 'minimum_purchase', renderChildren},
         {
           label: 'Minimum quantity',
           value: 'minimum_quantity',
diff --git a/polaris-react/src/components/ChoiceList/ChoiceList.tsx b/polaris-react/src/components/ChoiceList/ChoiceList.tsx
index f2c5fb73647..3d993dbabb0 100644
--- a/polaris-react/src/components/ChoiceList/ChoiceList.tsx
+++ b/polaris-react/src/components/ChoiceList/ChoiceList.tsx
@@ -103,9 +103,7 @@ export function ChoiceList({
       : null;
     const children = renderedChildren ? (
       <div className={styles.ChoiceChildren}>
-        <Box paddingBlockStart={{xs: '4', md: '0'}} paddingBlockEnd="2">
-          {renderedChildren}
-        </Box>
+        <Box paddingBlockStart={{xs: '4', md: '0'}}>{renderedChildren}</Box>
       </div>
     ) : null;
     return (

From 456658a984af96bfe568cfc5c10db8208e26a3f4 Mon Sep 17 00:00:00 2001
From: Kyle Durand <kyledurand@users.noreply.github.com>
Date: Thu, 5 Jan 2023 12:00:01 -0500
Subject: [PATCH 2/2] Better examples

---
 .../ChoiceList/ChoiceList.stories.tsx           | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

diff --git a/polaris-react/src/components/ChoiceList/ChoiceList.stories.tsx b/polaris-react/src/components/ChoiceList/ChoiceList.stories.tsx
index e081cfea47d..4b191f6bc2a 100644
--- a/polaris-react/src/components/ChoiceList/ChoiceList.stories.tsx
+++ b/polaris-react/src/components/ChoiceList/ChoiceList.stories.tsx
@@ -26,7 +26,7 @@ export function Default() {
 }
 
 export function WithError() {
-  const [selected, setSelected] = useState('hidden');
+  const [selected, setSelected] = useState(['hidden']);
 
   const handleChange = useCallback((value) => setSelected(value), []);
 
@@ -102,12 +102,15 @@ export function WithChildrenContent() {
     <ChoiceList
       title="Discount minimum requirements"
       choices={[
-        {label: 'None', value: 'none', renderChildren},
-        {label: 'Minimum purchase', value: 'minimum_purchase', renderChildren},
+        {label: 'None', value: 'none'},
+        {
+          label: 'Minimum purchase',
+          value: 'minimum_purchase',
+          renderChildren,
+        },
         {
           label: 'Minimum quantity',
           value: 'minimum_quantity',
-          renderChildren,
         },
       ]}
       selected={selected}
@@ -147,7 +150,11 @@ export function WithDynamicChildrenContent() {
         title="Discount minimum requirements"
         choices={[
           {label: 'None', value: 'none'},
-          {label: 'Minimum purchase', value: 'minimum_purchase'},
+          {
+            label: 'Minimum purchase',
+            value: 'minimum_purchase',
+            renderChildren,
+          },
           {
             label: 'Minimum quantity',
             value: 'minimum_quantity',