pawel/Triton
1
0
Fork 0
mirror of https://github.com/otaviocc/Triton.git synced 2026-01-29 19:54:27 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add multiline support for Captions in Picture Upload and Editor windows

Browse source
This commit is contained in:
Otavio Cordeiro 2025-12-19 17:34:41 +01:00
parent 17398e7dc0
commit 7b35b32d96
3 changed files with 94 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

74
Packages/DesignSystem/Sources/DesignSystem/Views/PlaceholderTextEditor/PlaceholderTextEditor.swift Normal file
View file

@ -0,0 +1,74 @@
import SwiftUI
/// A text editor with placeholder text support.
///
/// `PlaceholderTextEditor` extends the standard `TextEditor` by adding placeholder text
/// that appears when the editor is empty. The placeholder text is displayed in a secondary
/// color and automatically disappears when the user begins typing.
public struct PlaceholderTextEditor: View {
// MARK: - Properties
private let placeholder: String
private var text: Binding<String>
private var help: String
// MARK: - Lifecycle
/// Creates a text editor with placeholder support.
///
/// - Parameters:
/// - placeholder: The text to display when the editor is empty.
/// - text: A binding to the text being edited.
/// - help: The help text displayed on hover.
public init(
placeholder: String,
text: Binding<String>,
help: String
) {
self.placeholder = placeholder
self.text = text
self.help = help
}
// MARK: - Public
public var body: some View {
ZStack(alignment: .topLeading) {
TextEditor(text: text)
.autocorrectionDisabled(false)
.font(.body.monospaced())
.textEditorCard()
.help(help)
if text.wrappedValue.isEmpty {
Text(placeholder)
.foregroundColor(.secondary)
.font(.body.monospaced())
.padding(.vertical, 8)
.padding(.horizontal, 13)
.allowsHitTesting(false)
}
}
}
}
// MARK: - Preview
#Preview("Without Content") {
PlaceholderTextEditor(
placeholder: "Caption",
text: .constant(""),
help: "Add a caption for your image"
)
.frame(width: 400)
}
#Preview("With Content") {
PlaceholderTextEditor(
placeholder: "Alt text",
text: .constant("Photo of a beautiful beach on a sunny day"),
help: "Add descriptive alt text for accessibility"
)
.frame(width: 400)
}

20
Packages/Pics/Sources/Pics/Views/Edit Picture/EditPictureView.swift
View file

@ -44,17 +44,17 @@ struct EditPictureView: View {
@ViewBuilder
private func makeEditorView() -> some View {
VStack {
TextField("Caption", text: $viewModel.caption)
.autocorrectionDisabled(false)
.font(.body.monospaced())
.textFieldCard()
.help("Add a caption for your image")
PlaceholderTextEditor(
placeholder: "Caption",
text: $viewModel.caption,
help: "Add a caption for your image"
)
TextEditor(text: $viewModel.altText)
.autocorrectionDisabled(false)
.font(.body.monospaced())
.textEditorCard()
.help("Add descriptive alt text for accessibility")
PlaceholderTextEditor(
placeholder: "Alt text",
text: $viewModel.altText,
help: "Add descriptive alt text for accessibility"
)
makeTagsView()
}

20
Packages/Pics/Sources/Pics/Views/Upload/UploadView.swift
View file

@ -123,17 +123,17 @@ struct UploadView: View {
@ViewBuilder
private func makeEditorView() -> some View {
VStack {
TextField("Caption", text: $viewModel.caption)
.autocorrectionDisabled(false)
.font(.body.monospaced())
.textFieldCard()
.help("Add a caption for your image")
PlaceholderTextEditor(
placeholder: "Caption",
text: $viewModel.caption,
help: "Add a caption for your image"
)
TextEditor(text: $viewModel.altText)
.autocorrectionDisabled(false)
.font(.body.monospaced())
.textEditorCard()
.help("Add descriptive alt text for accessibility")
PlaceholderTextEditor(
placeholder: "Alt text",
text: $viewModel.altText,
help: "Add descriptive alt text for accessibility"
)
makeTagsView()
}