libary/src/main/java/com/example/libary/SearchInput.kt

@@ -0,0 +1,91 @@
+package com.example.libary
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.shape.AbsoluteRoundedCornerShape
+import androidx.compose.material3.OutlinedTextField
+import androidx.compose.material3.Text
+import androidx.compose.material3.TextFieldDefaults
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.focus.onFocusChanged
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import com.example.libary.theme.AccentColor
+
+@Composable
+fun SearchInput(
+    modifier: Modifier = Modifier,
+    value: String = "",
+    onValueChange: (String) -> Unit,
+) {
+    var focus by remember { mutableStateOf(false) }
+
+    OutlinedTextField(
+        value = value,
+        modifier = modifier.onFocusChanged {
+            focus = it.hasFocus
+        },
+        onValueChange = onValueChange,
+        placeholder = {
+            Text(
+                text = "Искать описание",
+                color = Color(0xFF939396),
+                fontWeight = FontWeight.W400,
+                fontSize = 16.sp
+            )
+        },
+        leadingIcon = {
+            Image(
+                painter = painterResource(R.drawable.icon_search),
+                contentDescription = null
+            )
+        },
+        trailingIcon = {
+            if (focus) {
+                Image(
+                    painter = painterResource(R.drawable.delete),
+                    contentDescription = null
+                )
+            }
+        },
+        shape = AbsoluteRoundedCornerShape(10.dp),
+        colors = TextFieldDefaults.colors(
+            cursorColor = AccentColor,
+            focusedPlaceholderColor = Color(0xFF939396),
+            unfocusedPlaceholderColor = Color(0xFF939396),
+
+            focusedTextColor = Color.Black,
+            unfocusedTextColor = Color.Black,
+
+            focusedIndicatorColor = Color(0xFFEBEBEB),
+            unfocusedIndicatorColor = Color(0xFFEBEBEB),
+
+            focusedContainerColor = Color(0xFFF5F5F9),
+            unfocusedContainerColor = Color(0xFFF5F5F9)
+        )
+    )
+}
+
+@Preview
+@Composable
+private fun SearchInputPrev() {
+    var value by remember { mutableStateOf("") }
+
+    SearchInput(
+        value = value,
+        modifier = Modifier.fillMaxWidth().padding(horizontal = 20.dp, vertical = 7.dp),
+        onValueChange = {
+            value = it
+        }
+    )
+}

libary/src/main/res/drawable/icon_search.xml

@@ -0,0 +1,20 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="20dp"
+    android:height="20dp"
+    android:viewportWidth="20"
+    android:viewportHeight="20">
+  <path
+      android:pathData="M9.167,15.833C12.849,15.833 15.833,12.849 15.833,9.167C15.833,5.485 12.849,2.5 9.167,2.5C5.485,2.5 2.5,5.485 2.5,9.167C2.5,12.849 5.485,15.833 9.167,15.833Z"
+      android:strokeLineJoin="round"
+      android:strokeWidth="2"
+      android:fillColor="#00000000"
+      android:strokeColor="#B8C1CC"
+      android:strokeLineCap="round"/>
+  <path
+      android:pathData="M17.5,17.5L13.875,13.875"
+      android:strokeLineJoin="round"
+      android:strokeWidth="2"
+      android:fillColor="#00000000"
+      android:strokeColor="#B8C1CC"
+      android:strokeLineCap="round"/>
+</vector>