Implemented the ListItem component in the app target.
This commit is contained in:
parent
364fa4f3d5
commit
0d43a148db
85
Piper/Sources/UI/Components/ListItem.swift
Normal file
85
Piper/Sources/UI/Components/ListItem.swift
Normal file
@ -0,0 +1,85 @@
|
||||
//
|
||||
// ListItem.swift
|
||||
// Piper ~ App
|
||||
//
|
||||
// Created by Javier Cicchelli on 06/10/2024.
|
||||
// Copyright © 2024 Röck+Cöde. All rights reserved.
|
||||
//
|
||||
|
||||
import SwiftUI
|
||||
|
||||
struct ListItem: View {
|
||||
|
||||
// MARK: Properties
|
||||
|
||||
let repository: Repository
|
||||
|
||||
// MARK: Body
|
||||
|
||||
var body: some View {
|
||||
Label {
|
||||
VStack(
|
||||
alignment: .leading,
|
||||
spacing: 4
|
||||
) {
|
||||
Text(repository.name)
|
||||
.font(.title)
|
||||
.fontWeight(.semibold)
|
||||
.foregroundStyle(.primary)
|
||||
|
||||
Text(repository.path.relativePath)
|
||||
.font(.subheadline)
|
||||
.foregroundStyle(.secondary)
|
||||
}
|
||||
} icon: {
|
||||
Image(systemName: "folder")
|
||||
.resizable()
|
||||
}
|
||||
.labelStyle(ItemLabelStyle())
|
||||
.padding(.vertical, 8)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// MARK: - Label Styles
|
||||
|
||||
struct ItemLabelStyle: LabelStyle {
|
||||
func makeBody(configuration: Configuration) -> some View {
|
||||
HStack(
|
||||
alignment: .center,
|
||||
spacing: 16
|
||||
) {
|
||||
configuration.icon
|
||||
.frame(width: 44)
|
||||
|
||||
configuration.title
|
||||
.frame(maxWidth: .infinity, alignment: .leading)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// MARK: - Previews
|
||||
|
||||
#Preview("List Item component") {
|
||||
List {
|
||||
ListItem(
|
||||
repository: .init(
|
||||
.init(filePath: "/full/path/to/repository/name.git")!,
|
||||
sortOrder: 0
|
||||
)
|
||||
)
|
||||
ListItem(
|
||||
repository: .init(
|
||||
.init(filePath: "/full/path/to/repository/name.git")!,
|
||||
sortOrder: 0
|
||||
)
|
||||
)
|
||||
ListItem(
|
||||
repository: .init(
|
||||
.init(filePath: "/full/path/to/repository/name.git")!,
|
||||
sortOrder: 0
|
||||
)
|
||||
)
|
||||
}
|
||||
.frame(width: 400, height: 220)
|
||||
}
|
Loading…
x
Reference in New Issue
Block a user