refactor(list): remove horizontal control

eea · Apr 11, 2022 · 1f5e576 · 1f5e576
1 parent ebf11bd
commit 1f5e576
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 56 deletions.
diff --git a/src/ui/List/DefaultList.stories.js b/src/ui/List/DefaultList.stories.js
@@ -18,6 +18,5 @@ Default.args = {
   floated: 'left',
   animated: false,
   divided: false,
-  horizontal: false,
   items: ['List Item 1', 'List Item 2', 'List Item 3', 'List Item 4'],
 };
diff --git a/src/ui/List/DescriptionList.stories.js b/src/ui/List/DescriptionList.stories.js
@@ -31,13 +31,6 @@ export default {
         defaultValue: { summary: false },
       },
     },
-    horizontal: {
-      description: 'a list can be formatted to have items appear horizontally',
-      table: {
-        type: { summary: 'boolean' },
-        defaultValue: { summary: false },
-      },
-    },
     items: {
       description: 'array of list content',
       table: {
@@ -48,10 +41,10 @@ export default {
   },
 };
 
-function DescriptionList(items, floated, animated, divided, horizontal) {
+function DescriptionList(items, floated, animated, divided) {
   return (
     <Container>
-      <List animated={animated} divided={divided} horizontal={horizontal}>
+      <List animated={animated} divided={divided}>
         {items.map((item, index) => (
           <List.Item key={index}>
             <List.Content>
@@ -68,20 +61,13 @@ function DescriptionList(items, floated, animated, divided, horizontal) {
 }
 
 export const Default = (args) => {
-  return DescriptionList(
-    args.items,
-    args.floated,
-    args.animated,
-    args.divided,
-    args.horizontal,
-  );
+  return DescriptionList(args.items, args.floated, args.animated, args.divided);
 };
 
 Default.args = {
   floated: 'right',
   animated: false,
   divided: false,
-  horizontal: false,
   items: [
     { header: 'Header 1', content: 'Description content 1' },
     { header: 'Header 2', content: 'Description content 2' },

diff --git a/src/ui/List/OrderedList.stories.js b/src/ui/List/OrderedList.stories.js
@@ -20,13 +20,6 @@ export default {
         defaultValue: { summary: false },
       },
     },
-    horizontal: {
-      description: 'a list can be formatted to have items appear horizontally',
-      table: {
-        type: { summary: 'boolean' },
-        defaultValue: { summary: false },
-      },
-    },
     items: {
       description: 'array of list content',
       table: {
@@ -40,13 +33,7 @@ export default {
 function OrderedList(items, animated, divided, horizontal) {
   return (
     <Container>
-      <List
-        as="ul"
-        ordered
-        animated={animated}
-        divided={divided}
-        horizontal={horizontal}
-      >
+      <List as="ul" ordered animated={animated} divided={divided}>
         {items.map((item, index) => (
           <List.Item as="a" key={index}>
             {item.content}
@@ -89,7 +76,7 @@ function OrderedList(items, animated, divided, horizontal) {
 }
 
 export const Default = (args) => {
-  return OrderedList(args.items, args.animated, args.divided, args.horizontal);
+  return OrderedList(args.items, args.animated, args.divided);
 };
 
 Default.args = {
@@ -150,5 +137,4 @@ Default.args = {
   ],
   animated: false,
   divided: false,
-  horizontal: false,
 };
diff --git a/src/ui/List/UnorderedList.stories.js b/src/ui/List/UnorderedList.stories.js
@@ -20,13 +20,6 @@ export default {
         defaultValue: { summary: false },
       },
     },
-    horizontal: {
-      description: 'a list can be formatted to have items appear horizontally',
-      table: {
-        type: { summary: 'boolean' },
-        defaultValue: { summary: false },
-      },
-    },
     items: {
       description: 'array of list content',
       table: {
@@ -37,16 +30,10 @@ export default {
   },
 };
 
-function UnorderedList(animated, divided, horizontal, items) {
+function UnorderedList(animated, divided, items) {
   return (
     <Container>
-      <List
-        bulleted
-        animated={animated}
-        divided={divided}
-        horizontal={horizontal}
-        as="ul"
-      >
+      <List bulleted animated={animated} divided={divided} as="ul">
         {items &&
           items.map((item, index) => (
             <List.Item as="li" key={index}>
@@ -59,18 +46,12 @@ function UnorderedList(animated, divided, horizontal, items) {
 }
 
 export const Default = (args) => {
-  return UnorderedList(
-    args.animated,
-    args.divided,
-    args.horizontal,
-    args.items,
-  );
+  return UnorderedList(args.animated, args.divided, args.items);
 };
 
 Default.args = {
   animated: false,
   divided: false,
-  horizontal: false,
   items: [
     {
       header: 'header 1',