Initial visionOS integration (#1956)

* Merge in minimal visionOS changes to library

* Update demo app to build for visionOS

* Update Package.swift for visionOS support

* Limit demos to only "supported" controls

* Switch to disabling unsupported controls

* Simplify branding assignment for visionOS

Package.swift

@@ -8,6 +8,7 @@ let package = Package(
     platforms: [
         .iOS(.v15),
         .macOS(.v12),
+        .visionOS(.v1),
     ],
     products: [
         .library(
@@ -22,7 +23,7 @@ let package = Package(
         .target(
             name: "FluentUI",
             dependencies: [
-                .target(name: "FluentUI_ios", condition: .when(platforms: [.iOS])),
+                .target(name: "FluentUI_ios", condition: .when(platforms: [.iOS, .visionOS])),
                 .target(name: "FluentUI_macos", condition: .when(platforms: [.macOS]))
             ],
             path: "public"

ios/FluentUI.Demo/FluentUI.Demo.xcodeproj/project.pbxproj

@@ -82,9 +82,9 @@
 		807E8B4528F9F8B8002B8F84 /* PillButtonDemoController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 807E8B4428F9F8B8002B8F84 /* PillButtonDemoController.swift */; };
 		80AECC0C2630F1BB005AF2F3 /* BottomCommandingDemoController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 80AECC0B2630F1BB005AF2F3 /* BottomCommandingDemoController.swift */; };
 		80B1F7012628D8BB004DFEE5 /* BottomSheetDemoController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 80B1F7002628D8BB004DFEE5 /* BottomSheetDemoController.swift */; };
-		8F0B81122670200300463726 /* AppCenterDistribute in Frameworks */ = {isa = PBXBuildFile; productRef = 8F0B81112670200300463726 /* AppCenterDistribute */; };
-		8F0B8114267021A700463726 /* AppCenterAnalytics in Frameworks */ = {isa = PBXBuildFile; productRef = 8F0B8113267021A700463726 /* AppCenterAnalytics */; };
-		8F0B8116267021A700463726 /* AppCenterCrashes in Frameworks */ = {isa = PBXBuildFile; productRef = 8F0B8115267021A700463726 /* AppCenterCrashes */; };
+		8F0B81122670200300463726 /* AppCenterDistribute in Frameworks */ = {isa = PBXBuildFile; platformFilter = ios; productRef = 8F0B81112670200300463726 /* AppCenterDistribute */; };
+		8F0B8114267021A700463726 /* AppCenterAnalytics in Frameworks */ = {isa = PBXBuildFile; platformFilter = ios; productRef = 8F0B8113267021A700463726 /* AppCenterAnalytics */; };
+		8F0B8116267021A700463726 /* AppCenterCrashes in Frameworks */ = {isa = PBXBuildFile; platformFilter = ios; productRef = 8F0B8115267021A700463726 /* AppCenterCrashes */; };
 		923DF2DB271158C900637646 /* libFluentUI.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 923DF2DA271158C900637646 /* libFluentUI.a */; };
 		923DF2DF27115B4700637646 /* FluentUIResources-ios.bundle in Resources */ = {isa = PBXBuildFile; fileRef = 923DF2DC271158CD00637646 /* FluentUIResources-ios.bundle */; };
 		9245E1F927BECDBB007616F3 /* GlobalColorTokensDemoController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 9245E1F827BECDBB007616F3 /* GlobalColorTokensDemoController.swift */; };
@@ -956,7 +956,7 @@
 				SWIFT_EMIT_LOC_STRINGS = NO;
 				SWIFT_OPTIMIZATION_LEVEL = "-Onone";
 				SWIFT_VERSION = 5.0;
-				TARGETED_DEVICE_FAMILY = "1,2";
+				TARGETED_DEVICE_FAMILY = "1,2,7";
 				TEST_TARGET_NAME = FluentUI.Demo;
 			};
 			name = Debug;
@@ -983,7 +983,7 @@
 				PROVISIONING_PROFILE = "63d62159-2691-4b44-9553-b668cc1746c1";
 				SWIFT_EMIT_LOC_STRINGS = NO;
 				SWIFT_VERSION = 5.0;
-				TARGETED_DEVICE_FAMILY = "1,2";
+				TARGETED_DEVICE_FAMILY = "1,2,7";
 				TEST_TARGET_NAME = FluentUI.Demo;
 			};
 			name = Release;
@@ -1010,7 +1010,7 @@
 				PROVISIONING_PROFILE = "63d62159-2691-4b44-9553-b668cc1746c1";
 				SWIFT_EMIT_LOC_STRINGS = NO;
 				SWIFT_VERSION = 5.0;
-				TARGETED_DEVICE_FAMILY = "1,2";
+				TARGETED_DEVICE_FAMILY = "1,2,7";
 				TEST_TARGET_NAME = FluentUI.Demo;
 			};
 			name = Dogfood;
@@ -1099,9 +1099,12 @@
 				PRODUCT_NAME = FluentUI.Demo;
 				PROVISIONING_PROFILE = "4596e7d8-5232-4b9f-82bf-63883e38cd5c";
 				PROVISIONING_PROFILE_SPECIFIER = "Office Fabric Demo Dogfood development";
+				SUPPORTED_PLATFORMS = "iphoneos iphonesimulator xros xrsimulator";
+				SUPPORTS_MACCATALYST = NO;
+				SUPPORTS_XR_DESIGNED_FOR_IPHONE_IPAD = NO;
 				SWIFT_OBJC_BRIDGING_HEADER = "FluentUI.Demo/FluentUI.Demo-Bridging-Header.h";
 				SWIFT_VERSION = 5.0;
-				TARGETED_DEVICE_FAMILY = "1,2";
+				TARGETED_DEVICE_FAMILY = "1,2,7";
 			};
 			name = Dogfood;
 		};
@@ -1249,10 +1252,13 @@
 				PRODUCT_NAME = FluentUI.Demo;
 				PROVISIONING_PROFILE = "63d62159-2691-4b44-9553-b668cc1746c1";
 				PROVISIONING_PROFILE_SPECIFIER = "iOS Team Provisioning Profile";
+				SUPPORTED_PLATFORMS = "iphoneos iphonesimulator xros xrsimulator";
+				SUPPORTS_MACCATALYST = NO;
+				SUPPORTS_XR_DESIGNED_FOR_IPHONE_IPAD = NO;
 				SWIFT_OBJC_BRIDGING_HEADER = "FluentUI.Demo/FluentUI.Demo-Bridging-Header.h";
 				SWIFT_OPTIMIZATION_LEVEL = "-Onone";
 				SWIFT_VERSION = 5.0;
-				TARGETED_DEVICE_FAMILY = "1,2";
+				TARGETED_DEVICE_FAMILY = "1,2,7";
 			};
 			name = Debug;
 		};
@@ -1278,9 +1284,12 @@
 				PRODUCT_NAME = FluentUI.Demo;
 				PROVISIONING_PROFILE = "63d62159-2691-4b44-9553-b668cc1746c1";
 				PROVISIONING_PROFILE_SPECIFIER = "iOS Team Provisioning Profile";
+				SUPPORTED_PLATFORMS = "iphoneos iphonesimulator xros xrsimulator";
+				SUPPORTS_MACCATALYST = NO;
+				SUPPORTS_XR_DESIGNED_FOR_IPHONE_IPAD = NO;
 				SWIFT_OBJC_BRIDGING_HEADER = "FluentUI.Demo/FluentUI.Demo-Bridging-Header.h";
 				SWIFT_VERSION = 5.0;
-				TARGETED_DEVICE_FAMILY = "1,2";
+				TARGETED_DEVICE_FAMILY = "1,2,7";
 			};
 			name = Release;
 		};

ios/FluentUI.Demo/FluentUI.Demo/DemoListViewController.swift

@@ -30,7 +30,7 @@ class DemoListViewController: DemoTableViewController {
     func updateColorProviderFor(window: UIWindow, theme: DemoColorTheme) {
         self.theme = theme
         if let provider = self.provider {
-            window.setColorProvider(provider)
+            FluentTheme.setSharedThemeColorProvider(provider)
             let fluentTheme = self.view.fluentTheme
             let primaryColor = fluentTheme.color(.brandBackground1)
             FluentUIFramework.initializeAppearance(with: primaryColor, whenContainedInInstancesOf: [type(of: window)])
@@ -113,6 +113,9 @@ class DemoListViewController: DemoTableViewController {
         }
         cell.titleNumberOfLinesForLargerDynamicType = 2
         cell.backgroundStyleType = .grouped
+#if os(visionOS)
+        cell.isEnabled = demo.supportsVisionOS
+#endif
 
         if indexPath.row == DemoControllerSection.allCases[indexPath.section].rows.count - 1 {
             cell.bottomSeparatorType = .none

ios/FluentUI.Demo/FluentUI.Demo/Demos.swift

@@ -9,68 +9,70 @@ import UIKit
 struct DemoDescriptor: Identifiable {
     let title: String
     let controllerClass: UIViewController.Type
+    let supportsVisionOS: Bool
     let id = UUID()
 
-    init(_ title: String, _ controllerClass: UIViewController.Type, debugOnly: Bool = false) {
+    init(_ title: String, _ controllerClass: UIViewController.Type, supportsVisionOS: Bool) {
         self.title = title
         self.controllerClass = controllerClass
+        self.supportsVisionOS = supportsVisionOS
     }
 }
 
 struct Demos {
     static let fluent2: [DemoDescriptor] = [
-        DemoDescriptor("ActivityIndicator", ActivityIndicatorDemoController.self),
-        DemoDescriptor("Avatar", AvatarDemoController.self),
-        DemoDescriptor("AvatarGroup", AvatarGroupDemoController.self),
-        DemoDescriptor("BadgeField", BadgeFieldDemoController.self),
-        DemoDescriptor("BadgeView", BadgeViewDemoController.self),
-        DemoDescriptor("BottomCommandingController", BottomCommandingDemoController.self),
-        DemoDescriptor("BottomSheetController", BottomSheetDemoController.self),
-        DemoDescriptor("Button", ButtonDemoController.self),
-        DemoDescriptor("CardNudge", CardNudgeDemoController.self),
-        DemoDescriptor("CommandBar", CommandBarDemoController.self),
-        DemoDescriptor("DrawerController", DrawerDemoController.self),
-        DemoDescriptor("HUD", HUDDemoController.self),
-        DemoDescriptor("IndeterminateProgressBar", IndeterminateProgressBarDemoController.self),
-        DemoDescriptor("Label", LabelDemoController.self),
-        DemoDescriptor("ListActionItem", ListActionItemDemoController.self),
-        DemoDescriptor("ListItem", ListItemDemoController.self),
-        DemoDescriptor("MultilineCommandBar", MultilineCommandBarDemoController.self),
-        DemoDescriptor("NavigationController", NavigationControllerDemoController.self),
-        DemoDescriptor("NotificationView", NotificationViewDemoController.self),
-        DemoDescriptor("Other cells", OtherCellsDemoController.self),
-        DemoDescriptor("PeoplePicker", PeoplePickerDemoController.self),
-        DemoDescriptor("PersonaButtonCarousel", PersonaButtonCarouselDemoController.self),
-        DemoDescriptor("PillButton", PillButtonDemoController.self),
-        DemoDescriptor("PillButtonBar", PillButtonBarDemoController.self),
-        DemoDescriptor("PopupMenuController", PopupMenuDemoController.self),
-        DemoDescriptor("SearchBar", SearchBarDemoController.self),
-        DemoDescriptor("SegmentedControl", SegmentedControlDemoController.self),
-        DemoDescriptor("ShimmerView", ShimmerViewDemoController.self),
-        DemoDescriptor("SideTabBar", SideTabBarDemoController.self),
-        DemoDescriptor("TabBarView", TabBarViewDemoController.self),
-        DemoDescriptor("TableViewCell", TableViewCellDemoController.self),
-        DemoDescriptor("TableViewHeaderFooterView", TableViewHeaderFooterViewDemoController.self),
-        DemoDescriptor("Text Field", TextFieldDemoController.self),
-        DemoDescriptor("Tooltip", TooltipDemoController.self),
-        DemoDescriptor("TwoLineTitleView", TwoLineTitleViewDemoController.self)
+        DemoDescriptor("ActivityIndicator", ActivityIndicatorDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("Avatar", AvatarDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("AvatarGroup", AvatarGroupDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("BadgeField", BadgeFieldDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("BadgeView", BadgeViewDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("BottomCommandingController", BottomCommandingDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("BottomSheetController", BottomSheetDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("Button", ButtonDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("CardNudge", CardNudgeDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("CommandBar", CommandBarDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("DrawerController", DrawerDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("HUD", HUDDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("IndeterminateProgressBar", IndeterminateProgressBarDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("Label", LabelDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("ListActionItem", ListActionItemDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("ListItem", ListItemDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("MultilineCommandBar", MultilineCommandBarDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("NavigationController", NavigationControllerDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("NotificationView", NotificationViewDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("Other cells", OtherCellsDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("PeoplePicker", PeoplePickerDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("PersonaButtonCarousel", PersonaButtonCarouselDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("PillButton", PillButtonDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("PillButtonBar", PillButtonBarDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("PopupMenuController", PopupMenuDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("SearchBar", SearchBarDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("SegmentedControl", SegmentedControlDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("ShimmerView", ShimmerViewDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("SideTabBar", SideTabBarDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("TabBarView", TabBarViewDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("TableViewCell", TableViewCellDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("TableViewHeaderFooterView", TableViewHeaderFooterViewDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("Text Field", TextFieldDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("Tooltip", TooltipDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("TwoLineTitleView", TwoLineTitleViewDemoController.self, supportsVisionOS: false)
     ]
 
     static let fluent2DesignTokens: [DemoDescriptor] = [
-        DemoDescriptor("Global Color Tokens", GlobalColorTokensDemoController.self),
-        DemoDescriptor("Alias Color Tokens", AliasColorTokensDemoController.self),
-        DemoDescriptor("Shadow Tokens", ShadowTokensDemoController.self),
-        DemoDescriptor("Typography Tokens", TypographyTokensDemoController.self)
+        DemoDescriptor("Global Color Tokens", GlobalColorTokensDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("Alias Color Tokens", AliasColorTokensDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("Shadow Tokens", ShadowTokensDemoController.self, supportsVisionOS: true),
+        DemoDescriptor("Typography Tokens", TypographyTokensDemoController.self, supportsVisionOS: true)
     ]
 
     static let controls: [DemoDescriptor] = [
-        DemoDescriptor("Card", CardViewDemoController.self),
-        DemoDescriptor("DateTimePicker", DateTimePickerDemoController.self),
-        DemoDescriptor("PersonaListView", PersonaListViewDemoController.self),
-        DemoDescriptor("TableViewCellShimmer", TableViewCellShimmerDemoController.self)
+        DemoDescriptor("Card", CardViewDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("DateTimePicker", DateTimePickerDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("PersonaListView", PersonaListViewDemoController.self, supportsVisionOS: false),
+        DemoDescriptor("TableViewCellShimmer", TableViewCellShimmerDemoController.self, supportsVisionOS: false)
     ]
 
     static let debug: [DemoDescriptor] = [
-        DemoDescriptor("DEBUG: Objective-C Demos", ObjectiveCDemoController.self)
+        DemoDescriptor("DEBUG: Objective-C Demos", ObjectiveCDemoController.self, supportsVisionOS: false)
     ]
 }

ios/FluentUI.Demo/FluentUI.Demo/Demos/CommandBarDemoController.swift

@@ -297,7 +297,9 @@ class CommandBarDemoController: DemoController {
 
         let accessoryCommandBar = CommandBar(itemGroups: createItemGroups(), trailingItemGroups: [[newItem(for: .keyboard)]])
         accessoryCommandBar.translatesAutoresizingMaskIntoConstraints = false
+#if os(iOS)
         textField.inputAccessoryView = accessoryCommandBar
+#endif
     }
 
     func createItemGroups() -> [CommandBarItemGroup] {

ios/FluentUI.Demo/FluentUI.Demo/Demos/DrawerDemoController.swift

@@ -60,6 +60,7 @@ class DrawerDemoController: DemoController {
 
         // Screen edge gestures to interactively present side drawers
 
+#if os(iOS)
         let leadingEdgeGesture = UIScreenEdgePanGestureRecognizer(target: self, action: #selector(handleScreenEdgePan))
         leadingEdgeGesture.edges = view.effectiveUserInterfaceLayoutDirection == .leftToRight ? .left : .right
         view.addGestureRecognizer(leadingEdgeGesture)
@@ -68,6 +69,7 @@ class DrawerDemoController: DemoController {
         let trailingEdgeGesture = UIScreenEdgePanGestureRecognizer(target: self, action: #selector(handleScreenEdgePan))
         trailingEdgeGesture.edges = view.effectiveUserInterfaceLayoutDirection == .leftToRight ? .right : .left
         view.addGestureRecognizer(trailingEdgeGesture)
+#endif
     }
 
     @discardableResult
@@ -318,6 +320,7 @@ class DrawerDemoController: DemoController {
         textField.becomeFirstResponder()
     }
 
+#if os(iOS)
     @objc private func handleScreenEdgePan(gesture: UIScreenEdgePanGestureRecognizer) {
         guard gesture.state == .began else {
             return
@@ -327,6 +330,7 @@ class DrawerDemoController: DemoController {
 
         presentDrawer(sourceView: view, presentationDirection: gesture.edges == leadingEdge ? .fromLeading : .fromTrailing, presentingGesture: gesture, contentView: containerForActionViews(drawerHasFlexibleHeight: false), resizingBehavior: .dismiss)
     }
+#endif
 
     @objc private func changeContentHeightButtonTapped(sender: UIButton) {
         if let spacer = (sender.superview as? UIStackView)?.arrangedSubviews.last,

ios/FluentUI.Demo/FluentUI.Demo/Demos/NavigationControllerDemoController.swift

@@ -252,12 +252,14 @@ class NavigationControllerDemoController: DemoController {
         }
 
         controller.modalPresentationStyle = .fullScreen
+#if os(iOS)
         if titleStyle.usesLeadingAlignment {
             let leadingEdgeGesture = UIScreenEdgePanGestureRecognizer(target: self, action: #selector(handleScreenEdgePan))
             leadingEdgeGesture.edges = view.effectiveUserInterfaceLayoutDirection == .leftToRight ? .left : .right
             leadingEdgeGesture.delegate = self
             controller.view.addGestureRecognizer(leadingEdgeGesture)
         }
+#endif
 
         present(controller, animated: false)
 
@@ -279,7 +281,9 @@ class NavigationControllerDemoController: DemoController {
             }
 
             navigationItem.navigationBarStyle = newStyle
+#if os(iOS)
             self.setNeedsStatusBarAppearanceUpdate()
+#endif
             self.changeStyleContinuously(in: navigationItem)
         }
     }
@@ -327,13 +331,16 @@ class NavigationControllerDemoController: DemoController {
         presentSideDrawer()
     }
 
+#if os(iOS)
     @objc private func handleScreenEdgePan(gesture: UIScreenEdgePanGestureRecognizer) {
         if gesture.state == .began {
             presentSideDrawer(presentingGesture: gesture)
         }
     }
+#endif
 }
 
+#if os(iOS)
 // MARK: - NavigationControllerDemoController: UIGestureRecognizerDelegate
 
 extension NavigationControllerDemoController: UIGestureRecognizerDelegate {
@@ -346,6 +353,7 @@ extension NavigationControllerDemoController: UIGestureRecognizerDelegate {
         return true
     }
 }
+#endif
 
 // MARK: - RootViewController
 
@@ -815,7 +823,9 @@ class RootViewController: UIViewController, UITableViewDataSource, UITableViewDe
     func navigationBarDidTapOnTitle(_ sender: NavigationBar) {
         if let topItem = sender.topItem {
             topItem.navigationBarStyle = topItem.navigationBarStyle == .primary ? .system : .primary
+#if os(iOS)
             setNeedsStatusBarAppearanceUpdate()
+#endif
         }
     }
 }

ios/FluentUI.Demo/FluentUI.Demo/Demos/TableViewHeaderFooterViewDemoController.swift

@@ -133,9 +133,11 @@ extension TableViewHeaderFooterViewDemoController {
                 }
                 footer?.setup(style: .footer, attributedTitle: title)
 
+#if os(iOS)
                 if section.hasCustomLinkHandler {
                     footer?.delegate = self
                 }
+#endif
             }
             footer?.titleNumberOfLines = section.numberOfLines
             footer?.tokenSet.replaceAllOverrides(with: overrideTokens)
@@ -163,6 +165,7 @@ extension TableViewHeaderFooterViewDemoController {
 
 // MARK: - TableViewHeaderFooterViewDemoController: TableViewHeaderFooterViewDelegate
 
+#if os(iOS)
 extension TableViewHeaderFooterViewDemoController: TableViewHeaderFooterViewDelegate {
     func headerFooterView(_ headerFooterView: TableViewHeaderFooterView, shouldInteractWith URL: URL, in characterRange: NSRange, interaction: UITextItemInteraction) -> Bool {
         let alertController = UIAlertController(title: "Link tapped", message: nil, preferredStyle: .alert)
@@ -171,6 +174,7 @@ extension TableViewHeaderFooterViewDemoController: TableViewHeaderFooterViewDele
         return false
     }
 }
+#endif
 
 extension TableViewHeaderFooterViewDemoController: DemoAppearanceDelegate {
     func themeWideOverrideDidChange(isOverrideEnabled: Bool) {