From 9555bf42ef187fc7644018ef88af9ba1038d3c16 Mon Sep 17 00:00:00 2001
From: Jon Ambas <jon@jonambas.com>
Date: Mon, 18 Sep 2023 18:33:05 -0400
Subject: [PATCH 1/3] fix(react): Select overlay zindex (#152)

* fix(react): select content z index

* chore(change): add change
---
 .changeset/healthy-donuts-warn.md    | 5 +++++
 packages/react/src/select/Select.tsx | 4 +++-
 2 files changed, 8 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/healthy-donuts-warn.md

diff --git a/.changeset/healthy-donuts-warn.md b/.changeset/healthy-donuts-warn.md
new file mode 100644
index 00000000..77ce35b7
--- /dev/null
+++ b/.changeset/healthy-donuts-warn.md
@@ -0,0 +1,5 @@
+---
+'@sweatpants/react': patch
+---
+
+Fix Select overlay zindex within drawers
diff --git a/packages/react/src/select/Select.tsx b/packages/react/src/select/Select.tsx
index da34a76a..c251ca92 100644
--- a/packages/react/src/select/Select.tsx
+++ b/packages/react/src/select/Select.tsx
@@ -160,7 +160,9 @@ const Select = forwardRef<HTMLButtonElement, SelectProps>((props, userRef) => {
           )}
         </RadixSelect.Trigger>
         <RadixSelect.Portal>
-          <RadixSelect.Content>
+          <RadixSelect.Content
+            className={css({ position: 'relative', zIndex: '2' })}
+          >
             <RadixSelect.Viewport asChild>
               <Card kind="elevated" space="tight">
                 <Stack space="tight">{children}</Stack>

From a047506db56bd3d5f1865ac66fa383d17e31fa28 Mon Sep 17 00:00:00 2001
From: jonambas <jon@jonambas.com>
Date: Mon, 18 Sep 2023 18:33:44 -0400
Subject: [PATCH 2/3] chore(change): release

---
 .changeset/healthy-donuts-warn.md | 5 -----
 packages/react/CHANGELOG.md       | 6 ++++++
 packages/react/package.json       | 2 +-
 3 files changed, 7 insertions(+), 6 deletions(-)
 delete mode 100644 .changeset/healthy-donuts-warn.md

diff --git a/.changeset/healthy-donuts-warn.md b/.changeset/healthy-donuts-warn.md
deleted file mode 100644
index 77ce35b7..00000000
--- a/.changeset/healthy-donuts-warn.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'@sweatpants/react': patch
----
-
-Fix Select overlay zindex within drawers
diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md
index b7cae4eb..ce6c719d 100644
--- a/packages/react/CHANGELOG.md
+++ b/packages/react/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @sweatpants/react
 
+## 0.7.1
+
+### Patch Changes
+
+- 9555bf4: Fix Select overlay zindex within drawers
+
 ## 0.7.0
 
 ### Minor Changes
diff --git a/packages/react/package.json b/packages/react/package.json
index 42b8d7c7..65175c0c 100644
--- a/packages/react/package.json
+++ b/packages/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@sweatpants/react",
-  "version": "0.7.0",
+  "version": "0.7.1",
   "description": "",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",

From 7ba9923d07a82ccddf26ed798317e6e81e89e576 Mon Sep 17 00:00:00 2001
From: Jon Ambas <jon@jonambas.com>
Date: Tue, 19 Sep 2023 09:08:28 -0400
Subject: [PATCH 3/3] fix(react): TextField prefix/suffix first render
 transition (#153)

---
 package-lock.json                           | 2 +-
 packages/react/src/text-field/TextField.tsx | 9 +++++----
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index f4232c06..22ddd36b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11687,7 +11687,7 @@
     },
     "packages/react": {
       "name": "@sweatpants/react",
-      "version": "0.7.0",
+      "version": "0.7.1",
       "license": "MIT",
       "dependencies": {
         "@radix-ui/react-dialog": "1.0.4",
diff --git a/packages/react/src/text-field/TextField.tsx b/packages/react/src/text-field/TextField.tsx
index f40cf4bb..2f6f807a 100644
--- a/packages/react/src/text-field/TextField.tsx
+++ b/packages/react/src/text-field/TextField.tsx
@@ -43,7 +43,8 @@ const inputStyles = cva({
     background: 'transparent',
     fontSize: '3',
     paddingX: '3',
-    transition: '0.15s',
+    transitionDuration: '0.15s',
+    transitionProperty: 'background, border',
     outline: 'none',
     color: 'gray12',
     '&:hover:not(:focus)': {
@@ -116,8 +117,8 @@ const TextField = forwardRef<HTMLInputElement, TextFieldProps>(
 
     useEffect(() => {
       const styles: HTMLAttributes<'input'>['style'] = {
-        paddingLeft: undefined,
-        paddingRight: undefined
+        paddingLeft: prefix ? `calc(1rem + 1ch)` : undefined,
+        paddingRight: suffix ? `calc(1rem + 1ch)` : undefined
       };
 
       if (prefixRef.current) {
@@ -129,7 +130,7 @@ const TextField = forwardRef<HTMLInputElement, TextFieldProps>(
       }
 
       setPadding(styles);
-    }, [prefixRef, suffixRef]);
+    }, [prefix, suffix, prefixRef, suffixRef]);
 
     return (
       <div className={containerStyles}>