Bugfix/notification

ReleaseNotes.md

@@ -1,7 +1,10 @@
 # Release Notes SBBDesignSystemMobileSwiftUI for iOS & SwiftUI
 
-## in development:
-- Renaming of the typographie names according to the revised DSM (e.g. xlarge instead of SBBHeader)
+## v1.1.1 - 04 January 2024
+### Improvements
+- SBBNotification: can also stay open (close button not present).
+### Deprecations
+- Renaming of the typographie names according to the revised DSM (e.g. xlarge instead of SBBHeader). Old typographie names are deprecated and will be removed in a future version.
 
 ## v1.1.0 - 03 October 2023
 ### Features

SBBDesignSystemMobileSwiftUI/Views/SBBNotification.swift

@@ -31,6 +31,7 @@ public struct SBBNotification: View {
     let statusType: StatusType
     let title: Text?
     let text: Text
+    let canBeClosed: Bool
     let onClose: (() -> ())?
     let onMoreInfo: (() -> ())?
     let maxNumberLines: Int?
@@ -53,6 +54,7 @@ public struct SBBNotification: View {
      */
     public init(isPresented: Binding<Bool>, statusType: StatusType, title: Text, text: Text, maxNumberLines: Int? = nil, closeAfterSeconds: Int? = nil, onClose: (() -> ())? = nil, onMoreInfo: (() -> ())? = nil) {
         self._isPresented = isPresented
+        self.canBeClosed = true
         self.statusType = statusType
         self.title = title
         self.text = text
@@ -62,6 +64,28 @@ public struct SBBNotification: View {
         self.onMoreInfo = onMoreInfo
     }
 
+    /**
+     Returns a SBBNotification.
+
+     - Parameters:
+        - statusType: The type of status for the notification.
+        - title: The title of the notification.
+        - text: The content text for the notification.
+        - maxNumberLines: The optional max of number of lines used by the text.
+        - onMoreInfo: The optional action to do when tapping on more action (only displayed if there is indeed an action).
+     */
+    public init(statusType: StatusType, title: Text, text: Text, maxNumberLines: Int? = nil, onMoreInfo: (() -> ())? = nil) {
+        self._isPresented = .constant(true)
+        self.canBeClosed = false
+        self.statusType = statusType
+        self.title = title
+        self.text = text
+        self.maxNumberLines = maxNumberLines
+        self.closeAfterSeconds = nil
+        self.onClose = nil
+        self.onMoreInfo = onMoreInfo
+    }
+
     /**
      Returns a SBBNotification.
 
@@ -75,6 +99,7 @@ public struct SBBNotification: View {
      */
     public init(isPresented: Binding<Bool>, statusType: StatusType, text: Text, maxNumberLines: Int? = nil, closeAfterSeconds: Int? = nil, onClose: (() -> ())? = nil) {
         self._isPresented = isPresented
+        self.canBeClosed = true
         self.statusType = statusType
         self.title = nil
         self.text = text
@@ -84,6 +109,26 @@ public struct SBBNotification: View {
         self.onMoreInfo = nil
     }
 
+    /**
+     Returns a SBBNotification.
+
+     - Parameters:
+        - statusType: The type of status for the notification.
+        - text: The content text for the notification.
+        - maxNumberLines: The optional max of number of lines used by the text.
+     */
+    public init(statusType: StatusType, text: Text, maxNumberLines: Int? = nil) {
+        self._isPresented = .constant(true)
+        self.canBeClosed = false
+        self.statusType = statusType
+        self.title = nil
+        self.text = text
+        self.maxNumberLines = maxNumberLines
+        self.closeAfterSeconds = nil
+        self.onClose = nil
+        self.onMoreInfo = nil
+    }
+
     private var backgroundColor: Color {
         switch statusType {
         case .alert:
@@ -114,6 +159,10 @@ public struct SBBNotification: View {
         }
     }
 
+    private var iconSize: CGFloat {
+        return sizeCategory.isAccessibilityCategory ? 36 : 24
+    }
+
     private var closeButton: some View {
         Button(action: {
             self.isPresented = false
@@ -123,29 +172,31 @@ public struct SBBNotification: View {
         }) {
             Image(sbbIcon: .cross_small)
                 .foregroundColor(Color.sbbColor(.textBlack))
-                .frame(width: 28, height: 28)
+                .frame(width: iconSize, height: iconSize)
         }
     }
 
     public var body: some View {
         if self.isPresented {
             VStack(spacing: 0) {
-                VStack(spacing: 16) {
+                VStack(spacing: 10) {
                     if let title = title {
                         HStack {
                             icon
-                                .frame(width: 28, height: 28)
+                                .frame(width: iconSize, height: iconSize)
                             title
                                 .foregroundColor(Color.sbbColor(.textBlack))
                                 .sbbFont(.large_bold)
                             Spacer()
-                            closeButton
+                            if canBeClosed {
+                                closeButton
+                            }
                         }
                     }
                     HStack(alignment: .top) {
                         if title == nil {
                             icon
-                                .frame(width: 28, height: 28)
+                                .frame(width: iconSize, height: iconSize)
                         }
                         Group {
                             if let maxNumberLines = maxNumberLines {
@@ -158,10 +209,11 @@ public struct SBBNotification: View {
                                     .fixedSize(horizontal: false, vertical: true)
                             }
                         }
-                        .frame(minWidth: 28, minHeight: 28)
+                        .frame(minWidth: iconSize, minHeight: iconSize)
                         .foregroundColor(Color.sbbColor(.textBlack))
                         .sbbFont(.medium_light)
                         .viewSize($textSize)
+
                         Spacer()
 
                         if let onMoreInfo = onMoreInfo {
@@ -170,15 +222,15 @@ public struct SBBNotification: View {
                             }) {
                                 Image(sbbIcon: .chevron_small_right_medium)
                                     .foregroundColor(Color.sbbColor(.textBlack))
-                                    .frame(height: title == nil ? textSize.height - 28 : textSize.height)
+                                    .frame(height: textSize.height)
                             }
-                        } else if title == nil {
+                        } else if title == nil && canBeClosed {
                             closeButton
                         }
-
                     }
                 }
                 .sbbScreenPadding()
+                .padding(.leading, 8)
                 .background(Color.sbbColor(colorScheme == .dark ? .black : .white).opacity(colorScheme == .dark ? 0.85 : 0.95))
                 .cornerRadius(16, corners: [.topRight, .bottomRight])
                 .cornerRadius(7, corners: [.topLeft, .bottomLeft])

SBBDesignSystemMobileSwiftUI/Views/SBBStatus.swift

@@ -81,10 +81,14 @@ public struct SBBStatus: View {
         }
     }
 
+    private var iconSize: CGFloat {
+        return sizeCategory.isAccessibilityCategory ? 36 : 24
+    }
+
     public var body: some View {
         HStack(spacing: 0) {
             icon
-                .frame(minWidth: 28, minHeight: 28)
+                .frame(minWidth: iconSize, minHeight: iconSize)
             if showText {
                 VStack {
                     text

SBBDesignSystemMobileSwiftUIDemo/Views/DetailViews/NotificationDemo.swift

@@ -14,6 +14,7 @@ struct NotificationDemo: View {
     @State var showMoreInfo: Bool = false
     @State var selectedStatus: StatusType = .alert
 
+    @State var canBeClosed: Bool = false
     @State var enableCloseAfterSeconds: Bool = false
     @State var closeAfterSeconds: Int = 3
 
@@ -38,17 +39,24 @@ struct NotificationDemo: View {
                     if enableMaxNumberLines {
                         SBBUpDnCounterView(label: Text("Max number of lines"), value: $maxNumberLines)
                     }
-                    SBBCheckBox(isOn: $enableCloseAfterSeconds, text: Text("Close the notification after a while"), showBottomLine: enableCloseAfterSeconds)
-                    if enableCloseAfterSeconds {
-                        SBBUpDnCounterView(label: Text("Close after x seconds"), value: $closeAfterSeconds, showBottomLine: false)
+
+                    SBBCheckBox(isOn: $canBeClosed, text: Text("Notification can be closed"), showBottomLine: canBeClosed)
+
+                    if canBeClosed {
+                        SBBCheckBox(isOn: $enableCloseAfterSeconds, text: Text("Close the notification after a while"), showBottomLine: enableCloseAfterSeconds)
+                        if enableCloseAfterSeconds {
+                            SBBUpDnCounterView(label: Text("Close after x seconds"), value: $closeAfterSeconds, showBottomLine: false)
+                        }
                     }
                 }
-
+                
                 Text("With title and text")
-                if enableCloseAfterSeconds {
+                if !canBeClosed {
+                    SBBNotification(statusType: selectedStatus, title: Text("Title"), text: Text("Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore."), maxNumberLines: enableMaxNumberLines ? maxNumberLines : nil)
+                } else if enableCloseAfterSeconds {
                     SBBNotification(isPresented: $isPresented1, statusType: selectedStatus, title: Text("Title"), text: Text("Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore."), maxNumberLines: enableMaxNumberLines ? maxNumberLines : nil, closeAfterSeconds: closeAfterSeconds)
                 } else {
-                    SBBNotification(isPresented: $isPresented1, statusType: selectedStatus, title: Text("Title"), text: Text("Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore."), maxNumberLines: enableMaxNumberLines ? maxNumberLines : nil, closeAfterSeconds: nil)
+                    SBBNotification(isPresented: $isPresented1, statusType: selectedStatus, title: Text("Title"), text: Text("Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore."), maxNumberLines: enableMaxNumberLines ? maxNumberLines : nil)
                 }
 
                 if !isPresented1 {
@@ -65,10 +73,12 @@ struct NotificationDemo: View {
                 }
 
                 Text("Without title")
-                if enableCloseAfterSeconds {
+                if !canBeClosed {
+                    SBBNotification(statusType: selectedStatus, text: Text("Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore."), maxNumberLines: enableMaxNumberLines ? maxNumberLines : nil)
+                } else if enableCloseAfterSeconds {
                     SBBNotification(isPresented: $isPresented2, statusType: selectedStatus, text: Text("Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore."), maxNumberLines: enableMaxNumberLines ? maxNumberLines : nil, closeAfterSeconds: closeAfterSeconds)
                 } else {
-                    SBBNotification(isPresented: $isPresented2, statusType: selectedStatus, text: Text("Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore."), maxNumberLines: enableMaxNumberLines ? maxNumberLines : nil, closeAfterSeconds: nil)
+                    SBBNotification(isPresented: $isPresented2, statusType: selectedStatus, text: Text("Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore."), maxNumberLines: enableMaxNumberLines ? maxNumberLines : nil)
                 }
                 if !isPresented2 {
                     HStack {
@@ -84,12 +94,16 @@ struct NotificationDemo: View {
                 }
 
                 Text("With more info")
-                if enableCloseAfterSeconds {
+                if !canBeClosed {
+                    SBBNotification(statusType: selectedStatus, title: Text("Title"), text: Text("Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore."), maxNumberLines: enableMaxNumberLines ? maxNumberLines : nil, onMoreInfo: {
+                        self.showMoreInfo = true
+                    })
+                } else if enableCloseAfterSeconds {
                     SBBNotification(isPresented: $isPresented3, statusType: selectedStatus, title: Text("Title"), text: Text("Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore."), maxNumberLines: enableMaxNumberLines ? maxNumberLines : nil, closeAfterSeconds: closeAfterSeconds, onMoreInfo: {
                         self.showMoreInfo = true
                     })
                 } else {
-                    SBBNotification(isPresented: $isPresented3, statusType: selectedStatus, title: Text("Title"), text: Text("Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore."), maxNumberLines: enableMaxNumberLines ? maxNumberLines : nil, closeAfterSeconds: nil, onMoreInfo: {
+                    SBBNotification(isPresented: $isPresented3, statusType: selectedStatus, title: Text("Title"), text: Text("Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore."), maxNumberLines: enableMaxNumberLines ? maxNumberLines : nil, onMoreInfo: {
                         self.showMoreInfo = true
                     })
                 }