CardHeader

public struct CardHeader

extension CardHeader: View

extension CardHeader: _ViewEmptyChecking

CardHeader: Composite Component Protocol

The _CardHeaderComponent protocol defines the complete header section of a card. This protocol combines media, main header, and extended header components to create a comprehensive header layout that can accommodate various content types and layouts.

Usage

This component serves as a container that combines all header-related components into a unified interface.

CardHeader {
    Image("productThumbnail")
        .resizable()
        .aspectRatio(contentMode: .fill)
        .frame(height: 145)
} description: {
    Text("Title")
} title: {
    Text("Title that goes to two lines before truncating")
} subtitle: {
    Text("Subtitle that goes to multiple lines before truncating")
} icons: {
    IconStack(icons: [TextOrIcon.icon(Image(systemName: "circle.fill")),
                     TextOrIcon.icon(Image(systemName: "paperclip")),
                     TextOrIcon.text("1")])
} detailImage: {
    Image("ProfilePic")
        .resizable()
        .clipShape(Circle())
} headerAction: {
    FioriButton(title: "Action")
} counter: {
    Text("1 of 3")
} row1: {
    HStack {
        LabelItem(icon: Image(systemName: "exclamationmark.triangle.fill"), title: "Negative")
            .titleStyle { config in
                config.title.foregroundStyle(Color.preferredColor(.negativeLabel))
            }
        LabelItem(title: "Critical")
            .titleStyle { config in
                config.title.foregroundStyle(Color.preferredColor(.criticalLabel))
            }
        LabelItem(icon: Image(systemName: "checkmark.circle"), title: "Positive")
            .titleStyle { config in
                config.title.foregroundStyle(Color.preferredColor(.positiveLabel))
            }
    }
} row2: {
    HStack {
        Text("256 reviews")
    }
} row3: {
    HStack {
        Tag(verbatim: "Tag")
        Tag(verbatim: "Tag")
        Tag(verbatim: "Tag")
    }
} kpi: {
    _KPIItem(KPIItemData.components([.icon(Image(systemName: "arrowtriangle.up.fill")),
                                     .unit("$"),
                                     .metric("26.9"),
                                     .unit("M")]))
} kpiCaption: {
    Text("Revenue")
}

CardHeader(mediaImage: Image("productThumbnail"),
           description: "Title",
           title: "Title",
           subtitle: "Subtitle",
           icons: [TextOrIcon.icon(Image(systemName: "circle.fill"))],
           detailImage: Image("ProfilePic"),
           headerAction: FioriButton(title: "Action"),
           counter: "1 of 3",
           kpi: KPIItemData.components([.unit("$"), .metric("26.9"), .unit("M")]),
           kpiCaption: "Revenue")


                      
                      
                      init(mediaImage:description:title:subtitle:icons:detailImage:headerAction:counter:flexItem:flexItemPosition:row1:row2:row3:kpi:kpiCaption:componentIdentifier:)

Undocumented

Declaration

Swift

public init(@ViewBuilder mediaImage: () -> any View = { EmptyView() },
            @ViewBuilder description: () -> any View = { EmptyView() },
            @ViewBuilder title: () -> any View,
            @ViewBuilder subtitle: () -> any View = { EmptyView() },
            @IconBuilder icons: () -> any View = { EmptyView() },
            @ViewBuilder detailImage: () -> any View = { EmptyView() },
            @ViewBuilder headerAction: () -> any View = { EmptyView() },
            @ViewBuilder counter: () -> any View = { EmptyView() },
            @ViewBuilder flexItem: () -> any View = { EmptyView() },
            flexItemPosition: FlexItemPositionType? = nil,
            @ViewBuilder row1: () -> any View = { EmptyView() },
            @ViewBuilder row2: () -> any View = { EmptyView() },
            @ViewBuilder row3: () -> any View = { EmptyView() },
            @ViewBuilder kpi: () -> any View = { EmptyView() },
            @ViewBuilder kpiCaption: () -> any View = { EmptyView() },
            componentIdentifier: String? = CardHeader.identifier)

identifier
Undocumented
Declaration
Swift

static let identifier: String


                      
                      
                      init(mediaImage:description:title:subtitle:icons:detailImage:headerAction:counter:flexItem:flexItemPosition:row1:row2:row3:kpi:kpiCaption:)

Undocumented

Declaration

Swift

init(mediaImage: Image? = nil,
     description: AttributedString? = nil,
     title: AttributedString,
     subtitle: AttributedString? = nil,
     icons: [TextOrIcon] = [],
     detailImage: Image? = nil,
     headerAction: FioriButton? = nil,
     counter: AttributedString? = nil,
     @ViewBuilder flexItem: () -> any View = { EmptyView() },
     flexItemPosition: FlexItemPositionType? = nil,
     @ViewBuilder row1: () -> any View = { EmptyView() },
     @ViewBuilder row2: () -> any View = { EmptyView() },
     @ViewBuilder row3: () -> any View = { EmptyView() },
     kpi: KPIItemData? = nil,
     kpiCaption: AttributedString? = nil)


                      
                      
                      init(_:)

Undocumented

Declaration

Swift

init(_ configuration: CardHeaderConfiguration)


                      
                      
                      body

Declaration

Swift

@MainActor
public var body: some View { get }

isEmpty
Undocumented
Declaration
Swift

public var isEmpty: Bool { get }