feat: selector only hover and pressed (WIP) (#264)

Signed-off-by: Pierre-Yves Lapersonne <[email protected]>
Orange-OpenSource · Jan 29, 2025 · 72fa34e · 72fa34e
1 parent 61fa46b
commit 72fa34e
Showing 20 changed files with 189 additions and 31 deletions.
diff --git a/...nToolbox.xcworkspace/xcuserdata/xhrs0459.xcuserdatad/xcdebugger/Breakpoints_v2.xcbkptlist b/...nToolbox.xcworkspace/xcuserdata/xhrs0459.xcuserdatad/xcdebugger/Breakpoints_v2.xcbkptlist
@@ -3,4 +3,70 @@
    uuid = "B4A15A02-0B7C-4A17-81BE-9CA389B02C0B"
    type = "0"
    version = "2.0">
+   <Breakpoints>
+      <BreakpointProxy
+         BreakpointExtensionID = "Xcode.Breakpoint.FileBreakpoint">
+         <BreakpointContent
+            uuid = "A4BC56D7-A550-48D3-B275-3148E9B0A0A8"
+            shouldBeEnabled = "Yes"
+            ignoreCount = "0"
+            continueAfterRunningActions = "No"
+            filePath = "../OUDS/Core/Components/Sources/Checkbox/Internal/OUDSCheckboxStyle+ForegroundModifier.swift"
+            startingColumnNumber = "9223372036854775807"
+            endingColumnNumber = "9223372036854775807"
+            startingLineNumber = "79"
+            endingLineNumber = "79"
+            landmarkName = "pressedColor"
+            landmarkType = "24">
+         </BreakpointContent>
+      </BreakpointProxy>
+      <BreakpointProxy
+         BreakpointExtensionID = "Xcode.Breakpoint.FileBreakpoint">
+         <BreakpointContent
+            uuid = "AA9CEDBC-BBEE-4330-9D86-D282E2F51A13"
+            shouldBeEnabled = "No"
+            ignoreCount = "0"
+            continueAfterRunningActions = "No"
+            filePath = "../OUDS/Core/Components/Sources/Checkbox/Internal/OUDSCheckboxStyle+ForegroundModifier.swift"
+            startingColumnNumber = "9223372036854775807"
+            endingColumnNumber = "9223372036854775807"
+            startingLineNumber = "47"
+            endingLineNumber = "47"
+            landmarkName = "appliedColor"
+            landmarkType = "24">
+         </BreakpointContent>
+      </BreakpointProxy>
+      <BreakpointProxy
+         BreakpointExtensionID = "Xcode.Breakpoint.FileBreakpoint">
+         <BreakpointContent
+            uuid = "4D337EDF-ADA6-464F-91B0-0AA01F3A3224"
+            shouldBeEnabled = "Yes"
+            ignoreCount = "0"
+            continueAfterRunningActions = "No"
+            filePath = "../OUDS/Core/Components/Sources/Checkbox/Internal/OUDSCheckboxStyle+ForegroundModifier.swift"
+            startingColumnNumber = "9223372036854775807"
+            endingColumnNumber = "9223372036854775807"
+            startingLineNumber = "43"
+            endingLineNumber = "43"
+            landmarkName = "appliedColor"
+            landmarkType = "24">
+         </BreakpointContent>
+      </BreakpointProxy>
+      <BreakpointProxy
+         BreakpointExtensionID = "Xcode.Breakpoint.FileBreakpoint">
+         <BreakpointContent
+            uuid = "7E61BDFD-C2F5-4F7C-BE88-AE7258F26590"
+            shouldBeEnabled = "Yes"
+            ignoreCount = "0"
+            continueAfterRunningActions = "No"
+            filePath = "../OUDS/Core/Components/Sources/Checkbox/Internal/OUDSCheckboxStyle+ForegroundModifier.swift"
+            startingColumnNumber = "9223372036854775807"
+            endingColumnNumber = "9223372036854775807"
+            startingLineNumber = "48"
+            endingLineNumber = "48"
+            landmarkName = "appliedColor"
+            landmarkType = "24">
+         </BreakpointContent>
+      </BreakpointProxy>
+   </Breakpoints>
 </Bucket>
diff --git a/DesignToolbox/DesignToolbox/Pages/Components/Checkbox/CheckboxPage.swift b/DesignToolbox/DesignToolbox/Pages/Components/Checkbox/CheckboxPage.swift
@@ -25,19 +25,19 @@ struct CheckboxPage: View {
     var body: some View {
 
         // Enabled
-        OUDSCheckbox(status: .selected, style: .default) { }
-        OUDSCheckbox(status: .unselected, style: .default) { }
-        OUDSCheckbox(status: .undeterminate, style: .default) { }
-        OUDSCheckbox(status: .errorSelected, style: .default) { }
-        OUDSCheckbox(status: .errorUnselected, style: .default) { }
-        OUDSCheckbox(status: .errorUndeterminate, style: .default) { }
-
-        // Disabled
-        OUDSCheckbox(status: .selected, style: .default) { }.disabled(true)
-        OUDSCheckbox(status: .unselected, style: .default) { }.disabled(true)
-        OUDSCheckbox(status: .undeterminate, style: .default) { }.disabled(true)
-        OUDSCheckbox(status: .errorSelected, style: .default) { }.disabled(true)
-        OUDSCheckbox(status: .errorUnselected, style: .default) { }.disabled(true)
-        OUDSCheckbox(status: .errorUndeterminate, style: .default) { }.disabled(true)
+        OUDSCheckbox(status: .selected, style: .default) { print("@@@ high level tap") }
+//        OUDSCheckbox(status: .unselected, style: .default) { }
+//        OUDSCheckbox(status: .undeterminate, style: .default) { }
+//        OUDSCheckbox(status: .errorSelected, style: .default) { }
+//        OUDSCheckbox(status: .errorUnselected, style: .default) { }
+//        OUDSCheckbox(status: .errorUndeterminate, style: .default) { }
+//
+//        // Disabled
+//        OUDSCheckbox(status: .selected, style: .default) { }.disabled(true)
+//        OUDSCheckbox(status: .unselected, style: .default) { }.disabled(true)
+//        OUDSCheckbox(status: .undeterminate, style: .default) { }.disabled(true)
+//        OUDSCheckbox(status: .errorSelected, style: .default) { }.disabled(true)
+//        OUDSCheckbox(status: .errorUnselected, style: .default) { }.disabled(true)
+//        OUDSCheckbox(status: .errorUndeterminate, style: .default) { }.disabled(true)
     }
 }
diff --git a/NOTICE.txt b/NOTICE.txt
@@ -49,4 +49,11 @@ Any use or displaying shall constitute an infringement under intellectual proper
 ./DesignToolbox/DesignToolbox/Resources/Assets.xcassets/Tokens/ic_typography.imageset/ic_typography.svg
 ./DesignToolbox/DesignToolbox/Resources/Assets.xcassets/Tokens/ic_union.imageset/ic_union.svg
 
+./OUDS/Core/Components/Sources/Resources/Media.xcasssets/Checkbox/ic_comp_checkbox_selected_bold.imageset/ic_comp_checkbox_selected_bold.svg
+./OUDS/Core/Components/Sources/Resources/Media.xcasssets/Checkbox/ic_comp_checkbox_selected.imageset/ic_comp_checkbox_selected.svg
+./OUDS/Core/Components/Sources/Resources/Media.xcasssets/Checkbox/ic_comp_checkbox_undeterminate_bold.imageset/ic_comp_checkbox_undeterminate_bold.svg
+./OUDS/Core/Components/Sources/Resources/Media.xcasssets/Checkbox/ic_comp_checkbox_undeterminate.imageset/ic_comp_checkbox_undeterminate.svg
+./OUDS/Core/Components/Sources/Resources/Media.xcasssets/Checkbox/ic_comp_checkbox_unselected_bold.imageset/ic_comp_checkbox_unselected_bold.svg
+./OUDS/Core/Components/Sources/Resources/Media.xcasssets/Checkbox/ic_comp_checkbox_unselected.imageset/ic_comp_checkbox_unselected.svg
+
 End of the parts list under Orange SA Copyright
diff --git a/...urces/Shared/InternalComponentState.swift → ...uttons/Internal/InternalButtonState.swift b/...urces/Shared/InternalComponentState.swift → ...uttons/Internal/InternalButtonState.swift
@@ -12,7 +12,7 @@
 //
 
 /// The internal state used by modifiers to handle all states of  components.
-enum InternalComponentState {
+enum InternalButtonState {
     case enabled
     case hover
     case pressed

diff --git a/OUDS/Core/Components/Sources/Buttons/Internal/OUDSButtonStyle+BackgroundModifier.swift b/OUDS/Core/Components/Sources/Buttons/Internal/OUDSButtonStyle+BackgroundModifier.swift
@@ -26,7 +26,7 @@ struct ButtonBackgroundModifier: ViewModifier {
     // MARK: Stored Properties
 
     let hierarchy: OUDSButton.Hierarchy
-    let state: InternalComponentState
+    let state: InternalButtonState
 
     // MARK: Body
 

diff --git a/OUDS/Core/Components/Sources/Buttons/Internal/OUDSButtonStyle+BorderModifier.swift b/OUDS/Core/Components/Sources/Buttons/Internal/OUDSButtonStyle+BorderModifier.swift
@@ -25,7 +25,7 @@ struct ButtonBorderModifier: ViewModifier {
     // MARK: Stored Properties
 
     let hierarchy: OUDSButton.Hierarchy
-    let state: InternalComponentState
+    let state: InternalButtonState
 
     // MARK: Body
 

diff --git a/OUDS/Core/Components/Sources/Buttons/Internal/OUDSButtonStyle+ForegroundModifier.swift b/OUDS/Core/Components/Sources/Buttons/Internal/OUDSButtonStyle+ForegroundModifier.swift
@@ -26,7 +26,7 @@ struct ButtonForegroundModifier: ViewModifier {
     // MARK: Stored Properties
 
     let hierarchy: OUDSButton.Hierarchy
-    let state: InternalComponentState
+    let state: InternalButtonState
 
     // MARK: Body
 

diff --git a/OUDS/Core/Components/Sources/Buttons/Internal/OUDSButtonStyle+NormalModifier.swift b/OUDS/Core/Components/Sources/Buttons/Internal/OUDSButtonStyle+NormalModifier.swift
@@ -23,7 +23,7 @@ struct ButtonViewModifier: ViewModifier {
     // MARK: Stored Properties
 
     let hierarchy: OUDSButton.Hierarchy
-    let state: InternalComponentState
+    let state: InternalButtonState
 
     // MARK: Body
 

diff --git a/OUDS/Core/Components/Sources/Buttons/Internal/OUDSButtonStyle.swift b/OUDS/Core/Components/Sources/Buttons/Internal/OUDSButtonStyle.swift
@@ -75,7 +75,7 @@ struct OUDSButtonStyle: ButtonStyle {
         }
     }
 
-    private func internalState(isPressed: Bool) -> InternalComponentState {
+    private func internalState(isPressed: Bool) -> InternalButtonState {
         if !isEnabled {
             return .disabled
         }

diff --git a/OUDS/Core/Components/Sources/Checkbox/Internal/InternalComponentState.swift b/OUDS/Core/Components/Sources/Checkbox/Internal/InternalComponentState.swift
@@ -0,0 +1,24 @@
+//
+// Software Name: OUDS iOS
+// SPDX-FileCopyrightText: Copyright (c) Orange SA
+// SPDX-License-Identifier: MIT
+// 
+// This software is distributed under the MIT license,
+// the text of which is available at https://opensource.org/license/MIT/
+// or see the "LICENSE" file for more details.
+// 
+// Authors: See CONTRIBUTORS.txt
+// Software description: A SwiftUI components library with code examples for Orange Unified Design System 
+//
+
+/// The internal state used by modifiers to handle all states of  components.
+enum InternalCheckboxState {
+    case enabled
+    case hover
+    case pressed
+    case disabled
+    case readOnly
+    // .loading not managed yet, for next version
+    // .focus not managed as not such customizable
+    // .skeleton not managed as dedicated view in the end
+}
diff --git a/OUDS/Core/Components/Sources/Checkbox/Internal/OUDSCheckboxStyle+ForegroundModifier.swift b/OUDS/Core/Components/Sources/Checkbox/Internal/OUDSCheckboxStyle+ForegroundModifier.swift
@@ -22,7 +22,7 @@ struct CheckboxForegroundModifier: ViewModifier {
     // MARK: - Properties
 
     let status: OUDSCheckbox.Status
-    let state: InternalComponentState
+    let state: InternalCheckboxState
 
     // MARK: - Environment
 
@@ -38,12 +38,17 @@ struct CheckboxForegroundModifier: ViewModifier {
     // MARK: Private helpers
 
     private var appliedColor: Color {
-        if state == .enabled {
+        switch state {
+        case .enabled:
             return enabledColor.color(for: colorScheme)
-        } else {
+        case .hover:
+            return hoverColor.color(for: colorScheme)
+        case .pressed:
+//            return pressedColor.color(for: colorScheme)
+            return Color.black
+        case .disabled, .readOnly:
             return disabledColor.color(for: colorScheme)
         }
-        // TODO: #264 - Manage other states
     }
 
     private var enabledColor: MultipleColorSemanticTokens {
@@ -59,6 +64,24 @@ struct CheckboxForegroundModifier: ViewModifier {
         }
     }
 
+    private var hoverColor: MultipleColorSemanticTokens {
+        switch status {
+        case .selected, .unselected, .undeterminate:
+            return theme.colors.colorActionHover
+        case .errorSelected, .errorUnselected, .errorUndeterminate:
+            return theme.colors.colorActionNegativeHover
+        }
+    }
+
+    private var pressedColor: MultipleColorSemanticTokens {
+        switch status {
+        case .selected, .unselected, .undeterminate:
+            return theme.colors.colorActionPressed
+        case .errorSelected, .errorUnselected, .errorUndeterminate:
+            return theme.colors.colorActionNegativePressed
+        }
+    }
+
     private var disabledColor: MultipleColorSemanticTokens {
         theme.colors.colorActionDisabled
     }

diff --git a/OUDS/Core/Components/Sources/Checkbox/Internal/OUDSCheckboxStyle+NormalModifier.swift b/OUDS/Core/Components/Sources/Checkbox/Internal/OUDSCheckboxStyle+NormalModifier.swift
@@ -22,7 +22,7 @@ struct CheckboxViewModifier: ViewModifier {
     // MARK: - Properties
 
     let status: OUDSCheckbox.Status
-    let state: InternalComponentState
+    let state: InternalCheckboxState
 
     // MARK: - Body
 

diff --git a/OUDS/Core/Components/Sources/Checkbox/Internal/OUDSCheckboxStyle.swift b/OUDS/Core/Components/Sources/Checkbox/Internal/OUDSCheckboxStyle.swift
@@ -15,13 +15,42 @@ import OUDS
 import OUDSTokensSemantic
 import SwiftUI
 
+struct BlinkModifier: ViewModifier {
+    @Binding var isTapped: Bool
+
+    func body(content: Content) -> some View {
+        content
+            .simultaneousGesture(
+                TapGesture()
+                    .onEnded {
+                        withAnimation {
+                            isTapped = true // Change la couleur
+                        }
+                        DispatchQueue.main.asyncAfter(deadline: .now() + 0.2) {
+                            withAnimation {
+                                isTapped = false // Rétablit la couleur
+                            }
+                        }
+                    }
+            )
+    }
+}
+
+extension View {
+    func blinkOnTap(isTapped: Binding<Bool>) -> some View {
+        self.modifier(BlinkModifier(isTapped: isTapped))
+    }
+}
+
 // TODO: #264 - Add doc
 
 struct OUDSCheckboxStyle: ViewModifier {
 
     // MARK: - Properties
 
     private let status: OUDSCheckbox.Status
+    @State private var isHover: Bool
+    @State private var isPressed: Bool
 
     // MARK: - Environment
 
@@ -34,18 +63,24 @@ struct OUDSCheckboxStyle: ViewModifier {
     /// - Parameter status: The checkbox status
     public init(status: OUDSCheckbox.Status) {
         self.status = status
+        isHover = false
+        isPressed = false
     }
 
     // MARK: - Body
 
     func body(content: Content) -> some View {
         content
-            .modifier(CheckboxViewModifier(status: status, state: internalState(isPressed: false)))
+            .onHover { isHover in
+                self.isHover = isHover
+            }
+            .blinkOnTap(isTapped: $isPressed)
+            .modifier(CheckboxViewModifier(status: status, state: internalState(isPressed: isPressed)))
     }
 
     // MARK: - Helpers
 
-    private func internalState(isPressed: Bool) -> InternalComponentState {
+    private func internalState(isPressed: Bool) -> InternalCheckboxState {
         if !isEnabled {
             return .disabled
         }
@@ -54,7 +89,9 @@ struct OUDSCheckboxStyle: ViewModifier {
             return .pressed
         }
 
-        // TODO: #264 - Manage other cases
+        if isHover {
+            return .hover
+        }
 
         return .enabled
     }

diff --git a/OUDS/Core/Components/Sources/Checkbox/OUDSCheckbox.swift b/OUDS/Core/Components/Sources/Checkbox/OUDSCheckbox.swift
@@ -262,15 +262,16 @@ private struct SelectorBox: View {
 
     let status: OUDSCheckbox.Status
 
+    // TODO: 264 - Images will be replaced by tokens in the near future, except the tick
     // swiftlint:disable switch_case_on_newline
     private var imageName: String {
         switch status {
         case .selected: return "ic_comp_checkbox_selected"
         case .unselected: return "ic_comp_checkbox_unselected"
         case .undeterminate: return "ic_comp_checkbox_undeterminate"
-        case .errorSelected: return "ic_comp_checkbox_selected_error"
-        case .errorUnselected: return "ic_comp_checkbox_unselected_error"
-        case .errorUndeterminate: return "ic_comp_checkbox_undeterminate_error"
+        case .errorSelected: return "ic_comp_checkbox_selected_bold"
+        case .errorUnselected: return "ic_comp_checkbox_unselected_bold"
+        case .errorUndeterminate: return "ic_comp_checkbox_undeterminate_bold"
         }
     }
     // swiftlint:enable switch_case_on_newline

diff --git a/...box_selected_error.imageset/Contents.json → ...kbox_selected_bold.imageset/Contents.json b/...box_selected_error.imageset/Contents.json → ...kbox_selected_bold.imageset/Contents.json
diff --git a/...geset/ic_comp_checkbox_selected_error.svg → ...geset/ic_comp_checkbox_selected_error.svg b/...geset/ic_comp_checkbox_selected_error.svg → ...geset/ic_comp_checkbox_selected_error.svg
diff --git a/...ndeterminate_error.imageset/Contents.json → ...undeterminate_bold.imageset/Contents.json b/...ndeterminate_error.imageset/Contents.json → ...undeterminate_bold.imageset/Contents.json
diff --git a/.../ic_comp_checkbox_undeterminate_error.svg → .../ic_comp_checkbox_undeterminate_error.svg b/.../ic_comp_checkbox_undeterminate_error.svg → .../ic_comp_checkbox_undeterminate_error.svg
diff --git a/...x_unselected_error.imageset/Contents.json → ...ox_unselected_bold.imageset/Contents.json b/...x_unselected_error.imageset/Contents.json → ...ox_unselected_bold.imageset/Contents.json
diff --git a/...set/ic_comp_checkbox_unselected_error.svg → ...set/ic_comp_checkbox_unselected_error.svg b/...set/ic_comp_checkbox_unselected_error.svg → ...set/ic_comp_checkbox_unselected_error.svg