fix(plus): order summary min-width, min-height (#5554)

Author: philibea

.changeset/rotten-hairs-boil.md

@@ -0,0 +1,5 @@
+---
+"@ultraviolet/plus": patch
+---
+
+Add min-width instead of fixed width on OrderSummary, Add min-height on scrollable item on OrderSummary

.storybook/storybookThemes.ts

@@ -33,7 +33,6 @@ const generateStorybookTheme = ({
 
     // Toolbar default and active colors
     barTextColor: theme.colors.neutral.textWeak,
-
     buttonBg: theme.colors.neutral.background,
     buttonBorder: theme.colors.neutral.border,
 

packages/form/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ultraviolet/form",
-  "version": "5.0.0-beta.9",
+  "version": "5.0.0-beta.10",
   "description": "Ultraviolet Form",
   "homepage": "https://github.com/scaleway/ultraviolet#readme",
   "repository": {

packages/icons/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ultraviolet/icons",
-  "version": "4.1.0-beta.4",
+  "version": "4.1.0-beta.5",
   "description": "Ultraviolet Icons",
   "homepage": "https://github.com/scaleway/ultraviolet#readme",
   "repository": {

packages/nextjs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ultraviolet/nextjs",
-  "version": "2.0.0-beta.9",
+  "version": "2.0.0-beta.10",
   "description": "Ultraviolet NextJS utility package",
   "homepage": "https://github.com/scaleway/ultraviolet#readme",
   "repository": {

packages/plus/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ultraviolet/plus",
-  "version": "2.0.0-beta.9",
+  "version": "2.0.0-beta.10",
   "description": "Ultraviolet Plus",
   "homepage": "https://github.com/scaleway/ultraviolet#readme",
   "repository": {

packages/plus/src/components/OrderSummary/ScrollableContent.tsx

@@ -10,13 +10,14 @@ import { OrderSummaryContext } from './Provider'
 import type { ItemsType, SubCategoryType } from './types'
 
 const StyledNumberInputV2 = styled(NumberInput)`
-max-width: 12.5rem;
-background-color: ${({ theme }) => theme.colors.neutral.background};
+  max-width: 12.5rem;
+  background-color: ${({ theme }) => theme.colors.neutral.background};
 `
 const ContainerScrollable = styled(Stack)`
-overflow-y: scroll;
-padding: ${({ theme }) => theme.space[3]};
-height: 100%;
+  overflow-y: scroll;
+  padding: ${({ theme }) => theme.space[3]};
+  min-height: 10rem;
+  height: 100%;
 `
 
 const DetailsStack = styled(Stack)`