Whats New Sage 200 2025 R2 - Web Amendability

New Components

No new components have been added in this release.

Removed Components

No components have been removed in this release.

Updated Components

Accordion

• buttonWidth prop has been removed
• buttonHeading prop has been removed
• scheme prop has been removed
• data-element prop has been added
• data-role prop has been added

AccordionGroup

• data-element prop has been added
• data-role prop has been added

Badge

• data-element prop has been added
• data-role prop has been added
• color prop has been modified
  • Description has changed from “Prop to specify the colour of the component” to “Prop to specify the color of the component”

Box

• tabIndex prop has been removed
• borderRadius prop has been modified
  • Description has changed from “Design Token for Border Radius. Note: please check that the border radius design token you are using is compatible with the Box component. This prop will not do anything if you have the roundedCornerOptOut flag set in the CarbonProvider” to “Design Token for Border Radius. Note: please check that the border radius design token you are using is compatible with the Box component.”

Button

• data-component prop has been removed
• isWhite prop has been added
• onClick prop has been modified
  • Type has changed from ((event: MouseEvent<HTMLAnchorElement | HTMLButtonElement, MouseEvent>) => void) | undefined to ((ev: MouseEvent<HTMLAnchorElement, MouseEvent> | MouseEvent<HTMLButtonElement, MouseEvent>) => void) | undefined
• onBlur prop has been modified
  • Type has changed from ((ev: FocusEvent<HTMLButtonElement, Element>) => void) | undefined to ((ev: FocusEvent<HTMLAnchorElement | HTMLButtonElement, Element>) => void) | undefined
• iconTooltipMessage prop has been modified
  • Description has changed from “Provides a tooltip message when the icon is hovered.” to “[Legacy] Provides a tooltip message when the icon is hovered.”
• iconTooltipPosition prop has been modified
  • Description has changed from “Provides positioning when the tooltip is displayed.” to “[Legacy] Provides positioning when the tooltip is displayed.”
• onFocus prop has been modified
  • Type has changed from ((ev: FocusEvent<HTMLButtonElement, Element>) => void) | undefined to ((ev: FocusEvent<HTMLAnchorElement | HTMLButtonElement, Element>) => void) | undefined
• onKeyDown prop has been modified
  • Type has changed from ((ev: KeyboardEvent<HTMLButtonElement>) => void) | undefined to ((ev: KeyboardEvent<HTMLAnchorElement | HTMLButtonElement>) => void) | undefined

ButtonMinor

• data-component prop has been removed
• isWhite prop has been added
• onClick prop has been modified
  • Type has changed from ((event: MouseEvent<HTMLAnchorElement | HTMLButtonElement, MouseEvent>) => void) | undefined to ((ev: MouseEvent<HTMLAnchorElement, MouseEvent> | MouseEvent<HTMLButtonElement, MouseEvent>) => void) | undefined
• onBlur prop has been modified
  • Type has changed from ((ev: FocusEvent<HTMLButtonElement, Element>) => void) | undefined to ((ev: FocusEvent<HTMLAnchorElement | HTMLButtonElement, Element>) => void) | undefined
• iconTooltipMessage prop has been modified
  • Description has changed from “Provides a tooltip message when the icon is hovered.” to “[Legacy] Provides a tooltip message when the icon is hovered.”
• iconTooltipPosition prop has been modified
  • Description has changed from “Provides positioning when the tooltip is displayed.” to “[Legacy] Provides positioning when the tooltip is displayed.”
• onFocus prop has been modified
  • Type has changed from ((ev: FocusEvent<HTMLButtonElement, Element>) => void) | undefined to ((ev: FocusEvent<HTMLAnchorElement | HTMLButtonElement, Element>) => void) | undefined
• onKeyDown prop has been modified
  • Type has changed from ((ev: KeyboardEvent<HTMLButtonElement>) => void) | undefined to ((ev: KeyboardEvent<HTMLAnchorElement | HTMLButtonElement>) => void) | undefined

Checkbox

• data-component prop has been removed
• helpAriaLabel prop has been modified
  • Description has changed from “Aria label for rendered help component” to “[Legacy] Aria label for rendered help component”
• tooltipPosition prop has been modified
  • Description has changed from “Overrides the default tooltip position” to “[Legacy] Overrides the default tooltip position”
• isOptional prop has been modified
  • Description has changed from “Flag to configure component as optional.” to “[Legacy] Flag to configure component as optional. @deprecated If the value of this component is not required, use the required prop and set it to false instead.”

Confirm

• data-component prop has been removed
• highlightVariant prop has been added
• restoreFocusOnClose prop has been added
• cancelButtonDataProps prop has been added
• confirmButtonDataProps prop has been added
• closeButtonDataProps prop has been added
• greyBackground prop has been added
• topModalOverride prop has been added
• size prop has been modified
  • Type has changed from "auto" | "large" | "small" | "medium" | "extra-small" | "medium-small" | "medium-large" | "extra-large" | undefined to "auto" | "large" | "small" | "medium" | "extra-small" | "medium-small" | "medium-large" | "extra-large" | "maximise" | undefined
• focusFirstElement prop has been modified
  • Type has changed from HTMLElement | CustomRefObject<HTMLElement> | null | undefined to HTMLElement | RefObject<HTMLElement> | null | undefined
• onCancel prop has been modified
  • Type has changed from ((ev: KeyboardEvent<HTMLElement> | MouseEvent<HTMLButtonElement, MouseEvent>) => void) | undefined to ((ev: React.KeyboardEvent<...> | MouseEvent<HTMLButtonElement, MouseEvent> | KeyboardEvent) => void) | undefined
• cancelButtonType prop has been modified

  • Description has changed from “Color variants for new business themes: “primary”

    “secondary”

    “tertiary”

    “dashed”

    “darkBackground”” to “Color variants for new business themes: “primary”

    “secondary”

    “tertiary”

    “darkBackground””

  • Type has changed from "primary" | "secondary" | "tertiary" | "dashed" | "darkBackground" | undefined to "primary" | "secondary" | "tertiary" | "darkBackground" | undefined
• confirmButtonType prop has been modified

  • Description has changed from “Color variants for new business themes: “primary”

    “secondary”

    “tertiary”

    “dashed”

    “darkBackground”” to “Color variants for new business themes: “primary”

    “secondary”

    “tertiary”

    “darkBackground””

  • Type has changed from "primary" | "secondary" | "tertiary" | "dashed" | "darkBackground" | undefined to "primary" | "secondary" | "tertiary" | "darkBackground" | undefined
• onConfirm prop has been modified
  • Type has changed from (ev: MouseEvent<HTMLButtonElement, MouseEvent>) => void to PreventRepeatsCallbackFunction

Content

• data-element prop has been added
• data-role prop has been added

Date

• data-component prop has been removed
• inputBorderRadius prop has been removed
• aria-describedby prop has been added
• tooltipId prop has been added
• validationMessagePositionTop prop has been added
• onPickerOpen prop has been added
• onPickerClose prop has been added
• dateFormatOverride prop has been added
• datePickerAriaLabel prop has been added
• datePickerAriaLabelledBy prop has been added
• fieldHelp prop has been modified
  • Description has changed from “Help content to be displayed under an input” to “[Legacy] Help content to be displayed under an input.”
• helpAriaLabel prop has been modified
  • Description has changed from “Aria label for rendered help component” to “[Legacy] Aria label for rendered help component.”
• isOptional prop has been modified
  • Description has changed from “Flag to configure component as optional.” to “[Legacy] Flag to configure component as optional. @deprecated If the value of this component is not required, use the required prop and set it to false instead.”
• validationOnLabel prop has been modified
  • Description has changed from “When true, validation icon will be placed on label instead of being placed on the input” to “[Legacy] When true, validation icon will be placed on label instead of being placed on the input.”
• ariaDescribedBy prop has been modified
  • Description has changed from “The id of the element that describe the input.” to “Set the ID of the input’s description. @deprecated Please use aria-describedby instead.”

Decimal

• data-component prop has been removed
• inputBorderRadius prop has been removed
• aria-describedby prop has been added
• tooltipId prop has been added
• validationMessagePositionTop prop has been added
• fieldHelp prop has been modified
  • Description has changed from “Help content to be displayed under an input” to “[Legacy] Help content to be displayed under an input.”
• labelSpacing prop has been modified
  • Description has changed from “Spacing between label and a field for inline label, given number will be multiplied by base spacing unit (8)” to “[Legacy] Spacing between label and a field for inline label, given number will be multiplied by base spacing unit (8).”
• labelInline prop has been modified
  • Description has changed from “When true label is inline” to “[Legacy] When true label is inline.”
• labelWidth prop has been modified
  • Description has changed from “Label width” to “[Legacy] Label width as a percentage when label is inline.”
• helpAriaLabel prop has been modified
  • Description has changed from “Aria label for rendered help component” to “[Legacy] Aria label for rendered help component.”
• tooltipPosition prop has been modified
  • Description has changed from “Overrides the default tooltip position” to “[Legacy] Overrides the default tooltip position.”
• isOptional prop has been modified
  • Description has changed from “Flag to configure component as optional.” to “[Legacy] Flag to configure component as optional. @deprecated If the value of this component is not required, use the required prop and set it to false instead.”
• validationOnLabel prop has been modified
  • Description has changed from “When true, validation icon will be placed on label instead of being placed on the input” to “[Legacy] When true, validation icon will be placed on label instead of being placed on the input.”
• ariaDescribedBy prop has been modified
  • Description has changed from “The id of the element that describe the input.” to “Set the ID of the input’s description. @deprecated Please use aria-describedby instead.”

Dialog

• className prop has been removed
• sizes prop has been added
• visible prop has been added
• highlightVariant prop has been added
• restoreFocusOnClose prop has been added
• gridApi prop has been added
• elementToRefocus prop has been added
• closeButtonDataProps prop has been added
• greyBackground prop has been added
• topModalOverride prop has been added
• disableFocusTrap prop has been added
• focusableSelectors prop has been added
• focusableContainers prop has been added
• timeout prop has been added
• disableAutoFocus prop has been added
• focusFirstElement prop has been added
• size prop has been modified
  • Type has changed from "auto" | "large" | "small" | "medium" | "extra-small" | "medium-small" | "medium-large" | "extra-large" | undefined to "auto" | "large" | "small" | "medium" | "extra-small" | "medium-small" | "medium-large" | "extra-large" | "maximise" | undefined
• onCancel prop has been modified
  • Type has changed from ((ev: KeyboardEvent<HTMLElement> | MouseEvent<HTMLButtonElement, MouseEvent>) => void) | undefined to ((clientApi?: ClientApiType | { ev: KeyboardEvent<HTMLElement> | MouseEvent<HTMLButtonElement, MouseEvent>; } | undefined) => void) | undefined

DialogFullscreen

• data-component prop has been removed
• restoreFocusOnClose prop has been added
• closeButtonDataProps prop has been added
• topModalOverride prop has been added
• focusableSelectors prop has been added
• focusableContainers prop has been added
• timeout prop has been added
• enableBackgroundUI prop has been added
• disableClose prop has been added
• disableAutoFocus prop has been added
• focusFirstElement prop has been added
• contentRef prop has been added
• onCancel prop has been modified
  • Type has changed from ((ev: KeyboardEvent<HTMLElement> | MouseEvent<HTMLButtonElement, MouseEvent>) => void) | undefined to ((clientApi?: ClientApiType | { ev: KeyboardEvent<HTMLElement> | MouseEvent<HTMLButtonElement, MouseEvent>; } | undefined) => void) | undefined
• pagesStyling prop has been modified
  • Description has changed from “For legacy styling when used with Pages component. Do not use this unless using Pages within a DialogFullScreen” to “@deprecated For legacy styling when used with Pages component. Do not use this unless using Pages within a DialogFullScreen”

Form

• data-element prop has been added
• data-role prop has been added
• footerChildren prop has been added
• stickyFooterVariant prop has been added

Grid

• columns prop has been modified
  • Type has changed from ColumnProps[] to S200Columns<TData>
• rowDragManaged prop has been modified
  • Description has changed from “Set to true to enable Managed Row Dragging.” to “Set to true to enable Managed Row Dragging. @agModule RowDragModule”
• quickFilterText prop has been modified
  • Description has changed from “Rows are filtered using this text as a Quick Filter.” to “Rows are filtered using this text as a Quick Filter. Only supported for Client-Side Row Model. @agModule QuickFilterModule”

GridColumn

• suppressMenu prop has been removed
• suppressCellFlash prop has been removed
• suppressHeaderMenuButton prop has been added
• controlClassProps prop has been modified
  • Type has changed from BaseSelectProps | undefined to BaseSelectProps<any> | undefined
• iconType prop has been modified
  • Type has changed from "filter" | "error" | "info" | "warning" | "none" | "chevron_down" | "chevron_down_thick" | "dropdown" | "grid" | "target" | "accessibility_web" | "add" | "admin" | "alert" | "alert_on" | ... 257 more ... | undefined to "filter" | "error" | "info" | "warning" | "none" | "chevron_down" | "chevron_down_thick" | "dropdown" | "grid" | "target" | "accessibility_web" | "add" | "admin" | "airplay" | ... 281 more ... | undefined
• onClick prop has been modified
  • Type has changed from ((e: KeyboardEvent<HTMLButtonElement> | MouseEvent<HTMLButtonElement, MouseEvent>) => void) | undefined to ((e: MouseEvent<HTMLButtonElement, MouseEvent> | KeyboardEvent<HTMLButtonElement>) => void) | undefined
• width prop has been modified
  • Description has changed from “Initial width in pixels for the cell.” to “Initial width in pixels for the cell. If no width or flex properties set, cell width will default to 200 pixels.”
• flex prop has been modified
  • Description has changed from “Used instead of width when the goal is to fill the remaining empty space of the grid.” to “Equivalent to flex-grow in CSS. When flex is set on one or more columns, any width value is ignored and instead the remaining free space in the grid is divided among flex columns in proportion to their flex value, so a column with flex: 2 will be twice the size as one with flex: 1.”
• headerTooltip prop has been modified
  • Description has changed from “Tooltip for the column header” to “Tooltip for the column header @agModule TooltipModule”
• autoHeight prop has been modified
  • Description has changed from “Set to true to have the grid calculate the height of a row based on contents of this column.” to “Set to true to have the grid calculate the height of a row based on contents of this column. @agModule RowAutoHeightModule”
• enableCellChangeFlash prop has been modified
  • Description has changed from “Set to true to flash a cell when it’s refreshed.” to “Set to true to flash a cell when it’s refreshed. @agModule HighlightChangesModule”

GridContainer

• data-element prop has been added
• data-role prop has been added

GridItem

• data-element prop has been added
• data-role prop has been added

Heading

• data-component prop has been removed
• backLink prop has been modified
  • Type has changed from string | ((ev: KeyboardEvent<HTMLButtonElement> | MouseEvent<HTMLButtonElement, MouseEvent> | MouseEvent<...> | KeyboardEvent<...>) => void) | undefined to string | ((ev: MouseEvent<HTMLAnchorElement, MouseEvent> | MouseEvent<HTMLButtonElement, MouseEvent> | KeyboardEvent<...> | KeyboardEvent<...>) => void) | undefined

Help

• className prop has been removed
• data-element prop has been added
• data-role prop has been added

Hr

• aria-hidden prop has been added
• height prop has been added
• data-element prop has been added
• data-role prop has been added

Icon

• data-element prop has been added
• data-role prop has been added
• tooltipMessage prop has been modified
  • Description has changed from “The message to be displayed within the tooltip” to “[Legacy] The message to be displayed within the tooltip”
• type prop has been modified
  • Type has changed from "filter" | "error" | "info" | "warning" | "none" | "chevron_down" | "chevron_down_thick" | "dropdown" | "grid" | "target" | "accessibility_web" | "add" | "admin" | "alert" | "alert_on" | ... 256 more ... | "messages" to "filter" | "error" | "info" | "warning" | "none" | "chevron_down" | "chevron_down_thick" | "dropdown" | "grid" | "target" | "accessibility_web" | "add" | "admin" | "airplay" | ... 280 more ... | "messages"
• tooltipPosition prop has been modified
  • Description has changed from “The position to display the tooltip” to “[Legacy] The position to display the tooltip”
• tooltipBgColor prop has been modified
  • Description has changed from “Override background color of the Tooltip, provide any color from palette or any valid css color value.” to “[Legacy] Override background color of the Tooltip, provide any color from palette or any valid css color value.”
• tooltipFontColor prop has been modified
  • Description has changed from “Override font color of the Tooltip, provide any color from palette or any valid css color value.” to “[Legacy] Override font color of the Tooltip, provide any color from palette or any valid css color value.”
• tooltipFlipOverrides prop has been modified
  • Description has changed from “Overrides the default flip behaviour of the Tooltip” to “[Legacy] Overrides the default flip behaviour of the Tooltip”
• tooltipId prop has been modified
  • Description has changed from “Id passed to the tooltip container, used for accessibility purposes” to “[Legacy] Id passed to the tooltip container, used for accessibility purposes”
• tooltipVisible prop has been modified
  • Description has changed from “Control whether the tooltip is visible” to “[Legacy] Control whether the tooltip is visible”

IconButton

• data-element prop has been added
• data-role prop has been added
• onClick prop has been modified
  • Type has changed from ((e: KeyboardEvent<HTMLButtonElement> | MouseEvent<HTMLButtonElement, MouseEvent>) => void) | undefined to ((e: MouseEvent<HTMLButtonElement, MouseEvent>) => void) | undefined

Image

• data-element prop has been added
• data-role prop has been added

Link

• className prop has been removed
• placeholderTabIndex prop has been removed
• data-element prop has been added
• data-role prop has been added
• onMouseDown prop has been modified
  • Type has changed from ((ev: MouseEvent<HTMLButtonElement, MouseEvent> | MouseEvent<HTMLAnchorElement, MouseEvent>) => void) | undefined to ((ev: MouseEvent<HTMLAnchorElement, MouseEvent> | MouseEvent<HTMLButtonElement, MouseEvent>) => void) | undefined
• tooltipPosition prop has been modified
  • Description has changed from “Positions the tooltip with the link.” to “[Legacy] Positions the tooltip with the link.”
• tooltipMessage prop has been modified
  • Description has changed from “A message to display as a tooltip to the link.” to “[Legacy] A message to display as a tooltip to the link.”

List

• wordBreak prop has been added

ListItem

• variant prop has been removed
• textOverflow prop has been added
• listStyleType prop has been added
• wordBreak prop has been added

LoaderBar

• data-component prop has been removed

MenuMultiActionButton

• position prop has been added
• isWhite prop has been added
• size prop has been modified
  • Description has changed from “The size of the buttons in the SplitButton.” to “The size of the buttons.”
• data-element prop has been modified
  • Description has changed from “A custom value for the data-element attribute” to “Identifier used for testing purposes, applied to the root element of the component.”
• data-role prop has been modified
  • Description has changed from “A custom value for the data-role attribute” to “Identifier used for testing purposes, applied to the root element of the component.”
• text prop has been modified
  • Description has changed from “The text to be displayed in the SplitButton.” to “The text to be displayed in the main button.”

Message

• className prop has been removed
• width prop has been added
• data-element prop has been added
• data-role prop has been added
• title prop has been modified
  • Description has changed from “set message title” to “Set message title”
• children prop has been modified
  • Description has changed from “set content to component” to “Set the component’s content”
• variant prop has been modified
  • Description has changed from “set type of message based on new DLS standard” to “Set the component’s variant”
• transparent prop has been modified
  • Description has changed from “set background to be invisible” to “Set transparent styling”
• showCloseIcon prop has been modified
  • Description has changed from “determines if the close icon is shown” to “Flag to determine if the close button is rendered”
• open prop has been modified
  • Description has changed from “show message component” to “Flag to determine if the message is rendered”
• closeButtonAriaLabel prop has been modified
  • Description has changed from “set custom aria label for message close button” to “Set custom aria-label for component’s close button”
• onDismiss prop has been modified
  • Description has changed from “function runs when user click dismiss button” to “Callback triggered on dismiss”
  • Type has changed from ((e: KeyboardEvent<HTMLButtonElement> | MouseEvent<HTMLButtonElement, MouseEvent>) => void) | undefined to ((e: MouseEvent<HTMLButtonElement, MouseEvent> | KeyboardEvent<HTMLButtonElement>) => void) | undefined

MultiActionButton

• position prop has been added
• isWhite prop has been added
• size prop has been modified
  • Description has changed from “The size of the buttons in the SplitButton.” to “The size of the buttons.”
• data-element prop has been modified
  • Description has changed from “A custom value for the data-element attribute” to “Identifier used for testing purposes, applied to the root element of the component.”
• data-role prop has been modified
  • Description has changed from “A custom value for the data-role attribute” to “Identifier used for testing purposes, applied to the root element of the component.”
• text prop has been modified
  • Description has changed from “The text to be displayed in the SplitButton.” to “The text to be displayed in the main button.”

Number

• data-component prop has been removed
• inputBorderRadius prop has been removed
• aria-describedby prop has been added
• tooltipId prop has been added
• validationMessagePositionTop prop has been added
• fieldHelp prop has been modified
  • Description has changed from “Help content to be displayed under an input” to “[Legacy] Help content to be displayed under an input.”
• labelSpacing prop has been modified
  • Description has changed from “Spacing between label and a field for inline label, given number will be multiplied by base spacing unit (8)” to “[Legacy] Spacing between label and a field for inline label, given number will be multiplied by base spacing unit (8).”
• labelInline prop has been modified
  • Description has changed from “When true label is inline” to “[Legacy] When true label is inline.”
• labelWidth prop has been modified
  • Description has changed from “Label width” to “[Legacy] Label width as a percentage when label is inline.”
• helpAriaLabel prop has been modified
  • Description has changed from “Aria label for rendered help component” to “[Legacy] Aria label for rendered help component.”
• tooltipPosition prop has been modified
  • Description has changed from “Overrides the default tooltip position” to “[Legacy] Overrides the default tooltip position.”
• isOptional prop has been modified
  • Description has changed from “Flag to configure component as optional.” to “[Legacy] Flag to configure component as optional. @deprecated If the value of this component is not required, use the required prop and set it to false instead.”
• validationOnLabel prop has been modified
  • Description has changed from “When true, validation icon will be placed on label instead of being placed on the input” to “[Legacy] When true, validation icon will be placed on label instead of being placed on the input.”
• ariaDescribedBy prop has been modified
  • Description has changed from “The id of the element that describe the input.” to “Set the ID of the input’s description. @deprecated Please use aria-describedby instead.”

Pill

• onDelete prop has been modified
  • Type has changed from ((ev?: KeyboardEvent<HTMLButtonElement> | MouseEvent<HTMLButtonElement, MouseEvent> | undefined) => void) | undefined to ((ev?: MouseEvent<HTMLButtonElement, MouseEvent> | KeyboardEvent<HTMLButtonElement> | undefined) => void) | undefined

Pod

• className prop has been removed
• variant prop has been modified
  • Type has changed from "transparent" | "primary" | "secondary" | "tertiary" | "tile" | undefined to "primary" | "secondary" | "tertiary" | "transparent" | "tile" | undefined

ProgressTracker

• aria-label prop has been removed
• aria-describedby prop has been removed
• aria-valuenow prop has been removed
• aria-valuemin prop has been removed
• aria-valuemax prop has been removed
• aria-valuetext prop has been removed
• showDefaultLabels prop has been removed
• data-element prop has been added
• data-role prop has been added
• progress prop has been modified
  • Type has changed from number | undefined to number
  • Prop is now mandatory
• error prop has been modified
  • Description has changed from “If error occurs.” to “Flag to control error state.”
• description prop has been modified
  • Description has changed from “Flag to control whether the default value labels (as percentages) should be rendered.” to “Value to add a description to the label”
  • Type has changed from string | undefined to string
  • Prop is now mandatory
• currentProgressLabel prop has been modified
  • Type has changed from string | undefined to string
  • Prop is now mandatory
• maxProgressLabel prop has been modified
  • Type has changed from string | undefined to string
  • Prop is now mandatory
• labelsPosition prop has been modified
  • Description has changed from “The position the value label are rendered in. Top/bottom apply to horizontal and left applies to vertical orientation.” to “The position the value label are rendered in.”
• labelWidth prop has been modified
  • Description has changed from “Label width” to “Label width when position is “left””

RadioButton

• data-component prop has been removed
• helpAriaLabel prop has been modified
  • Description has changed from “Aria label for rendered help component” to “[Legacy] Aria label for rendered help component”
• tooltipPosition prop has been modified
  • Description has changed from “Overrides the default tooltip position” to “[Legacy] Overrides the default tooltip position”
• isOptional prop has been modified
  • Description has changed from “Flag to configure component as optional.” to “[Legacy] Flag to configure component as optional. @deprecated If the value of this component is not required, use the required prop and set it to false instead.”

RadioButtonGroup

• data-element prop has been added
• data-role prop has been added
• validationMessagePositionTop prop has been added
• inline prop has been modified
  • Description has changed from “When true, RadioButtons are in line” to “When true, RadioButtons children are in line”
• tooltipPosition prop has been modified
  • Description has changed from “Overrides the default tooltip position” to “[Legacy] Overrides the default tooltip position”
• isOptional prop has been modified
  • Description has changed from “Flag to configure component as optional.” to “[Legacy] Flag to configure component as optional. @deprecated If the value of this component is not required, use the required prop and set it to false instead.”
• legend prop has been modified
  • Description has changed from “The content for the RadioGroup Legend” to “The content for the RadioButtonGroup Legend”
• legendHelp prop has been modified
  • Description has changed from “The content for the hint text of the RadioGroup Legend” to “The content for the RadioButtonGroup hint text, will only be rendered when validationRedesignOptIn is true.”
• legendAlign prop has been modified
  • Description has changed from “Text alignment of legend when inline” to “[Legacy] Text alignment of legend when inline”
• legendInline prop has been modified
  • Description has changed from “When true, legend is placed in line with the radiobuttons” to “[Legacy] When true, legend is placed in line with the RadioButtons”
• legendSpacing prop has been modified
  • Description has changed from “Spacing between legend and field for inline legend, number multiplied by base spacing unit (8)” to “[Legacy] Spacing between legend and field for inline legend, number multiplied by base spacing unit (8)”
• legendWidth prop has been modified
  • Description has changed from “Percentage width of legend (only when legend is inline)” to “[Legacy] Percentage width of legend (only when legend is inline)”

Redirect

• to prop has been modified

  • Description has changed from “For links within the Sage 200 Single Page Application. Can be a string or an object. To link to an external page, use the href prop if the component provides it.

    • A string representation of the Link location, created by concatenating the location’s pathname, search, and hash properties.
    • An object that can have any of the following properties:
    • pathname: A string representing the path to link to.
    • search: A string representation of query parameters.
    • hash: A hash to put in the URL, e.g. #a-hash.
    • state: State to persist to the location.

    Pass an array to the routeParams prop to replace values in any string (even if you use the object form).” to “For links within the Sage 200 Single Page Application. Can be a string or an object. To link to an external page, use the href prop if the component provides it.

    • A string representation of the Link location, created by concatenating the location’s pathname, search, and hash properties.
    • An object that can have any of the following properties:
      • pathname: A string representing the path to link to.
      • search: A string representation of query parameters.
      • hash: A hash to put in the URL, e.g. #a-hash.
      • state: State to persist to the location.

    Pass an array to the routeParams prop to replace values in any string (even if you use the object form).”

  • Type has changed from string | { pathname: string; search?: string | undefined; hash?: string | undefined; state?: { [key: string]: any; } | undefined; } | undefined to LocationDescriptor<unknown>
  • Prop is now mandatory

SplitButton

• position prop has been added
• isWhite prop has been added
• size prop has been modified
  • Description has changed from “The size of the buttons in the SplitButton.” to “The size of the buttons.”
• data-element prop has been modified
  • Description has changed from “A custom value for the data-element attribute” to “Identifier used for testing purposes, applied to the root element of the component.”
• data-role prop has been modified
  • Description has changed from “A custom value for the data-role attribute” to “Identifier used for testing purposes, applied to the root element of the component.”
• text prop has been modified
  • Description has changed from “The text to be displayed in the SplitButton.” to “The text to be displayed in the main button.”

Tab

• className prop has been removed
• data-element prop has been added
• data-role prop has been added
• visible prop has been modified
  • Default value has changed from null to true
• updateErrors prop has been modified
  • Type has changed from ((id: string, errors: Record<string, string | boolean>) => void) | undefined to ((id: string, errors: Record<string, string | boolean | undefined>) => void) | undefined
• updateWarnings prop has been modified
  • Type has changed from ((id: string, warnings: Record<string, string | boolean>) => void) | undefined to ((id: string, warnings: Record<string, string | boolean | undefined>) => void) | undefined
• updateInfos prop has been modified
  • Type has changed from ((id: string, infos: Record<string, string | boolean>) => void) | undefined to ((id: string, infos: Record<string, string | boolean | undefined>) => void) | undefined

Tabs

• className prop has been removed
• data-element prop has been added
• data-role prop has been added
• visible prop has been added
• id prop has been modified
  • Type has changed from string to string | undefined
  • Prop is no longer mandatory

Textarea

• data-component prop has been removed
• minHeight prop has been added
• aria-describedby prop has been added
• validationMessagePositionTop prop has been added
• fieldHelp prop has been modified
  • Description has changed from “Help content to be displayed under an input” to “[Legacy] Help content to be displayed under an input”
• labelSpacing prop has been modified
  • Description has changed from “Spacing between label and a field for inline label, given number will be multiplied by base spacing unit (8)” to “[Legacy] Spacing between label and a field for inline label, given number will be multiplied by base spacing unit (8)”
• labelInline prop has been modified
  • Description has changed from “When true, label is placed in line an input” to “[Legacy] When true, label is placed in line an input”
• labelWidth prop has been modified
  • Description has changed from “Width of a label in percentage. Works only when labelInline is true” to “[Legacy] Width of a label in percentage. Works only when labelInline is true”
• helpAriaLabel prop has been modified
  • Description has changed from “Aria label for rendered help component” to “[Legacy] Aria label for rendered help component”
• tooltipPosition prop has been modified
  • Description has changed from “Overrides the default tooltip position” to “[Legacy] Overrides the default tooltip position”
• inputWidth prop has been modified
  • Description has changed from “Width of an input in percentage. Works only when labelInline is true” to “[Legacy] Width of an input in percentage. Works only when labelInline is true”
• isOptional prop has been modified
  • Description has changed from “Flag to configure component as optional” to “[Legacy] Flag to configure component as optional. @deprecated If the value of this component is not required, use the required prop and set it to false instead.”
• validationOnLabel prop has been modified
  • Description has changed from “When true, validation icon will be placed on label instead of being placed on the input” to “[Legacy] When true, validation icon will be placed on label instead of being placed on the input”
• ariaDescribedBy prop has been modified
  • Description has changed from “The id of the element that describe the input.” to “Set the ID of the input’s description. @deprecated Please use aria-describedby instead.”
• labelAlign prop has been modified
  • Description has changed from “Inline label alignment” to “Label alignment”
• rows prop has been modified
  • Description has changed from “The number of visible text lines for the control” to “The number of visible text lines for the control. When set, this determines the height of the textarea, and the minHeight property is ignored.”

Textbox

• data-component prop has been removed
• inputBorderRadius prop has been removed
• aria-describedby prop has been added
• tooltipId prop has been added
• validationMessagePositionTop prop has been added
• onBlurChange prop has been added
• fieldHelp prop has been modified
  • Description has changed from “Help content to be displayed under an input” to “[Legacy] Help content to be displayed under an input.”
• labelSpacing prop has been modified
  • Description has changed from “Spacing between label and a field for inline label, given number will be multiplied by base spacing unit (8)” to “[Legacy] Spacing between label and a field for inline label, given number will be multiplied by base spacing unit (8).”
• labelInline prop has been modified
  • Description has changed from “When true label is inline” to “[Legacy] When true label is inline.”
• labelWidth prop has been modified
  • Description has changed from “Label width” to “[Legacy] Label width as a percentage when label is inline.”
• helpAriaLabel prop has been modified
  • Description has changed from “Aria label for rendered help component” to “[Legacy] Aria label for rendered help component.”
• tooltipPosition prop has been modified
  • Description has changed from “Overrides the default tooltip position” to “[Legacy] Overrides the default tooltip position.”
• isOptional prop has been modified
  • Description has changed from “Flag to configure component as optional.” to “[Legacy] Flag to configure component as optional. @deprecated If the value of this component is not required, use the required prop and set it to false instead.”
• validationOnLabel prop has been modified
  • Description has changed from “When true, validation icon will be placed on label instead of being placed on the input” to “[Legacy] When true, validation icon will be placed on label instead of being placed on the input.”
• ariaDescribedBy prop has been modified
  • Description has changed from “The id of the element that describe the input.” to “Set the ID of the input’s description. @deprecated Please use aria-describedby instead.”
• labelAlign prop has been modified
  • Description has changed from “Inline label alignment” to “Label alignment”

Time

• labelAlign prop has been added
• validationMessagePositionTop prop has been added
• fieldLabelsAlign prop has been added
• id prop has been modified
  • Default value has changed from time to null
• onBlur prop has been modified
  • Type has changed from ((e: TransformedBlurEvent) => void) | undefined to ((e: TransformedBlurEvent, value?: TimeValue | undefined) => void) | undefined
• isOptional prop has been modified
  • Description has changed from “Flag to configure component as optional” to “[Legacy] Flag to configure component as optional. @deprecated If the value of this component is not required, use the required prop and set it to false instead.”

Toast

• className prop has been removed
• data-component prop has been removed
• isCenter prop has been removed
• data-element prop has been added
• data-role prop has been added
• variant prop has been modified
  • Description has changed from “Customizes the appearance in the DLS theme” to “Sets Toast variant”
• onDismiss prop has been modified
  • Type has changed from ((ev?: React.KeyboardEvent<...> | MouseEvent<HTMLButtonElement, MouseEvent> | KeyboardEvent | undefined) => void) | undefined to ((ev?: MouseEvent<HTMLButtonElement, MouseEvent> | KeyboardEvent | React.KeyboardEvent<...> | undefined) => void) | undefined

Typography

• textOverflow prop has been added
• listStyleType prop has been added
• wordBreak prop has been added

VerticalDivider

• data-element prop has been added
• data-role prop has been added
• aria-hidden prop has been added