Pin DesignKit version and use contantAndAvatars array.

Riot.xcworkspace/xcshareddata/swiftpm/Package.resolved

@@ -5,17 +5,17 @@
  "kind" : "remoteSourceControl",
  "location" : "https:/vector-im/element-design-tokens.git",
  "state" : {
- "revision" : "4aafdc25ca0e322c0de930d4ec86121f5503023e",
- "version" : "0.0.1"
+ "revision" : "02ba42d9ec02f90370a6cfc35a68d7312696636c",
+ "version" : "0.0.2"
  }
  },
  {
  "identity" : "element-x-ios",
  "kind" : "remoteSourceControl",
  "location" : "https:/vector-im/element-x-ios",
  "state" : {
- "branch" : "develop",
- "revision" : "272fc5000bfe6e15a0f0ea669ef3088c7d163ce7"
+ "revision" : "0a199ee61126feb8c8a462200cb4749d6eb3ba77",
+ "version" : "1.0.1-202207011447"
  }
  },
  {

Riot/Managers/Theme/ElementUIColorsResolved.swift

@@ -63,16 +63,7 @@ extension UIColor {
  self.system = dynamicColors.system.resolvedColor(with: traitCollection)
  self.background = dynamicColors.background.resolvedColor(with: traitCollection)
 
- self.namesAndAvatars = [
- dynamicColors.globalAzure.resolvedColor(with: traitCollection),
- dynamicColors.globalGrape.resolvedColor(with: traitCollection),
- dynamicColors.globalVerde.resolvedColor(with: traitCollection),
- dynamicColors.globalPolly.resolvedColor(with: traitCollection),
- dynamicColors.globalMelon.resolvedColor(with: traitCollection),
- dynamicColors.globalAqua.resolvedColor(with: traitCollection),
- dynamicColors.globalPrune.resolvedColor(with: traitCollection),
- dynamicColors.globalKiwi.resolvedColor(with: traitCollection)
- ]
+ self.namesAndAvatars = dynamicColors.contentAndAvatars
 
  // Legacy colours
  self.quarterlyContent = dynamicColors.quaternaryContent.resolvedColor(with: traitCollection)

RiotSwiftUI/Modules/Common/Avatar/View/AvatarImage.swift

@@ -49,7 +49,7 @@ struct AvatarImage: View {
  mxContentUri: mxContentUri,
  matrixItemId: matrixItemId,
  displayName: displayName,
- colorCount: theme.colors.namesAndAvatars.count,
+ colorCount: theme.colors.contentAndAvatars.count,
  avatarSize: size
  )
  }

RiotSwiftUI/Modules/Common/Avatar/View/PlaceholderAvatarImage.swift

@@ -36,7 +36,7 @@ struct PlaceholderAvatarImage: View {
 
  var body: some View {
  ZStack {
- theme.colors.namesAndAvatars[colorIndex]
+ theme.colors.contentAndAvatars[colorIndex]
 
  Text(String(firstCharacter))
  .padding(4)

RiotSwiftUI/Modules/Common/Avatar/View/SpaceAvatarImage.swift

@@ -38,7 +38,7 @@ struct SpaceAvatarImage: View {
  .padding(10)
  .frame(width: CGFloat(size.rawValue), height: CGFloat(size.rawValue))
  .foregroundColor(.white)
- .background(theme.colors.namesAndAvatars[colorIndex])
+ .background(theme.colors.contentAndAvatars[colorIndex])
  .clipShape(RoundedRectangle(cornerRadius: 8))
  // Make the text resizable (i.e. Make it large and then allow it to scale down)
  .font(.system(size: 200))
@@ -55,7 +55,7 @@ struct SpaceAvatarImage: View {
  mxContentUri: mxContentUri,
  matrixItemId: matrixItemId,
  displayName: value,
- colorCount: theme.colors.namesAndAvatars.count,
+ colorCount: theme.colors.contentAndAvatars.count,
  avatarSize: size
  )
  })
@@ -65,7 +65,7 @@ struct SpaceAvatarImage: View {
  mxContentUri: mxContentUri,
  matrixItemId: matrixItemId,
  displayName: displayName,
- colorCount: theme.colors.namesAndAvatars.count,
+ colorCount: theme.colors.contentAndAvatars.count,
  avatarSize: size
  )
  }

RiotSwiftUI/Modules/Common/EffectsScene/EffectsScene.swift

@@ -31,7 +31,7 @@ class EffectsScene: SCNScene {
  static func confetti(with theme: ThemeSwiftUI) -> EffectsScene? {
  guard let scene = EffectsScene(named: Constants.confettiSceneName) else { return nil }
 
- let colors: [[Float]] = theme.colors.namesAndAvatars.compactMap { $0.floatComponents }
+ let colors: [[Float]] = theme.colors.contentAndAvatars.compactMap { $0.floatComponents }
 
  if let particles = scene.rootNode.childNode(withName: Constants.particlesNodeName, recursively: false)?.particleSystems?.first {
  // The particles need a non-zero color variation for the handler to affect the color

RiotSwiftUI/Modules/Common/Theme/ThemeSwiftUI.swift

@@ -36,24 +36,11 @@ public protocol ThemeSwiftUIType {
  /// may contain more design components in future, like icons, audio files etc.
 }
 
+// MARK: - Legacy Colors
+
 public extension ElementColors {
- // MARK: - Legacy
  var legacyTile: Color {
  let dynamicColor = UIColor { $0.userInterfaceStyle == .light ? .elementLight.tile : .elementDark.tile }
  return Color(dynamicColor)
  }
-
- // TODO: Generate in DesignTokens repo.
- var namesAndAvatars: [Color] {
- [
- globalAzure,
- globalGrape,
- globalVerde,
- globalPolly,
- globalMelon,
- globalAqua,
- globalPrune,
- globalKiwi
- ]
- }
 }

RiotSwiftUI/Modules/Common/Theme/ThemeUsersColorsExtension.swift

@@ -23,7 +23,7 @@ extension ThemeSwiftUI {
  /// - Parameter userId: The user id used to hash.
  /// - Returns: The SwiftUI color for the associated userId.
  func userColor(for userId: String) -> Color {
- let senderNameColorIndex = Int(userId.vc_hashCode % Int32(colors.namesAndAvatars.count))
- return colors.namesAndAvatars[senderNameColorIndex]
+ let senderNameColorIndex = Int(userId.vc_hashCode % Int32(colors.contentAndAvatars.count))
+ return colors.contentAndAvatars[senderNameColorIndex]
  }
 }

RiotSwiftUI/Modules/Onboarding/Avatar/Coordinator/OnboardingAvatarCoordinator.swift

@@ -72,7 +72,7 @@ final class OnboardingAvatarCoordinator: Coordinator, Presentable {
  self.parameters = parameters
  let viewModel = OnboardingAvatarViewModel(userId: parameters.userSession.userId,
  displayName: parameters.userSession.account.userDisplayName,
- avatarColorCount: DefaultThemeSwiftUI().colors.namesAndAvatars.count)
+ avatarColorCount: DefaultThemeSwiftUI().colors.contentAndAvatars.count)
  viewModel.updateAvatarImage(with: parameters.avatar)
 
  let view = OnboardingAvatarScreen(viewModel: viewModel.context)

RiotSwiftUI/Modules/Onboarding/Avatar/MockOnboardingAvatarScreenState.swift

@@ -44,7 +44,7 @@ enum MockOnboardingAvatarScreenState: MockScreenState, CaseIterable {
 
  /// Generate the view struct for the screen state.
  var screenView: ([Any], AnyView) {
- let avatarColorCount = DefaultThemeSwiftUI().colors.namesAndAvatars.count
+ let avatarColorCount = DefaultThemeSwiftUI().colors.contentAndAvatars.count
  let viewModel: OnboardingAvatarViewModel
  switch self {
  case .placeholderAvatar(let userId, let displayName):

changelog.d/pr-6275.api

@@ -0,0 +1 @@
+Replace DesignKit framework with [DesignKit package](https:/vector-im/element-x-ios/tree/develop/DesignKit/Sources). Colours are now generated in the [DesignTokens repo](https:/vector-im/element-design-tokens) to be shared across all of our apps.

project.yml

@@ -41,7 +41,7 @@ include:
 packages:
  DesignKit:
  url: https:/vector-im/element-x-ios
- branch: develop
+ exactVersion: 1.0.1-202207011447
  Mapbox:
  url: https:/maplibre/maplibre-gl-native-distribution
  minVersion: 5.12.2