Skip to content

Commit

Permalink
feat: add new size semantic tokens in size tokens page (#245) (#255)
Browse files Browse the repository at this point in the history
Signed-off-by: Pierre-Yves Lapersonne <[email protected]>
Co-authored-by: Pierre-Yves Lapersonne <[email protected]>
Co-authored-by: Ludovic Pinel <[email protected]>
  • Loading branch information
ludovic35 and pylapp authored Oct 28, 2024
1 parent 02741a7 commit 5bd516b
Show file tree
Hide file tree
Showing 13 changed files with 551 additions and 185 deletions.
1 change: 1 addition & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0

### Added

- [DemoApp] Add new tokens in size tokens page ([#245](https://github.com/Orange-OpenSource/ouds-ios/issues/245))
- [Library] Semantic token `borderWidthFocusInset` (value of `borderWidth100`) ([#207](https://github.com/Orange-OpenSource/ouds-ios/issues/207), [#241](https://github.com/Orange-OpenSource/ouds-ios/issues/241))
- [Library] Semantic token `fontWeightCode` ([#242](https://github.com/Orange-OpenSource/ouds-ios/issues/242))
- [DemoApp] Update space tokens screen with all categories ([#178](https://github.com/Orange-OpenSource/ouds-ios/issues/178))
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@
//

import Foundation
import SwiftUICore

/// Kind of semantic tokens which will wrap a combination of `SizeSemanticToken` depending to viewports / size classes.
/// Kind of composite token with multiple values, but not named "composite" because this word is already used in the design system.
Expand Down Expand Up @@ -51,4 +52,11 @@ public final class MultipleSizeTokens: NSObject, Sendable {
}
return self.compact == other.compact && self.regular == other.regular
}

/// Returns the right dimension according to the `userInterfaceSizeClass`.
/// - Parameter userInterfaceSizeClass: The user interface size class (could be the horizontal or the vertical size class)
/// - Returns: The right size semantic token (pointing to the dimension raw token to use)
public func dimension(for userInterfaceSizeClass: UserInterfaceSizeClass) -> SizeSemanticToken {
userInterfaceSizeClass == .compact ? compact : regular
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@

import Foundation
import OUDSTokensRaw
import SwiftUI
import SwiftUICore

/// Kind of semantic tokens which will wrap a combination of `DimensionRawToken` depending to size classes.
/// Kind of composite token with multiple values, but not named "composite" because this word is already used in the design system.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,8 @@
// Software description: A SwiftUI components library with code examples for Orange Unified Design System
//

import Foundation
import OUDSTokensRaw
import SwiftUICore

/// Kind of semantic tokens which will wrap a combination of `TypographyCompositeRawToken` depending to size classes.
/// Kind of composite token with multiple values, but not named "composite" because this word is already used in the design system.
Expand Down Expand Up @@ -50,4 +50,11 @@ public final class MultipleTypographyTokens: NSObject, Sendable {
guard let object = object as? MultipleTypographyTokens else { return false }
return self.compact == object.compact && self.regular == object.regular
}

/// Returns the composite raw token of typography to use according to the `userInterfaceSizeClass` (i.e. `compact` or `regular`)
/// - Parameter userInterfaceSizeClass: The user interface size class
/// - Returns: The composite raw token to use (of type `TypographyCompositeRawToken`)
public func typographyToken(for userInterfaceSizeClass: UserInterfaceSizeClass) -> TypographyCompositeRawToken {
userInterfaceSizeClass == .compact ? compact : regular
}
}
36 changes: 34 additions & 2 deletions Showcase/Showcase.xcodeproj/project.pbxproj
Original file line number Diff line number Diff line change
Expand Up @@ -52,6 +52,10 @@
077CCE582CB426090059CC28 /* SpaceTokenPage.swift in Sources */ = {isa = PBXBuildFile; fileRef = 077CCE522CB426090059CC28 /* SpaceTokenPage.swift */; };
077CCE592CB426090059CC28 /* DimensionTokenElement.swift in Sources */ = {isa = PBXBuildFile; fileRef = 077CCE542CB426090059CC28 /* DimensionTokenElement.swift */; };
077CCE5C2CB431C50059CC28 /* ShowcaseVariantElement.swift in Sources */ = {isa = PBXBuildFile; fileRef = 077CCE5B2CB431C50059CC28 /* ShowcaseVariantElement.swift */; };
0784B2712CCB86C500299C10 /* NamedSize+IconWithTypography.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0784B26F2CCB86C500299C10 /* NamedSize+IconWithTypography.swift */; };
0784B2732CCB8CC800299C10 /* NamedSize+IconDecorative.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0784B2722CCB8CC800299C10 /* NamedSize+IconDecorative.swift */; };
0784B2762CCBD9C300299C10 /* NamedTypography.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0784B2752CCBD9C300299C10 /* NamedTypography.swift */; };
0784B2782CCBDD8900299C10 /* NamedTypography+Illustration.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0784B2772CCBDD8900299C10 /* NamedTypography+Illustration.swift */; };
07CF426B2CA30728000BD03E /* TokensPage.swift in Sources */ = {isa = PBXBuildFile; fileRef = 07CF426A2CA30728000BD03E /* TokensPage.swift */; };
07CF42722CA31AC3000BD03E /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 07CF42712CA31AC3000BD03E /* Assets.xcassets */; };
07CF42742CA3EC58000BD03E /* CardIllustration.swift in Sources */ = {isa = PBXBuildFile; fileRef = 07CF42732CA3EC58000BD03E /* CardIllustration.swift */; };
Expand Down Expand Up @@ -141,6 +145,10 @@
077CCE522CB426090059CC28 /* SpaceTokenPage.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = SpaceTokenPage.swift; sourceTree = "<group>"; };
077CCE542CB426090059CC28 /* DimensionTokenElement.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = DimensionTokenElement.swift; sourceTree = "<group>"; };
077CCE5B2CB431C50059CC28 /* ShowcaseVariantElement.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ShowcaseVariantElement.swift; sourceTree = "<group>"; };
0784B26F2CCB86C500299C10 /* NamedSize+IconWithTypography.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "NamedSize+IconWithTypography.swift"; sourceTree = "<group>"; };
0784B2722CCB8CC800299C10 /* NamedSize+IconDecorative.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "NamedSize+IconDecorative.swift"; sourceTree = "<group>"; };
0784B2752CCBD9C300299C10 /* NamedTypography.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = NamedTypography.swift; sourceTree = "<group>"; };
0784B2772CCBDD8900299C10 /* NamedTypography+Illustration.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "NamedTypography+Illustration.swift"; sourceTree = "<group>"; };
07CEDD802C7DB921003E1885 /* generateDoc.sh */ = {isa = PBXFileReference; lastKnownFileType = text.script.sh; name = generateDoc.sh; path = ../generateDoc.sh; sourceTree = "<group>"; };
07CF426A2CA30728000BD03E /* TokensPage.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TokensPage.swift; sourceTree = "<group>"; };
07CF42712CA31AC3000BD03E /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = "<group>"; };
Expand Down Expand Up @@ -249,6 +257,7 @@
073543192CA17388001187EA /* Typography */ = {
isa = PBXGroup;
children = (
0784B2742CCBD9A900299C10 /* NamedTypography */,
073543172CA172CA001187EA /* TypographyTokenElement.swift */,
0735431A2CA18C48001187EA /* TypographyTokenPage.swift */,
);
Expand Down Expand Up @@ -285,6 +294,7 @@
075114DA2CB7D28D00B8B759 /* Size */ = {
isa = PBXGroup;
children = (
0784B2702CCB86C500299C10 /* NamedSize */,
075114D82CB7D28D00B8B759 /* SizeTokenElement.swift */,
075114D92CB7D28D00B8B759 /* SizeTokenPage.swift */,
);
Expand Down Expand Up @@ -347,6 +357,24 @@
path = Dimension;
sourceTree = "<group>";
};
0784B2702CCB86C500299C10 /* NamedSize */ = {
isa = PBXGroup;
children = (
0784B26F2CCB86C500299C10 /* NamedSize+IconWithTypography.swift */,
0784B2722CCB8CC800299C10 /* NamedSize+IconDecorative.swift */,
);
path = NamedSize;
sourceTree = "<group>";
};
0784B2742CCBD9A900299C10 /* NamedTypography */ = {
isa = PBXGroup;
children = (
0784B2772CCBDD8900299C10 /* NamedTypography+Illustration.swift */,
0784B2752CCBD9C300299C10 /* NamedTypography.swift */,
);
path = NamedTypography;
sourceTree = "<group>";
};
07CF42752CA3F461000BD03E /* Elevation */ = {
isa = PBXGroup;
children = (
Expand Down Expand Up @@ -793,6 +821,7 @@
51087A7B2C46DF9F00160CCF /* Bundle+extension.swift in Sources */,
0765B4962CC159F600E69359 /* NamedColor+Action.swift in Sources */,
0765B4A22CC15C0500E69359 /* NamedColor+OnContent.swift in Sources */,
0784B2782CCBDD8900299C10 /* NamedTypography+Illustration.swift in Sources */,
077CCE572CB426090059CC28 /* SpaceTokenElement.swift in Sources */,
0735431B2CA18C48001187EA /* TypographyTokenPage.swift in Sources */,
07F75A412CC653EB0004F1AD /* NameSpace+GapStack.swift in Sources */,
Expand All @@ -805,9 +834,12 @@
0765B4A62CC15C9D00E69359 /* NamedColor.swift in Sources */,
073543112CA154DE001187EA /* Card.swift in Sources */,
51BD76212C466FCF0033365D /* AboutPage.swift in Sources */,
0784B2732CCB8CC800299C10 /* NamedSize+IconDecorative.swift in Sources */,
51BD762A2C466FCF0033365D /* Showcase.swift in Sources */,
0765B49E2CC15B7E00E69359 /* NamedColor+Decorative.swift in Sources */,
07F75A432CC654050004F1AD /* NameSpace+PaddingStack.swift in Sources */,
0784B2762CCBD9C300299C10 /* NamedTypography.swift in Sources */,
0784B2712CCB86C500299C10 /* NamedSize+IconWithTypography.swift in Sources */,
);
runOnlyForDeploymentPostprocessing = 0;
};
Expand Down Expand Up @@ -1156,8 +1188,8 @@
isa = XCRemoteSwiftPackageReference;
repositoryURL = "https://github.com/pointfreeco/swift-snapshot-testing.git";
requirement = {
kind = upToNextMajorVersion;
minimumVersion = 1.17.5;
kind = exactVersion;
version = 1.17.6;
};
};
/* End XCRemoteSwiftPackageReference section */
Expand Down
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
{
"originHash" : "c48bd6ce1dff61368be114be7113f793bf250d75bd26b7706f31d9a229918712",
"originHash" : "b0e966f4ace0da078a6fcc1dcd094050f4d63b9437f87a3a6b4948c17b90db4e",
"pins" : [
{
"identity" : "swift-snapshot-testing",
"kind" : "remoteSourceControl",
"location" : "https://github.com/pointfreeco/swift-snapshot-testing.git",
"state" : {
"revision" : "7b0bbbae90c41f848f90ac7b4df6c4f50068256d",
"version" : "1.17.5"
"revision" : "42a086182681cf661f5c47c9b7dc3931de18c6d7",
"version" : "1.17.6"
}
},
{
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
//
// 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
//

import OUDS
import OUDSTokensSemantic

extension NamedSize {
enum IconDecorative: String, CaseIterable {
case sizeIconDecorativeShortest
case sizeIconDecorativeShorter
case sizeIconDecorativeShort
case sizeIconDecorativeMedium
case sizeIconDecorativeTall
case sizeIconDecorativeTaller
case sizeIconDecorativeTallest

func token(from theme: OUDSTheme) -> SizeSemanticToken {
switch self {
case .sizeIconDecorativeShortest:
return theme.sizeIconDecorativeShortest
case .sizeIconDecorativeShorter:
return theme.sizeIconDecorativeShorter
case .sizeIconDecorativeShort:
return theme.sizeIconDecorativeShort
case .sizeIconDecorativeMedium:
return theme.sizeIconDecorativeMedium
case .sizeIconDecorativeTall:
return theme.sizeIconDecorativeTall
case .sizeIconDecorativeTaller:
return theme.sizeIconDecorativeTaller
case .sizeIconDecorativeTallest:
return theme.sizeIconDecorativeTallest
}
}
}
}
Loading

0 comments on commit 5bd516b

Please sign in to comment.