diff --git a/packages/components/package.json b/packages/components/package.json
index 4e251e02..99861104 100644
--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@department-of-veterans-affairs/mobile-component-library",
-  "version": "0.0.18",
+  "version": "0.0.22",
   "description": "VA Design System Mobile Component Library",
   "main": "src/index.tsx",
   "scripts": {
@@ -38,7 +38,7 @@
   },
   "homepage": "https://department-of-veterans-affairs.github.io/va-mobile-library",
   "dependencies": {
-    "@department-of-veterans-affairs/mobile-tokens": "0.0.7",
+    "@department-of-veterans-affairs/mobile-tokens": "0.0.10",
     "@os-team/i18next-react-native-language-detector": "^1.0.28",
     "i18next": "^23.4.3",
     "react-i18next": "^13.0.3",
diff --git a/packages/components/src/components/SegmentedControl/SegmentedControl.stories.tsx b/packages/components/src/components/SegmentedControl/SegmentedControl.stories.tsx
index eac22413..8c764316 100644
--- a/packages/components/src/components/SegmentedControl/SegmentedControl.stories.tsx
+++ b/packages/components/src/components/SegmentedControl/SegmentedControl.stories.tsx
@@ -52,6 +52,7 @@ export const twoSegments: Story = {
       'You have 3 unread messages. Review messages in your inbox',
       'Review your folders',
     ],
+    testIDs: ['test-id-1', 'test-id-2'],
   },
   parameters: {
     design: [
diff --git a/packages/components/src/components/SegmentedControl/SegmentedControl.tsx b/packages/components/src/components/SegmentedControl/SegmentedControl.tsx
index 5e5a8855..3805c626 100644
--- a/packages/components/src/components/SegmentedControl/SegmentedControl.tsx
+++ b/packages/components/src/components/SegmentedControl/SegmentedControl.tsx
@@ -1,4 +1,4 @@
-import { Colors } from '@department-of-veterans-affairs/mobile-tokens'
+import * as DesignTokens from '@department-of-veterans-affairs/mobile-tokens'
 import {
   Text,
   TextStyle,
@@ -27,6 +27,8 @@ export type SegmentedControlProps = {
   a11yLabels?: string[]
   /** Optional array of segment accessibility hints */
   a11yHints?: string[]
+  /** Optional array of test IDs for test suites */
+  testIDs?: string[]
 }
 
 type SegmentProps = {
@@ -52,6 +54,7 @@ export const SegmentedControl: FC<SegmentedControlProps> = ({
   selected,
   a11yLabels,
   a11yHints,
+  testIDs,
 }) => {
   const { t } = useTranslation()
   const colorScheme = useColorScheme()
@@ -63,13 +66,13 @@ export const SegmentedControl: FC<SegmentedControlProps> = ({
   let textColor: string, activeBgColor: string, inactiveBgColor: string
 
   if (colorScheme === 'light') {
-    textColor = Colors.grayDark
-    activeBgColor = Colors.white
-    inactiveBgColor = Colors.grayLighter
+    textColor = DesignTokens.colorGrayDark
+    activeBgColor = DesignTokens.colorWhite
+    inactiveBgColor = DesignTokens.colorGrayLighter
   } else {
-    textColor = Colors.grayLightest
-    activeBgColor = Colors.grayMedium
-    inactiveBgColor = Colors.grayDark
+    textColor = DesignTokens.colorGrayLightest
+    activeBgColor = DesignTokens.colorGrayMedium
+    inactiveBgColor = DesignTokens.colorGrayDark
   }
 
   const viewStyle: ViewStyle = {
@@ -125,6 +128,7 @@ export const SegmentedControl: FC<SegmentedControlProps> = ({
         accessibilityValue={accessibilityValue}
         accessibilityRole={'tab'}
         accessibilityState={{ selected: isSelected }}
+        testID={testIDs?.[index]}
       >
         <Text allowFontScaling={false} style={textStyle}>
           {label}
diff --git a/packages/components/yarn.lock b/packages/components/yarn.lock
index 5fc1e0fc..dbc3d9a8 100644
--- a/packages/components/yarn.lock
+++ b/packages/components/yarn.lock
@@ -2829,7 +2829,7 @@ __metadata:
   dependencies:
     "@babel/core": ^7.20.0
     "@babel/plugin-proposal-export-namespace-from": ^7.18.9
-    "@department-of-veterans-affairs/mobile-tokens": 0.0.7
+    "@department-of-veterans-affairs/mobile-tokens": 0.0.10
     "@expo/webpack-config": ^18.1.2
     "@os-team/i18next-react-native-language-detector": ^1.0.28
     "@react-native-async-storage/async-storage": ^1.19.0
@@ -2882,10 +2882,10 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@department-of-veterans-affairs/mobile-tokens@npm:0.0.7":
-  version: 0.0.7
-  resolution: "@department-of-veterans-affairs/mobile-tokens@npm:0.0.7"
-  checksum: eb1f4c756a3408a6219aaa8465aec5a2d1d926e1a49271574847c8668afe2082f8dafd21ee451becd12409262d7697c41a7ba61490a077662a14710218205b1e
+"@department-of-veterans-affairs/mobile-tokens@npm:0.0.10":
+  version: 0.0.10
+  resolution: "@department-of-veterans-affairs/mobile-tokens@npm:0.0.10"
+  checksum: 7590c87fb87e72891fe270f9dc53be8af3d0471d43cd448ead234b40d3f1fd5612740f049c121062c2beffd2597e81fa4e705e808bf3dc3110c33fbc1213f928
   languageName: node
   linkType: hard
 
diff --git a/packages/tokens/config.json b/packages/tokens/config.json
index 304c244c..a1c65205 100644
--- a/packages/tokens/config.json
+++ b/packages/tokens/config.json
@@ -9,13 +9,12 @@
       "prefix": "",
       "files": [
         {
-          "destination": "js/colors.js",
-          "format": "javascript/es6",
-          "filter": {
-            "attributes": {
-              "category": "color"
-            }
-          }
+          "destination": "js/tokens.js",
+          "format": "javascript/es6"
+        },
+        {
+          "format": "typescript/es6-declarations",
+          "destination": "index.d.ts"
         }
       ]
     }
diff --git a/packages/tokens/package.json b/packages/tokens/package.json
index fe6a1449..4905f10c 100644
--- a/packages/tokens/package.json
+++ b/packages/tokens/package.json
@@ -1,8 +1,9 @@
 {
   "name": "@department-of-veterans-affairs/mobile-tokens",
-  "version": "0.0.7",
+  "version": "0.0.10",
   "description": "VA Design System Mobile Token Library",
-  "main": "src/index.ts",
+  "main": "dist/js/tokens.js",
+  "types": "dist/index.d.ts",
   "scripts": {
     "build": "style-dictionary build",
     "prepack": "style-dictionary build",
diff --git a/packages/tokens/src/index.ts b/packages/tokens/src/index.ts
deleted file mode 100644
index 81630a8a..00000000
--- a/packages/tokens/src/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * as Colors from '../dist/js/colors'
diff --git a/packages/tokens/src/tokens/colors.json b/packages/tokens/src/tokens/colors.json
index b5d81e5e..074f05f9 100644
--- a/packages/tokens/src/tokens/colors.json
+++ b/packages/tokens/src/tokens/colors.json
@@ -1,190 +1,202 @@
 {
-  "white": {
-    "value": "#fff",
-    "attributes": {
-      "category": "color"
-    }
-  },
-  "gray": {
-    "*": {
-      "value": "#5b616b",
-      "filePath": "tokens/color.json",
-      "isSource": true,
-      "original": {
-        "value": "#5b616b"
-      },
-      "name": "color-gray",
-      "attributes": {
-        "category": "color",
-        "type": "gray",
-        "item": "*"
-      },
-      "path": [
-        "gray",
-        "*"
-      ]
-    },
-    "dark": {
-      "value": "#323a45",
-      "filePath": "tokens/color.json",
-      "isSource": true,
-      "original": {
-        "value": "#323a45"
-      },
-      "name": "color-gray-dark",
-      "attributes": {
-        "category": "color",
-        "type": "gray",
-        "item": "dark"
-      },
-      "path": [
-        "gray",
-        "dark"
-      ]
-    },
-    "medium": {
-      "value": "#757575",
-      "filePath": "tokens/color.json",
-      "isSource": true,
-      "original": {
-        "value": "#757575"
-      },
-      "name": "color-gray-medium",
-      "attributes": {
-        "category": "color",
-        "type": "gray",
-        "item": "medium"
-      },
-      "path": [
-        "gray",
-        "medium"
-      ]
-    },
-    "light": {
-      "value": "#aeb0b5",
-      "filePath": "tokens/color.json",
-      "isSource": true,
-      "original": {
-        "value": "#aeb0b5"
-      },
-      "name": "color-gray-light",
-      "attributes": {
-        "category": "color",
-        "type": "gray",
-        "item": "light"
-      },
-      "path": [
-        "gray",
-        "light"
-      ]
-    },
-    "light-alt": {
-      "value": "#eeeeee",
-      "filePath": "tokens/color.json",
-      "isSource": true,
-      "original": {
-        "value": "#eeeeee"
-      },
-      "name": "color-gray-light-alt",
-      "attributes": {
-        "category": "color",
-        "type": "gray",
-        "item": "light-alt"
-      },
-      "path": [
-        "gray",
-        "light-alt"
-      ]
-    },
-    "lighter": {
-      "value": "#d6d7d9",
-      "filePath": "tokens/color.json",
-      "isSource": true,
-      "original": {
-        "value": "#d6d7d9"
-      },
-      "name": "color-gray-lighter",
-      "attributes": {
-        "category": "color",
-        "type": "gray",
-        "item": "lighter"
-      },
-      "path": [
-        "gray",
-        "lighter"
-      ]
-    },
-    "lightest": {
-      "value": "#f1f1f1",
-      "filePath": "tokens/color.json",
-      "isSource": true,
-      "original": {
-        "value": "#f1f1f1"
-      },
-      "name": "color-gray-lightest",
+  "color": {
+    "white": {
+      "value": "#fff",
       "attributes": {
-        "category": "color",
-        "type": "gray",
-        "item": "lightest"
-      },
-      "path": [
-        "gray",
-        "lightest"
-      ]
+        "category": "color"
+      }
     },
-    "warm-dark": {
-      "value": "#494440",
-      "filePath": "tokens/color.json",
-      "isSource": true,
-      "original": {
-        "value": "#494440"
-      },
-      "name": "color-gray-warm-dark",
-      "attributes": {
-        "category": "color",
-        "type": "gray",
-        "item": "warm-dark"
-      },
-      "path": [
-        "gray",
-        "warm-dark"
-      ]
-    },
-    "warm-light": {
-      "value": "#e4e2e0",
-      "filePath": "tokens/color.json",
-      "isSource": true,
-      "original": {
-        "value": "#e4e2e0"
-      },
-      "name": "color-gray-warm-light",
-      "attributes": {
-        "category": "color",
-        "type": "gray",
-        "item": "warm-light"
-      },
-      "path": [
-        "gray",
-        "warm-light"
-      ]
-    },
-    "cool-light": {
-      "value": "#dce4ef",
-      "filePath": "tokens/color.json",
-      "isSource": true,
-      "original": {
-        "value": "#dce4ef"
-      },
-      "name": "color-gray-cool-light",
-      "attributes": {
-        "category": "color",
-        "type": "gray",
-        "item": "cool-light"
-      },
-      "path": [
-        "gray",
-        "cool-light"
-      ]
+    "gray": {
+      "*": {
+        "value": "#5b616b",
+        "filePath": "tokens/color.json",
+        "isSource": true,
+        "original": {
+          "value": "#5b616b"
+        },
+        "name": "color-gray",
+        "attributes": {
+          "category": "color",
+          "type": "gray",
+          "item": "*"
+        },
+        "path": [
+          "color",
+          "gray",
+          "*"
+        ]
+      },
+      "dark": {
+        "value": "#323a45",
+        "filePath": "tokens/color.json",
+        "isSource": true,
+        "original": {
+          "value": "#323a45"
+        },
+        "name": "color-gray-dark",
+        "attributes": {
+          "category": "color",
+          "type": "gray",
+          "item": "dark"
+        },
+        "path": [
+          "color",
+          "gray",
+          "dark"
+        ]
+      },
+      "medium": {
+        "value": "#757575",
+        "filePath": "tokens/color.json",
+        "isSource": true,
+        "original": {
+          "value": "#757575"
+        },
+        "name": "color-gray-medium",
+        "attributes": {
+          "category": "color",
+          "type": "gray",
+          "item": "medium"
+        },
+        "path": [
+          "color",
+          "gray",
+          "medium"
+        ]
+      },
+      "light": {
+        "value": "#aeb0b5",
+        "filePath": "tokens/color.json",
+        "isSource": true,
+        "original": {
+          "value": "#aeb0b5"
+        },
+        "name": "color-gray-light",
+        "attributes": {
+          "category": "color",
+          "type": "gray",
+          "item": "light"
+        },
+        "path": [
+          "color",
+          "gray",
+          "light"
+        ]
+      },
+      "light-alt": {
+        "value": "#eeeeee",
+        "filePath": "tokens/color.json",
+        "isSource": true,
+        "original": {
+          "value": "#eeeeee"
+        },
+        "name": "color-gray-light-alt",
+        "attributes": {
+          "category": "color",
+          "type": "gray",
+          "item": "light-alt"
+        },
+        "path": [
+          "color",
+          "gray",
+          "light-alt"
+        ]
+      },
+      "lighter": {
+        "value": "#d6d7d9",
+        "filePath": "tokens/color.json",
+        "isSource": true,
+        "original": {
+          "value": "#d6d7d9"
+        },
+        "name": "color-gray-lighter",
+        "attributes": {
+          "category": "color",
+          "type": "gray",
+          "item": "lighter"
+        },
+        "path": [
+          "color",
+          "gray",
+          "lighter"
+        ]
+      },
+      "lightest": {
+        "value": "#f1f1f1",
+        "filePath": "tokens/color.json",
+        "isSource": true,
+        "original": {
+          "value": "#f1f1f1"
+        },
+        "name": "color-gray-lightest",
+        "attributes": {
+          "category": "color",
+          "type": "gray",
+          "item": "lightest"
+        },
+        "path": [
+          "color",
+          "gray",
+          "lightest"
+        ]
+      },
+      "warm-dark": {
+        "value": "#494440",
+        "filePath": "tokens/color.json",
+        "isSource": true,
+        "original": {
+          "value": "#494440"
+        },
+        "name": "color-gray-warm-dark",
+        "attributes": {
+          "category": "color",
+          "type": "gray",
+          "item": "warm-dark"
+        },
+        "path": [
+          "color",
+          "gray",
+          "warm-dark"
+        ]
+      },
+      "warm-light": {
+        "value": "#e4e2e0",
+        "filePath": "tokens/color.json",
+        "isSource": true,
+        "original": {
+          "value": "#e4e2e0"
+        },
+        "name": "color-gray-warm-light",
+        "attributes": {
+          "category": "color",
+          "type": "gray",
+          "item": "warm-light"
+        },
+        "path": [
+          "color",
+          "gray",
+          "warm-light"
+        ]
+      },
+      "cool-light": {
+        "value": "#dce4ef",
+        "filePath": "tokens/color.json",
+        "isSource": true,
+        "original": {
+          "value": "#dce4ef"
+        },
+        "name": "color-gray-cool-light",
+        "attributes": {
+          "category": "color",
+          "type": "gray",
+          "item": "cool-light"
+        },
+        "path": [
+          "color",
+          "gray",
+          "cool-light"
+        ]
+      }
     }
   }
 }
diff --git a/yarn.lock b/yarn.lock
index a3b7e561..86e5a381 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2156,7 +2156,7 @@ __metadata:
   dependencies:
     "@babel/core": ^7.20.0
     "@babel/plugin-proposal-export-namespace-from": ^7.18.9
-    "@department-of-veterans-affairs/mobile-tokens": 0.0.7
+    "@department-of-veterans-affairs/mobile-tokens": 0.0.10
     "@expo/webpack-config": ^18.1.2
     "@os-team/i18next-react-native-language-detector": ^1.0.28
     "@react-native-async-storage/async-storage": ^1.19.0
@@ -2209,7 +2209,7 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@department-of-veterans-affairs/mobile-tokens@0.0.7, @department-of-veterans-affairs/mobile-tokens@workspace:packages/tokens":
+"@department-of-veterans-affairs/mobile-tokens@0.0.10, @department-of-veterans-affairs/mobile-tokens@workspace:packages/tokens":
   version: 0.0.0-use.local
   resolution: "@department-of-veterans-affairs/mobile-tokens@workspace:packages/tokens"
   dependencies: