feat: 🎸 [HCPSDKFIORIUIKIT-2766] sort & filter enhancement, full filters(cherrypick)

Apps/Examples/Examples/FioriSwiftUICore/SortFilter/SortFilterExample.swift

@@ -14,7 +14,7 @@ struct SortFilterExample: View {
             .picker(item: .init(name: "Fixed Many Filter", value: [0], valueOptions: ["Received", "Started", "Hold", "Transfer", "Completed", "Pending Review Pending Pending Pending Pending Pending", "Accepted Medium", "Pending Medium", "Completed Medium", "Checked", "Unchecked", "Partially Checked", "Checked and Unchecked", "Checked and Partially Checked", "Unchecked and Partially Checked", "Partially Checked and Unchecked", "Checked and Unchecked and Partially Checked", "Unchecked and Partially Checked and Partially Checked", "Partially Checked and Unchecked and Partially Checked", "Checked Finally", "Unchecked Finally", "Partially Checked Finally", "Checked and Unchecked Finally", "Checked and Partially Checked Finally", "Unchecked and Partially Checked Finally", "Partially Checked and Unchecked Finally", "Checked Finally and Partially Checked Finally", "Unchecked Finally and Partially Checked Finally", "Partially Checked Finally and Partially Checked Finally", "Review", "Reviewed", "To be Reviewed", "Pending for Review", "Booked", "To be Booked", "Will Book", "Booking Canceled"], allowsMultipleSelection: false, allowsEmptySelection: true, barItemDisplayMode: .value, icon: "clock", itemLayout: .fixed, displayMode: .filterFormCell), showsOnFilterFeedbackBar: true)
         ],
         [
-            .picker(item: .init(name: "Priority", value: [0], valueOptions: ["High", "Medium", "Low"], allowsMultipleSelection: true, allowsEmptySelection: true, showsValueForSingleSelected: false, icon: "filemenu.and.cursorarrow"), showsOnFilterFeedbackBar: true),
+            .picker(item: .init(name: "Priority", value: [0], valueOptions: ["High", "Medium", "Low"], allowsMultipleSelection: true, allowsEmptySelection: true, barItemDisplayMode: .nameAndValue, icon: "filemenu.and.cursorarrow"), showsOnFilterFeedbackBar: true),
             .filterfeedback(item: .init(name: "Sort Order", value: [0], valueOptions: ["Ascending", "Descending"], allowsMultipleSelection: false, allowsEmptySelection: false, icon: "checkmark")),
             .stepper(item: .init(name: "Quantity", stepperTitle: "Label", value: 1, step: 1, stepRange: 0 ... 100, isDecimalSupported: false, description: "Hint Text"), showsOnFilterFeedbackBar: true)
 

Sources/FioriSwiftUICore/Components/CancellableResettableForm.swift

@@ -10,6 +10,8 @@ struct CancellableResettableDialogForm<Title: View, CancelAction: View, ResetAct
     var resetAction: ResetAction
     var applyAction: ApplyAction
 
+    let popoverWidth = 393.0
+
     public init(@ViewBuilder title: () -> Title,
                 @ViewBuilder cancelAction: () -> CancelAction,
                 @ViewBuilder resetAction: () -> ResetAction,
@@ -41,7 +43,7 @@ struct CancellableResettableDialogForm<Title: View, CancelAction: View, ResetAct
             #endif
             self.applyAction
         }
-        .frame(width: UIDevice.current.userInterfaceIdiom != .phone ? 393 : nil)
+        .frame(width: UIDevice.current.userInterfaceIdiom != .phone ? self.popoverWidth : nil)
         .padding([.top, .bottom], UIDevice.current.userInterfaceIdiom == .pad ? 13 : 16)
         #if !os(visionOS)
             .background(Color.preferredColor(.chromeSecondary))
@@ -60,6 +62,8 @@ struct CancellableResettableDialogNavigationForm<Title: View, CancelAction: View
     var resetAction: ResetAction
     var applyAction: ApplyAction
 
+    let popoverWidth = 393.0
+
     public init(@ViewBuilder title: () -> Title,
                 @ViewBuilder cancelAction: () -> CancelAction,
                 @ViewBuilder resetAction: () -> ResetAction,
@@ -96,7 +100,7 @@ struct CancellableResettableDialogNavigationForm<Title: View, CancelAction: View
                 }
             }
         }
-        .frame(width: UIDevice.current.userInterfaceIdiom != .phone ? 393 : nil)
+        .frame(width: UIDevice.current.userInterfaceIdiom != .phone ? self.popoverWidth : nil)
         .padding([.bottom], UIDevice.current.userInterfaceIdiom == .pad ? 13 : 16)
         #if !os(visionOS)
             .background(Color.preferredColor(.chromeSecondary))
@@ -108,11 +112,12 @@ struct CancellableResettableDialogNavigationForm<Title: View, CancelAction: View
 
 struct ApplyButtonStyle: PrimitiveButtonStyle {
     @Environment(\.isEnabled) private var isEnabled: Bool
-
+    let popoverWidth = 393.0
+
     func makeBody(configuration: Configuration) -> some View {
         if self.isEnabled {
             configuration.label
-                .frame(width: UIDevice.current.userInterfaceIdiom == .pad ? 375 - 13 * 2 :
+                .frame(width: UIDevice.current.userInterfaceIdiom == .pad ? self.popoverWidth - 13 * 2 :
                     Screen.bounds.size.width - 16 * 2)
                 .padding([.top, .bottom], 8)
                 .font(.body)
@@ -131,7 +136,7 @@ struct ApplyButtonStyle: PrimitiveButtonStyle {
                 .padding([.top], UIDevice.current.userInterfaceIdiom == .pad ? 16 : 8)
         } else {
             configuration.label
-                .frame(width: UIDevice.current.userInterfaceIdiom == .pad ? 375 - 13 * 2 :
+                .frame(width: UIDevice.current.userInterfaceIdiom == .pad ? self.popoverWidth - 13 * 2 :
                     Screen.bounds.size.width - 16 * 2)
                 .padding([.top, .bottom], 8)
                 .font(.body)

Sources/FioriSwiftUICore/Models/ModelDefinitions.swift

@@ -472,6 +472,8 @@ public protocol FilterFeedbackBarModel: AnyObject {
 // sourcery: virtualPropActionHelper = "@StateObject var context: SortFilterContext = SortFilterContext()"
 // sourcery: add_env_props = "dismiss"
 // sourcery: generated_component_composite
+// sourcery: virtualPropViewSize = "@State var size: CGSize = .zero"
+// sourcery: virtualPropPopoverWidth = "let popoverWidth = 393.0"
 public protocol SortFilterViewModel: AnyObject, TitleComponent {
     // sourcery: bindingProperty
     // sourcery: backingComponent=_SortFilterCFGItemContainer
@@ -532,6 +534,7 @@ public protocol OptionListPickerItemModel: OptionListPickerComponent {
 // sourcery: virtualPropAllowsMultipleSelection = "var allowsMultipleSelection: Bool = false"
 // sourcery: virtualPropAllowsEmptySelection = "var allowsEmptySelection: Bool = false"
 // sourcery: virtualPropIsSearchBarHidden = "var isSearchBarHidden: Bool = false"
+// sourcery: virtualPropPopoverWidth = "let popoverWidth = 393.0"
 public protocol SearchListPickerItemModel: OptionListPickerComponent {
     // sourcery: default.value = nil
     // sourcery: no_view

Sources/FioriSwiftUICore/Views/OptionListPickerItem+View.swift

@@ -132,11 +132,11 @@ extension OptionListPickerItem: View {
     VStack {
         Spacer()
         OptionListPickerItem(value: Binding<[Int]>(get: { [0, 1, 2] }, set: { print($0) }), valueOptions: ["Received", "Started", "Hold", "Transfer", "Completed", "Pending Review review", "Accepted", "Rejected"], hint: nil)
-            .frame(width: 375)
+            .frame(width: 393)
         Spacer()
         OptionListPickerItem(value: Binding<[Int]>(get: { [0, 1, 2] }, set: { print($0) }), valueOptions: ["Received", "Started", "Hold", "Transfer", "Completed", "Pending Review", "Accepted", "Rejected"], hint: nil)
             .optionListPickerStyle(font: .title, foregroundColorSelected: Color.red, strokeColorSelected: Color.red, cornerRadius: 25)
-            .frame(width: 375)
+            .frame(width: 393)
         Spacer()
     }
 }

Sources/FioriSwiftUICore/Views/SearchListPickerItem+View.swift

@@ -86,7 +86,7 @@ extension SearchListPickerItem: View {
                 }
             })
             .listStyle(PlainListStyle())
-            .frame(minWidth: UIDevice.current.userInterfaceIdiom != .phone ? 393 : nil)
+            .frame(minWidth: UIDevice.current.userInterfaceIdiom != .phone ? popoverWidth : nil)
             .scrollContentBackground(.hidden)
             .padding(0)
             .ifApply(!isSearchBarHidden, content: { v in
@@ -138,7 +138,7 @@ extension SearchListPickerItem: View {
     VStack {
         Spacer()
         SearchListPickerItem(value: Binding<[Int]>(get: { [0, 1, 2] }, set: { print($0) }), valueOptions: ["Received", "Started", "Hold", "Transfer", "Completed", "Pending Review review", "Accepted", "Rejected"], hint: nil)
-            .frame(width: 375)
+            .frame(width: 393)
         Spacer()
     }
 }

Sources/FioriSwiftUICore/Views/SliderPickerItem+View.swift

@@ -188,7 +188,7 @@ private struct SliderPickeTestView: View {
             ), minimumValue: 0, maximumValue: 100, hint: "Pick an integer value")
             Spacer()
         }
-        .frame(width: 375)
+        .frame(width: 393)
     }
 }
 

Sources/FioriSwiftUICore/Views/SortFilter/FilterFeedbackBarItem+View.swift

@@ -122,6 +122,7 @@ struct PickerMenuItem: View {
     @State var isSheetVisible = false
 
     @State var detentHeight: CGFloat = ((UIDevice.current.userInterfaceIdiom == .phone || UIDevice.current.userInterfaceIdiom == .pad) ? 88 : 0)
+    let popoverWidth = 393.0
 
     public init(item: Binding<SortFilterItem.PickerItem>, onUpdate: @escaping () -> Void) {
         self._item = item
@@ -300,6 +301,8 @@ struct DateTimeMenuItem: View {
     @State var detentHeight: CGFloat = 0
 
     var onUpdate: () -> Void
+
+    let popoverWidth = 393.0
 
     public init(item: Binding<SortFilterItem.DateTimeItem>, onUpdate: @escaping () -> Void) {
         self._item = item
@@ -356,10 +359,10 @@ struct DateTimeMenuItem: View {
                         )
                         .datePickerStyle(.graphical)
                         .labelsHidden()
-                        .frame(width: UIDevice.current.userInterfaceIdiom == .pad ? 375 - 13 : Screen.bounds.size.width - 16)
+                        .frame(width: UIDevice.current.userInterfaceIdiom == .pad ? self.popoverWidth - 13 : Screen.bounds.size.width - 16)
                         .clipped()
                     }
-                    .frame(width: UIDevice.current.userInterfaceIdiom == .pad ? 375 : Screen.bounds.size.width)
+                    .frame(width: UIDevice.current.userInterfaceIdiom == .pad ? self.popoverWidth : Screen.bounds.size.width)
                 }
                 .readHeight()
                 .onPreferenceChange(HeightPreferenceKey.self) { height in

Sources/FioriSwiftUICore/Views/SortFilter/SortFilterView+View.swift

@@ -38,7 +38,7 @@ extension Fiori {
 
 extension SortFilterView: View {
     public var body: some View {
-        CancellableResettableDialogForm {
+        CancellableResettableDialogNavigationForm {
             title
         } cancelAction: {
             cancelAction
@@ -74,8 +74,16 @@ extension SortFilterView: View {
                 .environment(\.isEnabled, true)
         } components: {
             _items
+                .sizeReader(size: { s in
+                    if size != s {
+                        size = s
+                    }
+                })
                 .environmentObject(context)
         }
+        .frame(width: UIDevice.current.userInterfaceIdiom != .phone ? popoverWidth : nil)
+        .frame(height: UIDevice.current.userInterfaceIdiom != .phone ? size.height + 130 : nil)
+        .presentationDetents([.large])
         .background(Color.preferredColor(.chromeSecondary))
     }
 }