fix: clarify token usage examples in code

Orange-OpenSource · Nov 25, 2024 · c3cfaa0 · c3cfaa0
1 parent ccac4ff
commit c3cfaa0
Show file tree

Hide file tree

Showing 8 changed files with 24 additions and 8 deletions.
diff --git a/Showcase/Showcase/Pages/Tokens/Border/BorderTokenPage.swift b/Showcase/Showcase/Pages/Tokens/Border/BorderTokenPage.swift
@@ -50,7 +50,8 @@ struct BorderTokenPage: View {
         VStack(alignment: .leading, spacing: activeTheme.spaceFixedMedium) {
             Section {
                 VStack(alignment: .leading, spacing: activeTheme.spaceFixedNone) {
-                    ShowcaseTokenCode(code: NamedBorderWidth.borderWidthFocusInset.rawValue)
+                    let tokenCode = "theme.borderWidthDefault"
+                    ShowcaseTokenCode(code: tokenCode)
                 }
             }
             Section {

diff --git a/Showcase/Showcase/Pages/Tokens/Color/ColorTokenPage.swift b/Showcase/Showcase/Pages/Tokens/Color/ColorTokenPage.swift
@@ -50,7 +50,8 @@ struct ColorTokenPage: View {
     var body: some View {
         Group {
             Section {
-                ShowcaseTokenCode(code: NamedColor.Background.colorBgStatusNeutralOnBgEmphasized.rawValue)
+                let tokenCode = "theme.colorBgPrimary.color(for: colorScheme)"
+                ShowcaseTokenCode(code: tokenCode)
             }
             Section { illustrationForBackground() } header: { header("Background") }
             Section { illustrationForAction() } header: { header("Action") }

diff --git a/Showcase/Showcase/Pages/Tokens/Dimension/Size/SizeTokenPage.swift b/Showcase/Showcase/Pages/Tokens/Dimension/Size/SizeTokenPage.swift
@@ -59,7 +59,10 @@ struct SizeTokenPage: View {
 
     var body: some View {
         Group {
-            Section { ShowcaseTokenCode(code: NamedSize.IconDecorative.sizeIconDecorativeShortest.rawValue) }
+            Section {
+                let tokenCode = "theme.sizeIconWithHeadingXLargeShort.dimension(for: horizontalSizeClass ?? .regular)"
+                ShowcaseTokenCode(code: tokenCode)
+            }
             Section { illustrationForIconDecorative() } header: {
                 header("app_tokens_dimension_size_iconDecorative_label")
             }

diff --git a/Showcase/Showcase/Pages/Tokens/Dimension/Space/SpaceTokenPage.swift b/Showcase/Showcase/Pages/Tokens/Dimension/Space/SpaceTokenPage.swift
@@ -81,7 +81,10 @@ struct SpaceTokenPage: View {
 
     var body: some View {
         Group {
-            Section { ShowcaseTokenCode(code: NamedSpace.PaddingInlineWithIcon.spacePaddingInlineWithIconShortest.rawValue) }
+            Section {
+                let tokenCode = "theme.spaceScaledMedium.dimension(for: horizontalSizeClass ?? .regular)"
+                ShowcaseTokenCode(code: tokenCode)
+            }
             // Basic Space Tokens
             Section { illustrationForScaledSpaces() } header: {
                 header("app_tokens_dimension_space_scaled_label")

diff --git a/Showcase/Showcase/Pages/Tokens/Elevation/ElevationTokenPage.swift b/Showcase/Showcase/Pages/Tokens/Elevation/ElevationTokenPage.swift
@@ -52,7 +52,8 @@ struct ElevationTokenPage: View {
     var body: some View {
         VStack(alignment: .leading, spacing: activeTheme.spaceFixedNone) {
             Section {
-                ShowcaseTokenCode(code: NamedElevation.elevationStickyNavigationScrolled.rawValue)
+                let tokenCode = "theme.elevationNone.elevation(for: colorScheme)"
+                ShowcaseTokenCode(code: tokenCode)
             }
             Spacer()
                 .frame(height: activeTheme.spaceFixedMedium)

diff --git a/Showcase/Showcase/Pages/Tokens/Grid/GrisTokenPage.swift b/Showcase/Showcase/Pages/Tokens/Grid/GrisTokenPage.swift
@@ -41,7 +41,10 @@ struct GridTokenPage: View {
                     .background(theme.colorBgEmphasized.color(for: colorScheme))
             }
 
-            Section { ShowcaseTokenCode(code: NamedGrid.gridColumnCount.rawValue) }
+            Section {
+                let tokenCode = "theme.gridColumnCount(for: horizontalSizeClass)"
+                ShowcaseTokenCode(code: tokenCode)
+            }
 
             Section { illustrationForGridTokens() } header: {
                 Text(horizontalSizeClass.rawValue)

diff --git a/Showcase/Showcase/Pages/Tokens/Opacity/OpacityTokenPage.swift b/Showcase/Showcase/Pages/Tokens/Opacity/OpacityTokenPage.swift
@@ -52,7 +52,8 @@ struct OpacityTokenPage: View {
     var body: some View {
         VStack(alignment: .leading, spacing: activeTheme.spaceFixedNone) {
             Section {
-                ShowcaseTokenCode(code: NamedOpacity.opacityTransparent.rawValue)
+                let tokenCode = "theme.opacityTransparent"
+                ShowcaseTokenCode(code: tokenCode)
             }
             Spacer()
                 .frame(height: activeTheme.spaceFixedMedium)

diff --git a/Showcase/Showcase/Pages/Tokens/Typography/TypographyTokenPage.swift b/Showcase/Showcase/Pages/Tokens/Typography/TypographyTokenPage.swift
@@ -61,7 +61,10 @@ struct TypographyTokenPage: View {
 
     var body: some View {
         VStack(alignment: .leading, spacing: activeTheme.spaceFixedNone) {
-            Section { ShowcaseTokenCode(code: NamedTypography.labelDefaultXLarge.rawValue) }
+            Section {
+                let tokenCode = "theme.typeBodyStrongLarge(theme)"
+                ShowcaseTokenCode(code: tokenCode)
+            }
             Spacer()
             ForEach(NamedTypography.allCases, id: \.rawValue) { typographyName in
                 illustration(from: typographyName)