@sumup-oss/[email protected]

Circuit UI v9 introduces a new typeface, more flexible typography APIs, and stable input components for colors, dates, and phone numbers. For upgrade instructions, refer to the migration guide.

Major Changes

• #2707 f8016eb Thanks @sirineJ! - Raised the minimum Node.js version to 20+.

• #2648 f583d05 Thanks @connor-baer! - Renamed the package scope from @sumup to @sumup-oss. Replace @sumup/circuit-ui with @sumup-oss/circuit-ui in your package.json file, then update all imports:

  -import { Button } from '@sumup/circuit-ui';
  +import { Button } from '@sumup-oss/circuit-ui';

  Circuit UI's ESLint plugin offers the renamed-package-scope rule to automate updating the package imports.

• #2648 f583d05 Thanks @connor-baer! - Upgraded to @sumup-oss/intl v3. If your app also depends on @sumup-oss/intl (previously called @sumup/intl), you need to upgrade it as well.

• #2711 a55b08a Thanks @connor-baer! - Added temporal-polyfill to the list of required peer dependencies.

• #2306 8be7f3b Thanks @connor-baer! - Deprecated the InputElement interface and narrowed the Input's element type to HTMLInputElement and the TextArea's element type to HTMLTextAreaElement. This affects refs and event handlers.

• #2713 00727aa Thanks @sirineJ! - Marked the Calendar component as stable. Update the related imports:

  - import { Calendar, CalendarProps, PlainDateRange } from '@sumup-oss/circuit-ui/experimental';
  + import { Calendar, CalendarProps, PlainDateRange } from '@sumup-oss/circuit-ui';

• #2731 a4b5d2c Thanks @sirineJ! - Marked the ColorInput and PhoneNumberInput components as stable. Update the related imports:

  - import { ColorInput, type ColorInputProps } from '@sumup-oss/circuit-ui/experimental';
  + import { ColorInput, type ColorInputProps } from '@sumup-oss/circuit-ui';

  - import { PhoneNumberInput, type PhoneNumberInputProps } from '@sumup-oss/circuit-ui/experimental';
  + import { PhoneNumberInput, type PhoneNumberInputProps } from '@sumup-oss/circuit-ui';

• #2743 12a201a Thanks @sirineJ! - Marked the Tooltip and Toggletip components as stable. Update the related imports:

  - import { Tooltip, type TooltipProps, type TooltipReferenceProps } from '@sumup-oss/circuit-ui/experimental';
  + import { Tooltip, type TooltipProps, type TooltipReferenceProps } from '@sumup-oss/circuit-ui';

  - import { Toggletip, type ToggletipProps } from '@sumup-oss/circuit-ui/experimental';
  + import { Toggletip, type ToggletipProps } from '@sumup-oss/circuit-ui';

• #2741 1251f90 Thanks @connor-baer! - Changed the PlainDateRange type from a tuple to an object with start and end properties. This affects the Calendar component's selection prop. Use the new updatePlainDateRange helper function to update a date range when a user selects a date.

• #2645 4f11234 Thanks @connor-baer! - Rewrote the DateInput component and replaced the native date input with a custom implementation to improve its usability and accessibility. The component now requires additional localized label props.

• #2677 4a2f1a6 Thanks @connor-baer! - Removed the legacy RangePicker, RangePickerController, SingleDayPicker, CalendarTag, and CalendarTagTwoStep components. Use the updated DateInput component instead.

• #2751 96df6fa Thanks @connor-baer! - Updated the PhoneNumberInput component to accept value and defaultValue props. The onChange callback is now called with an Event object instead of a string to mimic a native input.

• #2747 c7c2a10 Thanks @connor-baer! - Removed the Table component's deprecated initialSortedRow prop. Use the initialSortedColumn prop instead.

Minor Changes

• #2653 33435cf Thanks @connor-baer! - Renamed the Title component to Display for consistency with other platforms.

• #2653 33435cf Thanks @connor-baer! - Deprecated the SubHeadline component. Use the Headline component in size s instead.

• #2653 33435cf Thanks @connor-baer! - Deprecated the BodyLarge component. Use the Body component in size l instead.

• #2653 33435cf Thanks @connor-baer! - Added a new Compact component for text in space-constraint contexts.

• #2653 33435cf Thanks @connor-baer! - Added a new Numeral component for numeric content such as currency values.

• #2722 137a817 Thanks @sirineJ! - Added a new weight prop to the Display component. Choose between the regular, semibold, and bold font weights.

• #2653 33435cf Thanks @connor-baer! - Added a new weight prop to the Body component. Choose between the regular, semibold, and bold font weights.

• #2678 0652935 Thanks @connor-baer! - Added a new decoration prop to the Body component. Choose between the italic and strikethrough styles.

• #2653 33435cf Thanks @connor-baer! - Added a new color prop to the Body component. Choose any foreground color.

• #2653 33435cf Thanks @connor-baer! - Added an explicit foreground color to the Body component (fg-normal) to better support localized dark mode. Previously, the component inherited its color from its parent.

• #2653 33435cf Thanks [@connor-baer](https://github.com/...

@sumup-oss/[email protected]

Minor Changes

• #2743 12a201a Thanks @sirineJ! - Updated the component-lifecycle-imports ESLint rule to flag imports of stable components Tooltip and Toggletip from @sumup-oss/circuit-ui/experimental.

• #2731 a4b5d2c Thanks @sirineJ! - Updated the component-lifecycle-imports ESLint rule to handle imports of ColorInput and PhoneNumberInput as experimental components.

@sumup-oss/[email protected]

Patch Changes

• #2747 84091c5 Thanks @connor-baer! - Updated the design token values for headline-m-font-size, font-weight-semibold and font-weight-bold.

@sumup-oss/[email protected]

Major Changes

• #2741 1251f90 Thanks @connor-baer! - Changed the PlainDateRange type from a tuple to an object with start and end properties. This affects the Calendar component's selection prop. Use the new updatePlainDateRange helper function to update a date range when a user selects a date.

• #2731 a4b5d2c Thanks @sirineJ! - Marked the ColorInput and PhoneNumberInput components as stable. Update the related imports:

  - import { ColorInput, type ColorInputProps } from '@sumup-oss/circuit-ui/experimental';
  + import { ColorInput, type ColorInputProps } from '@sumup-oss/circuit-ui';

  - import { PhoneNumberInput, type PhoneNumberInputProps } from '@sumup-oss/circuit-ui/experimental';
  + import { PhoneNumberInput, type PhoneNumberInputProps } from '@sumup-oss/circuit-ui';

• #2677 4a2f1a6 Thanks @connor-baer! - Removed the legacy RangePicker, RangePickerController, SingleDayPicker, CalendarTag, and CalendarTagTwoStep components. Use the updated DateInput component instead.

• #2645 4f11234 Thanks @connor-baer! - Rewrote the DateInput component and replaced the native date input with a custom implementation to improve its usability and accessibility. The component now requires additional localized label props.

• #2743 12a201a Thanks @sirineJ! - Marked the Tooltip and Toggletip components as stable. Update the related imports:

  - import { Tooltip, type TooltipProps, type TooltipReferenceProps } from '@sumup-oss/circuit-ui/experimental';
  + import { Tooltip, type TooltipProps, type TooltipReferenceProps } from '@sumup-oss/circuit-ui';

  - import { Toggletip, type ToggletipProps } from '@sumup-oss/circuit-ui/experimental';
  + import { Toggletip, type ToggletipProps } from '@sumup-oss/circuit-ui';

@sumup-oss/[email protected]

Minor Changes

• #2735 70f3ab8 Thanks @connor-baer! - Expanded the renamed-package-scope ESLint rule to cover additional occurrences of package names such as in Jest module mocks.

Patch Changes

• #2735 70f3ab8 Thanks @connor-baer! - Fixed the no-renamed-props ESLint rule to add the as="strong" prop when migrating the Body's variant="highlight" prop to match the previous semantics.

@sumup-oss/[email protected]

Patch Changes

• #2737 c2c819c Thanks @connor-baer! - Fixed safely accessing environment variables in environments where the process variable is undefined.

@sumup-oss/[email protected]

Major Changes

• #2707 f8016eb Thanks @sirineJ! - Raised the minimum Node.js version to 20+.

Minor Changes

• #2717 0fb5dc0 Thanks @sirineJ! - Updated new typography design tokens names by removing the -typography infix.

@sumup-oss/[email protected]

Major Changes

• #2707 f8016eb Thanks @sirineJ! - Raised the minimum Node.js version to 20+.

@sumup-oss/[email protected]

Patch Changes

• #2732 5417c1b Thanks @connor-baer! - Guarded against similar names package names in the renamed-package-scope ESLint rule.

@sumup-oss/[email protected]

Major Changes

• #2728 2e6a4be Thanks @connor-baer! - Added missing rules for the Anchor and BodyLarge migrations.

• #2707 f8016eb Thanks @sirineJ! - Raised the minimum Node.js version to 20+.

Minor Changes

• #2713 00727aa Thanks @sirineJ! - Updated the component-lifecycle-imports ESLint rule to flag imports of stable entities from @sumup-oss/circuit-ui/experimental.

• #2717 0fb5dc0 Thanks @sirineJ! - Updated new typography design tokens names by removing the -typography infix.

• #2717 0fb5dc0 Thanks @sirineJ! - Introduced new sizes to the List component and deprecated old sizes. Updated no-renamed-props ESlint rule.