Allow for customization of the preview name

BlueprintUI/Sources/BlueprintView/ElementPreview.swift

@@ -67,6 +67,7 @@ public struct ElementPreview: View {
     public typealias ElementProvider = () -> Element
 
     private let name: String
+    private let previewName: String?
 
     /// The types of previews to include in the Xcode preview.
     private let previewTypes: [PreviewType]
@@ -79,10 +80,12 @@ public struct ElementPreview: View {
     /// Creates a new `ElementPreview` with several common devices that your users may use.
     public static func commonDevices(
         named name: String = "",
+        previewName: String? = nil,
         with provider: @escaping ElementProvider
     ) -> Self {
         Self(
             named: name,
+            previewName: previewName,
             with: [
                 .device(.iPhoneSE_1),
                 .device(.iPhone8),
@@ -102,11 +105,13 @@ public struct ElementPreview: View {
     /// If you do not pass a preview type, `.thatFits` is used.
     public init(
         named name: String = "",
+        previewName: String? = nil,
         with previewType: PreviewType = .thatFits(),
         with provider: @escaping ElementProvider
     ) {
         self.init(
             named: name,
+            previewName: previewName,
             with: [previewType],
             with: provider
         )
@@ -120,12 +125,14 @@ public struct ElementPreview: View {
     /// If you do not pass a preview type, `.thatFits` is used.
     public init(
         named name: String = "",
+        previewName: String? = nil,
         with previewTypes: [PreviewType],
         with provider: @escaping ElementProvider
     ) {
         self.name = name
         self.previewTypes = previewTypes
         self.provider = provider
+        self.previewName = previewName
     }
 
     // MARK: View
@@ -134,6 +141,7 @@ public struct ElementPreview: View {
         ForEach(self.previewTypes, id: \.identifier) { previewType in
             previewType.previewView(
                 with: self.name,
+                previewName: previewName,
                 for: self.provider()
             )
         }
@@ -188,37 +196,39 @@ extension ElementPreview {
 
         public func previewView(
             with name: String,
+            previewName: String? = nil,
             for element: Element
         ) -> AnyView {
-
             let formattedName: String = {
+
                 if name.isEmpty == false {
                     return " – " + name
                 } else {
                     return ""
                 }
             }()
 
+            // If we've been given a preview name, just use that, otherwise compute it
             switch self {
             case .device(let device):
                 return AnyView(
                     constrained(element: element)
                         .previewDevice(.init(rawValue: device.rawValue))
-                        .previewDisplayName(device.rawValue + formattedName)
+                        .previewDisplayName(previewName ?? device.rawValue + formattedName)
                 )
 
             case .fixed(let width, let height):
                 return AnyView(
                     constrained(element: element)
                         .previewLayout(.fixed(width: width, height: height))
-                        .previewDisplayName("Fixed Size: (\(width), \(height))" + formattedName)
+                        .previewDisplayName(previewName ?? "Fixed Size: (\(width), \(height))" + formattedName)
                 )
 
             case .thatFits(let padding):
                 return AnyView(
                     constrained(element: element)
                         .previewLayout(.sizeThatFits)
-                        .previewDisplayName("Size That Fits" + formattedName)
+                        .previewDisplayName(previewName ?? "Size That Fits" + formattedName)
                         .padding(.all, padding)
                 )
             }

SampleApp/Sources/XcodePreviewDemo.swift

@@ -32,6 +32,12 @@ struct TestingView_Preview: PreviewProvider {
         ElementPreview(with: .thatFits(padding: 5)) {
             TestElement()
         }
+        ElementPreview(named: "with a name", with: .thatFits(padding: 5)) {
+            TestElement()
+        }
+        ElementPreview(previewName: "Preview Name", with: .thatFits(padding: 5)) {
+            TestElement()
+        }
     }
 }