@adobe/spectrum-tokens@13.0.0-beta.56

Minor Changes

• #463 1ae8051 Thanks @mrcjhicks! - Added a component-size-maximum-perspective-down token, which defines that components larger than 96px would appear to scale down more.

  Design Motivation

  This token is used in larger components that support a down state that scales, like the select box.

  Token Diff

  Added (1)

  • component-size-maximum-perspective-down

@adobe/spectrum-tokens@13.0.0-beta.55

Minor Changes

• #461 2f90bff Thanks @mrcjhicks! - Added two new tokens for color wheel border. One for color and one for opacity.

  Token Diff

  Added (2)

  • color-wheel-border-opacity
  • color-wheel-border-color

@adobe/token-diff-generator@1.3.0

Minor Changes

• #443 b371af5 Thanks @mrcjhicks! - Format and output command line options added.

  Options:
    -otv, --old-token-version <oldVersion>  indicates which github tag to pull old tokens from
    -ntv, --new-token-version <newVersion>  indicates which github tag to pull new tokens from
    -otb, --old-token-branch <oldBranch>    indicates which branch to fetch old token data from
    -ntb, --new-token-branch <newBranch>    indicates which branch to fetch updated token data from
    -tn, --token-names <tokens...>          indicates specific tokens to compare
    -l, --local <path>                      indicates to compare to local data
    -r, --repo <name>                       github repository to target
    -gak, --githubAPIKey <key>              github api key to use
    -f, --format <format>                   cli (default) or markdown
    -o, --output <path>                     file path to store diff output
    -d, --debug <path>                      file path to store diff json
    -h, --help                              display help for command
  

@adobe/spectrum-tokens@13.0.0-beta.54

Minor Changes

• #457 a923472 Thanks @mrcjhicks! - ## Design Motivation

  • Updated desktop and mobile values for checkbox-control-size-[size] and checkbox-top-to-control-[size] tokens
  • Made token changes required for the S2 action bar update

  Tokens Diff

  Tokens Changed (10)

  Added (2)

  • action-bar-minimum-width
  • action-bar-label-to-action-group-area

  Updated (8)

  Updated Properties (8)

  • checkbox-control-size-small
    • desktop.value: 12px -> 14px
    • mobile.value: 16px -> 18px
  • checkbox-control-size-medium
    • desktop.value: 14px -> 16px
    • mobile.value: 18px -> 20px
  • checkbox-control-size-large
    • desktop.value: 16px -> 18px
    • mobile.value: 20px -> 22px
  • checkbox-control-size-extra-large
    • desktop.value: 18px -> 20px
    • mobile.value: 22px -> 26px
  • checkbox-top-to-control-small
    • desktop.value: 6px -> 5px
    • mobile.value: 7px -> 6px
  • checkbox-top-to-control-medium
    • desktop.value: 9px -> 8px
    • mobile.value: 11px -> 10px
  • checkbox-top-to-control-large
    • desktop.value: 12px -> 11px
    • mobile.value: 15px -> 14px
  • checkbox-top-to-control-extra-large
    • desktop.value: 15px -> 14px
    • mobile.value: 19px -> 17px

0.0.0-s2-foundations-20241121221506

S2 Foundations non-gray-800 colors update

Token Diff

Tokens Changed (18)

0.0.0-s2-foundations-20241021172855 -> tokens-sync/patch-foundations-from-main

Token Name	Original Value	New Value
blue-800 (sets.dark.value)	rgb(69, 110, 254)	rgb(64, 105, 253)
red-800 (sets.dark.value)	rgb(230, 54, 35)	rgb(223, 52, 34)
orange-800 (sets.dark.value)	rgb(205, 86, 0)	rgb(199, 82, 0)
yellow-800 (sets.dark.value)	rgb(169, 110, 0)	rgb(164, 106, 0)
chartreuse-800 (sets.dark.value)	rgb(109, 131, 0)	rgb(106, 127, 0)
celery-800 (sets.dark.value)	rgb(69, 138, 19)	rgb(66, 134, 18)
green-800 (sets.dark.value)	rgb(6, 140, 82)	rgb(6, 136, 80)
seafoam-800 (sets.dark.value)	rgb(8, 138, 116)	rgb(8, 134, 112)
cyan-800 (sets.dark.value)	rgb(15, 128, 194)	rgb(13, 125, 186)
indigo-800 (sets.dark.value)	rgb(119, 97, 252)	rgb(116, 91, 252)
purple-800 (sets.dark.value)	rgb(161, 84, 229)	rgb(157, 78, 228)
fuchsia-800 (sets.dark.value)	rgb(192, 64, 212)	rgb(186, 60, 206)
magenta-800 (sets.dark.value)	rgb(231, 41, 105)	rgb(224, 38, 101)
pink-800 (sets.dark.value)	rgb(220, 47, 156)	rgb(213, 45, 151)
turquoise-800 (sets.dark.value)	rgb(9, 135, 147)	rgb(9, 131, 142)
brown-800 (sets.dark.value)	rgb(148, 118, 73)	rgb(143, 114, 69)
silver-800 (sets.dark.value)	rgb(123, 123, 123)	rgb(118, 118, 118)
cinnamon-800 (sets.dark.value)	rgb(179, 103, 64)	rgb(176, 98, 59)

@adobe/spectrum-tokens@13.0.0-beta.53

Minor Changes

• #446 dbc5398 Thanks @PaliwalSparsh! - Added S2 Treeview tokens

  Token Diff

  Tokens added (27):

  • tree-view-disclosure-indicator-height
  • tree-view-disclosure-indicator-width
  • tree-view-minimum-height
  • tree-view-minimum-width
  • tree-view-bottom-to-label
  • tree-view-drag-handle-to-checkbox
  • tree-view-edge-to-checkbox
  • tree-view-edge-to-drag-handle
  • tree-view-end-edge-to-action-area
  • tree-view-header-to-item
  • tree-view-item-to-header
  • tree-view-item-to-item
  • tree-view-item-to-item-detached
  • tree-view-label-to-action-area
  • tree-view-level-increment
  • tree-view-minimum-top-to-context-area
  • tree-view-top-to-action-button
  • tree-view-top-to-checkbox
  • tree-view-top-to-disclosure-indicator
  • tree-view-top-to-drag-handle
  • tree-view-top-to-label
  • tree-view-selected-row-background-opacity-emphasized
  • tree-view-selected-row-background-opacity-emphasized-hover
  • tree-view-row-background-hover
  • tree-view-selected-row-background-color-emphasized
  • tree-view-selected-row-background-default
  • tree-view-selected-row-background-hover

@adobe/spectrum-tokens@13.0.0-beta.52

Patch Changes

• #444 51904cd Thanks @marissahuysentruyt! - fixing a typo with takeover-dialog-height

  Token Diff

  Updated Token (1):

  • takeover-dialog-height: 1.00% -> 100%

@adobe/spectrum-tokens@13.0.0-beta.51

Patch Changes

• #441 89949e4 Thanks @GarthDB! - Change takeover dialog dimensions to use percentages which were previously converted to ems by mistake.

  Token Diff

  Updated Tokens (2):

  • takeover-dialog-height: 1.00em -> 1.00%
  • takeover-dialog-width: 1.00em -> 1.00%

@adobe/spectrum-tokens@0.0.0-s2-foundations-20241021172855

Changed corner rounding to match a simplified s2 strategy

Token Diff

Newly Deprecated Tokens (21):

• corner-radius-300
• corner-radius-400
• corner-radius-500
• corner-radius-600
• corner-radius-700
• corner-radius-800
• corner-radius-1000
• corner-radius-small-default
• corner-radius-medium-default
• corner-radius-large-default
• corner-radius-extra-large-default
• corner-radius-full
• corner-radius-small-size-small
• corner-radius-small-size-medium
• corner-radius-small-size-large
• corner-radius-small-size-extra-large
• corner-radius-medium-size-extra-small
• corner-radius-medium-size-small
• corner-radius-medium-size-medium
• corner-radius-medium-size-large
• corner-radius-medium-size-extra-large

Updated Tokens (3):

• corner-radius-75: 3px -> 4px
• corner-radius-100: 4px -> 8px
• corner-radius-200: 5px -> 10px

@adobe/token-diff-generator@1.2.0

Minor Changes

• 254ba19 Thanks @GarthDB! - minor fixes to diff tool comparisons