#48 [UI] ScheduleItem UI 구현

presentation/src/main/java/com/sopt/presentation/calendar/component/bottomsheet/ScheduleItem.kt

@@ -0,0 +1,49 @@
+package com.sopt.presentation.calendar.component.bottomsheet
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
+import com.sopt.core.designsystem.theme.NoostakTheme
+import com.sopt.core.extension.noRippleClickable
+import com.sopt.domain.entity.ScheduleDetailEntity
+
+@Composable
+fun ScheduleItem(
+    data: ScheduleDetailEntity,
+    onItemClick: (ScheduleDetailEntity) -> Unit = {}
+) {
+    Row(
+        verticalAlignment = Alignment.CenterVertically,
+        modifier = Modifier
+            .fillMaxWidth()
+            .noRippleClickable { onItemClick(data) }
+            .background(color = NoostakTheme.colors.gray50, shape = RoundedCornerShape(8.dp))
+            .padding(8.dp)
+    ) {
+        ScheduleColorChip(data.category)
+        Spacer(modifier = Modifier.width(7.dp))
+        Column {
+            Text(
+                text = data.name,
+                style = NoostakTheme.typography.b1SemiBold,
+                color = NoostakTheme.colors.black,
+                modifier = Modifier.padding(bottom = 3.dp)
+            )
+            Text(
+                text = data.duration,
+                style = NoostakTheme.typography.c4Regular,
+                color = NoostakTheme.colors.gray500
+            )
+        }
+    }
+}