Merge pull request #450 from wanteddev/feature/PI-82408

[PI-82408] 전체 컴포넌트에 VoiceOver 접근성 지원 추가

Author: knine79

Package.swift

@@ -4,6 +4,7 @@ import PackageDescription
 
 let package = Package(
     name: "Montage",
+    defaultLocalization: "ko",
     platforms: [.iOS(.v16)],
     products: [
         .library(name: "Montage", targets: ["Montage"])

Sources/Montage/1 Components/2 Actions/Button.swift

@@ -166,7 +166,6 @@ public struct Button: View {
     private var loading = false
     private var fillHorizontal = false
     private var fillVertical = false
-    
     /// 버튼을 비활성화 상태로 설정합니다.
     ///
     /// 비활성화된 버튼은 시각적으로 흐리게 표시되며 사용자 상호작용에 반응하지 않습니다.
@@ -366,6 +365,10 @@ public struct Button: View {
         }
         .modifier(PressActionDetectingModifier(isPressed: $isPressed, action: handler))
         .allowsHitTesting(!disable && !loading)
+        .accessibilityElement(children: .ignore)
+        .accessibilityLabel(text ?? leadingIcon?.rawValue ?? "")
+        .accessibilityAddTraits(.isButton)
+        .accessibilityValue(loading ? String(localized: "로딩 중", bundle: .module) : "")
     }
 }
 

Sources/Montage/1 Components/2 Actions/Chip.swift

@@ -125,6 +125,10 @@ public struct Chip: View {
         )
         .modifier(PressActionDetectingModifier(isPressed: $isPressed, action: handler))
         .disabled(disable)
+        .accessibilityElement(children: .ignore)
+        .accessibilityLabel(text)
+        .accessibilityAddTraits(.isButton)
+        .accessibilityValue(active ? String(localized: "선택됨", bundle: .module) : "")
     }
 
     // MARK: - Modifiers

Sources/Montage/1 Components/2 Actions/IconButton.swift

@@ -64,7 +64,6 @@ public struct IconButton: View {
     private var iconColor: SwiftUI.Color?
     private var backgroundColor: SwiftUI.Color?
     private var borderColor: SwiftUI.Color?
-    
     /// 버튼의 비활성화 여부를 설정합니다.
     /// - Parameter value: 비활성화 여부, true이면 버튼이 비활성화됩니다.
     /// - Returns: 수정된 IconButton 인스턴스
@@ -223,6 +222,9 @@ public struct IconButton: View {
             )
             .allowsHitTesting(disable == false)
             .modifier(PressActionDetectingModifier(isPressed: $isPressed, action: handler))
+            .accessibilityElement(children: .ignore)
+            .accessibilityLabel("\(icon.rawValue) \(String(localized: "아이콘", bundle: .module))")
+            .accessibilityAddTraits(.isButton)
     }
 }
 

Sources/Montage/1 Components/3 Selection And Input/Control.swift

@@ -91,6 +91,7 @@ struct Control: View {
                         onSelect?($0 ? .checked : .unchecked)
                     })
             )
+            .labelsHidden()
             .disabled(disable)
             .tint(backgroundColor)
             .frame(width: switchSize.width, height: switchSize.height)
@@ -166,6 +167,10 @@ struct Control: View {
                         }
                 }
             }
+            .accessibilityElement(children: .ignore)
+            .accessibilityLabel(label)
+            .accessibilityValue(accessibilityStateDescription)
+            .accessibilityAddTraits(.isButton)
         }
     }
 
@@ -407,6 +412,14 @@ extension Control {
         )
     }
 
+    fileprivate var accessibilityStateDescription: String {
+        switch state {
+        case .checked: String(localized: "선택됨", bundle: .module)
+        case .unchecked: String(localized: "선택 안 됨", bundle: .module)
+        case .indeterminate: String(localized: "부분 선택됨", bundle: .module)
+        }
+    }
+
     fileprivate var spacing: CGFloat {
         switch variant {
         case .checkbox, .radio:

Sources/Montage/1 Components/3 Selection And Input/FilterButton.swift

@@ -124,6 +124,10 @@ public struct FilterButton: View {
         )
         .modifier(PressActionDetectingModifier(isPressed: $isPressed, action: handler))
         .disabled(disable)
+        .accessibilityElement(children: .ignore)
+        .accessibilityLabel(text)
+        .accessibilityAddTraits(.isButton)
+        .accessibilityValue(active ? (activeLabel ?? String(localized: "선택됨", bundle: .module)) : "")
     }
 
     // MARK: - Modifiers
@@ -137,7 +141,6 @@ public struct FilterButton: View {
     private var customIconColor: SwiftUI.Color?
     private var fillHorizontal = false
     private var fillVertical = false
-    
     /// 버튼의 활성화 상태와 레이블을 설정합니다.
     ///
     /// - Parameters:

Sources/Montage/1 Components/3 Selection And Input/SegmentedControl.swift

@@ -131,6 +131,8 @@ public struct SegmentedControl: View {
                     .padding(buttonInsets)
                     .frame(width: max(0, buttonWidth))
                     .frame(maxHeight: .infinity)
+                    .accessibilityRemoveTraits(selectedIndex == index ? [] : .isSelected)
+                    .accessibilityAddTraits(selectedIndex == index ? .isSelected : [])
                     .background {
                         Group {
                             switch variant {
@@ -193,7 +195,6 @@ public struct SegmentedControl: View {
     // MARK: - Modifiers
     private var variant: Variant = .solid
     private var size: Size = .large
-    
     /// 세그먼트 컨트롤의 시각적 스타일을 설정합니다.
     ///
     /// - Parameter variant: 적용할 스타일

Sources/Montage/1 Components/3 Selection And Input/Select.swift

@@ -149,7 +149,6 @@ public struct Select: View {
     private var shadowBackgroundColor: SwiftUI.Color = .init(uiColor: UIColor.systemBackground)
     private var leadingContent: LeadingContent?
     private var menuResize: BottomSheet.Resize = .hug
-
     /// negative 상태 여부를 조정합니다.
     /// - Parameter negative: 부정적 상태 여부, 생략하면 기본값으로 `true` 적용
     /// - Returns: 수정된 Select 인스턴스
@@ -428,6 +427,10 @@ public struct Select: View {
             }
         }
         .allowsHitTesting(disable == false)
+        .accessibilityElement(children: .ignore)
+        .accessibilityLabel(heading.isEmpty ? placeholder : heading)
+        .accessibilityValue(selectedItems.map(\.text).joined(separator: ", "))
+        .accessibilityAddTraits(.isButton)
         .onTapGesture {
             menuPresented.wrappedValue.toggle()
         }

Sources/Montage/1 Components/3 Selection And Input/Slider.swift

@@ -232,13 +232,18 @@ public struct Slider: View {
             }
         }
         .allowsHitTesting(!disable)
+        .modifier(SliderAccessibilityModifier(
+            label: String(localized: "슬라이더", bundle: .module),
+            value: headingLabel,
+            disable: disable,
+            onAdjust: handleAccessibilityAdjust
+        ))
     }
 
     // MARK: - Modifiers
     private var heading = false
     private var label = false
     private var disable = false
-    
     /// 슬라이더 상단에 제목을 표시할지 여부를 설정합니다.
     ///
     /// - Parameter heading: 제목 표시 여부, 생략하면 기본값으로 `true` 적용
@@ -270,7 +275,30 @@ public struct Slider: View {
     }
 
     // MARK: - private
-    
+
+    private func handleAccessibilityAdjust(_ direction: AccessibilityAdjustmentDirection) {
+        guard !disable else { return }
+        let step = 0.05
+        switch direction {
+        case .increment:
+            if isRangeSlider, focusedThumb == 1 {
+                thumbRatio1 = min(thumbRatio2, thumbRatio1 + step)
+            } else {
+                thumbRatio2 = min(1.0, thumbRatio2 + step)
+            }
+        case .decrement:
+            if isRangeSlider, focusedThumb != 1 {
+                thumbRatio2 = max(thumbRatio1, thumbRatio2 - step)
+            } else if isRangeSlider {
+                thumbRatio1 = max(0.0, thumbRatio1 - step)
+            } else {
+                thumbRatio2 = max(0.0, thumbRatio2 - step)
+            }
+        @unknown default:
+            break
+        }
+    }
+
     private func updateValues() {
         lowValue = (valueRange.upperBound - valueRange.lowerBound) * lowThumbRatio + valueRange.lowerBound
         highValue = (valueRange.upperBound - valueRange.lowerBound) * highThumbRatio + valueRange.lowerBound
@@ -445,3 +473,18 @@ public struct Slider: View {
         }
     }
 }
+
+private struct SliderAccessibilityModifier: ViewModifier {
+    let label: String
+    let value: String
+    let disable: Bool
+    let onAdjust: (AccessibilityAdjustmentDirection) -> Void
+
+    func body(content: Content) -> some View {
+        content
+            .accessibilityElement(children: .ignore)
+            .accessibilityLabel(label)
+            .accessibilityValue(value)
+            .accessibilityAdjustableAction(onAdjust)
+    }
+}

Sources/Montage/1 Components/3 Selection And Input/TextArea.swift

@@ -205,7 +205,6 @@ public struct TextArea: View {
     private var trailingResourceSpacing: CGFloat = 4
     private var characterCounterLimit: Int?
     private var characterCounterOverflow: Bool = false
-    
     /// 텍스트 영역의 크기 조절 방식을 설정합니다.
     ///
     /// - Parameter resize: 크기 조절 방식
@@ -430,6 +429,8 @@ public struct TextArea: View {
         .onTapGesture {
             focus.wrappedValue = true
         }
+        .accessibilityLabel(heading ?? "")
+        .accessibilityValue(negative ? (description ?? String(localized: "오류", bundle: .module)) : "")
     }
 
     private var editorStrokeColor: SwiftUI.Color {