Add legend

Sources/UIPreview/UICatalog/CatalogItem.swift

@@ -12,17 +12,24 @@ struct CatalogItem<Content: UIViewCatalogPresentable>: View {
   var body: some View {
     ForEach(values: Content.previewModels) { model in
       ForEach(values: configuration.colorSchemes) { scheme in
-        item(model: model, scheme: scheme)
+        ForEach(values: configuration.contentSizeCategory) { category in
+          item(model: model, scheme: scheme, category: category)
+        }
       }
     }
   }
 
   func item(model: Content.PreviewModel,
-            scheme: ColorScheme) -> some View {
+            scheme: ColorScheme,
+            category: ContentSizeCategory) -> some View {
 
 
     VStack(alignment: .center, spacing: 0) {
-      Label(String(describing: model), systemImage: scheme.systemImageName)
+      HStack {
+        Image(systemName: scheme.systemImageName)
+        Image(systemName: category.systemImageName)
+        Text(String(describing: model))
+      }
       .padding()
 
       Content.preview(with: model)
@@ -30,6 +37,7 @@ struct CatalogItem<Content: UIViewCatalogPresentable>: View {
         .padding()
         .background(Color(.systemBackground))
         .colorScheme(scheme)
+        .environment(\.sizeCategory, category)
     }
     .background(Color(.systemGroupedBackground))
     .cornerRadius(6)
@@ -43,6 +51,7 @@ struct CatalogItem_Previews: PreviewProvider {
   static var previews: some View {
     NavigationView {
       ScrollView(.vertical) {
+        PreviewLegend()
         CatalogItem<TestView>(configuration: .init())
       }.navigationBarTitle("TestView")
     }
@@ -56,12 +65,6 @@ private final class TestView: UILabel, UICatalogPresentable {
     "Hello2 world",
     "Hello3 world",
     "Hello4 world",
-    "Hello world",
-    "Hello world",
-    "Hello world",
-    "Hello world",
-    "Hello world",
-    "Hello world",
   ]
 
   func apply(previewModel: String) {

Sources/UIPreview/UICatalog/GroupItem.swift

@@ -39,7 +39,8 @@ struct GroupItemRow: View {
       .frame(maxWidth: .infinity)
       .padding()
       .background(Color(.systemGroupedBackground))
-      .border(Color.secondary)
+      .cornerRadius(6)
+      .padding()
 
     }
     if model.isExpanded {
@@ -56,6 +57,7 @@ struct GroupItemRow: View {
 struct GroupItem_Previews: PreviewProvider {
   static var previews: some View {
     ScrollView {
+      PreviewLegend()
       GroupItem(items: [
         .init(title: "Group 1",
               content: { AnyView(Text("Preview")) } ),

Sources/UIPreview/UICatalog/Preview.swift

@@ -4,7 +4,7 @@ import SwiftUI
 import UIKit
 
 extension UICatalog {
-  @available(iOS 13, *)
+  @available(iOS 14, *)
   public struct Preview {
     init(_ view: AnyView, title: String) {
       self.title = title
@@ -13,6 +13,7 @@ extension UICatalog {
 
     func preview() -> some View {
       ScrollView(.vertical, showsIndicators: true) {
+        PreviewLegend()
         view
       }.navigationBarTitle(title)
     }

Sources/UIPreview/UICatalog/PreviewConfiguration.swift

@@ -5,11 +5,14 @@ import UIKit
 
 extension UICatalog {
   public struct PreviewConfiguration {
-    public init(themes: [Theme] = Theme.allCases) {
+    public init(themes: [Theme] = Theme.allCases,
+                contentSize: [UIContentSizeCategory] = [.unspecified]) {
       self.themes = themes
+      self.contentSize = contentSize
     }
 
     let themes: [Theme]
+    let contentSize: [UIContentSizeCategory]
   }
 
   public enum Theme: CaseIterable {
@@ -27,7 +30,11 @@ extension UICatalog.Theme {
   }
 }
 
-@available(iOS 13, *)
+@available(iOS 14, *)
 extension UICatalog.PreviewConfiguration {
   var colorSchemes: [ColorScheme] { themes.map(\.scheme) }
+  var contentSizeCategory: [ContentSizeCategory] {
+    let categories = contentSize.compactMap { ContentSizeCategory($0) }
+    return categories.isEmpty ? [.medium] : categories
+  }
 }

Sources/UIPreview/UICatalog/PreviewDescriptor.swift

@@ -4,7 +4,7 @@ import SwiftUI
 import UIKit
 
 extension UICatalog {
-  @available(iOS 13, *)
+  @available(iOS 14, *)
   public struct PreviewDescriptor: Identifiable, Hashable {
     let builder: () -> AnyView
     public let id: String
@@ -33,13 +33,11 @@ public extension UICatalog.PreviewDescriptor {
   }
 
   init(_ content: UICatalog.PreviewDescriptor...,
-       configuration: UICatalog.PreviewConfiguration = .init(),
        title: String? = nil) {
-    self.init(content, configuration: configuration, title: title)
+    self.init(content, title: title)
   }
 
   init(_ content: [UICatalog.PreviewDescriptor],
-       configuration: UICatalog.PreviewConfiguration = .init(),
        title: String? = nil) {
     id = content.map(\.id).joined()
     self.title = title ?? content.map(\.title).joined(separator: " ")

Sources/UIPreview/UICatalog/PreviewLegend.swift

@@ -0,0 +1,99 @@
+#if canImport(SwiftUI)
+import SwiftUI
+#endif
+
+@available(iOS 14, *)
+struct PreviewLegend: View {
+  @State var isExpanded: Bool = false
+
+  var body: some View {
+    VStack(alignment: .leading) {
+      Button(action: {
+        isExpanded.toggle()
+      }, label: {
+        Label("Legend",
+              systemImage: isExpanded
+                ? "chevron.up"
+                : "chevron.down")
+          .foregroundColor(.primary)
+      })
+      if isExpanded {
+        PreviewLegendBody()
+      }
+    }
+    .frame(maxWidth: .infinity)
+    .padding()
+    .background(Color(.systemGroupedBackground))
+    .cornerRadius(6)
+    .padding()
+  }
+}
+
+@available(iOS 14, *)
+private struct PreviewLegendBody: View {
+  var body: some View {
+    VStack(alignment: .leading) {
+      Divider()
+        .foregroundColor(.accentColor)
+      Text("Theme: ")
+        .font(.headline)
+        .padding()
+      ForEach(values: UICatalog.Theme.allCases) { theme in
+        Label {
+          Text(theme.legend)
+        } icon: {
+          Image(systemName: theme.scheme.systemImageName)
+        }
+      }
+      Text("Content size: ")
+        .font(.headline)
+        .padding()
+      ForEach(values: ContentSizeCategory.allCases) { category in
+        Label {
+          Text(String(describing: category))
+        } icon: {
+          Image(systemName: category.systemImageName)
+        }
+      }
+    }
+  }
+}
+
+@available(iOS 14, *)
+struct PreviewLegend_Previews: PreviewProvider {
+  static var previews: some View {
+    PreviewLegend()
+      .previewLayout(.sizeThatFits)
+  }
+}
+
+private extension UICatalog.Theme {
+  var legend: String {
+    switch self {
+    case .light: return "Light theme"
+    case .dark: return "Dark theme"
+    }
+  }
+}
+
+@available(iOS 13, *)
+extension ContentSizeCategory {
+  var systemImageName: String {
+    switch self {
+    case .accessibilityExtraExtraExtraLarge: return "7.circle.fill"
+    case .accessibilityExtraExtraLarge: return "4.circle.fill"
+    case .extraSmall: return "1.circle"
+    case .small: return "2.circle"
+    case .medium: return "3.circle"
+    case .large: return "4.circle"
+    case .extraLarge: return "5.circle"
+    case .extraExtraLarge: return "6.circle"
+    case .extraExtraExtraLarge: return "7.circle"
+    case .accessibilityMedium: return "3.circle.fill"
+    case .accessibilityLarge: return "4.circle.fill"
+    case .accessibilityExtraLarge: return "5.circle.fill"
+    @unknown default:
+      return "questionmark"
+    }
+  }
+}