fixup! Feat(web-react): Add background gradient prop to Box component #DS-1887

Author: curdaj

packages/web-react/src/components/Box/stories/Box.stories.tsx

@@ -80,7 +80,7 @@ const meta: Meta<typeof Box> = {
     },
     borderWidth: {
       control: 'select',
-      options: Object.values(BorderWidths),
+      options: [...Object.values(BorderWidths), undefined],
       table: {
         type: {
           summary: 'BorderWidthsDictionaryType',
@@ -94,14 +94,15 @@ const meta: Meta<typeof Box> = {
       control: 'select',
       options: Object.values(BorderStyles),
       table: {
+        defaultValue: { summary: BorderStyles.SOLID },
         type: {
           summary: 'BorderStylesDictionaryType',
         },
       },
     },
     borderColor: {
       control: 'select',
-      options: Object.values(BorderColors),
+      options: [...Object.values(BorderColors), undefined],
       table: {
         type: {
           summary: 'BorderColorsDictionaryType',
@@ -110,7 +111,7 @@ const meta: Meta<typeof Box> = {
     },
     backgroundColor: {
       control: 'select',
-      options: Object.values(BackgroundColors),
+      options: [...Object.values(BackgroundColors), undefined],
       table: {
         type: {
           summary: 'BackgroundColorsDictionaryType',
@@ -119,7 +120,7 @@ const meta: Meta<typeof Box> = {
     },
     backgroundGradient: {
       control: 'select',
-      options: Object.values(BackgroundGradients),
+      options: [...Object.values(BackgroundGradients), undefined],
       table: {
         type: {
           summary: 'BackgroundGradientsDictionaryType',
@@ -137,8 +138,8 @@ const meta: Meta<typeof Box> = {
       tablet: '200',
       desktop: '400',
     },
-    borderColor: 'basic',
-    backgroundColor: 'primary',
+    borderColor: undefined,
+    backgroundColor: undefined,
   },
 };