From ef218d8d55cd9688553e0491a57908c238c7539c Mon Sep 17 00:00:00 2001
From: Tarek Hamaoui <tarek.hamaoui@digitalservice.bund.de>
Date: Mon, 4 Nov 2024 23:29:24 +0100
Subject: [PATCH] feat(select): apply line-clamp-1 to label and set
 `optionValue="code"` in Storybook

- Added line-clamp-1 to truncate overflowing text after one line.
- Configured `optionValue="code"` to ensure options are correctly identified by their code values.
---
 src/primevue/select/select.stories.ts | 5 +++++
 src/primevue/select/select.ts         | 4 ++--
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/primevue/select/select.stories.ts b/src/primevue/select/select.stories.ts
index ca59802..ed03d34 100644
--- a/src/primevue/select/select.stories.ts
+++ b/src/primevue/select/select.stories.ts
@@ -36,6 +36,7 @@ export const Default: StoryObj<typeof meta> = {
       v-bind="args"
       v-model="selectedOption"
       optionLabel="name"
+      optionValue="code"
       :options="options"
     />`,
   }),
@@ -65,6 +66,7 @@ export const WithLabel: StoryObj<typeof meta> = {
         v-bind="args"
         v-model="selectedOption"
         optionLabel="name"
+        optionValue="code"
         :options="options"
       />
     </div>`,
@@ -92,6 +94,7 @@ export const WithHorizontalLabel: StoryObj<typeof meta> = {
         v-bind="args"
         v-model="selectedOption"
         optionLabel="name"
+        optionValue="code"
         :options="options"
         fluid
       />
@@ -121,6 +124,7 @@ export const Disabled: StoryObj<typeof meta> = {
       v-bind="args"
       v-model="selectedOption"
       optionLabel="name"
+      optionValue="code"
       :options="options"
     />`,
   }),
@@ -151,6 +155,7 @@ export const Invalid: StoryObj<typeof meta> = {
         v-bind="args"
         v-model="selectedOption"
         optionLabel="name"
+        optionValue="code"
         :options="options"
       />
       <small id="invalid-hint"><ErrorOutline />Invalid date</small>
diff --git a/src/primevue/select/select.ts b/src/primevue/select/select.ts
index ab22fd4..649bd1e 100644
--- a/src/primevue/select/select.ts
+++ b/src/primevue/select/select.ts
@@ -5,7 +5,7 @@ import "./select.css";
 const select: SelectPassThroughOptions = {
   root: ({ props, state }) => {
     // Base
-    const base = tw`ris-body2-regular inline-flex h-48 items-center justify-between border-2 bg-white py-4 pl-16 pr-12 outline-4 -outline-offset-4 [&+label]:ml-8`;
+    const base = tw`ris-body2-regular inline-flex h-48 items-center justify-between border-2 bg-white py-4 pl-16 pr-12 outline-4 -outline-offset-4`;
 
     // States
     const normal = tw`cursor-pointer border-blue-800 outline-blue-800`;
@@ -45,7 +45,7 @@ const select: SelectPassThroughOptions = {
   },
 
   label: {
-    class: tw`outline-none`,
+    class: tw`line-clamp-1 outline-none`,
   },
 
   overlay: {