feat(#2953): Icon button component design tokens for v2

[twjeffery]

Summary

Adds V2 design tokens for the Icon Button component, updating padding values for medium and large sizes, improving semantic token reuse for focus states, and maintaining full V1 backwards compatibility.

Changes

New Component Tokens

Icon Button Component (20 tokens total)

Spacing Tokens (Size-specific padding)

• icon-button-small-padding: {space.2xs} (4px) - explicit small size
• icon-button-medium-padding: {space.xs} (8px) - Updated from 4px
• icon-button-large-padding: {space.s} (12px) - Updated from 8px

Border Radius Tokens (V1 compatibility + V2)

• icon-button-border-radius: {borderRadius.m} (8px) - V2 reference
• icon-button-medium-border-radius: {borderRadius.m} (8px) - V1
  backwards compatibility
• icon-button-large-border-radius: {borderRadius.xl} (8px) - V1
  backwards compatibility

Focus State Tokens (Semantic reuse)

• icon-button-focus-border-width: {input.borderWidth.focus} -
  References Input for consistency
• icon-button-focus-border-color: {input.color.border.focus} -
  References Input for consistency

Color Tokens (Variant-specific, 12 tokens)

• Default variant: default-color, default-hover-color,
  default-hover-color-bg, default-disabled-color
• Light variant: light-color, light-hover-color-bg (Updated to
  greyscale.600), light-disabled-color
• Dark variant: dark-color, dark-hover-color-bg,
  dark-disabled-color
• Destructive variant: destructive-color,
  destructive-hover-color-bg, destructive-disabled-color (Updated to
  greyscale.500)

Key V2 Changes

Padding Updates:

• Medium buttons: 4px → 8px (more spacious)
• Large buttons: 8px → 12px (better visual hierarchy)
• Small buttons: 4px (unchanged)

Color Updates:

• Light variant hover background: greyscale.700 → greyscale.600 (lighter)
• All disabled states now use greyscale.500 (consistent across variants)

Semantic Reuse:

• Focus tokens now reference {input.borderWidth.focus} and
  {input.color.border.focus} for design system-wide consistency
• All interactive components now share the same focus treatment

Backwards Compatibility:

• Restored V1 tokens (medium-border-radius, large-border-radius) for fallback chains
• V1 environments continue using original token packages with original values
• Token-Only classification: no component code changes needed

Related

• Parent issue: Design system 2.0 coded component update ui-components#2998
• Component issue: Icon Button 2.0 Update ui-components#2953
• UI Components PR for Icon Button
• V2 Figma component