@salt-ds/[email protected]

Patch Changes

• b0e390c: RadioButton

  Removed RadioButtonBase and replaced with RadioButton
  Removed icon prop; icon is not customizable any more.
  Added inputProps prop to be passed to the radio input.
  Added error prop for error state styling.

  RadioButtonGroup

  Removed icon prop; icon is not customizable any more.
  Removed legend prop; will be implemented by FormField.
  Removed radios prop; should be the users' responsibility to provide the nested RadioButtons as children.
  Replaced row prop with direction prop.
  Added wrap prop.

  RadioButtonIcon

  Added error prop for error state styling.
  Added disabled prop for disabled state styling.

@salt-ds/[email protected]

Minor Changes

• 974c92d: - New characteristics introduced in accent, new palette token

  + --salt-accent-background-disabled: var(--salt-palette-accent-background-disabled);
  + --salt-palette-accent-background-disabled

  • New characteristics introduced in selectable, new palette tokens

  + --salt-selectable-foreground: var(--salt-palette-interact-foreground);
  + --salt-selectable-foreground-disabled: var(--salt-palette-interact-foreground-disabled);
  + --salt-selectable-foreground-hover: var(--salt-palette-interact-foreground-hover);
  + --salt-selectable-foreground-selected: var(--salt-palette-interact-foreground-active);
  + --salt-selectable-foreground-selectedDisabled: var(--salt-palette-interact-foreground-activeDisabled);
  + --salt-palette-interact-foreground-active
  + --salt-palette-interact-foreground-activeDisabled
  + --salt-palette-interact-foreground-hover

  Updated values in light mode

  - --salt-palette-interact-foreground: var(--salt-color-gray-900);
  + --salt-palette-interact-foreground: var(--salt-color-gray-200);
  - --salt-palette-interact-foreground-disabled: var(--salt-color-gray-900-fade-foreground);
  + --salt-palette-interact-foreground-disabled: var(--salt-color-gray-200-fade-foreground);
  - --salt-palette-interact-foreground-hover: var(--salt-color-gray-500);
  + --salt-palette-interact-foreground-hover: var(--salt-color-blue-500);

  Updated values in dark mode

  - --salt-palette-interact-foreground: var(--salt-color-white);
  + --salt-palette-interact-foreground: var(--salt-color-gray-90);
  - --salt-palette-interact-foreground-disabled: var(--salt-color-white-fade-foreground);
  + --salt-palette-interact-foreground-disabled: var(--salt-color-gray-90-fade-foreground);
  - --salt-palette-interact-foreground-hover: var(--salt-color-gray-500);
  + --salt-palette-interact-foreground-hover: var(--salt-color-blue-500);

  • Deprecated the following selectable tokens, use --salt-text-primary-foreground and --salt-text-primary-foreground-disabled as replacements

  - --salt-selectable-cta-foreground
  - --salt-selectable-cta-foreground-disabled
  - --salt-selectable-primary-foreground
  - --salt-selectable-primary-foreground-disabled
  - --salt-selectable-secondary-foreground
  - --salt-selectable-secondary-foreground-disabled
  - --salt-selectable-foreground-partial
  - --salt-selectable-foreground-partialDisabled

  • Measured characteristic replaced with Track

  Deprecated tokens prefixed by --salt-measured- and corresponding palette tokens
  New --salt-track- tokens and corresponding palette tokens

  The following measured tokens are a direct replacement mapping to track tokens:

  - --salt-measured-borderStyle
  - --salt-measured-borderStyle-active
  - --salt-measured-borderStyle-complete
  - --salt-measured-borderStyle-incomplete
  + --salt-track-borderStyle
  + --salt-track-borderStyle-active
  + --salt-track-borderStyle-complete
  + --salt-track-borderStyle-incomplete
  - --salt-measured-borderWidth
  - --salt-measured-borderWidth-active
  - --salt-measured-borderWidth-complete
  - --salt-measured-borderWidth-incomplete
  + --salt-track-borderWidth
  + --salt-track-borderWidth-active
  + --salt-track-borderWidth-complete
  + --salt-track-borderWidth-incomplete
  - --salt-measured-fontWeight
  - --salt-measured-textAlign
  + --salt-track-fontWeight
  + --salt-track-textAlign
  - --salt-measured-background: var(--salt-palette-measured-background);
  - --salt-measured-background-disabled: var(--salt-palette-measured-background-disabled);
  - --salt-measured-borderColor: var(--salt-palette-measured-border);
  + --salt-track-background: var(--salt-palette-track-background);
  + --salt-track-background-disabled: var(--salt-palette-track-background-disabled);
  + --salt-track-borderColor: var(--salt-palette-track-border);
  + --salt-track-borderColor-disabled: var(--salt-palette-track-border-disabled);
  - --salt-palette-measured-background
  - --salt-palette-measured-background-disabled
  - --salt-palette-measured-border
  - --salt-palette-measured-border-disabled
  + --salt-palette-track-background
  + --salt-palette-track-background-disabled
  + --salt-palette-track-border
  + --salt-palette-track-border-disabled

  The following measured tokens should be replaced with the corresponding selectable tokens, e.g. --salt-measured-foreground goes to --salt-selectable-foreground, --salt-measured-foreground-activeDisabled goes to --salt-selectable-foreground-selectedDisabled*:

  • This applies for all examples, replace with the stated token and the reflected state suffix as appropriate

  - --salt-measured-foreground: var(--salt-palette-measured-foreground);
  - --salt-measured-foreground-disabled: var(--salt-palette-measured-foreground-disabled);
  - --salt-measured-foreground-hover: var(--salt-palette-measured-foreground-active);
  - --salt-measured-foreground-active: var(--salt-palette-measured-foreground-active);
  - --salt-measured-foreground-activeDisabled: var(--salt-palette-measured-foreground-activeDisabled);
  - --salt-measured-borderColor-disabled: var(--salt-palette-measured-border-disabled);

  The following measured-fill tokens should be replaced with accent-background tokens:

  - --salt-measured-fill: var(--salt-palette-measured-fill);
  - --salt-measured-fill-disabled: var(--salt-palette-measured-fill-disabled);

  • Usages of measured tokens in core and labs components updated to use appropriate characteristic replacement

  • Deprecated the following tokens:

  The following palette-measured tokens should be replaced with palette-accent tokens:

  - --salt-palette-measured-fill
  - --salt-palette-measured-fill-disabled

  The following palette-measured-foreground tokens should be replaced with palette-interact-foreground tokens:

  - --salt-palette-measured-foreground-active
  - --salt-palette-measured-foreground-activeDisabled

  The following partial tokens are no longer part of the design system. Consider replacing any usages with the --salt-palette-interact-foreground-active and --salt-palette-interact-foreground-activeDisabled state tokens respectively, or whatever best suits your usage.

  - --salt-palette-interact-foreground-partial
  - --salt-palette-interact-foreground-partialDisabled

• a483ca9: Added new basis prop to FlexItem to control flex-basis

@salt-ds/[email protected]

Patch Changes

• 0c478a6: Fix fonts not being published in the ag-grid-theme

@salt-ds/[email protected]

Minor Changes

• 974c92d: - New characteristics introduced in accent, new palette token

  + --salt-accent-background-disabled: var(--salt-palette-accent-background-disabled);
  + --salt-palette-accent-background-disabled

  • New characteristics introduced in selectable, new palette tokens

  + --salt-selectable-foreground: var(--salt-palette-interact-foreground);
  + --salt-selectable-foreground-disabled: var(--salt-palette-interact-foreground-disabled);
  + --salt-selectable-foreground-hover: var(--salt-palette-interact-foreground-hover);
  + --salt-selectable-foreground-selected: var(--salt-palette-interact-foreground-active);
  + --salt-selectable-foreground-selectedDisabled: var(--salt-palette-interact-foreground-activeDisabled);
  + --salt-palette-interact-foreground-active
  + --salt-palette-interact-foreground-activeDisabled
  + --salt-palette-interact-foreground-hover

  Updated values in light mode

  - --salt-palette-interact-foreground: var(--salt-color-gray-900);
  + --salt-palette-interact-foreground: var(--salt-color-gray-200);
  - --salt-palette-interact-foreground-disabled: var(--salt-color-gray-900-fade-foreground);
  + --salt-palette-interact-foreground-disabled: var(--salt-color-gray-200-fade-foreground);
  - --salt-palette-interact-foreground-hover: var(--salt-color-gray-500);
  + --salt-palette-interact-foreground-hover: var(--salt-color-blue-500);

  Updated values in dark mode

  - --salt-palette-interact-foreground: var(--salt-color-white);
  + --salt-palette-interact-foreground: var(--salt-color-gray-90);
  - --salt-palette-interact-foreground-disabled: var(--salt-color-white-fade-foreground);
  + --salt-palette-interact-foreground-disabled: var(--salt-color-gray-90-fade-foreground);
  - --salt-palette-interact-foreground-hover: var(--salt-color-gray-500);
  + --salt-palette-interact-foreground-hover: var(--salt-color-blue-500);

  • Deprecated the following selectable tokens, use --salt-text-primary-foreground and --salt-text-primary-foreground-disabled as replacements

  - --salt-selectable-cta-foreground
  - --salt-selectable-cta-foreground-disabled
  - --salt-selectable-primary-foreground
  - --salt-selectable-primary-foreground-disabled
  - --salt-selectable-secondary-foreground
  - --salt-selectable-secondary-foreground-disabled
  - --salt-selectable-foreground-partial
  - --salt-selectable-foreground-partialDisabled

  • Measured characteristic replaced with Track

  Deprecated tokens prefixed by --salt-measured- and corresponding palette tokens
  New --salt-track- tokens and corresponding palette tokens

  The following are a direct replacement mapping:

  - --salt-measured-borderStyle
  - --salt-measured-borderStyle-active
  - --salt-measured-borderStyle-complete
  - --salt-measured-borderStyle-incomplete
  + --salt-track-borderStyle
  + --salt-track-borderStyle-active
  + --salt-track-borderStyle-complete
  + --salt-track-borderStyle-incomplete
  - --salt-measured-borderWidth
  - --salt-measured-borderWidth-active
  - --salt-measured-borderWidth-complete
  - --salt-measured-borderWidth-incomplete
  + --salt-track-borderWidth
  + --salt-track-borderWidth-active
  + --salt-track-borderWidth-complete
  + --salt-track-borderWidth-incomplete
  - --salt-measured-fontWeight
  - --salt-measured-textAlign
  + --salt-track-fontWeight
  + --salt-track-textAlign
  - --salt-measured-background: var(--salt-palette-measured-background);
  - --salt-measured-background-disabled: var(--salt-palette-measured-background-disabled);
  - --salt-measured-borderColor: var(--salt-palette-measured-border);
  + --salt-track-background: var(--salt-palette-track-background);
  + --salt-track-background-disabled: var(--salt-palette-track-background-disabled);
  + --salt-track-borderColor: var(--salt-palette-track-border);
  + --salt-track-borderColor-disabled: var(--salt-palette-track-border-disabled);
  - --salt-palette-measured-background
  - --salt-palette-measured-background-disabled
  - --salt-palette-measured-border
  - --salt-palette-measured-border-disabled
  + --salt-palette-track-background
  + --salt-palette-track-background-disabled
  + --salt-palette-track-border
  + --salt-palette-track-border-disabled

  The following should be replaced with the corresponding selectable tokens:

  - --salt-measured-foreground: var(--salt-palette-measured-foreground);
  - --salt-measured-foreground-disabled: var(--salt-palette-measured-foreground-disabled);
  - --salt-measured-foreground-hover: var(--salt-palette-measured-foreground-active);
  - --salt-measured-foreground-active: var(--salt-palette-measured-foreground-active);
  - --salt-measured-foreground-activeDisabled: var(--salt-palette-measured-foreground-activeDisabled);
  - --salt-measured-borderColor-disabled: var(--salt-palette-measured-border-disabled);

  The following should be replaced with the corresponding accent background tokens:

  - --salt-measured-fill: var(--salt-palette-measured-fill);
  - --salt-measured-fill-disabled: var(--salt-palette-measured-fill-disabled);

  • Usages of measured tokens in core and labs components updated to use appropriate characteristic replacement

  • Deprecated the following tokens, no replacement needed:

  - --salt-measured-foreground-undo
  - --salt-palette-measured-fill
  - --salt-palette-measured-fill-disabled
  - --salt-palette-measured-foreground-active
  - --salt-palette-measured-foreground-activeDisabled
  - --salt-palette-interact-foreground-partial
  - --salt-palette-interact-foreground-partialDisabled

• f1b7a60: - Add colorName to Color. When Color is set to a color in the Salt color palette colorName will be set to the color's name.

  • Fix colors with an alpha value of 0 not being correctly recognized by isTransparent

Patch Changes

• b0e390c: RadioButton

  Removed RadioButtonBase and replaced with RadioButton
  Removed icon prop; icon is not customizable any more.
  Added inputProps prop to be passed to the radio input.
  Added error prop for error state styling.

  RadioButtonGroup

  Removed icon prop; icon is not customizable any more.
  Removed legend prop; will be implemented by FormField.
  Removed radios prop; should be the users' responsibility to provide the nested RadioButtons as children.
  Replaced row prop with direction prop.
  Added wrap prop.

  RadioButtonIcon

  Added error prop for error state styling.
  Added disabled prop for disabled state styling.

@salt-ds/[email protected]

Minor Changes

• d460fb7: Deprecated --salt-size-detail; replaced with --salt-size-compact

• 5ead0bb: Deprecated --salt-size-selection; replaced with --salt-size-selectable

• 2e0fdff: Deprecated --salt-size-graphic-small, --salt-size-graphic-medium, --salt-size-graphic-large
  Deprecated --salt-size-divider-height, --salt-size-divider-strokeWidth, replaced with --salt-size-separator-height, --salt-size-separator-strokeWidth

• 9d3dda9: Theme update: changed the value of --salt-palette-warning-border and --salt-palette-warning-foreground to --salt-color-orange-700 in light mode to fix accessibility issues

• 649d539: Added a new opacity token for readonly backgrounds

  - --salt-color-white-fade-background-readonly: rgba(255, 255, 255, var(--salt-palette-opacity-readonly));
  - --salt-color-gray-20-fade-background-readonly: rgba(234, 237, 239, var(--salt-palette-opacity-readonly));
  - --salt-color-gray-600-fade-background-readonly: rgba(47, 49, 54, var(--salt-palette-opacity-readonly));
  - --salt-color-gray-800-fade-background-readonly: rgba(36, 37, 38, var(--salt-palette-opacity-readonly));
  + --salt-palette-opacity-background-readonly: var(--salt-opacity-1)
  + --salt-color-white-fade-background-readonly: rgba(255, 255, 255, var(--salt-palette-opacity-background-readonly));
  + --salt-color-gray-20-fade-background-readonly: rgba(234, 237, 239, var(--salt-palette-opacity-background-readonly));
  + --salt-color-gray-600-fade-background-readonly: rgba(47, 49, 54, var(--salt-palette-opacity-background-readonly));
  + --salt-color-gray-800-fade-background-readonly: rgba(36, 37, 38, var(--salt-palette-opacity-background-readonly));

• e33f561: Theme update: changed the value of --salt-palette-success-border and --salt-palette-success-foreground to --salt-color-green-400 in dark mode to fix accessibility issues

• d975171: Deprecated --salt-size-brandBar; replaced with --salt-size-accent with new density dependent values

• 9cae606: Deprecated differential characteristic; replaced tokens with below
  Moved differential tokens to status characteristic
  Added 'static' status variant

  - --salt-differential-positive-foreground
  - --salt-differential-negative-foreground
  + --salt-status-positive-foreground
  + --salt-status-negative-foreground
  + --salt-status-static-foreground

• 1f579da: Added tokens for success, warning, and error backgrounds on selected state

  + --salt-status-success-background-selected
  + --salt-status-warning-background-selected
  + --salt-status-error-background-selected
  + --salt-palette-success-background-selected
  + --salt-palette-warning-background-selected
  + --salt-palette-error-background-selected

Patch Changes

• 8e9446b: Fixed the shadow token value

  - --salt-shadow-5: 0 12px 40px 5px var(--salt-shadow-5-color);
  + --salt-shadow-5: 0 12px 40px 0 var(--salt-shadow-5-color);

• 1ad02da: Deprecated --salt-overlayable-shadow-scroll-color, use --salt-shadow-1-color instead

@salt-ds/[email protected]

Patch Changes

• 1ad02da: Deprecated --salt-overlayable-shadow-scroll-color, use --salt-shadow-1-color instead

@salt-ds/[email protected]

Minor Changes

• 242941c: Move Avatar from lab to core

• 9cae606: Deprecated differential characteristic; replaced tokens with below
  Moved differential tokens to status characteristic
  Added 'static' status variant

  - --salt-differential-positive-foreground
  - --salt-differential-negative-foreground
  + --salt-status-positive-foreground
  + --salt-status-negative-foreground
  + --salt-status-static-foreground

Patch Changes

• 8b58e28: Fix AriaAnnouncer not removing announced text from the DOM

@salt-ds/[email protected]

Patch Changes

• 50370de: Fixed some icons that were overridden incorrectly
• 982da8e: Fix ag-grid uitk theme floating filter input height in High density

@salt-ds/[email protected]

Minor Changes

• 2e0fdff: Deprecated --salt-size-graphic-small, --salt-size-graphic-medium, --salt-size-graphic-large
  Deprecated --salt-size-divider-height, --salt-size-divider-strokeWidth, replaced with --salt-size-separator-height, --salt-size-separator-strokeWidth

• 242941c: Move Avatar from lab to core

• 9cae606: Deprecated differential characteristic; replaced tokens with below
  Moved differential tokens to status characteristic
  Added 'static' status variant

  - --salt-differential-positive-foreground
  - --salt-differential-negative-foreground
  + --salt-status-positive-foreground
  + --salt-status-negative-foreground
  + --salt-status-static-foreground

@salt-ds/[email protected]

Minor Changes

• afe5782: Add text background color for highlighted text globally and on Text component

• 1e69cf3: Move Tooltip from lab to core
  Move useFloatingUI from lab to core

• b1c5c32: Move Spinner from lab to core

• 88673e4: Add disabled prop to Text component

• 598991f: Move SplitLayout from lab to core
  Changes in SplitLayout

  • Removed FlexItem wraps around SplitLayout children.
  • SplitLayout uses startItem and endItem props as children to allow for direction.
  • Added direction prop to SplitLayout.
  • Remove wrap since SplitLayout has direction to control wrap by breakpoints.
  • End Aligned endItem so the element is always at the end of the layout.