From f446d063fba4b4c21ea10d12d6503798f0d8ee8a Mon Sep 17 00:00:00 2001
From: Masen Furer <m_github@0x26.net>
Date: Mon, 18 Mar 2024 15:49:15 -0700
Subject: [PATCH] HighLevelSelect: pass flex_shrink prop to SelectTrigger
 (#2876)

* Revert "Remove width prop from rx.select (#2835)"

This reverts commit d14292dc9b2c4fe7dfe5e1cebce42cb5a3a317a0.

* HighLevelSelect: pass flex_shrink prop to SelectTrigger

This allows the high level select to have width="100%" and also shrink-to-fit inside a parent container.

Fix #2824, kind of
---
 reflex/components/radix/themes/components/select.py  | 5 ++++-
 reflex/components/radix/themes/components/select.pyi | 4 ++++
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/reflex/components/radix/themes/components/select.py b/reflex/components/radix/themes/components/select.py
index 564b4834a..77d3595f2 100644
--- a/reflex/components/radix/themes/components/select.py
+++ b/reflex/components/radix/themes/components/select.py
@@ -181,6 +181,9 @@ class HighLevelSelect(SelectRoot):
     # The radius of the select.
     radius: Var[LiteralRadius]
 
+    # The width of the select.
+    width: Var[str]
+
     # The positioning mode to use. Default is "item-aligned".
     position: Var[Literal["item-aligned", "popper"]]
 
@@ -203,7 +206,7 @@ class HighLevelSelect(SelectRoot):
 
         trigger_props = {
             prop: props.pop(prop)
-            for prop in ["placeholder", "variant", "radius"]
+            for prop in ["placeholder", "variant", "radius", "width", "flex_shrink"]
             if prop in props
         }
 
diff --git a/reflex/components/radix/themes/components/select.pyi b/reflex/components/radix/themes/components/select.pyi
index a30cbf477..dc93aeb66 100644
--- a/reflex/components/radix/themes/components/select.pyi
+++ b/reflex/components/radix/themes/components/select.pyi
@@ -863,6 +863,7 @@ class HighLevelSelect(SelectRoot):
                 Literal["none", "small", "medium", "large", "full"],
             ]
         ] = None,
+        width: Optional[Union[Var[str], str]] = None,
         position: Optional[
             Union[
                 Var[Literal["item-aligned", "popper"]],
@@ -949,6 +950,7 @@ class HighLevelSelect(SelectRoot):
             high_contrast: Whether to render the select with higher contrast color against background.
             variant: The variant of the select.
             radius: The radius of the select.
+            width: The width of the select.
             position: The positioning mode to use. Default is "item-aligned".
             size: The size of the select: "1" | "2" | "3"
             default_value: The value of the select when initially rendered. Use when you do not need to control the state of the select.
@@ -1061,6 +1063,7 @@ class Select(ComponentNamespace):
                 Literal["none", "small", "medium", "large", "full"],
             ]
         ] = None,
+        width: Optional[Union[Var[str], str]] = None,
         position: Optional[
             Union[
                 Var[Literal["item-aligned", "popper"]],
@@ -1147,6 +1150,7 @@ class Select(ComponentNamespace):
             high_contrast: Whether to render the select with higher contrast color against background.
             variant: The variant of the select.
             radius: The radius of the select.
+            width: The width of the select.
             position: The positioning mode to use. Default is "item-aligned".
             size: The size of the select: "1" | "2" | "3"
             default_value: The value of the select when initially rendered. Use when you do not need to control the state of the select.