feat: expose minimum width for lists (#353)

* feat: add exposed api to set the relative frame of the list markers

* refactor: reuse the functions inside the computed properties

Author: MojtabaHs

Sources/MarkdownUI/Theme/BlockStyle/ListMarkerConfiguration.swift

@@ -15,67 +15,106 @@ public struct ListMarkerConfiguration {
 extension BlockStyle where Configuration == ListMarkerConfiguration {
   /// A list marker style that uses decimal numbers beginning with 1.
   public static var decimal: Self {
+    decimal(minWidth: .em(1.5), alignment: .trailing)
+  }
+
+  /// A list marker style that uses uppercase roman numerals beginning with `I`.
+  public static var upperRoman: Self {
+    upperRoman(minWidth: .em(1.5), alignment: .trailing)
+  }
+
+  /// A list marker style that uses lowercase roman numerals beginning with `i`.
+  public static var lowerRoman: Self {
+    lowerRoman(minWidth: .em(1.5), alignment: .trailing)
+  }
+
+  /// A list marker style that uses a dash.
+  public static var dash: Self {
+    dash(minWidth: .em(1.5), alignment: .trailing)
+  }
+
+  /// A list marker style that uses a filled circle.
+  public static var disc: Self {
+    disc(minWidth: .em(1.5), alignment: .trailing)
+  }
+
+  /// A list marker style that uses a hollow circle.
+  public static var circle: Self {
+    circle(minWidth: .em(1.5), alignment: .trailing)
+  }
+
+  /// A list marker style that uses a filled square.
+  public static var square: Self {
+    square(minWidth: .em(1.5), alignment: .trailing)
+  }
+
+  /// A list marker style that alternates between disc, circle, and square, depending on the list level.
+  public static var discCircleSquare: Self {
+    BlockStyle { configuration in
+      let styles: [Self] = [.disc, .circle, .square]
+      styles[min(configuration.listLevel, styles.count) - 1]
+        .makeBody(configuration: configuration)
+    }
+  }
+}
+
+// MARK: Dynamic
+
+extension BlockStyle where Configuration == ListMarkerConfiguration {
+  /// A list marker style that uses decimal numbers beginning with 1.
+  public static func decimal(minWidth: RelativeSize, alignment: Alignment = .center) -> Self {
     BlockStyle { configuration in
       Text("\(configuration.itemNumber).")
         .monospacedDigit()
-        .relativeFrame(minWidth: .em(1.5), alignment: .trailing)
+        .relativeFrame(minWidth: minWidth, alignment: alignment)
     }
   }
 
   /// A list marker style that uses uppercase roman numerals beginning with `I`.
-  public static var upperRoman: Self {
+  public static func upperRoman(minWidth: RelativeSize, alignment: Alignment = .center) -> Self {
     BlockStyle { configuration in
       Text(configuration.itemNumber.roman + ".")
-        .relativeFrame(minWidth: .em(1.5), alignment: .trailing)
+        .relativeFrame(minWidth: minWidth, alignment: alignment)
     }
   }
 
   /// A list marker style that uses lowercase roman numerals beginning with `i`.
-  public static var lowerRoman: Self {
+  public static func lowerRoman(minWidth: RelativeSize, alignment: Alignment = .center) -> Self {
     BlockStyle { configuration in
       Text(configuration.itemNumber.roman.lowercased() + ".")
-        .relativeFrame(minWidth: .em(1.5), alignment: .trailing)
+        .relativeFrame(minWidth: minWidth, alignment: alignment)
     }
   }
 
   /// A list marker style that uses a dash.
-  public static var dash: Self {
+  public static func dash(minWidth: RelativeSize, alignment: Alignment = .center) -> Self {
     BlockStyle { _ in
       Text("-")
-        .relativeFrame(minWidth: .em(1.5), alignment: .trailing)
+        .relativeFrame(minWidth: minWidth, alignment: alignment)
     }
   }
 
   /// A list marker style that uses a filled circle.
-  public static var disc: Self {
+  public static func disc(minWidth: RelativeSize, alignment: Alignment = .center) -> Self {
     BlockStyle { _ in
       ListBullet.disc
-        .relativeFrame(minWidth: .em(1.5), alignment: .trailing)
+        .relativeFrame(minWidth: minWidth, alignment: alignment)
     }
   }
 
   /// A list marker style that uses a hollow circle.
-  public static var circle: Self {
+  public static func circle(minWidth: RelativeSize, alignment: Alignment = .center) -> Self {
     BlockStyle { _ in
       ListBullet.circle
-        .relativeFrame(minWidth: .em(1.5), alignment: .trailing)
+        .relativeFrame(minWidth: minWidth, alignment: alignment)
     }
   }
 
   /// A list marker style that uses a filled square.
-  public static var square: Self {
+  public static func square(minWidth: RelativeSize, alignment: Alignment = .center) -> Self {
     BlockStyle { _ in
       ListBullet.square
-        .relativeFrame(minWidth: .em(1.5), alignment: .trailing)
-    }
-  }
-
-  /// A list marker style that alternates between disc, circle, and square, depending on the list level.
-  public static var discCircleSquare: Self {
-    BlockStyle { configuration in
-      let styles: [Self] = [.disc, .circle, .square]
-      styles[min(configuration.listLevel, styles.count) - 1]
-        .makeBody(configuration: configuration)
+        .relativeFrame(minWidth: minWidth, alignment: alignment)
     }
   }
 }