fix: Remove old tokens

[RayRedGoose]

Summary

Fixes: #3536

Release Category

Components

---

Checklist

• MDX documentation adheres to Canvas Kit's Documentation Guidelines
• Label ready for review has been added to PR

For the Reviewer

• PR title is short and descriptive
• PR summary describes the change (Fixes/Resolves linked correctly)
• PR Release Notes describes additional information useful to call out in a release message or removed if not applicable
• Breaking Changes provides useful information to upgrade to this code or removed if not applicable

Where Should the Reviewer Start?

Areas for Feedback? (optional)

• Code
• Documentation
• Testing
• Codemods

Testing Manually

Screenshots or GIFs (if applicable)

Thank You Gif (optional)

[Copilot]

Pull request overview

Removes deprecated @workday/canvas-kit-react/tokens usages (and some legacy style-props patterns) by migrating examples/components/docs to @workday/canvas-tokens-web tokens and the cs/stencil styling utilities.

Changes:

• Replaces deprecated token imports (colors, space, type, etc.) with system/base tokens and cs-based styling across stories/examples.
• Adds/propagates CSProps handling (e.g., Tooltip now consumes cs safely via handleCsProp) and updates related components to accept cs.
• Updates docs widgets/components to use new tokens and styling approach.

Reviewed changes

Copilot reviewed 33 out of 33 changed files in this pull request and generated 6 comments.

Show a summary per file

File	Description
utils/create-component/templates/react/component.content.js	Updates component generator template to use stencil/cs styling instead of deprecated tokens.
modules/react/tooltip/stories/examples/Ellipsis.tsx	Replaces deprecated spacing/width tokens with px2rem/cs usage.
modules/react/tooltip/lib/Tooltip.tsx	Adds CSProps support and routes cs through handleCsProp.
modules/react/toast/stories/examples/WithPopper.tsx	Replaces icon color token usage with system token via cs.
modules/react/toast/stories/examples/WithActionLinkAndCloseIcon.tsx	Replaces icon color token usage with system token via cs.
modules/react/toast/stories/examples/ToastAlert.tsx	Replaces icon color token usage with system token via cs.
modules/react/toast/stories/examples/RTL.tsx	Replaces icon color token usage with system token via cs.
modules/react/toast/spec/Toast.spec.tsx	Updates test to use system token via cs for icon color.
modules/react/tabs/stories/examples/SinglePanel.tsx	Migrates margin styling from deprecated tokens to system via cs.
modules/react/tabs/stories/examples/RightToLeft.tsx	Migrates margin styling to system and uses cssVar where needed.
modules/react/tabs/stories/examples/NamedTabs.tsx	Migrates margin styling to system and uses cssVar where needed.
modules/react/tabs/stories/examples/Icons.tsx	Migrates margin styling to system and uses cssVar where needed.
modules/react/tabs/stories/examples/HoistedModel.tsx	Migrates margin styling to system and uses cssVar where needed.
modules/react/tabs/stories/examples/DisabledTab.tsx	Migrates margin styling to system and uses cssVar where needed.
modules/react/tabs/stories/examples/Basic.tsx	Migrates margin styling to system and uses cssVar where needed.
modules/react/tabs/stories/examples/AlternativeTabStop.tsx	Migrates margin styling to system and uses cssVar where needed.
modules/react/status-indicator/stories/examples/MaxWidth.tsx	Replaces spacing token usage with system + cssVar.
modules/react/status-indicator/stories/examples/Emphasis.tsx	Removes unused React import, but still contains deprecated spacing tokens.
modules/react/skeleton/stories/examples/Simulation.tsx	Migrates layout/spacing/shape tokens to system and uses cs styling.
modules/react/skeleton/stories/examples/Shape.tsx	Migrates sizing/border-radius tokens to system via cs.
modules/react/skeleton/stories/examples/Color.tsx	Migrates colors/sizing to base/system via cs.
modules/react/skeleton/stories/examples/Basic.tsx	Migrates sizing/spacing to system via cs.
modules/react/skeleton/lib/parts/SkeletonText.tsx	Extends props with CSProps to support cs.
modules/react/popup/stories/visual-testing/Popper.stories.tsx	Migrates token styling to system + createStyles/cs.
modules/react/popup/lib/PopupCard.tsx	Replaces deprecated space token lookup with a system mapping.
modules/react/layout/stories/examples/Grid/GridCard.tsx	Migrates styling to system + createStyles/cs.
modules/react/button/stories/visual-testing/Hyperlink.stories.tsx	Migrates typography/colors to system via cs.
modules/react/action-bar/stories/visual-testing/testing.stories.tsx	Migrates colors/sizing to base/px2rem/cs.
modules/docs/lib/widgets/canvasColor.tsx	Switches docs color widget from deprecated tokens to base tokens.
modules/docs/lib/widgetUtils.tsx	Migrates syntax highlighting styles from deprecated tokens to stencils + system/base.
modules/docs/lib/Value.tsx	Migrates deprecated colors and some styling props to cs + system/base.
modules/docs/lib/Table.tsx	Replaces token-based styling props with stencil-based cs styling.
modules/docs/lib/DescriptionTooltip.tsx	Replaces token-based Tooltip styling with cs + system tokens.

Comments suppressed due to low confidence (1)

modules/react/status-indicator/stories/examples/Emphasis.tsx:9

• This example still uses deprecated tokens via space.xxs. Since this PR is about removing old tokens/style-props usage, this file should be migrated to system tokens (or cssVar(system.gap.*) depending on the styling API) and the @workday/canvas-kit-react/tokens import removed.

import styled from '@emotion/styled';

import {StatusIndicator} from '@workday/canvas-kit-react/status-indicator';
import {space} from '@workday/canvas-kit-react/tokens';

const StatusIndicators = styled('div')({
  '& > *': {
    margin: space.xxs,
  },

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[cypress]

Workday/canvas-kit    Run #10363

Run Properties:   Passed #10363  •  58ee1cd311 ℹ️: Merge cfc38b2d5411b60f81bdd1fa692b7f48a7bce2c9 into 38f5acd9f7b0edc8bc67bcd7b19c...

Project	Workday/canvas-kit
Branch Review	ISSUE3536-old-tokens-removal
Run status	Passed #10363
Run duration	02m 21s
Commit	58ee1cd311 ℹ️: Merge cfc38b2d5411b60f81bdd1fa692b7f48a7bce2c9 into 38f5acd9f7b0edc8bc67bcd7b19c...
Committer	Raisa Primerova
View all properties for this run ↗︎

---

Test results
Failures	0
Flaky	0
Pending	15
Skipped	0
Passing	802
View all changes introduced in this branch ↗︎

UI Coverage  19.36%
Untested elements	1531
Tested elements	365

Accessibility  99.38%
Failed rules	5 critical   5 serious   0 moderate   2 minor
Failed elements	72