Documentation

Author: VislovIvan

Examples/DemosApp/DemosApp/ComponentsPreview/PreviewPages/CircularProgress.swift

@@ -5,7 +5,7 @@ import UIKit
 struct CircularProgress: View {
   @State private var model = CircularProgressVM {
     $0.label = "0"
-    $0.style = .striped
+    $0.style = .light
     $0.minValue = 0
     $0.maxValue = 100
   }
@@ -15,7 +15,7 @@ struct CircularProgress: View {
   var body: some View {
     VStack {
       PreviewWrapper(title: "SwiftUI") {
-        SUCircularProgress(model: self.model, currentValue: self.progress)
+        SUCircularProgress(currentValue: self.progress, model: self.model)
       }
       Form {
         ComponentColorPicker(selection: self.$model.color)

Sources/ComponentsKit/Components/CircularProgress/Models/CircularProgressStyle.swift

@@ -2,6 +2,7 @@ import Foundation
 
 extension CircularProgressVM {
   public enum Style {
+    /// Defines the visual styles for the circular progress component.
     case light
     case striped
   }

Sources/ComponentsKit/Components/CircularProgress/Models/CircularProgressVM.swift

@@ -2,7 +2,7 @@ import SwiftUI
 
 /// A model that defines the appearance properties for a circular progress component.
 public struct CircularProgressVM: ComponentVM {
-  /// The color of the circular progress indicator.
+  /// The color of the circular progress.
   ///
   /// Defaults to `.accent`.
   public var color: ComponentColor = .accent
@@ -12,32 +12,28 @@ public struct CircularProgressVM: ComponentVM {
   /// Defaults to `.light`.
   public var style: Style = .light
 
-  /// The predefined size of the circular progress indicator.
+  /// The  size of the circular progress.
   ///
   /// Defaults to `.medium`.
   public var size: ComponentSize = .medium
 
-  /// The minimum value for the progress range.
+  /// The minimum value of the circular progress.
   ///
   /// Defaults to `0`.
   public var minValue: CGFloat = 0
 
-  /// The maximum value for the progress range.
+  /// The maximum value of the circular progress.
   ///
   /// Defaults to `100`.
   public var maxValue: CGFloat = 100
 
   /// The width of the circular progress stroke.
-  ///
-  /// If not provided, the line width is automatically adjusted based on the size.
   public var lineWidth: CGFloat?
 
   /// An optional label to display inside the circular progress.
   public var label: String?
 
-  /// A custom font to display the label with.
-  ///
-  /// If not provided, the font is automatically adjusted based on the size.
+  /// The font used for the circular progress label text.
   public var font: UniversalFont?
 
   /// Initializes a new instance of `CircularProgressVM` with default values.

Sources/ComponentsKit/Components/CircularProgress/SUCircularProgress.swift

@@ -1,23 +1,38 @@
 import SwiftUI
 
+/// A SwiftUI component that displays a circular progress.
 public struct SUCircularProgress: View {
+  // MARK: - Properties
+
+  /// A model that defines the appearance properties.
   public var model: CircularProgressVM
+
+  /// The current progress value.
   public var currentValue: CGFloat
 
+  // MARK: - Initializer
+
+  /// Initializer.
+  /// - Parameters:
+  ///   - currentValue: Current progress.
+  ///   - model: A model that defines the appearance properties.
   public init(
-    model: CircularProgressVM = .init(),
-    currentValue: CGFloat = 0
+    currentValue: CGFloat = 0,
+    model: CircularProgressVM = .init()
   ) {
-    self.model = model
     self.currentValue = currentValue
+    self.model = model
   }
 
+  // MARK: - Body
+
   public var body: some View {
     let normalized = self.model.progress(for: currentValue)
 
     switch self.model.style {
     case .light:
       ZStack {
+        // Background part
         Path { path in
           path.addArc(
             center: self.model.center,
@@ -31,8 +46,12 @@ public struct SUCircularProgress: View {
           self.model.color.main.color.opacity(0.3),
           lineWidth: self.model.circularLineWidth
         )
-        .frame(width: self.model.preferredSize.width, height: self.model.preferredSize.height)
+        .frame(
+          width: self.model.preferredSize.width,
+          height: self.model.preferredSize.height
+        )
 
+        // Foreground part
         Path { path in
           path.addArc(
             center: self.model.center,
@@ -51,8 +70,12 @@ public struct SUCircularProgress: View {
           )
         )
         .rotationEffect(.degrees(-90))
-        .frame(width: self.model.preferredSize.width, height: self.model.preferredSize.height)
+        .frame(
+          width: self.model.preferredSize.width,
+          height: self.model.preferredSize.height
+        )
 
+        // Optional label
         if let label = self.model.label {
           Text(label)
             .font(self.model.titleFont.font)
@@ -62,6 +85,7 @@ public struct SUCircularProgress: View {
 
     case .striped:
       ZStack {
+        // Striped background part
         Path { path in
           path.addArc(
             center: self.model.center,
@@ -71,7 +95,10 @@ public struct SUCircularProgress: View {
             clockwise: false
           )
         }
-        .trim(from: self.model.backgroundArcStart(for: normalized), to: self.model.backgroundArcEnd(for: normalized))
+        .trim(
+          from: self.model.backgroundArcStart(for: normalized),
+          to: self.model.backgroundArcEnd(for: normalized)
+        )
         .stroke(
           .clear,
           style: StrokeStyle(
@@ -92,7 +119,10 @@ public struct SUCircularProgress: View {
                   clockwise: false
                 )
               }
-              .trim(from: self.model.backgroundArcStart(for: normalized), to: self.model.backgroundArcEnd(for: normalized))
+              .trim(
+                from: self.model.backgroundArcStart(for: normalized),
+                to: self.model.backgroundArcEnd(for: normalized)
+              )
               .stroke(
                 style: StrokeStyle(
                   lineWidth: self.model.circularLineWidth,
@@ -102,9 +132,12 @@ public struct SUCircularProgress: View {
             }
         }
         .rotationEffect(.degrees(-90))
-        .frame(width: self.model.preferredSize.width,
-               height: self.model.preferredSize.height)
+        .frame(
+          width: self.model.preferredSize.width,
+          height: self.model.preferredSize.height
+        )
 
+        // Foreground part
         Path { path in
           path.addArc(
             center: self.model.center,
@@ -114,7 +147,10 @@ public struct SUCircularProgress: View {
             clockwise: false
           )
         }
-        .trim(from: self.model.progressArcStart(for: normalized), to: self.model.progressArcEnd(for: normalized))
+        .trim(
+          from: self.model.progressArcStart(for: normalized),
+          to: self.model.progressArcEnd(for: normalized)
+        )
         .stroke(
           self.model.color.main.color,
           style: StrokeStyle(
@@ -123,9 +159,12 @@ public struct SUCircularProgress: View {
           )
         )
         .rotationEffect(.degrees(-90))
-        .frame(width: self.model.preferredSize.width,
-               height: self.model.preferredSize.height)
+        .frame(
+          width: self.model.preferredSize.width,
+          height: self.model.preferredSize.height
+        )
 
+        // Optional label
         if let label = self.model.label {
           Text(label)
             .font(self.model.titleFont.font)
@@ -136,6 +175,8 @@ public struct SUCircularProgress: View {
   }
 }
 
+// MARK: - Helpers
+
 struct StripesShapeCircularProgress: Shape, @unchecked Sendable {
   var model: CircularProgressVM